@charset "utf-8";

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

	ラインナップ

	1. 共通
	2. ハイチオールCプラス
	3. ハイチオールC プルミエール
	4. その他の、シミ・そばかす関連製品
		4.1. ハイチオールC プルミエール 薬用ホワイトスポッツ
		4.2. ハイチオールC プルミエール デイリープロテクトUV

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

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

	1. 共通

--------------------------------------------------------------------*/
#main-bg {
	background: url("/hythiol/lineup/img/bg_main.gif") 50% top no-repeat;
}

#main {
	width:890px;
}

#contents {
	line-height:1.7;
	margin:0 0 10px;
	padding:0 0 30px;
	border:1px solid #d1d1d1;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	background:#fff;
}

#main p.b-pagetop {
	clear:both;
	text-align:right;
}

#main img {
	vertical-align:top;
}

#main a:hover img.over {
	opacity:0.7;
	filter:alpha(opacity=70);
}

#main .btn {
	z-index:100;
}

#main .title h1 {
	float:left;
}
#main .title ul {
	padding:29px 0 0;
}
#main .title li {
	float:left;
}
#main .title li.cplus {
	margin:0 53px 0 0;
}
#main .title li.pre {
	margin:0 59px 0 0;
}
#main .title li.spots {
	margin:0 43px 0 0;
}


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

	2. ハイチオールCプラス

--------------------------------------------------------------------*/
#contsPlus {
	margin:20px 0;
	padding:0 0 17px;
	border-bottom:1px solid #cdcdcd;
}

#contsPlus .contsL {
	position:relative;
	float:left;
	width:338px;
	text-align:center;
}
#contsPlus .contsR {
	position:relative;
	float:left;
	width:550px;
}

#contsPlus .contsR .txt {
	width:482px;
	padding:15px;
	border:1px solid #d1d1d1;
}
#contsPlus .contsR .txt h3 {
	color:#e3081f;
	font-weight:bold;
}
#contsPlus .contsR .txt .link {
	text-align:right;
}
#contsPlus .contsR .txt .link a {
	padding:0 0 0 10px;
	background:url(/hythiol/lineup/img/arrow.gif) 0 50% no-repeat;
}


#contsPlus .contsR .btn {
	position:absolute;
	top:204px;
	left:255px;
}
#contsPlus .contsR .btn li {
	margin:0 0 7px;
}

#contsPlus p.b-pagetop {
	padding:30px 35px 0 0;
}


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

	3. ハイチオールC プルミエール

--------------------------------------------------------------------*/
#contsPremiere {
	margin:0 0 20px;
	padding:0 0 17px;
	border-bottom:1px solid #cdcdcd;
}

#contsPremiere .contsL {
	position:relative;
	float:left;
	width:338px;
	text-align:center;
}
#contsPremiere .contsR {
	position:relative;
	float:left;
	width:550px;
}

#contsPremiere .txt {
	margin:0 0 30px;
}
#contsPremiere .txt img {
	float:right;
	margin:0 59px 0 30px;
}
#contsPremiere .txt p {
	overflow:auto;
	zoom:1;
}

#contsPremiere .step {
	position:relative;
	width:550px;
}
#contsPremiere .step .btn {
	position:absolute;
	top:174px;
	left:7px;
}
#contsPremiere .step .btn li {
	float:left;
	margin:0 30px 0 0;
}
#contsPremiere p.b-pagetop {
	padding:30px 35px 0 0;
}


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

	4. その他の、シミ・そばかす関連製品

--------------------------------------------------------------------*/
#contsOthers {
	margin:0 21px 0;
	font-size:82%;
}
#contsOthers .bg-top {
	padding:3px 0 0;
	background:url(/hythiol/lineup/img/bg_others_top.gif) 0 0 no-repeat;
}
#contsOthers .bg-bottom {
	padding:1px;
	background:url(/hythiol/lineup/img/bg_others_bottom.gif) 0 100% no-repeat;
}

#contsOthers .contsL {
	float:left;
	width:284px;
	padding:7px 11px 10px 10px;
}

#contsOthers .contsR {
	float:left;
	width:112px;
	padding:10px 0;
	text-align:center;
}
#contsOthers p.lead {
	background:url(/hythiol/lineup/img/dotline.gif) 0 0 repeat-x;
	padding:10px 0 8px 0;
	margin-top:10px;
}


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

		4.1. ハイチオールC プルミエール 薬用ホワイトスポッツ

--------------------------------------------------------------------*/
#contsWhite {
	position:relative;
	float:left;
	width:417px;
}


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

		4.2. ハイチオールC プルミエール デイリープロテクトUV

--------------------------------------------------------------------*/
#contsDaily {
	position:relative;
	float:right;
	width:417px;
}