/* CSS Document */

@import url(navi.css);
@import url(common.css);

		
#main {
	width:100%;
	height:423px;
	background:url(../img/common/imgb.jpg) repeat-x bottom center;
	margin:14px auto 0 auto; 
}

#main #mimg {
	width:980px;
	height:347px;
	overflow:hidden;
	margin:0 auto 20px auto;
}


#container {
	width:980px;
	margin:0 auto;
	padding:52px 0;
}


#container h2 {
	width:134px;
	height:40px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

	#h11 {background:url(../img/top/st1.gif) no-repeat;}
	#h12 {background:url(../img/top/st2.gif) no-repeat;}	


	.b1 {
	width:310px;
	float:left;
	margin-right:10px;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	border-top-color: #8CCAA5;
	border-right-color: #8CCAA5;
	border-bottom-color: #8CCAA5;
	border-left-color: #8CCAA5;
	height: 185px;
	}
	
	.b2 {
	width:310px;
	height:185px;
	float:left;
	border-top-style: dotted;
	border-top-color: #FF9999;
	border-right-color: #FF9999;
	border-bottom-color: #FF9999;
	border-left-color: #FF9999;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	margin-right: 10px;
	}
	
	.b3 {
	width:310px;
	height:185px;
	float:right;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	border-top-color: #8CCAA5;
	border-right-color: #8CCAA5;
	border-bottom-color: #8CCAA5;
	border-left-color: #8CCAA5;
	}


.yo {
		width:285px;
		float:right;
		background-color:#000;
		padding:18px;
	}
	
	.yo h1 {
		width:285px;
		height:43px;
		background:url(../img/top/yo1.gif) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	.yo h1 a {
		width:285px;
		height:43px;
		display:block;
	}
	
	.yo p {
		padding:15px;
		background-color:#FFFFFF;
		margin:0;
	}

.ev {
	width:630px;
	float:left;
}

	.ev dl {
		padding:0 0 0 20px;
		margin:0;
	}

	.ev dt {
		float:left;  
		width:100px;  
		padding:10px 0 10px 0;  
		clear:both;
		border-bottom:1px dotted #CCCCCC;
	}

	.ev dd {  
		margin-left:100px;  
		padding:10px 0 10px 5px;
		border-bottom:1px dotted #CCCCCC;
	}
	
/*What's new欄の矢印とアンダーライン
■下線の色を変えたい場合、#CCCCCCを希望色。ちなみに、dottedは点線　直線にしたいならsolid
----------------------------------------------------------------------------------*/
.u-line li {
	border-bottom: 1px dotted #CCCCCC;
	padding-left: 20px;
	font-size: 12px;
	background-image: url(../img/common/arrow2.gif);
	background-repeat: no-repeat;
	background-position: left top;
	line-height: 30px;
}
.t1 {
	border: 3px double #CCCCCC;
	padding: 10px;
	margin-top: 9px;
	margin-right: 5px;
	width: 326px;
	background: url(../img/top/item_bg.gif) repeat-x bottom;
	font-size: 12px;
	line-height: 18px;
}

.t1 td {
	vertical-align: top;
}

.t1 strong {
	background: url(../img/top/arrow1.gif) no-repeat left top;
	padding-left: 20px;
	border-bottom: 1px dotted #CCCCCC;
	display: block;
	margin-bottom: 10px;
}

.t1 img {
	border: 1px solid #CCCCCC;
	padding: 5px;
	background: #FFFFFF;
}
div.top-article{
	margin-left: 5em;
}
.dte{
	margin-right: 20px;
}

/*-------------------------------980px以下---------------------------------------------*/
@media screen and (max-width: 980px) {
	#main {
		height: auto;
		margin-top: 0px;
	}
	#main #mimg {
		max-width: 980px;
		width: 100%;
		height: auto;
	}
	#container{
		max-width: 980px;
		width: 100%;
		box-sizing: border-box;
		padding: 0 20px;
	}
	.ev{
		width: 60%;
		box-sizing: border-box;
	}
	.yo{
		width: 40%;
		box-sizing: border-box;
	}
}
/*-------------------------------767px以下---------------------------------------------*/
@media screen and (max-width: 767px) {
	.ev{
		float: none;
		width: 100%;
	}
	.yo{
		float: none;
		width: 100%;
		margin: 20px 0;
	}
	.dte{
		display: block;
		margin-right: 0;
	}
	.rssl{
		margin-bottom: 4px;
		padding-bottom: 4px;
		border-bottom: 1px dotted #999;
	}

}
/*-------------------------------767px以下---------------------------------------------*/
@media screen and (max-width: 500px) {
	div.top-article{
		margin-left: 0em;
	}
	div.top-article img{
		max-width: 100%;
		height: auto;
	}
}