@charset "utf-8";



div.topicpath div{ width:950px; }

/*	g_categoryBack
-------------------------------------------------------------------*/
.g_categoryBack{ display:none; }
.g_categoryBack > div {
	display:block;
	text-decoration:none;
	color:#fff;
	font-size:125%;
	background-color:#575655;
}
.g_categoryBack > div:after {
	display:block;
	clear:both;
	height:0px;
	content:"";
}
.g_categoryBack img {
	float:left;
	width:45px;
}
.g_categoryBack em {
	display:block;
	height:36px;
	padding:0 0 0 56px;
	font-style:normal;
}
.g_categoryBack em span {
	display:block;
	padding:5px 0 0 0;
	font-weight:bold;
	color:#fff;
}





@media only screen and (max-width: 1020px) {
	#container p.pagetop{ display:none; }
}

@media only screen and (max-width: 979px) {
	div.topicpath div{ width:95%; }
	div.topicpath div p{ display:none; /*position:relative;*/ }
	#container { width:auto; }
}
@media only screen and (max-width: 600px) {
	div.topicpath{ display:none; }
	div.g_categoryBack{ display:block; }
}





/* 画像可変
------------------------------------------------------------------------------- */
img.liquid {
	max-width: 100%;
	width: auto\9;
	height: auto;
}

img.liquidL,
.liquidL img {
	width: 100%;
	height: auto;
}



/* メインビジュアル
------------------------------------------------------------------------------- */
div.mainimg{
	margin-bottom:20px;
	padding:15px 0 0;
	background:url(../images/bg_mainimg.gif) left top;
	clear:both;
}
div.mainimg:after, div.mainimg div:after{ content:''; display:block; clear:both; }

div.mainimg div.title h1{ width:955px; margin:0 auto; padding-bottom:15px; text-align:center; }
div.mainimg div.title h1 img{ display:block; }
div.mainimg div.title h1 img.smp{ display:none; }

div.mainimg #sns{ width:950px; margin:0 auto; position:relative; clear:both; }
div.mainimg #sns ul.socialBtn{ padding-bottom:10px; float:right; zoom:1; }
div.mainimg #sns ul.socialBtn li{ margin-left:11px; display:inline; float:left; }


@media only screen and (max-width: 979px) {

	div.mainimg div.title div{ width:95%; margin:0 auto; text-align:center; }
	div.mainimg div.title h1{ width:auto; }
	div.mainimg div.title div img{ width:100%; height:auto; }
	div.mainimg div.title #sns .socialBtn img{ width:auto; height:auto; }
	
	div.mainimg #sns{ width:95%; }

}

@media only screen and (max-width: 640px) {
	div.mainimg div.title h1 img{ display:none; }
	div.mainimg div.title h1 img.smp{ display:block; }

	div.mainimg #sns{ display:none; }
}





/* contents
------------------------------------------------------------------------------- */
@media only screen and (max-width: 979px) {
	#contents{ width:95%; margin:0 auto; }
}


#contents div.mmagazine:after, #contents div.mmagazine div:after{ content:''; display:block; clear:both; }


#contents div.mmagazine{
	width:922px;
	margin:0 0 20px;
	padding:7px 7px 0;
	border:7px solid #e9e6cd;
	zoom:1;
	clear:both;
}

#contents div.mmagazine div.txt{ width:695px; padding-top:10px; float:right; }
#contents div.mmagazine p.img{ width:226px; padding-bottom:10px; float:left; }




#contents div.btns div:after{ content:''; display:block; clear:both; }
#contents div.btns p{ width:200px; margin-right:15px; float:left; }
#contents div.btns p.btn_change{ width:230px; }
#contents div.btns .btn_kodoku-w{ width:350px; }


@media only screen and (max-width: 979px) {

	#contents div.mmagazine{ width:auto; }
	#contents div.mmagazine div.txt{ width:75%; }
	#contents div.mmagazine p.img{ width:25%; }
	#contents div.mmagazine p.img img{ width:90%; height:auto; }
	
	
	/* #contents div.mmagazine div.btns p.btn_change{ margin-right:0; }
	#contents div.mmagazine div.btns p.btn_change{ width:230px; }
	#contents div.mmagazine div.btns p.btn_enquete{ width:220px; } */
	
}

@media only screen and (max-width: 949px) {
	#contents div.mmagazine div.btns p.btn_change{ margin-right:10px; }
}

@media only screen and (max-width: 800px) {
	#contents div.mmagazine div.btns p.btn_kodoku{ width:165px; }
	#contents div.mmagazine div.btns p.btn_kodoku-w{ width:350px; }
	/*#contents div.mmagazine div.btns p.btn_change{ width:210px; }*/
	#contents div.mmagazine div.btns p.btn_enquete{ width:165px; }
}


@media only screen and (max-width: 640px) {
	#contents div.mmagazine div.txt{ width:auto; }
	#contents div.mmagazine p.img{ width:auto; text-align:center; float:none; }
	#contents div.mmagazine p.img img{ width:auto; height:auto; }

	#contents div.btns p{ width:auto; margin:0 auto; float:none; clear:both; }
	#contents div.mmagazine div.btns p.btn_kodoku, #contents div.mmagazine div.btns p.btn_change, #contents div.mmagazine div.btns p.btn_enquete{ width:auto; margin-right:auto; }

}

@media only screen and (max-width: 600px) {

	#contents div.mmagazine div.txt{ width:auto; float:none; clear:both; }

}