/************************
　　　
　　　トレーナーページ

************************/
@media screen and (max-width: 450px){
    main {
        padding-top: 19vw;
    }
}
@media screen and (min-width: 451px){
    main {
        padding-top: 6vw;
    }
}


/*
 * @parts：トレーナーページ　全体
 * @design：中央揃え
*/
#trainer_page{
        margin: 0 auto;
}


/* MVは　sub_page_mv　へ */



/*
 * @parts：トレーナーセクション
 * @design：上に余白をつける
*/
#trainer_page_section{
    padding-top: 8.28%;
}
@media screen and (max-width: 450px){
    #trainer_page_section{
        padding-top: 0;
}
}



/*
 * @parts：トレーナーセクション インナー
 * @design：左右に余白をつける
*/
#trainer_page_section_inner{
    padding: 6.2% 7.76% 8.33% 7.76%;
    background-color:#e7ddcc;
}
@media screen and (max-width: 450px){
    #trainer_page_section_inner{
        padding: 20% 7.5% 25% 7.5%;
}
}



/*
 * @parts：トレーナー山﨑 メインタイトル
 * @design：文字の種類や大きさを指定
*/
.trainer_page_main_title{
    font-family:"HGMinchoE", sans-serif;
    font-size: 2.5vw;
    text-align: center;
    font-weight: 600;
}
@media screen and (max-width: 450px){
    .trainer_page_main_title{
        font-size: 4vw;
}
}



/*
 * @parts：トレーナー山﨑 サブタイトル
 * @design：文字の種類や大きさを指定
*/
.trainer_page_sub_title{
    font-family:"HGMinchoE", sans-serif;
    font-size: 1.5625vw;
    text-align: center;
    font-weight: 600;
}
@media screen and (max-width: 450px){
    .trainer_page_sub_title{
        font-size: 3vw;
}
}



/*
 * @parts：トレーナー山﨑 タイトル下の要素を囲む
 * @design：横並びにして、上に余白を作る
*/
#trainer_page_yamasaki_container{
    display: flex;
    padding-top: 3.94%;
    justify-content: center;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_container{
        display: block;
        padding-top: 5%;
}
}




/*
 * @parts：トレーナー山﨑 画像
 * @design：画像を大きさや配置を指定
*/
#trainer_page_yamasaki_img {
    background-image:url(../image/trainer_image/totonou_trainer.jpg);
    background-size: 125%;
    background-repeat: no-repeat;
    background-position: top 0 left 60%;
    width: 54.19%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_img  {
    background-size: 100%;
    width: 100%;
    height:40vw;
}
}



/*
 * @parts：トレーナー山﨑 プロフィール
 * @design：左に余白をとる
*/
#trainer_page_yamasaki_profile{
    padding-left: 3.42%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_profile{
        /* 余白を削除 */
        padding-left: 0;
}
}




/*
 * @parts：トレーナー山﨑 プロフィール タイトル
 * @design：文字の種類と大きさを指定
*/
#trainer_page_yamasaki_title{
    font-family:  "Source Serif 4";
    font-size: 1.71875vw;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_title{
        font-size: 4.5vw;
        padding-top: 10vw;
}
}




/*
 * @parts：トレーナー山﨑 プロフィール タイトル　代表
 * @design：文字の大きさと左の余白
*/
#trainer_page_yamasaki_title span{
    font-size: 1.25vw;
    padding-left: 6.99%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_title span{
        font-size: 3vw;
        padding-left: 5%;
    }
}




/*
 * @parts：トレーナー山﨑 プロフィール 名前
 * @design：横並びにして上下中央揃え
*/
#trainer_page_yamasaki_name{
    display: flex;
    align-items: center;
}




/*
 * @parts：トレーナー山﨑 プロフィール 名前　英語
 * @design：文字の大きさや種類を指定
*/
#trainer_page_yamasaki_name h2{
    font-size: 1.875vw;
    font-family: "Meiryo UI";
    font-weight: bold;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_name h2{
        font-size: 4.5vw;
    }
}



/*
 * @parts：トレーナー山﨑 プロフィール 名前　日本語
 * @design：文字の大きさや種類、左の余白を指定
*/
#trainer_page_yamasaki_name h3{
    font-size: 1.25vw;
    font-family: "Meiryo UI";
    font-weight: bold;
    padding-left: 6.99%;;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_name h3{
        font-size: 3.5vw;
        padding-left: 5%;
    }
    }


#trainer_page_yamasaki_phi{
    font-size: 1.25vw;
    font-family: "Meiryo UI";
    font-weight: 300;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_phi{
        font-size: 3vw;
    }
    }



/*
 * @parts：トレーナー山﨑 プロフィール テキスト
 * @design：上に余白をつける
*/
#trainer_page_yamasaki_text{
    padding-top: 9.32%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_text{
        padding-top: 10%;
    }
    }



/*
 * @parts：トレーナー山﨑 プロフィール テキスト　タイトル
 * @design：文字の大きさと種類を指定
*/
#trainer_page_yamasaki_text h3{
    font-size: 1.25vw;
    font-family:"HGMinchoE";
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_text h3{
        font-size: 3.5vw;
    }
    }




/*
 * @parts：トレーナー山﨑 プロフィール テキスト　文章
 * @design：文字の大きさと種類　上の余白を指定
*/
#trainer_page_yamasaki_text p{
    font-size: 0.9375vw;
    font-family: "YuMincho";
    padding-top: 3.11%;
    }
    /* rpの改行はなくす */
    .br_rp{
        display: none;

    }

@media screen and (max-width: 450px){
    #trainer_page_yamasaki_text p{
        font-size: 2.94vw;
        padding-top: 5.88%;
    }
     /* pcの改行はなくす */
    br{
        display: none;
    }
    /* spの改行をする */
    .br_rp{
        display: block;
    }
    }




/*
 * @parts：トレーナー山﨑 メッセージ 　テキスト
 * @design：上の余白を指定
*/
#trainer_page_yamasaki_message{
    padding-top: 9.32%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_message{
        padding-top: 15.65%;
    }
}




/*
 * @parts：トレーナー山﨑 メッセージ 　テキスト タイトル
 * @design：上の余白を指定
*/
#trainer_page_yamasaki_message h3{
    font-size: 1.25vw;
    font-family:"HGMinchoE";
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_message h3{
        font-size: 3.5vw;
    }
}




/*
 * @parts：トレーナー山﨑 メッセージ 　テキスト 文章
 * @design：文字の大きさと種類を指定
*/
#trainer_page_yamasaki_message p{
    font-size: 0.9375vw;
    font-family:"YuMincho" ;
    padding-top: 3.11%;
}
@media screen and (max-width: 450px){
    #trainer_page_yamasaki_message p{
        font-size: 3vw;
        padding-top: 7.35%;
    }
    }




/*
 * @parts：各トレーナー紹介　全体
 * @design：上の余白を指定
*/
#trainer_page_trainer{
    padding-top: 7.81%;
}
@media screen and (max-width: 450px){
    #trainer_page_trainer{
        padding-top: 29.41%;
    }
    }



/*
 * @parts：各トレーナー紹介　囲い
 * @design：上の余白を指定　横並びに
*/
#trainer_page_trainer_container{
    padding-top: 4.5%;
    /* display: flex; */
}
@media screen and (max-width: 450px){
    #trainer_page_trainer_container{
        padding-top: 3%;
        /* スマホでは縦並びに */
        display: block;
    }
    }


/*
 * @parts：各トレーナー紹介　左側
 * @design：右に余白をつける
*/
.trainer_page_trainer_profile{
    /* padding-right: 2.9%; */
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_profile{
        padding-right: 0;
    }
    }

    @media screen and (max-width: 450px){
        #trainer_page_trainer_profile2{
            padding-top: 23.53%;
        }
        }




/*
 * @parts：各トレーナー紹介　右側
 * @design：右の余白を削除
*/
.trainer_page_trainer_profile:nth-child(2){
    padding-right: 0;
}



/*
 * @parts：各トレーナー紹介　名前　英語
 * @design：文字の大きさや種類を指定　下線
*/
.trainer_page_trainer_name h4{
    font-size: 1.875vw;
    font-family: "Meiryo UI";
    border-bottom: 1px solid ;
    font-weight: bold;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_name h4{
        font-size: 4.5vw;
    }
    }



/*
 * @parts：各トレーナー紹介　名前　日本語
 * @design：文字の大きさや種類を指定　上に余白をつける
*/
.trainer_page_trainer_name h5{
    font-size: 1.25vw;
    font-family: "Meiryo UI";
    padding-top: 0.3%;
    margin: 0;
    font-weight: bold;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_name h5{
        font-size: 3.5vw;
        padding-top: 0.88%;
    }
    }





/*
 * @parts：各トレーナー紹介　写真とテキストを囲う
 * @design：横並びにして　上に余白をつける
*/
.trainer_page_trainer_wrapper{
    display: flex;
    margin-top: 0.5vw;
    justify-content: space-between;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_wrapper{
        display: block;
        margin-top: 6.18%
    }
    }



/*
 * @parts：各トレーナー紹介　写真
 * @design：横幅と　右の余白を指定
*/
.trainer_page_trainer_img{
    width: 41.66666vw;
    height: 20.83333333vw;
    /* padding-left: 5%; */
}
#trainer_page_trainer_img_sp{
    display: none;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_img{
     display: none;
    }
    #trainer_page_trainer_img_sp{
        display: block;
        width: 100%;
        height: 42.5vw;
    }
    #trainer_page_trainer_img_sp img{
        width: 100%;
        height: 100%;
    }
}
        /*
        * @parts：各トレーナー紹介　写真(sp)
        * @design：高さを調整
        */
        .trainer_page_trainer_img img{
            width: 100%;
            height: 100%;
        }
        @media screen and (max-width: 450px){
            .trainer_page_trainer_img img{
                height: 100%;
                width: 100%;
                object-fit: cover;

            }
        }

.trainer_page_trainer_text_box{
    width: 39.0625vw;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_text_box{
        width: 100%;
    }
    }


/*
 * @parts：各トレーナー紹介　テキスト　タイトル
 * @design：横幅と　右の余白を指定
*/
.trainer_page_trainer_text h3{
    font-size: 1.25vw;
    font-weight: 800;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_text h3{
        padding-top: 6.5vw;
        font-size: 3.5vw;
    }
}



/*
 * @parts：各トレーナー紹介　テキスト　文章
 * @design　文字の大きさと種類を指定 上に余白
*/
.trainer_page_trainer_text p{
    font-size: 0.937vw;
    font-family: "YuMincho";
    padding-top: 0.9vw;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_text p{
        font-size: 3vw;
        padding-top: 5%;
    }
}



/*
 * @parts：各トレーナー紹介　メッセージ　タイトル
 * @design：横幅と　右の余白を指定
*/
.trainer_page_trainer_message h3{
    padding-top: 2.5vw;
    font-size: 1.302083vw;
    font-weight: 800;
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_message h3{
        padding-top: 13.65%;
        font-size: 3.5vw;
    }
}



/*
 * @parts：各トレーナー紹介　メッセージ　文章
 * @design：文字の大きさ　上に余白
*/
.trainer_page_trainer_message p{
    font-size: 0.9375vw;
    padding-top: 0.9vw;
    font-family: "YuMincho";
}
@media screen and (max-width: 450px){
    .trainer_page_trainer_message p{
        font-size: 3vw;
        padding-top: 5%;
    }
}