@charset "utf-8";

/*
COMMON,HEADER,CONTENTS,FOOTER,COPYRIGHT
*/

/*
RESET*/
html{width:100%; height:100%; margin:0 auto; padding:0; font-size:87.5%; font-family:"メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
body {width:100%; height:100%; margin:0 auto; padding:0; background:#fffffd; text-align:center; color:#333;}
*{margin:0; padding:0; text-align:left;} img{border:none; vertical-align:bottom;} p{line-height:1.6;} hr{display:none;}
@media screen and (max-width:640px) {img{width:100%;}}
/*CLEARFIX*/
.clear{zoom:100%;} .clear:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line height:0; clear:both;}

/*
LINK*/
a {color:#333; text-decoration:none;}
a:link {color:#333; text-decoration:none;}
a:visited {color:#333; text-decoration:none;}
a:hover {color:#333; text-decoration:none;}
a:active {color:#333; text-decoration:none;}

/*
HOVER IMG*/
a.on{
    display: block;
    line-heiht: 0;
    font-size: 0;
    overflow: hidden;
}
a.on:hover{
    background-color: transparent;
}
a.on:hover img{
    visibility: hidden;
}


/*
*****************************************VISUAL*/
#visual {
	width:100%;
	min-width:960px;
	max-width:1400px;
	background:url(./images/visual.jpg) no-repeat center top;
	margin:0 auto;
	position:relative;
}
#visual > p{
	width:216px;
	position:absolute;
	top:0;
	left:0;
	font-size:0;
	line-height:0;
}
#visual div{
	width:960px;
	margin:0 auto;
	padding:500px 0 0;
	position:relative;
}
#visual h1{
	width:50.9375%;
	position:absolute;
	bottom:0;
	font-size:0;
	line-height:0;
}
#visual div p{
	width:28.22916666666667%;
	position:absolute;
	bottom:143px;
	font-size:0;
	line-height:0;
}

@media screen and (max-width: 640px) {
	img{width:100%;}
	#visual{
		min-width:100%;
		max-width:100%;
		background-size:cover;
	}
	#visual > p{
		width:33.75%;
	}
	#visual div{
		width:100%;
		padding:60% 0 0;
	}
	#visual div p{
		bottom:19%;
	}
}

/*
*****************************************TITLE*/
#title{
	width:960px;
	margin:0 auto;
}
#title h2{
	width:64.79166666666667%;
	margin:5.208333333333333% 3.125% 0;
	font-size:0;
	line-height:0;
}
#title dl{
	margin:0 3.125% 1em;
}
#title dt{
	width:55.3125%;
	margin:0 0 2.083333333333333%;
	font-size:0;
	line-height:0;
}
#title dd{
	margin:0 0 0 .5%;
}

@media screen and (max-width: 640px) {
	#title{
		width:100%;
	}
}

/*
*****************************************COURSE*/
#course{
	width:960px;
	margin:0 auto 3.125%;
}
#course > ul{
	list-style:none;
}
#course > ul > li{
	float:left;
	width:33%;
	background:url(./images/coursebox_top.png) no-repeat center top;
	padding:33px 0 0;
	position:relative;
}
#course > ul > li div{
	background:url(./images/coursebox_mdl.png) repeat-y center top;
}
#course > ul > li h3{
	width:55.458333%;
	background:url(./images/coursebox_rbn.png) no-repeat top left;
	padding:30px 0 30px 10%;
	line-height:0;
	font-size:0;
	position:absolute;
	top:-10px;
}
#course > ul > li dl{
	clear:both;
	padding:2.08333333333334% 0 8px;
	background:url(./images/coursebox_btm.png) no-repeat center bottom;
}
#course > ul > li dt{
	width:62.08333333333333%;
	padding:26.166667% 8.333333333333333% 13%;
	line-height:0;
	font-size:0;
}
#course > ul > li:nth-child(2) dt{
	padding:26.166667% 8.333333333333333% 6%;
}
#course > ul > li dd{
	padding:0 8.333333333333333%;
	line-height:1.5;
}
#course > ul > li dd ul{
	list-style:none;
}
#course > ul > li dd ul li{
	width:99%;
	text-align:center;
	background:#ffd195;
	padding:1.8em 0;
	margin:0 1% 1% 0;
	font-weight:bold;
}
#course > ul > li:nth-child(2) dd ul li{
	width:49%;
	margin:0 1% 1% 0;
	float:left;
	font-size:.75rem;
	padding:1.5em 0;
}
#course > ul > li:nth-child(2) dd ul li:nth-child(5){
	padding:.8em 0;
}
#course > ul > li:nth-child(3) dd ul li{
	padding:3.9em 0;
}
#course > ul > li dd p{
	padding:10px 0 0;
	text-align:center;
}
#course > ul > li dd p.btn{
	padding:10px 0;
	text-align:center;
}
#course > ul > li + li dd p.btn{
	padding:11px 0 10px;
}

@media screen and (max-width: 640px) {
	#course{
		width:100%;
	}
	#course > ul > li{
		float:none;
		width:100%;
		background:#f3ebd8;
		background-image:none;
		margin:0 0 1em;
	}
	#course > ul > li div{
		background-image:none;
	}
	#course > ul > li dl{
		background-image:none;
	}
	#course > ul > li h3{
		background-size:contain;
		padding:3% 0 3% 2%;
	}
	#course > ul > li h3 img{
		width:50%;
	}
	#course > ul > li:nth-child(2) dt,
	#course > ul > li div dt {
		padding-top:10%;
		padding-bottom: 1%;
	}
	#course > ul > li dd p.btn a{
		display:block;
		margin:0 auto;
		width:60%;
	}
	#course > ul > li + li dd p.btn{
		padding:1em 0;
	}
	#course > ul > li:nth-child(2) dd ul li {
	width: 99%;
	float:none;
	font-size:1rem;
	}
}

/*
*****************************************POINT*/
#point > div {
	width:960px;
	margin:0 auto;
}
#point dl{
	width:960px;
	margin:0 auto 1em;
}
#point > div h3{
	margin:5.208333333333333% 3.125% 0;
}
#point > div > p{
	margin:1.125% 3.125% 1.125%;
	font-size:16px;
	font-size:1.143rem;
	font-weight:bold;
}
#point > ol{
	list-style:none;
}
#point > ol > li{
	border-top:5px solid #e9e5e0;
	border-bottom:5px solid #e9e5e0;
	margin:0 0 3.125%;
}
#point > ol > li h4{
	width:960px;
	margin:0 auto;
	padding:20px 0 0;
}
#point > ol > li h4 img{
	width:80%;
}
#point > ol > li h4:before{
	content:url(./images/point01.png);
	margin:-30px 0 0;
	display:inline-block;
}
#point > ol > li + li h4 img{
	width:66%;
}
#point > ol > li + li h4:before{
	content:url(./images/point02.png);
}
#point > ol > li + li + li h4 img{
	width:75%;
}
#point > ol > li + li + li h4:before{
	content:url(./images/point03.png);
}
#point > ol > li + li + li + li h4:before{
	content:url(./images/point04.png);
}
#point > ol > li dl dt{
	width:20.83333333333333%;
	float:right;
	padding:1em 0 0;
}
#point > ol > li dl dd{
	width:72.79166666666667%;
	float:right;
	padding:1em 3.125% 0;
}
#point > ol > li:nth-child(4) dt{
	float:none;
	width:48%;
	margin:0 auto;
}
#point > ol > li:nth-child(4) dd{
	float:none;
	width:93.75%;
}
#point > ol > li:nth-child(4) dd ul{
	list-style:none;
	padding:0 0 0 0;
}
#point > ol > li:nth-child(4) dd ul li{
	list-style:none;
	width:49%;
	margin:0 1% 20px 0;
	float:left;
}
#point > ol > li:nth-child(4) dd ul li span{
	display:block;
	float:left;
	width:30%;
	margin:0 1% 0 0;
}
#point > ol > li:nth-child(4) dd ul li p{
	float:right;
	width:69%;
}

@media screen and (max-width: 640px) {
	#point > div {
		width:100%;
	}
	#point dl{
		width:100%;
	}
	#point > div h3{
		width:57.5%;
	}
	#point ol li h4{
		width:100%;
	}
	#point ol li h4:before{
		content:"";
		background:url(./images/point01.png) no-repeat;
		padding:10% 0 0;
		width:10%;
		margin:0 0 0 2em;
		background-size:contain;
	}
	#point ol li + li h4:before{
		content:"";
		background:url(./images/point02.png) no-repeat;
		background-size:contain;
	}
	#point ol li + li + li h4:before{
		content:"";
		background:url(./images/point03.png) no-repeat;
		background-size:contain;
	}
	#point ol li + li + li + li h4:before{
		content:"";
		background:url(./images/point04.png) no-repeat;
		background-size:contain;
	}
	#point > ol > li:nth-child(4) dd ul li{
		width:100%;
		float:none;
	}
}
/*
*****************************************INFOMATION*/
#infomation {
	width:900px;
	margin:0 auto;
}
#infomation h3{
	width:100%;
	margin:0 0 1%;
}
#info-box{
	border:5px solid #e9e5e0;
	padding:1em;
	margin:0 0 1%;
}
#info-box ol{
	list-style:none;
}
#info-box ol li{
	margin:0 0 1em;
}
#info-box dt{
	float:left;
	width:10%;
	margin:0 5% 0 0;
	font-size:14px;
}
#info-box dd{
	float:right;
	width:85%;
	font-size:14px;
}
#info-box p{
	text-align:right;
}

@media screen and (max-width: 640px) {
	#infomation {
		width:100%;
		margin:0 auto;
	}
	#info-box dt{
		float:none;
		background:#eee;
		width:auto;
		margin:0;
	}
	#info-box dd{
		float:none;
		width:auto;
	}
	#info-box p{
		width:40%;
		margin:0 auto;
	}
}
/*
*****************************************STEP*/
#step{
	width:900px;
	margin:0 auto;
}
#step h3{
	margin:5.208333333333333% 0 3.125%;
	font-size:16px;
	font-size:1.143rem;
}
#step h3 span{
	display:block;
}
#step ol{
	list-style:none;
}
#step ol li{
	width:275px;
	float:left;
	border:4px solid #e9e5e0;
	position:relative;
	margin:0 25px 35px 0;
	background:#fffcfd;
}
#step ol li.none{
	margin:0;
}
#step ol li:after{
	content:url(./images/step_arrow.png);
	display:block;
	position:absolute;
	width:11px;
	height:47px;
	top:0;
	bottom:0;
	right:-22px;
	margin:auto;
}
#step ol li.none:after{
	content:"";
}
#step ol li.last:after{
	content:url(./images/step_arrow2.png);
	display:block;
	position:absolute;
	width:47px;
	height:11px;
	top:-25px;
	bottom:auto;
	left:0;
	right:0;
	margin:auto;
}

#step ol li dl{
	background:url(./images/step_bg.png) no-repeat left top;
	padding:100px 1em 1em;
	position:relative;
}
#step ol li dl dt{
	text-align:center;
	margin:0 0 1em;
}
#step ol li dl dt:before{
	content:url(./images/step01.png);
	display:block;
	margin:-80px 0 30px;
}
#step ol li + li dl dt:before{
	content:url(./images/step02.png);
}
#step ol li.none dl dt:before{
	content:url(./images/step03.png);
}
#step ol li.last dl dt:before{
	content:url(./images/step04.png);
}
#step ol li dl dd img{
	display:block;
	margin:0 auto 1em;
}
#step ol li.last dl dd, #step ol li.last dl dd img{
	margin:0;
	padding:0;
}
#step ol li + li dl dd{
	margin:0 auto;
	padding:0 0 1.45em;
}
#step ol li.none dl dd{
	margin:0 auto;
	padding:0;
}

#step ol li.last{
	width:892px;
	margin:0;
}
#step ol li.last dl{
	background:url(./images/step_bg2.png) no-repeat left top;
	padding:0 1em 1em;
}
#step ol li.last dl dt{
	float:left;
	margin:99px 0 7px 0px;
}
#step ol li.last dl dd{
	float:right;
	margin:26px 0 0;
}
#step ol li.last dt img{
	margin:0 0 10px;
}
@media screen and (max-width: 640px) {
	#step{
		width:100%;
	}
	#step h3 img{
		width:37.65625%;
	}
	#step ol li, #step ol li.none, #step ol li.last{
		margin:0 0 30px;
		width:100%;
		padding:0;
		border-left:none;
		border-right:none;
		background:#ffcd8d;
	}
	#step ol li:after{
		content:url(./images/step_arrow2.png);
		display:block;
		position:absolute;
		width:47px;
		height:11px;
		top:auto;
		bottom:-25px;
		right:0;
		left:0;
		margin:auto;
	}
	#step ol li dl dd{
		text-align:center;
	}
	#step ol li dl, #step ol li.last dl{
		background:none;
		padding:80px 1em 1em;
	}
	#step ol li.last dl dt{
		float:none;
		margin:0;
	}
	#step ol li.last dl dd{
		float:none;
	}
	#step ol li dl dd img{
		width:58.75%;
	}
	#step ol li.last dl dd img{
		width:100%;
	}
	#step ol li dl dt img{
		width:30.15625%;
	}
	#step ol li + li dl dt img{
		width:32.65625%;
	}
	#step ol li.none dl dt img{
		width:35.3125%;
	}
	#step ol li.last dl dt img{
		width:22.21875%%;
	}
	#step ol li dl dt:before{
		content:url(./images/step01.png);
		display:block;
		margin:-80px 0 0;
	}
}


/*
*****************************************COPYRIGHT*/
#inquiry {
	width:900px;
	margin:0 auto 3.125%;
}
#inquiry h3 {
	margin:5.208333333333333% 0 3.125%;
	font-size:16px;
	font-size:1.143rem;
}
#inquiry h3 span{
	display:block;
}

@media screen and (max-width: 640px) {
	#inquiry {
		width:100%;
	}
	#inquiry h3 img{
		width:32.03125%;
	}
}
/*
*****************************************FORM*/
#form {
	background:#fef0dd;
	border-top:4px solid #ffcd8d;
	border-bottom:4px solid #ffcd8d;
}
#form h3{
	width:960px;
	margin:0 auto;
	text-align:center;
	position:relative;
	padding:3em 0;
}
#form h3 span{
	display:block;
	text-align:center;
	position:absolute;
	right:8em;
	left:0;
	top:2em;
	font-size:16px;
	font-size:1.143rem;
}
#form h3:after{
	content:url(./images/form_free.png);
	display:inline-block;
	margin:-60px 0 0;
}
#form ul{
	width:900px;
	margin:0 auto 3.125%;
	list-style:none;
}
#form ul li{
	width:41.11111111111111%;
	float:left;
	margin:0 9.222222222222222% 0 0;
}
#form ul li.none{
	margin:0;
}
#form ul li.none dt{
	margin:0 0 7px;
}

@media screen and (max-width: 640px) {
	#form h3{
		width:100%;
		padding-bottom:6%;
	}
	#form h3 img{
		width:48.59375%;
	}
	#form h3:after{
		content:"";
		background:url(./images/form_free.png) no-repeat;
		display:inline-block;
		margin:-60px 0 0;
		width:21.09375%;
		padding:22% 0 0;
		background-size:contain;
	}
	#form ul{
		width:100%;
	}
	#form ul li, #form ul li.none{
		float:none;
		margin:0 auto 6%;
		width:70%;
	}
	#form ul li dl dt{
		width:50%;
	}
}

/*
*****************************************SHCOOL*/
#shcool{
	width:900px;
	margin:0 auto;
}
#shcool h3{
	margin:5.208333333333333% 0 3.125%;
}
#shcool h3 span{
	display:block;
	font-size:16px;
	font-size:1.143rem;
}
#shcool ul{
	list-style:none;
}
#shcool > ul > li{
	float:left;
	width:120px;
	margin:0 10px 0 0;
}
#shcool > ul > li.none{
	margin:0;
}
#shcool > ul > li dl{
	line-height:1.9;
}
#shcool > ul > li dt{
	font-weight:bold;
	color:#002f7c;
}
#shcool > ul > li dt:before{
	content:"■ ";
	color:#002f7c;
}

@media screen and (max-width: 640px) {
	#shcool{
		width:100%;
	}
	#shcool h3{
		width:76.40625%;
	}
	#shcool > ul > li{
		float:none;
		width:100%;
		margin:0;
	}
	#shcool > ul > li dl{
		margin:0 0 1em;
	}
	#shcool > ul > li dt{
		border-bottom:1px solid #002f7c;
	}
	#shcool > ul > li li{
		background:#eee;
		border-top:1px solid #fff;
		border-bottom:1px solid #ccc;
	}
	#shcool > ul > li li a{
		display:block;
		padding:1em;
		text-align:center;
	}
}

/*
*****************************************COPYRIGHT*/
address{
	margin:5.208333333333333% 0 3.125%;
	text-align:center;
	font-style:normal;
}