@charset "UTF-8";
/* -----------------------------------------------------------
   HEADER
------------------------------------------------------------*/
header a{
	display: block;
}
header h1 a:hover{
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}


@media all and (min-width: 768px) {
	header a{
		width: 1030px;
		margin:0 auto;
		background-image: url(../img/header_2nd_pc.png?090４);
	}
	header img{
		width: 1030px;
		height: 160px;
	}
}

@media all and (max-width: 767px) {
	header a{
		width:100%;
		margin:0 auto;
		background-size:cover;
		background-image: url(../img/header_2nd_smp.png?090４);
	}
	header img{
		width:100%;
		height: 0;
		padding-top: 31.25%;

	}
}

/* -----------------------------------------------------------
   NAVIGATION
------------------------------------------------------------*/
.wrap nav{
	box-shadow: 0px 1px 5px 1px rgba(0,0,0,0.2);
}

.wrap nav li , .wrap nav a , .wrap nav span{
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;
	background-repeat: no-repeat;
	display: block;
}


@media all and (min-width: 768px) {
	.wrap nav #m1 a{background-image: url(../img/nav_top_intro.png);}
	.wrap nav #m2 a{background-image: url(../img/nav_top_news.png);}
	.wrap nav #m3 a{background-image: url(../img/nav_top_story.png);}
	.wrap nav #m4 a{background-image: url(../img/nav_top_chart.png);}
	.wrap nav #m5 a{background-image: url(../img/nav_top_msg.png);}
	.wrap nav #m6 a{background-image: url(../img/nav_top_paravi.png);}

	.wrap nav{
		background-color: #141414;
		height: 130px;
	}
	.wrap nav a {
		-webkit-filter: grayscale(0) blur(0);
		filter: grayscale(0) blur(0);
		-webkit-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
	}
	.wrap nav a:hover {
		-webkit-filter: grayscale(100%) blur(3px);
		filter: grayscale(100%) blur(3px);
	}
	.wrap nav ul{
		background-image: url(../img/nav_2nd.png);
		background-repeat: no-repeat;
		width: 933px;
		height: 130px;
		margin: 0 auto 20px;
		padding: 15px 48.5px ;
		list-style:none;
		display: flex;
		display: -webkit-box;
	  display: -ms-flexbox;
	}
	.wrap nav li , nav a  , nav span{
		height: 146px;
	}
	.wrap nav #m1 a{ width: 148px; }
	.wrap nav #m2 a{ width: 165px; }
	.wrap nav #m3 a{ width: 155px; }
	.wrap nav #m4 a{ width: 155px; }
	.wrap nav #m5 a{ width: 195px; }
	.wrap nav #m6 a{ width: 115px; }
}
@media all and (max-width: 767px) {
	.wrap nav #m1{width: 36.09375%;}
	.wrap nav #m2{width: 32.81%;}
	.wrap nav #m3{width: 31.09%;}
	.wrap nav #m4{width: 37.65%;}
	.wrap nav #m5{width: 37.5%;}
	.wrap nav #m6{width: 24.83%;}
	.wrap nav #m1 a{background-image: url(../img/nav_smp_intro.png); padding-top: 41.5584415%;}
	.wrap nav #m2 a{background-image: url(../img/nav_smp_news.png); padding-top: 45.71%;}
	.wrap nav #m3 a{background-image: url(../img/nav_smp_story.png); padding-top: 48.24%;}
	.wrap nav #m4 a{background-image: url(../img/nav_smp_chart.png); padding-top: 39.41%;}
	.wrap nav #m5 a{background-image: url(../img/nav_smp_msg.png); padding-top:39.58%;}
	.wrap nav #m6 a{background-image: url(../img/nav_smp_paravi.png); padding-top: 59.74%;}

	.wrap nav{
		width: 100%;
	}
	.wrap nav ul{
		list-style: none;
		width: 100%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		background-color: #141414;
	}

	.wrap nav a , .wrap nav span{
		width: 100%;
		height: 0;
		background-size: cover;
		background-position: center center;
	}
	.wrap nav #m1 , .wrap nav #m2 , .wrap nav #m3{border-bottom: 1px solid #f0d14f;}
}

/* -----------------------------------------------------------
   BASE
------------------------------------------------------------*/

.con-area{
	background-color: #f8f8f6;
	box-shadow: 0px 1px 5px 1px rgba(0,0,0,0.1);
}

.con-area h1{
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;
}
#bottom #rectangle{
	width: 300px;
	margin: 0 auto;
}

@media all and (min-width: 768px) {
	#container{
		padding-top: 30px;
	}
	.con-area{
		width: 1030px;
		margin: 0 auto;
	}
}
@media all and (max-width: 767px) {
	#container{
		padding-top: 10px;
	}
	#container .con-area{
		width: 95%;
		margin: 0 auto;
	}
}
