/* LESS Document */

/*-----------------------------------------------------------
col
------------------------------------------------------------*/
#wrap,#wrapper	{height:100%;}
.wrap{
	width:100%;
	height:auto;
}
.inner{
	clear:both;
	width:960px;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
}
main{
	
	article{
		clear:both;
		height:auto;
		overflow:hidden;
		margin-bottom:100px;
	}
}
/*----------------------------------------------------------*/


/*-----------------------------------------------------------
global
------------------------------------------------------------*/
/* title */
h1{
	color:#999999;
	font-size:10px;
	margin-top:10px;
}
h2{
	font-size:36px;
	font-weight:bold;
	margin-bottom:20px;
}
h3{
	font-size:28px;
	font-weight:bold;
	margin-bottom:20px;
}
h4{
	font-size:24px;
	margin-bottom:10px;
}
strong{
	color:#aacd03;
}

.icon {
	text-align:center;
	
	img{
		position:relative;
		top:10px;
	}
}
.icon:before {
    content:url(//gakushinkan.co.jp/images/icon-title.png);
    margin:0 10px;
    position:relative;
    top:5px;
}
.icon:after {
    content:url(//gakushinkan.co.jp/images/icon-title.png);
    margin:0 10px;
    position:relative;
    top:5px;
}

.center-line{
	text-align: center;
	position: relative;
	margin-bottom:20px;
}
.center-line::after {
	position: absolute;
	content: '';
	left: 45%;
	bottom: -10px;
	width: 10%;
	border-bottom:1px #dddddd solid;
}

.under-line{
	position: relative;
	border-bottom: 2px solid #f5f5f5;
}
.under-line::after {
	position: absolute;
	bottom: -2px;
	left: 0;
	content: '';
	width: 20%;
	border-bottom: 2px solid #a9cc03;
}

/* bt */
.read-w{
	width:180px;
	text-align:center;
	
	a{
		display:block;
		overflow:hidden;
		color:#1da8d5;
		font-size:14px;
		padding:10px 20px;
		background:#ffffff;
		text-decoration:none;
		border-radius:5px;
		
		&:hover{
			background:#eeeeee;
		}
	}
}
.read-b{
	width:180px;
	text-align:center;
	
	a{
		display:block;
		overflow:hidden;
		color:#ffffff;
		font-size:14px;
		padding:10px 20px;
		background:#1da8d5;
		text-decoration:none;
		border-radius:5px;
		
		&:hover{
			background:#004da1;
		}
	}
}

/* col */
.col4{
	clear:both;
	overflow:hidden;
	
	li{
		float: left;
		width: 225px;
		margin-right: 20px;
		margin-bottom: 20px;
		
		&:nth-child(4n){
			margin-right: 0;
		}
		
		a{
			display:block;
			text-decoration:none;
			
			img{
				width:225px;
				height:auto;
			}
			
			.text-box{
				margin-top:10px;
			}
		}
	}
}

.col3{
	overflow:hidden;
	display: -webkit-flex;
	display: flex;
	justify-content: center;
    flex-wrap: wrap;
	width: 650px;
	margin: 0 auto;
	
	li{
		width: 310px;
		margin: 0 7px;
		margin-bottom: 30px;
		text-decoration:none;
		
		a{
			display:block;
			text-decoration:none;
			
			img{
				width:310px;
				height:auto;
			}
			
			.text-box{
				padding:10px;
			}
		}
	}
}

/* box */
.box-title{
	clear:both;
	color:#ffffff;
	position:relative;
	top:20px;
	left:20px;
	font-size:24px;
	font-weight:bold;
	padding:5px 20px;
	background:#1da8d5;
}
.elementary{
	background:#ffaa00;
}
.junior{
	background:#abcd03;
}
.high{
	background:#004ea2;
}
.box{
	clear:both;
	height:auto;
	overflow:hidden;
	padding:40px 20px 20px 20px;
	border:1px #1da8d5 solid;
	box-sizing:border-box;
	
	img{
		float:left;
		width:300px;
	}
	.text{
		float:right;
		width:600px;
	}
}

/* wp-pagenavi */
.wp-pagenavi{
	clear:both;
	margin-bottom:50px;
	text-align:center;
	
	a,span{
		padding:5px 10px;
		margin:0 1px;
		border-radius:2px;
		border:1px #ddd solid;
		background:#ffffff;
		text-decoration:none;
		
		&:hover{
			background:#eeeeee;
		}
	}
	
	.current{
		color:#ffffff;
		background:#eeeeee;
	}
}

/* table */
table{
	width:100%;
	
	tr{
		width:100%;
		
		th{
			padding:10px;
			width:200px;
			text-align:left;
			font-weight:normal;
			vertical-align:middle;
			background:#f5f5f5;
			box-sizing:border-box;
			border:1px #ddd solid;
		}
		td{
			padding:10px;
			vertical-align:middle;
			box-sizing:border-box;
			border:1px #ddd solid;
			background:#fff;
		}
	}
}
/*----------------------------------------------------------*/


/*-----------------------------------------------------------
header
------------------------------------------------------------*/
header{
	width:100%;
	overflow:hidden;
	border-bottom:1px #1da8d5 solid;
	
	#logo{
		margin-top:15px;
		margin-bottom:30px;
	}
	
	#header-tel{
		margin-top:15px;
        text-align: right
	}
	
	#global-nav{
		clear:both;
		ul{
			
			li{
				float:left;
				width: 192px;
				height:50px;
				font-weight:bold;
				border-left:1px #ddd solid;
				box-sizing :border-box;
				
				&:last-child{
					border-right:1px #ddd solid;
				}
				
				a{
					color:#333;
					display:block;
					padding:14px 0;
					text-align:center;
					text-decoration:none;
					
					&:hover{
						color:#1da8d5;
						background:#f5f5f5;
					}
				}
			}
		}
	}
}

#top-image{
	width:1280px;
	background:#f8f8f8;
	margin:20px auto 10px auto;
	text-align:center;
	overflow:hidden;
}

#bcn{
	width:960px;
	color:#999999;
	margin:10px auto 50px auto;
	font-size:14px;
	
	a{
		text-decoration:none;
	}
}

#target{
	margin-bottom:20px;
	
	img{
		margin-right:2px;
	}
}
/*----------------------------------------------------------*/


/*-----------------------------------------------------------
index
------------------------------------------------------------*/
/* slider */
.container {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	padding-top:20px;
	padding-bottom:30px;
	margin-bottom:50px;
	background:#f9f9f9;
	
	.slide_all {
		width: 1120px;
		margin: 0 auto;
		height: 500px;
		position: relative;
		
		.slide_wrap {
			width: 3360px;
			height:500px;
			position: absolute;
			left: 50%;
			margin-left: -1680px;
			background:#ffffff;
			
			.slide_body {
				width: 100%;
				
				.slide {
					width: 1120px;
					
					img {
						width: 100%;
						vertical-align: bottom;
					}
				}
			}
		}
	}
}
.slide{
	transition:all .3s;
	opacity:0.3;
}
.slide.active{
	opacity:1;
}

#carousel-wrap .flex-direction-nav{
	display:none;
}


/* pager */
.bx-wrapper .bx-pager{
	text-align:center;
	font-size:.85em;
	font-family:Arial;
	font-weight:bold;
	z-index:9999;
	position:relative;
	margin-top:10px;
}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item{
	display:inline-block;
	*zoom:1;
	*display:inline;
}
.bx-wrapper .bx-pager.bx-default-pager a{
	background:#666;
	text-indent:-9999px;
	display:block;
	width:10px;
	height:10px;
	margin:0 5px;
	outline:0;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active{
	background:#1da8d5;
}
.bx-wrapper{
	
	.bx-prev {
		position:relative;
		left:1060px;
		background-repeat:no-repeat;
		background:url(//gakushinkan.co.jp/images/icon-slider-left.png);
		background-size:80px 80px;
		opacity:0.9;
	}
	
	.bx-next {
		position:relative;
		right:1060px;
		background-repeat:no-repeat;
		background:url(//gakushinkan.co.jp/images/icon-slider-right.png);
		background-size:80px 80px;
		opacity:0.9;
	}
	
	.bx-controls-direction{
		
		a {
			position:absolute;
			top:210px;
			outline:0;
			width:80px;
			height:80px;
			text-indent:-9999px;
			z-index:9999;
		}
	}
}

/* content */
#index{
	
	.text-box{
		width:480px;
		height:280px;
		color:#ffffff;
		text-align:center;
		background:#1da8d5;
	}
	
	#news{
		border-top:1px #1da8d5 solid;
		border-bottom:1px #1da8d5 solid;
		
		li{
			padding:10px 0;
			border-bottom:1px #dddddd dotted;
			
			&:last-child{
				border-bottom:0;
			}
            .newsIcon_home {
                width: 160px;
                color: #ffffff;
                font-size: 12px;
                background: #666;
                padding: 4px 0;
                border-radius: 3px;
                margin-right: 20px;
                text-align: center;
            }    
			.information{
                background:#ffb400;
			}
			.blog{
                background:#25bfbb;
            }
			.class{
				background:#FF708F;
			}
            .kids{
				background:#1da8d5;
			}
		}
	}
}
/*----------------------------------------------------------*/



/*-----------------------------------------------------------
page
------------------------------------------------------------*/
#strength{
	
	.strength-message-wrap{
		width:100%;
		height:400px;
		background: url(//gakushinkan.co.jp/images/strength-bg.jpg) 50% 0 no-repeat;
		
		#strength-message-box{
			font-size:18px;
			width:380px;
			margin-top:90px;
		}
	}
}

#elementary,
#junior,
#high{
	
	.public{
		position:relative;
		top:-3px;
		margin-right:10px;
		color:#333333;
		font-size:14px;
		font-weight:bold;
		background:#ffd700;
		border-radius:3px;
		padding:2px 5px;
	}
	
	.private{
		position:relative;
		top:-3px;
		margin-right:10px;
		color:#ffffff;
		font-size:14px;
		font-weight:bold;
		background:#3c9b0a;
		border-radius:3px;
		padding:2px 5px;
	}
}

#faq{
	
	table{
		margin-bottom:50px;
		
		.q{
			font-size:24px;
			font-weight:bold;
		}
		.a{
			
			th{
				vertical-align:text-top;
			}
		}
		
		th{
			width:80px;
			border:0;
			background:none;
			padding:0;
		}
		td{
			border:0;
			background:none;
			padding:0;
		}
	}
}

#zemi{
	
	#zemi-contact{
		position:relative;
		left:-20px;
		width:1000px;
		height:280px;
		background:url(//gakushinkan.co.jp/images/zemi-bg.jpg);
		
		img{
			position:absolute;
			left:460px;
			top:105px;
		}
	}
}

#taiken{
	
	#taiken-nagare{
		
		table{
			width:100%;
			
			tr{
				width:100%;
				
				th{
					width:140px;
					text-align:center;
					vertical-align:middle;
					box-sizing:border-box;
					border:1px #00abdd solid;
					background:#00abdd;
				}
				td{
					padding:0 !important;
					vertical-align:middle;
					box-sizing:border-box;
					border:1px #00abdd solid;
					background:#ffffffs;
					
					.text{
						padding:10px;
						overflow:hidden;
					
						h4{
							margin-bottom:0;
						}
					}
				}
			}
		}
	}
	
	#soudan-nagare{
		
		table{
			width:100%;
			
			tr{
				width:100%;
				
				th{
					width:140px;
					text-align:center;
					vertical-align:middle;
					box-sizing:border-box;
					border:1px #004d9b solid;
					background:#004d9b;
				}
				td{
					padding:0 !important;
					vertical-align:middle;
					box-sizing:border-box;
					border:1px #004d9b solid;
					background:#ffffffs;
					
					.text{
						padding:10px;
						overflow:hidden;
					
						h4{
							margin-bottom:0;
						}
					}
				}
			}
		}
	}
}

#price{
	
	h3{
		margin-bottom:0;
	}
	.public{
		position:relative;
		top:-3px;
		color:#333333;
		font-size:20px;
		background:#ffd700;
		border-radius:3px;
		padding:2px 5px;
	}
	.private{
		position:relative;
		top:-3px;
		color:#ffffff;
		font-size:20px;
		background:#3c9b0a;
		border-radius:3px;
		padding:2px 5px;
	}
	
	.price{
		font-size:13px;
		margin-bottom:10px;
		
		th,td{
			text-align:center;
			padding:10px 5px;
		}
		.atention{
			text-align:left;
			width:400px !important;
			font-size:12px;
		}
	}
	.cost{
		font-size:14px;
		
		th{
			width:auto;
			font-weight:bold;
			background:none;
			border:0;
			padding:5px 0;
			vertical-align:top;
		}
		td{
			background:none;
			border:0;
			padding:5px 0;
			vertical-align:top;
		}
	}
	
	#kids{
		
		.price{
			
			th{
				color:#ffffff;
				background:#ff8c00;
			}
		}
	}
	
	#elementary{
		
		.price{
			
			th{
				color:#ffffff;
				background:#ffaa00;
			}
		}
	}
	
	#junior{
		
		.price{
			
			th{
				color:#ffffff;
				background:#abcd03;
			}
		}
	}
	
	#high{
		
		.price{
			
			th{
				color:#ffffff;
				background:#004ea2;
			}
		}
	}
}

#news{
	
	#container{
		float:left;
		width:700px;
		
		li{
			padding:25px;
			margin-bottom:50px;
			border:5px #f9f9f9 solid;
			box-sizing:border-box;
			
            
            .newsIcon_home {
                width: 160px;
                color: #ffffff;
                font-size: 12px;
                background: #666;
                padding: 4px 0;
                border-radius: 3px;
                margin-right: 20px;
                text-align: center;
            }
			.class{
				background:#FF708F;
			}
			.information{
				background:#ffb400;
			}
			.blog{
				background:#25bfbb;
			}
            .kids{
				background:#1da8d5;
			}
			
			img{
				max-width:640px;
				height:auto;
			}
		}
	}
	aside{
		float:right;
		width:240px;
		
		li{
			overflow:hidden;
			border-top:1px #dddddd solid;
			
			a{
				display:block;
				padding:10px 5px;
			}
			
			&:last-child{
				border-bottom:1px #dddddd solid;
			}
		}
	}
}

#voice{
	
	#target-anc{
		
		li{
			width:310px;
			float:left;
			font-size:20px;
			text-align:center;
			margin-right:15px;
			border-radius:5px;
			
			&:last-child{
				margin-right:0;
			}
			
			a{
				padding:15px;
				display:block;
				color:#ffffff;
			}
		}
	}
	
	section{
		clear:both;
		padding:20px;
		margin-bottom:20px;
		border:1px #00abdd solid;
		box-sizing:border-box;
		overflow:hidden;
		
		.text{
			width:660px;
			float:left;
			
			h4{
				font-weight:bold;
			}
			.name{
				color:#004ea2;
				font-size:18px;
				margin-bottom:10px;
			}
		}
	}
	
	.inquiry{
		clear:both;
		overflow:hidden;
		margin-bottom:50px;
		
		li{
			float:left;
			width:176px;
			height:auto;
			color:#004ea2;
			overflow:hidden;
			margin-right:20px;
			margin-bottom:20px;
			
			&:nth-child(5n){
				margin-right:0;
			}
			
			img{
				width:176px;
				height:247px;
				border:1px #dddddd solid;
				box-sizing:border-box;
			}
		}
	}
	
	#seet-wrap{
		height:auto;
		padding:40px;
		background:#f5f5f5;
		overflow:hidden;
		
		#profile{
			float:left;
			width:200px;
			
			.name{
				color:#004ea2;
				font-size:18px;
				margin-top:20px;
			}
			
			img{
				width:200px;
				height:auto;
			}
		}
		
		#inquiry{
			float:right;
			width:640px;
			
			img{
				width:640px;
				height:auto;
			}
		}
	}
}

#school{
	
	#front{
		
		img{
			float:left;
			width:300px;
			height:auto;
		}
	}
	#school-info{
		float:right;
		width:640px;
		
		th{
			width:100px;
		}
	}
	
	#school-image{
		overflow:hidden;
		margin-bottom:50px;
		
		li{
			float:left;
			width:300px;
			height:auto;
			margin-right:30px;
			
			&:last-child{
				margin-right:0;
			}
		}
	}
	#teacher-voice{
		background:#f9f9f9;
		border:3px #aacd03 solid;
		box-sizing:border-box;
		border-radius:5px;
		margin-left:90px;
		padding:20px 20px 20px 110px;
		z-index:1;
	}
	#teacher{
		position:relative;
		top:-160px;
		margin-bottom:-160px;
		
		img{
			z-index:9999;
		}
	}
}

#sitemap{
		
	.page_item{
		border-bottom:1px #dddddd solid;
		
		a{
			display:block;
			padding:10px;
		}
		
		.children{
			padding-left:20px;
			border-top:1px #dddddd solid;
		}
	}
	
	.page_item_has_children{
		border-bottom:0 !important;
	}
}
/*----------------------------------------------------------*/


/*-----------------------------------------------------------
form
------------------------------------------------------------*/
#contact{
	
	table{
	
		th{
			background:#f9f9f9;
			padding:20px 10px;
			width:200px;
		
			img{
				position:relative;
				top:-4px;
				margin-left:5px;
			}
		}
		
		td{
			padding:20px 10px;
		}
	}
	
	input[type="text"],
	input[type="email"],
	input[type="password"],
	input[type="number"],
	input[type="tel"],
	select,
	textarea{
		padding:10px 5px;
		border:2px #ddd solid;
		box-sizing:border-box;
		border-radius:4px;
		-webkit-appearance:none;
		-moz-appearance:none;
		-ms-appearance:none;
		-o-appearance:none;
		appearance:none;
	}
	
	select{
		width:200px;
	}
	.select{
		color:#dddddd;
		margin-left:-26px;
	}
	
	input[type="password"]{
		padding:10px 5px;
		border:2px #ddd solid;
		box-sizing:border-box;
		border-radius:4px;
		-webkit-appearance:none;
		-moz-appearance:none;
		-ms-appearance:none;
		-o-appearance:none;
		appearance:none;
	}
	
	input[type="submit"]{
		width:320px;
		color:#fff;
		padding:10px;
		font-size:24px;
		border-radius:4px;
		background:#FF6E00;
		-webkit-appearance:none;
		-moz-appearance:none;
		-ms-appearance:none;
		-o-appearance:none;
		appearance:none;
		
		&:hover{
			background:#FF2700;
			-webkit-transition: all 0.2s;
			-moz-transition: all 0.2s;
			-ms-transition: all 0.2s;
			-o-transition: all 0.2s;
			transition: all 0.2s;
		}
	}
	
	.formError {
		font-size:12px;
		color:#f00;
	}
	
	#privacy{
		margin-top:20px;
		padding:20px;
		border:1px #ddd solid;
		box-sizing:border-box;
		background:#ffffff;
		
		.roll{
			width:880px;
			font-size:14px;
			height:240px;
			padding:20px;
			margin:20px;
			overflow:scroll;
			border:1px #ddd solid;
			box-sizing:border-box;
		}
	}
}
	
#contact-bt{
	width:100%;
	text-align:center;
	background:#333333;
	border-radius:35px;

	&:hover{
		background:#000000;
		-moz-transition: .2s;
		-webkit-transition: .2s;
		-o-transition: .2s;
		-ms-transition: .2s;
		transition: .2s;
	}
	
	a{
		font-size:32px;
		color:#ffffff;
		display: block;
		padding: 10px 0;
		text-decoration:none;
		
		span{
			display:block;
			font-size:18px;
		}
	}
}
/*----------------------------------------------------------*/


/*-----------------------------------------------------------
footer
------------------------------------------------------------*/
#cv-contact{
	width:960px;
	height:240px;
	margin-bottom:50px;
	background:url(//gakushinkan.co.jp/images/cv-bg.jpg);
	
	img{
		position:relative;
		left:420px;
		top:70px;
	}
}

footer{
	width:100%;
	
	#footer-campaign{
		width:100%;
		padding:20px 0;
		background:#1da8d5;
		
		ul{
			
			li{
				float:left;
				margin-right:30px;
				
				&:last-child{
					margin-right:0;
				}
			}
		}
	}
	
	nav{
		width:100%;
		padding:50px 0 20px 0;
		background:#f5f5f5;
		
		.footer-nav{
			float:left;
			width:240px;
			font-size:12px;
			
			img{
				top:-5px;
				position:relative;
				margin-right:5px;
			}
			
			a{
				color:#333333;
				text-decoration:none;
				
				&:hover{
					text-decoration:underline;
				}
			}
			
			ul{
				margin-bottom:20px;
				
				li{
					
					a{
						color:#555555;
						margin-left:20px;
					}
				}
			}
		}
	}
	
	#link{
		width:100%;
		color:#999999;
		font-size:12px;
		padding:10px 0;
		background:#f5f5f5;
		text-align:right;
		
		a{
			color:#999999;
			font-size:12px;
		}
	}
	
	#footer-info{
		padding:20px 0;
		
		#footer-logo{
			margin-top:20px;
		}
		
		#footer-tel{
			margin-top:15px;
		}
	}
}

address{
	width:100%;
	padding:10px 0;
	color:#ffffff;
	font-size:10px;
	background:#1da8d5;
}

#page-top{
	z-index:100;
	position: fixed;
	bottom: 0;
	right: 30px;
	font-size: 14px;
	
	a{
		color: #fff;
		width: 80px;
		display: block;
		padding: 15px 0;
		text-align: center;
		border-radius: 5px 5px 0 0;
		background: #004ea2;
		
		&:hover{
			background:#ff8c00;
			-webkit-transition: all 0.2s;
			-moz-transition: all 0.2s;
			-ms-transition: all 0.2s;
			-o-transition: all 0.2s;
			transition: all 0.2s;
		}
	}
}
/*----------------------------------------------------------*/

/*header-nav ドロップダウン*/
header {
	#global-nav {
		.header-menu{
			position: absolute;
			transition: 0.5s;
			visibility: hidden;
			opacity: 0;
			z-index: 99999;
			background: #ffffff;
			li {
				float: none;
			}
		}
		.menu-open {
			visibility: visible;
			opacity: 1;
		}
	}
}