@charset "UTF-8";
body, html {
	font-size: 16px
}
ol, p, ul {
	margin: 0
}
.btn, .course__box, .flow__caution, .flow__heading, .flow__item, .header, .intro__btns, .intro__top, .job__name2, .lineup, .recommend__heading, .section__heading {
	text-align: center
}
.flow__heading, .footer__copy, .job__content, .job__name, .lineup__title, .skill__course {
	white-space: nowrap
}
.customer__item, .customer__nav, .flow__section, .header__btn {
	float: left
}
.btn, .pagetop, .slick__nav {
	cursor: pointer
}

* { box-sizing:border-box; }

@font-face { font-family:"FontAwesome"; src:url("./fa-solid-900.woff") format("woff"); }

body {
	color: #565656;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	line-height: 2.4
}
h1, h2, h3, h4 {
	margin: 0;
	font-weight: 400;
	line-height: 1.3
}
ol, ul {
	padding: 0;
	list-style-type: none
}
a {
	text-decoration: none;
	color: inherit
}
img {
	max-width: 100%;
	vertical-align: bottom
}
.l-container {
	max-width: 1140px;
	margin: 0 auto;
}
.btn--contact:not(:last-child), .btn--spnav:first-child {
	margin-bottom: 15px
}
.header {
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	padding: 4px 0 0;
	background-color: #fff;
	box-shadow: rgba(0,0,0,.2) 0 2px 4px 0
}
.header__container {
	position: relative;
	padding: 5px 0;
}
.header__btns {
	position: absolute;
	top: 50%;
	right: 20px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%)
}
.job__inner, .skill__inner {
	-webkit-transform: translate(-50%, -50%)
}
.header__btn {
	width: 95px
}
.header__btn:not(:last-child) {
	margin-right: 9px
}
.logo__img {
	display: block;
	width: 63px
}
.btn {
	display: inline-block;
	-webkit-transition: all .3s;
	transition: all .3s;
	border-radius: 5px;
	line-height: 1
}
.btn--request {
	color: #fff;
	border-bottom: 2px solid #09807c;
	background-color: #12b5b0
}
.btn--reserve {
	color: #fff;
	border-bottom: 2px solid #a80057;
	background-color: #d1131c
}
.btn--header {
	display: block;
	padding: 5px 0;
	font-size: 12px
}
.btn--big {
	display: block;
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
	padding: 11px 0;
	letter-spacing: .2em;
	font-size: 16px
}
.btn--course, .btn--lineup {
	letter-spacing: .1em
}
.btn--footer {
	display: none
}
.btn--spnav {
	display: block;
	padding: 10px 0
}
.footer__bottom, .footer__section:nth-child(3) {
    text-align: center;
}
.footer__customer, .footer__descs, .footer__logo, .footer__section:nth-child(1), .footer__section:nth-child(2), .footer__text {
    display: none;
}
.footer {
	background-color: #EFEFEF;
	line-height: 1.8;
	text-align: center;
}
.footer ul a {
	-webkit-transition: color .3s;
	transition: color .3s
}
.footer ul a:hover {
	opacity: .7
}
.footer__box {
	font-size: 0
}
.footer__nav {
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%
}
.footer__copy {
	margin-top: 35px;
	padding-bottom: 15px;
	font-size: 10px;
	line-height: 1.2
}
.customer__title, .footer__text {
    color: #d1131c;
}
.tel__heading {
	font-size: 22px;
	font-weight: 700
}
.tel__number {
	display: inline-block;
	margin-top: 9px;
	padding-left: 49px;
	color: #d1131c;
	background-image: url(../images/top/icon--tel.png);
	background-position: left center;
	background-size: 35px 23px;
	font-size: 24px;
	font-weight: 700
}
.nav {
	display: none
}
.customer__title {
	float: left;
	margin-right: 15px;
	color: #d1131c;
	font-size: 16px
}
.customer__item::before{border: none;}
.customer__nav ul li, .customer__item:not(:last-child){margin-right: 40px;}
.customer__nav ul li div{
	border: 1px solid #aaa;
	background: #fff;
	width: 200px;
	height: 50px;
	text-align: center;
	font-weight: 600;
	position: relative;
}
.customer__nav ul li div span::before {
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -7px;
    content: '';
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #8d8d8d;
}
.customer__nav ul li div a{
	display: block;
	width: 200px;
	height: 50px;
	padding: 10px 10px 10px 15px;
}

.spnav__heading {
	padding: 11px 0;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-size: 17px;
	font-weight: 700
}
.spnav__item {
	border-top: 1px solid #fff
}
.spnav__item:last-child {
	border-bottom: 1px solid #fff
}
.spnav__link {
	display: block;
	padding: 12px 0;
	letter-spacing: 1px;
	font-size: 16px;
	line-height: 1
}
.spnav__btns {
	margin: 45px 0 40px
}
.pagetop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background-color: #7e7f83;
	background-image: url(../images/top/pagetop.png);
	background-position: center 20px;
	background-size: 28px
}
.cf::after {
	display: block;
	clear: both;
	content: ''
}
@-webkit-keyframes shine {
100% {
left:100%
}
}
@keyframes shine {
100% {
left:100%
}
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp
}
@-webkit-keyframes fadeInUp {
0% {
-webkit-transform:translateY(30px);
transform:translateY(30px);
opacity:0
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0);
opacity:1
}
}
@keyframes fadeInUp {
0% {
-webkit-transform:translateY(30px);
transform:translateY(30px);
opacity:0
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0);
opacity:1
}
}
.lb-nav {
	display: none!important
}
.hidden-sm {
	display: none
}
.hidden-pc {
	display: block
}

@media (min-width:769px) {
body {
	margin: 0
}
.btn--request:hover {
	background-color: #14c8c2
}
.btn--reserve:hover {
	background-color: #d1131c;
}
.btn--big {
	padding: 14px 0;
	font-size: 20px
}
.btn--lineup {
	padding: 12px 0
}
.btn--course {
	padding: 13px 0
}
.btn--contact {
	display: inline-block;
	width: 280px;
	margin: 15px;
	padding: 15px 0;
	letter-spacing: .1em;
	font-size: 22px
}
.btn--footer {
	display: block;
	width: 100%;
	max-width: 300px;
	margin: 0 auto 16px;
	padding: 8px 0;
	letter-spacing: .1em;
	font-size: 14px
}
.footer__item--nowrap, .footer__text, .school__title, .skill__title {
	white-space: nowrap
}
.footer {
	padding: 47px 0 30px;
	text-align: left;
	background-color: #cdcbd6
}
.footer__customer {
	display: block;
	margin-bottom: 33px
}
.footer__top {
	display: table;
	width: 100%;
	margin-bottom: 35px;
	table-layout: fixed
}
.footer__bottom {
	margin-top: -14px
}
.footer__section:nth-child(1) {
	display: block;
	float: left
}
.footer__section:nth-child(2) {
	display: block;
	float: left;
	width: 50%
}
.footer__section:nth-child(3) {
	float: right;
	width: 50%
}
.footer__heading {
	margin-bottom: 35px;
	font-size: 16px;
	font-weight: 700
}
.footer__list {
	display: inline-block;
width:calc((100% - 20px * 2)/ 3);
	margin-right: 20px;
	padding-left: 16px;
	text-align: left;
	vertical-align: top;
	margin-bottom: 20px;
}
.footer__list:nth-of-type(3n) {
	margin-right: 0
}
.footer__title {
	margin-bottom: 5px;
	font-size: 14px;
	font-weight: 700
}
.footer__item {
	position: relative;
	margin-bottom: 7px;
	padding-left: 15px;
	font-size: 12px
}
.footer__link, .footer__place {
	display: inline-block;
	text-align: left;
	font-size: 14px
}
.footer__item::before {
	position: absolute;
	left: 0;
	margin-top: 5px;
	border-left: 9px solid #8d8d8d
}
.footer__item::before, .footer__place::before {
    top: 0;
    content: '';
    border-top: 5.4px solid transparent;
    border-bottom: 5.4px solid transparent;
}
.footer__classroom {
	margin-bottom: 30px
}
.footer__place {
	position: relative;
	margin-right: 10px;
	margin-bottom: 8px;
	padding-left: 15px
}
.footer__place::before {
	position: absolute;
	left: 0;
	margin-top: 6px;
	border-left: 9px solid #d86c71;
}
.footer__link {
	position: relative;
	margin-right: 15px;
	margin-bottom: 11px;
	padding-left: 18px;
	font-weight: 700;
	line-height: 1
}
.footer__link::before {
	position: absolute;
	top: 2px;
	left: 0;
	content: url(../images/top/icon--arrow.png)
}
.footer__text {
	display: block;
	margin-bottom: 20px;
	text-align: center;
	color: #d1131c;
	font-size: 12px;
	line-height: 1
}
.footer__logo {
	display: inline-block;
	margin-bottom: 27px
}
.footer__tel {
	display: inline-block;
	margin-top: 9px;
	text-align: initial
}
.footer__descs {
	display: block;
	margin-bottom: 54px;
	text-align: left
}
.footer__copy, .footer__nav, .nav {
	display: inline-block
}
.footer__desc {
	margin-bottom: 5px;
	font-size: 10px;
	line-height: 1.3
}
.footer__last {
	text-align: center;
	line-height: 1
}
.footer__nav {
	position: static;
	width: auto;
	margin: 5px;
	vertical-align: middle
}
.footer__copy {
	margin: 5px 0 5px 30px;
	padding-bottom: 0;
	vertical-align: middle;
	font-size: 14px
}
.tel__heading {
	margin-bottom: 3px;
	font-size: 14px
}
.tel__text {
	margin-bottom: 2px;
	font-size: 12px;
	line-height: 1
}
.tel__number {
	margin-top: -16px;
	margin-bottom: 5px;
	padding-left: 0;
	letter-spacing: 0;
	background-image: none;
	font-size: 20px
}
.nav__item {
	float: left;
	padding: 0;
	border-bottom: none;
	font-size: 14px;
	line-height: 1
}
.nav__item:nth-child(-n+3) {
	margin-right: 12px;
	padding-right: 12px;
	border-right: 1px solid #000
}
.pagetop, .spnav {
	display: none
}
.shine {
	position: relative;
	overflow: hidden
}
.shine::before {
	position: absolute;
	z-index: 1;
	top: 0;
	left: -55%;
	width: 50%;
	height: 100%;
	content: '';
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,.3) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0, rgba(255,255,255,.3) 100%)
}
.shine:hover::before {
	-webkit-animation: shine .7s;
	animation: shine .7s
}
.hidden-sm {
	display: block
}
.hidden-pc {
	display: none
}
}

@media (min-width:800px) {
body {
	margin: 0
}
.header {
	padding: 6px 0 0;
}
.header__btn {
	width: 200px
}
.header__btn:not(:last-child) {
	margin-right: 15px
}
.logo {
	display: inline-block;
	vertical-align: middle
}
.logo__img {
	width: 109px
}
.btn--header {
	padding: 12px 0;
	letter-spacing: .28em;
	font-size: 17px
}
.hero {
	margin-top: 62px
}
}



@media (min-width:1132px) {
body {
	margin: 0
}
.footer__section {
	vertical-align: top
}
.footer__section:nth-child(1) {
	display: table-cell;
	float: none;
	width: 680px;
	padding-right: 30px;
	border-right: 1px solid #aaa
}
.footer__section:nth-child(2) {
	display: table-cell;
	float: none;
	width: 228px;
	padding: 0 30px;
	border-right: 1px solid #aaa
}
.footer__section:nth-child(3) {
	display: table-cell;
	float: none;
	width: 192px;
	padding-left: 30px
}
.footer__box:not(:last-child) {
	margin-bottom: 36px
}
.footer__classroom {
	margin-top: -15px;
	margin-bottom: 80px
}
.footer__place {
	display: list-item
}
}


.btn--reserve { letter-spacing: -0.1em;}
.btn--reserve span { margin-left: -0.2em; letter-spacing: -0.3em;}

:target::before { padding-top: 80px; margin-top:-80px; content:""; display:block; }
#wrapper { overflow:auto; overflow-x:hidden;padding-top: 130px;}
.inner{max-width: 1000px;margin: 0 auto;}
@media (max-width: 899px){
	.inner{padding: 0 3%;}
	#wrapper { overflow:auto; overflow-x:hidden;padding-top: 130px;}
}
@media (max-width: 799px){
	#wrapper { overflow:auto; overflow-x:hidden;padding-top: 100px;}
}
@media (max-width: 599px){
	#wrapper { overflow:auto; overflow-x:hidden;padding-top:80px;}
}


.subNavi{display: flex;position: relative; position:sticky; top: 60px; padding-top:3px; background:#fff; width: 100%; z-index:101; }
.subNavi li{width: 25%;background: #f0f0f0;}
.subNavi li:not(:last-of-type){border-right: 1px #fff solid;}
.subNavi li a{padding: 5px 1%;text-align: center;display: block;}


@media (max-width: 1099px) {
	.inner{    padding: 0 3%;}

}

@media (max-width:799px) {
	.header__btns { right: 50px;}
	.header__btns .btn--reserve { width: 130px;}
}

@media (max-width: 999px) {
.logo{display: block;}

}
@media (max-width: 799px) {
	.header__btns .btn--reserve{width: 140px;}
}
@media (max-width: 768px) {
.logo{margin: 0 10px;}

}
@media (max-width: 599px) {
	body {font-size: 15px;line-height: 1.6;}
}
@media (max-width: 399px) {
	.logo{margin: 0 5px;}
	.header__btns { right:65px;}
	.header__btn{width: 80px;}
	.subNavi{ top: 46px; }
}


@supports not (position: sticky) {
  .subNavi { position: relative; top:0; }
}


.campBox{padding: 30px 10px;}
.imgCenter{text-align: center;max-width: 700px;margin: 0 auto;}
.contactSet .header__btn{float: none;display: inline-block;width: 230px;margin: 10px;}
.contactSet .btn--header{padding: 15px 0;font-size: 17px;}
.contactSet{text-align: center;}
.contactSet .header__btn:not(:last-child), .contactSet .header__btn{margin: 10px;}
@media (max-width: 599px){
	.contactSet .header__btn{width: 210px;}
	.contactSet .btn--header{padding: 10px 0;}
	.campBox{padding: 20px 10px;}
	.contactSet .header__btn:not(:last-child), .contactSet .header__btn{margin: 7px;}
}



.dbl{display: block;}
.dib{display: inline-block;}
.din{display: inline;}
.dtb{display: table;}
.right, .right p{ text-align:right; }
.center, .center p { text-align:center; }
.under{ text-decoration: underline;}
.bold{ font-weight: bold; }
.txt_center{text-align:center;}
.small{ font-size: 90%; }
.small2{ font-size: 80%; }
/*a[target="_blank"]::after { font-family: "FAsolid"; font-weight:900; content: "\f35d";*/
  display: inline-block; margin:0 0 0 3px; }
.float_left {float: left;}
.float_right {float: right;}
.img_left{ display:block; float:left; margin:0 30px 30px 0; }
.img_right{ display:block; float:right; margin:0 0 30px 30px; }
.img_top{ margin-bottom:30px; }
.clear { clear: both; }
.clearfix::after { display: block; clear: both; content: ""; }
.flex{ display: flex; flex-flow: row wrap; }
.flex_between{ justify-content: space-between; }
.flex_center{ justify-content: center; }
.flex_around{ justify-content: space-around; }
.flex_a_center{ align-items: center; }

.indent { padding-left:1em; text-indent: -1em;}

