@charset "UTF-8";

/* style.css 

 01.Yahoo UI Library Fonts CSS
 02.common
 03.body
 04.header
 05.content
 06.導入
 07.総合人気ランキング
 08.１位〜３位
 09.footer
 10.side
 
*/

/*
===============================================
 01.Yahoo UI Library Fonts CSS
----------------------------------------------- */
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

/* 10px = 77%
   11px = 85%
   12px = 93%
	  13px = 100%
   14px = 108%
   16px = 123.1%
   18px = 138.5%
   20px = 153.9%
   24px = 182%
*/

/*
===============================================
 02.common
----------------------------------------------- */
* { margin: 0; padding: 0;}
a img { margin: 0; padding: 0; border: none;}

a { color: #0000FF; text-decoration: underline; outline: none;font-weight:bold;}
a:hover { color: #FF0000; text-decoration: underline;}

.clearfix:after, .jikkan-content-inner:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix, .jikkan-content-inner { display: inline-block;}

/* Hides from IE-mac ¥*/
*html .clearfix, .jikkan-content-inner { height: 1%;}
.clearfix, .jikkan-content-inner { display: block;}
/* End hide from IE-mac */

.txt12 { font-size: 12px;}


/*
===============================================
 03.body
----------------------------------------------- */
body {
	line-height: 1;
	color: #000000;
	text-align: center;
	background-color: #FFFFFF;
	font-family: "ＭＳ Ｐゴシック", Osaka;
}


/*
===============================================
 04.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 20px auto;}


/*
===============================================
 05.content
----------------------------------------------- */
#content { clear: both; width: 1000px; margin: 0 auto;}

#main { width: 760px; float: left;}
#side { width: 220px; float: right;}


/*
===============================================
 06.導入
----------------------------------------------- */
#intro {
	width: 760px;
	background-image: url(img/intro_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 15px 0;
	margin: 0 0 20px 0;
}

#intro-inner {
	width: 760px;
	background-image: url(img/intro_t.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 15px 0 0 0;
}

#intro-content {
	width: 760px;
	text-align: center;
	background-image: url(img/intro_m.gif);
	background-repeat: repeat-y;
	padding:0px 0 0 0 ;
}

#intro-content table { width: 700px; margin: 0 auto;}

.intro-txt { padding: 10px 0 0 0; text-align: left;}

.intro-txt p {
	background-image: url(img/dotline_3.gif);
	background-repeat: repeat-x;
	font-size: 14px;
	line-height: 32px;
	padding: 0 10px;
	margin: 0;
}

.intro-photo
	{padding:20px 0 20px 0 ;}
	


/*
===============================================
 07.総合人気ランキング
----------------------------------------------- */
.frame-ranking {
	width: 760px;
	background-image: url(img/frame_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 10px 0;
	margin: 0 0 6px 0;
}

.frame-ranking-inner {
	width: 760px;
	background-image: url(img/frame_m.gif);
	background-repeat: repeat-y;
	text-align: center;
	padding: 5px 0 0 0;
}

#ranking-list { width: 720px; 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: 138.5%; 
	padding: 0 0 5px 0; 
	margin: 0 15px;
}

.brand { font-size: 93%; margin: 0 15px;}

.osusume-title { 
	font-weight: bold; 
	color: #993300; 
	font-size: 123.1%; 
	margin: 0 0 5px 0;
}

.osusume-title img,
.osusume-title2 img { vertical-align: middle; margin: 0 6px 0 0;}

.osusume-txt { font-size: 100%; line-height: 1.3;}

#ranking-list th.none,
#ranking-list td.none { background-image: none;}

#ranking-list a { font-weight: bold;} 


/*
===============================================
 08.１位〜３位
----------------------------------------------- */
.frame {
	width: 760px;
	background-image: url(img/frame_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 15px 0;
	margin: 0 0 20px 0;
}

.frame-inner {
	width: 760px;
	background-image: url(img/frame_m.gif);
	background-repeat: repeat-y;
	text-align: center;
	padding: 5px 0 0 0;
}

.ranking {
	width: 760px;
	background-image: url(img/ranking_title_back.gif);
	background-repeat: no-repeat;
}

.ranking td { vertical-align: top;}

.ranking-number { width: 118px; text-align: left;}

.konnahito { width: 117px; text-align: center; padding: 26px 0 0 0;}

.konnahito-txt { 
	text-align: left; 
	padding: 36px 0 0 10px; 
	font-size: 123.1%; 
	font-weight: bold;
	color: #FFFFFF;
}

.ranking-content { 
	width: 720px; 
	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: 153.9%; font-weight: bold;}

.osusume-title2 { 
	font-weight: bold; 
	color: #993300; 
	font-size: 123.1%; 
	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;
}


.dotline-txt02 {
	background-image: url(img/dotline_2.gif);
	background-repeat: repeat;
	font-size: 14px;
	line-height: 32px;
	padding: 1px 0 4px 0;
	margin: 10px 10px 20px 10px;
}

.dotline-txt03 {
	background-image: url(img/dotline_2.gif);
	background-repeat: repeat;
	font-size: 14px;
	line-height: 32px;
	padding: 1px 0 4px 0;
	margin: 0 0 15px 0;
}



/* 必見！
----------------------------------------------- */
.hikken {
	width: 720px;
	background-image: url(img/hikken_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 30px 0;
}

.hikken-inner {
	width: 720px;
	background-image: url(img/hikken_t.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 15px 0 0 0;
}

.hikken-content {
	width: 720px;
	background-image: url(img/hikken_m.gif);
	background-repeat: repeat-y;
	text-align: center;
}

.hikken-body {
	width: 680px;
	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: 108%;
	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: 108%;
	line-height: 1.3;
	padding:  5px 10px;
	text-align:left;
	vertical-align:middle;
}

.product-info th { background-color: #FEE8D3; font-weight: normal;}



/* トライアルセットを見る
----------------------------------------------- */
.set {	
	text-align: center; 
	font-size: 18px; 
	font-weight: bold;
	margin: 0px 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: 93%;}

.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: 182%; 
	font-weight: bold;
	line-height: 1.3;
}

.interview-hyoka img { vertical-align: middle;}

.star { margin: 0 0 0 10px;}

/* 実感できた効果ランキング
----------------------------------------------- */
.jikkan {
	width: 720px;
	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: 720px;
	background-image: url(img/jikkan_t.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 15px 0 0 0;
}

.jikkan-content {
	width: 720px;
	background-image: url(img/jikkan_m.gif);
	background-repeat: repeat-y;
	text-align: center;
	padding: 8px 0;
}

.jikkan-content-inner { width: 680px; margin: 0 auto; text-align: left;}

.jikkan-content-inner h4 { font-weight: normal; font-size: 108%; 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: 108%;
	line-height: 1.3;
	text-align: left;
	vertical-align: top;
}

.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: 108%;
	line-height: 1.4;
	padding: 0 0 0 20px;
	margin: 15px 20px 0 0;
}

/* 写真ボックス
----------------------------------------------- */
.photo-right {
	float: right;
	width: 220px;
	margin: 0 0 20px 20px;
}

.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: 77%;
}

/* 効果・使用感・価格
----------------------------------------------- */
.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: 13px;
	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: 123.1%;
	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: 108%;
	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: 93%;}
.to-top img { vertical-align: middle;}




/*
===============================================
 00.第２階層（商品紹介ページ）
----------------------------------------------- */


.frame-product {
	width: 760px;
	background-image: url(img/frame_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0px 0 10px 0;
	margin: 0 0 6px 0;
}

.frame-product-inner {
	width: 760px;
	background-image: url(img/frame_m.gif);
	background-repeat: repeat-y;
	padding: 20px 0 0 0;
}


.product-box
	{
	width: 700px; margin: 0px auto 0px auto;
	padding:0 0 10px 0;
	text-align:left;
	}
	
.product-box h3
	{
	font-size:20px;
	}	


.product-box h4
	{
	text-align:left;
	color:#993300;
	font-size:16px;
	margin: 0px 0 15px 0;
	}
	
	
.td-aling-top
	{
	vertical-align:top;
	}



.subttl-judge
	{
	text-align:left;
	font-size:14px;
	margin: 0px 0 15px 0;
	}
	
.product-box h5
	{
	text-align:left;
	color:#ff0000;
	font-size:18px;
	margin: 0px 0 10px 0;
	}
	



#product-name { width: 700px; margin: 0px auto 18px auto;}

#product-name th	
	{
	text-align:left;
	}
	
#product-name td
	{
	}




#product-list th.none,
#product-list td.none { background-image: none;}

#product-list a { font-weight: bold;} 









/*-----写真キャプション付き-----*/	
	
div.photo-border02
	{
	border:1px solid #dcdcdc;
	padding:8px;
	width:250px;
	}
	
div.photo-border02 p
	{
	padding:8px 3px 0px 3px;
	font-size:12px;
	line-height:140%;
	text-align:left;
	font-weight:normal;
	}		


/*-----写真キャプション付き 写真サイズ200px-----*/	
	
div.photo-border03
	{
	border:1px solid #dcdcdc;
	padding:8px;
	width:200px;
	}
	
div.photo-border03 p
	{
	padding:8px 3px 0px 3px;
	font-size:12px;
	line-height:140%;
	text-align:left;
	font-weight:normal;
	}		


/*-----写真キャプション付き 写真サイズ150px ランキング掲載-----*/	
	
div.photo-border04
	{
	border:1px solid #dcdcdc;
	padding:3px;
	margin:10px 10px 10px 10px;
	width:150px;
	float:left;
	}
	
div.photo-border04 p
	{
	padding:8px 3px 0px 3px;
	font-size:12px;
	line-height:140%;
	text-align:left;
	font-weight:normal;
	}		





/*
===============================================
 09.footer
----------------------------------------------- */
#footer { 
	clear: both; 
	width: 1000px; 
	margin: 0 auto; 
	text-align: left; 
	padding: 0 0 30px 0;
}

#footer p { font-size: 77%; padding: 0 0 15px 0;}

#footer li {
	font-size: 77%;
	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;font-weight:normal;}
#footer a:hover { color: #FF0000; text-decoration: underline;}


/*
===============================================
 10.side
----------------------------------------------- */
.side-frame {
	width: 220px;
	background-image: url(img/side_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 5px 0;
	margin: 0 0 20px 0;
}

.side-frame-inner {
	width: 220px;
	background-image: url(img/side_m.gif);
	background-repeat: repeat-y;
	text-align: center;
}

.side-frame2 {
	width: 220px;
	background-image: url(img/side2_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 4px 0;
	margin: 0 0 20px 0;
}

.side-frame2-inner {
	background-color: #BEB481;
	text-align: center;
}

.side-frame3 {
	width: 220px;
	background-image: url(img/side3_b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 10px 0;
	margin: 0 0 20px 0;
}

.side-frame3-inner {
	width: 220px;
	background-image: url(img/side3_m.gif);
	background-repeat: repeat-y;
	text-align: center;
}


/* おすすめランキング
----------------------------------------------- */
.side-ranking { width: 212px; margin: 0 auto;}

.side-ranking th,
.side-ranking td {
	background-image: url(img/dotline.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	vertical-align: top;
	padding: 7px 0 7px 0;
	text-align: left;
}

.side-ranking th { width: 70px;}
.side-ranking td { padding: 7px 20px 7px 0;}

.side-ranking th.none,
.side-ranking td.none { background-image: none;}

.rank-number,
.rank-thumb {	width: 42px; margin: 0 0 0 15px;}

.rank-number { padding: 0 0 4px 0;}

.rank-name {
	font-size: 123.1%;
	line-height: 1.4;
	font-weight: bold;
	padding: 12px 0 10px 0;
}

.rank-txt { font-size: 100%; line-height: 1.4;}

/* 悩み別ランキング
----------------------------------------------- */
.nayami-btn { list-style-type: none;}
.nayami-btn li { padding: 3px 0 0 0; font-size: 1%;}

/* 商品一覧
----------------------------------------------- */
.ichiran-name {
	background-color: #F5EDDD;
	margin: 0 4px;
	padding: 8px 10px;
	text-align: left;
	border-top: 1px solid #D8D2B4;
	border-bottom: 1px solid #D8D2B4;
	font-size: 100%;
	font-weight: bold;
}

.ichiran-list { 
	list-style-type: none; 
	text-align: left;
	margin: 0 20px;
	padding: 8px 0 10px 0;
}

.ichiran-list li {
	font-size: 100%;
	line-height: 1.4;
	background-image: url(img/icon_footer.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding: 0.2em 0 0.2em 15px;
}

/* ナビゲータの紹介
----------------------------------------------- */
.navigator {	width: 190px; margin: 0 auto;}

.navigator th,
.navigator td { padding: 10px 0 5px 0;}

.navigator td p {
	font-size: 100%;
	line-height: 1.4;
	padding: 0 0 5px 0;
}

/* おすすめサイト
----------------------------------------------- */
.side-osusume {	
	margin: 0 15px;
	list-style-type: none;
}

.side-osusume li {
	text-align: left;
	font-size: 85%;
	line-height: 1.4;
	padding: 5px 0;
}

.side-osusume a { color: #666666;}
.side-osusume a:hover { color: #FF0000;}




