@charset "UTF-8";
/*---------------------------------------------------------------
guide.css
-----------------------------------------------------------------
table of contents

	1. Common
	2. Faq
	3. Payment - Delivery - Cancel
	4. Index - Shoppingflow
------------------------------------------------------------------
font-size table

	10px :   77%		16px : 123.1%
	11px :   85%		17px :    131%
	12px :   93%		18px : 138.5%
	13px : 100%		19px : 146.5%
	14px : 108%		20px : 153.9%
	15px : 116%		21px : 161.6%
---------------------------------------------------------------*/

/*==============================================================
	1.	Common
===============================================================*/

#container{
	padding-top:20px;
}

/*		Header 
---------------------------------------------------------------*/

#header-guide{
}
#header-guide h2{
	position:absolute;
	top:0px;
	left:265px;
}
#header-guide p{
	position:absolute;
	top:0px;
	right:0px;
	width:21px;
	height:21px;
}


/*		Footer 
---------------------------------------------------------------*/

#footer{
	height:75px;
}
#copyright{
	top:28px;
}

/*		Menu 
---------------------------------------------------------------*/

#menu{
	float:left;
	width:170px;
}
#menu ul.navigation{
	margin-left:0px;
	margin-bottom:18px;
	padding:0;
}
#menu ul.navigation li{
	padding-bottom:2px;
	list-style-type:none;
}
#menu p.navigation{
	margin-top:-8px;
}

/*		Guide 
---------------------------------------------------------------*/

#guide{
	float:right;
	width:665px;
}
#guide div.round,
#guide div.round_top,
#guide div.round_bottom{
	width:665px;
}
#guide div.round{
	clear:both;
	overflow:hidden;
	margin-bottom:40px;
	background:url(/images/guide/bg_round_middle.png) top left repeat-y;
}
#guide div.round_top{
	background:url(/images/guide/bg_round_top.png) top left no-repeat;
}
#guide div.round_bottom{
	background:url(/images/guide/bg_round_bottom.png) bottom left no-repeat;
}
#guide .marker{
	color:#f00;
}


/*==============================================================
	2.	Faq
===============================================================*/

#faq h3{
	margin-bottom:35px;
}
#faq h3.above-error{
	margin-bottom:54px;
}
#faq h4{
	width:570px;
	height:31px;
	padding-top:19px;
	background:url(/images/shared/bg_border1.png) bottom left repeat-x;
	font-size:0;
}
#faq p{
	margin-bottom:16px;
}
#faq p.page-top{
	margin-top:-10px;
	padding-bottom:5px;
}
#faq .faq-list{
	margin:0 0 60px 0;
	padding-top:10px;
	padding-left:248px;
	padding-bottom:51px;
	background:url(/images/shared/bg_border2.png) bottom left repeat-x;
}
#faq .faq-list li{
	list-style-type:none;
}
#faq .faq-detail,
#faq .faq-detail-last{
	width:570px;
	padding-bottom:3px;
	background:url(/images/shared/bg_border1.png) bottom left repeat-x;
}
#faq .faq-detail-last{
	background:none;
}
#faq .faq-detail dt,
#faq .faq-detail-last dt{
	margin-top:8px;
	padding:14px 36px 7px 36px;
	background:url(/images/guide/faq_detail_dt.gif) top left no-repeat;
	font-size:93%;
	line-height:1.3;
	font-weight:bold;
	color:#4c4c4c;
}
#faq .faq-detail dd,
#faq .faq-detail-last dd{
	padding:12px 0 0 36px;
	background:url(/images/guide/faq_detail_dd.png) top left no-repeat;
	line-height:1.3;
	color:#4c4c4c;
}
#faq .faq-detail dd p,
#faq .faq-detail-last dd p{
	margin-bottom:1em;
	font-size:93%;
}
#faq .faq-detail dd p.notice,
#faq .faq-detail-last dd p.notice{
	font-size:77%;
}
#faq #contact{
	padding-top:20px;
	margin-top:35px;
}
#faq table.contact{
	width:621px;
	margin-left:22px;
}
#faq table.contact th{
	width:216px;
	padding:10px 0 10px 10px;
	background:url(/images/guide/bg_dott_contact.gif) bottom right no-repeat;
	font-size:93%;
	font-weight:normal;
	vertical-align:middle;
}
#faq table.contact td{
	width:376px;
	padding: 8px 0 10px 10px;
	background:url(/images/shared/bg_dott.gif) bottom left repeat-x;
	color:#999;
}
#faq table.contact td.confirm{
	padding:5px 0 5px 10px;
}
#faq table.contact td.confirm p{
	font-size:93%;
	color:#4c4c4c;
}
#faq table.contact tr.error th{
	background:url(/images/guide/bg_dott_contact.gif) bottom right no-repeat #ffd9ee;
}
#faq table.contact tr.error td{
	background:url(/images/shared/bg_dott.gif) bottom left repeat-x #ffd9ee;
}
#faq table.contact .last th,
#faq table.contact .last td{
	background:none;
}
#faq table.contact .last-error th,
#faq table.contact .last-error td{
	background:none #ffd9ee;
}
#faq table.contact .last th,
#faq table.contact .last-error th{
	vertical-align:top;
}

#faq table.contact p{
	margin-bottom:0;
	color:#4c4c4c;
	font-size:77%;
}
#faq table.contact p strong{
	color:#666;
}
#faq table.contact p label{
	color:#4c4c4c;
}
#faq table.contact p span.dash{
	color:#4c4c4c;
	padding:0 2px;
}
#faq table.contact p.left0{
	float:left;
	margin-right:21px;
}
#faq table.contact p.right0{
	padding-top:1em;
}
#faq table.contact p.left1{
	float:left;
	margin-right:21px;
	font-size:77%;
	text-indent:2.5em;
}
#faq table.contact p.right1{
	font-size:77%;
	text-indent:2.5em;
}
#faq table.contact p.left2{
	float:left;
	margin-right:21px;
	font-size:77%;
	text-indent:2.5em;
}
#faq table.contact p.right2{
	font-size:77%;
	text-indent:2.5em;
}
#faq table.contact span.marker{
	display:block;
	margin-top:-1.5em;
	padding-right:20px;
	text-align:right;
	color:#f00;
	font-size:10px;
}
#faq table.contact input{
	vertical-align:middle;
}
#faq table.contact p.left1 input,
#faq table.contact p.right1 input,
#faq table.contact p.left2 input,
#faq table.contact p.right2 input{
	margin-left:0.5em;
}
/*#faq table.contact p.card{
	font-size:93%;
	color:#4c4c4c;
}
#faq table.contact p.card label{
	float: left;
	margin-right:13px;
}
#faq table.contact p.card input{
	vertical-align:0px;
}
#faq table.contact p.limit{
	font-size:77%;
}
#faq table.contact p.limit select{
	vertical-align:middle;
}*/
#faq table.contact .error-message{
	margin-bottom:2px;
	padding-left:20px;
	background:url(/images/shared/icon_error_small.png) 2px 1px no-repeat;
	font-size:93%;
	font-weight:bold;
	color:#ff008e;
	line-height:1.4;
}
#faq table.contact select{
	width:184px;
	font-size:12px;
}
#faq p.button,
#faq p.button-finish,
#faq p.buttons{
	width:100%;
	margin-right:0;
	margin-bottom:0;
}
#faq p.buttons {
	width:685px;
	margin-right:-20px;
}
#faq p.button-finish{
	padding-top:34px;
	padding-bottom:35px;
	text-align:center;
}
#faq p.button input,
#faq p.button-finish input{
	margin-right:0;
}
#faq input.large{
	width:305px;
}
#faq textarea.large{
	width:307px;
	font-size:12px;
	border:1px solid #a5a5a5;
	overflow:hidden;
}
#faq .error-area{
	clear:both;
	margin:0;
	padding-left:2px;
	padding-bottom:35px;
}
#faq .error-area dt{
	margin-bottom:6px;
}
#faq .error-area dd{
	margin:0;
	/*padding-left:10px;
	background:url(/images/shared/bg_ul_pink.gif) top left no-repeat;*/
	color:#ff008e;
	font-size:93%;
	line-height:1.7;
}

#faq dl.finish{
	clear:both;
	text-align:center;
}
#faq dl.finish dt{
	margin-bottom:18px;
}
#faq dl.finish dd{
	margin-bottom:15px;
}
#faq dl.finish dd.text{
	font-size:93%;
	line-height:1.8;
	color:#4c4c4c;
	margin-bottom:0;
}
#faq div.detail{
	margin-top:-55px;
	padding-left:248px;
	padding-bottom:20px;
}

/*==============================================================
	3.	Payment - Delivery - Cancel
===============================================================*/
#shopping{
	margin-bottom:-15px;
}

#shopping h3{
	margin-bottom:16px;
}
#shopping h4{
	width:570px;
	height:26px;
	margin-top:34px;
	margin-bottom:16px;
	background:url(/images/shared/bg_border1.png) bottom left repeat-x;
	font-size:0;
}
#shopping p{
	margin-bottom:20px;
}
#shopping p.text,
#shopping p.notice{
	width:571px;
	margin-bottom:12px;
}
#shopping p.image{
	margin-top:14px;
	margin-bottom:16px;
}
#shopping p.page-top{
	margin-top:-4px;
	margin-bottom:-13px;
}
#shopping div.securitycode{
	z-index:0;
	position:relative;
	width:100%;
	height:110px;
	margin-top:20px;
	margin-bottom:38px;
}
#shopping div.securitycode p{
	position:absolute;
}
#shopping div.securitycode p.note{
	z-index:100;
	top:-4px;
	left:220px;
}

#shopping div.securitycode p.code{
	z-index:50;
	top:0px;
	left:0px;
}

/*==============================================================
	4.	Index - Shoppingflow
===============================================================*/
#index{
	margin-bottom:-15px;
}

#index h3{
	margin-bottom:14px;
}
#index h4{
	width:570px;
	height:28px;
	margin-top:33px;
	margin-bottom:38px;
	background:url(/images/shared/bg_border1.png) bottom left repeat-x;
	font-size:0;
}
#index p{
	margin-bottom:20px;
}
#index p.text,
#index p.notice{
	width:571px;
	margin-bottom:12px;
}
#index p.text2{
	margin-top:-20px;
}
#index p.text2-last{
	margin-top:-20px;
	margin-bottom:11px;
}
#index p.image{
	margin-top:38px;
	margin-bottom:40px;
}
#index p.image-text{
	margin-top:40px;
	margin-bottom:10px;
}
#index p.image-text span{
	display:inline-block;
	padding-top:5px;
}
#index p.page-top{
	margin-top:-6px;
	margin-bottom:40px;
}
#index dl.step {
	width:569px;
}
#index dl.step dt {
	margin-bottom:4px;
}
#index dl.step dd {
	margin-bottom:17px;
	padding-bottom:16px;
	background:url(/images/shared/bg_dott1.png) bottom left repeat-x;
}
#index dl.step dd.last {
	padding-bottom:0;
	margin-bottom:10px;
	background:none;
}
#index dl.step dd p {
	margin-bottom:0;
}
#index dl.step dd p.notice{
	margin-top:12px;	
}
#index dl.step dd p.image{
	margin-top:34px;
	margin-bottom:40px;
}
#index dl.step dl{
}
#index dl.step dl dt{
}
#index dl.step dl dd{
	padding-bottom:5px;
	background:none;
}
#index dl.step dl dd.last{
	margin-bottom:1px;
}
#index ul.flow{
	margin:-24px 0 0;
}
#index ul.flow li{
	clear:both;
	overflow:hidden;
	width:570px;
	padding-bottom:11px;
	list-style-type:none;
}
#index ul.flow li.dott7{
	min-height:100px;
	background:url(/images/guide/shopping_flow_bg7.gif) bottom left no-repeat;
}
#index ul.flow li.dott10{
	min-height:125px;
	background:url(/images/guide/shopping_flow_bg10.gif) bottom left no-repeat;
}
#index ul.flow li.last{
	background:none;
}
#index ul.flow li.last p{
	margin-bottom:0;
}
#index ul.flow dt{
	float:left;
	width:247px;
	height:30px;
	font-size:0;
}
#index ul.flow dt img{
	vertical-align:top;
}
#index ul.flow dd{
	float:right;
	width:323px;
}
#index ul.flow dd p{
	width:323px;
}
#index ul.flow dd p.notice{
	margin-top:-8px;
}
#index #model-tab{
	width:570px;
	height:28px;
	margin:0;
	background:url(/images/guide/bg_tab.png) top left no-repeat;
}
#index #model-tab.kotori201{
	overflow:hidden;
	width:570px;
	height:28px;
	background:url(/images/guide/bg_tab.png) bottom left no-repeat;
}
#index #model-tab li{
	float:left;
	width:117px;
	height:26px;
	padding:1px;
	list-style-type:none;
	cursor:pointer;
}
#index #model-tab li.here{
	cursor:default;
}
#index #model-tab #kotori201-tab{
	float:left;
	width:117px;
	height:26px;
	padding:1px 1px 1px 0;
	list-style-type:none;
}
#index #kotori201-area{
	display:none;
}
