@charset "UTF-8";
/* CSS Document */


/* -------------------------------- PC版のスタイルここから ------------------------------------*/

@media print, screen and (min-width: 751px) {
    
 
/* プログラム */
    .wellness-program-wrap{
        width: 100%;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        -webkit-align-items: flex-start;
        -webkit-box-lines: multiple;
        -moz-box-lines: multiple;
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-bottom: 0;
        padding: 0;
    }
    
    .wellness-program-wrap li{
        width: 48.5%;
        margin-left: 3%;
        margin-bottom: 32px;
    }
    
    .wellness-program-wrap li:nth-child(2n+1){
        margin-left: 0;
    }
    
    .wellness-program-wrap li:nth-child(2n):nth-last-child(-n+3) ~ li{
        margin-bottom: 0;
    }
    
    .wellness-program-item{
        margin: 0;
    }
    
    .wellness-program-item .img-box{
        width: 100%;
        margin: 0 0 16px 0;
    }
    
    .wellness-program-item .img-box img{
        width: 100%;
    }
    
    .wellness-program-item .txt-box{
        width: 100%;
        margin: 0;
    }
    
    .wellness-program-item .txt-box h5{
        margin: 0 0 8px 0;
        font-size: 20px;
        line-height: 26px;
        font-weight: bold;
    }
    
    .wellness-program-item .txt-box p{
        margin: 0 0 8px 0;
        font-size: 16px;
        line-height: 26px;
    }
    
    .wellness-program-item .txt-box dl{
        margin: 0;
        width: 100%;
        display: -moz-box;
        display: -ms-flexbox;
         display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        -webkit-align-items: flex-start;
    }
    
    .wellness-program-item .txt-box dl+dl{
        margin-top: 0;
    }
    
    .wellness-program-item .txt-box dl dt{
        width: 20%;
        margin: 0;
        font-size: 16px;
        line-height: 26px;
        font-weight: normal;
    }
    
    .wellness-program-item .txt-box dl dd{
        width: 78%;
        margin: 0 0 0 2%;
        font-size: 16px;
        line-height: 26px;
        font-weight: normal;
    }
    
/* コラム */
    
    .wellness-column-list{
        width: 100%;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        -webkit-align-items: flex-start;
        margin-top: 40px;
        margin-bottom: 40px;
        padding: 0;
    }
    
    .wellness-column-list li{
        width: 32%;
        margin-bottom: 0;
    }
    
    .wellness-column-list li+li{
        margin-left: 2%;
    }
    
    .wellness-column-list li a:hover figcaption{
        color: #1D315A;
    }
    
    .wellness-column-list li figure{
        margin-bottom: 0;
    }
    
    .wellness-column-list li figure img{
        width: 100%;
    }
    
    .wellness-column-list li figcaption{
        font-weight: bold;
        font-size: 20px;
        line-height: 26px;
        margin-top: 16px;
    }
    
    
    
/* 監修・スタッフ */
    
    .wellness-staff-wrap dl{
        width: 100%;
        display: -moz-box;
        display: -ms-flexbox;
         display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        -webkit-align-items: flex-start;
        border: 1px solid #898989;
        padding: 24px;
        margin-bottom: 0;
    }
    
    .wellness-staff-wrap dl+dl{
        margin-top: 24px;
    }
    
    .wellness-staff-wrap .img-box{
        width: 30%;
        margin-right: 4%;
    }
    
    .wellness-staff-wrap .img-box img{
        width: 100%;
    }
    
    .wellness-staff-wrap .txt-box{
        width: 66%;
    }
    
    .wellness-staff-wrap .txt-box h4{
        font-size: 18px;
        line-height: 26px;
        font-weight: bold;
        margin-bottom: 24px;
    }
    
    .wellness-staff-wrap .txt-box p{
        font-size: 16px;
        line-height: 26px;
        margin-bottom: 0;
    }
    
    .wellness-staff-wrap .txt-box p+p{
        margin-top: 24px;
    }
    
    
}


/* -------------------------------- SP版のスタイルここから ------------------------------------*/

@media screen and (max-width: 750px) {
    
    
/* プログラム */
    .wellness-program-wrap{
        width: 100%;
        margin-bottom: 0;
        padding: 0;
    }
    
    .wellness-program-wrap li{
        width: 100%;
        margin-bottom: 24px;
    }
    
    .wellness-program-wrap li:last-child{
        margin-bottom: 0;
    }
    
    .wellness-program-item{
        margin: 0;
    }
    
    .wellness-program-item .img-box{
        width: 100%;
        margin: 0 0 8px 0;
    }
    
    .wellness-program-item .img-box img{
        width: 100%;
    }
    
    .wellness-program-item .txt-box{
        width: 100%;
        margin: 0;
    }
    
    .wellness-program-item .txt-box h5{
        margin: 0 0 4px 0;
        font-size: 16px;
        line-height: 26px;
        font-weight: bold;
    }
    
    .wellness-program-item .txt-box p{
        margin: 0 0 8px 0;
        font-size: 14px;
        line-height: 26px;
    }
    
    .wellness-program-item .txt-box dl{
        margin: 0;
        width: 100%;
        display: -moz-box;
        display: -ms-flexbox;
         display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        -webkit-align-items: flex-start;
    }
    
    .wellness-program-item .txt-box dl+dl{
        margin-top: 0;
    }
    
    .wellness-program-item .txt-box dl dt{
        width: 20%;
        margin: 0;
        font-size: 14px;
        line-height: 26px;
        font-weight: normal;
    }
    
    .wellness-program-item .txt-box dl dd{
        width: 78%;
        margin: 0 0 0 2%;
        font-size: 14px;
        line-height: 26px;
        font-weight: normal;
    }
    
/* コラム */
    
    .wellness-column-list{
        width: 100%;
        margin-top: 40px;
        margin-bottom: 40px;
        padding: 0;
    }
    
    .wellness-column-list li{
        width: 100%;
        margin-bottom: 0;
    }
    
    .wellness-column-list li+li{
        margin-top: 24px;
    }
    
    .wellness-column-list li figure{
        margin-bottom: 0;
    }
    
    .wellness-column-list li figure img{
        width: 100%;
    }
    
    .wellness-column-list li figcaption{
        font-weight: bold;
        font-size: 16px;
        line-height: 26px;
        margin-top: 16px;
    }
    
    .wellness-column-list+.btn-basic{
        max-width: 90%;
    }
    
    
    
/* 監修・スタッフ */
    
    .wellness-staff-wrap dl{
        width: 100%;
        border: 1px solid #898989;
        padding: 16px;
        margin-bottom: 0;
    }
    
    .wellness-staff-wrap dl+dl{
        margin-top: 16px;
    }
    
    .wellness-staff-wrap .img-box{
        width: 100%;
    }
    
    .wellness-staff-wrap .img-box img{
        width: 100%;
    }
    
    .wellness-staff-wrap .txt-box{
        width: 100%;
        margin-top: 16px;
    }
    
    .wellness-staff-wrap .txt-box h4{
        font-size: 16px;
        line-height: 26px;
        font-weight: bold;
        margin-bottom: 16px;
    }
    
    .wellness-staff-wrap .txt-box p{
        font-size: 14px;
        line-height: 26px;
        margin-bottom: 0;
    }
    
    .wellness-staff-wrap .txt-box p+p{
        margin-top: 16px;
    }
    
    
}

