/*
===========================================================================

	Title : /community/milk/css/style.css

===========================================================================
*/


/***************************************************************
*
*	PC view
*	
****************************************************************/


/* pc 共通
------------------------------------------------------------ */
#content .content_inner .anchor_link {
	width: 681px;
	margin: 28px auto 44px;
	padding: 5px 0 25px;
	background: #ffffff;
	text-align: center;
}
#content .content_inner .anchor_link li {
	font-size: 13px;
	display: inline-block;
	text-align: center;
	margin: 7px 30px 0;
}
#content .content_inner .anchor_link li a {
	display:block;
	color: #936c61;
}
#content .content_inner .anchor_link ul li a img{
	width:108px;
}

#content .content_inner .anchor_link li:hover{
	opacity:0.8;
}
#content .content_inner .anchor_link li a:hover {
	text-decoration: none;
}

#content .content_inner .anchor_link li a:after {
	width: 13px;
	height: 8px;
	margin: 10px auto 0;
	content: " ";
	background: url(../image/anchor_link_arrow.png) center no-repeat;
	background-size: 100%;
	display: block;
}
#content .content_inner .content_menu {
	width: 700px;
	margin: 0 auto;
}
#content .content_inner .content_menu h2 {
	width: 500px;
	margin-bottom: 10px;
	font-size: 26px;
	font-weight: normal;
	color: #936c61;
	letter-spacing: 3px;
}
#content .content_inner .content_menu .text {
	width: 510px;
	font-size: 13px;
	color: #555555;
}
#content .content_inner .content_menu .btn_area {
	margin-top: 15px;
}
#content .content_inner .content_menu .btn_area li {
	width: 257px;
	margin-right: 9px;
	margin-bottom: 8px;
	display: inline-block;
}
#content .content_inner .content_menu .btn_area li a {
	width: 232px;
	padding: 7px 0 5px 25px;
	background-image: url(../image/content_menu_btn.png);
	background-repeat:no-repeat;
	background-position:center;
	display: inline-block;
	color: #a54b4b;
}
#content .content_inner .content_menu .btn_area li a:hover {
	opacity: 0.8;
	text-decoration: none;
}
#content_trouble, #content_story, #content_breastmilk, #content_milkpowder, #content_babyfood, #content_recipe, #content_pregnancy {
	height: 218px;
	margin-top: 20px;
	margin-bottom:20px;
	background-image: url(../image/content_menu_bg.png);
	background-position: 10px;
	background-repeat:no-repeat;
}
#content_trouble .inner, #content_story .inner, #content_babyfood .inner, #content_recipe .inner, #content_pregnancy .inner {
	margin-left: 12px;
	padding-top: 45px;
	padding-left: 135px;
}
#content_breastmilk .inner, #content_milkpowder .inner {
	margin-left: 12px;
	padding-top: 20px;
	padding-left: 135px;
}
#content_trouble .inner {
	background-image: url(../image/content_trouble_on.gif);
	background-position:24px 58px;
	background-repeat:no-repeat;
	background-size: 100px;
}
#content_story .inner {
	background-image: url(../image/content_story_on.gif);
	background-position:18px 76px;
	background-repeat: no-repeat;
	background-size: 100px;
}
#content_breastmilk .inner {
	background-image: url(../image/content_breastmilk_on.gif);
	background-position:20px 78px;
	background-repeat:no-repeat;
	background-size: 100px;
}
#content_milkpowder .inner {
	background-image: url(../image/content_milkpowder_on.gif);
	background-position:6px 62px;
	background-repeat:no-repeat;
	background-size: 116px;
}
#content_babyfood .inner {
	background-image: url(../image/content_babyfood_on.gif);
	background-position:12px 70px;
	background-repeat:no-repeat;
	background-size: 100px;
}
#content_recipe .inner {
	background-image: url(../image/content_recipe_on.gif);
	background-position:18px 48px;
	background-repeat:no-repeat;
	background-size: 100px;
}
#content_pregnancy .inner {
	background-image: url(../image/content_pregnancy_on.gif);
	background-position:42px 50px;
	background-repeat:no-repeat;
	background-size: 60px;
}



/***************************************************************
*
*	SP view
*	
****************************************************************/

@media screen and (max-width:767px) {
	#content .content_inner .anchor_link {
		width: 100%;
		margin: 6% auto 0;
		padding: 5px 0 24px;
	}
	#content .content_inner .anchor_link li {
		width: 20%;
		margin: 2% 3% 0;
		padding-bottom: 3%;
		vertical-align: middle;
		position: relative;
	}
	#content .content_inner .anchor_link ul:nth-of-type(1) li {
		margin: 0 4% 0;
	}
	#content .content_inner .anchor_link ul:nth-of-type(2) li:first-child{
		margin:2% 3% 0 0;
	}
	#content .content_inner .anchor_link ul:nth-of-type(2) li:last-child{
		margin:2% 0 0 3%;
	}
	#content .content_inner .anchor_link li p {
		width:20%;
		height: 46px;
		font-size:11px;
		display: table-cell;
		vertical-align: middle;
	}
	#content .content_inner .anchor_link li a:after {
		width: 15%;
		margin-left: -10%;
		background-size: contain;
		position: absolute;
		left: 50%;
		bottom: 0;
	}
	#content .content_inner .anchor_link ul li a img{
		width:70%;
	}
	
	#content .content_inner .content_menu {
		width: 100%;
		background: url(../image/sp_content_bg02.jpg) no-repeat;
	}
	#content .content_inner .content_menu_inner {
		width: 95%;
		margin: 0 auto;
		padding: 7% 0 0;
	}
	#content .content_inner .content_menu h2 {
		width: auto;
		padding: 12% 4% 0 33%;
		font-size: 18px;
		letter-spacing: 0;
	}
	#content .content_inner .content_menu .text {
		width: 80%;
		margin: 8% auto 4%;
		font-size: 12px;
		line-height:2;
	}
	#content .content_inner .content_menu .btn_area {
		width: 80%;
		margin: 0 auto;
		padding-right: 1.5%;
	}
	#content .content_inner .content_menu .btn_area li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 3%;
	}
	#content .content_inner .content_menu .btn_area li a {
		width: 87%;
		padding: 3% 0 3% 12%;
		background-size: contain;
		font-size: 13px;
	}
	#content_trouble, #content_story, #content_babyfood, #content_breastmilk, #content_milkpowder, #content_recipe, #content_pregnancy {
		width: 100%;
		height: auto;
		margin: 0 auto 5%;
		background-image: url(../image/sp_content_menu_bg_top.png), url(/community/milk/images/sp_content_menu_bg.png) ;
		background-position:top center,top center;
		background-repeat:no-repeat, repeat-y;
		background-size: 100%;
	}
	#content_pregnancy{
		margin:0 auto;
	}
	#content_trouble .inner, #content_story .inner, #content_babyfood .inner, #content_recipe .inner, #content_pregnancy .inner, #content_breastmilk .inner, #content_milkpowder .inner {
		margin: 0;
		padding: 0;
	}
	#content_trouble .inner {
		padding-bottom:9.1%;
		background-image:url(../image/content_trouble_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png) ;
		background-position:7% 8%, center bottom;
		background-repeat:no-repeat, no-repeat;
		background-size:20%, 100%;
	}
	#content_story .inner {
		padding-bottom:6%;
		background-image:url(../image/content_story_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:11% 12%, center bottom;
		background-repeat:no-repeat, no-repeat;
		background-size:22%, 100%;
	}
	#content .content_inner .content_menu #content_story .inner .text {
		margin-top: 8%;
	}
	#content_breastmilk .inner {
		padding-bottom:4.5%;
		background-image:url(../image/content_breastmilk_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:10% 10%, center bottom;
		background-repeat:no-repeat;
		background-size:21%, 100%;
	}
	#content .content_inner .content_menu #content_breastmilk .inner .text {
		margin-top: 7%;
	}
	#content_milkpowder .inner {
		padding-bottom:3.5%;
		background-image:url(../image/content_milkpowder_on.gif) , url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:8% 8%, center bottom;
		background-repeat:no-repeat;
		background-size:20%, 100%;
	}
	#content_babyfood .inner {
		padding-bottom:4%;
		background-image:url(../image/content_babyfood_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:8% 8%, center bottom;
		background-repeat:no-repeat;
		background-size:25%, 100%;
	}
	#content .content_inner .content_menu #content_babyfood .inner h2 {
		padding-top: 7%;
	}
	#content_recipe .inner {
		padding-bottom: 10%;
		background-image: url(../image/content_recipe_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:8% 6%, center bottom;
		background-repeat:no-repeat;
		background-size: 22%, 100%;
	}
	#content_pregnancy .inner {
		padding-bottom: 10%;
		background-image: url(../image/content_pregnancy_on.gif), url(/community/milk/images/sp_content_menu_bg_bottom.png);
		background-position:14% 7%, center bottom;
		background-repeat:no-repeat;
		background-size: 12%, 100%;
	}

}