/* --------------------
基本設定
-------------------- */
html,body,h1,h2,h3,h4,h5,p,div,ul,ol,li,label {
	margin:0;
	padding:0;
	list-style:none;
	line-height:0;
	}

html {
	overflow-y:scroll;
	}

body {
	margin:0;
	padding:0;
	background-color:#f1d79a;/*最背面*/
	color:#272727;
	text-justify:inter-ideograph;
	text-align:center;
	}

img {border:none;}

table {
	margin:0;
	padding:0;
	border:0;
	border-collapse:collapse;
	}
table tr {
	vertical-align:top;
	}
table td,
table th {
	border-collapse:collapse;
	border-spacing:0;
	empty-cells:show;
	font-weight:normal;
	text-align:justify;
	text-justify:inter-ideograph;
	padding:5px;
	}

a:link,
a:visited {
	color:#855a00;
	text-decoration:underline;
	}
a:hover,
a:active {
	color:#cc9900;
	text-decoration:underline;
	}

/* --------------------
汎用要素
-------------------- */

/* テキスト関係 */
.f10 {/* 10px */
	font-size:62.5%;
	line-height:150%;
	}
.f11 {/* 11px */
	font-size:69%;
	line-height:150%;
	}
.f12 .f10 {/* 12pxの中の10px */
	font-size:83%;
	}
.f12 {/* 12px */
	font-size:75%;
	line-height:160%;
	}
.f14 {/* 14px */
	font-size:87.5%;
	line-height:160%;
	}
.f16 {/* 16px */
	font-size:100%;
	line-height:180%;
	}
.f20 {/* 20px */
	font-size:125%;
	line-height:180%;
	}

.Bold {font-weight:bold;}

.TxtLeft {text-align:left;}
.TxtRight {text-align:right;}
.TxtCenter {text-align:center;}
.TxtJustfy {
	text-align:justify;
	text-justify:inter-ideograph;
	}

/* 注釈 */
.TxtIndent {
	padding-left:1em;
	text-indent:-1em;
	}

/* 色 */
.TxtWhite {color:#ffffff;}
.TxtRed {color:#ff0000;}



.Block {display:block}
.Inline {display:inline}


/* マージン */
.m5 {margin:5px;}
.m10 {margin:10px;}
.m15 {margin:15px;}
.m20 {margin:20px;}
.m25 {margin:25px;}
.m30 {margin:30px;}

.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt25 {margin-top:25px;}
.mt30 {margin-top:30px;}

.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr15 {margin-right:15px;}
.mr20 {margin-right:20px;}
.mr25 {margin-right:25px;}
.mr30 {margin-right:30px;}

.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb15 {margin-bottom:15px;}
.mb20 {margin-bottom:20px;}
.mb25 {margin-bottom:25px;}
.mb30 {margin-bottom:30px;}

.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml15 {margin-left:15px;}
.ml20 {margin-left:20px;}
.ml25 {margin-left:25px;}
.ml30 {margin-left:30px;}


/* パディング */
.p5 {padding:5px;}
.p10 {padding:10px;}
.p15 {padding:15px;}
.p20 {padding:20px;}
.p25 {padding:25px;}
.p30 {padding:30px;}

.pt5 {padding-top:5px;}
.pt10 {padding-top:10px;}
.pt15 {padding-top:15px;}
.pt20 {padding-top:20px;}
.pt25 {padding-top:25px;}
.pt30 {padding-top:30px;}

.pr5 {padding-right:5px;}
.pr10 {padding-right:10px;}
.pr15 {padding-right:15px;}
.pr20 {padding-right:20px;}
.pr25 {padding-right:25px;}
.pr30 {padding-right:30px;}

.pb5 {padding-bottom:5px;}
.pb10 {padding-bottom:10px;}
.pb15 {padding-bottom:15px;}
.pb20 {padding-bottom:20px;}
.pb25 {padding-bottom:25px;}
.pb30 {padding-bottom:30px;}

.pl5 {padding-left:5px;}
.pl10 {padding-left:10px;}
.pl15 {padding-left:15px;}
.pl20 {padding-left:20px;}
.pl25 {padding-left:25px;}
.pl30 {padding-left:30px;}



/* Clear */
.Clear {clear:both;}

.Clearfix:after {
	height:0;
	content: "";
	clear: both;
	display: block;
	visibility: hidden;
	}
* html .Clearfix {
	display:inline-block;
	}
/*\*/
* html .Clearfix {
	height:0;
	display:block;
	}
/**/
*:first-child+html .Clearfix {
	display:inline-block;
	min-height: 1%;
	}

.Overflow {  
    overflow:hidden;
	}
* html .Overflow {  
    height:1%;  
	}


/* --------------------
コンテンツ大枠
-------------------- */
/*BACKGROUND*/
#BackGround {width:100%; background:#ecd192 url(../img/bg_back.jpg) center top repeat-x;}/*メインの背景*/
#BackWhite {width:100%; background:url(../img/bg_white.jpg) center top repeat-y;}/*メインの白下地*/
#BackBeam {width:100%; background:url(../img/bg_beam.jpg) center top no-repeat;}/*メインの光*/
#FootBack {width:100%; background:url(../img/bgfoot_shadow.jpg) center top repeat-x;}/*フッターの影*/
#FootWhite {width:100%; background:url(../img/bgfoot_white.jpg) center top no-repeat;}/*フッターの白下地*/

/*MAIN FRAME*/
#Wrapper {width:1024px; margin:0 auto;}/*ナビ＆メイン包括*/
#Navi {width:284px; min-height:590px; float:left;}/*ナビ*/
#Main{width:740px; float:right;}/*メイン枠*/
#Contents {width:680px; background-color:#ffffff;}/*メイン内容*/
#Footer {width:900px; min-height:100px; margin:0 auto;}/*フッター枠*/

/*FOOTER*/
#TopNews {padding:10px;}
#PP {width:400px; padding:10px; float:left}
#CopyRight {width:400px; padding:10px; float:right; text-align:right;}

#PP a:link,
#PP a:visited {
	color:#444444;
	text-decoration:none;
	}
#PP a:hover,
#PP a:active {
	color:#000000;
	}
#PP a {
	padding-left:8px;
	background:url(../img/foot_icon_arrow.gif) no-repeat scroll left center;
	}

/* --------------------
コンテンツ汎用
-------------------- */

/* Menu背景 */
#Navi {/* Ajax使用時IE6対策 */
	background-repeat:no-repeat;
	background-position:left top;
	background-attachment:scroll;
	}
.Gel {background-image:url(../img/menu_products_gel.jpg)}
.Lotion {background-image:url(../img/menu_products_lotion.jpg)}
.Cream {background-image:url(../img/menu_products_cream.jpg)}
.Uv {background-image:url(../img/menu_products_uv.jpg)}
.Serum {background-image:url(../img/menu_products_serum.jpg)}




.ContentsInner {
	padding:25px 49px 0 49px;
	}

/* 商品紹介 */
#HeadInner {
	padding:42px 49px 30px 49px;
	background:url(../img/title_btm.gif) no-repeat scroll left bottom;
	}
#HeadTitleL {
	float:left;
	width:210px;
	}
#HeadTitleR {
	float:right;
	width:372px;
	}



.ProductsInner {
	padding:25px 49px 24px 49px;
	background:url(../img/line.jpg) no-repeat scroll left bottom;
	}
.ProductsInnerEnd {
	padding:25px 49px 24px 49px;
	}

#AnchorMenu {
	width:552px;
	background:url(../img/index_back.jpg) no-repeat scroll left top;
	padding:15px;
	}
#AnchorMenu a:link,
#AnchorMenu a:visited,
.BackToTop a:link,
.BackToTop a:visited {
	color:#000000;
	text-decoration:underline;
	}
#AnchorMenu a:hover,
#AnchorMenu a:active,
.BackToTop a:hover,
.BackToTop a:active {
	color:#333333;
	text-decoration:underline;
	}

.HowToMovieL {
	width:423px;
	float:left;
	}
.HowToMovieR {
	width:159px;
	float:right;
	}

.OverImg {
	margin:0 -49px 0 -49px;
	}

table.Seibun {
	margin:0;
	padding:0;
	border:0;
	border-collapse:collapse;
	width:100%;
	}
table.Seibun tr {
	vertical-align:top;
	}
table.Seibun td,
table.Seibun th {
	border-collapse:collapse;
	border-spacing:0;
	empty-cells:show;
	font-weight:normal;
	text-align:justify;
	text-justify:inter-ideograph;
	padding:5px;
	border-right:2px solid #ffffff;
	border-bottom:2px solid #ffffff;
	}
table.Seibun th.TableHead {
	font-weight:bold;
	background-color:#f2a29f;
	color:#ffffff;
	text-align:center;
	}
table.Seibun th.TableHead2 {
	background-color:#f4f4f4;
	text-align:center;
	}


/* 商品を見る（拡大Ajax） */
#MoreImg {
	display:none;
	}
.MoreImgBorder {
	display:block;
	margin:0 auto;
	}


/* 成分表示 */
#AnchorSeibun {
	width:87px;
	text-align:left;
	float:left;
	}
#SeibunMoreBtn,
#SeibunCloseBtn {
	width:110px;
	float:left;
	padding-top:2px;
	}

#SeibunCloseBtn,
#SeibunMore {
	display:none;
	}


/* --------------------
コンテンツ個別
-------------------- */

/* gel.html */
.GelGoldL {
	width:177px;
	float:left;
	}
.GelGoldR {
	width:390px;
	float:left;
	padding-left:15px;
	}

.GelRoseL {
	width:150px;
	float:left;
	}
.GelRoseR {
	width:417px;
	float:left;
	padding-left:15px;
	}

.GelOugonL {
	width:150px;
	float:left;
	}
.GelOugonR {
	width:417px;
	float:left;
	padding-left:15px;
	}

/* cream.html */
.CreamCaseL {
	width:422px;
	float:left;
	padding-right:15px;
	}
.CreamCaseR {
	width:145px;
	float:left;
	}

/* lotion.html */
#HeadInner_lotion {
	padding:24px 49px 30px 49px;
	background:url(../img/title_btm.gif) no-repeat scroll left bottom;
	}
	
/* serum.html */
#HeadInner_serum {
	padding:38px 49px 30px 49px;
	background:url(../img/title_btm.gif) no-repeat scroll left bottom;
	}

/* uv.html */
#HowTo {
	width:552px;
	}

/* contact.html */
#DialArea {
	padding:53px 49px 43px 49px;
	background:url(../img/line.jpg) no-repeat scroll left bottom;
	}

.Dial_title {
	margin-bottom:45px;
	}
	
#WebArea {
	padding:0 49px 50px 49px;
	margin-top:30px;
	}	
	
.Web_title {
	margin-bottom:45px;
	}

.ContactUnderLine {
	border-bottom:1px dashed #333333;
	padding:3px 12px;
	}
.ContactUnderLineEnd {
	padding:3px 12px;
	}
#WebArea label {
	padding:5px 10px 0 0;
    float:left;
    display:block;
	}
#WebArea .field {
    width:320px;
    margin:5px 0px;
	}


/* topics.html */
#HeaderTopics {
	padding:20px 0 49px 0;
	}

#Topics {
	padding:34px 49px 37px 49px;
	background:url(../img/line.jpg) no-repeat scroll left bottom;
	}

#HeaderTopics h2 {
	margin-bottom:14px;
	}

#TopicsEnd {
	padding:34px 49px 37px 49px;
	}
	
.ImgArea {
	margin:23px 0 0 0;
	padding:auto;
	width:582px;
	}

.Img1 {
	float:left;
	margin-right:20px
	}
.Img2 {
	float:left;
	margin-right:20px
	}
.Img3 {
	float:left;
	clear:both;
	}

/* concept.html */
#ConceptFlashBox {
	width:583px;
	margin:50px auto;
	}

/* store.html */
#HeaderStore {
	padding:20px 0 49px 0;
	}
	
#StoreMap {
	padding:20px 49px 49px 49px;
	}	
	
.StorePlace {
	padding:23px 49px 33px 49px;
	background:url(../img/line.jpg) no-repeat scroll left bottom;
	}	
	
.StorePlaceEnd {
	padding:23px 49px 0 49px;
	}	
	
.StorePlace h2 {
	margin-bottom:30px;
	}	
	
.StorePlaceEnd h2 {
	margin-bottom:30px;
	}		

#banner{
	width:582px;
	}
	
.bannerImg{
	float:left;
	margin-right:10px;
	}
	
#StorePlace a:link,
a:visited{
	color:#885c00;
	}


/* --------------------
ポップアップ
-------------------- */
body#POPUP {
	background-image:url(../../img/pp_background.jpg);
	background-repeat:repeat-x;
	background-color:#e4d1a9;
	text-align:center;
	}
#POPUP #privacy{
	width:500px;
	padding:30px 40px;
	margin:30px auto;
	text-align:left;
	background-color:#FFFFFF;
	}
#POPUP #form{
	width:600px;
	padding:30px 40px;
	margin:30px auto;
	text-align:left;
	background-color:#FFFFFF;
	}
#POPUP #WebArea {
	padding:10px;
	margin-top:10px;
	}
#POPUP h1{
	margin-bottom:35px;
	}
#POPUP .sign{
	text-align:right;
	margin-top:30px;
	}
#POPUP .close{
	text-align:center;
	margin-top:30px
	}