/*---------------------------------------------------------------
Index Header
---------------------------------------------------------------*/
.index_header
{
    width:100%;
    height:640px;
    /*background-image: url(/assets/images/bg_top.png);*/
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    background: transparent;
}

.index_header .inner
{
    position:relative;
    max-width: 1680px;
    height:640px;
    margin:0 auto;
}

.index_text
{
    position:absolute;
    bottom:50px;
    left:50px;
}

.index_logo
{
    position:absolute;
    top:50px;
    left:50px;
}



/*---------------------------------------------------------------
index part
---------------------------------------------------------------*/
.index_img_template
{
    position: relative;
    height:740px;
    padding-bottom:100px;
}

.caption
{
    position:absolute;
    top:20px;
    left:0px;
    width:400px;
    background-color:rgba(255, 255, 255, 0.8);
    padding:40px;
    z-index: 10;
}


.img_template_01
{
    width:80%;
    height:640px;
    position: absolute;
    top:0;
    right:0;
    background-image: url(/assets/images/bg_index_01.jpg);
    background-size: cover;
    background-repeat:none;
    background-position: center;
    z-index:0;
}

.img_template_02
{
    width:80%;
    height:640px;
    position: absolute;
    top:0;
    right:0;
    background-image: url(/assets/images/bg_index_02.jpg);
    background-size: cover;
    background-repeat:none;
    background-position: center;
    z-index:0;
}


.caption p
{
    width:80%;
    padding-top:20px;
    padding-bottom:20px;
}

.index_btn
{
    display: block;
    border:1px solid #565654;
    width:80%;
    font-size: 1.5rem;
    text-align: center;
    padding:5px 0;
}


/*---------------------------------------------------------------
information
---------------------------------------------------------------*/
.information
{
    max-width:1680px;
    margin:0 auto;
    padding:0 40px;
}

.information h2
{
    padding:20px 0 20px;
}

.information .box
{
    display: table;
    float:left;
    width:50%;
    padding-bottom: 40px;
}

.information .box .date
{
    display: table-cell;
    width:100px;
}

.information .box .date .year
{
    font-size:1.5rem;
}

.information .box .date .day
{
    font-size:2rem;
}

.information .box .contents
{
    width:auto;
    display: table-cell;
}

.information .box .contents .infobar
{
    background-color: #451722;
    width:200px;
    text-align: center;
    color:#FFF;
    padding:5px 0;
}

.information .box .contents .text
{
    padding:5px 0;
}

h2 .link
{
    font-size: 1rem;
    font-weight: normal;
}


.info-box {
    position: relative;
    height: 80px;
    width: 50%;
}
.info-title {
    position: absolute;
    left: 6rem;
    top: 2.5rem;
}
.info-category {
    position: absolute;
    top: 0;
    left: 6rem;
    background-color: #451722;
    width: 30%!important;
    color: #fff;
    text-align: center;
    display: block;
}
.info-day {
    font-size: 1.5rem;
    position: absolute;
    top: 1.5rem;
    left: 2.5rem;
}
.info-month {
    font-size: 1.5rem;
    position: absolute;
    top: 1.5rem;
}
.info-year {
    font-size: 1.5rem;
    position: absolute;
    top: 0;
    left: 0.5rem;
}

.info-category ul,
.info-category ul li
{
    display: inline!important;
}

.elementor-grid
{
    grid-row-gap:1rem!important;
}

/*---------------------------------------------------------------
bisiness_overview
---------------------------------------------------------------*/
.bisiness_overview
{
    padding:100px 0 200px;
    max-width:1680px;
    margin:0 auto;
}

.bisiness_overview h2
{
    font-size:3rem;
    text-align: center
}

.bisiness_overview .header_caption
{
    padding-top:20px;
    text-align: center;
}

ul.business_block
{
    padding:40px 0 40px;
    width:1024px;
    margin:0 auto;
}

ul.business_block li
{
    float:left;
    width:33%;
}

.image_block
{
    width:300px;
    height:225px;
    border-radius: 10px;
}

.skincare .image_block        {background-image:url(/wp-content/uploads/elementor/thumbs/0218efccfa565d4d2ee80984bd2a639e-q06zelp7i5ypgyva54ucqw1zu4vaeret870p0dii7s.png); background-size: contain;}
.gene-repair .image_block      {background-image:url(/wp-content/uploads/2025/05/gene-repair.png); background-size: cover;}
.pharmaceuticals .image_block {background-image:url(/wp-content/uploads/elementor/thumbs/24708370_s-q06yf7422thw5qaovtw8ttoybndkh6uscyea960cl4.jpeg); background-size: cover;}

ul.business_block li a
{
    display: block;
    padding-top:10px;
    font-size:1.5rem;
}

.center_btn
{
    display: block;
    margin:0 auto;
    width:30%;
    padding:10px 0;
    text-align: center;
    border:1px solid #565654;
    font-size: 1.5rem;
}


/*---------------------------------------------------------------
Tablet
---------------------------------------------------------------*/
@media all and (min-width: 768px) and (max-width: 1024px)
{ 
    
}

/*---------------------------------------------------------------
Smart phone
---------------------------------------------------------------*/
@media (max-width: 767px) 
{ 
    /*========= information ===============*/
    .index_logo
    {
        position: static;
        text-align: center;
        padding-top:200px;
        margin-bottom:20px;
    }
    
    .index_text
    {
        position: static;
        text-align: center;
        padding-bottom:150px;
    }
    
    .img_template_01
    {
        position: relative;
        width:100%;
        background-image:url(/assets/images/bg_sp_index_01.jpg);
    }
    
    .img_template_02
    {
        position: relative;
        width:100%;
    }
    
    .caption
    {
        width:100%;
        height:100%;
        margin:0 auto;
        display: block;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        padding-top:20px;
    }
    
    .index_btn
    {
        margin:0 auto;
    }
    
    /*========= information ===============*/
    .information
    {
        padding: 0;
        width:90%;
        margin:0 auto;
    }
    
    .box .contents
    {
        padding-left:10px;
    }
    
    .infobar
    {
        font-size: 0.8rem;
    }
    
    .information .box
    {
        width:100%;
    }
    
    .information .box .date
    {
        width:80px;
    }
    
    /*========= business overview ===============*/
    .bisiness_overview
    {
        width:90%;
        margin:0 auto;
        padding-top:80px;
        padding-bottom:100px;
    }
    
    ul.business_block li
    {
        clear: both;
        margin:0 auto;
        text-align: center;
        width:100%;
    }
    
    ul.business_block 
    {
        width: 80%;
        margin: 0 auto;
    }
    
    .center_btn
    {
        width:80%;
    }
    
    ul.business_block li a
    {
        width:100%;
        text-align: center;
        padding-bottom:20px;
    }
    
    .image_block
    {
        width:100%;
        height:150px;
    }
    
    .info-box {
        width: 70%;
        font-size:1rem;
    }
    .info-category {
        width: 80%!important;
        font-size:1rem;
        top:10px;
    }
    
    .elementor-heading-title 
    {
        line-height: 140%!important;
    }
    
    elementor-heading-title 
    {
        line-height: 140%;
    }
    
    h2
    {
        line-height:140%;
    }
}