/* @charset "UTF-8";
@import url("normalize.css");
@import url("usable.css"); */
@import url(https://fonts.googleapis.com/css?family=Cardo);


/* memo
KnocknoteEducation用css
デフォルトwidth = 1150px

*/

/* -------------------------------------------------------------/
/	fontawesome設定												/
/	www.fontawesome.io/icons/									/
/* -------------------------------------------------------------/
/	common style												/
/--------------------------------------------------------------*/


img{
	  touch-callout:none;
	  user-select:none;
	  -webkit-touch-callout:none;
	  -webkit-user-select:none;
	  -moz-touch-callout:none;
	  -moz-user-select:none;
}
.links {
	border-bottom: #071192 dashed 1px;
}

.links:hover {
	color: #b00000;
	border-bottom: #b00000 dashed 1px;
}

.links:after {
	content: '\f0c1';
	padding: 0 .2em;
	font-family: FontAwesome;
	font-size: 90%;
}


.forSP {
	display: none;
}


a {text-decoration: none;}
.setwidth {width: 1150px;margin: 0 auto; overflow: hidden; position: relative;}/* デフォルトwidth設定 */

section {
}

section > .heading {
	width: 420px;
	padding: 0 110px;
	height: 178px; /* fixedに対する設定 */
	display: block;
	margin: 0 auto 50px auto;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	position: relative;
}

.txtbox {color: #434343;}
.txtbox p {margin-bottom: 1em;line-height: 180%!important;}

/* -------------------------------------------------------------/
/	ELEMENTS + α													/
/--------------------------------------------------------------*/
html{}
body{}

#wrap {
	/* header#mainheaderの高さによる */
	padding-top: 178px;
}

#hrSchoolCourse {
	height: 10px;
	border: none;
	background: url(../img/hr/hr_SchoolCourse.gif);
}

#hrCourseTrial {
	height: 10px;
	border: none;
	background: url(../img/hr/hr_CourseTrial.gif);
}
#hrTrialFees {
	height: 10px;
	border: none;
	background: url(../img/hr/hr_TrialFees.gif);
}
#hrFeesIntro {
	height: 10px;
	border: none;
	background: url(../img/hr/hr_FeesIntro.gif);
}


/* -------------------------------------------------------------/
/	HEADER														/
/--------------------------------------------------------------*/


/* メインヘッダー */
header#mainheader {
	box-shadow: 0 8px 5px -5px rgba(175,175,175,0.3);
	position: absolute;
	top:0;
	padding-top: 20px;
	z-index: 99;
	background: #fff;
	width: 100%;
	background: #fff!important;
}

header#mainheader #header_top {
	padding-bottom: 20px;
}

.logo {
	height:58px;
	display:inline-block;
}

.logo a {
	width: 407px;
	height: 58px;
	background: url(../img/logo2.jpg);
	text-indent: 9999px;
	overflow: hidden;
	float: left;
	z-index: 999;
}

h2#logo2 {
	color:#53323b;
	font-size:10px;
	margin-left:60px;
	position:absolute;
	top:48px;
}


header#mainheader #information {
	float: right;
	position: relative;
	top: 10px;
	display:inline-block;
}

header#mainheader #information div {
	float: left;
}

header#mainheader #social #btn_mypage {
	background: #46c4cf;
	border-radius: 4px;
	margin-bottom: 10px;
}

header#mainheader #social #btn_mypage a {
	width: 160px;
	height: 28px;
	display: block;
	text-align: center;
	color: #fff;
	line-height: 28px;
}
header#mainheader #social ul {
	position: relative;
	top: 5px;
	left: 10px;
}

header#mainheader #social ul li {
	float: left;
}

header#mainheader #social ul li img {
	border-radius: 5px;
}

header#mainheader #information address {
	background: url(../img/icon/icon_tel.png) no-repeat;
	height: 27px;
	line-height: 27px;
	padding-left: 40px;
	color: #483434;
	font-size: 210%;
	font-style: normal;
	letter-spacing: 2px;
	margin-bottom: 10px;
}

header#mainheader #information ul {
	margin-left: 7px;
}

header#mainheader #information ul li {
	float: left;
	font-size: 75%;
	margin-right: 10px;
}

header#mainheader #information ul li:before {
	content: "\f054";
	font-family: fontAwesome;
	font-weight: bold;
	margin-right: .2em;
	font-size: 90%;
	color: #777;
}



header#mainheader #social ul li:before {
	content: none;
}



/* navigation */

#topnav {
	clear: both;
	padding-top: 20px;
}

#topnav > ul {
	margin: 0 auto;
	width: 1150px;
	background: url(../img/nav_partition.gif) no-repeat right 8px;
}

#topnav > ul > li {
	width: 20%;
	float: left;
	height: 60px;
	text-align: center;
	background: url(../img/nav_partition.gif) no-repeat 0 8px;
}

#topnav > ul > li > a {
	height: 45px;
	display: inline-block;
	background: no-repeat;
	font-size: 93%;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	font-weight: bold;
	color: #3b3b3b;
	padding: 5px 0 0 55px;
}

#topnav > ul > li > a span {
	display: block;
	font-size: 77%;
	margin-top: 3px;
	font-weight: normal;
}

#topnav > ul > li.navSCHOOL > a {background: url(../img/icon/nav_SCHOOL.png) no-repeat;}
#topnav > ul > li.navSCHOOL > a:hover {color: #ef1445;}
#topnav > ul > li.navCOURSE > a {background: url(../img/icon/nav_COURSE.png) no-repeat;}
#topnav > ul > li.navCOURSE > a:hover {color: #f6b33f;}
#topnav > ul > li.navTRIAL > a {background: url(../img/icon/nav_TRIAL.png) no-repeat;}
#topnav > ul > li.navTRIAL > a:hover {color: #82bc31;}
#topnav > ul > li.navFEES > a {background: url(../img/icon/nav_FEES.png) no-repeat;}
#topnav > ul > li.navFEES > a:hover {color: #1ba2e8;}
#topnav > ul > li.navINTRO > a {background: url(../img/icon/nav_INTRO.png) no-repeat;}
#topnav > ul > li.navINTRO > a:hover {color: #e43bc1;}


#topnav .subnav {
	width: 100%;
	background: #fff;
	position: absolute;
	left: 0;
	box-shadow: 0 8px 5px -5px rgba(175,175,175,0.3);
	display: none;
}

.subnav_disp {
	display: block!important;
}

#topnav .subnav ul {
	width: 1150px;
	margin: 0 auto;
	padding-top: 40px;
}

#topnav .subnav ul li {
	border-bottom: #b7b7b7 dashed 1px;
}

#topnav .subnav ul li:last-child {
	border-bottom: none;
}

#topnav .subnav ul li dl dt {
	float: left;
	width: 200px;
	padding: 10px;
	font-weight: bold;
	color: #444;
	line-height: 100px;
}

#topnav .subnav ul li dl dd {
	float: left;
	padding: 15px;
}

#topnav .subnav ul li dl dd a {
	display: block;
}

#topnav .subnav ul li dl dd a:hover {
	color: #f6b33f;
}

#topnav .subnav ul li dl dd img {
	margin-bottom: 10px;
}

#topnav .subnav ul li dl dd span {
	display: block;
	font-size: 70%;
}

#topnav .subnav ul li dl dd span + span {
	font-size: 95%;
	font-weight: bold;
}




.fixed {
	position: fixed;
	top: 0;
	width: 100%;
	background: #fff;
	z-index: 10000;
	box-shadow: 0 8px 5px -5px rgba(175,175,175,0.3);
}


/* -------------------------------------------------------------/
/	FOOTER														/
/--------------------------------------------------------------*/

footer {
	background: url(../img/footer_town_white.png) repeat-x top center #f8f8f8;
	margin-top: 150px;
	min-width: 100%;
}

footer > div {
	background: url(../img/bg_footer_rightbottom.jpg) no-repeat right bottom;
}

footer #footerNewsList{
	width: 685px;
	margin-right: 15px;
	float: left;
	margin-bottom: 30px;
	padding-bottom: 40px;
}

footer #footerNewsList dt,
footer #footerNewsList + dl dt {

	color: #888888;
	font-weight: bold;
	border-bottom: #ccc dotted 1px;
	margin-bottom: .5em;
	padding-bottom: 3px;
	margin-right: 5px;
}


footer #footerNewsList dd ul li {
	border: #ebebeb solid 4px;
	margin-bottom: 1em;
	padding: 5px;
	background: #fff;
	border-radius: 10px;
	position: relative;
}

footer #footerNewsList dd ul li div.imgWrap {
	float: left;
	margin-right: 10px;
	width: 140px;
	max-height: 100px;
	overflow: hidden;
}

footer #footerNewsList dd ul li img {
	width: 100%;
	height: auto;
}

footer #footerNewsList dd ul li b {
	display: block;
	margin-bottom: .6em;
	color: #555;
}

footer #footerNewsList dd ul li p {
	font-size: 85%;
	color: #777;
}

footer #footerNewsList dd ul li data {
	position: absolute;
	bottom: 5px;
	right: 5px;
	font-size: 80%;
	color: #aaaaaa;
}

footer #footerNewsList dd ul li .screen-reader-text {
	display: none;
}

footer #footerNewsList dd .moreLink {
	font-size: .8rem;
}


footer #footerNewsList + dl {
	width: 220px;
	float: left;
	margin-left: 5px;
}

footer #footerNewsList + dl ul {
}

footer #footerNewsList + dl ul li {
	margin-bottom: 1em;
	font-size: 80%;
}

footer #footerNewsList + dl ul li:before {
	content: "\f054";
	font-family: fontAwesome;
	font-weight: bold;
	margin-right: .3em;
	font-size: 50%;
	color: #777;
}


footer #footerInfo {
	float: right;
	width: 210px;
	margin-top: -10px;
}


footer #footerInfo address {
	text-align: left;
}

footer #footerInfo address img {
	display: block;
	margin-bottom: 1em;
}

footer #footerInfo address b {
	display: block;
	margin-bottom: .2em;
	color: #666;
	margin-left: 20px;
}

footer #footerInfo address span {
	font-size: 80%;
	color: #666;
	line-height: 150%;
	margin-left: 20px;
	margin-bottom: 5px;
	display: block;
}


footer #footerInfo address a {
	display: block;
	margin-left: 20px;
	margin-bottom: 1rem;
}

footer #footerInfo #footerSocial {
	margin-left: 20px;
	margin-bottom: 2rem;
}

footer #footerInfo #footerSocial li {
	float: left;
	margin-right: 10px;
}

footer #footerInfo #eparkBanner {
	clear: both;
	display: block;
	margin-left: 20px;
}


footer dl {
	width: 20%;
	float: left;
}



footer dl + ul {
}

footer dl + ul li {
	font-size: 93%;
	margin-bottom: 1em;
}

footer small {
	text-align: center;
	line-height: 40px;
	font-size: 85%;
	color: #565656;
	display: block;
	background: url(../img/footer_bottom.gif) repeat-x center bottom;
	margin-top: -32px;
}

footer small span {
/*
	box-shadow: inset 0 0 13px rgba(0,0,0,.3);
	display: inline-block;
	padding: 0 25px;
	border-radius: 20px;
	background: #fff;
	position: relative;
	top: -18px;
*/
}

footer address {
	text-align: center;
	font-style: normal;
}






/* -------------------------------------------------------------/
/	TOPIMG														/
/--------------------------------------------------------------*/

#TOPIMG {
	width: 100%;
	min-width: 1150px;
	overflow: hidden;
	borde: red solid 1px;
}
#TOPIMG  ul li {
	cursor: pointer;
}

#TOPIMG  ul li a {
	display: block;
	width: 100%;
	height: 100%;
}

#TOPIMG  ul li img {
	width: 100%!important;
	max-widt: 1800px;
}


/* -------------------------------------------------------------/
/	FIXNAVIGATION												/
/--------------------------------------------------------------*/

#sidefixnav {
	position: fixed;
	right: 11px;
	bottom: 5px;
	z-index: 99999;
}

#sidefixnav li {
	width: 140px;
	height: 120px;
	margin-bottom: 5px;
	border-radius: 10px;
	text-align: center;
	box-sizing: border-box;
}

#sidefixnav li a {
	display: table-cell; /* IE8から使用可能 */
	vertical-align: middle;
	width: 140px;
	height: 110px;
	color: #fff;
	font-size: 1.1rem;
}

#sidefixnav li#fixnav_trial {
	background: #ffa357;
	border: rgba(87,87,87,0.4) solid 4px;
}

#sidefixnav li#fixnav_inq {
	background: #43df9e;
	border: #17848e solid 4px;
}

#sidefixnav li#fixnav_gotop {
	height: 50px;
	background: rgba(198,198,198,0.7);
}

#sidefixnav li#fixnav_gotop a {
	height: 50px;
}


/* -------------------------------------------------------------/
/	FIXNAVIGATION												/
/--------------------------------------------------------------*/

#sidefixnav {
	position: fixed;
	right: 11px;
	bottom: 5px;
	z-index: 99999;
}

#sidefixnav li {
	width: 140px;
	height: 120px;
	margin-bottom: 5px;
	border-radius: 10px;
	text-align: center;
	box-sizing: border-box;
}

#sidefixnav li a {
	display: table-cell; /* IE8から使用可能 */
	vertical-align: middle;
	width: 140px;
	height: 110px;
	color: #fff;
	font-size: 1.1rem;
}

#sidefixnav li#fixnav_trial {
	background: #ffa357;
	border: rgba(87,87,87,0.4) solid 4px;
}

#sidefixnav li#fixnav_inq {
	background: #43df9e;
	border: #17848e solid 4px;
}

#sidefixnav li#fixnav_gotop {
	height: 50px;
	background: rgba(198,198,198,0.7);
}

#sidefixnav li#fixnav_gotop a {
	height: 50px;
}

/* -------------------------------------------------------------/
/	FIXNAVIGATION　LEFT												/
/--------------------------------------------------------------*/

#sidefixnavleft {
	position: fixed;
	left: 11px;
	bottom: 50px;
	z-index: 99999;
}

#sidefixnavleft li {
	width: 160px;
	height: 160px;
	margin-bottom: 25px;
	border-radius: 80px;
	text-align: center;
	box-sizing: border-box;
}

#sidefixnavleft a {
	display: table-cell; /* IE8から使用可能 */
	vertical-align: middle;
	width: 160px;
	height: 160px;
	color: #fff;
	font-size: 1.1rem;
}

#fixnav_gw {
	border-color: #fff;
	animation: bkg-color 5s infinite;
	-webkit-animation: bkg-color 5s infinite;
	/*border: rgba(87,87,87,0.4) solid 4px;*/
}
#sidefixnavleft li:hover {
  background-color: #fff;
  border-color: #59b1eb;
  color: #59b1eb;
}
@-webkit-keyframes bkg-color {
  0% { background-color: #e74c3c; }
  20% { background-color: #f1c40f; }
  40% { background-color: #1abc9c; }
  60% { background-color: #3498db; }
  80% { background-color: #9b59b6; }
  100% { background-color: #e74c3c; }
}
@keyframes bkg-color {
  0% { background-color: #e74c3c; }
  20% { background-color: #f1c40f; }
  40% { background-color: #1abc9c; }
  60% { background-color: #3498db; }
  80% { background-color: #9b59b6; }
  100% { background-color: #e74c3c; }
}

/* -------------------------------------------------------------/
/	HOTTOPICS													/
/--------------------------------------------------------------*/

#HOTTOPICS {
	background: #f8f8f8;
	margin-top: 60px;
}

#HOTTOPICS #hrTopSchool{
	margin-bottom:0;
}

/* -------------------------------------------------------------/
/	TOPh1													/
/--------------------------------------------------------------*/

#TOPh1 h1{
	background: #ffe8fb;
	text-align:center;
	font-size:15px;
	padding:1em 0.5em;
	color: #5a5a5a;
}

/* -------------------------------------------------------------/
/	SCHOOL	|	スクールについて									/
/--------------------------------------------------------------*/

#SCHOOL > .heading {
	background: url(../img/h1/h1_SCHOOL.gif) no-repeat center bottom #fff;
	text-indent: -9999px;
}

#SCHOOL .classBtn {
	background:#f6b33f;
	border-radius:0.5em;
	color:white;
	float:right;
	font-size:1.5rem;
	padding:0.5em 1.5em;
	position: relative;
	top:-4.5em;
	z-index:10;
}

#SCHOOL h2 {
	borde: red solid 1px;
	font-size: 1.3rem;
	text-align: center;
	margin-top: 3rem;
	margin-bottom: 3rem;
	line-height: 200%!important;
	color: #5a5a5a;
}
#SCHOOL h2 strong {
	color: #f5003b;
}
#SCHOOL h2 em {
	font-style: normal;
	font-weight: bold;
}

#schoolPointList {
	padding-bottom: 20px;
}

#schoolPointList li {
	width: 360px;
	float: left;
	margin-right: 28px;
	text-align: center;
}

#schoolPointList li:nth-child(3n) {
	margin-right: 0;
}

#schoolPointList li img {
	border-radius: 2px;
	margin-bottom: 1em;
	padding: 5px;
	background: url(../img/bg_school_point.gif);
	border: #f6f6f6 solid 2px;
}

#schoolPointList li > strong {
	background: #f20840;
	padding: 8px;
	border-radius: 20px;
	color: #fff;
	font-size: 130%;
	display: block;
	width: 55%;
	margin: 0 auto 1em auto;
}

#schoolPointList li > strong:before {
	content: '\f0eb';
	padding: 0 .4em 0 0;
	font-family: FontAwesome;
	font-size: 108%;
}


#schoolPointList li div strong {
	margin-bottom: 1em;
	display: block;
}

#schoolPointList li div p {
	text-align: left;
	margin-bottom: 1em;
}

#SCHOOL #fourSkills {
	borde: red solid 1px;
	margin-bottom: 6rem;
}
#SCHOOL #fourSkills li {
	width: 23.5%;
	margin-right: 2%;
	float: left;
	backgroun: red;
}
#SCHOOL #fourSkills li:last-child {
	margin-right: 0;
}

#SCHOOL #fourSkills b {
	display: block;
	width: 200px;
	height: 200px;
	line-height: 200px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background: #f5003b;
	margin: 0 auto 1rem auto;
	border-radius: 50%;
}
#SCHOOL #fourSkills p {
	line-height: 180%!important;
	font-size: 1rem;
}

#SCHOOL #fourSkillsSP b {
	display: block;
	width: 200px;
	height: 200px;
	line-height: 200px;
	color: #fff;
	text-align: center;
	font-size: 1.4rem;
	background: #f5003b;
	margin: 0 auto 1rem auto;
	border-radius: 50%;
}
#SCHOOL #fourSkillsSP p {
	line-height: 180%!important;
	font-size: 1rem;
	margin: 2% 4%;
}



/* -------------------------------------------------------------/
/	COURSE	|	コース紹介											/
/--------------------------------------------------------------*/

#COURSE > .heading {
	background: url(../img/h1/h1_COURSE.gif) no-repeat center bottom #fff;
	text-indent: -9999px;
}

#COURSE #course_list li {
	/* width: 260px; 4列ver  */
	width: 358px;
	margin-right: 32px;
	display: inline-block;
	position: relative;

}
/* 4列ver
#COURSE #course_list li:nth-child(4n) {
	margin-right: 0;
}
*/
#COURSE #course_list li:nth-child(3n) {
	margin-right: 0;
}

#COURSE #course_list li strong {
	background: #f6b33f;
	padding: 10px;
	border-radius: 30px;
	display: block;
	width: 7em;
	color: #fff;
	text-align: center;
	margin: 0 auto;
	position: relative;
	top: 20px;
}


#COURSE #course_list li .course_list_wrap {
	border: #f6b33f solid 6px;
	border-radius: 10px;
	text-align: center;
}

#COURSE #course_list li .course_list_wrap img {
	padding: 40px 0;
	position: relative;
	left: 20px;
}

#COURSE #course_list li .course_list_wrap h2 {
	background: #f6b33f;
	display: block;
	font-size: 108%;
	color: #fff;
	padding: 10px 0;
	font-weight: bold;
	margin-bottom: 1em;
}

#COURSE #course_list li .course_list_wrap b {
	margin-bottom: .5em;
	display: block;
}

#COURSE #course_list li .course_list_wrap p {
	font-size: 90%;
	margin-bottom: 2em;
	padding: 0 10px;
}

#COURSE #course_list li .course_list_wrap a {
	background: #f6b33f;
	display: block;
	font-size: 108%;
	color: #fff;
	padding: 15px 0;
	font-weight: bold;
	width: 90%;
	margin: 0 auto 10px auto;
	border-radius: 10px;
}


#COURSE #course_list li .course_list_wrap > a:first-child {
	min-height: 240px;
	display: block;
}
















#COURSE #course_list li .course_list_wrap a span,
#TRIAL #trial_list li .course_list_wrap a span {
	display: inline-block;
		-webkit-transition: 0.5s;
	    -moz-transition: 0.5s;
	    -o-transition: 0.5s;
	    -ms-transition: 0.5s;
	    transition: 0.5s;
}

#COURSE #course_list li .course_list_wrap a span:hover,
#TRIAL #trial_list li .course_list_wrap a span:hover {
	    -webkit-transform: scale(1.4,1.4);
	    -moz-transform: scale(1.4,1.4);
	    -o-transform: scale(1.4,1.4);
	    -ms-transform: scale(1.4,1.4);
	    transform: scale(1.4,1.4);
}

#COURSE #course_list li .course_list_wrap a.nodecoration,
#TRIAL #trial_list li .course_list_wrap a.nodecoration {
	background: none;
	display: block;
	padding: 0;
	margin: 0;
	border-radius: 0;
}

#COURSE #course_list li img.campaignLabel,
#TRIAL #trial_list li img.campaignLabel {
	position: absolute;
	top: -35px;
	left: -35px;
	width: 160px;
	height: auto;
}





/* -------------------------------------------------------------/
/	TRIAL	|	体験教室											/
/--------------------------------------------------------------*/

#TRIAL > .heading {
	background: url(../img/h1/h1_TRIAL.gif) no-repeat center bottom #fff;
	text-indent: -9999px;
}


#TRIAL #trial_list li:nth-child(3n) {
	margin-right: 0;
}

#TRIAL #trial_list li {
	/* width: 260px; 4列ver  */
	width: 358px;
	margin-right: 32px;
	display: inline-block;
	position: relative;
}
/* 4列ver
#COURSE #course_list li:nth-child(4n) {
	margin-right: 0;
}
*/
#TRIAL #trial_list li:nth-child(3n) {
	margin-right: 0;
}

#TRIAL #trial_list li strong {
	background: #81be20;
	padding: 10px;
	border-radius: 30px;
	display: block;
	width: 6em;
	color: #fff;
	text-align: center;
	margin: 0 auto;
	position: relative;
	top: 20px;
}


#TRIAL #trial_list li .course_list_wrap {
	border: #81be20 solid 6px;
	border-radius: 10px;
	text-align: center;
}

#TRIAL #trial_list li .course_list_wrap img {
	padding: 40px 0;
}

#TRIAL #trial_list li .course_list_wrap h2 {
	background: #81be20;
	display: block;
	font-size: 108%;
	color: #fff;
	padding: 10px 0;
	font-weight: bold;
	margin-bottom: 1em;
}

#TRIAL #trial_list li .course_list_wrap b {
	margin-bottom: .5em;
	display: block;
}

#TRIAL #trial_list li .course_list_wrap p {
	font-size: 90%;
	margin-bottom: 2em;
	padding: 0 10px;
}

#TRIAL #trial_list li .course_list_wrap a {
	background: #81be20;
	display: block;
	font-size: 108%;
	color: #fff;
	padding: 15px 0;
	font-weight: bold;
	width: 90%;
	margin: 0 auto 10px auto;
	border-radius: 10px;
}


/* -------------------------------------------------------------/
/	FEES	|	料金体系											/
/--------------------------------------------------------------*/

#FEES > .heading {
	background: url(../img/h1/h1_FEES.gif) no-repeat center bottom #fff;
	text-indent: -9999px;
}


#FEES ul#fees_tab {
	position: relative;
	left: 50%;
	float: left;
	color: #5f5f5f;
	margin: 0 0 30px 20px;
}

#FEES ul#fees_tab li {
	position: relative;
	left: -50%;
	float: left;
	list-style: none;
	padding: 5px 10px;
	border: #f4f3f3 solid 4px;
	border-radius: 10px;
	margin-right: 10px;
	cursor: pointer;
	text-align: center;
	width: 150px;
}

#FEES ul#fees_tab li img {
	width: 50px;
	height: auto;
	padding: 5px;
}


#FEES ul#fees_tab li div {
	background: #fff;
	border-radius: 5px;
	padding: 3px;
	margin-bottom: 5px;
}

#FEES ul#fees_tab .selected {
	border: #f4f3f3 solid 4px;
	background: #4fc6fd;
	color: #fff;
}

#FEES .fees_contents {
	clear: both;
	display: none;
}

.fees_contents h3 {
	font-size: 130%;
	text-align: center;
	margin-bottom: 1em;
	font-weight: bold;
}

#FEES .selectedbox {
	display: block;
}

#FEES table.fee_table {
	border: #01a1eb solid 5px;
	border-collapse: collapse;
	font-size: 120%;
	color: #505050;
	width: 100%;
}

#FEES table.fee_table th {
	background: #4fc6fd;
	color: #fff;
	border: #01a1eb solid 3px;
	padding: 15px 0;
}

#FEES table.fee_table td {
	border: #01a1eb solid 3px;
	padding: 15px 0 15px 20px;
}

#FEES .fee_example {
	background: #4fc6fd;
	border-radius: 6px;
	clear: both;
	margin-bottom: 4em;
}

#FEES .fee_example table {
	margin-top: 30px;
	clear: both;
	border-collapse: collapse;
	width: 100%;
	padding: 10px;
}

#FEES .fee_example td {
	padding: 15px;
	color: #fff;
	text-align: center;
}

#FEES .fee_example .fee_example_sum {
	vertical-align: bottom;
}

#FEES #campaign {
	width: 100%;
}

#FEES #campaign dt {
	border: #fff solid 1px;
	float: left;
	width: 30%;
	height: 2em;
	font-weight: bold;
	font-size: 153.9%;
	color: #676767;
}

#FEES #campaign dd {
	border-bottom: #4fc6fd dashed 1px;
	margin-bottom: 1.2em;
	padding-bottom: 1.2em;
	font-size: 138.5%;
	color: #676767;
	line-height: 160%;
	letter-spacing: 1px;
}


/* -------------------------------------------------------------/
/	INTRO	|	教室案内											/
/--------------------------------------------------------------*/


#INTRO > .heading {
	background: url(../img/h1/h1_INTRO.gif) no-repeat center bottom #fff;
	text-indent: -9999px;
}

#INTRO ul#intro_tab {
	position: relative;
	left: 50%;
	float: left;
	margin-bottom: 30px;
	color: #5f5f5f;
	margin-left: 20px;
}

#INTRO ul#intro_tab li {
	position: relative;
	left: -50%;
	float: left;
	list-style: none;
	padding: 10px 20px;
	border: #f4f3f3 solid 4px;
	border-radius: 10px;
	margin-right: 20px;
	cursor: pointer;
}

#INTRO ul#intro_tab .selected {
	border: #f4f3f3 solid 4px;
	background: #c524a6;
	color: #fff;
}

#INTRO .intro_contents {
	clear: both;
	display: none;
}

#INTRO .selectedbox {
	display: block;
}

#INTRO .intro_contents > div {
	color: #5f5f5f;
}

#INTRO .intro_contents > div > div {
	background: #f8f8f8;
	/* margin-bottom: 20px; */
	border-radius: 4px;
	padding: 30px;
	/* width: calc(451px - 60px); */
	width: 403px;

}

#INTRO .intro_contents > div > div h2 {
	font-weight: bold;
	font-size: 123.1%;
	margin-bottom: 1em;
}

#INTRO .intro_contents > div > div span,
#INTRO .intro_contents > div > div strong {
	display: block;
	margin-bottom: 0.5em;
	font-weight: normal;
}

#INTRO .intro_contents > div > div ul li {
	font-size: 93%;
	position: relative;
	margin-bottom: 1.5em;
	padding-left: 25px;
	line-height: 150%;
}

#INTRO .intro_contents > div > div ul li strong {
	font-weight: bold;
	display: inline;
}

#INTRO .intro_contents > div > div ul li a {
	display: block;
	position: absolute;
	padding: 2px 10px;
	font-size: 93%;
	right: 0;
	top: 0;
	background: #c524a6;
	color: #fff;
	text-align: center;
	border-radius: 10px;
}
#INTRO .intro_contents > div > div ul li a.icon_camera {
	font-size: 90%;
}

#INTRO .intro_contents > div  ul li.train {
	background: url(../img/icon/icon_train.gif) no-repeat;
}

#INTRO .intro_contents > div  ul li.bus {
	background: url(../img/icon/icon_bus.gif) no-repeat;
}

#INTRO .intro_contents .gmap {
	border: none;
}

#INTRO #introSkype {
	background: #f8f8f8;
	padding: 100px;
	border-radius: 5px;
	position: relative;
	text-align: center;
}

#INTRO #introSkype i {
	font-size: 250px;
	display: block;
	color: #009fd9;
	margin-bottom: 30px;
}

#INTRO #introSkype .txtbox {
	font-size: 123.1%;
}


#INTRO .school_photo {
	clear: both;
	width: 1180px;
	padding-top: 15px;
}

#INTRO .school_photo li {
	float: left;
	margin-right: 11px;

}

#INTRO .school_photo li img {
	padding: 2px;
	width: 215px;
	border: #e4e4e4 dotted 1px;
	margin-bottom: 5px;
}

#INTRO .school_photo li span {
	font-size: 80%;
	color: #5f5f5f;
	display: block;
	text-align: center;
}

#INTRO #pathBox {
	width: 100%;
	height: 120%!important;
	background: rgba(15,15,15,0.85);
	z-index: 99999;
	position: fixed;
	top: 0;
	left: 0;
	display: none;
}

#INTRO #pathBox div.pathInnerBox {
	width: 1150px;
	margin: 0 auto;
	height: 100%;
	display: none;
	position: relative;
}

#INTRO #pathBox div.pathInnerBox b {
	display: inline-block;
	height: 30px;
	line-height: 30px;
	font-size: 140%;
	font-weight: normal;
	background: url(../img/icon/icon_pathbox_walker.png) no-repeat left bottom;
	color: #fff;
	text-align: center;
	padding: 100px 0 0 30px;
	margin: 0 0 120px 35%;
}

#INTRO #pathBox div.pathInnerBox ol {
	text-align: center;
}

#INTRO #pathBox div.pathInnerBox ol li {
	display: inline-block;
	color: #fff;
	text-align: left;
	min-width: 400px!important;
	margin: 0 100px 3em 0;
}

#INTRO #pathBox div.pathInnerBox ol li img {
	float: left;
	margin-right: 1em;
	border: #e9e9e9 solid 3px;
}

#INTRO #pathBox div.pathInnerBox ol li p:first-letter {
	font-size: 170%;
	line-height: 170%;
}

#INTRO #pathBox #closePathWindow {
	right: 20%;
	top: 11%;
	z-index: 9999;
	background: rgba(0,0,0,0.94);
	font-size: 110%;
	color: #fff;
	padding: 5px 20px;
	border-radius: 20px;
	border: rgba(245,245,245,0.58) solid 3px;
	display: block;
	cursor: pointer;
}

.pathDisplay {
	display: block!important;
}

#closePathWindow {
	position: absolute;
	top: 0;
}


.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
 

.slick-track {
	display: flex;
	width: 100%; 
}

.slick-slide {
	padding-top: 1px;
	text-align: center;
}

.slick-slide img{
	margin: 0 auto;
	width: 80%;
	display: block;
}
  
@media screen and (min-width: 1025px) {
	.slick-slide {
		padding-top: 10px;
	}
	.slick-slide img{
		margin: 0 auto;
		width: 80%;
		display: block;
	}
}



/* ボタンの位置調整 */
.slick-prev, .slick-next {

	position: absolute;  /* 絶対位置に変更 */
	top: 50%;  /* ボタンを縦中央に配置 */
	transform: translateY(-50%);  /* ボタンを縦中央揃え */
  }
  
  /* ナビゲーションボタンの間隔 */
  .slick-prev {
	left: 10px;  /* 左ボタン */
  }
  
  .slick-next {
	right: 10px;  /* 右ボタン */
  }

 /* スライド内の親要素（画像＋タイトルボックス） */
.slider .parent,
.slider > div {
  position: relative;
}

/* タイトル用ボックス */
.box {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 50%;
  transform: translate(-50%,50%);
  background: #fff;
  padding: 2px;
  box-sizing: border-box;
  font-size: 12px;
  text-align: center;
  box-shadow: 3px 3px 3px gray;
}

/* タイトルテキスト */
.box span {
  display: block;
}