@charset "UTF-8";

/*================================================
 common
================================================*/

	/* css reset
	------------------------------------------------*/
	body, #brandHeadAll, #brandHeadAll div, #brandHeadAll p,
	#brandHeadAll ul, #brandHeadAll li,
	#contentFoot, #contentFoot div, #contentFoot p,
	#contentFoot ul, #contentFoot li,
	#brandFoot, #brandFoot div {margin:0px;padding:0px;}
	
	/* font family
	------------------------------------------------*/
	#brandHeadAll, #contentFoot{font-family: "MS P Gothic", "ＭＳ Ｐゴシック", "Osaka－等幅", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;}

	/* font size
	------------------------------------------------*/
	/*universal class > font size > ftMedium*/
	#brandHeadAll p, #brandHeadAll li, #contentFoot p, #contentFoot li{font-size:12px; line-height:1.6;}

	/* tags base setting
	------------------------------------------------*/
		/*p*/
		#brandHeadAll p,
		#contentFoot p{font-weight:normal;}
		
		/*ul*/
		#brandHeadAll ul    {list-style:none;}
		#brandHeadAll li    {display:list-item;}
		#brandHeadAll li img{vertical-align:bottom;}

		#contentFoot ul    {list-style:none;}
		#contentFoot li    {display:list-item;}
		#contentFoot li img{vertical-align:bottom;}
		
		/*img*/
		#brandHeadAll img,
		#contentFoot img{border:0px;}

	/* float clear
	------------------------------------------------*/
	br.clearFloat,
	img.clearFloat {clear:both;height:1px;}
	div.clearFloat {clear:both;font-size:1px;line-height:0px;height:1px;width:1px;}

	/* Display None */
	.noDisp {display:none;}

/*================================================
 brand header
================================================*/
/* brandHeadAll */
#brandHeadAll{
	width:100%;
	min-width: 940px;
	margin:0px;
	padding:0px;
	border-bottom:#2f50a5 2px solid;
	background:#ffffff;
	}

/* brandHead */
#brandHeadAll #brandHead{
	width: 940px;
	padding: 9px 36.5px 8px 36.5px;
	margin:0px auto;
	position:relative;
	}
	
#brandHeadAll #brandHead #brandHeadLogo{float:left; width:112px;}
#brandHeadAll #brandHead #brandHeadNavi{float:right; width:725px; text-align:right; padding:8px 0px;}
#brandHeadAll #brandHead #brandHeadNavi ul li{display:inline-block; padding:2px 10px; border-right:#cccccc 1px solid; font-size:0px; line-height:1px;}
#brandHeadAll #brandHead #brandHeadNavi ul li.first{border-left:#cccccc 1px solid;}

html*#brandHeadAll #brandHead #brandHeadNavi ul li{
	display:inline;
	zoom:1;
	}

/* brand footer
---------------------------------------------------------- */
/* brand Foot */
#brandFoot {
	width:100%;
	background:#fff;
}
#brandFoot .inner {
	width: 940px;
	padding: 10px 0px;
	margin: 0 auto;
	text-align: right;
}
#brandFoot img {
	width: 320px;
}
.brandFoot-bd {
	border-top: 1px solid #D4D4D4;
}

/* Content Foot */
#contentFoot{
	width:100%;
	background:#fff;
	min-width: 940px;
	}

#contentFoot .footSiteLink{
	border-top:1px solid #e2d2af;
	border-bottom:1px solid #e2d2af;
	background:#fdf0cc;
	padding:10px 0px;
	min-width:940px;
	}
	#contentFoot .footSiteLink ul{
		width: 940px;
		padding: 0px 36.5px;
		margin:0px auto;
		font-size:12px;
		line-height:1.1;
		text-align:center;
		}
	#contentFoot .footSiteLink ul li{
		display:inline-block;
		vertical-align:top;
		font-weight:normal;
		border-left:1px solid #f1e3c0;
		padding:0px 15px;
		*border-left:expression((this._firstChild = (this.parentNode.getElementsByTagName('li')[0] == this) ) ? 'none' : '#f1e3c0 1px solid');
		}
	#contentFoot .footSiteLink ul li:first-child{
		display:inline-block;
		vertical-align:top;
		border-left:none;
		}
	#contentFoot .footSiteLink ul li a{
		color:#996600;
		}
	html*#contentFoot .footSiteLink ul li{
	display:inline;
	zoom:1;
		}

	#contentFoot .footSiteLink ul li a         {text-decoration:none;}
	#contentFoot .footSiteLink ul li a:link    {text-decoration:none;}
	#contentFoot .footSiteLink ul li a:visited {text-decoration:none;}
	#contentFoot .footSiteLink ul li a:hover   {text-decoration:underline;}
	#contentFoot .footSiteLink ul li a:active,
	#contentFoot .footSiteLink ul li a:focus   {text-decoration:underline;}

#contentFoot .copyRigntArea{
	background:#fff;
	width: 940px;
	padding: 15px 36.5px 15px 36.5px;
	margin:0px auto;
	}
	#contentFoot .copyRigntArea p.copyRignt{
		width: 700px;
		float:left;
		font-size:10px;
		font-weight:normal;
		color:#666;
		text-align:left;
		}
	#contentFoot .copyRigntArea p.logoFoot{
		width:120px;
		float:right;
		font-size:0;
		line-height:0;
		text-align:right;
		}
	#contentFoot .copyRigntArea p.logoFoot img{width:86px !important;}

#tableDisplayArea{display:none;}

@media (max-width: 767px) {
	/*-------------------------------------------
Base Setting
-------------------------------------------*/
body,select,input,textarea{-webkit-text-size-adjust: none;}
#contentBodyMain .spImage{display:none;}
#tableDisplayArea{display:none;}

/*-------------------------------------------
ALL
-------------------------------------------*/
#contentAll{width:100%;}

		/*a*/
		#brandHeadAll a         {text-decoration:none !important;}
		#brandHeadAll a:link    {text-decoration:none !important;}
		#brandHeadAll a:visited {text-decoration:none !important;}
		#brandHeadAll a:hover   {text-decoration:none !important;}
		#brandHeadAll a:active,
		#brandHeadAll a:focus   {text-decoration:none !important;}

		/*a*/
		#contentFoot a         {text-decoration:none !important;}
		#contentFoot a:link    {text-decoration:none !important;}
		#contentFoot a:visited {text-decoration:none !important;}
		#contentFoot a:hover   {text-decoration:none !important;}
		#contentFoot a:active,
		#contentFoot a:focus   {text-decoration:none !important;}

/* brand header
---------------------------------------------------------- */
#brandHeadAll{
	min-width:320px;
    border-bottom: #2f50a5 1px solid;
	}

#brandHeadAll #brandHead{
	width: 100%;
	padding: 9px 0px 9px 0px;
	height: 20px;
	}
	#brandHeadAll #brandHead #brandHeadLogo{float:none; position: absolute; top: 24%; left: 1%; padding:0px;}
	#brandHeadAll #brandHead #brandHeadNavi{float:none; width:100%; padding:0px;}
	#brandHeadNavi p{padding:0px 10px 0px 66px;}
	#brandHeadAll #brandHead #brandHeadNavi p a{
	background:transparent url(image/brand_arrow.png) no-repeat right;
	background-size:8px 11px;
	padding-right:16px;
	}

	#brandHeadAll #brandHead #brandHeadLogo p a{
		display: block;
		width:100px;
		height:16px;
		background:transparent url(http://www.unicharm.co.jp/common_cms/image/head_logo_u_sp.png) no-repeat;
		background-size: 50px 13px;
		}
	#brandHeadAll #brandHead #brandHeadLogo p img{display:none;}
	#brandHeadAll #brandHead #brandHeadNavi ul{display:none;}

	#brandHeadAll #brandHead #brandHeadNavi p a         {text-decoration:none;}
	#brandHeadAll #brandHead #brandHeadNavi p a:link    {color:#4c4c4c;text-decoration:none;}
	#brandHeadAll #brandHead #brandHeadNavi p a:visited {color:#4c4c4c;text-decoration:none;}
	#brandHeadAll #brandHead #brandHeadNavi p a:hover   {color:#4c4c4c;text-decoration:none;}
	#brandHeadAll #brandHead #brandHeadNavi p a:active,
	#brandHeadAll #brandHead #brandHeadNavi p a:focus   {color:#4c4c4c;text-decoration:none;}

/* brand footer
---------------------------------------------------------- */
/* brand Foot */
#brandFoot {
	width:100%;
	background:#fff;
}
#brandFoot .inner {
	width: 100%;
	padding: 5px 0 0;
	margin: 0 auto;
	text-align: center;
}
#brandFoot img {
	/* max-width: 380px; */
	/* width: 90%; */
	width: 45%;
}

/* Content Foot */
#contentFoot{
	width:100%;
	background:#fff;
	min-width:320px;
	}

#contentFoot .footSiteLink{
	border-top:1px solid #e2d2af;
	border-bottom:1px solid #e2d2af;
	background:#fdf0cc;
	padding:10px 0px 0px;
	min-width:320px;
	}
	#contentFoot .footSiteLink ul{
		width:100%;
		margin:0px auto;
		font-size:12px;
		line-height:1.1;
		text-align:center;
		padding: 0;
		}
	#contentFoot .footSiteLink ul li{
		display:inline-block;
		vertical-align:top;
		border-left:1px solid #f1e3c0;
		padding:0px 15px;
		margin-bottom:10px;
		}
	#contentFoot .footSiteLink ul li:first-child{
		display:inline-block;
		vertical-align:top;
		border-left:none;
		}
	#contentFoot .footSiteLink ul li a{
		color:#996600;
		text-decoration:none !important;
		font-size: 10px;
		}

#contentFoot .footSiteLink ul li a:hover   {text-decoration: none;}
#contentFoot .footSiteLink ul li a.thover  {opacity: 0.5;}

/* copyRigntArea */
#contentFoot .copyRigntArea{
	/*border-top:#cccccc 1px solid;*/
	background:#fff;
	padding:10px;
	width:auto !important;
	margin:0px auto;
	}
	#contentFoot .copyRigntArea p.copyRignt{
		width:70%;
		float:left;
		font-size:10px;
		color:#666;
		padding-top:5px;
		}
	#contentFoot .copyRigntArea p.logoFoot{
		width:30%;
		float:right;
		font-size:0;
		line-height:0;
		text-align:right;
		}
}