@charset "utf-8";
/* CSS Document */

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, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

h1, h2, h3, h4, h5, h6{
	font-weight: bold;
	/*font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";*/
	font-weight:700;
	margin:10px 0;
}
h1 {
	font-size:70px;
	clear: both;
}
h2 {
	font-size:32px;
	clear: both;
}
h3 {
	font-size:44px;
	clear: both;
}
h4 {
	font-size:24px;
	clear: both;
}
body {
    line-height:1;
	background-color: #ffffff;
	height: 100%;
	overflow-x:hidden;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
	
}
article,header,section {
	clear:both;
	width:100%;
}

a {
	text-decoration: none;
	font-weight:bold;
	font-size:110%;
	display: block;
	color: aqua;
}
a:hover {
	color:aqua;
}
footer a {
	font-weight:normal;
	color:#ffffff;
}
footer a:hover {
	font-weight:normal;
	color:aqua;
}
.btn a{
	padding:15px 30px;
	border-radius: 40px;
	background: #00ccff;
	border:1px solid #00ccff;
	color:aliceblue;
}
.btn a:hover{
	background: #ffffff;
	border:1px solid #00ccff;
	color:#00ccff;	
}

/*---スペース 位置 ---*/
.m-top10 {margin-top:10px;}
.m-top20 {margin-top:20px;}
.m-top30 {margin-top:30px;}
.m-top40 {margin-top:40px;}
.m-top50 {margin-top:50px;}
.m-top60 {margin-top:60px;}
.m-top70 {margin-top:70px;}
.m-top80 {margin-top:80px;}
.m-top90 {margin-top:90px;}

.m-right10 {margin-right:10px;}
.m-right20 {margin-right:20px;}
.m-right30 {margin-right:30px;}
.m-right40 {margin-right:40px;}
.m-right50 {margin-right:50px;}
.m-right60 {margin-right:60px;}
.m-right70 {margin-right:70px;}
.m-right80 {margin-right:80px;}
.m-right90 {margin-right:90px;}

.m-left20 {margin-left:20px;}
.m-left30 {margin-left:30px;}
.m-left40 {margin-left:40px;}

.clear {clear: both;}

.left {float:left;}
.right {float:right;}

/*--- color ---*/
.blue { color:#00ccff;}
.orange {color:#ff6600;}

header {
	margin:0 auto;
	height:500px;
	background:url("img/LP-mainimage.jpg") repeat-x;
	background-attachment: fixed;
	background-position: center center;
}
#head{
	max-width:980px;
	margin:0 auto;
	text-align: center;
	padding:10px 5%;
}
#head ul{
	max-width:980px;
	width:100%;
	display:inline;
}
#top-logo{
	float:left;
}
#top-btn{
	float:right;
	display: block;
	width:300px;
}
#head ul li{
	display:inline;
	margin-top:10px;
}

.center {
	text-align:center;
	max-width:980px;
	margin:0 auto;
}
#second {
	max-width:980px;
	height:auto;
	margin:0 auto;
	padding:50px 20px;
	background: url("img/men01.png") no-repeat;
	background-position: right bottom;
}

#second {
	font-size:36px;
	font-weight:600;
	color:#00ccff;
	line-height:1.4em;
}
#seco p {
	max-width: 960px;
	font-size: 36px;
	font-weight:600;
	text-align: center;
	color:orangered;
	display: block;
	margin: 30px auto 50px;
	padding: 0 5%;
}
#seco p span {
	color:deepskyblue;
}
@media screen and (min-width: 680px) {
	#second-img01 {
	display:none;
	}
}
#second2 {
	margin:0 auto;
	height:auto;
	background:url("img/back-01.jpg") repeat-x;
	background-position: center center;
	background-attachment: fixed;
	text-align: center;
	padding:30px 10px;
}
#second2 div {
	max-width: 980px;
	font-size: 32px;
	font-weight:600;
	line-height: 1.4em;
	margin:20px auto;
	padding:20px 0;
}

#chara {
	display:block;
	max-width:900px;
	width:100%;
	margin:30px auto;
}
#chara .base {
	display: block;
	width:350px;
	height:330px;
	background: #fcf0ea;
	padding:3%;
	border-radius:10px;
	margin:10px ;
	text-align: center;
}
#chara .base .title {
	font-weight: 700;
	font-size:30px;
	text-align: center;
	margin-bottom:10px;
}
#chara .base p {
	text-align:left;
	font-size:20px;
	line-height: 1.4em;
}
#chara p img {
	text-align: center;
	width:319px;
	margin:0px auto 15px;
}
@media screen and (max-width: 800px) {
	#chara .base {
	display: block;
	width:90%;
	height:auto;
	background: #fcf0ea;
	padding:3%;
	border-radius:10px;
	margin:10px auto;
	text-align: center;
	float:none;}
}

#voice {
	background: url("img/voice-bk.jpg");
	background-position: center center;
	background-attachment: fixed;
	padding:50px 0;
}
#voice .voice {
	max-width:850px;
	width:90%;
	height:auto;
	border:1px solid #cccccc;
	margin:15px auto;
	background: #ffffff;
	padding:3%;
}
#voice .voice .voice-left{
	width:155px;
	height: auto;
	display: block;
	float:left;
}
#voice .voice .voice-left .box {
	background: #ff6600;
	padding:10px;
	font-size:20px;
	color:#ffffff;
	border-radius: 10px;
	line-height: 1.4em;
}
#voice .voice .voice-right {
	max-width:650px;
	height:auto;
	display: block;
	float:right;
	padding:10px 0;
	font-size:18px;
	line-height: 2em
}

#voice .voice .voice-right .anser{
	padding:10px 20px;
	background: #0099ff;
	border-radius: 40px;
	color:#ffffff;
	line-height: 1.2em;
}
.btn2 a{
	width:60%;
	max-width:600px;
	margin:50px auto 50px;
	text-align:center;
	font-size:24px;
	padding:40px 30px;
	background: #00ccff;
	color:aliceblue;
	border:1px solid #00ccff;
	border-radius: 80px;
}
@media screen and (max-width: 800px) {
	#voice .voice .voice-left{
	width:155px;
	height: auto;
	display: block;
	float:none;
	margin:0 auto;
}
}
.btn2 a:hover{
	background: #ffffff;
	border:1px solid #00ccff;
	color:#00ccff;	
}
.faq {
	width:90%;
	max-width:780px;
	margin:10px auto;
	border:1px solid #cccccc;
	display: block;
	padding:3%;
}
.faq .qes {
	font-size:20px;
	font-weight: 500;
}
.faq .qes:first-letter{
  color:#00ccff;
  font-size:200%;
}
.faq .anser {
	margin-left:30px;
	margin-top:20px;
}
.faq .anser:first-letter{
  color:#ff6600;
  font-size:200%;
  font-weight:bold;
}
#school {
	background: #f5f5f5;
	margin-top:20px;
	padding:30px 0;
	text-align:center;
}
#school ul {
	max-width:930px;
	margin:10px auto 50px;
}
#school ul li {
	display: inline;
	list-style: none;
}
#map{
	width:100%;
	margin:0 auto;
}
@media screen and (max-width: 680px) {
.pc  {
	display:none;
}
	#map{
	width:90%;
	margin:0 auto;
}
}
@media screen and (min-width: 680px) {
.sumaho  {
	display:none;
}
}

.access {
	max-width:980px;
	width:90%;
	margin:20px auto 50px;
}
.access p {
	font-size:22px;
	font-weight: 600;
}
.access h3,h2{
	text-align: center;
}

footer{
	background: url( "img/footer.jpg");
	background-position: center center;
	padding:30px 0 50px;
	text-align: center;
	color:#ffffff;
}
small {
	display: block;
	margin-top:60px;
}
@media screen and (max-width: 680px) {
	header {
		height:auto;
		padding-bottom: 30px;
	}
	#head{
		text-align: center;
	}
#top-logo{
	float:none;
	text-align: center;
}
#top-btn {
	float:none;
	margin: 0;
	width:80%;
	min-width:300px;
}
#head ul li {
	margin-top:0;
	margin-bottom: 20px;
	clear: both;
}
	h1 {
	font-size:50px;
	clear: both;
}
h2 {
	font-size:22px;
	clear: both;
}
h3 {
	font-size:30px;
	clear: both;
}
h4 {
	font-size:20px;
	clear: both;
	margin-bottom: 30px;
}
	section img {
		width:90%;
		height: auto;
	}
	#second {
		background:none;
	}
	#second ul{
	padding: 0 5%;
	font-size:24px;
	font-weight:600;
	color:#00ccff;
	line-height:1.4em;
}
	#seco p {
	font-size: 28px;
	}
	#second2 img {
	width: 100%;
	height:auto;
	margin:0 auto;
}
	#second2 {
		padding:0 5%;
	}
	#second2 p {
	font-size:22px;
		text-align: left;
		line-height: 1.2em;
		margin:0;
	}
	#second2 div {
		margin-top:0;
	}
}