@charset "utf-8";

/* -------------------------------------
　Title:  SONOKO Online Shop

  1.全体
  
  2.コンテンツレイアウト 共通
    ├ノンオイル
	└
  
  3.サプリメント
    ├G.Gロゼ カテゴリページ
	├
	├
	└
	
  4.ファンデーション
    ├SONOKO ザ・ファンデーション(カテゴリ)

  5.ホワイトビューティー
    ├ホワイトビューティー(カテゴリ)

  6.ピュアモイスト
    ├ピュアモイスト(カテゴリ)

  7.GGコスメ
    ├GGコスメ(カテゴリ)	
	
  8.ホワイトセラム
    ├ホワイトセラム(カテゴリ)	
	
  9.ホワイトニングエッセンス
    └商品ページ
	
  10.キープリフティングクリームEX
    └商品ページ	

  11.アレルゲン
  
  12.レシピ（2010.02.04追加）
  
  13.トップ内外美容（2010.06.11追加）

------------------------------------- */





/* -------------------------------------
　　全体
------------------------------------- */

body {
	margin:0;
	padding:0;
}


#fs {
	width: 600px;
	text-align:left;
	font-size:12px;
	line-height:1.5;
	margin:0;
	padding:0;
}

dl dd {
	margin: 0px;
	padding: 0px;
}


.claer {
	clear: both;
}

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

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

 /*
#fs p {
	margin: 0px;
	padding: 0px;
}*/

ul li{
	margin:0;
	padding:0;
	list-style-type:none;
}

#fs ul {
	margin: 0px;
	padding: 0px;
}

/* -------------------------------------
　　コンテンツレイアウト　共通
------------------------------------- */

.cmn01 {
	text-align: center;
	margin-top:20px;
	margin-bottom:10px;/*変更前10px*/

}

.cmn02 {
	width: 570px;
	margin-left:15px;
}

.cmn03 {
	padding-top:20px;
	padding-bottom:20px;
	clear:both;
}

/* ノンオイル*/

.nonoil {
	list-style-type:none;
}

.nonoil li {
	display:inline;
}

/*カートへのリンク*/
#cart{
	text-align:right;
	padding-bottom:20px;
}


/* -------------------------------------
　　サプリメント
------------------------------------- */

/*G.Gロゼ カテゴリページ*/

.rose13 {
	width: 270px;
	height:auto;
	float:left;
	clear:left;
	display:inline;
	margin-left:20px;
}

.rose14 {
	width: 270px;
	height:auto;
	float:right;
	clear:right;
}


.rose01 {
	text-align: center;
	margin-top:20px;
	margin-bottom:20px;
}
.rose02 {
	width: 570px;
	margin-right: auto;
	margin-left: auto;
}

.rose03 {
	font-size: 14px;
	font-weight: bold;
	color:#ff0965;
	margin-bottom:20px;
	margin-left:15px;
}

.rose04 {
	height: auto;
	width: 180px;
	margin-left:15px;		
}

.rose05 {
	float: right;
}

.rose06 {
	float: left;
}

.rose07 {
	height: auto;
	width: 500px;
	margin-left:15px;
	float:right;	
}

.rose08 {
	padding-top:40px;
}

.rose09 {
	float:left;
	display:inline;
	clear:left;
}

.rose10 {
	border: thin solid #ffc8c8;
	height: 361px;
	width: 600px;
}

.rose11 {
	font-size: 14px;
	font-weight: bold;
	color:#ff0965;
	width:400px;
	padding-top: 20px;
	padding-left: 10px;
	padding-bottom:10px;
}


.rose12 {
	width:580px;
	*width:450px;
	padding-left: 10px;
	line-height:1;
}


/* -------------------------------------
　　ファンデーション
------------------------------------- */

/*ファンデーションカテゴリページ*/

.sf-ctg01 {
	font-size: 14px;
	font-weight: bold;
	color:#a352aa;
	width:500px;
	padding-top: 20px;
	padding-left: 10px;
	padding-bottom:10px;
}

.sf-ctg02 {
	width:570px;
	padding-left: 20px;
	padding-bottom:10px;
}

.sf-ctg03 {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ba7dbf;
	/*padding-top:10px;*/
}

/*削除*/
.sf-ctg04 {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ba7dbf;
	padding-top:10px;
	padding-bottom:20px;
}

.sf-ctg05 {
	padding-left: 10px;
	width:570px;
	padding-bottom:10px;
}

/*
.sample{
margin-top:10px;
margin-right:5px;
margin-bottom:15px;
margin-left:20px;

auto;
}


*/


/* -------------------------------------
　　ホワイトビューティー
------------------------------------- */

/*ホワイトビューティーカテゴリー*/

.wb01 {
	float: right;
}

.wb02 {
	margin-left:10px;
}

.wb03 {
	width: 270px;
	height:auto;
	float:left;
	display:inline;/*IE6*/
	margin-left:20px;
	padding-bottom:30px;
}

.wb04 {
	width:360px;
	float:left;
	margin-left:15px;
	margin-top:20px;
	margin-bottom:20px;
}

.wb05 {
	float:right;
	clear:right;
}

/* -------------------------------------
　　ピュアモイスト
------------------------------------- */

.pm-ctg01 {
	height: auto;
	width: 275px;
	margin-left:15px;
	margin-bottom:20px;
	float:left;
}

.pm-ctg02 {
	float:right;
	margin-right:20px;
	margin-bottom:20px;
}

/* -------------------------------------
　　GGコスメ
------------------------------------- */

.ggcosme-ctg01 {
	width: 490px;
	margin-right:15px;
	margin-bottom:10px;
	float:right;
	color:#aa4d00;
	font-size:14px;
	font-weight:bold;
}

.ggcosme-ctg02 {
	float:left;
}

.ggcosme-ctg03 {
	width: 490px;
	margin-right:15px;
	float:right;
}


/* -------------------------------------
　　ホワイトセラム
------------------------------------- */

.serum-ctg01 {
	float:right;
	margin-bottom:20px;
}

.serum-ctg02 {
	font-size: 14px;
	font-weight: bold;
	color:#ff0000;
	width:215px;
	padding-top: 10px;
	padding-left: 15px;
	padding-bottom:10px;
}

.serum-ctg03 {
	width:215px;
	padding-left:15px;
	padding-bottom:20px;
}

.serum-ctg04 {
	float:right;
}

.serum-ctg05 {
	width: 450px;
	margin-left:15px;
	float:left;
	display:inline;
}

.serum-ctg06 {
	margin-right:30px;
	float:right;
}

.serum-ctg07 {
	width:125px;
	padding-left:15px;
	padding-bottom:20px;
	float:left;
	display:inline;
}


/* -------------------------------------
　　ホワイトニングエッセンス
------------------------------------- */

.we_01 {
	width: 260px;
	height:auto;
	float:left;
	display:inline;
	margin-left:20px;
	margin-right:25px;
}

.we_01 dt {
	margin-bottom: 10px;
}

.we_02 {
	width: 260px;
	height:auto;
	float:right;
	margin-right:20px;
}

.we_02 dt {
	margin-bottom: 10px;
}

/* -------------------------------------
　　フェイシャルエッセンスマスク
------------------------------------- */

.fem_01{
	width: 280px;
	height:auto;
	float:left;
	display:inline;
	margin-left:15px;
	margin-right:10px;
}


/* -------------------------------------
　　キープリフティングクリームEX
------------------------------------- */

.ex_01{
	width: 280px;
	height:auto;
	float:left;
	display:inline;
	margin-left:15px;
	margin-right:10px;
	margin-bottom:20px;
}

.ex_02{
	width: 280px;
	height:auto;
	float:right;
	margin-right:15px;
}


/* -------------------------------------
　　スイーツカテゴリ
------------------------------------- */

.osusume_box {
	width:580px;
	height:auto;
	padding:10px;
	background-color:#fff1db;
	overflow:auto;
}

.text_box {
	width:325px;
	float:right;
}

.midashi {
	padding:2px 5px 0px;
	border-left:solid 4px #e66400;
	color:#e66400;
	font-size:14px;
	font-weight:bold;
	line-height:1.4;
}

/* -------------------------------------
　　アレルゲン
------------------------------------- */

.ar th	{
	border: 1px solid #BCBCBC;
	color: #333;
}
.ar td	{
	border: 1px solid #BCBCBC;
	text-align: center;
	font-size: 10px;
	color: #333;
	padding-top: 2px;
	padding-bottom: 2px;
}
.ar_txt_1 {
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 10px;
	padding-top:20px;
	color:#ff0000;
}

.ar_txt_2 {
	font-size: 12px;
	padding-bottom: 10px;
}
.ar_txt_3 {
	font-size: 11px;
}

.ar_txt_4 {
	font-size: 12px;
	padding-bottom: 11px;
}

.ar .left {
	text-align: left;
	padding-left:3px;
}

#fs .table_left {
	float: left;
	margin-right: 10px;
}


.bgc{background-color:#EBEBD7;}
.bgc2{background-color:#EEE;}

#fs .table_left .left a:link    { color: #333; text-decoration: none; }
#fs .table_left .left a:visited { color: #333; text-decoration: none; }
#fs .table_left .left a:hover   { color: #999; text-decoration: underline; }
#fs .table_left .left a:active   { color: #333; text-decoration: none; }

#fs .table_right .left a:link    { color: #333; text-decoration: none; }
#fs .table_right .left a:visited { color: #333; text-decoration: none; }
#fs .table_right .left a:hover   { color: #999; text-decoration: underline; }
#fs .table_right .left a:active  { color: #333; text-decoration: none; }



/* -------------------------------------
　　レシピ
------------------------------------- */

.r_frame {
	border:1px solid #cccccc;
	background-color:#ffffff;
}
	
.r_back {
	background:url(../../images/recipe/back.jpg) right top no-repeat;
}
	
.r_contents { 
	width:520px;
	margin-top:20px;
	margin-left:40px;
	text-align:left;
}

.r_new {
	width:496px;
	padding:10px;
	border:1px dotted #DFCFB5;}

.r_h2 {
	margin-top:30px;
	padding-bottom:2px;
	font-size:16px;
	font-weight:bold;
	color:#333333;
	border-bottom:2px solid #DFCFB5;
}

.r_h3 { 
	margin-top:20px;
	padding-bottom:2px;
	font-size:12px;
	font-weight:nomal;
	color:#333333;
	border-bottom:2px dotted #ff9a50;
}

.r_button {
	text-align:right; 
	margin:-45px 0px 30px 0px;
}

.r_comment {
	margin:10px;
	padding:10px;
	border:2px dotted #999999;
}

.r_spice li {
	display:inline;
}
	
.r_menu {
	float:left;
	width:140px;
	height:158px;
	background:url(../../images/recipe/menu_back.gif) no-repeat top left;
	padding:15px;
	margin-left:3px;
}
	
.r_menu_title {
	margin-top:5px;
	line-height:1.4;
	font-weight:bold;
}
	
.r_indent {
	margin:10px;
}

.r_photo {
	float:left;
	width:270px;
}

.r_photobg {
	background:url(../../images/recipe/photo_back.jpg) no-repeat top left;
	width:270px;
	height:210px;
}

.r_material {
	float:right;
}

.r_material table {
	width:225px;
	border:none;
}

.r_material td {
	padding:3px 5px;
	width:102px;
	border-bottom:dotted 1px #999999;
}

.cell_T {
background-color:#e8d8c0;
}

.cell_A {
background-color:#ffe2d2;
}

.cell_B {
background-color:#c9d8d6;
}

th {
text-align:left;
padding:2px 5px;}


/* -------------------------------------
　　内外美容
------------------------------------- */

#naigai {
	background:url(../../images/top/naigai_back.jpg) top left no-repeat;
	width:600px;
	height:761px;
	position:relative;
	margin-bottom:50px;
}


#img_01 {position:absolute; top:5px; left:5px;}
#img_02 {position:absolute; top:49px; left:5px;}
#img_03 {position:relative; top:49px; left:348px;}

#box_main {position:absolute; top:125px;}
#box_left {float:left; width:282px; margin-left:12px;}
#box_right {float:left; width:282px; margin-left:8px;}

.m_12 {margin:12px;}
.m_0-12 {margin:0px 12px;}
.m_0-20 {margin:0px 20px;}
.m_15 {margin:15px;}

.onayami {margin:35px 12px 10px 12px;}
.onayami2{margin:20px 12px 10px 12px;}