#l_animation{position:fixed;top:0;left:0;z-index:1000;width:100%;height:100%;overflow-y:scroll;text-align:center;background:var(--white900);transition:background 1.2s,height 1.2s var(--easeOutCubic),transform 1.2s var(--easeOutCubic)}
#l_animation.is-show{background:var(--yellow500)}
#l_animation.is-show .wrapper{opacity:1}
#l_animation.is-show .wrapper .wrap .logo,#l_animation.is-show .wrapper .wrap .soon,#l_animation.is-show .wrapper .wrap h1.catch,#l_animation.is-show .wrapper .wrap ul.school{opacity:1;transform:translateY(0)}
#l_animation.is-hide{height:50%;transform:translateY(-105%);pointer-events:none}
#l_animation .wrapper{display:flex;align-items:center;justify-content:center;position:relative;height:100%;min-height:67rem;background:url(../img/animation_bg.webp) no-repeat center;background-size:cover!important;transition:opacity 1.2s;opacity:0}
#l_animation .wrapper .wrap{padding-bottom:5rem}
#l_animation .wrapper .wrap .logo,#l_animation .wrapper .wrap .soon,#l_animation .wrapper .wrap h1.catch,#l_animation .wrapper .wrap ul.school{transition:opacity 1.2s,transform 1.2s var(--easeOutCubic);opacity:0;transform:translateY(5rem)}
#l_animation .wrapper .wrap h1.catch{font-size:3.4rem;margin-bottom:4rem;transition-delay:.5s}
#l_animation .wrapper .wrap .logo{display:inline-block;position:relative;width:41.4rem;transition-delay:.58s;filter:drop-shadow(0 0 .5rem rgba(0, 0, 0, .3))}
#l_animation .wrapper .wrap .logo img.logo02{position:absolute;top:0;left:0;z-index:5}
#l_animation .wrapper .wrap .soon{position:absolute;bottom:5rem;left:0;width:100%;text-align:center;transition-delay:.66s}
#l_animation .wrapper .wrap .soon picture img{width:54rem}
#l_animation .wrapper .wrap ul.school{position:absolute;bottom:5rem;left:0;width:100%;display:flex;align-items:center;justify-content:center;column-gap:7rem;transition-delay:.86s}
#l_animation .wrapper .wrap ul.school li img{width:auto;height:3.2rem}
.js_content{overflow:hidden;height:0;transition:opacity 1.2s,transform 1.2s var(--easeOutCubic);opacity:0}
.js_content.is-show{height:auto;opacity:1;transition-delay:.3s}
#l_container{position:relative;z-index:100;padding-top:14rem}
#l_footer{position:relative;z-index:100;padding:15rem 0 5rem;text-align:center}
#l_header{position:fixed;top:0;left:0;z-index:500;width:100%;background:var(--yellow500);padding-top:7rem}
#l_header .logo{position:absolute;top:2.8rem;left:4rem;width:10.6rem}
#l_header .logo img.logo02{position:absolute;top:0;left:0;z-index:5}
#l_header .tab_btn{display:flex;align-items:center;justify-content:center;text-align:center;font-size:2.4rem;padding-right:18rem;font-weight:var(--fontBold)}
#l_header .tab_btn>div{position:relative;width:28rem;border:1px solid var(--white900);border-bottom:none;border-radius:1.5rem 1.5rem 0 0;padding:1.8rem 0 1.5rem;cursor:pointer;margin-left:-1px;overflow:hidden;transition:background .3s}
#l_header .tab_btn>div:before{content:'';position:absolute;margin:auto;bottom:0;left:0;width:100%;height:.5rem;transition:transform .2s var(--easeOutCubic);transform:translateY(100%)}
#l_header .tab_btn>div.is-active:before,#l_header .tab_btn>div:hover:before{transform:translateY(0)}
#l_header .tab_btn>div.is-active{background:var(--white900);pointer-events:none}
#l_header .tab_btn>div.all{margin-left:0}
#l_header .tab_btn>div.all:before{background:linear-gradient(90deg,#006cb8 0,#006cb8 50%,#cf005b 50%,#cf005b 100%)}
#l_header .tab_btn>div.daigaku{color:var(--blue500)}
#l_header .tab_btn>div.daigaku:before{background:var(--blue500)}
#l_header .tab_btn>div.tandai{color:var(--pink500)}
#l_header .tab_btn>div.tandai:before{background:var(--pink500)}
#l_header .search{position:absolute;bottom:1.4rem;right:4rem;display:flex;column-gap:1rem;text-align:center}
#l_header .search>div{position:relative;width:18rem;padding:.8rem 2rem .6rem 0;border:1px solid var(--black900);border-radius:9rem;font-weight:var(--fontBold);cursor:pointer;transition:background .3s,color .3s}
#l_header .search>div:after{content:'';position:absolute;margin:auto;top:0;bottom:0;right:1.5rem;width:1.7rem;height:1.7rem;background:var(--black900);mask:url(../img/i_search.svg) no-repeat center;mask-size:cover;transition:background .3s}
#l_header .search>div.is-active{background:var(--black900);color:var(--white900)}
#l_header .search>div.is-active:after{background:var(--white900)}
#l_modal #search_name{position:fixed;top:0;left:0;width:100%;height:100%;z-index:400;padding-top:14rem;background:var(--white900);transition:opacity .3s;opacity:0;pointer-events:none}
#l_modal #search_name.is-show{opacity:1;pointer-events:auto}
#l_modal #search_name .wrapper{display:flex;height:100%}
#l_modal #search_name .imgBox{position:relative;width:100%}
#l_modal #search_name .imgBox .default{display:flex;align-items:center;justify-content:center;background:var(--yellow500);height:100%}
#l_modal #search_name .imgBox .default .logo{position:relative;width:30rem}
#l_modal #search_name .imgBox .default .logo img.logo02{position:absolute;top:0;left:0;z-index:5}
#l_modal #search_name .imgBox .illust{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;background:var(--white900);transition:opacity .3s;opacity:0}
#l_modal #search_name .imgBox .illust.is-show{opacity:1}
#l_modal #search_name .imgBox .illust picture{display:flex;align-items:center;justify-content:center;height:100%}
#l_modal #search_name .imgBox .illust picture img{width:auto;max-width:80%;max-height:80%}
#l_modal #search_name .txtBox{flex-shrink:0;width:60%;min-width:60rem;margin-left:auto;padding:10rem 8rem;overflow-y:scroll}
#l_modal #search_name .txtBox .manabi{--colorMain:var(--blue500)}
#l_modal #search_name .txtBox .manabi.tandai{--colorMain:var(--pink500);margin-top:8rem}
#l_modal #search_name .txtBox .manabi h3{font-size:2.8rem;color:var(--colorMain);margin-bottom:3rem}
#l_modal #search_name .txtBox .manabi ul{border-bottom:1px solid #ececec}
#l_modal #search_name .txtBox .manabi ul li{border-top:1px solid #ececec;text-align:justify;text-justify:inter-ideograph}
#l_modal #search_name .txtBox .manabi ul li span{position:relative;font-size:2.2rem;display:block;cursor:pointer;padding:2rem 0 2rem 2.5rem}
#l_modal #search_name .txtBox .manabi ul li span:after,#l_modal #search_name .txtBox .manabi ul li span:before{content:'';position:absolute;margin:auto;top:3.3rem;left:0;width:.7rem;height:.7rem;border-radius:1rem;background:var(--colorMain)}
#l_modal #search_name .txtBox .manabi ul li span:after{transform:scale(.5)}
#l_modal #search_name .txtBox .manabi ul li span:hover:after{animation:wave 1s linear infinite}
#l_modal #search_category{position:fixed;top:0;left:0;width:100%;height:100%;z-index:400;padding-top:14rem;background:var(--white900);text-align:center;transition:opacity .3s;opacity:0;pointer-events:none}
#l_modal #search_category.is-show{opacity:1;pointer-events:auto}
#l_modal #search_category .wrapper{height:100%;padding:10rem 8rem;overflow-y:scroll}
#l_modal #search_category .wrapper ul{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;row-gap:5rem;width:90rem;margin:0 auto}
#l_modal #search_category .wrapper ul li{width:20%;cursor:pointer}
#l_modal #search_category .wrapper ul li img{width:10rem}
#l_modal #search_category .wrapper ul li span{display:block;margin-top:1rem;font-size:1.8rem}
#l_modal h2.ttl{font-size:3.5rem;letter-spacing:.07em;margin-bottom:8rem}
#l_modal .close{text-align:center;margin-top:8rem}
#l_modal .close span{display:inline-block;font-size:1.6rem;border:1px solid var(--black900);border-radius:9rem;padding:1rem;min-width:25rem;cursor:pointer}
@media screen and (max-width:767px){
#l_animation .wrapper{min-height:70rem;background:url(../img/animation_bg@sp.webp) no-repeat center}
#l_animation .wrapper .wrap{padding-bottom:5rem}
#l_animation .wrapper .wrap h1.catch{font-size:3.8rem;margin-bottom:5rem}
#l_animation .wrapper .wrap .logo{left:1.8rem;width:41.2rem}
#l_animation .wrapper .wrap ul.school{column-gap:5rem}
#l_animation .wrapper .wrap ul.school li img{height:3rem}
#l_container{padding-top:25.5rem}
#l_footer{padding:10rem 0 5rem;font-size:2rem}
#l_header{padding-top:18.5rem}
#l_header .logo{top:3.5rem;left:4rem;width:14rem}
#l_header .tab_btn{padding-right:0}
#l_header .tab_btn>div.daigaku{flex-shrink:0;width:40%}
#l_header .tab_btn>div.tandai{flex-shrink:0;width:40%}
#l_header .search{bottom:auto;top:3rem;right:3.5rem;flex-direction:column;row-gap:1.5rem}
#l_header .search>div{width:22rem;font-size:2rem;padding:1rem 2.4rem 1rem 0}
#l_header .search>div:after{width:2.2rem;height:2.2rem}
#l_modal #search_name{padding-top:25.5rem}
#l_modal #search_name .imgBox{display:none}
#l_modal #search_name .txtBox{width:100%;padding:10rem 6rem}
#l_modal #search_name .txtBox .manabi h3{font-size:3.2rem;margin-bottom:4rem;text-align:center}
#l_modal #search_name .txtBox .manabi ul li span{font-size:2.5rem;padding:2.5rem 0 2.5rem 3rem}
#l_modal #search_name .txtBox .manabi ul li span:after,#l_modal #search_name .txtBox .manabi ul li span:before{top:3.7rem;width:.9rem;height:.9rem}
#l_modal #search_category{padding-top:25.5rem}
#l_modal #search_category .wrapper{padding:10rem 4rem}
#l_modal #search_category .wrapper ul{width:100%;row-gap:3rem}
#l_modal #search_category .wrapper ul li{display:flex;align-items:center;column-gap:2rem;width:50%}
#l_modal #search_category .wrapper ul li img{width:8rem}
#l_modal #search_category .wrapper ul li span{font-size:2.5rem}
#l_modal h2.ttl{font-size:3.8rem;margin-bottom:6rem;text-align:center}
#l_modal .close span{font-size:2.5rem;padding:2rem;min-width:40rem}
}
/*# sourceMappingURL=layout.css.map */
