@charset "euc-jp";

/* ---------------------------------------------------------------------
CSS

 File name:      base.css
 Create:         2009-02-06
 Update:         2010-03-10
 Style Info:     美肌ガイドCSSファイル
--------------------------------------------------------------------- */

/* clearfix
--------------------------------------------------------------------- */
.clearfix {display: inline-block;}

/* Mac-IE,Dreamweaverでは適用しない */
* html body .clearfix {height:1px;}
.clearfix {display:block;}

.clearfix:after {
 content: ".";
 display: block;
 height: 0px;
 clear: both;
 visibility: hidden;
}
.clearer {
 clear:both;
 display:block;
 font-size:0px;
 height:1px;
 line-height:0em;
 margin:0pt;
 padding:0pt;
}

/* guide base
--------------------------------------------------------------------- */
dl, dt, dd {
 margin: 0;
 padding: 0;
}
#guide {
 margin: 4px 4px 0;
}
#guide .guide-left,
#guide .guide-right {
 float: left;
}
#guide #guide-inner {
 margin-top: 20px;
 padding: 27px 101px 0 101px;
 font-size: 100%;
}
#guide .guide-inner-cream {
 background: url(../../img/bg_top.gif) left top no-repeat;
}
#guide .guide-inner-mask {
 background: url(../../img/mask_bg_top.gif) left top no-repeat;
}
#guide .guide-inner-lineup {
 background: url(../../img/lineup_bg_top.gif) left top no-repeat;
}
#guide .guide-inner-trouble {
 background: url(../../img/trouble_bg_top.gif) left top no-repeat;
}
#guide .guide-inner-carestep {
 background: url(../../img/carestep_bg_top.gif) left top no-repeat;
}
#guide .guide-inner-aging {
 background: url(../../img/aging_bg_top.gif) left top no-repeat;
}
#guide .wrap {
 width: 520px;
}
#guide .btn-to-store {
 margin-top: 10px;
}
#guide .bottom {
 font-size: 1px;
 line-height: 1px;
}
#guide p.cf {
 padding-top: 5px;
 font-size:77%;
}

/* section
--------------------------------------------------------------------- */
#guide #section01 {
}
#guide #section01 .guide-left {
 width: 260px;
 padding-top: 15px;
}
#guide .cream01 .guide-left {
 background: url(../../img/cream_bg_cream_01.gif) left top no-repeat;
}
#guide #section01 .wrap {
 padding-top: 25px;
}
#guide #section01 .guide-left p {
 padding: 0 15px;
}
#guide #section01 .guide-right {
 width: 260px;
}
#guide #section01 .btn-to-store {
 margin-left: 30px;
}

#guide #section02,
#guide #section03 {
 margin-top: 40px;
}
#guide #section02 h4 {
 padding-top: 15px;
}
#guide #section02 p {
 padding-top: 5px;
}

#guide #section03 .middle {
 width: 520px;
}
#guide .cream03 .middle {
 background: url(../../img/cream_bg_point.gif) left top no-repeat;
}
#guide .mask03 .middle {
 background: url(../../img/mask_bg_point.gif) left top no-repeat;
}
#guide #section03 .middle p {
 padding: 15px 15px 9px;
}
#guide #section03 .bottom {
 width: 520px;
 height: 8px;
 background: url(../../img/cream_bg_point_bottom.gif) left top no-repeat;
}

#guide #section04 {
 margin-top: 25px;
}
#guide #section04 .middle {
 width: 520px;
 padding-top: 15px;
}
#guide .cream04 .middle {
 background: url(../../img/cream_bg_cream02.gif) left top no-repeat;
}
#guide .mask04 .middle {
 background: url(../../img/mask_bg_mask_02.gif) left top no-repeat;
}
#guide #section04 .guide-left {
 width: 266px;
}
#guide #section04 .guide-right {
 width: 254px;
}
#guide #section04 .guide-right p {
 padding: 10px 15px 0;
}
#guide #section04 .guide-right .btn-to-store {
 padding-bottom: 10px;
}
#guide #section04 .bottom {
 width: 520px;
 line-height: 1px;
 font-size: 0;
}
#guide .cream04 .bottom {
 background: url(../../img/cream_bg_cream02_bottom.gif) left top no-repeat;
 height: 3px;
}
#guide .mask04 .bottom {
 background: url(../../img/mask_bg_mask_02_bottom.gif) left top no-repeat;
 height: 4px;
}

/* lineup
--------------------------------------------------------------------- */
#guide .lineup01 .guide-left {
 width: 260px;
}
#guide .lineup01 .guide-right {
 width: 260px;
 padding-top: 15px;
}
#guide .lineup01 .guide-right p {
 padding: 0 15px;
}

#guide .lineup02 p.textarea {
 padding-top: 15px;
}
#guide .lineup02 h3.textarea {
 padding-top: 25px;
}
#guide .lineup02 .img-left {
 float: left;
 margin: 25px 15px 10px 0;
}
#guide .lineup02 .img-right {
 float: right;
 margin: 25px 0 0 15px;
}

#guide .series-area .series-middle {
 width: 520px;
 background: url(../../img/bg_series.gif) left top no-repeat;
}
#guide .series-area .bottom {
 height: 2px;
 background: url(../../img/bg_series_bottom.gif) left top no-repeat;
} 

/* carestep
--------------------------------------------------------------------- */
#guide .carestep01 h3 {
 padding-bottom: 15px;
}
#guide .carestep02 .wrap {
 padding-bottom: 5px;
}
#guide .carestep01 h4{
 padding-top: 15px;
}
#guide .carestep02 h4 {
 padding: 15px 0 10px;
}
#guide .carestep02 .guide-left {
 width: 255px;
 margin-right: 15px;
}
#guide .carestep02 .howto {
 margin-bottom: 10px;
 padding: 10px;
 background-color: #F4FAFD;
}
#guide .carestep02 .guide-right {
 width: 250px;
}
#guide .carestep02 .btn-to-store-s {
 margin: 3px 0 0 60px;
}
#guide .carestep02 .howto-cream {
 width: 520px;
 margin-top: 10px;
 padding-top: 15px;
 background: url(../../img/carestep_bg_cream.gif) left top no-repeat;
}
#guide .carestep02 .howto-cream .bottom {
 width: 520px;
 height: 15px;
 background: url(../../img/carestep_bg_cream_bottom.gif) left top no-repeat;
}
#guide .carestep02 .howto-cream-wrap {
 padding: 15px 15px 0;
}
#guide .carestep02 .howto-cream .left {
 float: left;
 width: 245px;
 margin-right: 15px;
}
#guide .carestep02 .howto-cream .left dl {
 padding: 10px;
 background-color: #FFF9F5;
}
#guide .carestep02 .howto-cream .right {
 float: left;
 width: 230px;
}
#guide .carestep02 h5.howto-cream-title {
 margin: 0 auto;
 text-align: center;
}

/* trouble
--------------------------------------------------------------------- */
#guide .trouble01 .wrap {
 margin-top: 15px;
}
#guide .trouble01 .guide-left {
 width: 70px;
}
#guide .trouble01 .guide-right {
 width: 450px;
}
#guide .trouble01 .guide-right p {
 padding-left: 15px;
}
#guide .trouble01 .guide-right p.name {
 color: #195927;
}
#guide .trouble-step table.guide-step {
 margin-top: 20px;
 width: 520px;
}
#guide .guide-step h4 {
 padding-bottom: 10px;
}
#guide .trouble-step td.space {
 width: 12px;
}
#guide .trouble-step h5 {
 padding-bottom: 5px;
}
#guide .trouble-step h6 {
 padding: 10px 0 5px;
}
#guide .trouble-step .trouble-step-lift {
 padding: 0 15px;
 background: url(../../img/trouble_bg_lift.gif) repeat-y;
}
#guide .trouble-step .trouble-step-bright {
 padding: 0 15px;
 background: url(../../img/trouble_bg_bright.gif) repeat-y;
}
#guide .trouble-step .trouble-step-arrow {
 text-align: center;
 margin: 10px auto 0;
}
#guide .trouble-step .trouble-step-wrap {
 width: 224px;
 padding-top: 10px;
}
#guide .trouble-step .trouble-step-left {
 float: left;
 width: 131px;
 margin-right: 5px;
}
#guide .trouble-step .trouble-step-right {
 float: left;
 width: 88px;
}
#guide .trouble-step dl.trouble-step-s {
 width: 88px;
}
#guide .trouble-step dl.trouble-step-s dt {
 float: left;
 width: 10px;
 margin-right: 3px;
 line-height: 1.1;
}
#guide .trouble-step dl.trouble-step-s dd {
 float: left;
 width: 75px;
 font-size: 85%;
 line-height: 1.4;
}
#guide .trouble-step .trouble-step-arrow-s {
 text-align: center;
 margin: 5px auto;
}
#guide .trouble-step .lift-bottom {
 height: 10px;
 background: url(../../img/trouble_bg_lift_bottom.gif) left top no-repeat;
 font-size: 1px;
 line-height: 1px;
}
#guide .trouble-step .bright-bottom {
 height: 10px;
 background: url(../../img/trouble_bg_bright_bottom.gif) left top no-repeat;
 font-size: 1px;
 line-height: 1px;
}

/* aging
--------------------------------------------------------------------- */
#guide .aging01 h3 {
 padding-bottom: 36px;
}
.aging01 .aging-lead {
 padding: 10px 15px 15px;
}
.aging01 .uvchart {
 text-align: center;
}

.aging02 {
}
.aging02 .secret-wrap {
 width: 520px;
 margin-top: 10px;
}


/* uv
--------------------------------------------------------------------- */
.guide-inner-uv {
 background: url(../../img/uv_bg_top.gif) no-repeat left top;
}

#guide .uv01 h3 {
 padding-bottom: 25px;
}
#guide .uv01-left {
 float: left;
 width: 280px;
}
#guide .uv01-right {
 float: right;
 width: 200px;
}
#guide .uv01-right p.liner {
 font-size: 93%;
 padding-bottom: 5px;
}
#guide .uv01-right p.uv-bt {
 text-align: center;
 padding-top: 5px;
}

#guide .uv02 h3 {
 padding-bottom: 20px;
}
#guide .uv-point {
 width: 526px;
 padding-bottom: 15px;
}
#guide .uv-point h4 {
 padding-bottom: 3px;
}
#guide .uv-point-left {
 float: left;
 width: 245px;
 font-size: 93%;
}
#guide .uv-point-right {
 float: right;
 width: 245px;
 font-size: 93%;
}

#guide .uv03-wrap {
 width: 526px;
 background: url(../../img/uv_bg_02_top.jpg) no-repeat left top;
}
#guide .uv03 {
 width: 487px;
 padding: 25px 19px 5px 20px;
 background: url(../../img/uv_bg_02_bottom.jpg) no-repeat left bottom;
}
#guide .uv03-left {
 float: left;
 width: 260px;
}
#guide .uv03-left p {
 padding-bottom: 10px;
}
#guide .uv03-right {
 float: right;
 width: 205px;
}



/* 右側バックナンバー
--------------------------------------------------------------------- */
#right01 #backnumber-title {
 padding: 8px 0 0 5px;
}
#right01 ul#backnumber {
 padding: 5px 11px 0;
 width: 184px;
 background: none;
}
#right01 ul#backnumber li {
 margin-top: 2px;
}