@charset "shift_jis";

@import "base.css";
@import "common.css";


/*####################　画像　####################*/
img.right {float:right}


/*####################　SUB　####################*/
#PageIndex #Sub { border:none; width:180px;}

#PageIndex #Sub .topics{
	width:170px;
	border:#f2f0eb solid 5px;
	margin-bottom:15px;}

#PageIndex #Sub .topics dl { margin:15px;}
#PageIndex #Sub .topics dl dt {
	margin-bottom:5px;
	padding-left:10px;
	background:url(../img/contents/arrow-01.gif) 0 2px no-repeat;}
#PageIndex #Sub .topics dl dt a {
	font-size:12px;
	color:#dd3876;}
#PageIndex #Sub .topics dl dd { text-align:center;}

/*####################　おやみだし　####################*/

#MainMessage {
	display:block;
	background:url(../../img/main-image.jpg) 0 0 no-repeat;
	width:920px;
	height:550px;}


#MainMessage h2,
#MainMessage span{
	display:block;
	position:relative;
	width:300px;
	text-align:center;
	color:#ff3300;
	top:335px;
	left:32px;
}

#MainMessage h2{
	font-size:16px;
	}
#MainMessage span{
	font-size:12px;
	}


#MainMessage h3{ 
	position:relative;
	font-size:12px;
	width:280px;
	color:#ff0099;
	top:249px;
	left:53px;}

#MainMessage p.stretch,
#MainMessage p.keana,
#MainMessage p.kogao {
	position:relative;
	color:#ff0099;
	width:100px;
	}

#MainMessage p.stretch{top:-45px;left:592px;text-indent:-9999px;}
#MainMessage p.keana{top:43px;left:625px;text-indent:-9999px;}
#MainMessage p.kogao{top:211px;left:615px;text-indent:-9999px;}


#MainMessage #TopImageLink01,
#MainMessage #TopImageLink02,
#MainMessage #TopImageLink04 {
	position:relative;
	float:left;
	top:279px;
	-border:1px solid;
	text-indent:-9999px;
	overflow:hidden;}

#MainMessage #TopImageLink03{
	position:relative;
	float:left;
	top:289px;
	-border:1px solid;
}


	#MainMessage #TopImageLink01 p#Link01,
	#MainMessage #TopImageLink02 p#Link02,
	#MainMessage #TopImageLink03 div#Link03,
	#MainMessage #TopImageLink04 p#Link04 {
		display:block;
		}
	#MainMessage #TopImageLink01 p#Link01 a {
		display:block;
		margin-left:10px;
		width:217px;
		height:124px;
		}
	#MainMessage #TopImageLink01 p#Link01 a:hover {
		display:block;
		background:url(../../img/step01-link.jpg) 0 0 no-repeat;
		margin-left:10px;
		width:217px;
		height:124px;
		}

	#MainMessage #TopImageLink02 p#Link02 a {
		display:block;
		margin-left:12px;
		width:217px;
		height:124px;
		}
	#MainMessage #TopImageLink02 p#Link02 a:hover {
		display:block;
		background:url(../../img/step02-link.jpg) 0 0 no-repeat;
		margin-left:12px;
		width:217px;
		height:124px;
		}

	#MainMessage #TopImageLink03 div#Link03 a {
		display:block;
		margin-left:11px;
		width:226px;
		height:129px;
		}
	#MainMessage #TopImageLink03 div#Link03 a:hover {
		display:block;
		background:url(../../img/step03-link.jpg) 0 0 no-repeat;
		margin-left:11px;
		width:226px;
		height:129px;
		}

	#MainMessage #TopImageLink04 p#Link04 a {
		display:block;
		width:219px;
		height:123px;
		}
	#MainMessage #TopImageLink04 p#Link04 a:hover {
		display:block;
		background:url(../../img/step04-link.jpg) 0 0 no-repeat;
		width:219px;
		height:123px;
		}




#Main #CCopy {
	height:266px;}
	
#Main #CCopyTitle {
	width:705px;
	height:39px;
	background: url(../../img/stripes01.gif);
	}
#Main #CCopyTitle h3{
	color:#ffffff;
	font-size:24px;
	font-weight:bold;
	margin-left:20px;
	padding-top:3px;
	}
#Main #CCopy p { padding-top:20px;display:block;}

/*　こみだし
-------------------------------------*/


#Main .contentsBox#Step01,
#Main .contentsBox#Step02,
#Main .contentsBox#Step03 { margin-bottom:20px;}

#Main .contentsBox#Step01 .title { background:url(../../img/title-02.jpg) 0 0 no-repeat;}
#Main .contentsBox#Step02 .title { background:url(../../img/title-03.jpg) 0 0 no-repeat;}
#Main .contentsBox#Step03 .title { background:url(../../img/title-04.jpg) 0 0 no-repeat;}

#Main .contentsBox .title {
	display:block;
	width:705px;
	height:115px;}
#Main .contentsBox .title h2{
	position:relative;
	line-height:22px;
	color:#FFFFFF;
	font-weight:normal;
	width:364px;
	top:38px;
	left:154px;
	font-size:24px;}
#Main .contentsBox .title p {
	position:relative;
	width:364px;
	top:39px;
	left:154px;
	font-size:13px; }

#Main .contentsBox .fig {
	position:relative;
	float:right;
	top:31px;
	font-size:10px;
	line-height:15px;
	z-index:100;
	width:65px;}

/* まごみだし */

#Main .contentsBox .box {
	position:relative;
	padding-bottom:10px;
	background:url(../../img/box_wall.gif) 0 0 no-repeat;
	background-color:#fff9e4;
	border:#ff8b00 solid 1px;
	border-top:none;}

	
/* まごみだし */
	


#Main .contentsBox#Step01 .item01 {
	padding:30px 0 0 25px;
	width:145px;
	_width:125px;
	font-size:12px;
	color:#663200;}	
#Main .contentsBox#Step01 .item01 img { margin-bottom:10px;}

#Main .contentsBox#Step01 .item02 {
	position:absolute;
	top:78px;
	left:190px;
	width:158px;}
	
	#Main .contentsBox#Step01 .item02 .blbox { 
		height:100px;
		border:#d8e1e6 solid 2px; 
		margin-bottom:5px; }
	#Main .contentsBox#Step01 .item02 .blbox p.blboxtitle {
		position:absolute;
		color:#6699cc;
		top:11px;
		left:11px;}
	#Main .contentsBox#Step01 .item02 .blbox p {
		position:absolute;
		top:32px;
		left:12px;
		line-height:1.2;}
	#Main .contentsBox#Step01 .item02 .blbox img {
		margin-left:5px;}

#Main .contentsBox#Step01 .item03 {
	position:absolute;
	width:303px;
	top:30px;
	right:25px; }

#Main .contentsBox#Step01 .item03 img {
	margin-left:22px;
	margin-top:35px;}
#Main .contentsBox#Step01 .item03 p {
	margin-left:7px;
	margin-top:2px;}
#Main .contentsBox#Step01 .item03 p.itemtitle {
	position:absolute;
	font-weight:bold;
	color:#ff3300;
	font-size:18px;}

#Main .contentsBox#Step01 .item04 {
	position:absolute;
	border-style: double;
	border-color: #ff6600;
	background-color:#ffffff;
	width:431px;
	height:120px;
	top:270px;
	right:25px; }
	
#Main .contentsBox#Step01 .item04 p {
		position:absolute;
		width:290px;
		top:50px;
		left:25px;
		color:#636363;}
#Main .contentsBox#Step01 .item04 p.itemtitle {
		top:15px;
		left:25px;
		font-size:14px;
		color:#FF6600;}
#Main .contentsBox#Step01 .item04 img {
		margin:20px 10px 10px 10px;}

#Main .contentsBox#Step01 .item05 {
	margin:20px 0 0 25px;}

#Main .contentsBox#Step01 .item05 .cm {
	color:#FF0066;
	font-size:18px;}


#Main .contentsBox#Step01 .item05 .wrap img {
	float:left;}

#Main .contentsBox#Step01 .item05 .wrap p {
	float:left;
	display:block;
	background-color:#f7e1c3;
	font-size:14px;
	height:72px;
	_height:92px;
	width:165px;
	_width:185px;
	padding:10px;
	color:#543214;}


	
/* まごみだし */

#Main .contentsBox#Step02 .boxL {
	float:left;
	display:inline;
	width:313px;}
#Main .contentsBox#Step02 .boxR {
	float:right;
	display:inline;
	width:307px;
	margin-right:25px;
	_margin-right:0px;
	}

*+html #Main .contentsBox#Step02 .boxR {margin-right:25px;}
	
#Main .contentsBox#Step02 .item01 {
		padding:30px 0 0 25px;
		width:313px;
		_width:288px; }
	
#Main .contentsBox#Step02 .item01 p{
	display:block;
	margin-top:2px;
	padding:10px 10px 10px 25px;
	font-size:12px;
	_width:312px;
	background-color:#f7e1c3;
	color:#543214; }
	
#Main .contentsBox#Step02 .item02 {
	clear:both;
	margin:15px 0 20px 25px;
	width:307px;
	border:#d8e1e6 solid 3px;}
	
#Main .contentsBox#Step02 .item02:after {
	content:"";
	display:block;
	clear:both;
	}
#Main .contentsBox#Step02 .item02 img.photo {
	float:left;
	margin:10px; }

#Main .contentsBox#Step02 .item02 p {
	display:block;
	font-size:14px;
	margin:10px 10px 0 0;
	_height:126px;}
	
*+html #Main .contentsBox#Step02 .item02 p { height:126px;}
	

#Main .contentsBox#Step02 .item03 {
	margin:10px 0 20px 25px;
	width:313px;　}
	
#Main .contentsBox#Step02 .item03 p{
	display:block;
	margin-top:5px;
	padding:10px 10px 10px 20px;
	background-color:#f7e1c3;
	color:#543214;
	font-size:12px;
	line-height:1.3;}
#Main .contentsBox#Step02 .item03 p.itemtitle{
	margin:0px;
	padding:0px;
	height:30px;
	background-color:#fff9e4;
	font-size:24px;
	text-align:center;
	color:#ff0099;}
#Main .contentsBox#Step02 .item03 p.subtitle{
	margin:0px;
	padding:0px;
	height:30px;
	background-color:#fff9e4;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	color:#ff0099;}
#Main .contentsBox#Step02 .item03 span{
	margin:0px;
	font-size:10px;
	line-height:1.3;}

#Main .contentsBox#Step02 .item04 {
	margin:10px 25px 20px 0;
	width:307px;
	height:305px;}

#Main .contentsBox#Step02 .item04 p {
	margin-bottom:10px;
	width:200px;
	height:50px;}
#Main .contentsBox#Step02 .item04 p.mini{
	width:307px;
	font-size:11px;
	color:#636363;
	line-height:1.3;}
#Main .contentsBox#Step02 .item04 p.itemtitle {
	margin-top:30px;
	padding:0px;
	height:25px;
	font-weight:bold;
	font-size:18px;
	color:#ff3300;}

#Main .contentsBox#Step02 .item05 {
	width:307px;
	height:160px;
	border:double #ff3300;
	background-color:#ffffff;
	margin-bottom:15px;}

#Main .contentsBox#Step02 .item05 p {
	padding-top:5px;
	text-align:center;
	line-height:2.4;}

#Main .contentsBox#Step02 .item05 h3 { 
	width:307px;
	text-align:center;
	padding-top:20px;
	font-size:16px;
	color:#ff0099;
	display:block;}

#Main .contentsBox#Step02 .item05 h4 { display:block;}

#Main .contentsBox#Step02 .item06 {
	width:307px;
	padding-bottom:10px;
	color:#ffffff;
	background-color:#92aedd;}

#Main .contentsBox#Step02 .item06 h4 { 
	padding-top:10px;
	font-size:18px;
	margin:10px 20px;}

#Main .contentsBox#Step02 .item06 p { margin:10px 20px;}
#Main .contentsBox#Step02 .item06 p.photo { text-align:center;}

#Main .contentsBox#Step02 .item07 {
	clear:both;
	margin:0 0 25px 25px;
	width:655px;
	height:180px;
	background:url(../../img/step02-photo11.jpg) 0 30px no-repeat;}

#Main .contentsBox#Step02 .item07 h4 {
	font-size:14px;
	width:650px;
	text-align:center;
	color:#000000;
	margin-bottom:5px;}

#Main .contentsBox#Step02 .item07 div { 
	position:relative;
	float:left;
	width:60px;
	top:60px;
	line-height:11px;
	font-size:10px;
	display:block;}

#Main .contentsBox#Step02 .item07 .num1 { 
	left:128px;}

#Main .contentsBox#Step02 .item07 .num2 { 
	left:275px;}

#Main .contentsBox#Step02 .item07 .num3 { 
	width:110px;
	left:421px;}

#Main .contentsBox#Step02 .item07 .fig { 
	-border:1px solid;
	font-size:10px;
	top:133px;
	width:420px;
	left:7px;}


#Main .contentsBox#Step02 .item08 {
	margin:0 0 25px 25px;
	padding:0 0 15px 0;
	width:645px;}
	
#Main .contentsBox#Step02 .item08 img.photo {
	float:left;
	margin:0px;}
#Main .contentsBox#Step02 .item08 h4 {
	font-size:20px;
	width:650px;
	text-align:center;
	color:#FF3399;
	margin-bottom:5px;}
#Main .contentsBox#Step02 .item08 p{
	display:block;
	margin:0 0 0 263px;
	padding:15px;
	width:375px;
	_width:375px;
	height:120px;
	_height:150px;
	background-color:#f7e1c3;
	color:#543214;
	font-size:14px;
	line-height:1.6;}

*+html #Main .contentsBox#Step02 .item08 p{ width:340px;}

#Main .contentsBox#Step02 .item08 p span { font-size:11px;}
#Main .contentsBox#Step02 .item08 p strong.feat { 
	color:#CC0000;
	font-size:16px;}



#Main .contentsBox#Step02 .item09 p{
	display:block;
	margin:0 0 0 263px;
	padding:10px 30px 10px 10px;
	width:350px;
	_width:375px;
	
	height:130px;
	_height:150px;
	background-color:#CC0000;
	color:#543214;
	font-size:12px;
	line-height:1.6;}


/*　こみだし
-------------------------------------*/

#Main .contentsBox#Step03 .box {
	height:442px;
	background:url(../../img/box_wall.gif) 0 0 no-repeat;}

#Main .contentsBox#Step03 .box h3{
	position:relative;
	width:400px;
	height:40px;
	padding-top:27px;
	color:#ff3300;
	font-size:20px;
	left:25px;
	}

#Main .contentsBox#Step03 .box .inbox {
	position:relative;
	left:25px;
	width:653px;
	height:223px;
	background-color:#FFEEBA;
	}

#Main .contentsBox#Step03 .box p.left {
	position:relative;
	float:left;
	width:320px;
	height:190px;
	top:15px;
	left:18px;
	color:#ff0066;
	font-size:12px;
	display:block;}
#Main .contentsBox#Step03 .box img {
	margin:5px;}
#Main .contentsBox#Step03 .box strong {
	color:#ff0066;
	font-size:14px;}
	
#Main .contentsBox#Step03 .box p.right {
	position:relative;
	float:left;
	margin-left:20px;
	width:280px;
	height:190px;
	top:15px;
	left:18px;
	display:block;}	
#Main .contentsBox#Step03 .box p { 
	display:block;
	position:absolute;
	top:190px;
	left:160px;
	font-size:10px;}	

#Main .contentsBox#Step03 .box .include {
	position:relative;
	border:1px solid;
	float:left;
	width:296px;
	height:110px;
	padding:10px;
	top:15px;
	left:23px;
	background-color:#ffffff;
	color:#FF6600;}	

#Main .contentsBox#Step03 .box .exp {
	position:relative;
	float:left;
	line-height:19px;
	width:325px;
	top:22px;
	left:35px;
	color:#FF6600;
	;}	

#Main .contentsBox#Step03 .box span { 
	font-weight:bold;
	color:#FF3399; }	


	
/*　こみだし
-------------------------------------*/

#Main #UseBox {
	border:#d8e1e6 solid 3px;
	padding:20px;
	height:330px;
	background-color:#ffffff;
	margin-bottom:25px;}

#Main #UseBox h3 { 
	font-size:18px;
	color:#333399;
	margin-bottom:20px;}

#Main #UseBox .usebox {
	float:left;
	margin-right:10px;
	width:207px;
	background:none;
	font-size:12px;
	color:#636363;
	line-height:22px;}

#Main #UseBox .usebox img {
	border:#d8e1e6 solid 1px;
	float:left;
	margin-right:5px;
	margin-bottom:1px;}

#Main #UseBox .howto {
	position:relative;
	top:-80px;
	left:70px;
	width:300px;
	height:120px;
}

#Main #UseBox .howto a {
	display:block;
	background:url(../../img/video04_thumb.gif) 0 0 no-repeat;
	text-indent:-9999px;
	width:217px;
	height:123px;
	}

#Main #UseBox .howto a:hover {
	display:block;
	background:url(../../img/step04-link.jpg) 0 0 no-repeat;
	width:217px;
	height:123px;
}

/*　こみだし
-------------------------------------*/
#Main #Chara {
	clear:both;
	margin-bottom:25px; }
#Main #Chara:after {
	content:"";
	display:block;
	clear:both; }
	
	
#Main #Chara div.photo {
	background-color:#ffffff;
	float:left;
	width:221px;}

#Main #Chara div.textChara {
	background-color:#ffffff;
	float:right;
	width:463px;}

#Main #Chara div.textChara .title {
	width:465px;
	height:170px;
	margin-bottom:15px;}

#Main #Chara div.textChara .title p strong { font-size:18px;}

#Main #Chara div.textChara h3 {
	display:block;
	width:465px;
	font-size:24px;
	color:#000000;
	left:0px;
	top:0px;
	 }
#Main #Chara div.textChara p {
	color:#FF6600;
	font-size:14px;
	line-height:20px;
	left:5px;
	top:7px;
	width:450px;
	 }

#Main #Chara div.textChara h4 { 
	font-size:18px;
	color:#FF3399;
	margin-top:5px;}

#Main #Chara div.textChara .exp{ margin:0px 0px 10px 35px;}

#Main #Chara table {
	margin-top:18px;
	padding-top:10px;
	width:463px;
	border-top:#e2e2e2 solid 1px;
	border-bottom:#e2e2e2 solid 1px;}

#Main #Chara .buy {
	border-top:none}

#Main #Chara table th { width:80px;}
#Main #Chara table th,
#Main #Chara table td {
	border:none;
	padding:5px 0 0 20px;
	text-align:left;}

#Main #Chara table td span { font-weight:bold;}

#Main #Chara .cmt {
	font-size:16px;
	font-weight:bold;}

#Main #Chara table td a {
	/*background:url(../../img/arrow-01.gif) 0 2px no-repeat;*/
	padding-left:10px;
	color:#dd3876;}

#Main #Chara table td.end {
	padding-bottom:10px;}
	
#Main #Chara form span.mini {
	font-size:10px;
	font-weight:normal;}
/*　こみだし
-------------------------------------*/
#Main #Report {
	margin-bottom:10px;
	width:705px;
	padding-bottom:20px;
	background-color:#FFA54F;}

#Main #Report a {
	color:#ffffff;}

#Main #Report .titleReport {
	position:relative;
	width:705px;
	height:38px;
	background-color:#FFA54F;}

#Main #Report .titleReport p {
	position:relative;
	color:#ffffff;
	margin-left:30px;
	text-align:left;
	top:15px;
	}

#Main #Report h3 {
	overflow:hidden;}
#Main #Report h3 a {
	position:absolute;
	display:block;
	color:#ffffff;
	top:32px;
	left:30px;
	height:30px;}

#Main #Report p {
	position:relative;
	color:#ffffff;
	margin-left:30px;
	margin-right:30px;
	text-align:right;
	top:15px;
	}

#Main #Report dl {
	position:relative;
	width:664px;
	margin:15px 0 0 20px;
	padding-bottom:15px;
	background:url(../../img/report-bom.gif) left bottom no-repeat;}
	
#Main #Report dl dt {
	background:url(../../img/report-hed.gif) 0 0 no-repeat;
	width:664px;
	height:16px;
	text-indent:-9999px;}

#Main #Report dl dd.photo {
	position:absolute;
	top:16px;
	left:55px;
	width:213px;}
#Main #Report dl dd.text {
	width:400px;
	margin-left:183px;
	color:#898989;
	min-height:65px;
	_height:65px;}
	
#Main #Report dl dd.text strong {color:#f42386;}

#Main #Twitter {
	margin-bottom:25px;
	text-align:right;}


/* まごみだし */

/* ステップへのリンク */
p.steplink {
	width:705px;
	-border:1px solid;
	text-align:right;}
p.steplink a {
	color:#663300;}
p.steplink a:hover {
	text-decoration:none;
	position:relative;
	top:1px;
	left:1px;
	color:#ff3300;}

/* Special カートボタンセット */
a.SpecialOrderBtn{
	display:block;
	-border:1px solid;
	width:350px;
	height:49px;
}
a.SpecialOrder2SetBtn{
	display:block;
	-border:1px solid;
	width:475px;
	height:49px;
}
div.SpecialOrder01{
	position:relative;
	-border:10px solid;
	top:-58px;
	left:421px;
	width:350px;
	height:49px;
}

div.SpecialOrder2Set{
	position:relative;
	-border:1px solid;
	top:-65px;
	left:276px;
	width:475px;
	height:49px;
}
div.SpecialOrder2SetC{
	position:relative;
	-border:1px solid;
	top:-65px;
	left:223px;
	width:475px;
	height:49px;
}

div.SpecialOrder02{
	position:relative;
	-border:1px solid;
	top:-93px;
	left:423px;
	width:348px;
	height:49px;
}
div.SpecialOrder03{
	position:relative;
	-border:1px solid;
	top:-93px;
	left:423px;
	width:348px;
	height:49px;
}
div.SpecialOrder04{
	position:relative;
	-border:1px solid;
	top:-59px;
	left:293px;
	width:348px;
	height:47px;
}
div.SpecialOrder05{
	position:relative;
	-border:1px solid;
	top:-113px;
	left:288px;
	width:351px;
	height:49px;
}

/*　special(LP)
------------------------------------------*/

#video_sp {
	width:920px;
	margin:0px auto;
	-border:solid 1px;
	}	
#video_sp a{
	display:block;
	width:400px;
	height:226px;
}

#video_sp span{
	display:block;
	text-align:center;
	width:920px;
}

#video_sp p{
	display:block;
	float:left;
	margin-left:35px;
	margin-bottom:25px;
	margin-right:10px;
	width:400px;
	height:226px;
}

#video_sp #moni_20{background:url(../../img/moni_20.jpg) 0 0 no-repeat;}
#video_sp #moni_30{background:url(../../img/moni_30.jpg) 0 0 no-repeat;}
#video_sp #moni_40{background:url(../../img/moni_40.jpg) 0 0 no-repeat;}
#video_sp #intv_20{background:url(../../img/intv_20.jpg) 0 0 no-repeat;}
#video_sp #intv_30{background:url(../../img/intv_30.jpg) 0 0 no-repeat;}
#video_sp #intv_40{background:url(../../img/intv_40.jpg) 0 0 no-repeat;}

#video_sp a{
	display:block;
	width:400px;
	height:226px;
}

#video_sp #moni_20 a:hover {background:url(../../img/moni_20play.jpg) 0 0 no-repeat;}
#video_sp #moni_30 a:hover {background:url(../../img/moni_30play.jpg) 0 0 no-repeat;}
#video_sp #moni_40 a:hover {background:url(../../img/moni_40play.jpg) 0 0 no-repeat;}
#video_sp #intv_20 a:hover {background:url(../../img/intv_20play.jpg) 0 0 no-repeat;}
#video_sp #intv_30 a:hover {background:url(../../img/intv_30play.jpg) 0 0 no-repeat;}
#video_sp #intv_40 a:hover {background:url(../../img/intv_40play.jpg) 0 0 no-repeat;}



/*end*/

