@charset "utf-8";

/* First Show Big Logo */
/* ---------------------------------------------------------------------------------------- */

.bigLogo
{
	display:none;
	position:absolute;
	width:230px;
	height:150px;
	left:37%;
	top:150px;
}

/* mainpic */
/* ---------------------------------------------------------------------------------------- */

.mainpic
{
	visibility:hidden;
	position:relative;
	overflow:hidden;
	width:100%;
	height:510px;
}

.mainpic li
{
	position:absolute;
	width:100%;
	height:510px;
	left:0;
	top:0;
}

.mainpic li a
{
	display:block;
	width:100%;
	height:100%;
}

.mainpic li:nth-child(1) {z-index:10;}
.mainpic li:nth-child(2) {z-index:9;}
.mainpic li:nth-child(3) {z-index:8;}
.mainpic li:nth-child(4) {z-index:7;}
.mainpic li:nth-child(5) {z-index:6;}
.mainpic li:nth-child(6) {z-index:5;}

.mainpic li .bg
{
	width:100%;
	height:100%;
	background-size:cover;
	position:absolute;
	z-index:10;
}

/*
.mainpic li:nth-child(1) .bg {background-image:url(../img/mainpic0.jpg);}
.mainpic li:nth-child(2) .bg {background-image:url(../img/mainpic1.jpg);}
.mainpic li:nth-child(3) .bg {background-image:url(../img/mainpic2.jpg);}
.mainpic li:nth-child(4) .bg {background-image:url(../img/mainpic3.jpg);}
.mainpic li:nth-child(5) .bg {background-image:url(../img/mainpic4.jpg);}
.mainpic li:nth-child(6) .bg {background-image:url(../img/mainpic0.jpg);}
*/

.mainpic li .title
{
	width:100%;
	height:100%;
	position:absolute;
	z-index:11;
}

.mainpic li .title .wrap
{
	height:100%;
}

.mainpic li:nth-child(1) .title img.txt ,
.mainpic li:nth-child(6) .title img.txt
{
	left:30%;
	bottom:20%;
	z-index:998;
	position:absolute;
}

.mainpic li:nth-child(1) .title img.logo ,
.mainpic li:nth-child(6) .title img.logo
{
	left:37%;
	top:110px;
	z-index:997;
	position:absolute;
}

.mainpic li:nth-child(2) .title img
{
	bottom:20%;
	left:15%;
	position:absolute;
}

.mainpic li:nth-child(3) .title img
{
	top:42%;
	left:15%;
	position:absolute;
}

.mainpic li:nth-child(4) .title img
{
	top:42%;
	left:22%;
	position:absolute;
}

.mainpic li:nth-child(5) .title img
{
	top:42%;
	left:22%;
	position:absolute;
}

/* circle */
/* ---------------------------------------------------------------------------------------- */

.circle
{
	visibility:hidden;
	width:100%;
	height:60px;
	text-align:center;
	margin-bottom:30px;
}

.circle .inner
{
	width:155px;
	height:60px;
	margin:0 auto;
}

.circle a.c , .circle a.on
{
	display:block;
	float:left;
	width:30px;
	height:60px;
}

.circle a.c {background:url(../img/c1.png) no-repeat center center;}
.circle a.on {background:url(../img/c2.png) no-repeat center center;}

/* map */
/* ---------------------------------------------------------------------------------------- */

.map
{
	visibility:hidden;
	height:455px;
}

.map .mapLine , .map .info , .map .listTTL {position:absolute;}

.map .listTTL
{
	top:0;
	left:490px;
	width:490px;
	font-size:18px;
	font-weight:bold;
	color:#000;
	border-bottom:1px solid #000;
}

.map .listTTL b {font-size:24px;}

.map .info {top:35px;left:490px;z-index:99;}

.map .info li
{
	position:relative;
	width:490px;
	height:105px;
	background:url(../img/map_dashLine.gif) no-repeat bottom center;
}

.map .info li a
{
	display:block;
	width:490px;
	height:105px;
	text-decoration:none;
}

.map .info li .icon
{
	position:absolute;
	width:90px;
	height:90px;
	top:7px;
}

.map .info li:nth-child(1) .icon {background:url(../img/map_icon1.png);}
.map .info li:nth-child(2) .icon {background:url(../img/map_icon2.png);}
.map .info li:nth-child(3) .icon {background:url(../img/map_icon3.png);}
.map .info li:nth-child(4) .icon {background:url(../img/map_icon4.png);}

.map .info li:nth-child(1) a:hover .icon {background:url(../img/map_icon1.png);}
.map .info li:nth-child(2) a:hover .icon {background:url(../img/map_icon2.png);}
.map .info li:nth-child(3) a:hover .icon {background:url(../img/map_icon3.png);}
.map .info li:nth-child(4) a:hover .icon {background:url(../img/map_icon4.png);}

.map .info li .name
{
	position:absolute;
	left:110px;
	top:30px;
}

.map .info li .name .n1 {font-size:16px;}
.map .info li .name .n2 {font-size:13px;}

.map .info li:nth-child(1) .name .n1 , .map .info li:nth-child(1) .name .n2 {color:#623412;}
.map .info li:nth-child(2) .name .n1 , .map .info li:nth-child(2) .name .n2 {color:#64a70b;}
.map .info li:nth-child(3) .name .n1 , .map .info li:nth-child(3) .name .n2 {color:#13294b;}
.map .info li:nth-child(4) .name .n1 , .map .info li:nth-child(4) .name .n2 {color:#bf0d3e;}

.map .info li .logo
{
	position:absolute;
	left:345px;
	top:35px;
}

.map .pic
{
	width:490px;
}

.map .mapLine {display:none;}

.map .line1
{
	z-index:21;
	left:280px;
	top:85px;
}

.map .line2
{
	z-index:22;
	left:286px;
	top:190px;
}

.map .line3
{
	z-index:23;
	left:303px;
	top:295px;
}

.map .line4
{
	z-index:24;
	left:345px;
	top:330px;
}

/* @media for RWD */
/* ---------------------------------------------------------------------------------------- */

@media (max-width: 980px)
{
	.bigLogo
	{
		top:100px;
		left:35%;
		width:230px;
	}
	.mainpic li:nth-child(1) .title img.logo ,
	.mainpic li:nth-child(6) .title img.logo
	{
		top:60px;
		left:35%;
		width:230px;
	}

	.mainpic li:nth-child(1) .title img.txt ,
	.mainpic li:nth-child(6) .title img.txt
	{
		left:30%;
		bottom:20%;
		width:300px;
	}

	.mainpic li:nth-child(2) .title img
	{
		bottom:20%;
		left:17%;
		width:650px;
	}

	.mainpic li:nth-child(3) .title img
	{
		top:42%;
		left:17%;
		width:650px;
	}

	.mainpic li:nth-child(4) .title img
	{
		top:42%;
		left:22%;
		width:500px;
	}

	.mainpic li:nth-child(5) .title img
	{
		top:42%;
		left:25%;
		width:470px;
	}

}

@media (max-width: 779px)
{
	.bigLogo
	{
		top:60px;
		left:37%;
	}
	.bigLogo img {width:200px;}

	.mainpic li:nth-child(1) .title img.logo ,
	.mainpic li:nth-child(6) .title img.logo
	{
		top:20px;
		left:37%;
		width:200px;
	}

	.mainpic li:nth-child(1) .title img.txt ,
	.mainpic li:nth-child(6) .title img.txt
	{
		left:33%;
		bottom:10%;
		width:250px;
	}

	.mainpic li:nth-child(2) .title
	{
		bottom:5%;
		width:100%;
		height:80px;
		text-align:center;
	}

	.mainpic li:nth-child(3) .title
	{
		bottom:30%;
		width:100%;
		height:80px;
		text-align:center;
	}

	.mainpic li:nth-child(4) .title ,
	.mainpic li:nth-child(5) .title
	{
		bottom:15%;
		width:100%;
		height:80px;
		text-align:center;
	}

	.mainpic li:nth-child(2) .title img ,
	.mainpic li:nth-child(3) .title img
	{
		position:static;
		width:470px;
	}

	.mainpic li:nth-child(4) .title img
	{
		position:static;
		width:420px;
	}

	.mainpic li:nth-child(5) .title img
	{
		position:static;
		width:400px;
	}

	.map
	{
		width:100%;
		height:auto;
	}

	.map .mapLine {display:none !important;}

	.map .pic
	{
		width:490px;
		margin:0 auto;
	}

	.map .listTTL
	{
		position:static;
		width:490px;
		margin:0 auto;
	}

	.map .info
	{
		position:static;
		width:490px;
		margin:0 auto;
	}
}

@media (max-width: 480px)
{
	.bigLogo
	{
		left:32%;
	}
	.bigLogo img {width:150px;}

	.mainpic li:nth-child(1) .title img.logo ,
	.mainpic li:nth-child(6) .title img.logo
	{
		left:32%;
		width:33%;
	}

	.mainpic li:nth-child(1) .title img.txt ,
	.mainpic li:nth-child(6) .title img.txt
	{
		left:23%;
		bottom:5%;
		width:50%;
	}

	.mainpic li:nth-child(2) .title ,
	.mainpic li:nth-child(3) .title ,
	.mainpic li:nth-child(4) .title ,
	.mainpic li:nth-child(5) .title
	{
		bottom:10%;
		width:100%;
		height:60px;
		text-align:center;
	}

	.mainpic li:nth-child(2) .title img ,
	.mainpic li:nth-child(3) .title img ,
	.mainpic li:nth-child(4) .title img ,
	.mainpic li:nth-child(5) .title img
	{
		position:static;
		width:80%;
	}

	.map .pic
	{
		width:95%;
		margin:0 auto;
	}
	.map .pic img
	{
		width:100%;
	}

	.map .listTTL
	{
		width:100%;
	}

	.map .info , .map .info li , .map .info li a
	{
		width:100%;
	}

	.map .info li .name {top:20px;}
	.map .info li .logo
	{
		left:110px;
		top:65px;
	}
}
