@charset "utf-8";

h1.monthly_logo {
	margin-top:0;margin-bottom:0;width:100%;
}
h2.monthly_itemname {
	margin-top:0;margin-bottom:0;width:100%;
}
.monthly_jozen {
	max-width:1200px;
	margin:60px auto 20px auto;
}
.monthly_logo {
	margin-left:2%;
	width:20%;
	float:left;
}
.monthly_lead_a, .monthly_lead_b {
	margin-left:3%;
	width:75%;
	float:left;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "ＭＳ 明朝", serif;
}
.monthly_lead_a p {
	font-size:200% !important;
	line-height:1.7;
	font-weight:bold;
}
.monthly_lead_b p {
	font-size:100% !important;
	line-height:1.8;
	font-weight:normal;
}

.monthly_list {
	margin:0;
	padding:0;
}
.monthly_list li {
	display:inline;
	float:left;
	width:33%;
}
.monthly_list li a {
	display:block;
	padding:20px 7%;
	text-align:center;
	color:#D45C8A;
	text-decoration:none;
	font-weight:bold;
}
.monthly_list li a:after { content:'詳しく ＞'; }
.monthly_list li a:hover { color:#B9161C; }
.monthly_list li.sale a:after { content:'購入する ＞'; }

/* ----- ----- */
.monthly_data {
	max-width:1224px;
	margin:0 auto 40px auto;
	position:relative;
}
.monthly_title {
	margin-left:1%;
	width:24%;
	margin-top:20px;
	float:left;
}
.monthly_bottle {
	width:40%;
	position:absolute;
	bottom:0;
	left:23%;
}
.monthly_spec {
	margin-top:60px;
	width:36%;
	float:right;
}


.view_function { padding:20px; text-align:center; }
.view_function span {
display:inline-block; padding:6px; margin:0 10px;border-radius:6px; cursor:pointer; color:#111; 
/*background-color:#eee;border:1px #ccc solid; color:#666; */
}
.view_function span.active { /*background-color:#F3A3A8; border:1px #EE7D83 solid; color:#fff; */ color:#EE7D83; font-weight:500; }


/* # Pc std 960-1223px
========================================================================================= */
@media only screen and (min-width: 1500px) {

	.monthly_list li { width:25%; }

}

/* # Tablet 768-959px
========================================================================================= */
@media only screen and (max-width: 959px) {

	.monthly_jozen { margin:30px auto 10px auto; }

}
/* # Tablet & Mobile Landscape 480-767px
========================================================================================= */   
@media only screen and (max-width: 767px) {

	.monthly_lead_a p { font-size:180% !important; line-height:1.4 !important; }
	.monthly_lead_b { float:none;clear:both;width:95%; margin:10px 2.5%;padding-top:10px;font-size:80% !important; }

	.monthly_title {
		margin-left:0%;
		width:40%;
	}
	.monthly_bottle {
		width:60%;
		position:relative;
		float:left;
		left:0%;
	}

	.monthly_spec {
		margin-top:10px;
		width:94%;
		float:none;
	}

	.monthly_list li a { font-size:90%; }

}
/* # Mobile 320-479px
========================================================================================= */   
@media only screen and (max-width: 479px) {

	.monthly_lead_a p { font-size:140% !important; }
	.monthly_list li { width:50%; }

	.monthly_title {
		margin-top:0px;
		width:50%;
	}
	.monthly_bottle {
		width:50%;
	}

}