@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500;700&family=Ubuntu:wght@700&display=swap');

/* ===== base ===== */
:root {
	font-size: 16px;
	line-height: 1.8;
}
body {
	color: #5a5a5a;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	padding-top: 86px;
	overflow-x: hidden;
}


a,a:visited {
    color: #716f63;
    transition: opacity 300ms 0s ease;
    text-decoration: none;
}
a:hover {
    opacity: 0.7;
    /*text-decoration: underline;*/
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    margin: 0;
    padding: 0;
}

p{
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/**パンくず**/
#bread_box{ }
#bread_list{
padding: 0.75em 1em;
display: flex;
}
#bread_list li{
display: inline-block;
font-size: 0.8rem;
letter-spacing: 0.1em;
}
#bread_list li a,#bread_list li span{
padding-left: 0.5em;
padding-right: 0.5em;
color: #373737;
}
#bread_list li:before{
	content: "＞";
	display: inline-block;
	font-size: 0.7em;
	line-height: 2em;
	vertical-align: baseline;
	height: 2em;
}
#bread_list li:first-child:before{
display: none;
}


/**電話番号リンク**/
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}


/**section**/
section[id*="sect_"]{
padding: 70px 0px 100px 0px;
}
#bread_box + section[id*="sect_"]{
padding-top: 40px;
}

/**BOX**/
[class*="wth_"]{ margin-left: auto;	margin-right: auto; padding-left: 50px; padding-right: 50px;}
[class*="wth_600"]{ max-width: 600px;}
[class*="wth_700"]{ max-width: 700px;}
[class*="wth_800"]{ max-width: 800px;}
[class*="wth_900"]{ max-width: 900px;}
[class*="wth_1000"]{ max-width: 1000px;}
[class*="wth_1100"]{ max-width: 1100px;}
[class*="wth_1200"]{ max-width: 1200px;}
[class*="wth_1300"]{ max-width: 1300px;}
[class*="wth_1400"]{ max-width: 1400px;}
[class*="wth_1500"]{ max-width: 1500px;}
[class*="wth_1600"]{ max-width: 1600px;}
[class*="wth_1700"]{ max-width: 1700px;}
[class*="wth_1800"]{ max-width: 1800px;}
[class*="wth_1900"]{ max-width: 1900px;}
[class*="wth_2000"]{ max-width: 2000px;}
[class*="wth_"][class*="_nopad"]{ padding-left: 0px!important; padding-right: 0px!important;}
[class*="wth_"][class*="_nomarg"]{ margin-left: 0;	margin-right: 0;}

/**縦分割フォーマット**/
[class*="col_"]{ display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:-moz-flex;display:flex;justify-content: left;flex-wrap: wrap;overflow: hidden;}
[class*="col_"]>*{ position: relative; }
[class*="col_02"]>* { width: 49%; margin-right: 2%;}
[class*="col_02"]>*:nth-of-type(2n){ margin-right: 0px!important;}
[class*="col_02"]>*:last-child{margin-right: 0px!important;}
[class*="col_03"]>*{ width: 32%; margin-right: 2%;}
[class*="col_03"]>*:nth-of-type(3n){margin-right: 0!important;}
[class*="col_03"]>*:last-child{margin-right: 0px!important;}
[class*="col_04"]>*{ width: 23.5%; margin-right: 2%;}
[class*="col_04"]>*:nth-of-type(4n){margin-right: 0px!important;}
[class*="col_04"]>*:last-child{margin-right: 0px!important;}
[class*="col_"]>* img{ width: 100%; height:auto; }





/* PC,SP表示切替 */
[class*="pc_only"]{ display: inline-block!important; }
.pc_onlyBL{ display: block!important;}
.pc_onlyIN{	display: inline!important;}
[class*="sp_only"]{ display: none!important; }

/**text-align**/
[class*="taln"][class*="_left"]{ text-align: left!important;}
[class*="taln"][class*="_center"]{ text-align: center!important;}
[class*="taln"][class*="_right"]{ text-align: right!important;}

/**float**/
[class*="fl_"][class*="right"]{float: right; padding-left: 2em; padding-bottom: 2em;}
[class*="fl_"][class*="left"]{float: left; padding-right: 2em; padding-bottom: 2em;}

/**font-size**/
[class*="fper_"][class*="-Dbl"]{ display: block;}
[class*="fper_"][class*="-Dib"]{display: inline-block;}
[class*="fper_"][class*="-Din"]{display: inline;}
[class*="fper_50"]{ font-size: 50%;}
[class*="fper_75"]{ font-size: 75%;}
[class*="fper_100"]{ font-size: 100%;}
[class*="fper_125"]{ font-size: 125%;}
[class*="fper_150"]{ font-size: 150%;}
[class*="fper_200"]{ font-size: 200%; line-height: 1.4em; margin-left: 0.1em; margin-right: 0.1em;}
[class*="fper_250"]{ font-size: 250%;}
[class*="fper_300"]{ font-size: 300%;}



/**table**/
table.tab_def01{ width: 100%;}
table.tab_def01 tr>*{ text-align: left; border-right: 1px solid #bfbfbf; border-bottom: 1px solid #bfbfbf;}
table.tab_def01 tr:first-child>*{ border-top: 1px solid #bfbfbf;}
table.tab_def01 tr>*:last-child{ border-right-style: none;}


table.tab_def01 tr th{ background-color: #acacac; padding: 1em;	color: #FFFFFF;	line-height: 1.4em;}
table.tab_def01 tr td{ padding: 0.5em 1em; background-color: #ffffff; vertical-align: middle;}

table.tab_def01 tr:nth-child(2n) td{ background-color: #f2f2f2;}
table.tab_def01 tr:nth-child(2n) th{ background-color: #a2a2a2;}
table.tab_def01+table.tab_def01{ margin-top: 3em;}

/**見出し下**/
.lead_txt{}
.lead_txt small{ display: block; padding-top: 3em;}

/**見出し**/
[class*="mid_Ltitle"]{
	text-align: center;
	font-weight: bold;
	font-size: 2rem;
	position: relative;
	margin-bottom: 1.6em;
	line-height: 1.4em;
	padding: 0 1.5em 1em 1.5em;
	display: block;
	letter-spacing: 0.1em;
	border-bottom: 1px dashed #B9B9B9;
}
[class*="mid_Ltitle"][class*="_noul"]{ border-bottom-style: none; margin-bottom: 0;}
[class*="mid_Ltitle"] small{ font-size: 75%;}
[class*="mid_Ltitle"] img.title_mark{ height:100px; margin: auto; display: block; margin-bottom: 0.2em;}
[class*="mid_Ltitle"] em{ font-style: normal; color: #ffa10e;}

.mid_Ltitle-white{ color: #ffffff;}
.mid_Ltitle-white:before,.mid_Ltitle-white:after{ background-color: #ffffff;}


[class*="mid_Mtitle"]{
	font-size: 2em;
	line-height: 1.4em;
	text-align: center;
	padding:1em;
	margin-bottom: 1em;
	padding-bottom: 0.5em;
}
[class*="mid_Mtitle"]:before{ content: "「"; margin-right: 0.5em;}
[class*="mid_Mtitle"]:after{ content: "」"; margin-left: 0.5em; }

[class*="mid_S1title"]{font-weight: bold; position: relative; padding-bottom: 1em; margin-bottom: 0.5em; text-align: center; font-size: 2rem;}
[class*="mid_S1title"]:after{ content: ""; position: absolute; display: block; width: 1px; height: 0.75em; bottom: 0px; margin: auto; left: 0; right: 0; background-color: #000000;}

.item_name{
	font-size: 1.4em;
	line-height: 1.6em;
	text-align: center;
	padding-bottom: 2em;
}

/**吹き出しセット**/
[class*="fd_box"]{ display: inline-block; line-height: 1.4em; position: relative; font-size: 1rem; color: #FFF;text-align: center;}
[class*="fd_box"]:after{ border: solid transparent; content:''; height:0; width:0; pointer-events:none; position:absolute; border-color: rgba(0, 0, 0, 0); border-top-width:18px; border-bottom-width:18px; border-left-width:18px; border-right-width:18px; margin-left: -18px; top:calc(100% - 9px); left:50%;}

/**角丸セット**/
[class*="kdmaru"]{ border-radius: 8px; overflow: hidden }
[class*="kdmaru"][class*="_notop"]{ border-top-left-radius: 0; border-top-right-radius: 0;}
[class*="kdmaru"][class*="_nobottom"]{ border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
[class*="kdmaru"][class*="_visib"]{overflow: visible;}

/**体験レッスンエリア**/
section.lesson_conv{ font-size: 1.5rem; margin-top: -1.5em;}
.conv_mark{ width:auto; height: 2.5em; position: relative; z-index: 10; margin: auto; display: block;}
.conv_box{background-color: #ffa10e; overflow: hidden; position: relative; margin-top: -1em; color: #fff; z-index: 9; padding:2em 0 1em 0; }
.conv_box p{padding-bottom: 0.5em;} 
.conv_box:before,.conv_box:after{ content: ""; position: absolute; top:0; bottom: 0; background-color: #ff8f0a; height: 300px; width: 600px; margin: auto; z-index: 8;}
.conv_box:before{left:-350px;transform:rotate(60deg); }
.conv_box:after{right:-350px;transform:rotate(-60deg); }
.conv_box .btn_box{position:relative; z-index: 9;}

/**配下ページタイトル**/

section#sub_pagettl{ height: 350px;	background-repeat: no-repeat; background-position: center center; background-size: cover; display: flex; justify-content: center; align-items: center;}
section#sub_pagettl [class*="mid_Ltitle"]{ color: #FFFFFF;	margin-bottom: 0.8em;}

/**yutubeボックス**/
.ytube_box{ position: relative; width:70%; margin:0 auto;}
.ytube_box:before{ content:""; display: block; padding-top: 56.25%;}
.ytube_box iframe{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height:100%;}

/**フローティングバナー**/
#sticky_btn{ display: none;}

/**カタログコード入力**/
table.input_table th,table.input_table td{widh:100%;display: block;}
table.input_table th{font-size: 1.3em;margin-bottom: 1rem;}
table.input_table td input{width: 100%;
    border-radius: 15px;
    background-color: #f5f8fa;
    height: 40px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    color: #33475b;
    border: 1px solid #cbd6e2;
    padding: 0 15px;}
div.btn{text-align: center;}
div.btn input{padding: 10px 24px;
    border-radius: 10px;
    background: #ff7a59;
    color: #FFF;
    font-weight: bold;
    font-size: 1em;
	margin-top: 1rem;
	border: none;}


@media screen and (max-width: 980px) {
	body { padding-top: 70px; }
	}

/* ##### responsive ##### */
@media screen and (max-width: 760px) {
	:root { font-size: 14px;}
	article { position: relative;}
    body { max-width: 100vw; overflow-x: hidden;}

	/**パンくず**/
	#bread_list{
	display: block;
	padding-left: 3vw;
	padding-right: 3vw;
	}
	#bread_list li{}
	#bread_list li a,#bread_list li span{}
	#bread_list li:before{}
	#bread_list li:first-child:before{}

    /**電話番号リンク**/
    a[href*="tel:"] {
    pointer-events: auto;
    } 
    
    
	/**BOX**/
	[class*="wth_"]{width: 100%; padding-left: 3.5%;padding-right: 3.5%;}
    [class*="wth_"][class*="-full"]{ padding-left: 0px!important; padding-right: 0px!important; }

	/**縦分割フォーマット**/
    [class*="col_"]{}
	[class*="col_"]>*{ margin-bottom: 1.5em;}
    [class*="col_02"]>*{}
    [class*="col_03"]>*{ width: 48.5%; margin-right: 3%;}
    [class*="col_03"]>*:nth-of-type(3n){margin-right: 3%!important;}
	[class*="col_03"]>*:nth-of-type(2n){margin-right: 0;}
	[class*="col_03"]>*:last-child{margin-right: 0px!important;}
	
	
	[class*="col_04"]>li{ width: 48.5%; margin-right: 3%; }
    [class*="col_04"]>li:nth-of-type(2n){ margin-right: 0px;}
	[class*="col"][class*="-single"]>*{ margin-right: 0px!important; margin-left: 0px!important; width: 100%!important;}

    /**section**/
    section[id*="sect_"]{
    padding: 40px 0px 80px 0px;
    }
	#bread_box + section[id*="sect_"]{ padding-top: 10px;}
    /* PC,SP表示切替 */
    [class*="pc_only"]{ display: none!important; }
    [class*="sp_only"]{ display: inline-block!important;; }
    .sp_onlyBL{ display: block!important;}
    .sp_onlyIN{ display: inline!important;}
 

	/**見出し**/
	[class*="mid_Ltitle"]{ font-size: 1.5rem; padding: 0 0.5em 1em 0.5em; }
	[class*="mid_Ltitle"][class*="_noul"]{ }
	[class*="mid_Ltitle"] small{ font-size: 75%;}
	[class*="mid_Ltitle"] img.title_mark{ height:60px;}
	[class*="mid_Ltitle"] em{ }

	[class*="mid_Mtitle"]{ font-size: 1.4em; }

	[class*="mid_S1title"]{ font-size: 1.4rem;}
	[class*="mid_S1title"]:after{ }


	.item_name{
		font-size: 1.2em;
	}
	/**float**/
	[class*="fl_"][class*="-SPnone"]{ float: none!important; padding:0!important;}

	/**table**/
	table.tab_def01{ }
	table.tab_def01 tr>*{}
	table.tab_def01 tr th{ padding: 0.75em; white-space: nowrap;}
	table.tab_def01 tr td{ padding: 0.5em; vertical-align: middle;}
	
	
	/**見出し下**/
	.lead_txt{ text-align: left;}
	.lead_txt small{ }


	/**体験レッスンエリア**/
	section.lesson_conv{ font-size: 1.2rem; margin-top: 0}
	.conv_mark{ display: none;}
	.conv_box{ margin-top: 0; padding:0.5em 0 0.5em 0; }
	.conv_box p{padding-bottom: 0.5em;} 
	.conv_box:before,.conv_box:after{ width: 430px;}

	/**配下ページタイトル**/

	section#sub_pagettl{
	height: 100vw; max-height: 350px;}

	.ytube_box{
		width: 100%;
		float: auto;
		margin-top: 1em;
	}
	.ytube_box img{
		width: 100%;
		height: auto;
	}


	/**フローティングバナー**/
	#sticky_btn{
		display: block;
		position: fixed;
		bottom: -100px;
		width: 100%;
		z-index:80;
		transition: all 300ms 0s ease;
		opacity: 0;
		}
	#sticky_btn .conv_box { padding: 1.4em 0 1em 0;}
	#sticky_btn .conv_box .btn_box{overflow:visible;}
	#sticky_btn.fbtn_on{ display: block; opacity: 1; bottom: 0; }
	#sticky_btn .float_btn{	font-size: 1.4rem;	margin-bottom: 0!important;}

	#sticky_btn .float_btn .free_pop{
		position: absolute;
		top: 0px;
		left: 0px;
		font-size: 75%;
		margin-top: -1em;
		margin-right: auto;
		margin-left: auto;
		margin-bottom: auto;
		right: 0px;
		color: #fff;
		background-color: #1191ea;
		display: inline-block;
		width: 15em;
		border-radius: 4px;
		padding:0;
		text-align: center;
		animation: pop_anime 2s ease-out infinite;
		opacity: 1;
	}

	@keyframes pop_anime { 0%, 40%, 60%, 80% { transform: scale(1.0); } 50%, 70% { transform: scale(0.9);} }

	#sticky_btn .float_btn .free_pop:before{
	  content: "";
	  position: absolute;
	  top: 100%;
	  left: 50%;
	  margin-left: -6px;
	  border: 6px solid transparent;
	  border-top: 6px solid #1191ea;
	}


}
