﻿@charset "UTF-8";

/*------------------------------------------------------------
	デフォルトスタイル
------------------------------------------------------------*/
html, body, div, span, figure, img, fieldset,
a, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, small, strong, dl, dt, dd, ol, ul, li,
table, caption, tbody, tfoot, thead, tr, th, td{
	margin:0;
	padding:0;
	border:none;
	outline:none;
	font-size:1em;
}

header,hgroup,nav,article,
section,aside,figure,footer{
	display:block;
}

ol, ul{
	list-style: none;  
}

html{
    font:14px/1.3 "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", Arial, Helvetica, Tahoma, sans-serif;
}



/*------------------------------------------------------------
	レイアウト
------------------------------------------------------------*/
body{
	background:#FFF;
	width:100%;
	color:#252525;
}

/*	リンクタグ	*/

a,
a:hover{
	color:#ffc0cb;
	text-decoration:none;
}



/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/
header{
	width:100%;
	overflow:hidden;}


/*	タイトル	*/
#top h1{
position: relative;
	width:100%;
	background-color: #33ccff;/*水色*/
	padding:2.5% 10px;
	border-bottom:solid 7px #99e6ff;/*薄い青*/
	color:#FFF;
	text-shadow:1px 1px 1px #004673;
}
#top h1:after{
content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
	width:100%;
  height: inherit;
  border-bottom: 3px solid #f0ffff;/*もっとも薄い青*/
}
#top_logo{
position: relative;
	width:100%;
	border-top:solid 4px #ffe6ea;
	border-bottom:solid 3px #ffcce6;
}
#top_logo:before{
  content: "";
  position: absolute;
  left: 0;
  width:100%;
  height: inherit;
  border-top: 5px solid #ffcce6;
}
/*---------------------
	ヘッダー画像
--------------------*/
p#h_image{
	padding:0;
	position:relative;
}

p#h_image img{
	width:100%;
	margin:auto;
}
.pc { display: none !important; }
.sp { display: block !important; }
/*	ヘッダー画像内 文字	*/
p#h_image span{
	padding:0 10px;
	display:block;
	color:#FFF;
	position:absolute;
	z-index:2;
	top:40%;
}

/*	ヘッダー画像下 文字	*/
header h2{
	padding:10px;
	color:#0086AC;
}

header p.des{
	padding:0 10px;
	margin-bottom:5%;
}
/*	電話・問い合わせフォーム	*/
.btn,
a.btn,
button.btn {
width: 47%;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 28px 0;
  margin:0 0 0 8px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn--mizuiro,
a.btn--mizuiro {
  color: #fff;
background:center #33ccff url(/img/tel_back.png) no-repeat;
}
.btn--mizuiro:hover,
a.btn--mizuiro:hover {
  color: #fff;
background:center #99e6ff url(/img/tel_back.png) no-repeat;
}
.btn--pink,
a.btn--pink {
  color: #fff;
background:center #ffb3da url(/img/mail_back.png) no-repeat;
}

.btn--pink:hover,
a.btn--pink:hover {
  color: #fff;
background:center #ffcce6 url(/img/mail_back.png) no-repeat;
}



/*------------------------------------------------------------
	カテゴリ
------------------------------------------------------------*/
article{
	width:100%;
	overflow:hidden;
}

/*---------------------
	カテゴリタイトル
--------------------*/
article .title h2{
	background-image: -moz-linear-gradient(top, #ffeff5, #ffe6f5);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#ffeff5), to(#ffe6f5));
	background-image: -o-linear-gradient(top, #ffeff5, #ffe6f5);
	background-image: linear-gradient(top, #ffeff5, #ffe6f5);
	padding:3% 10px;
	margin:5% 0 0;
	border:solid 1px #ffe4f5;
	border-top:solid 1px #ffe0f5;
}
article .title h2.light{
	background-image: -moz-linear-gradient(top, #73dbff, #6edaff);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#73dbff), to(#6edaff));
	background-image: -o-linear-gradient(top, #73dbff, #6edaff);
	background-image: linear-gradient(top, #73dbff, #6edaff);
	padding:3% 10px;
	margin:5% 0 0;
	border:solid 1px #4cd0fc;
	border-top:solid 1px #53d2fc;
}
/*---------------------
	カテゴリボディ
--------------------*/
article section{
	padding:4% 5px 4% 8%;
	border:solid 1px #dcdcdc;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	-ms-border-radius: 4px;
	margin:3.5% 2.8%;
	background:url(/img/icon_yajirushi.png) no-repeat left center;
}
article section.online{
	padding:4% 5px 4% 8%;
	border:solid 1px #dcdcdc;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	-ms-border-radius: 4px;
	margin:3.5% 2.8%;
	background:url(/img/icon_yajirushi.png) no-repeat left center;
}
article section:hover{
	background:#ffffff url(/img/icon_yajirushi.png) no-repeat left center;
}
article section.online:hover{
	background:#ffffff url(/img/icon_yajirushi.png) no-repeat left center;
}
article section a{
	padding-right:4%;
	display:block;
	overflow:hidden;
}
article section.online a{
	padding-right:4%;
	display:block;
	overflow:hidden;
}
article section.online img{
	width:100%;
}

/*	カテゴリ画像　*/
article section a figure{
	width:100%;
	margin-right:10px;
	padding:0;
	overflow:hidden;

	border:solid 1px #FFF;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;

	float:left;}

article section a figure img{
	background:#FFF;
	width:100%;
	margin-bottom:0.5%;

	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;}

@media screen and (min-width:480px) {
	article section a figure{
		padding-bottom:0.5%;
	}
}

/*	カテゴリ画像の説明文字　*/
article section a h2{
	width:60.5%;
	color:#0086AC;
	float:right;
}

article section a p{
	width:60.5%;
	color:#1C140D;
	float:right;
}
.bgpink{
	background:#ffcce6;
  padding: 10px 0 20px 0;
}
.pbtn, a.pbtn, button.pbtn{
width: 96%;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1;
  position: relative;
  display: inline-block;
  padding: 0;
  margin:10px 0 0 8px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
}
.pbtn:before, .pbtn:after{
  position: absolute;
  z-index: 1;
  top: 85%;
  left: 50%;
  transform: translateX(-50%);
  -webkit- transform: translateX(-50%);
  font-family: FontAwesome;
}
.pbtn:before{
  content: "\f111";/*丸マーク*/
  color: #ffb3da;/*アイコンの色 pink#ffb3da*/
  font-size: 3em;
}
.pbtn:after{
  content: "\f067";/*プラスマーク*/
  color: #fff;/*アイコンの色 pink#ffb3da*/
  font-size: 2.5em;
  top: 88%;
}
.pbtn:nth-of-type(5):before{
  content: "\f111";/*丸マーク*/
  color: #ffb3da;/*アイコンの色 pink#ffb3da*/
  font-size: 3em;
  top: 88%;
}
.pbtn:nth-of-type(5){
  padding:30px 0;
}
.pbtn:nth-of-type(5):after{
  content: "\f067";/*プラスマーク*/
  color: #fff;/*アイコンの色 pink#ffb3da*/
  font-size: 2.5em;
  top: 90%;
}
.pbtn:nth-of-type(7):after{
  content: "\f52c";/*イコールマーク*/
  color: #fff;/*アイコンの色 pink#ffb3da*/
  font-size: 2.5em;
  transform: rotate(90deg);
  transform-origin: 25% 25%;
}
.pbtn:last-child:before{
  display: none;
}
.pbtn:last-child:after{
  display: none;
}

.pbtn--all,
a.pbtn--all {
background:#ffffff;
}
.pbtn--all:hover,
a.pbtn--all:hover {
background:#ffffff;
}

/*	トップに戻る　*/
p.go_top{
	text-align:right;
  font-size: 1.3rem;
}

p.go_top a{
	margin-right:5px;
	padding:5% 15px 5% 0;
	display:block;
	color:#87cefa;
}

/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
/*	フリースペース　*/
.free_space{
	padding:3% 10px;
	border:dotted #C1C1C1;
	border-width:1px 0;
}

.free_space img{
	margin:auto;
	display:block;
	border:solid 1px #333631;
}

/*	メニュー　*/
footer ul{
	padding:0;
	overflow:hidden;
}

footer ul li{
	width:31%;
	margin:1%;
	float:left;
}


/*	コピーライト　*/
address{
	padding:3% 0;
	border-top:dotted 1px #C1C1C1;
}

address p{
	color:#d3d3d3;
	font-size:11px;
	text-align:center;
}

/*汎用*/
.center{
  max-width: 100%;
  margin: 0 auto;
  text-align:center;
}
.font9{
	font-size:9px;
}
.font12{
	font-size:12px;
}
.font18{
	font-size:18px;
}
.gray{
color: #666;
}
.r8{
float: right;
margin:0 18px 0 0;
height: 35px;
line-height: 35px;
}
.m10dw{
margin-bottom:10px;
}
.m10up{
margin-top:10px;
}
.m20{
margin:20px 0;
}
.m10{
margin:10px 0;
}
.m20dw{
margin-bottom:20px;
}
.m20up{
margin-top:20px;
}
.m_15t_10lr{
margin:15px 10px 0;
}
.m50l{
margin:0 0 0 50px;
}
.mt20l20{
margin:20px 0 0 20px;
}
.ml20{
margin:0 0 0 20px;
}
.border_up_dw{
	padding:3% 10px;
	border:dotted #C1C1C1;
	border-width:1px 0;
}
.border_dw{
	margin:10px 0 10px 0;
	border-top:dotted #999999;
	border-width:1px 0;
}
.border_dws{
	margin:20px 10px;
	border-bottom:solid #999999;
	border-width:1px 0;
}
.img100{
 width: 100%;
}
div.link a img:hover{
	background:#ffffe0;
}
a,
a:hover under{
	color:#666;
	text-decoration:underline;
}
/*top 教室外観・内観写真4枚*/
.school_p img.school {
	margin:30px 1% 0 1%;
	width:23%;
}