@charset "UTF-8";

/* ===================================================================
	CSS for layout
	
	name : layout.css
=================================================================== */

body {
background:#FFFFFF;
line-height:1.6;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align:center;
font-size:75%;
color:#333333;
}

/* header
----------------------------------	*/
#header {
	position: relative;
width:950px;
height: 99px;
margin:0 auto;
padding:10px 0 4px 0;
text-align:left;
}
#header .logo {
	position: absolute;
	width:145px;
}

#header .contact {
	position: absolute;
	right: 0;
}

#header .bt {
	position: absolute;
	right: 0;
	top: 40px;
}

#header .link {
float:right;
width:302px;
padding:22px 0 0 0;
}
#header .link ul {
background:url(../img/bg_header_link.gif) no-repeat right top;
}
#header .link ul li {
float:left;
display:inline;
margin:0 0 0 11px;
padding:0 0 0 13px;
}
#header .link ul li img {
display:block;
}

/* container
----------------------------------	*/
#container {
clear:both;
text-align:center;
}
#container_inner {
width:950px;
margin:0 auto;
text-align:left;
}

/* gnav
----------------------------------	*/
#gnav {
clear:both;
width:950px;
height:74px;
margin: 0 auto 10px auto;
position:relative;
zoom:1;
z-index:99;
}
#gnav ul {
position:relative;
width:950px;
height:74px;
z-index:100;
}
#gnav ul li {
position:absolute;
top:0;
zoom:1;
margin:0;
text-align:left;
z-index:101;
}
* html #gnav.after ul li {
top:86px;
}
*+html #gnav.after ul li {
top:86px;
}
#gnav ul li.brand {
left:0;
}
#gnav ul li.skin_care {
left:272px;
}
#gnav ul li.base_makeup {
left:448px;
}
#gnav ul li.special {
left:601px;
}
#gnav ul li.feature {
left:747px;
}
#gnav ul li.shop {
left:950px;
}
#gnav ul li a {
display:block;
padding:0 0 0 0;
}
#gnav ul li img {
vertical-align:bottom;
}
#gnav ul li ul {
display:none;
position:static;
width:210px;
height:auto;
top: -5px;
padding: 0 0 0 0;
}
#gnav ul li ul li {
position:static;
float:none;
width:208px;
padding:0 0 0 0;
}
#gnav ul li ul li.last {
padding:0;
background:none;
}
#gnav ul li ul li a {
padding:0;
}

/* contents
----------------------------------	*/
#contents {
clear:both;
width:950px;
z-index:10;
}
#contents .topicpath {
clear:both;
width:950px;
padding:14px 0 4px 0;
color:#666666;
font-size:84%;
}
#contents .topicpath p {
padding:0 2px;
}
p.ttl02 {
padding:30px 0 28px 0;
}

/* main
----------------------------------	*/
#main {
float:left;
width:675px;
padding:0 0 39px 0;
}
.noside #main {
clear:both;
float:none;
width:780px;
margin:0 0 0 85px;
padding:29px 0 32px 0;
}
.wide #main {
clear:both;
float:none;
width:840px;
margin:0 0 0 55px;
padding:29px 0 32px 0;
}
.full #main {
clear:both;
float:none;
width:950px;
padding:29px 0 32px 0;
}
#main h1.ttl01 {
margin:0 0 10px 0;
}
#main p.backtop {
text-align:center;
}
#main p.backtop a {
padding:0 0 0 9px;
background:url(../img/icn_arw_pink.gif) no-repeat 0 5px;
}

/* side
----------------------------------	*/
#side {
float:right;
width:255px;
margin:0 0 40px 0;
}

/* -- box -- */
#side .box {
width:255px;
margin:0 0 14px 0;
background:url(../img/bg_side_box_mdl.gif) repeat-y left top;
}
#side .box p.ttl {
height:31px;
}
#side .box .bg_top {
width:255px;
background:url(../img/bg_side_box_top.jpg) no-repeat left top;
}
#side .box .bg_btm {
zoom:1;
padding:0 0 4px 0;
background:url(../img/bg_side_box_btm.gif) no-repeat left bottom;
}

/* -- info -- */
#side .box.info p.date {
margin:0 0 4px 0;
color:#666666;
font-weight:bold;
font-size:108%;
}
#side .box.info p.hello {
margin:0 0 8px 0;
font-weight:bold;
font-size:117%;
}
#side .box.info p.hello span {
margin:0 5px 0 10px;
color:#EE1366;
}
#side .box.info .btn_area {
padding:0 0 3px 0;
}
#side .box.info p.btn {
margin:0 0 5px 0;
text-align:center;
}
#side .box.info .wellcome {
padding:6px 0 0 0;
background:url(../img/line_dotted.gif) repeat-x left top;
}
#side .box.info .wellcome p.att {
padding:10px 0 10px 0;
}
#side .box.info .wellcome p.accent {
font-weight:bold;
color:#EE1366;
}

/* -- banner -- */
#side #calendar {
margin:0 0 15px 0;
}

#side ul.banner{
margin:0 0 10px 0;
}
#side ul.banner li{
padding:0 0 10px 0;
}
#side ul.banner li img{
vertical-align:bottom;
}

/* -- list -- */
#side ul.list {
width:255px;
margin:0 0 15px 0;
padding:0 0 1px 0;
background:url(../img/line_dotted.gif) repeat-x left bottom;
}
#side ul.list li {
zoom:1;
padding:1px 0 0 0;
background:url(../img/line_dotted.gif) repeat-x left top;
}
* html #side ul.list li {
float:left;
clear:both;
}
*+html #side ul.list li {
float:left;
clear:both;
}
#side ul.list li a,
#side ul.list li img {
display:block;
}
#side ul.list li ul {
display:none;
}
#side ul.list li.open ul {
display:block;
}

#side .box ul.list {
margin:0;
padding:3px 0 0 0;
background:none;
overflow:hidden;
}
#side .box ul.list li {
width:233px;
margin:0 11px;
padding:0;
background:none;
background-position:left top;
background-repeat:no-repeat;
}
* html #side .box ul.list li {
float:left;
clear:both;
display:inline;
}
#side .box ul.list li a {
width:233px;
height:31px;
overflow:hidden;
text-indent:-9999px;
}
#side .box ul.list li ul li {
margin:0;
}
#side .box p.cosme {
padding:10px 0 7px 0;
text-align:center;
}

#side .myps p.txt {
margin:0 13px;
padding:8px 0 7px 0;
font-size:84%;
color:#666666;
}
#side .myps p.fig {
float:left;
display:inline;
width:160px;
margin:0 0 8px 13px;
}
#side .myps p.more {
float:right;
display:inline;
width:58px;
margin:0 14px 0 0;
padding:31px 0 8px 0;
color:#666666;
}


#side .sp .bg_btm {
padding:7px 0 7px 0;
}
#side .sp .bg_btm p {
text-align:center;
padding:0 0 5px 0;
}
#side .bg_btm ul.bnr {
padding:10px 0 2px 0;
text-align:center;
}
#side .bg_btm ul.bnr li {
margin:0 0 5px 0;
}
#side .bg_btm ul.bnr li img {
vertical-align:bottom;
}
#side .sp .bg_btm p.theme {
margin:0 0 1px 14px;
padding:4px 0 3px 0;
text-align:left;
}
#side .sp .bg_btm p.lst {
padding:4px 0 6px 0;
}


/* footer2
----------------------------------	*/
#footer2 {
clear:both;
width:950px;
text-align:center;
}
#footer2 p.pagetop {
text-align:right;
margin:-30px 0 0 0;
padding:0 0 18px 0;
}
#footer2 p.pagetop a {
display:block;
}

/* footer
----------------------------------	*/
#footer {
border-top:1px solid #DFDFDF;
border-bottom:1px solid #FFFFFF;
text-align:left;
}
#footer .inner {
border-top:1px solid #FFFFFF;
border-bottom:1px solid #BBBBBB;
margin:0;
padding:15px 0 120px 0;
background:#F4F4F4;
text-align:center;
}
#footer .inner2 {
width:950px;
margin:0 auto;
background:url(../img/bg_footer_inner.gif) repeat-y left top;
text-align:left;
}
#footer ul {
float:left;
width:203px;
padding:0 0 10px 17px;
}
#footer ul.first {
width:202px;
}
#footer ul li {
margin:0 0 2px 0;
padding:0 0 0 10px;
background:url(../img/icn_arw_footer.gif) no-repeat left center;
font-size:84%;
}
#footer ul li a {
}
#footer p.logo {
float:right;
width:102px;
padding:17px 0 0 0;
}

/* fixed-box 固定フッター
----------------------------------	*/
#fixed-box {
    background: none repeat scroll 0 0 #FFFFFF;
    border-top: 3px solid #0b7ba5;
    bottom: 0;
    box-shadow: 0 -1px 5px #888888;
    height: 100px;
    margin: 0;
    padding: 0;
    position: fixed;
    right: 0;
    width: 100%;
    z-index: 2;
}

#fixed-box div.fix {
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    width: 960px;
		overflow:hidden;
}

#fixed-box .contact {
	float:left;
	margin-right:20px;
}

#fixed-box .contact img{
	width:400px;
}
	












/* shiseido_footer
----------------------------------	*/
#shiseido_footer {
background:#FFFFFF;
text-align:center;
}
#shiseido_footer iframe {
width:100%;
overflow:hidden;
height:62px;
padding:0;
text-align:left;
}

/* popup style
----------------------------------	*/
body#popup {
text-align:left;
}
body#popup #header {
width:819px;
height:97px;
margin:0 0 0 0;
padding:0 0 0 0;
background:url(../img/bg_pp_header.jpg) no-repeat 0 0;
}
body#popup #header p.logo {
float:left;
width:106px;
padding:30px 0 0 58px;
}
body#popup #header h1 {
float:right;
width:70px;
padding:63px 61px 0 0;
}
body#popup #main {
width:700px;
padding:34px 61px 0 58px;
text-align:left;
}
body#popup #main p.btn_back {
width:68px;
height:21px;
margin:0 0 14px 0;
background:url(../img/btn_pp_back_on.gif) no-repeat 0 0;
}
body#popup #main p.btn_close {
width:700px;
margin:0 0 20px 0;
background:url(../img/btn_pp_close_on.gif) no-repeat 50% 0;
}
body#popup #main p.btn_back a {
display:block;
width:68px;
height:21px;
}
body#popup #main p.btn_close a {
display:block;
width:68px;
height:21px;
margin:0 auto;
}
body#popup #main p.btn_back a:hover,
body#popup #main p.btn_close a:hover {
background:transparent;
}
body#popup #main p.btn_back a:hover img,
body#popup #main p.btn_close a:hover img {
visibility:hidden;
}
body#popup #footer2 {
width:819px;
padding:0 0 20px 0;
}

.kanto {
	width:655px;
	margin:10px 0 0 0;
	padding:0 0 10px 0;
}

.kanto li {
	list-style-type:none;
}

.kantoAnswer {
	border:1px solid #CCC;
	padding:10px;
	width:643px;
}

.kantoTitle {
	text-decoration:underline;
}

.answerBg {
	background:#f0f0f0;
	padding:5px;
	font-weight:bold;
	text-align:center;
	margin:5px 0 0 0;
}

table{
margin:20px 0px 0px 0px;
border: solid 1px #E9E9E9;
border-collapse: collapse;
}

table td{
padding:10px 5px 10px 10px;
border-bottom: solid 1px #E9E9E9;
border-left: solid 1px #E9E9E9;
}

table th{
width:150px;
padding:10px 5px 10px 10px;
background-color:#f9f9f9;
border-bottom: solid 1px #E9E9E9;
font-weight:normal;
}


.design_tbl {
	font-size:110%;
	line-height:140%;
}

div#planList{
	margin:0 auto;
	width:665px;
	text-align:left;
	overflow:hidden;
}
div#planList div#planListInr{
	margin-left:-16px;
}
div#planList ul li{
	float:left;
	margin-left:16px;
	_display:inline;
}

.aboutBoxBg {
	margin: 10px 0 10px 0;
	background: url(../img/aboutBoxBg.gif) repeat-x;
	width: 633px;
	padding:20px 15px;
	border:1px solid #CCC;
	line-height: 1.7em;
}

.aboutBoxBg h4 {
	padding:0 0 10px 0;
	border-bottom:1px dotted #CCC;
}

.aboutBoxBg ul {
	margin-right:-15px;
	margin-top:20px;
	margin-left:20px;
	_margin-left:15px;
	overflow:hidden;
	_zoom:1;
}

.aboutBoxBg ul li {
	float:left;
	padding-right:15px;
	list-style-type:none;
}

/*----------------------------------------------------
プラン内訳
----------------------------------------------------*/

.itemBox {
	width:665px;
	border:1px solid #CCC;
	margin:10px 0 0 0;
}

.itemTitleBg {
	background:url("../images/plan/itemTitleBg.gif") no-repeat;
	width:80px;
	text-align:center;
}

.itemThumbBg {
	background:url("../images/plan/itemThumbBg.gif") repeat-x;
	border-left:1px solid #CCC;
	padding:16px 0 0 16px;
	*padding:16px 0 16px 16px;
}

.itemInfo li {
	float:left;
	list-style-type:none;
	margin:0 0 16px 0;
	width:180px;
}

.itemInfo p {
	display:table-cell;
	vertical-align:middle;
	padding:0 10px 0 0;
}

* html .itemInfo p {
	display:inline;
	zoom:1;
}

*:first-child+html .itemInfo p {
	display:inline;
	zoom:1;
}

.afterServiceBox {
	width:665px;
	border:1px solid #CCC;
	background:url("../images/plan/sepa.gif") repeat-y;
}

#afterServiceL {
	float:left;
	width:79px;
	margin:0 1px 0 0;
	padding:15px 0 0 0;
}

#afterServiceR {
	float:left;
	width:536px;
	padding:10px 20px;
}

.alignCenter {
	text-align:center;
}

.alignRight {
	text-align:right;
}

.alignLeft {
	text-align:left;
}

.note {
	padding-left:0.5em;
	text-indent:-0.5em;
}

/*----------------------------------------------------
フォント系制御
----------------------------------------------------*/

.bold {
	font-weight:bold;
}

.t9px {
	font-size:9px;
}

.t60 {
	font-size:60%;
}

.t80 {
	font-size:80%;
}

.t120 {
	font-size:120%;
}

.t140 {
	font-size:140%;
}

.t160 {
	font-size:160%;
}

.t180 {
	font-size:180%;
}

.t200 {
	font-size:200%;
}

.t200 {
	font-size:200%;
}

.t250 {
	font-size:250%;
}

.t270 {
	font-size:270%;
}

.t300 {
	font-size:300%;
}

.tBlue {
	color:#0028A2;
}

.tPink {
	color:#f4a9cb;
}

.tRed {
	color:#a40000;
}

.tBlack {
	color:#6A6A6A;
}

.t1_1 {
	line-height:1.1;
}

.t1_3 {
	line-height:1.3;
}

.t1_5 {
	line-height:1.5;
}

.redBoldL {
	line-height:1.3;
	font-weight:bold;
	color:#a40000;
	font-size:140%;
}

.redBoldM {
	line-height:1.3;
	font-weight:bold;
	color:#a40000;
	font-size:120%;
}
.line_btm_dotted {
	border-bottom:1px dotted #ccc;
}

.line_btm_solid {
	border-bottom:1px solid #333;
}
.m0 {
	margin:0!important;
}

.pad5 {
	padding:5px;
}

.pad10 {
	padding:10px;
}

.pad20 {
	padding:20px;
}

.padT5 {
	padding-top:5px;
}

.padL5 {
	padding-left:5px;
}

.padL10 {
	padding-left:10px;
}

.padB30 {
	padding-bottom:30px;
}

.padLR10 {
	padding:0 10px;
}

.padLR20 {
	padding:0 20px;
}

.mTB5 {
	margin:5px 0;
}

.mTB10 {
	margin:10px 0;
}

.mTB20 {
	margin:20px 0;
}

.mTB30 {
	margin:30px 0;
}

.mTB40 {
	margin:40px 0;
}

.mTB50 {
	margin:50px 0;
}

.mB5 {
	margin-bottom:5px;
}

.mB10 {
	margin-bottom:10px;
}

.mB15 {
	margin-bottom:15px;
}

.mB20 {
	margin-bottom:20px;
}

.mB30 {
	margin-bottom:30px;
}

.mB40 {
	margin-bottom:40px;
}

.mB50 {
	margin-bottom:50px;
}

.mT5 {
	margin-top:5px;
}

.mT10 {
	margin-top:10px;
}

.mT15 {
	margin-top:15px;
}

.mT20 {
	margin-top:20px;
}

.mT25 {
	margin-top:25px;
}

.mT30 {
	margin-top:30px;
}

.mT35 {
	margin-top:35px;
}

.mT40 {
	margin-top:40px;
}

.mT50 {
	margin-top:50px;
}

.mL5 {
	margin-left:5px;
}

.mL10 {
	margin-left:10px;
}

.mL15 {
	margin-left:15px;
}

.mL20 {
	margin-left:20px;
}

.mL30 {
	margin-left:30px;
}

.mL40 {
	margin-left:40px;
}

.mL50 {
	margin-left:50px;
}

.mR5 {
	margin-right:5px;
}

.mR10 {
	margin-right:10px;
}

.mR15 {
	margin-right:15px;
}

.mR20 {
	margin-right:20px;
}

.mR30 {
	margin-right:30px;
}

.mR40 {
	margin-right:40px;
}

.mR50 {
	margin-right:50px;
}
.bold {
	font-weight:bold;
}

.t9px {
	font-size:9px;
}

.t60 {
	font-size:60%;
}

.t80 {
	font-size:80%;
}

.t120 {
	font-size:120%;
}

.t140 {
	font-size:140%;
}

.t160 {
	font-size:160%;
}

.t180 {
	font-size:180%;
}

.t200 {
	font-size:200%;
}

.t200 {
	font-size:200%;
}

.t250 {
	font-size:250%;
}

.t270 {
	font-size:270%;
}

.t300 {
	font-size:300%;
}

.tBlue {
	color:#0028A2;
}

.tPink {
	color:#f4a9cb;
}

.tRed {
	color:#a40000;
}

.tBlack {
	color:#6A6A6A;
}

.t1_1 {
	line-height:1.1;
}

.t1_3 {
	line-height:1.3;
}

.t1_5 {
	line-height:1.5;
}

.red{
	color:#a40000;
}

.redBoldL {
	line-height:1.3;
	font-weight:bold;
	color:#a40000;
	font-size:140%;
}

.redBoldM {
	line-height:1.3;
	font-weight:bold;
	color:#a40000;
	font-size:120%;
}

.redBoldMLine {
	font-weight:bold;
	color:#a40000;
	border-bottom:1px solid #a40000;
}

/*---------------
       area
  ---------------*/
.mL25{
    font-size: 18px;
    font-weight: bold;
    margin: 10px 1px 0;
    position: relative;
    top: 13px;
}
  
.section ul li{
	background: none repeat scroll 0 0 #389b91;
    color: #ffffff;
    float: left;
    font-size: 12px;
    margin: 0 3px 3px 0;
    padding: 0 4px;
}

#contents h1 {
	font-size: 160%;
}