#header{display:none}
#header .drawerBtn{position:fixed;top:3rem;right:3rem;z-index:90;width:9rem;height:5rem}
#header .drawerBtn.is-open i{background:var(--white100)}
#header .drawerBtn.is-open i:first-child{top:2.4rem;transform:rotate(20deg)}
#header .drawerBtn.is-open i:last-child{top:2.4rem;transform:rotate(-20deg)}
#header .drawerBtn i{position:absolute;width:9rem;height:.2rem;background:var(--black900);transition:transform .5s var(--easeOutCubic),top .5s var(--easeOutCubic),background .3s}
#header .drawerBtn i:first-child{top:2rem}
#header .drawerBtn i:last-child{top:3rem}
#header .drawer{position:fixed;top:0;left:0;z-index:50;width:100%;padding:3rem 3rem 5rem;background:linear-gradient(45deg,#008ed4 0,#006ebd 25%,#1b1d8c 100%);color:#fff;font-size:3rem;transition:transform .5s var(--easeOutCubic);transform:translateY(-100%)}
#header .drawer.is-open{transform:translateY(0)}
#header .drawer .logo{width:32rem;margin-bottom:5rem}
#header .drawer ul li{border-top:.2rem solid #386691}
#header .drawer ul li a{display:block;position:relative;border-top:.2rem solid #3a7cb9;padding:3rem}
#header .drawer ul li a:after{content:'';position:absolute;margin:auto;top:4rem;right:4rem;width:1.4rem;height:1.4rem;border-right:.2rem solid #fff;border-bottom:.2rem solid #fff;transform:rotate(45deg)}
#fv .top{padding-top:4rem;position:relative;background:url(../img/fv_top_bg.jpg) no-repeat center;background-size:cover}
#fv .top .logo{position:absolute;top:-2rem;right:0;z-index:10;width:29.6rem}
#fv .top .ttl{text-align:center}
#fv .top .ttl img{width:66.8rem}
#fv .bottom{text-align:center;padding-top:2rem;font-weight:var(--fontBold);line-height:1.8}
#knowledge{padding-top:10rem}
#knowledge .contents{display:flex;align-items:flex-start;flex-direction:row-reverse;padding:3rem 0 20rem;background:#ffecd9}
#knowledge .contents .bnr{position:sticky;top:0;right:0;z-index:10;width:0}
#knowledge .contents .bnr .inner{transition:opacity .3s;cursor:pointer;position:absolute;top:2rem;right:0;width:20rem;height:44rem;background:url(../img/knowledge_bnr.jpg) no-repeat center;background-size:100% auto;border-radius:1.5rem 0 0 1.5rem;box-shadow:0 0 .8rem rgba(0,0,0,.3);cursor:pointer}
#knowledge .contents .bnr .inner:hover{opacity:var(--opacity500)}
#knowledge .contents .bnr .inner .movie{display:flex;align-items:center;justify-content:center;position:absolute;bottom:1.7rem;left:1.7rem;width:16.7rem;height:23rem;overflow:clip}
#knowledge .contents .bnr .inner .movie iframe{width:100%;height:auto;aspect-ratio:9/16;transform:scale(1.2);pointer-events:none}
#knowledge .contents .wrap p.notes{text-align:center;font-size:1.5rem;margin-bottom:10rem}
#knowledge .contents .wrap ul.point{display:grid;grid-template-columns:repeat(2,minmax(0,50%));column-gap:8rem;row-gap:10rem}
#manabi{padding-top:25rem;overflow-x:clip}
#manabi .contents{padding:10rem 0 20rem;background:#fff5cf}
#manabi .contents .swiper{overflow:visible}
#manabi .contents .swiper .swiper-wrapper .swiper-slide{display:flex;align-items:center;column-gap:3rem;padding:0 10rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .imgBox{flex-shrink:0;width:39rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox{width:100%}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category{display:flex;align-items:center;column-gap:2rem;margin-bottom:4rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category dt{flex-shrink:0;width:7rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category dd{padding-top:2rem;font-size:2.8rem;font-weight:var(--fontBold)}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox h3{font-size:2.8rem;color:#006db7;margin-bottom:1rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox p.txt{text-align:justify;text-justify:inter-ideograph;line-height:1.8}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox p.advice{text-align:justify;text-justify:inter-ideograph;position:relative;margin-top:3rem;padding:2rem;border-radius:1.5rem;background:var(--white100)}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox p.advice:before{content:'';position:absolute;margin:auto;top:-.8rem;left:2rem;width:13.2rem;height:1.6rem;background:url(../img/manabi_swiper_advice.png) no-repeat center;background-size:100% auto}
#manabi .contents .swiper .swiper-button-next,#manabi .contents .swiper .swiper-button-prev{width:5rem;height:5rem;border-radius:9rem;background:url(../img/manabi_swiper_arr.jpg) no-repeat center;background-size:100% auto}
#manabi .contents .swiper .swiper-button-next:after,#manabi .contents .swiper .swiper-button-prev:after{display:none}
#manabi .contents .swiper .swiper-button-prev{transform:rotate(180deg)}
#popular{padding-top:25rem}
#popular .contents{padding:10rem 10rem 20rem;background:#70aee6}
#popular .contents ul.list{display:grid;grid-template-columns:repeat(3,minmax(0,33.3333333333%));column-gap:5rem;row-gap:5rem}
#popular .contents ul.list li{display:flex;flex-direction:column;align-items:flex-start;position:relative;border-radius:1.5rem;background:#f0f0f0;border:.2rem solid #c8c8c8;overflow:clip;min-height:28.6458333333vw;padding:2.0833333333vw}
#popular .contents ul.list li p.lead{font-weight:var(--fontBold);line-height:1.8;font-size:2.0833333333vw}
#popular .contents ul.list li p.category{margin-top:auto;border-top:.2rem solid var(--black900);font-weight:var(--fontBold);padding-top:1rem;font-size:2.0833333333vw}
#popular .contents ul.list li .img{position:absolute;bottom:0;right:0;width:12.3958333333vw}
#modal{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;z-index:100;background:rgba(0,0,0,.8);width:100%;height:100%;cursor:pointer;pointer-events:none;transition:opacity .3s,transform .3s;opacity:0;transform:scale(1.1)}
#modal.is-show{pointer-events:auto;opacity:1;transform:scale(1)}
#modal .close{display:flex;justify-content:flex-end}
#modal .close span{position:relative;width:5rem;height:5rem}
#modal .close span i{position:absolute;top:2.4rem;left:1rem;width:3rem;height:.2rem;background:var(--white100)}
#modal .close span i:first-child{transform:rotate(45deg)}
#modal .close span i:last-child{transform:rotate(-45deg)}
#modal .movie{text-align:center}
#modal .movie iframe{width:auto;height:75vh;aspect-ratio:9/16}
#modal .movie p.notes{color:#fff;font-size:1.5rem;margin-top:1rem;line-height:1.6}
#footer .top{position:relative;z-index:100;padding:18rem 0 5rem;text-align:center}
#footer .top .site{position:absolute;top:-27.5rem;right:-9rem;z-index:10;width:34.4rem}
#footer .top .site .blow{position:absolute;top:0;left:0;z-index:10;width:100%;text-align:center;font-size:3.1rem;line-height:1}
#footer .top .site .blow em{position:relative}
#footer .top .site .blow em:after,#footer .top .site .blow em:before{content:'';position:absolute;margin:auto;top:.6rem;width:.3rem;height:2.4rem;background:var(--black900)}
#footer .top .site .blow em:before{left:-1.6rem;transform:rotate(-20deg)}
#footer .top .site .blow em:after{right:-1.6rem;transform:rotate(20deg)}
#footer .top .site a{display:block}
#footer .top .site a .arr{position:relative}
#footer .top .logo a{display:inline-block}
#footer .top .logo a img{width:46.7rem}
#footer .top .address{margin-top:3rem;font-size:1.5rem}
#footer .bottom{border-top:.1rem solid #c8c8c8;padding:3rem 0 4rem}
#footer .bottom .recruit a{display:inline-block}
#footer .bottom .recruit a img{width:25.8rem}
@media screen and (max-width:1280px){
#popular .contents ul.list li{min-height:36.6rem;padding:3rem}
#popular .contents ul.list li p.lead{font-size:2.6rem}
#popular .contents ul.list li p.category{font-size:2.6rem}
#popular .contents ul.list li .img{width:15.8rem}
}
@media screen and (max-width:767px){
#header{display:block}
#fv .top{padding:0;background:0 0}
#fv .top .wrap{padding:0}
#fv .top .logo{top:3rem;left:3rem;width:32rem}
#fv .top .ttl img{width:100%}
#fv .bottom{display:none}
#knowledge{padding-top:20rem}
#knowledge .contents{padding:12rem 0 0}
#knowledge .contents .bnr{top:10rem}
#knowledge .contents .wrap p.notes{font-size:2.5rem;margin:8rem 0 0}
#knowledge .contents .wrap ul.point{grid-template-columns:repeat(1,minmax(0,100%));row-gap:10rem}
#knowledge .contents .wrap ul.point{padding:0 3.5rem}
#manabi{padding-top:20rem}
#manabi .contents{padding:10rem 0 0}
#manabi .contents .wrap{padding:0}
#manabi .contents .swiper .swiper-wrapper .swiper-slide{display:block;padding:0 6rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .imgBox{width:100%;text-align:center}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .imgBox img{width:50rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category{column-gap:2rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category dt{width:14rem;margin:0 0 0 -1rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox dl.category dd{padding-top:4.5rem;font-size:4rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox h3{font-size:4.3rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox p.advice{margin-top:5rem;padding:3rem}
#manabi .contents .swiper .swiper-wrapper .swiper-slide .txtBox p.advice:before{top:-1.6rem;left:3rem;width:26.4rem;height:3.2rem}
#manabi .contents .swiper .swiper-button-next,#manabi .contents .swiper .swiper-button-prev{top:25rem;margin:0}
#popular{padding-top:20rem}
#popular .contents{padding:15rem 10rem 10rem}
#popular .contents ul.list{grid-template-columns:repeat(1,minmax(0,100%));row-gap:5rem}
#popular .contents ul.list li{min-height:62rem}
#popular .contents ul.list li:nth-child(n+4){display:none}
#popular .contents ul.list li p.lead{font-size:4.5rem}
#popular .contents ul.list li p.category{font-size:4.5rem}
#popular .contents ul.list li .img{width:28rem}
#modal .close span i{top:2.3rem;left:0;width:5rem;height:.4rem}
#modal .movie p.notes{font-size:2.4rem;margin-top:2rem}
#footer .top{padding:10rem 0 5rem}
#footer .top .site{position:static;margin-bottom:10rem;width:100%;filter:drop-shadow(.6rem .6rem .6rem rgba(0, 0, 0, .15))}
#footer .top .site .blow{top:-1rem}
#footer .top .site a .arr{animation:bnrArr 1.5s ease-out infinite}
#footer .top .logo a img{width:55.4rem}
#footer .top .address{margin-top:2rem;font-size:2.5rem}
#footer .bottom{padding:2rem 0 3rem}
}
/*# sourceMappingURL=style.css.map */