@charaset "utf8";

/* ============================
common
============================== */
html{
    font-size: 62.5%;
}
body{
    font-family
    :"Noto Sans JP" ,
    Arial, 
    sans-serif
    ;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    background-color: #fff;
}

img{
    max-width: 100%;
}

main{
    margin-top: 55px;
}

/* ============================
index.html
============================== */

.header{
    background-color: #e8340c;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

.headerTxt_white{
   color: #fff;
   font-size: 2rem;
   font-weight: 500;
   letter-spacing: 4px;
   text-align: center;
   margin-top: -12px;
}

.header_container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 8%;
    transition: all .8s;
}

.header_logo{
    display: flex;
    align-items: center;
}

.logo_img{
    width: 40px;
}

.menu_logo{
    width: 40px;
    height: 35.81px;
}

.nav{
    background-color: #fff;
    position: absolute;
    width: 100%;
    top: 0px;
    z-index: 200;
    transition: all 0.3s;
    transform: translateX(120%);
    max-width: 100%;
    right: 0;
    max-height: 100svh;
    overflow-y: auto;
}

.nav.active{
    transform: translateX(0%);
}

.nav_container{
    margin:22px 6%;
}

.header_name{
    color: #e8340c;
    font-size: 2rem;
   font-weight: 500;
}

.close_logo{
    width: 34px;
    height: 28px;
    padding-right: 6px;
}

.nav_topic{
    color: #e8340c;
    font-size: 2rem;
    font-weight: 700;
    padding-left: 32px;
    margin: 35px 0;
    text-decoration: none;
}

.nav_topic_logo{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.arrow{
    width: 24px;
    height: 12px;
    margin-right: 24px;
}

.nav_topic_logo.active .arrow{
    transform: scale(1, -1);
}

.nav_list{
    color: #e8340c;
    font-size: 1.3rem;
    padding-left: 32px;
    margin-top: 35px;
}

.nav_list:first-of-type{
    margin-top: 20px;
}

ul{
    padding-left: 0;
}

.btn_trial{
    position: fixed;
    bottom: 4px;
    left: 0;
    color: #F2F2F2;
    background-color: #E8340C;
    font-size: 2rem;
    width: 100%;
    padding: 8px 0;
    text-align: center;
    border-radius: 50px;
    border: solid white;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
}

li{
    list-style: none;
}

.underline{
    border-bottom: #e8340c solid 1px;
    margin: 35px 0px;
    padding-bottom: 6px;
}

.pcBr{
    display: none;
}

h2{
   color: #fff;
   font-size: 15px;
   font-weight: 700;
   line-height: 50px;
   text-shadow: 0 6px 4px rgba(0, 0, 0, 0.2);
}

.top_txt{
    color: #fff;
    text-align: center;
    font-size: 1.1rem;
    background-color: #e8340c;
    padding: 21px 44px;
    line-height: 21px;
}

h3{
    color: #e8340c;
    font-size: 2rem;
    font-style: italic;
    text-align: center;
    margin-top: 35px;
    font-weight: 400;
    background-color: #fff;
    width: fit-content;
    margin: 0 auto;
    padding: 0 15px;
}

.title_container::before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #e8340c;
    position: absolute;
    top: 50%;
    z-index: -1;
}

.title_container{
    position: relative;
    margin:35px 29px;
}

.classImg{
    margin: auto;
    padding: 0 16px;
}

.className{
    font-size: 2rem;
    font-weight: 600;
    text-align: center;
    
}

.target{
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    margin-top: 5px;
}

.price{
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    margin-top: 5px;
}

.classTxt{
    margin: 25px 0;
}

.class_container_top{
    border-radius: 20px;
    border: 2px solid #e8340c;
    padding: 21px 0 ;
    margin: 25px 8%;
}

.btn{
    padding: 9px 35px;
    margin: 50px 89px;
    border-radius: 50px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 18px;
    background-color: #e8340c;
    text-align: center;
}

.classBtn{
    font-size: 18px;
}

.address{
    margin: 0 21px;
    text-align: center;
}
.address iframe{
    width: 100%;
}

.addressTxt{
    font-style: normal;
    text-align: center;
    font-size: 13px;
    line-height: 1.2;
    padding-bottom: 50px;
    margin-top: 0;
}

.mapImg{
    max-width: 100%;
}

.pcMap{
    display: none;
}

.map_icon{
    width: 20px;
    height: 20px;
    margin: 0 auto;
    margin-top: 30px;
}

.title_white{
    color: #fff;
    background-color: #e8340c;
    padding-top: 35px;
}

.banner_sp{
    max-width: 375px;
}

.banner_container{
    display: none;
}

.top_group{
    position: relative;
}

.catch{
    position: absolute;
    top: 44px;
    left: 6px;
}

.txt_top{
    font-size: 25px;
    font-weight: 700;
    line-height: 50px;
}

.txt_top2{
    padding-left: 25px;
}



.title_container_white::before{
    content:"";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    /* z-index: -1; */
}

.title_container_white{
    position: relative;
    margin:0 35px ;
}

.title_white{
    color: #fff;
    font-size: 2rem;
    font-style: italic;
    text-align: center;
    margin-top: 35px;
    font-weight: 400;
    background-color: #e8340c;
    width: fit-content;
    margin: 0 auto;
    padding: 0 15px;
    position: relative;
    z-index: 10;
}

.btn_wrap{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background: #fff;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
    width: 174px;
    padding: 5px;
    position: absolute;
    top: 296px;
    left: 12px;
}

.bannerBtn_txt{
    font-size: 15px;
    text-align: center;
    color: #e8340c;
}

.w_arrow{
    margin-top: 3px;
}

.banner_container{
    position: relative;
    max-width: 1440px;
    margin: auto;
}

.title_white_wrap{
    background-color: #e8340c;
    padding-top: 20px;
}

.schedule {
    overflow: scroll;
}

.schedule-table {
    background-color: #fff;   
    margin: auto;
    margin: 61px 0 61px 0;
    border-collapse: collapse;
    border: none;
    width: 775px;
}

.schedule-table th,
.schedule-table td {
    width: 12.5%;
    text-align: center;
    vertical-align: middle;
}

.schedule-table td {
    padding: 16px 5px 20px;
    border-left: 2px solid #FF9080;
    border-top: 2px solid #FF9080;
}

.schedule-table td p {
    font-size: 1rem;
    margin-bottom: 5px;
}

.schedule-table__head {
    background-color: #FF9080;
    margin: 14px 0;
}


/* ここから左端がついてくる設定 */

.schedule-table tr {
}


.schedule-table tr:not(:first-of-type) {
    padding-left: 12.5%;
}

.schedule-table__time {
    background-color: #F2F2F2;
    position: sticky;
    left: 0;
}

/* ここまで左端がついてくる設定 */

.sut_blue{
    color: #4E95FF;
}

.sun_orange{
    color: #FF6A54;
}

.yuto{
    font-size: 14px;
    font-weight: 500;
    color: #FF5D00;
}

/* .takehisa{
    font-size: 14px;
    font-weight: 500;
    color:#5699FF;
} */

.ichikawa{
    font-size: 14px;
    font-weight: 500;
    color: #55C360;
}

th{
    padding: 14px 0;
}

td{
    height: 84px;
}

.border {
    border-top: 1px solid #FF5D00;
    border-bottom: 1px solid #FF5D00;
    padding: 20px 0;
}

.FAQ_wrap{
    padding: 0 8% 54px 8%;
}

.Q{
    color: #000;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    padding-top: 13px;
    display: flex;
    gap: 5px;
    line-height: 1.7;
}

.A{
    color: #E8340C;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    padding: 10px 0 13px 0;
    display: flex;
    gap: 5px;
    line-height: 1.7;
}

.FAQ_box{
    border-bottom: #e8340c solid 1px;
}

.footer{
    background-color: #e8340c;
}

.footer_container{
    color: #fff;
    padding: 66px 0;
    text-align: center;
}

.footer_traial_txt{
    font-size: 12px;
    font-weight: 500;
}

.footer_company{
    font-size: 9px;
    margin-top: 10px;
}

.footer_telNumber{
    font-size: 20px;
    font-weight: 500;

}

.footer_mail{
    font-size: 15px;
    font-weight: 500;
}

.copyright{
    margin-top: 46px ;
}

/* header pc */
@media screen and (min-width:769px) {
    main{
        margin-top: 126px;
    }

    .headerTxt_white{
        font-size: 4.5rem;
        letter-spacing: 9px;
        padding-bottom: 19px;
    }

    span.header_smallTxt_white{
        font-size: 2.2rem;
    }

    .logo_img{
        width: 72px;
    }

    .menu_logo{
        width: 64px;
        height: 64px;
    }

    .traial_btn_white{
        display: block;
        color: #E8340C;
        font-size: 25px;
        background-color: #fff;
        padding: 21px 46px;
        border-radius: 50px;
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
    }

    .btn_group{
        display: flex;
        gap: 44px;
    }

    span.header_smallTxt_red{
        font-size: 2.2rem;
    }

    p.headerTxt_red{
        font-size: 4.5rem;
        letter-spacing: 9px;
        padding-bottom: 19px;
    }
    
    .close_logo{
        width: 50px;
        height: 50px;
    }

    .nav_topic{
        font-size: 30px;
        font-weight: 700;
    }
    
    .nav_list{
        font-size: 20px;
    }

    .nav_container{
        display: flex;
        gap: 40px;
    }

    .nav_wrap_pc{
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .nav{
        box-shadow: 0 3px 10px rgba(0, 0, 0, .3);
        padding-bottom: 75px;
    }

    .traial_btn_white{
        display: block;
    }
    .btn_trial{
        position: static;
        background-color: transparent;
        border-radius: 0;
        box-shadow: none;
        border:0 ;
    }

    .header_container.active{
        padding: 0 8%;
        .logo_img{
            width: 50px;
        }
        .headerTxt_white {
            font-size: 4rem;
            letter-spacing: 9px;
            padding-bottom: 19px;
        }
        .traial_btn_white{
            padding: 15px 46px;
        }
        .headerTxt_red{
            font-size: 4rem;
            letter-spacing: 9px;
            padding-bottom: 19px;
        }
        .traial_btn{
            padding: 15px 46px;
        }        
        }

        .arrow{
            display: none;
        }

/* top pc */
    .topImg{
        width: 81%;
        display: block;
        margin-left: auto;
    }

    .top_group{
        background-color: #E8340C;
        position: relative;
    }

    .catch{
        font-size: 5.5rem;
        line-height: 95px;
        position: absolute;
        top: 124px;
        left: 2%;

    }

    span.txt_top{
        font-size: 8rem;
        font-weight: 700px;
        line-height: 50px;
    }

    .top_txt{
        font-size: 1.5rem;
        line-height: 47px;
        padding: 50px 23%;
    }

    span.txt_top2{
        padding-left: 144px;
    }

    .spBr{
        display: none;
    }

    .pcBr{
        display: block;
    }

    /*course pc*/
    .class_wrap{
        display: flex;
        justify-content: center;
        gap: 38px;
    }

    .class_container_top{
        margin: 59px 0 0 0;
        width: 26%;
    }

    .classImg{
        width: 92%;
        display: block;
        margin: auto;
    }

    .className{
        font-size: 25px;
    }

    .target{
        font-size: 18px;
    }

    .price{
        font-size: 19px;
    }

    .title{
        font-size: 5rem;
        font-weight: 400;
        margin-top: 100px;
    }

    .btn{
       padding: 25px 0; 
       margin: 126px 35%;
    }

    .classBtn__txt{
        font-size: 25px;
    }

    /* banner pc */
    .banner_sp{
        display: none;
    }

    .banner_container{
        display: block;
    }

    .banner_pc{
        display: block;
        position: relative;
        max-width: 1440px;
        margin: auto;
    }

    .bannerBtn_txt{
        font-size: 25px;
        font-size: clamp(1rem,1.736vw,2.5rem);
        line-height: 3;
        white-space: nowrap
    }

    .btn_wrap{
        position: absolute;
        width: fit-content;
        height: auto;
        top: auto;
        bottom: 20%;
        left: 18%;
        padding: 0 3%;
    }

    .w_arrow{
        width: 100%;
        margin-top: 6px;
    }

    .btn_icon{
        width: 12.7%;
    }

    /* access pc */
    .spMap{
        display: none;
    }

    .pcMap{
        display: block;
        margin: 60px 8%;
        width: 83%;
    }

    .map_icon{
        width: 40px;
    }

    .addressTxt{
        font-size: 1.5rem;
        margin-top: 20px;
        padding-bottom: 126px;
    }

    /* schedule pc */
    .title_white{
        font-size: 5rem;
        font-weight: 400;
        margin-top: 100px;
    }
    
    .schedule{
        padding: 20px;
    }

    .schedule-table{
        width: 100%;
        max-width: 900px;
        margin: 60px auto;
    }

    /* FAQ */
    .Q{
        font-size: 20px;
        display: flex;
        gap: 10px;
        line-height: 1.6;
    }

    .A{
        font-size: 20px;
        margin-top: 41px;
        display: flex;
        line-height: 1.6;
        gap: 10px;
    }

    .FAQ_box{
        padding: 50px 0;
    }

    .FAQ_wrap{
        margin: 97px 0 180px;
        padding: ;
    }

    /* footer pc */
    .footer_traial_txt{
        font-size: 2rem;

    }
    .footer_company{
        font-size: 1rem;
    }
    .footer_telNumber{
        font-size: 3.3rem;
    }

    .footer_mail{
        font-size: 2.5rem;
    }

    .copyright{
        font-size: 1rem;
    }

    .traial_btn_white{
        color: #E8340C;
        background-color: #fff;
        font-size: 2.5rem;
        padding: 21px 46px;
        border-radius: 50px;
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
    }
}
/* 769px pc */



/* =========================== 
about.html
===========================*/

.headerTxt_red{
    color: #e8340c;
   font-size: 2rem;
   font-weight: 500;
   text-align: center;
   letter-spacing: 4px;
   margin-top: -12px;
}

.header_smallTxt_red{
    font-size: 10px;
    letter-spacing: -0.2px;
}

.header_smallTxt_white{
    font-size: 10px;
    letter-spacing: -0.2px;
}

.header_container_white{
    background-color: #fff;
}

.about{
    background-color: #e8340c;
    
   
}

.title_white_wrapBg{
    background-image: url(../img/kumo2.svg),url(../img/kumo1.svg),url(../img/kumo2.svg);
    background-size: 212px,215px,212px;
    background-repeat: no-repeat;
    background-position: left -52px top 61px,right -30px top 55%,left -16px bottom 14px;
}

.about_wrap{
    padding-bottom: 35px;
}

.about_list{
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: #fff;
}

.about_txt{
    font-size: 10px;
    line-height: 23px;
    margin-top: 19px;
    color: #fff;
}


.about_container{
    margin: 55px 10%;
}

.section_list{
    font-size: 18px;
    text-align: center;
    color: #e8340c;
    padding-top: 50px;
}

.section_listGallery{
    margin-bottom: 30px;
}

/* @keyframes infinity-scroll-left {
    from {
      transform: translateX(0);
    }
      to {
      transform: translateX(-100%);
    }
    } */
    /* .scroll-infinity__wrap {
      display: flex;
      overflow: hidden;
    } */
    /* .scroll-infinity__list {
      display: flex;
      list-style: none;
      padding: 0
    } */
    /* .scroll-infinity__list--left {
      animation: infinity-scroll-left 80s infinite linear 0.5s both;
    } */
    .scroll-infinity__item {
      margin: 0 10px;
    }
    /* .scroll-infinity__item>img {
      width: 100%;
    } */

    /* .galleryImg{
        width: 297px;
        padding: 35px 15px;
    } */

    .gallery_container{
        margin-bottom: 35px;
    }

/* about pc */
    @media screen and (min-width:769px) {
        .about_list{
            font-size: 3.5rem;
        }

        .about_txt{
            font-size: 1.5rem;
            line-height: 36px;
        }

        .about_container1{
            margin-left: 0;
        }

        .about_container1 .about_list{
            text-align: left;
        }

        .about_container2{
            margin-left: auto;
            margin-right: 0;
        }

        .about_container2 .about_list{
            text-align: right;
        }

        .about_container{
            margin-top: 0;
            max-width: 870px;
        }

        .about_wrap{
            padding: 126px 9%;
        }

        .title_white_wrapBg{
            background-image: url(../img/kumo1.svg),url(../img/kumo2.svg);
    background-size: 528px,486px;
    background-position: right -30px top 32%,left -16px bottom 80px;
        }

        .section_list{
            font-size: 3.5rem;
            margin-top: 50px;
        }

        .section_listGallery{
            margin-bottom: 50px;
        }

        .gallery_container{
            margin-bottom: 150px;
        }

    }

/* 769px pc */

/* =========================== 
course_menu.html
===========================*/
.course_group{
    display: flex;
    justify-content: space-between;
    margin: 10px 12% 0 12%;
    align-items: center;
    padding-bottom: 10px;
}

.course_group_first{
    border-bottom: #e8340c solid 1px;
}

.course_choice{
    font-size: 18px;
    font-weight: 700;
    color: #e8340c;
}

.course_txt{
    width: 52%;
    font-size: 11px;
    font-weight: 500;
    color: #000;
    text-align: center;
}

.course_container{
    margin-top:50px;
}

.course_list{
    display: flex;
    justify-content:center;
    align-items: center;
    gap: 10%;
}

.course_wrap{
    margin:20px 0 ;
    padding: 0 10px;
}

.courseName{
    margin-top: 6px;
}

.price_list{
    display: flex;
    justify-content: space-between;
    margin: 10px 10% 10px 10%;
    padding: 6px 40px 6px 40px;
    font-size: 1.3rem;
    border-bottom: #e8340c solid 1px;
}

.subtopic{
    text-align: center;
    margin-top: 35px;
    font-size: 1.5rem;
    font-weight: 700;
}

.notice{
    text-align: center;
    margin-top: 15px;
}

.join_topic{
    margin: 35px 19%;
    font-size: 1.3;
    font-weight: 500;
    padding-bottom: 10px;
}
.join_list{
    margin-bottom: 10px;
    line-height: 1.5;
}

.class_container{
    border-radius: 20px;
    border: 2px solid #e8340c;
    padding: 21px 0;
    margin: 25px 20px;
   
}

/* course pc */
@media screen and (min-width:769px) {

    .course{
    margin-top: 100px;
    }
 
span.header_smallTxt_red{
    color: #e8340c;
    font-size: 2rem;
    font-weight: 500;
    text-align: center;
    letter-spacing: 4px;
    margin-top: -12px;
    }
    
 h1.headerTxt_red{
    font-size: 4.5rem;
    letter-spacing: 9px;
    padding-bottom: 19px;
    }

.traial_btn{
    display: block;
    color: #fff;
    background-color: #E8340C;
        font-size: 25px;
        padding: 21px 46px;
        border-radius: 50px;
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
}  
    
.course_choice{
    font-size: 3.5rem;
    font-weight: 700;
}

.course_txt{
    font-size: 1.8rem;
    font-weight: 500;
}

.course_group_first{
    border-bottom: #E8340C solid 2px;
}

.course_group{
    padding: 35px 30px;
}

.class_group{
    display: flex;
    gap: 37px;
    padding: 0 7%;
}

.classImg{
    padding: 0 16px;
}

.className{
    font-size: 1.8rem;
    font-weight: 700;
}

.target{
    font-size: 1.3rem;
    font-weight: 500;
}

.price{
    font-size: 1.5rem;
    font-weight: 500;
}

.courseName{
    font-size: 1.5rem;
    font-size: 500;
}

.class_container{
    border-radius: 20px;
    border: 2px solid #e8340c;
    padding: 21px 0 ;
    margin: 25px 0;
    width: 31%;
}
.price_list{
    font-size: 2rem;
    font-weight: 500;
    padding: 24px 128px;
}

.subtopic{
    font-size: 2rem;
    font-weight: 700;
    margin-top: 95px;
}



.notice{
    font-size: 2rem;
    font-weight: 500;
    margin-top: 47px;
    margin-bottom: 170px;
}

.btn_wrap{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background: #fff;
    width: fit-content;
    height: auto;
    padding: 0 3%;
    
}

.join_list{
    font-size: 2rem;
    font-weight: 500;
}

.join_topic{
    margin: 126px 21% 170px;
} 

}

/* 769px pc

/* =========================== 
profile.html
===========================*/

.profileImg{
    width: 152px;
    border-radius: 40px;
}

.profile_container{
    display: flex;
    justify-content:center;
    align-items: center;
    margin: 50px 4% 10px 4%;
    gap: 20px;
}

.profile_txt{
    margin-top: 14px;
    font-size: 1.3rem;
    font-weight: 500;
}

.txt_week{
    margin-left: -8px;
}

.history{
    text-align: center;
    font-weight: 500;
}

.history_txt{
    line-height: 33px;
    font-weight: 500;
}

.history_subtxt{
    margin-left: 30px;
}

.history_list{
    display: flex;
    justify-content: center;
}

.history_container{
    margin-bottom: 30px;
}

.slider {
    margin: 35px 35px 0 35px;
}

.slide{
    align-items: center;
}

.slider_txt{
    margin-top: 0;
    line-height: 1.7;
}

/* profile pc */
@media screen and (min-width:769px){   
    span.header_smallTxt_red{
        color: #e8340c;
        font-size: 2rem;
        font-weight: 500;
        text-align: center;
        letter-spacing: 4px;
        margin-top: -12px;
        }
        
     h1.headerTxt_red{
        font-size: 4.5rem;
        letter-spacing: 9px;
        padding-bottom: 19px;
        }

    .profile{
        padding: 0 8%;
    }

    .profileImg{
        width: 400px;
    }

    .profile_txt{
        font-size: 1.8rem;
        font-weight: 500;
        line-height: 2.5;
        letter-spacing: 2px;
    }

    .history_list{
        margin-bottom: 80px;
        letter-spacing: 2px;
    }

    .history{
        font-size: 1.8rem;
        font-weight: 500;
        margin-top: 50px;
    }

    .history_txt{
        font-size: 2rem;
        font-weight: 500;
        line-height: 2.5;
        letter-spacing: 1px;
    }

    .profile_topicImg{
        width: 503px;
    }

    .slider_txt{
        font-size: 1.5rem;
        font-weight: 500;
        line-height: 3;
        text-align: left;
    }

    .slider{
        width: 100%;
        overflow: initial;
        display: block;
    }

    .slide {
        width: 100%;
        max-width: 1060px;
        display: flex;
        align-items: center;
        margin: auto;
        gap: 60px;
        margin-top: 40px;
    }

    .slide:nth-of-type(2n) {
        flex-direction: row-reverse;
    }

    .profile_container{
        gap: 120px;
        margin-top: 100px;
    }

    .txt_week{
        margin-left: -19px;
    }
}

/* 769px pc */

/* =========================== 
trial.html
===========================*/
.trial_catch{
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    margin: auto;
    margin-top: 52px;
}

.trial_catch_red{
    color: #E8340C;
    font-size: 24px;
    font-weight: 800;
}

.trial_wrap{
    background-image: url(../img/trial_BGI.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-color:rgba(255,255,255,0.5);
    background-blend-mode:lighten;
    text-align: center;
    padding: 0 21px 50px 21px;
}

.trial_topic{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
    margin-top: 50px;
    text-align: center;
}

.trial_topic_txt{
    font-size: 10px;
    font-weight: 500;
    line-height: 26px;
}
 .trialImg{
    margin: 40px 5.8%;
 }

 .trialImg img{
    width: 100%;
 }

 .company{
    font-size: 11px;
    font-weight: 500;
 }

 .telNumber{
    font-size: 20px;
    font-weight: 500;
 }

.mail{
    font-size: 20px;
    font-weight: 500;
}

.contact_address{
   margin: 50px 12% 70px 12%; 
   text-align: center;
}

.line_txt{
    text-align: center;
    font-size: 18px;
    margin-top: 40px;
}

.qr-container{
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 0 10%;
}

.line_url{
    display: flex;
    justify-content: center;
    margin-top: 10px;
    color: #07b53b;
    font-size: 18px;
    font-weight: 400;
}



/* trial pc */
@media screen and (min-width:769px){
    .trial_wrap{
        padding: 25px 0 125px 0;
        background-image: url(../img/BGI_pc.jpg);
        background-size: cover;
        background-repeat: no-repeat;
    }

    span.header_smallTxt_red{
    color: #e8340c;
    font-size: 2rem;
    font-weight: 500;
    text-align: center;
    letter-spacing: 4px;
    margin-top: -12px;
    }
    
 h1.headerTxt_red{
    font-size: 4.5rem;
    letter-spacing: 9px;
    padding-bottom: 19px;
    }

.trial_catch_red{
    font-size: 6rem;
    font-weight: 800;
}

.trial_catch{
    font-size: 4rem;
    font-weight: 600;
    line-height: 1.2;
    margin-top: 60px;
}

.trial_topic{
    font-size: 2rem;
    font-weight: 500;
    margin-top: 80px;
}

.trial_topic_txt{
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 48px;
    width: 80%;
    margin: auto;
}

.company{
    font-size: 2rem;
    font-weight: 500;
    line-height: 2;
}

.telNumber{
    font-size: 3.5rem;
    font-weight: 500;
    line-height: 1.2;
}

.mail{
    font-size: 3.5rem;
    font-weight: 500;
    line-height: 1.2;
}

.contact_address{
    margin-bottom: 185px;
    margin-top: 100px;
}

.line_txt{
    font-size: 20px;
    margin-top: 50px;
  }
  
  .qr-container{
      padding: 0 30px;
  }
  
  .line_url{
      font-size: 25px;
      font-weight: 500;
      margin-top:0;
  }  

}






/* .header_container.active{
    padding: 0 8%;
    .logo_img{
        width: 50px;
    }
    .headerTxt_white {
        font-size: 4rem;
        letter-spacing: 9px;
        padding-bottom: 19px;
    }
    .traial_btn_white{
        padding: 15px 46px;
    }
    .headerTxt_red{
        font-size: 4rem;
        letter-spacing: 9px;
        padding-bottom: 19px;
    }
    .traial_btn{
        padding: 15px 46px;
    }
    
    } */