@charset "UTF-8";
/* CSS Document */

img.Wset{
	width:100%;
	height:auto;
}

#cnt.archives{
	margin:0 0 100px 0;
}

#left_area{
	float:left;
	width:680px;
	margin-top: -30px;
}

#left_area .topics_bg{
	background:#f7f7f7;
	margin:0 0 40px 0;
}

#left_area .cnt_ttl{
	font-size:1.6rem;
	line-height: 2.5rem;
	padding:15px;
	width: 370px;
}

#left_area .cnt_ttl span{
	font-size:1.2rem;
	letter-spacing: 0.1rem;
	font-weight:bold;
}

#left_area .sub_ttl{
	font-size:3rem;
	line-height: 1;
	background:#F34610;
	color:#fff;
	padding:55px 45px;
	margin-bottom: 40px;
}


#left_area .archive_list{
	margin:0 40px;
	letter-spacing:-0.4rem;
	padding:0 0 15px 0;
}

#left_area .archive_list li{
	width:100%;
	background:#fff;
	letter-spacing:normal;
	margin:0 0 10px 0;
	vertical-align: top;
	color:#000;
	-webkit-transition:.3s ease;
	-moz-transition:.3s ease;
	-o-transition:.3s ease;
	transition:.3s ease;
}



.f_left{
	float: left;
}


#left_area .archive_list li:hover{
	filter:alpha(opacity=70); 
	-moz-opacity: 0.7; 
	opacity: 0.7; 
}

#left_area .archive_list li a{
	display:block;
	width:100%;
	height:100%;
}

#left_area .more_link{
	width:180px;
	margin:0 auto 50px;
	display:block;
	padding:15px 0;
	font-size:1.6rem;
	border:1px solid #000;
	text-align:center;
}

#left_area .more_link:hover{
	filter:alpha(opacity=70); 
	-moz-opacity: 0.7; 
	opacity: 0.7; 
}

#left_area .back_bnr{
	text-align:center;
}



@media screen and (max-width:640px){ 
#left_area{
	float:none;
	width:100%;
	margin:0 0 50px 0;
	padding: 0 25px;
}

#left_area .topics_bg{
	padding:0 0 5px;
	margin:0 0 60px 0;
}

#right_area{
	float:none;
	width:100%;
	padding:0 25px;
}

#left_area .sub_ttl {
	padding: 50px 25px;
}

#left_area .archive_list {
	margin: 0;
	padding: 0 40px 15px;
}


#left_area .archive_list li{
	width:100%;
	margin:0 0 15px 0;
}

#left_area .archive_list li img{
	float:left;
	width:230px;
	height:auto;
	padding:10px;
}

#left_area .archive_list .cnt_ttl{
	font-size:2rem;
	width:280px;
	float:right;
	padding:15px 20px;
	line-height: 3.1rem;
}

#left_area .cnt_ttl span{
	font-size:1.8rem;
	font-weight:bold;
	line-height:3.2rem;
}

#left_area .archive_list li:hover{
	filter:alpha(opacity=100); 
	-moz-opacity:1; 
	opacity:1; 
}


#left_area .more_link{
	width:300px;
	margin:0 auto 60px;
	padding:30px 0;
	font-size:2rem;
	line-height:2rem;
}

#left_area .more_link:hover{
	filter:alpha(opacity=100); 
	-moz-opacity:1; 
	opacity:1; 
}

}