@charset "UTF-8";

/*--------------------------------------------------------------------
index.html	(トップページ)
top.css
--------------------------------------------------------------------*/


/*------------Header------------------------------------------------------------*/
div#Header {
	min-height: 700px;
	background: inherit !important;
	background-size: cover;
}
div#Header:before {
	background-color: rgba(255, 255, 255, 0);
	background-position: center 120px;
}
div#Header:after { height: 15%; }

/*------------TopAnima------------------------------------------------------------*/
div#TopAnima {
	position: absolute;
	display: block;
	width: 100%;
	min-height: 700px;
	background-size: cover;
	z-index: -1;
	overflow: hidden;
}
div#TopAnima div.Anima {
	position: absolute;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	line-height: 0;
	text-indent: -99999px;
	font-size: 0;
	z-index: -1;
}
div#TopAnima div#Anima01 { background-image: url(../../img/top/anima_p01.jpg); }
div#TopAnima div#Anima02 { background-image: url(../../img/top/anima_p02.jpg); }
div#TopAnima div#Anima03 { background-image: url(../../img/top/anima_p03.jpg); }
div#TopAnima div#Anima04 { background-image: url(../../img/top/anima_p04.jpg); }
div#TopAnima div#Anima05 { background-image: url(../../img/parts/header_bg.jpg); }

/*------------Title------------------------------------*/
div#Title {
	position: relative;
	display: block;
	width: 100%;
	height: 620px;
	z-index: 1;
	overflow: hidden;
}
div#Title h2 {
	position: absolute;
	width: 100%;
	line-height: 1.15;
	text-align: center;
	font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "ヒラギノ明朝 Pro W3" , "HiraMinPro-W3" , Garamond , "Times New Roman" , "Sawarabi Mincho" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 2.6em;
	font-weight: bolder;
	color: #fff;
  text-shadow    : 
		 2px  2px 7px #a4e2ff,
		-2px  2px 7px #a4e2ff,
		 2px -2px 7px #a4e2ff,
		-2px -2px 7px #a4e2ff,
		 2px  0px 7px #a4e2ff,
		 0px  2px 7px #a4e2ff,
		-2px  0px 7px #a4e2ff,
		 0px -2px 7px #a4e2ff;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	        transform: translateY(-50%);
	z-index: 2;
}
div#Title h2 span {
	display: block;
	line-height: 1.15;
	text-align: center;
	font-size: 1.86rem;
}

/*------------Contents---------------------------------------------------------------*/
div#Contents { padding-top: 80px; }


/*------------TopTxt------------------------------------*/
div#TopTxt {
	position: relative;
}
div#TopTxt h2 {
	line-height: 1.15;
	text-align: center;
	font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "ヒラギノ明朝 Pro W3" , "HiraMinPro-W3" , Garamond , "Times New Roman" , "Sawarabi Mincho" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 2.46em;
	font-weight: bolder;
	color: #21b8ff;
}
div#TopTxt p {
	margin-top: 25px;
	text-align: center;
}


/*------------Works------------------------------------*/
div#Works {
	position: relative;
	width: 980px;
	margin: 60px auto 0;
}
div#Works h3 {
	margin-bottom: 20px;
	line-height: 1.15;
	text-align: center;
	font-size: 2.33em;
	font-weight: bolder;
	color: #2485d6;
}
div#Works ul {
	width: 100%;
	margin: 0 auto;
	list-style: none;
	overflow: hidden;
}
div#Works ul li {
	position: relative;
	width: 300px;
	margin-right: 40px;
	float: left;
}
div#Works ul li:nth-child(3n) { margin-right: 0; }
div#Works ul li a {
	display: block;
	width: 100%;
	height: 100%;
	z-index: 2;
	transition: all 0.35s ease-out;
}
div#Works ul li em {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../../img/top/works_a.png) no-repeat center 86%;
	top: 0;
	left: 0;
	z-index: 3;
}
div#Works ul li div:hover img,
div#Works ul li a:hover {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
	text-decoration: none;
}
div#Works ul li h4 {
	position: relative;
	width: 100%;
	padding: 0.55em 0 0.45em;
	background-color: #2485d6;
	background-position: center center;
	background-repeat: no-repeat;
	line-height: 1.6;
	text-align: center;
	font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "ヒラギノ明朝 Pro W3" , "HiraMinPro-W3" , Garamond , "Times New Roman" , "Sawarabi Mincho" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 1.78em;
	font-weight: bolder;
	color: #fff;
	z-index: 2;
}


/*------------News------------------------------------*/
div#News {
	width: 100%;
	margin: 60px auto 0;
	overflow: hidden;
}
div#News h3 {
	position: relative;
	margin-bottom: 20px;
	padding-bottom: 25px;
	line-height: 1.15;
	text-align: center;
	font-size: 2.33em;
	font-weight: bolder;
	color: #ff6e00;
}
div#News h3:before,
div#News h3:after {
	position: absolute;
	display: block;
	content: "";
	height: 10px;
}
div#News h3:before {
	width: 100%;
	background-color: #d4d5d5;
	bottom: 0;
	left: 0;
}
div#News h3:after  {
	width: 980px;
	background-color: #ff6e00;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
}
div#News div#InNews {
	width: 980px;
	margin: 0 auto;
	overflow: auto;
}
div#News div#InNews {
	height: 135px;
  -webkit-overflow-scrolling: touch;
}
div#News div#InNews iframe {
  width: 100%;
	height: 135px;
}


/*------------Recruit------------------------------------*/
div#Recruit {
	position: relative;
	width: 100%;
	max-width: 1400px;
	margin: 60px auto 0;
}
div#Recruit h3 { display: none; }
div#Recruit div {
	position: relative;
	overflow: hidden;
}
div#Recruit img { display: none; }
div#Recruit a {
	display: block;
	width: 100%;
	height: 400px;
	background-image: url(../../img/top/recruit_p.jpg);
	background-position: left center;
	background-repeat: no-repeat;
	z-index: 2;
	transition: all 0.35s ease-out;
}
div#Recruit a:before {
	position: absolute;
	display: block;
	content: "";
	width: 980px;
	height: 400px;
	background-image: url(../../img/top/recruit_b.png);
	background-position: right center;
	background-repeat: no-repeat;
	right: 0;
	bottom: 0;
	z-index: 2;
}
div#Recruit h4 { display: none; }
div#Recruit div:hover img,
div#Recruit a:hover {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
	text-decoration: none;
}

@media (max-width: 979px) {
/*------------Header------------------------------------------------------------*/
div#Header {
	min-height: 450px;
	background: inherit !important;
	background-size: cover;
}
div#Header:before { background-color: rgba(255, 255, 255, 0); }
div#Header:after { height: 30%; }

/*------------TopAnima------------------------------------------------------------*/
div#TopAnima {
	position: absolute;
	display: block;
	width: 100%;
	min-height: 450px;
	background-size: cover;
	z-index: -1;
	overflow: hidden;
}

/*------------Title------------------------------------*/
div#Title { height: 320px; }
div#Title h2 { font-size: 2em; }
div#Title h2 span { font-size: 1.5rem; }

/*------------Contents---------------------------------------------------------------*/
/*------------TopTxt------------------------------------*/
div#TopTxt {
	position: relative;
	padding: 0 1em;
}

/*------------Works------------------------------------*/
div#Works {
	position: relative;
	width: 100%;
	margin: 60px auto 0;
}
div#Works ul li {
	position: relative;
	width: 100%;
	max-width: 300px;
	margin: 0 auto 40px;
	float: none;
}
div#Works ul li:nth-child(3n) {
	margin-bottom: 0;
	margin-right: auto;
}


/*------------News------------------------------------*/
div#News div#InNews {
	width: 98%;
	margin: 0 auto;
	overflow: auto;
}

/*------------Recruit------------------------------------*/
div#Recruit {
	position: relative;
	width: 100%;
	margin: 60px auto 0;
}
div#Recruit h3 { display: none; }
div#Recruit div {
	position: relative;
	overflow: hidden;
}
div#Recruit img { display: none; }
div#Recruit a {
	display: block;
	width: 100%;
	height: 400px;
	background-image: url(../../img/top/recruit_p.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 2;
	transition: all 0.35s ease-out;
}
div#Recruit a:before {
	position: absolute;
	display: block;
	content: "";
	width: 80%;
	height: 154px;
	background-image: url(../../img/top/recruit_a.png);
	background-position: right bottom;
	background-repeat: no-repeat;
	top: 30%;
	right: 1em;
	-webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	        transform: translateY(-50%);
	z-index: 4;
}
div#Recruit h4 {
	display: block;
	position: absolute;
	width: 100%;
	padding: 0.55em 1em;
	background-color: rgba(36, 148, 0, 0.8);
	line-height: 1.6;
	text-align: center;
	font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "ヒラギノ明朝 Pro W3" , "HiraMinPro-W3" , Garamond , "Times New Roman" , "Sawarabi Mincho" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 1.55em;
	font-weight: bolder;
	color: #fff;
	left: 0;
	bottom: 0;
	z-index: 2;
}
div#Recruit h4 span { display: none; }
}