@charset "UTF-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
body {
	font-size:14px;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height:1.6;
	
}

#one{
	font-size:14px;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height:1.6;
	background-color:#46ceb4;
}

header {
	width:100%;
	height:0px;
}
header2 {
	width:100%;
	height:0px;
}
header3 {
	width:100%;
	height:80px;
}


#contents {
	width:85%;
	margin:0px auto;
	
}


a {
	color:#4B68E7;
}
a:hover {
	color:#043771;
}

p.example1 {
	font-size:16px;
	 }

#animation {
margin: 50px 0;
font-size: 40px;
font-weight: bold;
color: #ff0000;
}
.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


/* 画面外にいる状態 */
.fadein {
    opacity : 0.1;
    transform : translate(0, 50px);
    transition : all 100ms;
    }

/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }
	/* 2つ目の要素に200msのdelayをかける */
#effect2 > div .fadein:nth-of-type(2) {
    -moz-transition-delay:200ms;
    -webkit-transition-delay:200ms;
    -o-transition-delay:200ms;
    -ms-transition-delay:200ms;
    }
/* 3つ目の要素に400msのdelayをかける */
#effect2 > div .fadein:nth-of-type(3) {
    -moz-transition-delay:400ms;
    -webkit-transition-delay:400ms;
    -o-transition-delay:400ms;
    -ms-transition-delay:400ms;
    }



/*================================================
 *  種類ページ
 ================================================*/

#contents1 {
	width:100%;
	margin:0 auto;
	background-color:#FFC200;
}

#contents2 {
	width:100%;
	margin:0 auto;
	background-color:#0EC7A7;
}

#contents3 {
	width:100%;
	margin:0 auto;
	background-color:#F73961;
}
#contents4 {
	width:100%;
	margin:0 auto;
	background-color:#87C82A;
}

#contents5 {
	width:100%;
	margin:0 auto;
	background-color:#AC26C3;
}








h1 {
	font-size:28px;
	text-align:center;
	margin-top:10px;
	margin-bottom:0.5em;
}


h2 {
	margin-top:10px;
	margin-bottom:0.5em;
	font-size:32px;
	color:#333;
	text-align:center;
}

p.tel{ color: #0CF;}


h22{
	margin-top:50px;
	margin-bottom:0.5em;
	font-size:32px;
	color:#333;
	text-align:center;
}

h3 {
	margin-bottom:0.25em;
	font-size:18px;
	color:#ec5331;

}

h3333 {
	margin-bottom:0.25em;
	font-size:28px;
	color:#333;
}
h3334 {
	margin-bottom:0.25em;
	font-size:28px;
	color:#fff;
}
h33 {
	text-align:center;
	margin-bottom:0.25em;
	font-size:20px;
	color:#fff;
}
h31 {
	text-align:center;
	margin-bottom:0.25em;
	font-size:10px;
	color:#333;
	margin:0 5em 0.5em 0;
}
h4 {
	margin-bottom:0.25em;
	font-size:16px;
	color:#333;
	padding:5px;
}
p.mozi1 {
margin-bottom:0.25em;
	font-size:20px;
	color:#FFC200;
	 }
p.mozi2 {
mmargin-bottom:0.25em;
	font-size:20px;
	color:#46ceb4;
	 }
	 p.mozi3 {
margin-bottom:0.25em;
	font-size:20px;
	color:#F73961;
	 }
	 p.mozi4 {
margin-bottom:0.25em;
	font-size:20px;
	color:#87C82A;
	 }
 p.mozi5 {
margin-bottom:0.25em;
	font-size:20px;
	color:#AC26C3;
	 }
 p.mozi6 {
margin-bottom:0.25em;
	font-size:12px;
	color:#999;
	padding:0 5px 0 5px;
	 }



h5 {
	margin-bottom:0.25em;
	padding-left:25px;
	font-size:16px;
	background:url('../images/bg_arrow_black.png') 0 50% no-repeat;
}

h6 {
	margin-bottom:0.25em;
	padding-left:5px;
	font-size:16px;
	font-weight:bold;
}

h11 {

    border-top: 1px solid black;
    margin:23px 0 0;
   text-align:center;
    padding:0; height:24px;

}



  h11 span {
position: relative;
top: -24px;
    padding: 0 20px;
    background:white;

}

.titltec{
	font-size:28px;color:#666;

	background-color:ffff;

	margin-bottom:1em;
	width:100%;
	
}
.pan{
	padding-top:75px;
	
	font-size:12px;color:#666;

	background-color:#fff;

	margin-bottom:0.5em;
	width:100%;
	
}

.titltec h1{
	font-size:28px;color:#333;
text-align:center;
	background-color:#ffff;
	padding:15px 15px;
	margin:auto;
	width:85%;
}

.pan h1{
	font-size:10px;color:#666;
text-align:left;
	background-color:#fff;

	margin-bottom:0em;
	margin:auto;
	width:85%;
}

















p {
	margin:0 0 1em 0;
	color:#999;
}

img {
	vertical-align:bottom;
}

em {
	font-weight:bold;
}

strong {
	font-weight:bold;
	color:#ff0000;
}

pre {
	margin:1em 0;
	padding:1em;
}

blockquote2 {
    margin-bottom:1em;
	padding:1em;
	border:1px dotted #000;
	border-left:5px solid #000;
}

blockquote {

	top: 20px;
	margin-bottom:1em;
	margin-left : auto ; margin-right : auto ;
	padding:1em;
	border:3px dotted #000;
	text-align:center;
	height:300px;
	width:96%;
	clear:both;
	overflow:hidden;
}










ul,ol,dl {
	margin:0 0 1em 0;
}
ul li {
	list-style:disc;

}
ol li {
	list-style:decimal;

}
li {
	margin-left:2em;

}

dt {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
}

dt2 {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
	width:100%;
}

dd {
	margin-bottom:1em;
}

table{
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
}
th {
	padding:10px;
	text-align:center;
	vertical-align:middle;
	border:1px solid #ddd;
	background:#fff;
}
td {
	padding:10px;
	text-align:left;
	border:1px solid #ddd;
}

table.a1{

	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
}
th.a1 {
	padding:10px;
	text-align:left;
	vertical-align:middle;
	border:1px solid #ddd;
	background:#fff;
}

td.a1 {
	padding:10px;
	text-align:right;
	border:1px solid ;
border:1px solid #ddd;
}

/*================================================
 *  汎用クラス
 ================================================*/
/* 写真中央寄せ */
.imgC {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
	text-align:center;
}
.imgC img {
	border-radius:5px;
	margin-bottom:0.5em;
	width:100%;
}

/* 写真左寄せ */
.imgL {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
}
.imgL img {
	float:left;
	margin:0 1em 0.5em 0;
	border-radius:5px;
}


.imgLface {
	clear:both;
	overflow:hidden;
	margin-bottom:30px;
}
.imgLface img {
	float:left;
	margin:0 5em 0.5em 0;
	border-radius:5px;
	width:300px;
}


/* 写真右寄せ */
.imgR {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
}
.imgR img {
	float:right;
	margin:0 0 1em 0.5em;
	border-radius:5px;
}

.imgRface {
	clear:both;
	overflow:hidden;
	margin-bottom:30px;
}
.imgRface img {
	float:right;
	margin:0 0 1em 0.5em;
	border-radius:5px;
	width:600px;
}


/* ボタン（タイプ2） */
.btn033{
	display:block;
	padding:2%;
	color:#1b1b1b;
	text-align:center;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #46ceb4;
	background:#fff;
	transition:all 0.2s ease 0s;
}







/* 2カラム（スマートフォンでは1カラム) */
.twoCol {
	overflow:hidden;
	margin-bottom:20px;
}
.twoColInner {
	overflow:hidden;
	margin-right:-2%;
}
.twoColInner div {
	width:48%;
	float:left;
	margin-right:2%;
	text-align:left;
}
.twoColInner div:nth-child(2n+1) {
	clear:both;
}
.twoColInner img {
	width:100%;
	border-radius:5px;
}

p.left {text-align: left}

/* 2カラム教室用（スマートフォンでは1カラム) */
.ktwoCol {
	overflow:hidden;
	margin-bottom:0px;
}
.ktwoColInner {
	overflow:hidden;

}
.ktwoColInner div {
	width:50%;
	float:left;

	text-align:center;
}
.ktwoColInner div:nth-child(2n+1) {
	clear:both;
}
.ktwoColInner img {
	width:100%;
}

p.left {text-align: left}


/* 2カラムs種類ページ（スマートフォンでは1カラム) */
.two2Col {
	overflow:hidden;
	margin-bottom:20px;
}
.two2ColInner {
	overflow:hidden;
	margin-right:-2%;
}
.two2ColInner div {
	width:48%;
	float:left;
	margin-right:2%;
}
.two2ColInner div:nth-child(2n+1) {
	clear:both;
}
.two2ColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:5px;

}



/* 2カラム（スマートフォンでは1カラム) */
.two1Col {
	overflow:hidden;
	margin-bottom:20px;
	
}
.two1ColInner {
	overflow:hidden;
	margin-right:-2%;
}
.two1ColInner div {
	width:44%;
	float:left;
	margin-right:4%;
}
.two1ColInner div:nth-child(2n+1) {
	clear:both;
}
.two1ColInner img {
	width:100%;
	
	margin-bottom:0.5em;
	border-radius:0px;

}








/* 2カラム????（スマートフォンでは1カラム) */
.fwoCol {
	overflow:hidden;
	margin-bottom:50px;
}
.fwoColInner {
	overflow:hidden;
	margin-right:-2%;
}
.fwoColInner div {
	width:50%;
	float:left;
	margin-right:0%;
}
.fwoColInner div:nth-child(2n+1) {

}


.fwoColInner img {
	width:100%;

}

















/* 3カラム（スマートフォンでは1カラム) */
.threeCol {
	overflow:hidden;
	margin-bottom:10px;
}
.threeColInner {
	overflow:hidden;
	margin-right:-3%;
}
.threeColInner div {
	width:31%;
	float:left;
	margin-right:2%;
	text-align:center;
}
.threeColInner div:nth-child(3n+1) {
	clear:both;
	text-align:left;
}
.threeColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:5px;
}



/* 4カラム（スマートフォンでは2カラム) */
.yonCol {
	overflow:hidden;
	margin-bottom:20px;
}
.yonColInner {
	overflow:hidden;
	
	
}
.yonColInner div {
	width:23%;
	float:left;
	margin:1%;
	text-align:left;
	background-color:#fff;
	box-shadow: 2px 2px 2px 2px  rgba(0,0,0,0.1);
}
.yonColInner div:nth-child(4n+1) {
	clear:both;
	text-align:left;
}
.yonColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:3px;
}

/* 5カラム（スマートフォンでは1カラム) */
.foCol {
	overflow:hidden;
	margin-bottom:0px;
	margin-top:80px;
}
.foColInner {
	overflow:hidden;
	margin-right:-4%;
}
.foColInner div {
	width:19.5%;
	float:left;
	margin-right:0%;
	text-align:center;
}
.foColInner div:nth-child(5n+1) {
	clear:both;
	text-align:left;
}
.foColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:0px;
}


figure {
	position: relative;
	overflow: hidden;
	width: 100%;
}
figure img {
	position: relative;
	z-index: 2;
	-webkit-transition: .3s;
	transition: .3s;
}
figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 110px;
	background: #46ceb4;
	-webkit-transition: .3s;
	transition: .3s;
	text-align:center;
	color:#FFF;
}
figure:hover img {
	-webkit-transform: translateY(-100px);
	transform: translateY(-100px);
}






/* ボタン（タイプ1） */
.btn01 a {
	display:block;
	padding:2% 2% 2% 50px;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:#1b1b1b url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}
.btn01 a:hover {
	background:#2e2e2e url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ2） */
.btn02 a {
	display:block;
	padding:2%;
	color:#1b1b1b;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #1b1b1b;
	background:#fff;
	transition:all 0.2s ease 0s;
}
.btn02 a:hover {
	color:#fff;
	background:#1b1b1b;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ2） */
.btn03 a {
	display:block;
	padding:2% 0 2% 0;
	font-size:16px;
	color:#fff;
	text-align:center;
	text-decoration:none;
	border:0.5px solid #fff;
	border-radius:3px;
	background:linear-gradient(-225deg,  #FF1361 67%,#FFF800 100%);
	transition:all 0.2s ease 0s;
	
}
.btn03 a:hover {
	color:#ec5331;
	padding:2% 0 2% 0;
	font-size:16px;
	text-align:center;
	
	background:#fff;
	transition:all 0.2s ease 0s;
}


/* ボタン（タイプ2） */
.btnx01 a {
	display:block;
	padding:1%;
	color:#ffff;
	text-align:center;
	text-decoration:none;
	border-radius:0px;
	width:20%;
	background:#333;
	transition:all 0.2s ease 0s;
}
.btnx01 a:hover {
	color:#39F;
	
	text-align:center;
	padding:1%;
	background:#333;
	transition:all 0.2s ease 0s;
}




.btn034 a {
	width:280px;
	position:absolute;
	left:50%;
	-ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
	display:block;
	padding:1%;
	color:#fff;
	text-align:center;
	text-decoration:none;
	border-radius:3px;
	border:1px solid #fff;
	background:linear-gradient(-225deg,  #FF1361 67%,#FFF800 100%);
	transition:all 0.2s ease 0s;
}
.btn034 a:hover {
	color:#fff;
	background:#E5305C;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ1） */

.btn04 a {
	font-size:16px;
	text-align:center;
	display:block;
	padding:4% 2% 4% 4%;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:linear-gradient(-225deg,  #FF1361 67%,#FFF800 100%);
	transition:all 0.2s ease 0s;
	width:70%;
	margin:0 auto;
}
.btn04 a:hover  {
	text-align:center;
	display:block;
	padding:4% 2% 4% 4%px;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:#F30;
	transition:all 0.2s ease 0s;
	width:70%;
	
	
}
.btn01 a:hover {
	background:#F30;
	transition:all 0.2s ease 0s;
}


/* ボタン（タイプ5） */
.btn05 a {
	display:block;
	padding:2% 2% 2% 30px;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:#F73961 ;
	transition:all 0.2s ease 0s;
	float:right;
	width:30%;
	text-align:center;
	 bottom: 0;
}
.btn05 a:hover {
	background:#E5305C ;
	transition:all 0.2s ease 0s;
}









/*================================================
 *  ヘッダー
 ================================================*/


header {
	position:relative;
}

header h2 {
	position:absolute;

	top:0%;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:200px;
	height:400px;
	z-index:10;
	font-size:34px;

}


header2 {
	position:relative;
	background-color:#333;
	height:150px;
}

header2 h22 {
	position:absolute;
	top:60%;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:200px;
	height:350px;
	z-index:10;
	font-size:34px;
}

/*================================================
 *  メイン
 ================================================*/
main {
	width:100%;
}

section {
	margin-bottom:10%;
}

/*================================================
 *  フッター
 ================================================*/
.footer {
	clear:both;
	padding:2% 0;
	font-size:11px;
	text-align:center;
	color:#FFF;

	background-color:#333;
}
.footer a {
	color:#fff;
}
.footer a:hover {
	color:#F60;
}







/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	position:fixed;
	bottom:15px;
	right:15px;
}
.totop a {
	display:block;
	text-decoration:none;
}
.totop img {
	background:#ec5331;
}
.totop img:hover {
	background:#333;
}

/*================================================
 *  スライドショー
 ================================================*/


.slide{
	position: relative;
	margin-top:0%;
	overflow:hidden;
	
	
	
}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
}
.slide{
	position: relative;
	margin-top:0;
	overflow:hidden;

}


.slide select.se1{

    color:#ec5331;
	text-align:center;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 280px;
  height: 40px;
  background: rgba(255, 255, 255, 0.4);
 
  position: absolute;
  top: 60%;
  left: 48%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 1;
  padding: 0 0px 0 10px;
  border: 1px solid #ec5331;
  border-radius: 3px;
}
.slide.sel2{

    color:#fff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 80px;
  height: 40px;
  background: #ec5331;
  position: absolute;
  top: 60%;
  left: 60%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 1;
  padding: 0 10px 0 10px;
  border: 2px solid #ec5331;
  border-radius: 3px;
}

@media screen and (max-width: 767px) {
	
	#contents {
	width:85%;
	margin:10px auto;
	
}
	.slide{
		margin-top:56px;
	}
	
	
.slide select.se1{
	text-align:center;

    color:#ec5331;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 280px;
  height: 40px;
  background: rgba(255, 255, 255, 0.4);
 
  position: absolute;
  top: 60%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 1;
  padding-left:50px;
  
  
  border: 1px solid #ec5331;
  border-radius: 3px;
}
.slide.sel2{
	text-align:center;

    color:#fff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 120px;
  height: 40px;
  background: #ec5331;
  position: absolute;
  top: 73%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 1;
  padding: 0 10px 0 10px;
  border: 2px solid #ec5331;
  border-radius: 3px;
}
	
	
}




/*================================================================================================
 *  BOX CUSTOMIZE
 ================================================================================================*/
 .box {
    overflow:hidden;
    margin:10px 0;
    padding:10px;

	text-align:center;
	background: #fff;
}

.box h4 {
    margin-top:0;
	color:#333;
}

.box img {
    float:left;
}

.box p {
    margin-left:210px;
}

.first {
    margin-top:0;
}


/*================================================================================================
 *  検索結果BOX
 ================================================================================================*/








.sbt_1{
	width:50%;
	height:40px;
	background-color:#F73961;
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;

}
.sbt_1:hover{
	background-color:#761c0c !important;
	color:#fff;
}

.select-box01 select {
	width: 100%;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;

	border: 1px solid #999;
	background: #eee;
	background: url(arrow01.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#efebe1 100%);
	background: url(arrow01.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#efebe1 100%);
	background-size: 20px, 100%;
}


.select-box02 select {
	position: relative;
	width: 50%;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;

	border: 1px solid #999;
	background: #eee;
	background: -webkit-linear-gradient(top, #fff 0%,#efebe1 100%);
	background: linear-gradient(to bottom, #fff 0%,#efebe1 100%);
	text-align:center;
}
.select-box02 label {
	position: relative;
}

.select-box02 label:after {
	display: block;
	content: " ";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 20px;
	height: 20px;
	margin-top: -8px;
	background: url(arrow02.png) 0 0 no-repeat;
	background-size: 20px;

	text-align:center;
}


.select-box03 select {
	position: relative;
	width: 70px;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;

	border: 1px solid #999;
	background: #eee;
	background: -webkit-linear-gradient(top, #fff 0%,#efebe1 100%);
	background: linear-gradient(to bottom, #fff 0%,#efebe1 100%);
}
.select-box03 label {
	position: relative;
}

.select-box03 label:after {
	display: block;
	content: " ";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 20px;
	height: 20px;
	margin-top: -8px;
	background: url(arrow02.png) 0 0 no-repeat;
	background-size: 20px;

}










/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:979px) {
	#contents {
		box-sizing:border-box;
		width:100%;
		padding:0 10px;
	}
}

/*===================================================================================================
 *  スマートフォン向けデザイン
 ===================================================================================================*/
@media screen and (max-width:767px) {

body {
	font-size:14px;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height:1.6;
	
}

/* ボタン（タイプ2） */
.btn03 a {
	display:block;
	padding:2% 0 2% 0;
	font-size:12px;
	color:#F60;
	text-align:center;
	text-decoration:none;
	
	border-radius:3px;
	background:#fff;
	transition:all 0.2s ease 0s;
	
}
.btn03 a:hover {
	color:#ec5331;
	padding:2% 0 2% 0;
	font-size:12px;
	text-align:center;
	
	background:#fff;
	transition:all 0.2s ease 0s;
}




	.titltec{
	font-size:20px;color:#666;
	padding-left:0%;
	background-color:#fff;

	margin-bottom:0em;
	margin:auto;
	width:100%;
}
	.titltec h1{
	font-size:20px;color:#333;
	padding-left:0%;
	background-color:#fff;
	border-radius:5px;
	margin-bottom:0em;
	margin:auto;
	width:90%;
}
	.pan{

	background-color:#ffff;
	margin-top:-15px;
	margin-bottom:0em;
	width:100%;
}
.pan h1{
	font-size:10px;color:#666;
	margin-top :5px;
	background-color:#ffff;

	margin-bottom:0em;

	width:95%;
}
h2 {
	margin-top:10px;
	margin-bottom:0.5em;
	font-size:24px;
	color:#333;
	text-align:center;
}



	
	h3333 {
	margin-bottom:0.25em;
	font-size:20px;
	color:#333;
}
h3334 {
	margin-bottom:0.25em;
	font-size:16px;
	color:#fff;
}

	.imgC {
		margin-bottom:30px;
	}
	.imgC img {
		max-width:100%;
	}

	.imgL {
		margin-bottom:30px;
	}
	.imgL img {
		float:none;
		max-width:100%;
		margin-right:0;
	}
	.imgLface {

		margin-bottom:30px;
		text-align:center;
	}
	.imgLface img {
		float:none;
		max-width:100%;
		display: block;
			margin-left: auto;
 margin-right: auto;

		width:80%;
	}

	.imgR {
		margin-bottom:30px;
	}
	.imgR img {
		float:none;
		max-width:100%;
		margin-left:0;
	}

	.twoCol {
		margin-right:0;
		margin-bottom:30px;
	}
	.twoColInner {
		margin-right:0;
	}
	.twoColInner div {
		float:none;
		width:100%;
	}

	.two1Col {
		margin-right:0;
		margin-bottom:0px;
	}
	.two1ColInner {
		margin-right:0%;
	}
	.two1ColInner div {
		float:none;
		width:100%;
	}



	.threeCol {
		margin-bottom:30px;
	}

	.threeColInner {
		margin-right:0;
	}
	.threeColInner div {
		float:none;
		width:100%;
	}




/* 4カラム（スマートフォンでは2カラム) */
.yonCol {
	overflow:hidden;
	margin-bottom:20px;
}
.yonColInner {
	overflow:hidden;
	margin-right:-2%;
}
.yonColInner div {
	width:46%;
	
	margin-right:2%;
	text-align:left;
}
.yonColInner div:nth-child(2n+1) {
	clear:both;
	text-align:left;
}
.yonColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:3px;
}



	/* 2カラムs種類ページ（スマートフォンでは1カラム) */
		.two2Col {
		margin-bottom:30px;
	}

	.two2ColInner {
		margin-right:0;
	}
	.two2ColInner div {
		float:none;
		width:100%;
	}


	/* 2カラム教室用（スマートフォンでは1カラム) */
	.ktwoCol {
		margin-bottom:30px;
	}

	.ktwoColInner {
		margin-right:0;
	}
	.ktwoColInner div {
		float:none;
		width:100%;
	}

/* 5カラム（スマートフォンでは1カラム) */
.foCol {
	overflow:hidden;
	margin-bottom:0px;
	margin-top:0px;
}
.foColInner {
	overflow:hidden;
	margin-right:-4%;
}
.foColInner div {
	width:19.5%;
	float:left;
	margin-right:0%;
	text-align:center;
}
.foColInner div:nth-child(5n+1) {
	clear:both;
	text-align:left;
}
.foColInner img {
	width:100%;
	margin-bottom:0.5em;
	border-radius:0px;
}

}
/*===================================================================================================
 *  スマートフォン向けデザインおわっり
 ===================================================================================================*/

/* headerのインナー */
.inner {
    width: 85%;
    margin: 0 auto;
	position: relative;
	
	
}
.inner:after {
    content: "";

    clear: both;
    display: block;
}

ol2, ul2{
	list-style: none;
	padding: 0px 0px 10px 10px;
}

/* header */
#top-head {
    
    position: absolute;
	margin-top:0%;
    width: 100%;
	height:55px;
    margin: 0 auto 0 ;
    padding: 0 10px 10px 0;
    line-height: 1;
    z-index: 1;
background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
}
#top-head a,
#top-head {
    
	color:#fff;
    text-decoration: none;
	
	
	
	
}
#top-head .inner {
   

}
#top-head .logo {
    float: left;
    font-size: 36px;
	
}
#top-head .logo2 {
	float:right;
    font-size: 36px;
}
#global-nav ul2 {
    list-style: none;
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 12px;
	color:#fff;
}
#global-nav ul2 li2 {
	font-weight:bold;
    float: left;
	padding:0 10px 15px 0;
	color:#fff;
}
#global-nav ul2 li2 a {
	font-weight:bold;
    padding: 0 10px 18px 0;
	
}
#global-nav ul2 li2:last-child {
  font-weight:bold;
  font-size:12px;
}



/* Fixed */
#top-head.fixed {
   
    top: 0;
    position: fixed;
    padding-top: 0px;
    height: 50px;
    
	background: #fff;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f64f59, #c471ed, #12c2e9,#fff);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left,#f64f59, #c471ed, #c471ed,#12c2e9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */




    transition: top 0.65s ease-in;
    -webkit-transition: top 0.65s ease-in;
    -moz-transition: top 0.65s ease-in;
}
#top-head.fixed .logo {
    font-size: 24px;
    color: #333;
}
#top-head.fixed #global-nav ul2 li2 a {
    color: #fff;
    
}

/* Toggle Button */
#nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 14px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 101;
}
#nav-toggle div {
    position: relative;
}
#nav-toggle span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #fff;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
    top: 0;
}
#nav-toggle span:nth-child(2) {
    top: 11px;
}
#nav-toggle span:nth-child(3) {
    top: 22px;
}

@media screen and (max-width: 767px) {
	#top-head,
	.inner {
		width: 100%;
		padding: 0;
	}

	#top-head {
		top: 0;
		position: fixed;
		margin-top: 0;
	}

	/* Fixed reset */
	#top-head.fixed {
		padding-top: 0;
		background: transparent;
	}

	#mobile-head {
		background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
		width: 100%;
		height: 56px;
		z-index: 999;
		position: relative;
	}

	#top-head.fixed .logo,
	#top-head .logo {
		position: absolute;
		left: 13px;
		top: 0px;
		color: #fff;
		font-size: 26px;
	}

	#global-nav {
		position: absolute;
		/* 開いてないときは画面外に配置 */
		top: -500px;
		background: #333;
		width: 100%;
		text-align: center;
		padding: 10px 0;
		-webkit-transition: .5s ease-in-out;
		-moz-transition: .5s ease-in-out;
		transition: .5s ease-in-out;
	}

	#global-nav ul2 {
		list-style: none;
		position: static;
		right: 0;
		bottom: 0;
		font-size: 18px;
	}

	#global-nav ul2 li2 {
		float: none;
		position: static;
		font-size: 18px;
	}

	#top-head #global-nav ul2 li2 a,
	#top-head.fixed #global-nav ul2 li2 a {
		width: 100%;
		display: block;
		color: #fff;
		padding: 18px 0;
		font-size: 18px;
	}

	#nav-toggle {
		display: block;
	}

	/* #nav-toggle 切り替えアニメーション */
	.open #nav-toggle span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(315deg);
		-moz-transform: rotate(315deg);
		transform: rotate(315deg);
	}

	.open #nav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}

	.open #nav-toggle span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
	}

	/* #global-nav スライドアニメーション */
	.open #global-nav {
		/* #global-nav top + #mobile-head height */
		-moz-transform: translateY(556px);
		-webkit-transform: translateY(556px);
		transform: translateY(556px);
	}
	
	
}