/* style.css 

 01.common
 02.body
 03.header
 04.navi
 05.content
 06.総合人気ランキング
 07.１位〜３位
 08.footer
 
*/

/*
===============================================
 01.common
----------------------------------------------- */
* { margin: 0; padding: 0;}
a img { margin: 0; padding: 0; border: none;}

a { color: #0000FF; text-decoration: underline; outline: none;}
a:hover { color: #FF0000; text-decoration: underline;}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-block;}

/* Hides from IE-mac \*/
*html .clearfix { height: 1%;}
.clearfix { display: block;}
/* End hide from IE-mac */

.txt12 { font-size: 12px;}
.txt14 { font-size: 14px;}


/*
===============================================
 02.body
----------------------------------------------- */
body {
	line-height: 1;
	color: #000000;
	text-align: center;
	background-color: #FFFFFF;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

/*
===============================================
 03.header
----------------------------------------------- */
#header { width: 100%;}

#for-seo { border-bottom: 2px solid #9E8E43; padding: 6px 0;}
#for-seo p { width: 1000px; margin: 0 auto; text-align: left; font-size: 10px;}
#for-seo img { margin: 0 6px 0 0; vertical-align: middle;}

#header-title { width: 1000px; margin: 0 auto 10px auto;}

/*
===============================================
 04.navi
----------------------------------------------- */
#navi { width: 988px; margin: 0 auto;}
#navi li { float: left; list-style-type: none;}
#navi li a { display: block;}

/*
===============================================
 05.content
----------------------------------------------- */
#content { clear: both; width: 1000px; margin: 0 auto;}

.frame {
	width: 1000px;
	background-image: url(img/frame_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 12px 0;
	margin: 0 0 10px 0;
}

.frame-inner {
	width: 1000px;
	background-image: url(img/frame_m.gif);
	background-repeat: repeat-y;
	padding: 5px 0 0 0;
}


/*
===============================================
 06.総合人気ランキング
----------------------------------------------- */
#ranking-list { width: 960px; margin: 0 auto;}

#ranking-list th,
#ranking-list td {
	background-image: url(img/dotline.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	vertical-align: middle;
	padding: 0.5em 0;
}

.name { 
	font-size: 18px; 
	padding: 0 0 5px 0; 
	margin: 0 15px;
}

.brand { font-size: 12px; margin: 0 15px;}

.osusume-title { 
	font-weight: bold; 
	color: #993300; 
	font-size: 16px; 
	margin: 0 0 5px 0;
}

.osusume-title img,
.osusume-title2 img { vertical-align: middle; margin: 0 6px 0 0;}

#ranking-list th.none,
#ranking-list td.none { background-image: none;}

#ranking-list a { font-weight: bold;} 


/*
===============================================
 07.１位〜３位
----------------------------------------------- */
.ranking {
	width: 1000px;
	background-image: url(img/ranking_title_back.gif);
	background-repeat: no-repeat;
}

.ranking td { vertical-align: top;}

.ranking-number { width: 151px; text-align: left;}

.konnahito { width: 210px; text-align: center; padding: 36px 0 0 0;}

.konnahito-txt { 
	text-align: left; 
	padding: 36px 0 0 10px; 
	font-size: 16px; 
	font-weight: bold;
	color: #FFFFFF;
}

.ranking-content { 
	width: 940px; 
	margin: 0 auto; 
	text-align: left;
	padding: 10px 0 0 0;
}

.product-name { font-weight: normal; padding: 0 0 20px 0;}
.product-name a { font-size: 20px; font-weight: bold;}

.osusume-title2 { 
	font-weight: bold; 
	color: #993300; 
	font-size: 16px; 
	margin: 0 0 15px 0;
}

/* ドットライン付きテキスト
----------------------------------------------- */
.dotline-txt {
	background-image: url(img/dotline_2.gif);
	background-repeat: repeat;
	font-size: 14px;
	line-height: 32px;
	padding: 1px 0 4px 0;
	margin: 0 0 25px 0;
}

/* 必見！
----------------------------------------------- */
.hikken {
	width: 940px;
	background-image: url(img/hikken_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 30px 0;
}

.hikken-inner {
	width: 940px;
	background-image: url(img/hikken_t.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 15px 0 0 0;
}

.hikken-content {
	width: 940px;
	background-image: url(img/hikken_m.gif);
	background-repeat: repeat-y;
	text-align: center;
}

.hikken-body {
	width: 880px;
	margin: 0 auto;
	background-image: url(img/hikken_back.gif);
	background-repeat: no-repeat;
	background-position: right top;
}

.hikken-title { padding: 10px 0 0 0;}

.hikken-list { padding: 10px 0 0 0;}

.hikken-list li {
	list-style-type: none;
	background-image: url(img/icon_hikken.gif);
	background-repeat: no-repeat;
	background-position: left 0.2em;
	font-size: 14px;
	line-height: 1.4;
	padding: 0 0 0 20px;
	margin: 0.5em 0;
}

/* 商品詳細
----------------------------------------------- */
.info-title { text-align: left; margin: 25px 0 5px 0;}

.product-info { border: 2px solid #CCCCCC;}

.product-info table {
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	width: 100%;
}

.product-info th,
.product-info td {
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	font-size: 14px;
	line-height: 1.3;
	padding:  5px 10px;
}

.product-info th { background-color: #FEE8D3; font-weight: normal;}

/* トライアルセットを見る
----------------------------------------------- */
.set {	
	text-align: center; 
	font-size: 18px; 
	font-weight: bold;
	margin: 15px 0 25px 0;
}

.set img { vertical-align: middle; margin: 0 6px 0 0;}

/* 使用者口コミ
----------------------------------------------- */
.interview-title { margin: 0 0 25px 0;}

.interview-person { margin: 5px 20px 0 0; text-align: center; font-size: 12px;}

.interview-hyoka,
.interview-midashi {
	background-image: url(img/dotline.gif);
	background-repeat: repeat-x;
	background-position: left top;
	padding: 5px 0;
}

.interview-midashi { 
	color: #993300; 
	font-size: 24px; 
	font-weight: bold;
	line-height: 1.3;
}

.interview-hyoka img { vertical-align: middle;}

.star { margin: 0 0 0 10px;}

/* 実感できた効果ランキング
----------------------------------------------- */
.jikkan {
	width: 940px;
	background-image: url(img/jikkan_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 15px 0;
	margin: 20px 0 0 0;
}

.jikkan-inner {
	width: 940px;
	background-image: url(img/jikkan_t.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 15px 0 0 0;
}

.jikkan-content {
	width: 940px;
	background-image: url(img/jikkan_m.gif);
	background-repeat: repeat-y;
	text-align: center;
	padding: 8px 0;
}

.jikkan-content-inner { width: 880px; margin: 0 auto;}

.jikkan-content-inner h4 { font-weight: normal; font-size: 14px; margin: 0 0 15px 0;}
.jikkan-content-inner h4 img { vertical-align: middle;}

.jikkan-ranking {
	background-image: url(img/dotline.gif);
	background-repeat: repeat-x;
	background-position: left top;
}

.jikkan-ranking th,
.jikkan-ranking td {
	background-image: url(img/dotline.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	padding: 8px 0;
	font-size: 14px;
	text-align: left;
}

.jikkan-ranking td.jikkan-title { 
	color: #FF0000; 
	font-weight: bold; 
	padding-left: 10px;
	padding-right: 10px;
}

.fukidashi {
	background-image: url(img/icon_fukidashi.gif);
	background-repeat: no-repeat;
	background-position: left 0.2em;
	font-size: 14px;
	line-height: 1.4;
	padding: 0 0 0 20px;
	margin: 15px 20px 0 0;
}

/* 写真ボックス
----------------------------------------------- */
.photo { 
	text-align: center; 
	border: 1px solid #D3CAC3; 
	background-color: #F8F5F3; 
	padding: 10px 0;
	width: 100%;
}

.photo img {
	display: block;
	margin: 0 auto;
	padding: 0;
}

.caption {
	margin: 5px 10px 0 10px;
	text-align: left; 
	font-size: 10px;
}

/* 効果・使用感・価格
----------------------------------------------- */
.kouka {
	font-weight: normal;
	background-image: url(img/border_beju.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 8px 0;
	margin: 25px 0 0 0;
}

.point {
	background-image: url(img/icon_point.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding: 0 0 0 16px;
	font-size: 14px;
	margin: 0 0 0 15px;
}

.kouka-txt { margin: 0 0 0 20px;}
.kouka-txt2 { margin: 20px 0 0 0;}

.kouka-txt h5,
.kouka-txt2 h5 {
	font-size: 16px;
	font-weight: bold; 
	margin: 0 0 15px 0;
}

.kouka-txt h5 img,
.kouka-txt2 h5 img { vertical-align: middle; margin: 0 4px 0 0;}

.kouka-content { margin: 20px 0 0 0;}
.kouka-content td { text-align: left; vertical-align: top;}

/* 効果・使用感・価格
----------------------------------------------- */
.otameshi { border: 2px solid #CCCCCC;}

.otameshi table {
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	width: 100%;
}

.otameshi th,
.otameshi td {
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	font-size: 14px;
	line-height: 1.3;
	padding:  5px 10px;
}

.otameshi th { background-color: #F2F2F2; font-weight: bold;}

.to-top { text-align: right; margin: 10px 0 0 0; font-size: 12px;}
.to-top img { vertical-align: middle;}

/*
===============================================
 08.footer
----------------------------------------------- */
#footer { width: 1000px; margin: 0 auto; text-align: left; padding: 0 0 30px 0;}

#footer p { font-size: 10px; padding: 0 0 15px 0;}

#footer li {
	font-size: 10px;
	line-height: 1.6;
	display: inline;
	list-style-type: none;
	background-image: url(img/icon_footer.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding: 0 0 0 14px;
	margin: 0 10px 0 0;
}

#footer a { color: #9E8E43; text-decoration: underline;}
#footer a:hover { color: #FF0000; text-decoration: underline;}









/*　共通
----------------------------------------------- */

.fontsize-xl
	{
	font-size:18px;
	}

.fontsize-l
	{
	font-size:16px;
	}

.fontsize-m
	{
	font-size:14px;
	}
	
.fontsize-s
	{
	font-size:12px;}
	
.fontsize-xs
	{
	font-size:10px;
	}

.font-pop
	{
	font-size:large;
	font-family: "HGS創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W6";
	}
	
	
.font-red
	{
	color:#ff0000;
	}

.fontsize-xsred
	{
	font-size:10px;
	color:#ff0000;
	}	

	
.font-redm
	{
	color:#ff0000;
	font-size:14px;
	font-weight:bold;
	}
	
	
.font-redl
	{
	color:#ff0000;
	font-size:16px;
	font-weight:bold;
	}
	
.font-redxl
	{
	color:#ff0000;
	font-size:18px;
	font-weight:bold;
	}	

	
.font-redb
	{
	color:#ff0000;
	font-weight:bold;
	}
	

.img-middle
	{
	vertical-align:middle;
	}


.photo-border
	{
	padding:3px;
	border:1px solid #dcdcdc;
	}

.photo-border-left
	{
	padding:3px;
	border:1px solid #dcdcdc;
	float:left;
	margin:0 10px 5px 0;
	}


.under
	{
	border-bottom:#FF0000 solid 1px;
	}


.mark
	{
	padding:3px;
	color:#FF1493;
	font-weight:bold;
	}



/*表 table*/

.table table
	{
	border-collapse: collapse;
	margin-top:10px;
	margin-bottom:20px;
	}
	
.table th
	{
	padding:8px;
	border:1px solid #CCCCCC;
	text-align:left;
	background-color:#FFF8DC;
	font-size:14px;
	font-weight:normal;
	}
	
.table td
	{
	padding:8px;
	border:1px solid #CCCCCC;
	text-align:left;
	line-height:150%;
	font-size:14px;
	}