/* Common */

@charset "shift-jis";
@import "initialize.css";


h2 {
	font-size: 14px;
	line-height: 24px;
}
h3 {
	font-size: 14px;
	line-height: 24px;
}


img.arrow {
	margin-right: 5px;
	padding: 0 0 0px 0;
	vertical-align: middle;
}

hr {
	width: 800px;
	height: 1px;
	margin: 10px 50px 0 50px;
	padding: 0;
}
hr.dotted {
	border: none;
	border-top: #cccccc 1px dotted;
}
hr.border {
	border: none;
	border-top: #cccccc 1px dashed;
}

ul.disc {
	text-align: left;
	margin-left: 18px;
	list-style: url('../img/mark_disc.gif') outside;
}
ul.disc li { margin-bottom: 3px }

ul.disc-pink {
	text-align: left;
	margin-left: 18px;
	list-style: url('../img/mark_disc-pink.gif') outside;
}
ul.disc-pink li { margin-bottom: 3px; }

ul.square-pink {
	text-align: left;
	margin-left: 18px;
	list-style: url('../img/mark_square-pink.gif') outside;
}
ul.square-pink li { margin-bottom: 3px; }

ol.decimal {
	text-align: left;
}
ol.decimal li { margin-bottom: 3px; padding: 0 0; }
ol.decimal .dec1 { padding-left: 22px; background: url('../img/mark_dec_1.gif') no-repeat left top; }
ol.decimal .dec2 { padding-left: 22px; background: url('../img/mark_dec_2.gif') no-repeat left top; }
ol.decimal .dec3 { padding-left: 22px; background: url('../img/mark_dec_3.gif') no-repeat left top; }
ol.decimal .dec4 { padding-left: 22px; background: url('../img/mark_dec_4.gif') no-repeat left top; }

ul.footnote {
	color: #333333;
	text-align: left;
	margin-top: 3px;
	margin-left: 18px;
	list-style: url('../img/mark_notes.gif') outside;
}

dl.footnote {
	color: #333333;
	font-size: 10px;
	text-align: left;
}
dl.footnote dt {
	font-weight: normal;
	margin: 0;
	padding-left: 12px;
	background: url('../img/mark_notes.gif') no-repeat center left;
	_zoom: 1;
}
dl.footnote dd {
	padding-left: 12px;
}



div#container {
	text-align: center;
	/* #header height */
	padding-top: 55px;
}

div#container div.bglayer {
	margin: 0 auto;
}


/**************************************************
	Header area
***************************************************/

div#header {
	position: absolute;
	top: 0px; left: 0px;
	width: 100%; height: 60px;
	text-align: center;
	font-size: 10px;
	background: url("../img/header/bg_header.gif") repeat-x top left;
	z-index: 9999;
}
div#header .inner {
	z-index: 99;
}
		
	/** logo **/
	div#header h1#logo {
		position: absolute;
		top: 0px; left: 0px;
		width: 160px;
		height: 55px;
		z-index: 999;
	}
	div#header h1#logo a {
		position: absolute;
		top: 0px; left: 0px;
	}
	
	/** global-navigation **/
	div#header div#global-navigation {
		position: relative;
		top: 25px; left: 0px;
		height: 30px;
		text-align: center;
		background: url("../img/header/bg_global_navigation.gif") no-repeat top left;
		z-index: 99;
	}
	div#header div#global-navigation ul {
		display: inline-block;
		width: 674px;
		padding-left: 259px;
	}
	div#header div#global-navigation li {
		position: relative;
		display: inline;
		float: left;
		height: 30px;
		overflow: hidden;
	}
	div#header div#global-navigation li a {
		display: block;
		position: absolute;
	}
	
	div#header div#global-navigation li#gnavi-top      { width:  49px; }
	div#header div#global-navigation li#gnavi-products { width: 104px; }
	div#header div#global-navigation li#gnavi-makeup   { width:  70px; }
	div#header div#global-navigation li#gnavi-cm       { width:  70px; }
	div#header div#global-navigation li#gnavi-kirei    { width: 127px; }
	div#header div#global-navigation li#gnavi-niau     { width: 104px; }
	div#header div#global-navigation li#gnavi-system   { width: 105px; }
	
	div#header div#global-navigation li#gnavi-top a      { left:  -93px; top:  0px; }
	div#header div#global-navigation li#gnavi-products a { left: -142px; top:  0px; }
	div#header div#global-navigation li#gnavi-makeup a   { left: -247px; top:  0px; }
	div#header div#global-navigation li#gnavi-cm a       { left: -318px; top:  0px; }
	div#header div#global-navigation li#gnavi-kirei a    { left: -389px; top:  0px; }
	div#header div#global-navigation li#gnavi-niau a     { left: -517px; top:  0px; }
	div#header div#global-navigation li#gnavi-system a   { left: -622px; top:  0px; }
	
	/*--- breadcrumbs ---*/
	div#header ol#breadcrumbs {
		position: absolute;
		top: 0px; right: 22px;
		display: inline;
		float: right;
		height: 25px;
		z-index: 9;
	}
	div#header ol#breadcrumbs li {
		float: left;
		color: #ff41a3;
		font-weight: bold;
		background: url('../img/header/breadcrumbs_arrow.gif') no-repeat center left;
		margin: 0 5px;
		padding: 0 0 0 15px;
		height: 25px;
		line-height: 25px;
	}
	div#header ol#breadcrumbs li a {
		font-weight: normal;
		color: #ffffff;
		text-decoration: none;
		outline: 0;
	}
	div#header ol#breadcrumbs li a:hover {
		color: #ff41a3;
		text-decoration: underline;
	}
	div#header ol#breadcrumbs li.sofina   {
		background: none;
		padding: 0;
	}


/**************************************************
	Footer area
***************************************************/

div#footer {
	font-size: 10px;
	text-align: center;
}
	
	/* number */
	div#number {
		text-align: right;
		padding-top: 8px;
		letter-spacing: 1px;
	}
	
	/* banner */
	div#footer ul#banner {
		width: 900px;
		margin: 10px 0;
	}
	div#footer ul#banner li {
		display: inline;
		float: right;
		width: 300px;
	}
	div#footer ul#banner li img {
		margin-bottom: 6px;
	}
	
	/** navigation **/
	div#footer ul#text-navigation {
		/*display: block;*/
		*display: inline;
		padding: 10px 0;
		margin: 0 auto;
		margin-top: 40px;
	}
	div#footer ul#text-navigation li {
		float: left;
		margin-left: 8px;
		padding-left: 8px;
		background: url('../img/footer/tbnavi_border.gif') no-repeat center left;
	}
	div#footer ul#text-navigation li.top {
		margin-left: 0;
		padding-left: 0;
		background: none;
	}
	div#footer ul#text-navigation li a {
		
	}
	div#footer ul#text-navigation li a:hover {
		color: #fc4389;
		text-decoration: underline;
	}
	

/**************************************************
	Flash area
***************************************************/

div#flashcontent {
	/*background: url("../img/bg_swf.gif") repeat-x 0 0;*/
	margin-bottom: 8px;
	overflow: hidden;
}
div#flashcontent div.bglayer {
	/*background: url("../img/noflash_side.jpg") no-repeat center top;*/
}


/**************************************************
	Html area
***************************************************/

div#htmlcontent {
	color: #000000;
	margin-top: 20px;
	letter-spacing: 1px;
}
div#htmlcontent div.inner {
	text-align: left;
}

/* backto scroll-top button */
div#htmlcontent div.pagetop {
	clear: both;
	position: relative;
	width: 900px;
	height: 74px;
	background: url("../img/bg_pagetop.gif") no-repeat center;
}
div#htmlcontent div.pagetop a {
	position: absolute;
	top: 14px;
	right: 20px;
	margin: 0;
}

div#htmlcontent ol, div#htmlcontent ul {
	margin-bottom: 14px;
	*line-height: 1.6em;
}

div#htmlcontent h3 {
	color: #fc4389;
	font-size: 15px;
	font-weight: bold;
	line-height: 24px;
	margin-bottom: 10px;
}
div#htmlcontent h4 {
	color: #fc4389;
	font-size: 14px;
	font-weight: bold;
	line-height: 22px;
	margin-bottom: 4px;
}

/* anchor */
div#htmlcontent a, div#htmlcontent a:link, div#htmlcontent a:visited, div#htmlcontent a:active {
	color: #fc4389;
	text-decoration: underline;
	background-color: transparent;
	/*outline: 0;*/
}
div#htmlcontent a:hover {
	color: #fc4389;
	text-decoration: underline;
	background-color: #ffdbe7;
}
div#htmlcontent a.anchor {
	color: inherit;
	text-decoration: none;
	background-color: transparent;
}

div#htmlcontent p {
	text-align: left;
	margin-bottom: 14px;
	letter-spacing: 1px;
	line-height: 1.8em; *line-height: 2em;
}

/* 1 column */
div#htmlcontent div.column {
	position: relative;
	width: 880px; /*_width: 900px;*/
	padding: 0 10px;
	background: url("../img/bg_column.gif") no-repeat 0px 0px;
}
	/***** column in column *****/
	div#htmlcontent div.column .column2 {
		position: relative;
		display: inline;
		float: left;
		width: 440px;
		padding: 0 0;
	}
	div#htmlcontent div.column .column2 .column2 {
		position: relative;
		display: inline;
		float: left;
		width: 220px;
		padding: 0 0;
	}
	div#htmlcontent div.column .column3 {
		position: relative;
		display: inline;
		float: left;
		width: 293px;
		padding: 0 0;
	}

/* 2 column */
div#htmlcontent div.column2 {
	position: relative;
	float: left;
	width: 430px; /*_width: 450px;*/
	padding: 0 10px;
	background: url("../img/bg_column.gif") no-repeat 0px 0px;
}
	/***** column in column *****/
	div#htmlcontent div.column2 .column2 {
		display: inline;
		float: left;
		width: 215px;
		padding: 0 0;
	}


.imgLeft {
	float: left;
	margin-right: 14px;
}
.imgCenter {
	display: block;
	margin: 0 auto;
	text-align: center;
}
.imgRight {
	float: right;
	margin-left: 14px;
}


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

.txtCenter { text-align: center; }
.txtLeft   { text-align: left;   }
.txtRight  { text-align: right;  }

.w150 { width: 150px; }
.w190 { width: 190px; }
.w200 { width: 200px; }
.w240 { width: 240px; }
.w250 { width: 250px; }
.w300 { width: 300px; }
.w350 { width: 350px; }
.w400 { width: 400px; }
.w500 { width: 500px; }
.w600 { width: 600px; }

.fs10 { font-size: 10px; line-height: 14px; }

.mt14 { margin-top    : 14px; }
.mr14 { margin-right  : 14px; }
.mb14 { margin-bottom : 14px; }
.ml14 { margin-left   : 14px; }
.mt24 { margin-top    : 24px; }
.mr24 { margin-right  : 24px; }
.mb24 { margin-bottom : 24px; }
.ml24 { margin-left   : 24px; }

.pt14 { padding-top    : 14px; }
.pr14 { padding-right  : 14px; }
.pb14 { padding-bottom : 14px; }
.pl14 { padding-left   : 14px; }
.pt20 { padding-top    : 20px; }
.pr20 { padding-right  : 20px; }
.pb20 { padding-bottom : 20px; }
.pl20 { padding-left   : 20px; }
.pt24 { padding-top    : 24px; }
.pr24 { padding-right  : 24px; }
.pb24 { padding-bottom : 24px; }
.pl24 { padding-left   : 24px; }

.txtPink  { color: #fc4389; }
.txtBlue  { color: #d7e3ff; }
.txtGray  { color: #666666; }
.txtDBlack{ color: #333333; }
.txtBlack { color: #000000; }

.bgPink { background-color: #ffdbe7; }
.bgBlue { background-color: #d7e3ff; }
.bgGray { background-color: #cccccc; }

@media print {
	ol.decimal {
		margin-left: 18px;
		list-style: decimal outside;
	}
	ol.decimal li {
		padding-left: 0px;
		background: none;
	}
}
