@charset "UTF-8";
body, .fs-l-page{padding-top: 0!important;}

main .inner{width: 100%; max-width: 1040px; margin: 0 auto; padding: 0 20px;}
main .--btn{transition: all 0.3s ease-out;}
main .--btn:hover{opacity: .7;}
main h2{font-size:3.6rem; font-weight: 700; letter-spacing:.1rem; line-height: 1; color:#03457a; text-align: center; margin-bottom: 40px;}
main h2.--enon{font-size:3.6rem; font-weight: 700; letter-spacing:.1rem; line-height: 1; color:#03457a; text-align: center; margin-bottom: 64px;}
main h2.--enon img{width: auto; height: 18px; margin-bottom: 12px;}
main h2.--enon span{position: relative; border-bottom: 2px #b3c7d7 solid; padding: 0.8rem 0;}
main h2.--enon span:before,
main h2.--enon span:after{position: absolute; top: 100%; left: 50%; content: ""; height: 0; width: 0;}
main h2.--enon span:before{border: 16px solid; border-color: transparent; border-top-color: #b3c7d7; margin-left: -16px;}
main h2.--enon span:after{border: 14px solid; border-color: transparent; border-top-color: #fff; margin-left: -14px;}

main #concept-kv{margin: 92px 0 120px 0; text-align: center;}

main #concept-list{}
main #concept-list .inner{width: 630px;}
main #concept-list img{margin-bottom: 20px;}
main #concept-list .title{color:#03457a; font-size: 2.8rem; line-height: 1.2; font-weight: 700; margin-bottom: 20px; display: block;}
main #concept-list .--list{margin-bottom: 80px;}
main #concept-list .--text{max-height: 50px; overflow: hidden; position: relative; transition: max-height 0.5s ease-in-out; font-size:1.8rem; font-weight: 500; line-height: 1.5; color: #152a3b;}
main #concept-list .--text::after{content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 40px;  background: linear-gradient(to top, #f9f9f9, rgba(249, 249, 249, 0));}
main #concept-list .--text.open::after{content: none;}
main #concept-list .--list-btn{font-size: 1.4rem; font-weight: 500; color: #fff; text-align: center; border: 1.5px #fff solid; width: 120px; height: 34px; line-height: 1; border-radius: 17px; background: #03457a; display: block; margin: 15px auto 0 auto;}
main #concept-list .--list-btn::after{content: '+'; font-size: 1.4em; font-weight: 100; font-weight: bold; margin-left: 8px; line-height: 1;}
main #concept-list .--text.open + .--list-btn::after {content: '−';}
main #concept-list .--list-btn span{position: relative; top: -2px;}

main #concept-partners{margin-bottom: 70px;}
main #concept-partners h2.--enon{margin-bottom: 40px;}
main #concept-partners h2.--enon span{border: none;}
main #concept-partners h2.--enon span:before,
main #concept-partners h2.--enon span:after{display: none;}
main #concept-partners ul{max-width: 1000px; width:auto; display: flex; gap: 30px; align-items: center; margin: 0 auto; padding: 0; flex-wrap: wrap; justify-content: center;}
main #concept-partners ul li{margin-bottom: 30px; width:calc(100% / 3 - 20px);}

main #concept-rem{margin-bottom: 100px;}
main #concept-rem h2{text-align: left;}
main #concept-rem p{font-size:1.8rem; font-weight: 500; line-height: 1.5; margin-bottom: 40px; color: #152a3b;}

main #concept-repulsion{padding: 0 0 100px 0;}
main #concept-repulsion ul{display: flex; align-items: center; justify-content: center; background: #152a3b; color:#fff; padding: 0;}
main #concept-repulsion ul li{width:100%; height:320px; display: flex; align-items: center; flex-direction: column; justify-content: center;}
main #concept-repulsion ul li:nth-child(1){background: url(../images/concept_new/repulsion_pc.webp) 50% 50%/cover no-repeat;}
main #concept-repulsion ul li .title,
main #concept-repulsion ul li strong,
main #concept-repulsion ul li .btn{display: block; text-align: center;}
main #concept-repulsion ul li .title{margin-bottom: 30px; font-size:3.6rem; font-weight: 600; letter-spacing:.1rem; line-height: 1.1;}
main #concept-repulsion ul li strong{font-size:3.6rem;}
main #concept-repulsion ul li img{width: auto; height: 21px; margin-bottom: 24px;}
main #concept-repulsion ul li a{font-size:1.8rem; font-weight: 600; color:#fff; text-align: center; border: 1.5px #fff solid; width: 184px; height: 56px; line-height: 54px; border-radius: 28px; background: #03457a; display: block; margin: 0 auto;}
main #concept-repulsion ul li a span{background: url(../images/concept_new/icon_r_w.webp) 100% 50%/auto 11px no-repeat; padding: 0 34px 0 10px;}



@media screen and (min-width:768px){
    main .--sp{display: none;}
}

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

    main .--pc{display: none;}
    main a.btn:hover img{opacity: 1;}
    main h2{font-size:2.4rem; margin-bottom: 24px; line-height: 1.2;}
    main h2.--enon{font-size:2.4rem; font-weight: 700; letter-spacing:.1rem; line-height: 1; color:#03457a; text-align: center; margin-bottom: 36px;}
    main h2.--enon img{width: auto; height: 12px; margin-bottom: 12px;}
    main h2.--enon span{position: relative; border-bottom: 2px #b3c7d7 solid; padding: 0.6rem 0; line-height: 1.2;}
    main h2.--enon span:before,
    main h2.--enon span:after{position: absolute; top: 100%; left: 50%; content: ""; height: 0; width: 0;}
    main h2.--enon span:before{border: 12px solid; border-color: transparent; border-top-color: #b3c7d7; margin-left: -12px;}
    main h2.--enon span:after{border: 10px solid; border-color: transparent; border-top-color: #fff; margin-left: -10px;}

    main #concept-kv{margin: 56px 0 64px 0;}
    main #concept-kv .inner{padding: 0;}

    main #concept-list{}
    main #concept-list .inner{width: auto;}
    main #concept-list .title{font-size: 2.4rem; margin-bottom: 20px;}
    main #concept-list .--list{margin-bottom: 64px;}
    main #concept-list .--text{max-height: 50px; font-size:1.4rem;}

    main #concept-partners{margin-bottom: 64px;}
    main #concept-partners h2.--enon{margin-bottom: 24px;}
    main #concept-partners ul{display: block;}
    main #concept-partners ul li{width: 100%; margin: 0 0 15px 0;}
    main #concept-partners ul li:nth-last-child(1){margin-bottom: 0;}

    main #concept-rem{margin-bottom: 64px;}
    main #concept-rem p{font-size:1.4rem;}

    main #concept-repulsion{padding: 0 0 64px 0;}
    main #concept-repulsion ul{display: block; width: calc(100% - 40px); margin: 0 auto;}
    main #concept-repulsion ul li{width:100%; height:200px;}
    main #concept-repulsion ul li:nth-child(1){background: url(../images/concept_new/repulsion_sp.webp) 50% 50%/cover no-repeat;}
    main #concept-repulsion ul li .title{margin-bottom: 16px; font-size:2.4rem;}
    main #concept-repulsion ul li strong{font-size:2.8rem;}
    main #concept-repulsion ul li img{width: auto; height: 16px; margin-bottom: 16px;}
    main #concept-repulsion ul li  a{font-size:1.2rem; font-weight: 600; color:#fff; text-align: center; border: 1.5px #fff solid; width: 124px; height: 36px; line-height: 34px; border-radius: 18px; background: #03457a; display: block; margin: 0 auto;}
    main #concept-repulsion ul li  a span{background: url(../images/concept_new/icon_r_w.webp) 100% 50%/auto 8px no-repeat; padding: 0 26px 0 10px;}


}