@charset "UTF-8";
/* CSS Document */

@import url("reset.css");

html {font-size: 62.5%;
	scroll-behavior: smooth;
}
body {font-size: 1.6em; font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}
.sp_only, .tb_only {display: none!important;}
a:hover {opacity: 0.8;}
.yellow {color: #F6F600;}

.txt22 {font-size: 2.2rem;}
.txt28 {font-size: 2.8rem;}
strong {font-weight: bold;}

a[href^="tel:"]:hover {
		color: #333;
		opacity: 100;
		text-decoration: none;
}
@media (min-width: 751px) {
	a[href^="tel:"] {
		pointer-events: none;
		cursor: none;
	}
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

p {font-size:16px; line-height:1.8; text-align: justify; color:#000;}

a {text-decoration:none; color:#1111cc;}
a:hover {text-decoration:underline; color:#2020A6; }
a:hover img {-moz-opacity:0.8; opacity:0.8; filter: alpha(opacity=80); background:#ffffff;}
#header #logo a:hover img {-moz-opacity:1; opacity:1; filter: alpha(opacity=100); background:none;}

img {
    max-width: 100%;
    height:auto;
}

.pc_br {display:block;}

.sp_only img,
img.sp_only {width: 100%;}

@media screen and (min-width:769px){
.tablet_only {display:none;}
.tb_br {display:block;}
}

@media screen and (min-width:741px){
.sp_only {display:none;}
.pc_br {display:block;}
}
@media screen and (max-width:740px){
.sp_only {display:block;}	
}

/*--------------------------------------------------------------------------------------------
　　全ページ 共通部分
--------------------------------------------------------------------------------------------*/
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","HiraKakuPro-W3", "メイリオ",Meiryo, "ＭＳ Ｐゴシック" ,Arial,Helvetica,sans-serif;
}
#header_wrapper {width:100%;
  background-color: #fff;
  position: relative;
	border-bottom: solid 2px #E8E8E8;
}
#header {
  max-width:960px;
  margin:0 auto;
  position: relative;
}

@media screen and (max-width:740px){
	#header_wrapper::before {content: none;}
}

#footer {clear:both;}

/* ページの先頭へ */
#totop {position:fixed; bottom:130px; right:20px; z-index:11;}
#totop a {display:block; width:60px; height:60px; background:url(../images/common/totop.png) no-repeat left top; text-indent:-9999px; overflow:hidden;}
#totop a:hover {-moz-opacity:0.8; opacity:0.8; filter: alpha(opacity=80);}
* html #totop a {display:none;}

.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

p.note {
	font-size: 1.2rem;
	text-indent: -1em;
	padding-left: 1em;
	line-height: 1.2;
}

.top_inner {width: 100%; max-width: 960px; margin: 0 auto;}
h2.title_bluebg {font-size:2.7rem; text-align: center; background: #036EB2; color: #FFF; padding: 45px 0; font-weight: bold; letter-spacing: 1px;}
h3.title {font-size: 2.8rem; color: #333; text-align: center; font-weight: bold;}
.tel_link {color: #333;}

/* ヘッダー ============================================================= */
#header {display: flex; justify-content: space-between; align-items: center; padding: 20px 0; position: relative;}
#header #logo {position: relative; width: 448px;}
#header #logo h1 {
		display: inline-block;
		max-width: 448px;
		width: 100%;
		height: 70px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(../images/common/logo.png) no-repeat left top;
}


/* グローバルナビ ============================================================= */
#nav_wrapper {width:100%; background:#036EB2;}

@media screen and (min-width:741px){
#sp_nav {display:none;}
#nav_btn {display:none;}
#nav {max-width: 960px; margin:0 auto;}
#nav ul {display: table; table-layout: auto; width: 100%; position: relative;}
#nav ul li.hover,#nav ul li:hover {position: relative;}
#nav ul li {text-align:center; display: table-cell; width:16%; line-height:1.4; vertical-align: middle;}
	
#nav ul li a {display:block; color:#FFF; text-decoration:none; padding:28px 2px 28px 5px; letter-spacing:0.06em; font-size:100%; line-height:1.0; font-weight:bold;}
	
#nav ul li a.cate small {font-size:74%; color:#E6F1F7;}
#nav ul li ul {visibility: hidden; position: absolute; top: 100%; left: 0; background: #E4E4E4; -moz-opacity:0.90; opacity:0.90; filter: alpha(opacity=90); z-index:98;}
#nav ul li ul a, #nav ul li:first-child ul a {padding:0; width:100%; display:block; border-bottom:1px dotted #666;}
#nav ul li ul a li {padding:0 0 12px 10px; width:100%; height:15px; text-indent:0px; color:#000; font-size:84%; line-height:1.4; text-shadow:1px 1px 0 #FFF; border-bottom: 1px solid #FFF; border:0; text-align:left; letter-spacing:0;}
#nav ul li ul a li:first-child {padding:12px 0 12px 10px;}
#nav ul li ul a:hover, #nav ul li ul a:hover li {width:100%; background:#FA7E19; -moz-opacity:1; opacity:1; filter: alpha(opacity=100);}
#nav ul li ul a li span {text-indent:0; background:url(../images/common/arrow2.gif) no-repeat left center; background-size:6px; padding-left:10px;}
}
@media screen and (max-width:960px){
#nav ul li a {font-size:80%;}

}
@media screen and (max-width:768px){
#nav ul li a {font-size:88%;}
#nav ul li ul {display:none;}
}
@media screen and (max-width:768px){

#nav {position: absolute; top:80px; right:0; margin:0 2% 0 2%; padding:5% 5% 1% 5%; display: none; clear: both; z-index:99; width:96%; 
	background-image: linear-gradient(90deg, #00164a, #0068b6 50%, #036eb7);
}
	
#nav:after { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
#nav:after { border-color: rgba(243, 233, 235, 0); border-bottom-color:#96BD2C; border-width:0 6px 14px 6px; right: 5%; }
#nav ul {display: block;}
#nav ul li {display: block; margin-bottom:5%; width: 100%;}
#nav ul li a {color:#FFF; text-decoration: none; font-size:90%;}
#nav ul li a.cate {background:#FFF; color:#333; font-weight:bold; display:block; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; line-height:1.3; text-align: center;}
#nav ul li a span {display: block; background:url(../images/common/arrow1.gif) no-repeat 4% center; background-size:6px; padding:0 2%;}
#nav ul li ul {position:relative; display:block;}
#nav ul li ul li {margin-bottom:0;}
#nav ul li.hover ul,#nav ul li:hover ul {visibility:visible;}
#nav ul li.hover ul li,#nav ul li:hover ul {visibility:visible;}
#nav ul li ul a {text-decoration:underline;}
#nav ul li ul a li span {background:url(../images/common/arrow3.gif) no-repeat 4% center; background-size:6px; padding:4% 2% 4% 8%;}

#nav_btn {border-left:1px solid #96BD2C; margin-bottom:8%;}
#nav_btn ul li {border-right:1px solid #96BD2C; border-bottom:1px solid #96BD2C; /*width:32.9%;*/ width:100%; float:left; margin:0; padding:0; line-height:1;}
#nav_btn ul li img {width:100%; padding:0; margin:0; vertical-align:top;}

#sp_nav {border-top:1px solid #FFF; border-right:1px solid #FFF; box-shadow: 0 2px 6px #999; width: 100%; background:#F1E537;}
#sp_nav ul {width: 100%;}
#sp_nav ul li {text-align:center; float:left; width:49.8%; border-left:1px solid #FFF; border-bottom:1px solid #FFF; line-height:1.2;}
#sp_nav ul li a {display:block; color:#333; text-decoration:none; padding:8% 0; font-size:90%;}
#sp_nav ul li a small {font-size:70%; color:#E6F1F7;}
}
@media screen and (max-width:750px){
	#nav ul li a.cate {padding: 5%; margin-left: 0;}
	#nav {top:74px;}
}
@media screen and (max-width:740px){
	#nav {padding:5% 5% 1% 5%;}
}


@media screen and (min-width:769px){p#menu {display:none;}}

@media screen and (max-width:800px){
	#header #logo {width: 80%; padding-left: 1%;}
	#header #logo h1 {
		width: 100%;
		height: 0;
		padding-top: 50px;
		background-size: contain;
	}
}

@media screen and (max-width:768px) {
  #header #logo {margin:10px 0 5px 5%; width: 100%;}
}
/* SP ヘッダー */
@media screen and (max-width:768px){
	#header_wrapper {position:relative; background:#FFF; padding:0 0 0 0;}
	#header {display: block; padding: 2px 0 0 0;}
	#header #logo {width:80%; margin:2% 0 2% 10px;}
	#header ul {clear:both; float:none; margin:0; width:100%; border-top:1px solid #CCC; border-bottom:1px solid #CCC; display: none;}
	#header ul li {margin:0 0 0 3%; border:0; border-radius:0; background:none; display: inline-block;}
	#header ul li:hover {background:none;}
	#header ul li a {font-size:80%; margin:0; padding:12px; color:#555;text-decoration:none;display:inline-block; position: relative;}
	#header ul li a:before {content:""; display: block; width: 0;
    height: 0;
    border-top: solid 6px transparent;
    border-right: solid 6px transparent;
    border-bottom: solid 6px transparent;
    border-left: solid 6px #EA0070;
	position: absolute; left:0; top: 50%;
	transform: translateY(-50%);
  -webkit- transform: translateY(-50%);
	}
	#header ul li a span {font-size:100%; vertical-align:middle; color:#E41962;}
	p#menu {width:50px; float:right; margin-top:2%; margin-right:2%;}
	p#menu img {width:100%;}
}
/* PC ヘッダー */
@media screen and (min-width:769px){
	#header ul {display: flex; flex-wrap: wrap; width: 44%; align-items: center; right: 0; justify-content: space-between;}
	#header ul li {width: 31%;}
	#header ul li a {color:#FFF; background:#E98400; padding:16px 0; font-size:18px; display: block; font-weight: bold; text-align: center;}
	#header ul li a:hover {text-decoration:none; opacity: 0.8;}
}


/* フッター ============================================================= */
#footer_wrapper {width:100%;}
#copyright {font-size: 10px; padding:30px 20px; text-align: center;}

@media screen and (max-width:768px){
#footer {padding:4%; width:92%; margin: 0 auto 120px;}
#footer_menu {width:100%; margin:0 0 15px 0;}
#footer_sitemap {width: 100%; float: left; margin-bottom:50px;}
}

@media screen and (max-width:740px){
	#copyright {margin-bottom:40px; padding:20px;}
}

/* フローティングバナー floatingBanner */

#floating_banner {
	position: fixed;
	right: 0;
	bottom: 0;
	background-color: #FFF;
	width: 380px;
	display: none;
	z-index: 200;
}

#floating_banner img {
	width: 100%;
}

#btn_delete {
background-color: rgb(80, 80, 80);
position: absolute;
height: 30px;
width: 30px;
padding: 0;
border: 0;
cursor: pointer;
opacity: 0.8;
top: 0; 
right: 0;
}

/* フローティングバナーのdeleteボタンのバツ */

#btn_delete::before, #btn_delete::after { /* 共通設定 */
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 2px; /* 棒の幅（太さ） */
	height: 20px; /* 棒の高さ */
	background: #FFF;
	border-radius: 2px; /* 棒の四隅の丸み*/
}

#btn_delete::before {
	transform: translate(-50%,-50%) rotate(45deg);
}

#btn_delete::after {
	transform: translate(-50%,-50%) rotate(-45deg);
}
/* メインビジュアル
------------------------------ */

#mainvisual{
	padding: 60px 0 40px 0;
}

#mainvisual img{
  width:100%;
  vertical-align:bottom;
}

#mainvisual .slick-prev { left: 25px; z-index: 1;}
#mainvisual .slick-next { right: 25px; }
#mainvisual .slick-prev:before,
#mainvisual .slick-next:before { font-size: 28px;}

@media screen and (max-width:768px) {
	#mainvisual{
		padding: 40px 0 10px 0;
	}
}

@media screen and (max-width:740px) {
#mainvisual{ padding: 8% 0 2% 0; margin-top: 0; }
#mainvisual .slick-prev { left: 2%; z-index: 1;}
#mainvisual .slick-next { right: 2%; }
#mainvisual .slick-prev:before,
#mainvisual .slick-next:before { font-size: 20px; }
}

/*---------------
　  clearfix
---------------*/
.clearfix:after {
	 visibility: hidden;
	 display: block;
	 font-size: 0;
	 content: " ";
	 clear: both;
	 height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/*---------------------------
　　特長
---------------------------*/
#point .catch {
	text-align: center;
	font-size: 3.2rem;
	font-weight: 900;
	line-height: 1.6;
	padding: 50px 0 80px;
}
#point .catch strong {
	color: #D10050;
}
#point .catch strong .marker {
	background:linear-gradient(transparent 74%, #FFEB00 0%);
}

/* 点数アップ */
.score_up {padding-bottom: 100px;}
.score_up__inner {
	background: #E6EEF4;
	padding: 40px;
}

.score_up__title {
	background: #036EB0;
	padding: 20px;
	border-radius: 40px;
	text-align: center;
	max-width: 960px;
	margin: 0 auto 30px;
}

.score_up__title h2 {
	position: relative;
	color: #FFF;
	font-size: 2.8rem;
	display: inline-block;
	text-align: center;
	margin: 0 auto;
	font-weight: 900;
	line-height: 1.2;
}
.score_up__title h2 strong {
	color: #FFEF00;
}

.score_up__title h2:before {
	position: absolute;
	display: block;
	content: "";
	width: 110px;
	height: 90px;
	background: url("../images/page/icon_scoreup.png") no-repeat center center;
	background-size: contain;
	left: -120px;
	top: 50%;
	transform: translateY(-50%);
}
.score_up__inner .flex li {
	width: 24%;	
}

#point .campain {max-width: 730px; margin: 60px auto; display: block;}
.difference {
	background: #E8F0F6;
	margin-bottom: 80px;
}
.difference h2 {
	margin-bottom: 50px;
}
.refund_pc {
	padding-bottom: 100px;
	margin: 0 auto;
	display: block;
}

.worries {
	position: relative;
	text-align: center;
}
.worries:before {
	content: "";
	display: block;
	position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 30px solid transparent;
  border-left: 30px solid transparent;
  border-top: 30px solid #f1f1ec;
  border-bottom: 0;
	bottom: -50px;
	left: 50%;
	transform: translateX(-50%);
}
.worries:after {
	content: "";
	display: block;
	position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 30px solid transparent;
  border-left: 30px solid transparent;
  border-top: 30px solid #f1f1ec;
  border-bottom: 0;
	bottom: -90px;
	left: 50%;
	transform: translateX(-50%);
}

.worries .title {
	position: absolute;
	display: inline-block;
	padding: 20px;
	min-width: 400px;
	text-align: center;
	font-size: 2.4rem;
	color: #036EB2;
	border: solid 2px #036EB2;
	background: #FFF;
	font-weight: 900;
	margin: 0 auto;
	border-radius: 40px;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
}

.noproblem {text-align: center; margin-top: 110px;}
.noproblem .title {
	position: relative;
	display: inline-block;
	padding: 26px 0;
	margin-bottom: 36px;
	color: #036EB2;
	font-size: 2.6rem;
	font-weight: bold;
	background: url("../images/page/bg_underline.png") repeat-x center bottom;
	background-size: 70%;
}
       
.noproblem .title:before {
	position: absolute;
	left: -50px;
	top: 0;
	content: "";
	width: 1px;
	height: 100%;
	background: #036EB2;
	border-radius: 3px;
	transform: rotate(-30deg);
}
       
.noproblem .title:after {
	position: absolute;
	content: "";
	right: -50px;
	top: 0;
	width: 1px;
	height: 100%;
	background: #036EB2;
	border-radius: 3px;
	transform: rotate(30deg);
}

.guarantee {
	background: #FFF8F9;
	border: solid 3px #D70051;
	max-width: 800px;
	margin: 0 auto;	
}

.guarantee__inner {
	padding: 20px 50px;
}

.guarantee h3.title {
	background: #D70051;
	text-align: center;
	padding: 10px 20px;
}

.guarantee__inner .flex img {
	width: 47%;
}

.guarantee__inner__text {
	text-align: center;
	border-bottom: solid 2px #BBB;
	padding: 0 0 20px;
	margin-bottom: 20px;
}

.guarantee__inner__text strong {
	color: #D70051;
}

.guarantee__inner__text2 {
	background: #D70051;
	text-align: center;
	margin: 20px 0;
}
.guarantee__inner__text2 p {
	color: #fff;
	text-align: center;	
	padding: 10px;
	font-size: 2.0rem;
}
.guarantee__inner__text2 p small {
	font-size: 1.4rem;
}

.guarantee__inner p.note {
	font-weight: 900;
	text-align: center;
}

.count {
	margin: 2% 3% 5%;
	counter-reset: listnum;
}

.count li {
	position: relative;
}

.count li:before {
	counter-increment: listnum;
	content: counter(listnum);
	position: absolute;
	display: inline-block;
  width: 45px;
  height: 11px;
  border-radius: 50% / 100% 100% 0 0;
  background: #FFF;
	top: -24px;
	border: solid 3px #036EB2;
	border-bottom: solid 3px #FFF;
	transform: translateX(-50%);
	left: 50%;
	text-align: center;
	padding-top: 8px;
	color: #AAA;
	font-size: 2.4rem;
}

.count li h3 {
	text-align: center;
	color: #036EB2;
	font-size: 2.4rem;
	font-weight: 900;
	line-height: 1.2;
	padding: 0 0 30px;
	background: url("../images/page/bg_underline.png") repeat-x center bottom;
	background-size: 76%;
}

.count li {
	background: #FFF;
	padding: 20px;
	width: 32%;
	font-size: 1.8rem;
	border: solid 3px #036EB2;
}

.count li p {
	font-size: 1.4rem;
	font-weight: 900;
}

.campain {max-width: 800px; width: 100%;}

.refund__inner {
	position: relative;
	width: 798px;
	margin: 0 auto;
	padding: 20px 20px 20px 50px;
	background: #FDF7E9;
	border: solid 3px #E98400;
	border-top: none;
}

.refund__inner:before {
	content: "";
	background: url("../images/page/bg_refund.png") no-repeat center center;
	background-size: contain;
  position: absolute;
	width: 212px;
	height: 180px;
	display: block;
  bottom: 0;
  right: 2%;
	z-index: 20;
}

.difference .refund {
	padding-bottom: 50px;
}

/* 保証制度 */
.refund .title .inner {
	padding: 10px;
	display: flex;
	justify-content: center;
}

.refund .title .inner p {
	display: inline-block;
	color: #FFF;
	font-size: 1.8rem;
	padding: 10px;
}

.refund .title .inner h3 {
	display: inline-block;
	color: #E98400;
	font-size: 3.0rem;
	background: #fff;
	padding: 10px 40px;
	border-radius: 10px;
	text-align: center;
	font-weight: 900;
	letter-spacing: 1px;
}

.refund .title {
  display: block;
  position: relative;
	background: #E98400;
	max-width: 830px;
	margin: 0 auto;
}

.refund .title:before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 16px rgb(48, 26, 0);
}

.refund .title:after {
  position: absolute;
  content: '';
  top: 100%;
  right: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-left: solid 16px rgb(48, 26, 0);
}
.refund__inner__text {
	font-size: 1.8rem;
	line-height: 1.6;
	margin-bottom: 10px;
}
.refund__inner__text strong {
	color: #E50070;
}

.refund .note__text {
	text-indent: -1em;
	padding-left: 1em;
	font-size: 1.4rem;	
	display: inline-block;
	text-align: left;
}

/*---------------------------
　　プラン
---------------------------*/
.plan__inner {
	max-width: 870px;
	margin: 0 auto;
}

#plan .title_line {
	margin: 80px auto;
	position: relative;
  display: flex;
  align-items: center;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}
/* 両側センターライン */
#plan .title_line::before,
#plan .title_line::after {
  content: "";
  height: 2px;
  border-top: 2.5px solid #036EB2;
  flex-grow: 1;
}
/* 余白 */
#plan .title_line::before{
  margin-right: 30px;
}
#plan .title_line::after{
  margin-left: 30px;
}

#plan .title_line h3.title {
	background: #FFF;
	border: solid 2px #036EB2;
	padding: 10px 50px;
	display: inline-block;
	min-width: 440px;
	position: absolute;
	transform: translateX(-50%);
	left: 50%;
	border-radius: 40px;
	color: #036EB2;
}

#plan .title_line h3.title:before {
	content: "";
	background: url("../images/page/img_plan_title01.png") no-repeat center center;
	background-size: contain;
  position: absolute;
	width: 162px;
	height: 126px;
	display: block;
  bottom: -45%;
  /*transform: translateY(-50%);*/
	left: -95px;
	z-index: 20;
}

#plan .title_line h3.title#shoshudan:before {
	background: url("../images/page/img_plan_title02.png") no-repeat center center;
	background-size: contain;
}

ul.class {
	max-width: 860px;
	margin: 20px auto;
	padding-bottom: 20px;
}

ul.class li {
	background: #F1F1EC;
	display: table;
	width: 100%;
	margin-bottom: 20px;
}
ul.class li .gakunen {
	display: table-cell;
	width: 20%;
	text-align: center;
	padding: 10px;
	font-size: 2.6rem;
	font-weight: 900;
	vertical-align: middle;
}
ul.class li .subject {
	display: table-cell;
	width: 80%;
	padding: 10px 40px;
	font-size: 2.6rem;
	line-height: 1.6;
	font-weight: 900;
	vertical-align: middle;
}

ul.class li small {
	font-size: 2.0rem;
	font-weight: 900;
}

ul.class li.junior .gakunen {
	background: #ED9100;
	color: #FFF;
}

ul.class li.junior .subject {
	color: #ED9100;
}

ul.class li.middle .gakunen {
	background: #008D3A;
	color: #FFF;
}

ul.class li.middle .subject {
	color: #008D3A;
}

ul.class li.high .gakunen {
	background: #036EB3;
	color: #FFF;
}

ul.class li.high .subject {
	color: #036EB3;
}
/* dojo */
.dojo {
	border: solid 4px #00913A;
	border-left: solid 8px #00913A;
	background: #F4F9E9;
	max-width: 710px;
	margin: 30px auto 0;
	text-align: center;
}
.dojo__intro ul li {
	width: 66%;
	padding: 20px 20px 20px 30px;
}
.dojo__intro ul li.image {
	width: 34%;
	padding: 0;
}
.dojo__intro .column.flex{
	align-items: center;
}
.dojo__intro .column h3.title {
	display: inline-block;
	max-width: 242px;
	width: 100%;
	height: 58px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url("../images/page/logo_dojo.png") no-repeat left center;
	background-size: contain;
}

.dojo__intro .column p.age {
	background: #00913A;
	font-size: 2.2rem;
	color: #fff;
	font-weight: 900;
	padding: 8px 34px;
	line-height: 1.2;
}

.dojo__intro__text {
	font-size: 2.6rem;
	line-height: 1.2;
	color: #00913A;
	font-weight: 900;
	margin-top: 5px;
}
.dojo__item {padding: 0 30px 15px;}

.dojo__item .flex li {
	width: 30%;	
}
/* qureo */
.qureo {
	border: solid 4px #0068B1;
	border-left: solid 8px #0068B1;
	background: #ECEFF8;
	max-width: 710px;
	margin: 30px auto 0;
	text-align: center;
}

.qureo__intro ul li {
	width: 60%;
	padding: 20px 20px 20px 30px;
}

.qureo__intro ul li.image {
	width: 36%;
	padding: 10px 0 0 0;
	position: relative;
}

.qureo__intro ul li.image:before {
	display: block;
	content: "";
	background: url("../images/page/ico_qureo.png") no-repeat left center;
	background-size: contain;
	width: 90px;
	height: 80px;
	position: absolute;
	left: -30px;
	top:42%;
	transform: translateY(-50%);
}

.qureo__intro .column.flex{
	align-items: center;
}

.qureo__intro .column h3.title {
	display: inline-block;
	max-width: 180px;
	width: 100%;
	height: 96px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: #EEE url("../images/page/logo_qureo.png") no-repeat left center;
	background-size: contain;
	position: relative;
}

.qureo__intro .column p.age {
	background: #0068B1;
	font-size: 2.2rem;
	color: #fff;
	font-weight: 900;
	padding: 8px 34px;
	line-height: 1.2;
}

.qureo__intro__text {
	font-size: 2.6rem;
	line-height: 1.2;
	color: #182987;
	font-weight: 900;
	margin-top: 5px;
}

.qureo__item {
	padding: 10px 20px;
	background: #FFF;
	max-width: 610px;
	margin: 0 auto 20px;
	position: relative;
}

.qureo__item:before {
	display: block;
	content: "";
	background: url("../images/page/img_qureo04.png") no-repeat left center;
	background-size: contain;
	width: 110px;
	height: 100px;
	position: absolute;
	left: -38px;
	top:60%;
	transform: translateY(-50%);
}

.qureo__item .flex {
	align-items: center;
}

.qureo__item .flex li {
	width: 28%;	
}

.qureo__item .flex li:last-child {
	width: 68%;	
}

.qureo__item .flex li h4 {
	font-size: 1.9rem;
	font-weight: 900;
	color: #113479;
	border-bottom: solid 1px #AAA;
	padding: 8px 0;
	margin-bottom: 8px;
}

.qureo__item .flex li p {
	font-size: 1.4rem;
	line-height: 1.4;
}

.link__btn__710 {
	margin: 20px auto 100px;
	max-width: 710px;
}

/*---------------------------
　　サポート体制
---------------------------*/
.support {
	background: #E8F0F6 url("../images/page/bg_support.png") no-repeat right 144px;
	background-size: 32%;
	margin-bottom: 80px;
}

.support__inner {
	margin: 30px auto;
	max-width: 890px;
}

ul.support__content li {
	width: 49%;
}
.support__content__first {
	width: 70%;
	background: #FFF;
	padding: 25px;
	margin-bottom: 20px;
}
.support__content .column__text {
	width: 58%;
}
.support__content h3 {
	font-size: 1.8rem;
	margin-bottom: 20px;
	padding: 10px;
	border-left: solid 5px #036EB8;
	font-weight: 900;
	line-height: 1.4;
}
.support__content h3 strong {
	font-size: 2.6rem;
	font-feature-settings: "palt";
	color: #036EB8;
	line-height: 1.4;
}

.support__content__item {
	background: #FFF;
	padding: 25px;
	margin-bottom: 30px;
}
.support__content .column__text p {
	font-size: 1.6rem;
	line-height: 1.4;
}

.support__content .column__img {
	width: 38%;
}

.support__content__first p strong {
	color: #036EB8;
}

.support__content__item:first-child h3 {
	border-left: solid 5px #F29600;
}
.support__content__item:first-child strong {
	color: #F29600;
}

.support__content__item:last-child h3 {
	border-left: solid 5px #00913A;
}
.support__content__item:last-child strong {
	color: #00913A;
}

/*---------------------------
　　指導システム
---------------------------*/
.system {
	background: #E8F0F6;
	padding-bottom: 30px;
}

.system__inner {
	max-width: 850px;
	margin: 20px auto;
}

.system__text {
	display: flex; 
	margin-bottom: 30px; 
	width: 100%;
	justify-content: space-between;
}
.system__text li {
	display: flex;
	align-items: center;
}

.system__text li:first-child {
	background: #036EB2;
	width: 26%;
}
.system__text li:last-child {width: 70%;}

.system__text li h3 {
	width: 100%;
	text-align: center;
	position: relative;
	color: #FFF;
	padding: 20px;
	font-size: 2.0rem;
	font-weight: 900;
}

.system__text li p {
	line-height: 1.6; 
	font-weight: 900;
}
.system__text li strong {color: #D10050;}

.system__item {
	margin-bottom: 50px;
}

.reason {
	max-width: 900px;
	margin: 0 auto;
	background: #FFF8E7;
}
.reason .title {
	background: #ED9100;
	color: #FFF;
	font-size: 2.1rem;
	padding: 15px;
}

.reason .flex {
	margin: 20px 10px 0;
}
.reason .flex li {width: 33%;}



/*---------------------------
　　無料体験
---------------------------*/
#free_trial {background: #FFFEEB;}
#free_trial p strong {
	color: #D10050;
}

.free_trial__inner {
	padding: 8%; 
	text-align: center;
}
.free_trial__inner p {
	font-size: 2.4rem;
	text-align: center;
	margin: 30px;
	line-height: 1.4;
	font-weight: 900;
}

.free_trial__inner button.btn_link {
	position: relative; 
	background: #E98400; 
	margin: 0 auto; 
	color: #FFF; 
	font-weight: bold; 
	font-size: 2.2rem; 
	text-align: center; 
	display: inline-block; 
	padding: 20px 80px; 
	border-radius: 10px;
	border: none;	
	cursor: pointer;
}
.free_trial__inner button.btn_link:hover {
	opacity: 0.8;
}
.free_trial__inner button.btn_link:before {
	content:"";
	display: block;
	width: 0;
  height: 0;
	border-top: solid 6px transparent;
	border-right: solid 6px transparent;
	border-bottom: solid 6px transparent;
	border-left: solid 6px #EEE;
	position: absolute;
	right:5px;
	top: 51%;
	transform: translateY(-50%);
}

/*---------------------------
　　お問い合わせ
---------------------------*/
.contact_area h2.ttl {
	color: #E98400; 
	font-size: 2.2rem; 
	padding: 40px 15px 0; 
	margin:0; 
	line-height: 1.2; 
	text-align: center; 
	font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contact_area h2.ttl::before,
.contact_area h2.ttl::after {
  content: '';
  display: block;
  width: 28%;
  height: 2px;
  background: #E98400;
}
.contact_area h2.ttl::before {
  margin-right: 1em;
}
.contact_area h2.ttl::after {
  margin-left: 1em;
}

.contact_area {background: #FFF8E7; border: solid 1px #E98400; max-width: 900px; margin: 30px auto ; padding-bottom: 30px;}
.contact_area ul {display: flex; flex-wrap: wrap; align-items: center; right: 0; justify-content: space-between;  margin: 30px 80px 0;}
.contact_area ul li {width: 48%; margin-bottom: 20px;}
.contact_area ul li a {color:#FFF; background:#E98400; padding:20px 0; font-size:20px; display: block; font-weight: bold; text-align: center; border-radius: 10px; position: relative;}
.contact_area ul li a:before {
	content:"";
	display: block;
	width: 0;
	height: 0;
	border-top: solid 6px transparent;
	border-right: solid 6px transparent;
	border-bottom: solid 6px transparent;
	border-left: solid 6px #EEE;
	position: absolute; right:5px; top: 50%;
	transform: translateY(-50%);
	}
.contact_area ul li a:hover {text-decoration: none;}

/*---------------------------
　　入室まで
---------------------------*/
#flow h2 {
	margin-bottom: 50px;
}

#flow h4 {
	text-align: center;
	color: #036EB2;
	font-weight: 900;
	padding: 20px 0 15px;
}

#flow button.btn_entry {
	padding: 15px 10px;
	text-align: center;
	background: #036EB2;
	width: 100%;
	cursor: pointer;
	position: relative;
	color: #FFF;
	border: none;
	font-weight: 600;
	font-size: 1.6rem;
}
#flow button.btn_entry::before,
#flow button.btn_entry::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
#flow button.btn_entry::before{
	right: 10px;
	width: 5px;
	height: 5px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

#flow button.btn_entry:hover {
	opacity: 0.6;
	text-decoration: none;
}

#flow .catch {
	font-size: 2.4rem;
	text-align: center;
	color: #D10050;
	font-weight: 900;
	line-height: 1.4;
}

/*---------------------------
　　教室案内
---------------------------*/
#school {background: #E8F0F6; padding-bottom: 50px;}
#school h3.title {margin: 40px;}
.school__list {display: flex; justify-content: space-between; width: 100%; max-width: 820px; margin: 30px auto;}
.school__item {width: 58%;}
.school__item:last-child {width: 38%;}

.school__list table {
	border-left: solid 1px #C9C9C9;
	border-top: solid 1px #C9C9C9;
	width: 100%;	
}
.school__list table tr th {
	padding: 30px 20px;
	border-right: solid 1px #C9C9C9;
	border-bottom: solid 1px #C9C9C9;
	background: #036EB2;
	color: #FFF;
}
.school__list table tr td {
	color: #333;
	font-size: 1.8rem;
	line-height: 1.2;
	padding: 30px 20px;
	border-right: solid 1px #C9C9C9;
	border-bottom: solid 1px #C9C9C9;
	background: #FFF;
	font-weight: 900;
}
.school__list table tr td.tel_num {
	font-size: 2.6rem;
}
.school__list table tr td.tel_num .small {
	font-size: 1.4rem;
}

.school__list button.g_map {
	padding: 6px;
	text-align: center;
	border: solid 1px #333;
	background: #FFF;
	border-radius: 20px;
	width: 80%;
	margin-top: 20px;
	cursor: pointer;
	position: relative;
}
.school__list button.g_map::before,
.school__list button.g_map::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.school__list button.g_map::before{
	right: 10px;
	width: 5px;
	height: 5px;
	border-top: 1px solid #888;
	border-right: 1px solid #888;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.school__list button.g_map:hover {
	opacity: 0.6;
	text-decoration: none;
	color: #333;
}

/*---------------------------
　　スケジュール
---------------------------*/
.schedule__item {text-align: center;}

#schedule .catch {
	font-size: 2.2rem;
	line-height: 1.4;
	text-align: center;
	font-weight: 900;
	margin: 46px auto;
}

.mar_top50 {margin-top: 50px;}
.mar_top100 {margin-top: 100px;}

@media screen and (max-width:960px){
	.mar_top100 {margin-top: 8%;}
}

@media screen and (max-width:930px){
	.count li img {
		margin-top: 10px;
		width: 100%;
	}
}

@media screen and (max-width:920px){
	.tb_only {display: block!important;}
}

@media screen and (max-width:830px){
	.refund__inner {
		width: 96%;
		margin: 0 2%;
		padding: 20px;
	}
	.count li h3 {
		font-size: 2.0rem;
	}	
	.refund .note__text {display: block;}
}


@media screen and (max-width:768px){
	.flex {
		display: block;
	}
	#floating_banner {
		width: 192px;
	}
	.count.flex {display: flex;}	
	.score_up__inner .flex {display: flex;}
	#point .inner ul {display: block;}
	#point .inner ul li {width: 80%; margin: 0 auto;}
	.guarantee {margin: 0 3%}
	.refund {padding: 0 2%;}
	.dojo .flex, .qureo .flex, .guarantee__inner .flex {display: flex;}


	ul.class {
		width: 90%;
	}
	.reason {width: 90%;}
	.reason .flex {display: flex;}

	.support__content__first {
		width: 100%;
	}
	.support__inner {width:90%;}
	.support__content .column__text,
	ul.support__content li {
		width: 100%;
	}
	.support__content .column__img {
		width: 94%;
		text-align: center;
		margin: 20px auto 0;		
	}
	.support {
		background-image: none; 
		padding-bottom: 50px;
	}	
	.contact_area {max-width: 96%;}
	.contact_area ul {display: flex; margin: 30px 2% 0;}	
	.contact_area h2.ttl .pc_only {display: none;}
}

@media screen and (max-width:750px){
	.pc_only{display: none;}
	.sp_only {display: block!important;}	
	.tb_only {display: none!important;}
	
	h2.title_bluebg {font-size:1.8rem; padding: 26px 0;}
	
	.score_up__inner .flex li {width: 48%;}
	.score_up__inner .flex li:nth-child(1), .score_up__inner .flex li:nth-child(2) {margin-bottom: 20px;}
	
	.worries:before {
		border-right: 20px solid transparent;
		border-left: 20px solid transparent;
		border-top: 20px solid #f1f1ec;
		bottom: -30px;
	}
	.worries:after {
		border-right: 20px solid transparent;
		border-left: 20px solid transparent;
		border-top: 20px solid #f1f1ec;
		bottom: -60px;
	}
	.noproblem {margin-top: 80px;}
	.noproblem .title {
		padding: 14px ;
		margin-bottom: 10px;
		font-size: 2.2rem;
		background-size: 66%;
	}
	.noproblem .title:before {
		left: -30px;
	}
	.noproblem .title:after {
		right: -30px;
	}
	.worries .title {
		font-size: 1.6rem;
		min-width: 300px;
		margin: 30px auto 0;
		border-radius: 40px;
		top: -60px;
	}
	
	.count.flex {display: block;} 
	
	.count li h3 {
		font-size: 2.3rem;
		font-feature-settings: "palt";
	}

	.count li {
		font-size: 1.4rem;
		width: 100%;
		margin-bottom: 30px;
	}	
	.guarantee h3.title {
		padding: 30px;
	}
	.guarantee__inner__text {
		text-align: justify;
	}
	.guarantee__inner {
		padding: 5%;
	}
	.guarantee__inner p.note {
		text-align: justify;
	}
	.guarantee__inner .flex {display: block;}
	.guarantee__inner .flex img {
		width: 100%;
	}
	.guarantee__inner .flex img:last-child {
		margin-top: 30px;
	}
	
	#point .bnr_area {margin: 4%;}	
	#point .catch {font-size: 2.0rem;}
	.dojo .flex, .qureo .flex {display: block;}
	/* dojo */
	.dojo {
		margin: 30px 4% 0;
	}
	
	.dojo__intro .column h3.title {
		margin: 10px auto;
		max-width: 100%;
		height: 80px;
		background: url("../images/page/logo_dojo.png") no-repeat center center;
	}
	
	.dojo__intro__text, .dojo__intro .column p.age {
		text-align: center;
		padding: 15px;
		font-size: 2.0rem;
	}
	
	.dojo__intro ul li {
		width: 100%;
		padding: 20px 20px 0 20px;
		text-align: center;
	}
	
	.dojo__intro ul li.image {
		width: 100%;
		padding: 0 0 20px 0;
	}

	.dojo__item .flex li {
		width: 100%;
		text-align: center;
		margin-bottom: 50px;
	}
	
	.dojo__intro ul li.image img, 
	.dojo__item .flex li img {
		width: 94%;
	}
	
	/* qureo */
	.qureo {
		margin: 30px 4% 0;
	}
	
	.qureo__intro {
		background: url("../images/page/ico_qureo.png") no-repeat 10% 20px;
	}
	
	.qureo__intro ul li {
		width: 100%;
	}
	
	.qureo__intro ul li.image {
		width:100%;
		padding: 0;
	}
	
	.qureo__intro ul li.image img {
		width: 84%;
		margin: 10px auto;
	}
	
	.qureo picture img {
		width: 92%;
		margin: 10px auto;
	}
	
	.qureo__intro .column h3.title {
		max-width: 100%;
		height: 100px;
		background: url("../images/page/logo_qureo.png") no-repeat center center;		
		background-size: contain;
		margin-bottom: 20px;
	}
	
	.qureo__intro ul li.image:before {
		display: none;
	}	
	
	.qureo__intro__text {
		text-align: center;
		padding: 15px 0 0;
		font-size: 2.0rem;
		margin: 0 20px;
	}
	
	.qureo__intro .column p.age {
		text-align: center;
		padding: 15px 0;
		font-size: 2.0rem;
		margin: 0 20px;
	}
	
	.qureo__intro ul li {
		width: 100%;
		padding: 20px 0 0;
		text-align: center;
	}
	
	.qureo__item {
		max-width: 90%;
		margin: 20px auto;
	}
	
	.qureo__item .flex li {
		width: 66%;	
	}
	
	.qureo__item .flex li:last-child {
		width: 100%;	
	}
	
	.qureo__item:before {
		width: 26%;
		height: 160px;
		left: auto;
		right: 10px;
		top: 20%;
	}
	
	.qureo__item .flex li h4 {
		font-size: 2.2rem;
		padding: 12px 0;
		line-height: 1.2;
		margin-top: 20px;
	}
	
	.link__btn__710 {
		margin: 40px 4% 100px;
	}
	.support__content h3 {
		font-feature-settings: "palt";
	}
	
	.support__content h3 strong {
		font-size: 2.4rem;
	}	
	
	#free_trial p {font-size: 2.0rem;}
	#free_trial .btn a {width: 92%; margin: 30px auto;}	
	.free_trial__inner {
		padding: 8% 4%; 
	}
	.free_trial__inner button.btn_link {
		font-size: 2.0rem; 
		display: block; 
		padding: 20px 20px;
		width: 100%;
	}
	
	.refund__inner {
		padding: 20px 30px 280px;
		background: #FDF7E9 url("../images/page/bg_refund.png") no-repeat center bottom;
		background-size: 50%;
		width: 96%;
		margin: 0 2%;
	}
	.refund__inner:before {
		display: none;
	}
	
	.refund .title .inner {
	padding: 10px;
		display: block;}
	
	.refund .title .inner p {
		display: block;
		text-align: center;
	}

	.refund .title .inner h3 {
		display: block;
		margin: 5px 5px 0;
	}	
	#plan .title_line h3.title {
		min-width: 60%;
		font-size: 2.2rem;
	}
	#plan .title_line h3.title:before {
		width: 50%;
		height: 100px;
		left: -28%;
	}
	.contact_area {padding-bottom: 0;}
	.contact_area ul li {width: 49%;}
	.contact_area ul li a {font-size:16px;}
	.contact_area ul li a:before {right:0;
		border-top: solid 4px transparent;
    border-right: solid 4px transparent;
    border-bottom: solid 4px transparent;
    border-left: solid 4px #EEE;}
	.contact_area h2.ttl {
		padding: 25px 15px 0;
		font-size: 1.6rem;
	}	
	.contact_area h2.ttl::before,
	.contact_area h2.ttl::after {
		width: 24%;
	}
	
	.support {
		margin-bottom: 50px;
	}
	
	.support__catch {
		font-size: 1.8rem;
		text-align: center;
		font-weight: 900;
		margin-bottom: 15px;
	}
	
	.system__text {
		display: block;
		margin: 0 auto;
		width: 86%;
	}
	.system__item {
		margin: 0 auto 50px;
		width: 80%;
	}
	.system__text li:first-child, .system__text li:last-child {
		width: 100%;
		margin: 10px auto;
		text-align: center;
	}
	.system__text li h3 {
		font-size: 1.8rem;
		padding: 15px;
	}
	.system__text li p {
		font-size: 1.7rem;
		width: 100%;
		padding: 10px 0;
	}
	
	.reason .flex {display: block;}
	.reason .flex li {
		width: 100%; 
		text-align: center; 
		padding-top: 40px;
		border-bottom: solid 2px #CCC;
	}
	.reason .flex li:first-child {
		padding-top: 10px;
	}
	.reason .title {
		font-size: 1.8rem;
	}	
		
	#school h3.title {font-size: 2.2rem;}
	
	#flow .catch {
		font-size: 2.0rem;
		text-align: center;
		color: #D10050;
		font-weight: 900;
	}
	#flow h4 {
		font-size: 2rem;
		padding-bottom: 10px;
	}
	
	#flow button.btn_entry {
		font-size: 1.9rem;
		padding: 15px 0;
	}
	
	/* 教室案内 */
	.school__list {display: block;} 
	.school__item, .school__item:last-child {width: 90%; margin: 20px auto;}
	.school__list table {width: 100%;}
	.school__list table tr th,.school__list table tr td {display: block; text-align: center;}
}

@media screen and (max-width:680px){
	.refund__inner {
		background-size: 260px;
		padding: 20px 30px 240px;		
	}
}

@media screen and (max-width:600px){
	
	.score_up__inner {
		padding: 3% 3% 5%;
	}

	.score_up__title {
		background: #036EB0;
		padding: 15px;
		border-radius: 40px;
		margin: 10px auto 20px;
	}

	.score_up__title h2 {
		font-size: 2.0rem;
		padding-left: 20px;
	}
	.score_up__title h2 strong {
		color: #FFEF00;
	}
	.score_up__title h2:before {
		width: 100px;
		height: 80px;
		left: -78px;
	}
	.score_up__inner .flex li {
		width: 49%;
	} 
	.score_up__inner .flex li:nth-child(1), .score_up__inner .flex li:nth-child(2) {margin-bottom: 10px;}
	
	.dojo__intro .column h3.title {
		background-size: 80%;
	}
	.qureo__intro {
		background: url("../images/page/ico_qureo.png") no-repeat 5px 7%;
		background-size: 20%;
	}
	ul.class li {
		display: block;
	}
	ul.class li .gakunen {
		display: block;
		width: 100%;
		padding: 10px;
		font-size: 2.0rem;
	}
	ul.class li .subject {
		display: block;
		width: 100%;
		padding: 10px 20px;
		font-size: 2.0rem;
		font-feature-settings: "palt";
	}
}



