@charset "UTF-8";

/*--------------------------------------------------------------------
index.html	(トップページ)
top.css
--------------------------------------------------------------------*/


/*------------Header---------------------------------------------------------------*/
div#InHeader { min-height: 600px; }
div#InHeader h2 {
	width: 550px;
	top: 50%;
}


/*------------Main------------------------------------------------*/
div#Main { padding-top: 95px; }

/*------------Title------------------------*/
div#Title h2 { margin-bottom: 0; }
div#Title p {
	margin-top: 20px;
	text-align: center;
	line-height: 1.6;
	font-size: 0.87em;
}

/*------------HighSchool------------------------*/
div#HighSchool {
	position: relative;
	width: 980px;
	margin: 35px auto 0;
}
div#HighSchool ul {
/*	width: 32%;*/
	width: 100%;
	margin: 0 auto -2%;
	list-style: none;
	overflow: hidden;
}
div#HighSchool ul li {
/*	width: 100%;*/
	width: 32%;
	margin-right: 2%;
	margin-bottom: 2%;
	float: left;
	background-color: #ff2b00;
}
div#HighSchool ul li:nth-of-type(3n) { margin-right: 0; }/**/
div#HighSchool ul li a {
	position: relative;
	display: block;
	padding: 1em;
	background-color: #ff2b00;
	text-align: center;
	line-height: 1.2;
	font-size: 1.33em;
	color: #fff;
}
div#HighSchool ul li a:after {
	position: absolute;
	display: block;
	content: "";
	width: 20px;
	height: 20px;
	background: url(../../hs/img/arrow.png) no-repeat center center;
	top: 50%;
	right: 0.5em;
	transform: translateY(-50%);
}
div#HighSchool ul li a:hover {
	text-decoration: none;
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

/*------------Shop------------------------*/
div#Shop {
	position: relative;
	width: 980px;
	margin: 95px auto 0;
}
div#Shop div.Img {
	width: 100%;
	overflow: hidden;
	transition: opacity .3s;
}
div#Shop img {
	max-width: 100%;
	vertical-align: top;
	-webkit-transition: all 0.35s ease-out;
	transition: all 0.35s ease-out;
}
div#Shop div.Img:hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}
div#Shop a {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0);
	z-index: 10;
	transition: opacity .3s;
}
div#Shop h3 {
	position: absolute;
	width: 300px;
	height: 96px;
	background-image: url(../../img/top/shop_t.png);
	background-position: center center;
	background-repeat: no-repeat;
	line-height: 0;
	text-indent: -99999px;
	font-size: 0;
	bottom: 10px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
	z-index: 3;
}
div#Shop p {
	position: absolute;
	width: 100%;
	height: 80px;
	background-color: rgba(255, 102, 0, 0.9);
	overflow: hidden;
	line-height: 0;
	text-indent: -99999px;
	font-size: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
}
div#Shop:hover a { background-color: rgba(255, 255, 255, 0.3); }