@charset "UTF-8";

@media screen and (min-width: 810px){
    .header_link .h_btn a:hover::after{right: 15px;}
    .button a:hover::before{right: 20px;}
    .header_box ul li a:hover::after{top: 60%;}
    .header_box ul li a:hover{color: #ff3d00;}
    .point_cost.bnr:hover{transform: scale(1.05);}
    .banner a:hover{transform: scale(1.05);}
}
@media screen and (min-width: 1400px){
    .flow_box_text p{font-size: 3rem;}
    .step p{font-size: 14px;}
    .contact ul li .c_btn a{font-size: 2.5rem;}
}
@media screen and (max-width: 1380px){
    body.panelactive::after{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .7);
        animation-name: bodyanm;
        animation-duration: .5s;
        animation-fill-mode: forwards;
        opacity: 0;
        z-index: 5;
    }
      @keyframes bodyanm {
          0% {opacity: 0;}
          100% {opacity: 1;}
      }
    .header_box{margin-right: 0;}
    .header_link{margin-right: 50px;}
    .h_menu_logo{display:block; width: 150px; margin-inline: auto; padding-bottom: 30px;}
    .header_box ul li a{
        margin-left: 0;
        display: block;
        color: #ff3d00;
        border-bottom: solid 1px #fff;
        width: 100%;
    }
    .header_box ul li a::after{
        top: 50%;
        right: 0px;
        border: 2px solid #ff3d00;
        border-left: 0;
        border-bottom: 0;
        transform: translateY(-50%) rotate(45deg);
    }
    /* ハンバーガー */
    .open_btn{
        position: fixed;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 70px;
        height: 70px;
        /* padding: 25px; */
        top: 0;
        right: 10px;
        z-index: 50;
        border-radius: 0 0 0 20px;
    }
    .open_btn span{
        display: inline-block;
        transition: all .4s;
        height: 3px;
        border-radius: 2px;
        background: #fff;
        width:30px;
        z-index: 15;
    }
    .open_btn span:nth-of-type(1) {
        position: absolute;
        top: 25px;
        left: 50%;
        transform: translateX(-50%);
        background: #fff;
    }
    .open_btn span:nth-of-type(2) {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .open_btn span:nth-of-type(3){
        position: absolute;
        bottom: 25px;
        left: 50%;
        transform: translateX(-50%);
        background: #fff;
    }
    /*activeクラスが付与されると線が回転して×に*/
    .open_btn.active span:nth-of-type(1) {
        position: absolute;
        top: 38px;
        transform: translateX(-50%) rotate(-45deg);
        background: #ff3d00;
    }
    .open_btn.active span:nth-of-type(2) {
        opacity: 0;/*真ん中の線は透過*/
    }
    .open_btn.active span:nth-of-type(3){
        position: absolute;
        top: 37px;
        transform: translateX(-50%) rotate(45deg);
        background: #ff3d00;
    }
    #g-nav-list{
        position: fixed;
        top: 0;
        right: -320px;
        /* background-image: linear-gradient(90deg, rgba(255, 109, 0, 1), rgba(255, 61, 0, 1)); */
        width: 320px;
        background: #fff;
        transition: .3s;
        padding: 60px 40px;
        height: 100%;
        z-index: 30;
        overflow-y: scroll;
    }
    #g-nav-list ul li{
        width: 100%;
        padding-bottom: 10px;
        margin-top: 30px;
        border-bottom: solid 1px #ff3d00;
    }
    #g-nav-list.panelactive{
        right: 0;
    }
    #g-nav-list .logo{
        padding: 0;
        width: 120px;
        margin-bottom: 30px;
    }
    #g-nav-list .btn-area{
        margin-bottom: 20px;
    }
    #g-nav-list .btn-area .btn a{
        position: relative;
        background: #fff;
        color: #000;
    }
    #g-nav-list .btn-area .btn:first-of-type a{
        pointer-events: none;
    }
    #g-nav-list .btn-area .btn a::after{
        content: none;
    }
    #g-nav-list .btn-area .btn a:first-of-type{
        margin-bottom: 10px;
    }
    #g-nav-list .list{
        padding: 20px;
        background: #fff;
        border-radius: 10px;
    }
    #g-nav-list .list .item .index{
        position: relative;
    }
    #g-nav-list .list .item:nth-of-type(-n+2) .index::after{
        content: '';
        position: absolute;
        top: 45%;
        right: 10px;
        width: 0;
        height: 0;
        margin: auto;
        border-top: 12px solid #f41f60;
        border-right: 10px solid transparent;
        border-left: 10px solid transparent;
        border-bottom: 0 solid transparent;
        transform: translateY(-50%);
        box-sizing: border-box;
        transition: .3s;
    }
    #g-nav-list .list .item .index.close:nth-of-type(-n+3)::after{
        content: none;
    }
    #g-nav-list .list .item .index.close:nth-of-type(-n+3)::before{
        content: '';
        display: block;
        position: absolute;
        top: 45%;
        right: 10px;
        width: 0;
        height: 0;
        margin: auto;
        border-top: 12px solid #f41f60;
        border-right: 10px solid transparent;
        border-left: 10px solid transparent;
        border-bottom: 0 solid transparent;
        transform: translateY(-50%) rotate(180deg);
        box-sizing: border-box;
        opacity: 1;
        transition: .3s;
    }
    #g-nav-list .list .item .index{
        cursor: pointer;
        color: #f41f60;
        font-weight: 900;
        font-size: 1.8rem;
    }
    #g-nav-list .list .item .lower-page{
        display: none;
        margin-top: 10px;
    }
    #g-nav-list .list .item .lower-page.active{
        display: block;
    }
    #g-nav-list .list .item .lower-page ul li{
        position: relative;
        padding: 5px 10px 5px 20px;
        background: #fee9ef;
        margin-bottom: 10px;
    }
    #g-nav-list .list .item .lower-page ul li:last-of-type{
        margin-bottom: 0px;
    }
    #g-nav-list .list .item .lower-page ul li a{
        color: #000;
        font-weight: 900;
    }
    #g-nav-list .list .item .lower-page ul li::before{
        content: "";
        width: 5px;
        height: 5px;
        background: #000;
        border-radius: 10px;
        position: absolute;
        top: 16px;
        left: 10px;
    }
        /* 20251415 */
        .header_link_sp{
            display: block;
            margin: 0;
            width: 100%;
        }
        .header_link_sp .h_btn{
            margin-top: 20px;
        }
        .header_link_sp .h_btn:first-of-type{
            margin-top: 30px;
        }
        .header_link_sp .h_btn a:first-of-type, .sp_link .h_btn a:first-of-type {
            margin-right: 0;
            padding-right: 0;
        }
        .header_link_sp .h_btn:first-of-type a, .sp_link .h_btn:first-of-type a {
            width: 100%;
        }
        .header_link_sp .h_btn a, .sp_link .h_btn a {
            width: auto;
            padding-left: 72px;
        }
        .header_link_sp .h_btn:last-of-type a, .sp_link .h_btn:last-of-type a {
            border: 1px solid #00cf1e;
        }
        .header_box ul li.sp-block{
            display: block;
        }
}
@media screen and (max-width: 1280px){
    .service_box ul li h3{font-size: 2.5vw;}
    .service_box ul li .item p {font-size: 1.6vw;}
    .floting_bnr { bottom: 32%;}
}
@media screen and (max-width: 1150px){
    h1 {font-size: 3rem;}
    .sub-ttl{font-size: 2.5rem;}

    .worries ul li p{font-size: 1.6rem;}

    .service .sub-ttl .sp-block{display: block;}
    .solution_area .sub-ttl .sp-block{display: block;}

    .point_reduction .sub-ttl .sp-block{display: block;}
    .point_reduction .box p{margin-bottom: 8%;}

    .merit ul li h4{font-size: 2rem;}

    .point ul li p{font-size: 2.2rem;}
    .seminar .features .flex h4{font-size: 2.2rem;}
    .sp_scroll .img .link{ width: 34.3vw; height: 55.8vw;}
    .point_reduction .box h3 br{display: block;}
    .seminar .benefits .flex li h5 br{display: block;}
}
@media screen and (max-width: 900px){
    .header_link .h_btn{display: none;}
}
@media screen and (max-width: 850px){
    .point ul{justify-content: center;}
    .point ul li{width: 47%; margin: 5px;}

    .seminar_index h3{font-size: 5.5vw}
    .seminar .features .flex{justify-content: center;}
    .seminar .features .flex li{width: 47%; margin: 5px;}
}
@media screen and (max-width: 768px){
    p{font-size: 1.4rem; line-height: 1.4;}
    h1{font-size: 2.5rem; margin-bottom: 5%;}
    h1::after{width: 80px; height: 2px; bottom: -8px;}
    h1.sp-block{display: block;}
    .asirai-bg::after{height: 7%;}
    .service.asirai-bg::after{height: 90px;}

    .sub-ttl{font-size: 2rem;}
    .mv{margin-top: 50px;}
    header .logo{width: 80px;}
    .header_frex{padding: 8px 20px;}
    .sp_link{
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        margin-right: 0;
        z-index: 20;
    }
    .open_btn span:nth-of-type(1) {
        top: 15px;
    }
    .open_btn span:nth-of-type(3){
        bottom: 15px;
    }
    .open_btn.active span:nth-of-type(1){
        top: 25px;
    }
    .open_btn.active span:nth-of-type(3){
        top: 25px;
    }
    .pd_t{padding-top: 50px;}
    /* ハンバーガー */
    .open_btn{
        position: fixed;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 50px;
        height: 50px;
        top: 0;
        right: 10px;
        border-radius: 0 0 0 20px;
    }
    .sp_link{display: flex;}
    .sp_link .h_btn{width: 33.333%;}
    .sp_link .h_btn:first-of-type a{width: 100%; border-radius: 0; height: 50px; border-top: 4px solid #214869; padding-left: 10px; padding-right: 0; justify-content: start; font-weight: bold;}
    .sp_link .h_btn:nth-of-type(2) a{width: 100%; border-radius: 0; height: 50px; border-top: 4px solid #214869; padding-left: 10px; font-weight: bold;}
    .sp_link .h_btn:last-of-type a{width: 100%; border-radius: 0; height: 50px; border-top: 4px solid #00cf1e; padding-left: 10px; font-weight: bold;}
    .sp_link .h_btn:nth-of-type(2) a::before, .sp_link .h_btn:last-of-type a::before{content: none;}
    .sp_link .h_btn a::after{right: 20px;}
    .sp_link .h_btn:first-of-type a::before{width: 20px; height: 20px; left: 10px;}
    .sp_link .h_btn:last-of-type a::before {width: 20px; height: 20px; left: 10px;}

    .worries ul li::before{ width: 20px; height: 20px;}
    .worries ul li{padding: 2% 1% 2% 7%; border-radius: 5px;}

    .solution_area .solution_img{width: 100%; padding-bottom: 8%;}
    .solution_area h3{font-size: 2rem;}
    .solution_area .box .hosoku{font-size: 1.6rem;}
    /* .solution_area .box .hosoku br{display: none;} */
    .solution_area .box p:first-of-type .sp-block{display: block;}
    .solution_area .box .hosoku br.sp-block{display: block;}

    .service_box ul{justify-content: center;}
    .service_box ul li {width: 48%; margin: 0 1% 15px 1%;}
    .service_box ul li h3{font-size: 3vw;}
    .service_box ul li .item p{font-size: 2.4vw;}
    .service .talk{padding: 10px; border-radius: 5px;}
    .service .talk .pc{display: none;}
    .service .talk .sp{display: block;}

    .caption{margin-top: 10%;}
    .caption h3{font-size: 1.6rem;}

    .solution_text span{font-size: 4vw;}
    .solution_text strong{font-size: 5vw;}
    
    .point ul{justify-content: center;}
    .point ul li{width: 48%; margin: 5px;}

    .asirai-bg.point_reduction::after{height: 90px;}
    .point_reduction .box{padding: 15px; border-radius: 10px;}

    .merit ul li{width: 48%; padding: 20px; margin-bottom: 20px;}
    .merit ul li:last-of-type{margin-bottom: 0px;}
    .merit ul li h4{font-size: 1.8rem;}
    .caption_p p{margin-top: 10px;}

    .partner.asirai-bg::after{height: 50px;}
    .partner .box{padding: 15px; border-radius: 5px;}
    .partner .box h2{font-size: 1.8rem; margin-bottom: 10px;}
    .partner .box .flex .img{width: 100%; margin-bottom: 10px;}
    .partner .box .flex .txt{width: 100%;}
    .partner .box .flex .txt h3{font-size: 2rem;}
    .partner .box h2 br{display: block;}
    .accordion-container .accordion{border-radius: 5px; padding:15px;}
    .accordion-container h3{font-size: 1.6rem; width: 90%;}
    .accordion-container p.b-none.p-txt{ border-top: 0; margin-top: 20px;}

    .seminar h1 br{display: block;}
    .seminar.asirai-bg::after{height: 100px;}
    .seminar_box_head{font-size: 1.8rem;}
    .seminar_box_p{padding: 20px;}
    .seminar_box_p p{padding-left: 12px; text-indent: -8px;}
    .seminar_box_p.webiner p{font-size: 1.6rem; padding-left: 10px; text-indent: -10px;}
    .seminar_h2 h2{font-size: 1.8rem;}
    .seminar .recommend{padding: 15px; margin-bottom: 10%;}
    .seminar .recommend h2{font-size: 2.2rem; margin-bottom: 10px;}
    .seminar .recommend .flex li{width: 100%; font-size: 1.8rem; border-radius: 5px; padding: 10px;}
    .seminar .recommend .flex li:last-of-type{margin-bottom: 0;}
    .seminar .recommend .flex li br{display: none;}
    .seminar .benefits{padding: 50px 3% 3% 3%;}
    .seminar .benefits .flex li{width: 100%; padding: 15px; margin-bottom: 20px;}
    .seminar .benefits .flex li:last-of-type{margin-bottom: 0;}
    .seminar .benefits .flex li h4{font-size: 1.8rem;}
    .seminar .benefits .flex li h4 span{font-size: 3rem;}
    .seminar .features .flex li{width: 100%; border-radius: 5px;}
    .seminar_index .hukidasi_img{width: 60%;}
    .seminar_box.program{margin-bottom: 20%;}
    .seminar .benefits .hukidasi {width: 190px; top: -33px;}
    .seminar_index h3{font-size: 6.8vw;}
    .seminar .features .flex span{font-size: 70px;}

    .overview_box{padding: 0 20px;}
    .overview_text{flex-wrap: nowrap;}
    .overview_text p:first-child{width: 100px;}
    .overview_text p{width: 60%;}

    .access .map iframe{height: 280px;}
    .mv .mv_img .sp{display: block;}
    .mv .mv_img .pc{display: none;}

    .floting_bnr { bottom: 28%; width: 120px;}
    .floting_bnr.simulation-bnr{ bottom: 12%; width: 120px;display: none;}

    .contact ul li .c_btn a.tell{pointer-events: all;}
    .contact ul li{padding: 5%;}

    .features .features_img{width: 80%;}

    .purchase h2{font-size: 2.5rem;}
    .purchase .img{ width: 80%;}

    .point_reduction .box h3{font-size: 2.35rem;}
    .solution{padding: 10% 0;}
    .solution_text{margin-bottom: 15px;}
    .anchor-adjust{top: -70px;}

    .features-list{gap: 10px;}
    .price-section{flex-wrap: wrap; margin-bottom: 10px; padding-bottom: 10px;}
    .card-title{font-size: 5.5vw;}
    .price-number{font-size: 10vw;}
    .feature-value{font-size: 1.4rem;}
    .plan .sp-block{display: block;}
    .price-block{width: 100%;}
    .card-content{padding: 10px;}
    .feature-value{flex-wrap: wrap;}
    .feature-value strong{width: 100%; margin-right: 0;}
    .card-title{margin-bottom: 5px;}
    .card-desc{margin-bottom: 25px;}
}

@media screen and (max-width: 650px){

    .seminar_box_head::after {width: 30px; height: 10px; bottom: -9px;}
    
    .contact ul li{width: 100%; margin-bottom: 20px;}
    .contact ul li:last-of-type{margin-bottom: 0;}
    .contact ul li p{font-size: 2.5rem;}
    .contact ul li p span{font-size: 1.6rem;}
    .contact ul li .c_btn a{font-size: 5vw;}

    .sp_scroll{overflow-x: scroll; margin-bottom: 45px;}
    .sp_scroll .img{width: 800px; margin-bottom: 5px;}
    .point .yoko_scroll{display: block; font-size: 1.4rem; margin-bottom: 15px;}
    .sp_scroll .img .link{width: 323px; height: 524px; top: 15.8%; left: 8%;}
    .sp_scroll .img .sp{ display: block;}
    .sp_scroll .img .pc{ display: none;}
}

@media screen and (max-width: 560px){
    .w-1100{padding: 0 15px;}
    h1 {font-size: 2.5rem; margin-bottom: 30px;}
    .ttl_txt{text-align: start;}
    .ttl_txt br{display: none;}
    .button a {width: 80%!important; height: 55px; font-size: 2rem;}
    .mt{margin-top: 50px;}
    .heading{margin-bottom: 30px;}
    .sp_link .h_btn a{font-size: 1.4rem;}

    .solution_area .box{padding: 15px;}

    .service_box ul li h3{font-size: 1.8rem;}
    .service_box ul li h3{font-size: 1.8rem;}
    .service_box ul li .item p {font-size: 1.6rem;}

    .point_reduction .img .pc{display: none;}
    .point_reduction .img .sp{display: block;}
    .point_reduction .img_link{top: 29.65%; bottom: inherit; left: 50%; transform: translateX(-50%); width: 84%; height: 3%; border-radius: 40px;}
    .point_reduction .sub-ttl .sp-block{display: block;}
    .point_reduction .box p .sp-block{ display: block;}
    .point_reduction .box p:last-of-type{margin-bottom: 20px;}
    .point_reduction .button{margin-bottom: 20%;}

    /* worries */
    .worries ul li{width: 100%; min-height: 40px; padding: 5% 5% 5% 12%;}

    .merit ul li{width: 100%; padding: 10px;}

    .partner h1 br{ display: block;}

    .point ul li{width: 100%; margin-left:0; margin-bottom: 6%;}
    .point ul li h2 span{font-size: 1.8rem;}
    .point ul li h2::after{top: 60%;}
    .point ul li:nth-of-type(2) p{margin-bottom: 5%;}

    .accordion-container .accordion h3::after{width: 10px; height: 10px;}
    .f_logo{width: 180px; padding-bottom: 30px; padding-top: 30px;}

    .banner{padding-top: 20%; width: 100%;}
    .point_reduction .banner{padding-bottom: 15%;}
    .faq .accordion .button a{font-size: 1.8rem;}

    .official.button a br.sp-block{display: block;}
    .official.button a span{display: none;}
}
@media screen and (max-width: 400px){
    h1 {font-size: 2rem;}
    .sub-ttl{font-size: 1.8rem;}
    .solution_area .orange .number{font-size: 3rem; line-height: .5;}
    .h_menu_logo{width: 120px; padding-bottom: 0;}
    .header_box ul li a{font-size: 1.4rem;}
    #g-nav-list{padding: 60px 20px;}
    #g-nav-list.panelactive { right: 0; width: 70%;}
    .c_model_point{width: 100%;}
    .service_box ul li{width: 100%; margin: 0 0 50px 0;}

    .service_box ul li .img .sp{display: block;}
    .service_box ul li .img .pc{display: none;}

    .sp_scroll{overflow-x: scroll; margin-bottom: 45px;}
    .sp_scroll .img{width: 560px; margin-bottom: 5px;}
    .sp_scroll .img .link{ width: 226px; height: 368px;}
    .header_link .h_btn:nth-of-type(2) a::before, .sp_link .h_btn:nth-of-type(2) a::before {left: 12px;}
    .header_link .h_btn:last-of-type a::before, .sp_link .h_btn:last-of-type a::before {left: 12px;}
    .header_link_sp .h_btn a, .sp_link .h_btn a {padding-left: 45px;}
    .header_link .h_btn a::after, .sp_link .h_btn a::after {right: 12px;}
    .bannerBox > a{width: 160px;}
    
    .point_reduction .txt-large span{font-size: 5rem;}
}
@media screen and (max-width: 359px){
    .seminar.asirai-bg::after{height: 1%;}
    .sp_link .h_btn a::after{content: none;}
    .point_reduction .box h3{font-size: 2rem;}
    .seminar_index h2 br{display: block;}
}
@media screen and (max-width: 320px){}