@charset "utf-8";
/*
Theme Name: L-style
Theme URI: http://www./
Description: L-style
Version: 1.0
Author: L-style
Author URI: http://www./
Tags: L-style

*/


@media screen and (max-width: 767px){
	.pc-block{
		display: none;
	}
	.sp-block{
		display: block;
	}
	.flex-box{
			flex-direction: column;
		}
	.button{
		font-size: 20px;
		font-size: 2.0rem;
	}
	.inner {
		max-width: 100%;
		width: 100%;
		margin: 0 auto;
		padding:0 20px;
	}
	.button {
		width: auto;
	}
a.tel{
		font-size: 36px;
		font-size: 3.6rem;
}


/* #menu */

	#menu{
		position:fixed;
		z-index:20;
		right: 10px;
		top: 10px;
		z-index:20;
		width:72px;
		height:72px;
		background:#0d4082;
		border-radius:50%;
		transition:all 0.6s ease;
	}
	body.menu-open #menu{
		background:transparent;
	}
	#menu div.menu-icon{
		position:relative;
		z-index:500;
		width:72px;
		height:72px;
		cursor:pointer;
	}
	#menu div.menu-icon > span{
		position:absolute;
		left:22px;
		width:30px;
		height:1px;
		background:#fff;
		transition:all 0.4s;
	}
	#menu div.menu-icon > span:nth-child(1){top:22px;}
	#menu div.menu-icon > span:nth-child(2){top:32px;}
	body.menu-open #menu div.menu-icon > span:nth-child(1),
	body.menu-open #menu div.menu-icon > span:nth-child(2){
		top:30px;
		left:24px;
	}
	body.menu-open #menu div.menu-icon > span:nth-child(1){
		transform:rotate(45deg);
	}
	body.menu-open #menu div.menu-icon > span:nth-child(2){
		transform:rotate(-45deg);
	}
	body.menu-open #menu div.menu-icon > span{
		width:24px;
		background:#000;
	}
	#menu div.menu-icon > i{
		width: 100%;
		text-align: center;
		position:absolute;
		bottom:15px;
		left:50%;
		transform:translateX(-50%);
		color:#fff;
		font-size:11px;
		font-size:1.1rem;
		font-weight:400;
		line-height:1;
		opacity:1;
	}
	body.menu-open #menu div.menu-icon > i{
		opacity:0;
	}
	#menu div.menu-icon > i.open{}
	#menu div.menu-icon > i.close{
		opacity:0;
	}
	body.menu-open #menu div.menu-icon > i.close{
		opacity:1;
		color:#000;
	}
	#menu div.menu-background{
		visibility:hidden;
		opacity:0;
		position:fixed;
		left:0;
		top:0;
		width:100vw;
		height:100vh;
		z-index:100;
		transition:all 0.6s ease;
	}
	body.menu-open #menu div.menu-background{
		visibility:visible;
		opacity:1;
	}
	#menu div.menu-content{
		visibility:hidden;
		opacity:0;
		position:fixed;
		top:0;
		right:0;
		z-index:999;
		width:100%;
		height:100%;
		display:flex;
		align-items:center;
		overflow-y:scroll;
		transition:all 0.6s ease;
	}
	#menu div.menu-content{
		-ms-overflow-style:none;
		scrollbar-width:none;
	}
	#menu div.menu-content::-webkit-scrollbar{
		display:none;
	}
	body.menu-open #menu div.menu-content{
		visibility:visible;
		opacity:1;
		background:var(--color-bg-01);
	}
	#menu div.menu-content > div{
		max-width:1080px;
		color:#000;
		padding:1.8em 2.4em 4.2em 1.8em;
		margin:0 auto;
		background: #a6cbfa;
		height: 100%;
		width: 100%;
	}
	#menu div.menu-content div.menu-content-body{
		position:relative;
	}
	#menu div.menu-content div.menu-content-body > div.menu-block > div{
		flex-shrink:0;
	}
	#menu div.menu-content div.menu-content-body > div.menu-block > div nav ul{
		margin-top: 13rem;
	}
	#menu div.menu-content div.menu-content-body > div.menu-block > div nav ul li{
		border-bottom: 1px solid #000;
		padding: 1rem;
	}
	#menu div.menu-content div.menu-content-body > div.menu-block > div nav ul li a{
		font-size:18px;
		font-size:1.8rem;
	}





	/*******************
 * main-slider
********************/
	#main-block .slider-img{
		min-height: 100%;
	}
	div.slider-01 div.slide{
		height: 100vh;
		min-height: 100%;
	}
	div.slider-01 div.slide.slick-slide img{
		height: 100%;
		object-fit: contain;
	}
	div.slider-01 div.slide-01{background:url("../images/sp/slider_bg_01.jpg") center;}
	div.slider-01 div.slide-02{background:url("../images/sp/slider_bg_02.jpg") center;}
	div.slider-01 div.slide-03{background:url("../images/sp/slider_bg_03.jpg") center;}


/*******************************
/* main
*******************************/
	header{
		display: none;
	}
	h2{
		font-size: 24px;
		font-size: 2.4rem;
	}
	.sub_title{
		font-size: 16px;
		font-size: 1.6rem;
	}
	#main-block .slider-text{
		left: 0;
		bottom: 1em;
		margin: 0 2rem;
	}
	#main-block .slider-text .text-box {
		padding-right: 0;
	}
	#main-block .slider-text .text-box > p.text span{
		font-size: 40px;
		font-size: 4.0rem;
	}
	#main-block .slider-text .text-box > p.sub_text{
		font-size: 24px;
		font-size: 2.4rem;
	}
	#main-block .slider-text .text-box > p.logo img{
		width: 70%;
	}
	#main-block .slider-text > .button{
		width: auto;
		margin: 2rem 0 0 auto;
		padding: 20px 0px 20px 0px;
		font-size: 16px;
		font-size: 1.6rem;
	}
	#info-block .top_block{
		padding: 0rem 0 0;
	}
	#info-block .top_block .head .head_inner{
		padding: 1rem 2rem 1.6rem;
	}
	#info-block .top_block .head h2{
		margin-top: 1rem;
	}
	#info-block .top_block .body{
		padding: 0 2rem 20rem;
	}
	#info-block .top_block .body p.text{
		text-align: left;
		margin-top: 3rem;
		font-size: 16px;
		font-size: 1.6rem;
	}
	#info-block .top_block .body p.text span {
		display: inline;
	}
	#info-block .top_block .body .img-box#img01{
		bottom: -11.2rem;
		left: 0;
		z-index: 10;
	}
	#info-block .top_block .body .img-box#img02{
		right: 0;
	}
	#info-block .bottom_block .allow::after{
		border-top: 70px solid #1259b3;
	}
	#info-block .bottom_block .title-box{
		padding: 0 2rem;
	}
	#info-block .bottom_block .title-box .title{
		margin-top: 1rem;
		font-size: 36px;
		font-size: 3.6rem;
		line-height: 1.2;
	}
	#info-block .bottom_block div.flex-box .box{
		width: 250px;
		height: 250px;
		padding: 4rem 1rem;
		font-size: 26px;
		font-size: 2.6rem;
	}
	#info-block .bottom_block div.flex-box .box:nth-child(2){
		padding: 2rem 1rem 4rem 1rem;
	}
	#info-block .bottom_block div.flex-box .box+.box{
		margin-top: 2rem;
	}
	#info-block .bottom_block div.flex-box .box .text{
		line-height: 1.4;
		font-size: 16px;
		font-size: 1.6rem;
	}
	#lecturers-block section{
		padding: 4rem 2rem 4rem;
	}
	#lecturers-block section div.flex-box .img-box{
		padding-bottom: 6rem;
	}
	#lecturers-block section div.flex-box .img-box p{
		text-align: center;
	}
	#lecturers-block section div.flex-box .img-box p:after{
		right: 40px;
		width: 200px;
		height: 250px;
		top: 2rem;
	}
	#lecturers-block section div.flex-box .img-box p img{
		width: 60%;
		margin: 0 auto;
	}
	#lecturers-block section div.flex-box .text-box {
		width: auto;
	}
	#lecturers-block section div.flex-box .text-box .head{
		text-align: center;
	}
	#lecturers-block section div.flex-box .text-box .head h2{
		line-height: 1.3;
	}
	#lecturers-block section div.flex-box .text-box .text{
		line-height: 1.4;
		font-size: 16px;
		font-size: 1.6rem;
	}
	#lecturers-block section div.flex-box .text-box .button{
		width: auto;
		margin-top: 3rem;
	}
	#class-block section{
		padding: 4rem 0 6rem;
	}
	#class-block section .head h2{
		line-height: 1.3;
	}
	#class-block section .body {
		margin-top: 4rem;
	}
	#class-block section .body div.flex-box .box{
		width: auto;
		margin: 0 2rem;
	}
	#class-block section .body div.flex-box .box+.box{
		margin-top: 2rem;
	}
	#class-block section .body div.flex-box .box p img{
		width: 100%;
	}
	#news-block section{
		padding: 5rem 0 4rem;
	}
	#news-block section div.flex-box > .box {
		width: auto;
	}
	#news-block section div.flex-box > .box:nth-child(2) .body {
		margin-top: 4rem;
	}
	#news-block section div.flex-box > .box+.box {
	margin-top: 6rem;
	}
	#news-block section div.flex-box .box .head{
	text-align: center;
	}
	#news-block section div.flex-box > .box .body > ul li a{
		padding: 2rem;
	}
	#news-block section div.flex-box > .box .body > ul li a .title{
		margin-top: 1rem;
	}
	#news-block section div.flex-box > .box .body > .button-allow{
		margin-right: 2rem;
	}
	#footer .inner {
		padding: 2rem 2rem 8rem;
	}
	#footer .inner .footer-top{
		display: none;
	}
	#footer .footer-bottom{
		margin-top: 0;
	}
	#footer .footer-bottom .logo img{
		width: 60%;
	}
	#footer .copyright{
		margin-top: 2rem;
	}
	#footer .footer-bottom > div div.flex-box address, #footer .footer-bottom > div div.flex-box p, #footer .footer-bottom > div > p{
		font-size: 14px;
		font-size: 1.4rem;
	}
	#footer .copyright p:nth-child(1) {
		font-size: 12px;
		font-size: 1.2rem;
	}
	#footer-overlay{
		padding: 0.5rem 1rem;
	}
	#footer-overlay div.flex-box > div:nth-child(2){
		display: none;
	}



	body.page .main-image, body.category .main-image, body.archive .main-image, body.single .main-image {
		position: relative;
		width: 100%;
		height: 400px;
	}
	body.page .inner-container-page #inner-top-block section{
		padding: 6rem 2rem 4rem;
	}
	body.page .inner-container-page #inner-top-block .head > h2{
		font-size: 36px;
		font-size: 3.6rem;
	}
	body.page .inner-container-page #inner-top-block .body > .text-box > p.text{
		margin: 2rem auto 0;
		font-size: 16px;
		font-size: 1.6rem;
		text-align: left;
	}
	body.page .inner-container-page #inner-top-block .body > .text-box > .info-img {
		margin-top: 4rem;
	}
	body.page .inner-container-page #inner-top-block .body > .text-box > .info-img img{
		width: 70%;
	}
	body.page .inner-container-page #inner-bottom-block{
		padding: 4rem 2rem 6rem;
	}
	body.page #inner-bottom-block section .body div.flex-box {
		margin-top: 3rem;
	}
	body.page #inner-bottom-block section .body div.flex-box .text-box {
		max-width: 100%;
		margin-left: 0;
		margin-top: 6rem;
	}
	body.page #inner-bottom-block section .body div.flex-box .text-box p.text{
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.4;
	}
	body.page #inner-bottom-block section .body .text-box .w-box dl dt, body.page #inner-bottom-block section .body .text-box .w-box dl dd{
		font-size: 16px;
		font-size: 1.6rem;
	}
	body.page #inner-bottom-block section .body .text-box .w-box dl+dl {
		margin-top: 1rem;
	}
	body.page #inner-bottom-block section .body div.flex-box .text-box .w-box dl dd {
		margin-top: 0;
	}
	body.page #inner-bottom-block section .body div.flex-box .text-box .w-box dl dt span{
		display: block;
	}
	body.page #inner-bottom-block section .body div.flex-box .img-box > p:after{
		width: 320px;
		height: 380px;
		right: -1rem;
		top: 5rem;
	}
	body.page #inner-bottom-block section .body div.flex-box .text-box .w-box dl dd .caution-txt {
		font-size: 12px;
		font-size: 1.2rem;
	}
	body.page #inner-bottom-block section .body .text-box .w-box, body.page #inner-top-block section .body .text-box .w-box {
		margin-top: 2rem;
	}

	body.school .main-image{
		background-image: url(../images/sp/school-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.school .inner-container-page #inner-top-block .body > .text-box > p.title{
		font-size: 24px;
		font-size: 2.4rem;
	}
	body.school .inner-container-page #inner-top-block .body > .text-box > p.text span {
		margin-top: 2rem;
	}
	body.school #inner-bottom-block section .box-block {
		padding: 0 0 3rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner{
		padding: 3rem 2rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .head > h2{
		line-height: 1.2;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body{
		margin-top: 4rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .img-layout {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 10rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .text span {
		display: inline;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .tel-box {
		margin-top: 20rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .tel-box > a.tel{
		padding: 0 2rem;
		width: 100%;
	}
	body.school #inner-bottom-block section .box-block:nth-child(2) .box-block-inner .body {
		margin-top: 2rem;
	}
	body.school #inner-bottom-block section .box-block:nth-child(2) .box-block-inner .head > h2{
		margin-top: 0rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .map-box {
		margin-top: 2rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .chart-box {
		margin-top: 3rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .chart-box > table{
		font-size: 16px;
		font-size: 1.6rem;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .chart-box > table tr th{
		width: auto;
		display: block;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .chart-box > table tr td{
		display: block;
		padding: 1.5rem;
		border-left: 1px solid #717070;
		line-height: 1.5;
	}
	body.school #inner-bottom-block section .box-block .box-block-inner .body .chart-box > table tr:nth-child(2) td{
		text-align: center;
	}


	body.lessons-class-junior .main-image{
		background-image: url(../images/sp/junior-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.lessons-class-junior #inner-bottom-block section .body {
		padding-bottom: 0rem;
	}
	body.lessons-class-general .main-image{
		background-image: url(../images/sp/general-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.lessons-class-general #inner-bottom-block section > div+div{
		margin-top: 5rem;
	}
	body.lessons-class-general #inner-bottom-block section > div:nth-child(2) .body div.flex-box{
		flex-direction: column-reverse;
	}
	body.lessons-class-general #inner-bottom-block section div:nth-child(even) .body div.flex-box .text-box{
		margin-left: 0;
		margin-right: 0;
	}
	body.lessons-class-general #inner-bottom-block section div:nth-child(even) .body div.flex-box .img-box > p:after{
		left: -1rem;
	}
	body.lessons-class-general #inner-bottom-block section .body div.flex-box .img-box > p:after{
		height: 400px;
	}
	body.lessons-class-general #inner-bottom-block section .body {
		padding-bottom: 0rem;
	}
	body.lessons-class-adult .main-image{
		background-image: url(../images/sp/adult-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.lessons-class-adult #inner-bottom-block section .body div.flex-box .text-box{
		margin-top: 4rem;
	}
	body.lessons-class-adult #inner-bottom-block section .body {
		padding-bottom: 0;
	}
	body.lecturers .main-image{
		background-image: url(../images/sp/lecturers-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.lecturers .body div.w-box div.flex-box .img-box {
		min-width: 100%;
	}
	body.lecturers .body div.w-box div.flex-box .img-box img{
		width: 70%;
	}
	body.lecturers .body div.w-box div.flex-box .text-box {
		width: auto;
		margin-left: 0;
	}
	body.lecturers .body div.w-box div.flex-box .text-box .head{
		margin-top: 1rem;
		flex-direction: column;
		align-items: center;
	}
	body.lecturers .inner-container-page #inner-top-block .body div.w-box {
		margin-top: 4rem;
		padding: 4rem 2rem;
	}
	body.lecturers .inner-container-page #inner-top-block .body div.w-box div.flex-box .text-box .head h2{
		font-size: 24px;
		font-size: 2.4rem;
	}
	body.lecturers .inner-container-page #inner-top-block .body div.w-box div.flex-box .text-box .head h2 span{
		margin-bottom: 0;
		font-size: 18px;
		font-size: 1.8rem;
		text-align: center;
	}
	body.lecturers .inner-container-page #inner-top-block .body div.w-box div.flex-box .text-box .head .sub_title{
		font-size: 14px;
		font-size: 1.4rem;
		margin-top: 1rem;
	}
	body.lecturers .body div.w-box div.flex-box .text-box .text{
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.8;
		margin-top: 3rem;
	}
	body.contact .main-image{
		background-image: url(../images/sp/school-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.contact #inner-top-block .formblock {
		width: auto;
		margin: 40px auto 0;
	}
	body.contact #inner-top-block .formblock dl{
		flex-direction: column;
	}
	body.contact #inner-top-block .formblock dl dt{
		width: auto;
		padding: 10px;
	}
	body.contact #inner-top-block .formblock dl dd{
		width: 100%;
		margin-left: 0;
	}
	body.contact #inner-top-block .formblock dl dd input[type="text"], body.contact #inner-top-block .formblock dl dd input[type="email"], body.contact #inner-top-block .formblock dl dd input[type="tel"], body.contact #inner-top-block .formblock dl dd input[type="email"],body.contact #inner-top-block .formblock dl dd textarea{
		width: 100%;
		height: auto;
	}
	body.contact #inner-top-block .formblock .button-erea{
		margin-top: 4rem;
	}
	body.contact #inner-top-block .formblock input[type="submit"]{
		width: 100%;
		font-size: 20px;
		font-size: 2.0rem;
	}
	body.contact #inner-top-block .formblock .button-erea p span:after{
		right: 4em;
	}
	body.contact #inner-top-block .formblock .button-erea p span{
		width: auto;
	}
	body.category .main-image{
		background-image: url(../images/sp/school-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.category  #news-block section .head {
		text-align: center;
	}
	body.category #news-block section .body > ul li a{
		padding: 2rem;
	}
	body.single .main-image{
		background-image: url(../images/sp/school-main.jpg);
		background-size: cover;
		background-position: center;
	}
	body.single div.inner-container-page {
		padding: 4rem 2rem 6rem;
	}
	body.single div.inner-container-page section .body .title{
		font-size: 24px;
		font-size: 2.4rem;
	}
	body.single div.inner-container-page section .body .data{
		font-size: 16px;
		font-size: 1.6rem;
	}
	body.single div.inner-container-page section .body .post-texterea {
		margin-top: 2rem;
	}