@charset "UTF-8";

/***************************************
*
*	1. common style
* 2. mainImage style
* 3. Contents style
* 4. tryalSet style
* 5. trouble style
* 6. howtoUse style
* 7. reason style
* 8. recommend style
* 9. voice style
* 10. expert style
* 11. comic style
* 12. offertry style
* 13. offermany style
* 14. footer style
*
***************************************/

/* 1. common style */
/* ------------------------------------------------------------------------------------ */

body {
	background-color: #fff;
	text-align: left;
	margin: 0 auto;
}
div#whole {
	background-color: #fff;
	text-align: left;
	margin: 0 auto;
}
div#container {
	background-color: #fff;
	text-align: left;
	margin: 0 auto;
}

a:link,
a:visited,
a:active,
a:hover {
	color: #2c2a27;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}


/* 2. mainImage style */
/* ------------------------------------------------------------------------------------ */
div#mainImage {
	min-width: 1200px;
	width: 1200px;
	height: 631px;
	background: url("../img/main/mainImage.jpg") no-repeat 0 0;
	margin: 0 auto;
	position: relative;
}
div#headSec {
	width: 920px;
	margin: 10px auto 0;
}
div#headSec h1 {
	float: right;
	display: inline;
}
div#headSec p {
	float: left;
	display: inline;
}
div#mainCatch {
	position: absolute;
	top: 53px;
	left: 140px;
	font-family: "Hiragino Mincho Pro","ヒラギノ明朝","ＭＳ 明朝",serif;
}
div#mainCatch p#mc01{
	font-weight: bold;
	font-size: 538%;
	color: #d91616;
	display: inline;
}
div#mainCatch p#mc02,
div#mainCatch p#mc04 {
	font-weight: normal;
	font-size: 230%;
	color: #2b2186;
	display: inline;
}
div#mainCatch p#mc03{
	font-weight: bold;
	font-size: 446%;
	color: #dc0862;
	display: inline;
}
div#mainCatch p#mc05{
	font-weight: bold;
	font-size: 600%;
	color: #2b2186;
	text-decoration: underline;
	margin-top: -5px;
	/margin-top: -13px;
}
div#mainCatch p#mc06{
	font-weight: normal;
	font-size: 430%;
	color: #2b2186;
}
div#subCatch {
	width: 460px;
	height: 76px;
	background: url("../img/main/bg_subTitle.png") no-repeat 0 0;
	padding: 24px 0 0 51px;
	/padding: 26px 0 0 60px;
	position: absolute;
	top: 302px;
	left: 106px;
}
div#subCatch h2{
	font: normal bold 153.9%/100% "Hiragino Mincho Pro","ヒラギノ明朝","ＭＳ 明朝",serif;
	/font: normal bold 138%/100% "Hiragino Mincho Pro","ヒラギノ明朝","ＭＳ 明朝",serif;
	color: white;
}
div#mondeSelection {
	position: absolute;
	top: 400px;
	left: 129px;
}


/* 3. Contents style */
/* ------------------------------------------------------------------------------------ */
div#contentsWrapper {
	width: 944px;
	margin: 0 auto;
}
div#contentsInner {
	background: url("../img/common/contentsBg.png") repeat-y 0 0;
}


/* 4. tryalSet style */
/* ------------------------------------------------------------------------------------ */
div#tsWrapper {
	background: url("../img/common/contentsTop.png") no-repeat 0 0;
	padding: 0 37px 40px;
}
div#tryalSet {
	width: 870px;
	margin-top: -20px;
	position: relative;
}
div#tryalSet h3,
div#tryalSet h4,
div#tryalSet h5,
div#tryalSet p {
	text-indent: -9999px;
	overflow: hidden;
}
h3.tsTl {
	width: 870px;
	height: 97px;
	background: url("../img/tryalSet/tsTl.png") no-repeat 0 0;
}
h4.tsTl02 {
	width: 870px;
	height: 93px;
	background: url("../img/tryalSet/tsTl02.jpg") no-repeat 0 0;
}
h5.tryalSetTl {
	width: 870px;
	height: 82px;
	background: url("../img/tryalSet/tryalSetTl.jpg") no-repeat 0 0;
}
p.setIncludes {
	width: 870px;
	height: 82px;
	background: url("../img/tryalSet/setIncludes.jpg") no-repeat 0 0;
}
p#price {
	width: 870px;
	height: 255px;
	background: url("../img/tryalSet/price.jpg") no-repeat 0 0;
}
div#tryalSet p#notes {
	width: 870px;
	height: 160px;
	background: url("../img/tryalSet/notes.jpg") no-repeat 0 0;
}
p#tsBtn a {
	display: block;
	width: 406px;
	height: 88px;
	text-indent: -9999px;
	position: absolute;
 bottom: 160px;
	right: 31px;
	background: url("../img/tryalSet/tsBtn.png") repeat-x 0 0;
}
p#tsBtn a:hover{
	background-position: 0 -88px;
}
p#moreBtn a {
 display: block;
	width: 808px;
	height: 98px;
	text-indent: -9999px;
	position: absolute;
 bottom: 30px;
	right: 31px;
	background: url("../img/tryalSet/tsMoreBtn.png") repeat-x 0 0;
}
p#moreBtn a:hover{
	background-position: 0 -98px;
}


/* 5. trouble style */
/* ------------------------------------------------------------------------------------ */
div#trouble {
	margin-bottom: 20px;
}
div#trouble h3,
div#trouble p {
	margin: 0 39px 0 38px;
}
div#trouble h4 {
	margin: 0 12px;
}


/* 6. howtoUse style */
/* ------------------------------------------------------------------------------------ */
div#howtoUse {
	margin-bottom: 20px;
	margin: 0 33px;
	position:relative
}
div#howtoUse p {
	font-size: 108%;
	line-height: 182%;
	margin: 0 38px 0 33px;
}
div#howtoUse span{
	color:red;
	font-weight:bold;
} 
div#howtoUse div.htubox01 p{
	font-size: 116%;
	line-height: 167%;
}
 div#howtoUse div.htubox01 {
	width: 878px;
	height: 374px;	
	background: url("../img/howtoUse/howtouse.jpg");
	background-repeat: no-repeat;
	position: relative;
}
div#howtoUse div.htubox01 h3,
div#howtoUse h4,
div#howtoUse h5 {
	text-indent: -9999px;
	overflow: hidden;
}
div#howtoUse div.htubox01 p {
	position: absolute;
	top: 241px;
	left: 16px;
	height: 118px;
	width: 550px;
}
div#howtoUse div.htubox02 {
	position: relative;
	width: 878px;
	height: 334px;
	background: url("../img/howtoUse/htuExample_01.jpg");
	background-repeat: no-repeat;
}
div#howtoUse div.htubox02 p.water{
	position: absolute;
	top: 245px;
	left: 15px;
	height: 61px;
	width: 220px;
}
div#howtoUse div.htubox02 p.vegitable{
	position: absolute;
	top: 245px;
	left: 260px;
	height: 65px;
	width: 220px;
}
div#howtoUse div.htubox03 {
	position: relative;
	width: 878px;
	height: 295px;
	background: url("../img/howtoUse/htuExample_02.jpg");
	background-repeat: no-repeat;
}
div#howtoUse div.htubox03 p.taste{
	position: absolute;
	top: 195px;
	left: 15px;
	height: 65px;
	width: 220px;
}
div#howtoUse div.htubox03 p.alcohal{
	position: absolute;
	top: 195px;
	left: 260px;
	height: 65px;
	width: 220px;
}
div#howtoUse div.htubox04 {
 position: relative;
	width: 878px;
	height: 657px;
	background: url("../img/howtoUse/htuSolution.jpg");
	background-repeat: no-repeat;
}
p#htuBtn a {
 display: block;
	width: 314px;
	height: 77px;
	text-indent: -9999px;
	position: absolute;
	bottom: 20px;
	right: 34px;
	background: url("../img/howtoUse/htuBtn.png") repeat-x 0 0;
}
p#htuBtn a:hover{
	background-position: 0 -77px;
}


/* 7. reason style */
/* ------------------------------------------------------------------------------------ */

div#reason {
	height: 2580px;
	margin-bottom: 20px;
	margin: 20px 12px;
	position: relative;
}
div#reason span{
	color:red;
	font-weight:bold;
} 
div#reason p {
	font-size: 116%;
	line-height: 167%;
}
div#reason div.rsnBox01 {
 position: relative;
	width: 920px;
	height: 353px;
	background: url("../img/reason/rsnPoint_01.jpg");
	background-repeat: no-repeat;
}
div#reason div.rsnBox01 p {
	position: absolute;
 padding: 0px 50px;
	top: 118px;
	left: 418px;
	height: 242px;
	width: 400px;
}
div#reason div.rsnBox02 {
 position: relative;
	width: 920px;
	height: 283px;
	background: url("../img/reason/rsnPoint_02.jpg");
	background-repeat: no-repeat;
}
div#reason div.rsnBox02 p {
	position: absolute;
 padding: 0px 50px;
	top: 102px;
	left: 438px;
	height: 242px;
	width: 370px;
}
div#reason div.rsnBox03 {
 position: relative;
	width: 920px;
	height: 374px;
	background: url("../img/reason/rsnPoint_03.jpg");
	background-repeat: no-repeat;	
}
div#reason div.rsnBox03 p {
	position: absolute;
 padding: 0px 50px;
	top: 135px;
	left: 40px;
	height: 242px;
	width: 360px;
}
div#reason div.rsnBox04 {
 position: relative;
	width: 920px;
	height: 298px;
	background: url("../img/reason/rsnPoint_04.jpg");
	background-repeat: no-repeat;
}
div#reason div.rsnBox04 p {
	position: absolute;
 padding: 0px 50px;
	top: 90px;
	left: 95px;
	height: 242px;
	width: 450px;
}
div#reason div.rsnBox05 {
 position: relative;
	float: left;
	width: 454px;
	height: 389px;
	background: url("../img/reason/rsnPoint_05.jpg");
	background-repeat: no-repeat;
}
div#reason div.rsnBox05 p {
	position: absolute;
 padding: 0px 50px;
	top: 300px;
	left: 28px;
	height: 242px;
	width: 340px;
}
div#reason div.rsnBox06 {
 position: relative;
	float: right;
	width: 466px;
	height: 389px;
	background: url("../img/reason/rsnPoint_06.jpg");
	background-repeat: no-repeat;
}
div#reason div.rsnBox06 p {
	position: absolute;
 padding: 0px 25px;
	top: 300px;
	left: 18px;
	height: 242px;
	width: 370px;
}
p#rsnBtn a {
 display: block;
	width: 314px;
	height: 77px;
	text-indent: -9999px;
	position: absolute;
	bottom: -5px;
	right: 60px;
	background: url("../img/reason/rsnBtn.png") repeat-x 0 0;
	background-repeat: no-repeat;
}
p#rsnBtn a:hover{
	background-position: 0 -77px;
}


/* 8. recommend style */
/* ------------------------------------------------------------------------------------ */

div#recommend {
	height: 830px;
	margin-bottom: 20px;
	margin: 0 12px;
	position: relative;
}
div#recommend span{
	color:red;
	font-weight:bold;
}
div#recommend h4 {
	text-indent: -9999px;
	overflow: hidden;
}
div#recommend p {
	font-size: 116%;
	line-height: 161%;
}
div#recommend div.rcmBox01 {
	position: relative;
 float: left;
	width: 322px;
	height: 475px;
	background: url("../img/recommend/recBox_01.jpg") ;
	background-repeat: no-repeat;
}
div#recommend div.rcmBox01 p {
	position: absolute;
	top: 208px;
	right: 45px;
	height: 242px;
	width: 222px;
}
div#recommend div.rcmBox02 {
	position: relative;
 float: left;
	width: 292px;
	height: 475px;
	background: url("../img/recommend/recBox_02.jpg") ;
	background-repeat: no-repeat;
}
div#recommend div.rcmBox02 p {
	position: absolute;
	top: 212px;
	right: 46px;
	height: 242px;
	width: 222px;
}
div#recommend div.rcmBox03 {
	position: relative;
 float: left;
	width: 306px;
	height: 475px;
	background: url("../img/recommend/recBox_03.jpg") ;
	background-repeat: no-repeat;
}
div#recommend div.rcmBox03 p {
	position: absolute;
	top: 212px;
	right: 58px;
	height: 242px;
	width: 212px;
}
p#rcmBtn a {
 display: block;
	width: 314px;
	height: 77px;
	text-indent: -9999px;
	position: absolute;
	bottom: 10px;
	right: 28px;
	background: url("../img/recommend/rcmBtn.png") repeat-x 0 0;
}
p#rcmBtn a:hover{
	background-position: 0 -77px;
}


/* 9. voice style */
/* ------------------------------------------------------------------------------------ */

div#voice {
	height: 1400px;
	margin-bottom: 20px;
	margin: 0 12px;
}
div#voice p {
 text-indent: -9999px;
	overflow: hidden;	
}
div#voice div.voiceBox01 {
 background: url("../img/voice/voicebox_01.jpg");
	background-repeat: no-repeat;
	width: 460px;
	height: 529px;
	float: left;
}
div#voice div.voiceBox02 {
 background: url("../img/voice/voicebox_02.jpg");
	background-repeat: no-repeat;
	width: 460px;
	height: 529px;
	float: right;
}
div#voice div.voiceBox03 {
 background: url("../img/voice/voicebox_03.jpg");
	background-repeat: no-repeat;
	width: 460px;
	height: 584px;
	float: left;
}
div#voice div.voiceBox04 {
 background: url("../img/voice/voicebox_04.jpg");
	background-repeat: no-repeat;
	width: 460px;
	height: 584px;
	float: right;
}


/* 10. expert style */
/* ------------------------------------------------------------------------------------ */

div#expert {
	margin-bottom: 20px;
	margin: 0 12px;
	position: relative;
}
div#expert span.job {
	font-weight: bold;
}
div#expert span.link {
 font-size: 85%;
}
div#expert div.profileBox p{
 font-size: 100%;
	line-height: 138.5%;
}
div#expert div.expBox p{
	text-indent: -9999px;
	overflow: hidden;
}
div#expert div.expBox {
	background: url("../img/expert/exp_comment.jpg") no-repeat 0 0;
 padding: 0px 15px;
	height: 578px;
	width: 920px;
}
div#expert div.profileBox {
 position: absolute;
	top: 485px;
	right: 35px;
	height: 200px;
	width: 300px;
}


/* 11. comic style */
/* ------------------------------------------------------------------------------------ */

div#comic {
	position: relative;
	margin-bottom: 20px;
	height: 950px;
	margin: 0 12px;
}
div#comic p {
	text-indent: -9999px;
	overflow: hidden;
}
p#comicBtn a {
	display: block;
	width: 423px;
	height: 68px;
	text-indent: -9999px;
	position: absolute;
	bottom: -68px;
	top: 230px;
	right: 65px;
	background: url("../img/comic/comicBtn.png") repeat-x 0 0;
}
p#comicBtn a:hover{
	background-position: 0 -68px;
}


/* 12. offertry style */
/* ------------------------------------------------------------------------------------ */

div#offertry {
	width: 870px;
	margin-top: -20px;
	margin: 0 36px;
	position: relative;
}
div#offertry h3,
div#offertry h4,
div#offertry h5,
div#offertry p {
	text-indent: -9999px;
	overflow: hidden;
}
h3.offerTs {
	width: 871px;
	height: 96px;
	background: url("../img/offer/offerTs.jpg") no-repeat 0 0;
}
h4.offerTs02 {
	width: 871px;
	height: 84px;
	background: url("../img/offer/offerTs02.jpg") no-repeat 0 0;
}
h5.offerTsTl {
	width: 871px;
	height: 87px;
	background: url("../img/offer/offerTsTl.jpg") no-repeat 0 0;
}
p.offerTsIncludes {
	width: 871px;
	height: 78px;
	background: url("../img/offer/setIncludes.jpg") no-repeat 0 0;
}
p#offertsprice {
	width: 871px;
	height: 289px;
	background: url("../img/offer/price.jpg") no-repeat 0 0;
}
div#offertry p#offertsnotes {
	width: 871px;
	height: 30px;
	background: url("../img/offer/notes.jpg") no-repeat 0 0;
}
p#offertsBtn a {
	display: block;
	width: 406px;
	height: 88px;
	text-indent: -9999px;
	position: absolute;
	bottom: 55px;
	right: 31px;
	background: url("../img/tryalSet/tsBtn.png") repeat-x 0 0;
}
p#offertsBtn a:hover{
	background-position: 0 -88px;
}


/* 13. offermany style */
/* ------------------------------------------------------------------------------------ */

div#offermany {
	background: url("../img/offer/bg_offermany.jpg") no-repeat 0 0;
	width: 871px;
	height: 557px;
	margin: 0 36px;
	position: relative;
}
div#offermany h4 {
	position: absolute;
	width: 623;
	height: 54px;
	top: 40px;
	left: 30px;
}
div#offermany p {
	text-indent: -9999px;
	overflow: hidden;
}
div#offermany div.manyBox01 {
	background: url("../img/offer/manyitem_01.jpg") no-repeat 0 0;
	width: 291px;
	height: 285px;
 position: absolute;
	top: 122px;
	left: 0;
}
div#offermany div.manyBox02 {
	background: url("../img/offer/manyitem_02.jpg") no-repeat 0 0;
	width: 290px;
	height: 285px;
 position: absolute;
	top: 122px;
	right: 291px;
}
div#offermany div.manyBox03 {
	background: url("../img/offer/manyitem_03.jpg") no-repeat 0 0;
	width: 290px;
	height: 285px;
 position: absolute;
	top: 122px;
	left: 581px;
}
p#mnyBtn a {
	display: block;
 width: 790px;
	height: 88px;
	text-indent: -9999px;
	position: absolute;
	bottom: 55px;
	right: 42px;
	background:  url("../img/offer/mnybtn.png") repeat-x 0 0;
}
p#mnyBtn a:hover{
	background-position: 0 -88px;
}


/* 14. footer style */
/* ------------------------------------------------------------------------------------ */
div#footSec {
	width: 100%;
	background: url("../img/common/ftBg.png") repeat-x 0 0;
	color: #ffffff;
	height: 167px;
}
div#footInner {
	width: 920px;
	margin: 0 auto; 
	position: relative;
}
div#footInner p.pageTop {
	position: absolute;
	top: -29px;
	right: 30px;
	color: #2c2a27;
}
div#ftLeft {
	padding: 43px 0 0 7px;
}
div#ftLeft p#logoName {
	float: left;
	margin-right: 11px;
}
div#ftInfo {
	float: left;
}
div#ftInfo p#ftName {
	font-size: 153.9%;
	font-weight: bold;
	margin-bottom: 5px;
}
div#ftInfo p#ftAdress,
div#ftInfo p#ftNumber {
	font-size: 93%;
	margin-bottom: 3px;
}
div#ftRight {
	float: right;
	margin-right: 10px;
	width: 280px;
	font-size: 93%;
	text-align: right;
}
div#ftRight ul {
	margin-bottom: 8px;
}
div#ftRight ul li {
	float: right;
	margin-right: 7px;
	display: inline;
}
div#ftRight ul li a {
	color: #ffffff;
}
div#ftRight ul li a:hover {
	text-decoration: none;
}