@charset "utf-8";
/* =====================
	CSSリセット
======================= */
body {margin: 0px;padding: 0px;color: #333333;
	font-family: "メイリオ", "ＭＳ Ｐゴシック", "小塚ゴシック Pro R", "ヒラギノ角ゴ Pro W3", "Meiryo", "MS PGothic", "KozGoPro-Regular", "Hiragino Kaku Gothic Pro", "MS UI Gothic", Osaka, sans-serif;
	font-size: 16px;line-height: 2;	background-color: #fff;	background-size: 25px 25px;	-webkit-text-size-adjust: none;
}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px; padding: 0px;	font-size: 100%; font-weight: normal;}
table {border-collapse:collapse; border-spacing:0;}
ul {margin:0; padding:0; list-style-type:none;}
ol {padding-left: 40px;	padding-bottom: 15px;}
img {border: none; max-width: 100%;	height: auto; vertical-align: middle;}
table {border-collapse:collapse; font-size: 100%; border-spacing: 0;}
p {margin:0 0 .5em;}
br {letter-spacing:0;}
hr {display:block; height:1px; border:0; border-top:1px solid #999;	margin:1em 0; padding:0;}

img.w100{
	width: 100% !important;
}
img.w031{
	width: 31% !important;
}

img.w024{
	width: 24% !important;
}

img.w200{
	width: 200px !important;
}


/* -------------------------------------------------------------
header
------------------------------------------------------------- */
#Pagetop{padding:15px 15px 15px 5px; background:#ffffff;	position: relative;	margin-bottom:0;	position: fixed; width:100%; top: 0px; left: 0px; z-index: 99; height:50px;box-shadow: 2px 2px 4px gray;}
#titlesp h1 img{width:183px; height:50px; }
#titlesp {float: left; padding:3px 5px 0 0;}
#Pagetop {display: none;}
#nav-drawer {position: relative;	padding:0; margin: 0; float: right;}
/*チェックボックス等は非表示*/
.nav-unshown {display:none;}
/*アイコンスペース*/
#nav-open {display: inline-block; width: 30px; height: 22px; vertical-align: middle;	padding:15px 35px;}
/*ハンバーガーアイコン*/
#nav-open span, #nav-open span:before, #nav-open span:after {  position: absolute; height: 3px;/*線の太さ*/	width: 25px;/*長さ*/  border-radius: 3px;  background: #c3292f;  display: block;  content: '';	cursor: pointer;}
#nav-open span:before { bottom: -8px;}
#nav-open span:after { bottom: -16px;}
/*閉じる用の薄黒カバー*/
#nav-close { display: none; position: fixed;  z-index: 99;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: black;  opacity: 0;  transition: .3s ease-in-out;}
/*中身*/
#nav-content {overflow: auto; position: fixed; top: 0;  left: 0;  z-index: 9999;  width: 80%; max-width: 330px; height: 100%; background: #fff;  transition: .3s ease-in-out;  -webkit-transform: translateX(-105%);  transform: translateX(-105%);}
/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {display: block; opacity: .5;}
#nav-input:checked ~ #nav-content {-webkit-transform: translateX(0%); transform: translateX(0%);  box-shadow: 6px 0 25px rgba(0,0,0,.15);}
/*--- #globalnav_sp -----------------------*/
ul.globalnav_sp  li {float: left;	width: 100%;}
ul.globalnav_sp li a {display: block;	color:#333;	background: #fff;	font-size: 15px;	letter-spacing: 0.1em;	text-decoration: none;	text-align: left;	padding: 10px 20px;	border-bottom: 1px solid #666699;	border-right: 1px solid #666699;}
ul.globalnav_sp li.nowpage a {background:#333;	color: #fff;}
ul.globalnav_sp a:hover {background:#333;	color: #fff;}


/* -------------------------------------------------------------
PAGES
------------------------------------------------------------- */
body{width:100%; overflow-x:hidden;}
.wrapper{width:100%; overflow-x:hidden;}
.wrapper img {border-radius: 5px;}
.container {width: 100%; max-width: 950px; margin-left: auto; margin-right: auto;}
section {width: 100%; overflow:hidden; padding:15px 0;}
article{width: 100%; overflow: hidden; }

/* -------------------------------------------------------------
header nav
------------------------------------------------------------- */
header{position:relative; height:103px;width:100%; background: #FFF;-ms-box-shadow:0px -3px 8px -1px #ccc inset;-moz-box-shadow:0px -3px 8px -1px #ccc inset;-webkit-box-shadow:0px -3px 8px -1px #ccc inset;-o-box-shadow:0px -3px 8px -1px #ccc inset;box-shadow:0px -3px 8px -1px #ccc inset;}
.toplogo{position:absolute; top:17px; left:5px; height:65px;}
header nav {position:absolute; top:34px; left:285px;}
header nav ul {padding: 0; border-left: none; line-height: 1.3;	margin: 0;}
header nav ul li:first-child {float: left;}
header nav ul li {text-align: center; font-size:14px; font-weight:bold; float: left;   padding: 0px 13px 0px 13px;}
header nav ul li a{color:#333; text-decoration: none; }
header nav ul li.nowpage a{color:#d73444; 	text-decoration: none;}
header nav ul li a:hover{color:#d73444; text-decoration: none;}

.br::before {content: "\A" ; white-space: pre ;}
.nav_ja{font-size:12px;	font-weight:normal;	color:#ccc;}

/* -------------------------------------------------------------
topimg
------------------------------------------------------------- */
.topimg_area{width:100%;  overflow-x:hidden; background: #00316c; text-align:center;}
.topimg_area h1 img{width:100%; height:auto; max-width: 950px;}
.timg{margin-top:0;}

/* -------------------------------------------------------------
midashi
------------------------------------------------------------- */
h1 img{width:100%; max-width: 100%;	height: auto; margin-top:0;}
h2 {font-size: 1.5em; margin: 0 0 1em 0; color: #333; line-height: 1;}
h3 {font-size: 1.3em; font-weight: bold; width:100%; margin:15px auto; clear: both;}
h3.traffic{font-size: 1.1em; text-transform: uppercase; color: #601986; clear: left; border-left-width: 3px; border-left-style: solid; border-left-color: #601986; text-indent: 8px; margin-top: 0;	margin-right: 0; margin-bottom: 0.5em; margin-left: 0;}
.icon01{position:relative; line-height:33px; padding-left:1.5em;}
.icon01:before{position:absolute;left:0; content:""; display:inline-block; width:30px; height:30px; background:url(../img/icon/icon01.png) no-repeat;  background-size: contain; vertical-align: middle;}
.icon02{position:relative; line-height:28px;	padding-left:1.5em;}
.icon02:before{position:absolute; left:0; content:""; display:inline-block; width:25px; height:25px; background:url(../img/icon/icon02.png) no-repeat; background-size: contain; vertical-align: middle;}

/* -------------------------------------------------------------
挨拶
------------------------------------------------------------- */
.gtitle{font-size: 1.15em;	font-weight:bold; margin:10px 0; }
.garea{margin:10px 0; clear: both; overflow: hidden;}
.skome{padding:0;}
.gimg{width:150px; height:auto; float:left;margin-right:10px; margin-bottom:0; margin-top:5px;}

/* -------------------------------------------------------------
Info
------------------------------------------------------------- */
div#news div#information div {margin: 10px 0; border-top: 1px dotted #333333; padding-top: 10px;}
div#news dl dt {font-weight: bold; clear: both;	float: left; width: 90px; padding: 10px 15px 5px 5px;}
div#news dl dd {padding: 10px 5px 5px 135px;}
.infow{width:95%; margin:0 auto;}

/* -------------------------------------------------------------
 スクールについて
------------------------------------------------------------- */
.sch{width:350px; padding:13px 0 10px 0; background: #383838; margin-top: 35px; border-radius: 10px; line-height: 1;	color:#fff;	text-align: center !important; clear: both;}
.sc_info_img{float:left; width:190px; margin-bottom:25px; margin-right:15px;clear: both;}
.sc_info_img2{float:left; width:190px; margin-top:35px; margin-bottom:25px; margin-right:15px;clear: both;}
.sc_info_p{float:left; width:78%; max-width:750px; margin-bottom:25px;}
.entry { position: absolute;bottom: 0px;right: 60px;}
.entry02 {display: none;}		
.parent {position: relative; overflow: hidden; margin-bottom:25px; }
.carea{padding-bottom:25px;}
.ctitle{font-size: 1.15em;	font-weight:bold;  margin:35px 0 0 0;}

/* -------------------------------------------------------------
program
------------------------------------------------------------- */
.program {width:95%; text-align: left;	list-style: none; margin:15px 0 0 0; position: relative; border:solid 1px  rgb(168, 168, 168); padding:30px 2%;  box-shadow: 2px 2px 4px gray; overflow: hidden; border-radius: 5px;}
.etitle{width:100%;  font-size: 1.5em; font-weight: bold; padding: top 0; padding-bottom:0px; padding-left:0px; line-height: 1; border-bottom:solid 1px #000; }
.c_img{float: left; width:28%; margin-top:5px; margin-right:2%;}
.c_info{float: left; width:70%; margin-top:5px;}

.p_data{margin:0 0 13px 0; width:100%;}
.p_data dt{position: relative; color: #fff; font-weight:normal; min-width:50px; float:left; clear:both; padding:2px 6px;background-color : #c3292f;	width:10%;	text-align-last: justify; line-height: 2;}
.p_data dt::after{left: 98%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(136, 183, 213, 0); border-width: 10px; margin-top: -10px; border-left-color: #c3292f;}
.p_data dd{width:85%; padding:2px 2px 2px 15px; display:inline-block; background-color:none;margin:0; line-height: 2; background: rgb(241, 241, 241);}

.s_img{float: left; width:20%; margin-top:5px; min-width:150px; margin-right:15px;}
.s_info{float: left; width:78%; margin-top:5px;}

.o_lesson_img{float:left; min-width:150px; max-width:200px;margin-right:15px;}
.class_img{float:left; margin-bottom:50px; max-width:235px;min-width:150px; margin-right:5%;}

.threeimg{width:100%; clear: both;}



/* -------------------------------------------------------------
 スケジュール
------------------------------------------------------------- */
/*--#表示タブ切り替え--------------------------------------------------------*/
input, .content {display: none;	background: #fff; line-height: 25px; padding: 5px 0; color: #000; width: 100%;}
#one:checked ~ .one,#two:checked ~ .two,#three:checked ~ .three,#four:checked ~ .four,#five:checked ~ .five,#six:checked ~ .six ,#seven:checked ~ .seven,#eight:checked ~ .eight,#nine:checked ~ .nine{display: block;}
label[for="one"],label[for="two"],label[for="three"],label[for="four"],label[for="five"],label[for="six"],label[for="seven"],label[for="eight"],label[for="nine"]{
	width:32%; margin-bottom:1%; margin-left:1%; cursor: pointer;	background: #f8f8f5; font-size: 15px; font-weight: bold; padding: 15px 0; display: inline-block;	text-align: center;	color: #000; margin-right: -5px; transition: .25s linear; }
label[for="one"]:hover,label[for="two"]:hover,label[for="three"]:hover,label[for="four"]:hover,label[for="five"]:hover,label[for="six"]:hover,label[for="seven"]:hover,label[for="eight"]:hover,label[for="nine"]:hover
{background: #d4d2c6;}
input:checked + label[for="one"] {background: #d4d2c6;}
input:checked + label[for="two"] {background: #d4d2c6;}
input:checked + label[for="three"] {background: #d4d2c6;}
input:checked + label[for="four"]{background: #d4d2c6;}
input:checked + label[for="five"] {background: #d4d2c6;}
input:checked + label[for="six"] {background: #d4d2c6;}
input:checked + label[for="seven"] {background: #d4d2c6;}
input:checked + label[for="eight"] {background: #d4d2c6;}
input:checked + label[for="nine"] {background: #d4d2c6;}
/*----*/

.stitle{font-size: 1.15em;	font-weight:bold; margin:35px 0;}

table {border-collapse:collapse; border-spacing:0; margin-bottom:10px;}
caption {text-align:left; padding:10px 0 0 0;font-size:18px;font-weight:bold;}
.table01 {width:98%; margin-left:1%; font-size:14px; margin-top:25px; min-width:800px;}
.table01 th {padding:5px;  text-align: center; background-color:#e8e8ff; border:1px solid #666699; }
.table01 td {padding:5px 7px; background-color:#fff; border:1px solid #666699;}
.w130{width:130px; text-align: center; }
.w180{width:180px; text-align: center; }
.mt_30{margin-top:-30px;}
.slide-wrap {overflow-x: scroll;	-webkit-overflow-scrolling: touch;	overflow-scrolling: touch;}
@media only screen and (min-width: 850px) {.slide-wrap {overflow-x: hidden;}}

/*カレンダー*/
.cal_wrapper {max-width: 960px; /* 最大幅 */min-width: 300px; /* 最小幅 */	margin: 2.0833% auto;}
.googlecal {position: relative;	padding-bottom: 100%; /* 縦横比 */	height: 0;}
.googlecal iframe {position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;}
/* 画面幅が768px以上の場合の縦横比の指定 */
@media only screen and (min-width: 768px) {	.googlecal { padding-bottom: 75%; }}

/*イベント*/
.event_info{
	width: 94%;
	border:solid #ccc 1px;
	border-radius: 5px;
	padding: 25px;
	margin:0;
	margin-bottom:55px;
}
@media only screen and (min-width: 545px) and (max-width: 912px) {	.event_info{
	width: 90%;}}

@media only screen and (max-width: 545px) {	.event_info{
	width: 82%;}}

.event_info img{
	width: 100%;
	max-width: 350px;
	margin-bottom: 15px;
}

ul.event_day{
	margin:15px 0;
}

ul.event_day li:first-child span{
	font-weight: bold;
	background-color: rgb(90, 90, 90);
	color: #fff;
	padding: 5px 18px ;
}

ul.event_day li:nth-child(2){
	font-weight: bold;
	color:#003399;
	padding-top: 10px;
}

ul.event_day li:nth-child(3){
	font-weight: bold;
	color:#FF66FF;
}

/* -------------------------------------------------------------
FOOTER / copylight
------------------------------------------------------------- */
footer {width:100%; overflow-x:hidden; overflow-y:hidden; background: #00316c; color: #555; font-size:14px; padding:25px 0 0 0; color:#fff; margin-top:50px; clear: both;}
footer div.footer_area{width: 100%; max-width: 950px; margin-left: auto; margin-right: auto; padding: 0;}
footer div.logo_area{float:left; width: 310px; padding: 5px 0 0 0;  text-align: center;}
footer div.fb_area{float:right; width:500px; height:auto; margin-right:50px; margin-bottom:50px;}

.up a { display: block; text-align: right; 	margin: 0 auto; }
ul.staff {margin-top:25px;}
ul.staff li{line-height:1.5;}
.copyR{text-align: center !important;padding-bottom:10px; font-size:12px;} 

/* -------------------------------------------------------------
common
------------------------------------------------------------- */
.floatL {float: left;}
.floatR{float: right;}
.clear {clear:both;}
.textc{text-align: center !important;}
.pt80{padding-top:80px;}
.pt5{padding-top:5px;}
.mt50{margin-top:50px;}
.mt35{margin-top:35px;}
.mt25{margin-top:25px;}
.mt15{margin-top:15px;}
.mt10{margin-top:10px;}
.mt5{margin-top:5px;}
.mb5{margin-bottom:5px;}
.mb15{margin-bottom:15px;}
.mb35{margin-bottom:35px;}
.mb50{margin-bottom:50px;}
.ml5{margin-left:5px;}
.ml15{margin-left:15px;}
.mr1p{margin-right:1%;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.lh14{line-height: 1.4;}
.lh15{line-height: 1.5;}
.lh16{line-height: 1.6;}
.lh25{line-height: 2.5;}
.lh3{line-height:3;}
.lh4{line-height:4;}
.lh05{line-height: 5;}
.lh08{line-height: 8;}
.bold {font-weight:bold;}
small{font-size: 0.9em;	font-weight:bold; padding-left:15px;}
.coach{font-size: 1.15em; font-weight:bold;}
.coach02{font-size: 0.9em;}
.emp{font-size: 1.15em;	font-weight:bold;}
.emp02{font-size: 1.3em; font-weight:bold;}
.small {font-size: 0.6em;}
.small02 {font-size: 0.9em;	padding-left: 15px; }
.white {font-size: 1em;	line-height: 180%;	color: #FFF; font-weight: bold;}
.gray {color: #CCC;}
.red {color: #C30;}
.bdr{border-radius: 0px !important; width:250px;}
.s_mb15{margin-bottom: 5px;}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc {display: block !important;}
.sp {display: none !important; }

@media only screen and (max-width: 959px) {
	.pc {display: none !important;}
	.sp {display: block !important; margin:0 auto;}
}

@media only screen and (min-width: 481px) {
	.pc-tbl {display: block !important;}
	.sp-tbl {display:none !important;}
}

@media only screen and (max-width: 480px) {
	.pc-tbl {display: none !important;} 
	.sp-tbl {display:block !important;}
}

.pagetop {position: fixed;bottom: 20px;right: 20px;}
.table_wrap {overflow-x: auto; -webkit-overflow-scrolling: touch;}

/*--------------------------------------------------------------------
 レスポンシブ
--------------------------------------------------------------------*/
@media screen and (max-width: 1100px) { 
	.toplogo {height:45px;top:27px;}
	header nav {top:36px; left:180px;}
	header nav ul li {font-size:13px;  padding: 0px 10px 0px 10px;}
}

/* =============== 	タブレット向け */
@media screen and (min-width: 480px) and (max-width: 959px) {
	
	#Pagetop {display: block !important;}
	.timg{margin-top:80px;}
	p {margin:0;}
	.container {width: 94%; margin-left: auto; margin-right: auto;}
	.p_data dt{float:none;}
	.p_data dd{width:97%;}
	.c_info{width:70%;}
	.sc_info_img{width:35%; margin-top:5px; margin-right:10px; margin-bottom:0; clear: both;}
	.sc_info_img2{width:35%; margin-top:5px; margin-right:10px; margin-bottom:0; clear: both;}
	.sc_info_p{width:60%; padding:0; margin-bottom:0px}
	.ctitle{clear: both; padding-top:20px;}
	.entry {display: none;}
	.entry02 {display: none;}
	.parent {position: static;}
	label[for="one"],label[for="two"],label[for="three"],label[for="four"],label[for="five"],label[for="six"],label[for="seven"],label[for="eight"]{width:49%;}
}

/* =============== 	スマホ向け */
@media screen and (max-width: 479px) {
	body {font-size: 14px;	line-height: 1.5;}
	p {margin:0;}
	.container {width: 94%; margin-left: auto; margin-right: auto;}
	section {padding:0;}
	#Pagetop {display: block !important;}
	.topimg_area{width:100%; overflow-x:hidden; background: #00316c; text-align:center; padding-top:85px; padding-bottom:5px;}
	h2 {font-size: 1.3em;}
	.icon01{line-height:22px;}
	.icon01:before{ width:20px; height:20px;}
	.icon02{position:relative; line-height:22px;}
	.icon02:before{width:20px; height:20px; }
	/* -------------------------------------------------------------
	挨拶
	------------------------------------------------------------- */
	.gtitle{font-size: 1.1em;	font-weight:bold; margin:10px auto; }
	.garea{margin:10px 0;}
	.skome{padding:0;}
	.gimg{width:35%; float:left;margin-right:10px; margin-bottom:0; margin-top:5px;}
	/* -------------------------------------------------------------
	Info
	------------------------------------------------------------- */
	div#news dl dt {float: none; width: 100%; padding: 10px 15px 5px 5px;}
	div#news dl dd {padding: 0 15px 5px 5px;}
	.infow{width:97%;}

	/* -------------------------------------------------------------
 	スクールについて
	------------------------------------------------------------- */
	.sch{width:90%; margin-top: 35px;}
	.sc_info_img{width:35%; margin-top:5px; margin-right:10px; margin-bottom:0; clear: both;}
	.sc_info_img2{width:35%; margin-top:5px; margin-right:10px; margin-bottom:0; clear: both;}
	.sc_info_p{width:60%; padding:0; margin-bottom:0px}
	.p_data dt::after{display: none;}
	.entry {display: none;}
	.entry02 {display: block; max-width: 50%; margin: 0 auto; padding-top:25px;clear: both;}
	.ctitle{font-size: 1.15em;	font-weight:bold;  margin:35px 0 0 0; }
	.bdr{border-radius: 0px !important; width:200px;}

	/* -------------------------------------------------------------
 	スケジュール
	------------------------------------------------------------- */
	label[for="one"],label[for="two"],label[for="three"],label[for="four"],label[for="five"],label[for="six"],label[for="seven"],label[for="eight"],label[for="nine"]{width:48%; font-size: 13px; }
	.stitle{font-size: 1em; margin:35px 0;}

	/* -------------------------------------------------------------
 	クラスについて
	------------------------------------------------------------- */
	.program {width:90%;}
	.etitle{width:90%;  margin:0 auto; font-size: 1.3em;}
	.c_img{width:90%; margin:5px auto 0 auto; float: none;}
	.c_info{ width:100%; margin-top:15px; float: none;}

	.p_data{width:90%; margin:5px auto 0 auto;}
	.p_data dd{width:95%; padding:2px;background: rgb(255, 255, 255);}

	.threeimg{width:100%; clear: both;  padding-top:10px;}

	.s_img{float: none; width:100%;}
	.s_img img{float: none; width:35%;}
	.s_info{float: none; width:100%; margin-top:15px; margin-bottom:35px;}
	.s_mb15{margin-bottom: 0px;}

	/* -------------------------------------------------------------
 	フッター
	------------------------------------------------------------- */
	footer div.logo_area{display: none;}
	footer div.fb_area{float:none; margin:0 auto; width:auto; padding:25px;}
	ul.staff {display: none;}
	.copyR{font-size:10px;} 

}