@charset "utf-8";

*{
	margin:0;
	padding:0;
	border:0;
	font-size:16px;
	font:inherit;
	vertical-align:baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

#main,
#menu,
#pagenav,
footer .inner,
footer .copyright p{

	margin:0 auto;
	padding:0 10px;
}

html{
	height:100%;
	/* フォントサイズ自動調節 OFF */
	text-size-adjust:none;
	-moz-text-size-adjust:none;
	-webkit-text-size-adjust:none;
}

body{
	background:#ccc;
	color:#333;
	margin:0;
	padding:0;
	height:100%;
	line-height:1.6;

}
body a:hover img{

}

img{
	max-width:100%;
	height:auto;
	line-height:0;
	border:0;
	vertical-align:bottom;
	vertical-align：text-bottom;
}

a{color:#900;}
a:visited{}
a:hover{text-decoration:underline;}
a:hover img{opacity: 0.7;}

ul{
	list-style:none;
}

p{
	margin-bottom:15px;
}

h3{
	margin-bottom:10px;
	color:#382B27;
}

/* CLEARFIX */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* ul は全てclearfix */ 
ul:before, ul:after { content: ""; display: table; }
ul:after { clear: both; }
ul { zoom: 1; }

.pc_only{
	display:none;
}

.sp_clear{
	clear:both;
}

/*---------------------------------
	非表示
-----------------------------------*/

#header, #header_title, #pay_icons, #step_flow, #profile_box, #pdf_box, #extra_box{
	display:none;
}


/*---------------------------------
	CONTAINER
-----------------------------------*/

#container {
	width: 100%;
	background:#FFF;
	margin:0 auto;
	padding:0 ;
	min-width:320px;
}

/* --------------------------------- */
/* スマホ用ヘッダ */
/* --------------------------------- */

header{
	position:relative;
	border-bottom:4px solid #503F38;
	box-shadow:0 0 5px rgba(0, 0, 0, 0.5);
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#EDEDED));

}
header .inner{
	position:relative;
}

h1{

}
h1 img{
	width:100%;
	
}
h1 a{
	color:white;
	font-size:100%;
}
header #menu_btn{
	position:absolute;
	top:15px;
	right:15px;
}
#mbtn_a{
	font-size:100%;
	padding: 5px; 
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#EAEAEA)); 
	border: 1px #90908D solid; color: #551417; 
	-webkit-appearance: none; 
	-webkit-border-radius: 10px; 
}
#mbtn_b{
	font-size:100%;
	padding: 5px; 
	background: -webkit-gradient(linear, left top, left bottom, from(#5F6258), to(#3B3B34)); 
	border: 1px #90908D solid; color: #fff; 
	-webkit-appearance: none; 
	-webkit-border-radius: 10px; 
}

#header_link_box{
	clear:both;
	text-align:center;
	font-size:90%;
	padding-top:3px;
	padding-bottom:3px;
	border-bottom:3px dotted #ccc;
	margin-bottom:30px;
}
#header_link_box a{
	text-decoration:none;
}


/* --------------------------------- */
/* スマホ用ヘッダメニュー */
/* --------------------------------- */

#mtitle{
	text-align:center;
	font-weight:bold;
	font-size:120%;
	color:#452121;
	
	background-image: -webkit-gradient(linear, left top, left bottom, from(#E2E2E2), to(#CCC));
	background-image: -webkit-linear-gradient(top, #E2E2E2, #CCC); 
	background-image:  -moz-linear-gradient(top, #E2E2E2, #CCC); 
	background-image:   -ms-linear-gradient(top, #E2E2E2, #CCC); 
	background-image:   -o-linear-gradient(top, #E2E2E2, #CCC); 
	background-image:     linear-gradient(top, #E2E2E2, #CCC);
}

#header_menu{
	position:absolute;
	background-color:white;
	top:60px;
	left:0px;
	width:100%;
	padding-bottom:30px;
	z-index:999 ;
}
#header_menu ul{
	list-style:none;
	border:1px solid #ccc;
}

#header_menu li{
	margin:0px;
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#e8e8e8));
	background:-webkit-linear-gradient(top, #fff, #e8e8e8);
	background:   -moz-linear-gradient(top, #fff, #e8e8e8);
	background:     -o-linear-gradient(top, #fff, #e8e8e8);
	background:        linear-gradient(top, #fff, #e8e8e8);
}

#header_menu li a{
	display:block;
	margin:0;
	padding:12px 5%;
	border-style:solid;
	border-color:#ccc #fff #fff;
	text-decoration:none;
	color:#452121;
}

#header_menu li.first a{
	border-top:0 none;	
}

#header_menu li.last  a{
	border-bottom:0 none;
	border-radius:0 0 5px 5px;
	-webkit-border-radius:0 0 5px 5px;
	-moz-border-radius:0 0 5px 5px;
}


/* ---------------------------------------------------------------- */
/* footer */
/* ---------------------------------------------------------------- */
#footer{
	border-top:4px solid #5B5A50;
	width:100%;
	background-color:#111;
	color:white;
	clear:both;
}
#footer_link_box{
	clear:both;
	text-align:center;
	font-size:90%;
	padding-bottom:3px;
	padding-top:3px;
	border-top:3px dotted #ccc;
	margin-top:30px;
}
#footer_link_box a{
	text-decoration:none;
}

#footer a{
	color:white;
}

#footer p{
	margin:5px;
	text-align:center;
	width:100%;
}



/* --------------------------------- */
/* フォームに関してのデザイン */
/* --------------------------------- */


input[type="text"] ,select,textarea {
	padding:5px;
	-webkit-appearance: none; 
	-webkit-border-radius: 5px; 
	-webkit-box-shadow: 0 2px 2px #CCC; 
}

input:focus,input:hover, textarea:focus,textarea:hover, select:focus,select:hover{
	-moz-box-shadow: 0px 0px 12px 		#000 /*{global-active-background-color}*/;
	-webkit-box-shadow: 0px 0px 12px 	#000 /*{global-active-background-color}*/;
	box-shadow: 0px 0px 12px 			#000 /*{global-active-background-color}*/;
}

textarea{
	margin:5px auto;
	height:50px;
	width:80%;
}

.btn_orange{
	padding-top: 10px; 
	padding-bottom: 10px; 
	background: #FF8800; /* 古いブラウザ向け */
	background: -webkit-gradient(linear, left top, left bottom, from(#FFAA33), to(#FF8800)); 
	border: 1px #F27300 solid; color: #FFF; 
	-webkit-appearance: none; 
	-webkit-border-radius: 10px; 
	-webkit-box-shadow: 0 2px 2px #CCC; 
	text-shadow: 1px 2px 3px #C45C00;
}

.btn_gray{
	padding-top: 10px; 
	padding-bottom: 10px; 
	background: #B1ADAA; /* 古いブラウザ向け */
	background: -webkit-gradient(linear, left top, left bottom, from(#ADAAA3), to(#B1ADAA)); 
	border: 1px #90908D solid; color: #FFF; 
	-webkit-appearance: none; 
	-webkit-border-radius: 10px; 
	-webkit-box-shadow: 0 2px 2px #CCC; 
	text-shadow: 1px 2px 3px #484841;
}

.btn_green{
	padding-top: 10px; 
	padding-bottom: 10px; 
	background: #666633; /* 古いブラウザ向け */
	background: -webkit-gradient(linear, left top, left bottom, from(#999933), to(#666633)); 
	border: 1px #90908D solid; color: #FFF; 
	-webkit-appearance: none; 
	-webkit-border-radius: 10px; 
	-webkit-box-shadow: 0 2px 2px #CCC; 
	text-shadow: 1px 2px 3px #484841;
}

/* --------------------------------- */
/* 一般的なデザイン書式 */
/* --------------------------------- */

b{
	font-weight:bold;
}
.bold{
	font-weight:bold;
}
.kome{
	font-weight:bold;
	color:orange;
	font-size:90%;
}
.red{
	color:#990000;
}
.small{
	font-size:85%;
	color:#555;
}
.center{
	text-align:center;
}
.w100{
	width:100%;
}
.w95{
	width:95%;
}
.w90{
	width:90%;
}
.w80{
	width:80%;
}
.w75{
	width:75%;
}
.w70{
	width:70%;
}
.w60{
	width:60%;
}
.w50{
	width:50%;
}
.w40{
	width:40%;
}
.w30{
	width:30%;
}
.w25{
	width:25%;
}
.w20{
	width:20%;
}
.fsize100{
	font-size:100%;
}
.fsize110{
	font-size:110%;
}
.fsize120{
	font-size:120%;
}
.fsize90{
	font-size:90%;
}
.fsize80{
	font-size:80%;
}

.yellow_box{
	border-top:1px solid #ccc;
	background-color:#FFFFCC;
}

.mbottom50{
	margin-bottom:50px;
}
.mbottom40{
	margin-bottom:40px;
}
.mbottom30{
	margin-bottom:30px;
}
.mbottom20{
	margin-bottom:20px;
}
.mbottom15{
	margin-bottom:15px;
}
.mbottom10{
	margin-bottom:10px;
}

/************************************
  .fbox
*************************************/

.fbox{
	border:1px solid #ccc;
	clear:both;
	margin-bottom:20px;
}

.fbox .sp_only{
	padding-right:10px;
}

.fbox ul{
	list-style:none;
	clear:both;
}

.fbox .colA{
	background-color:#382B27 ;
	color:white;
	padding-top:2px;
	padding-bottom:2px;
	text-align:center;
}
.fbox .colB{
	padding-top:7px;
	padding-bottom:7px;
	padding-left:3px;
	line-height:170%;
	padding-top:10px;
	border-top:1px solid #F2EBE2;
}
.fbox .colC{
	background-color:#F2EBE2 ;
	font-weight:bold ;
	padding-top:7px;
	padding-bottom:7px;
}
.fbox .colD{
	background-color:#D6C9C5 ;
	font-weight:bold ;
	padding-top:7px;
	padding-bottom:7px;
}

.fbox .delete{
	cursor:pointer ;
	border:1px solid #ccc;
	color:#777;
	padding-left:5px;
	padding-right:5px;
}

.fbox ul li p{
	margin:5px;
}

.fbox .colB .fA{
	width:30%;
	float:left;
	text-align:center;
}
.fbox .colB .fB{
	width:70%;
	float:right;
	text-align:left;
	font-weight:bold ;
}
.fbox .colB .fC{
	width:70%;
	float:right;
	text-align:left;
}
.fbox .colB .fD{
	width:70%;
	float:right;
	text-align:left;
}
.fbox .colB .fE{
	width:70%;
	float:right;
	text-align:left;
}
.fbox .colB .fF{
	width:30%;
	float:left;
	text-align:center;
	padding-top:20px;
}

.fbox .colC .fA4, .fbox .colD .fA4{
	width:70%;
	float:left;
	text-align:center;
}
.fbox .colC .fE, .fbox .colD .fE{
	width:30%;
	float:right;
	text-align:center;
}
.fbox .colC .fA2{
	width:90%;
	float:right;
	text-align:left;
}
.fbox .colC .fB2{
	width:70%;
	float:left;
	text-align:center;
}
.fbox .colC .fF, .fbox .colC .fF,{
	display:none;
}
/************************************
  .fbox2
*************************************/

.fbox2{
	clear:both;
	border:1px solid #ccc;
	margin-bottom:20px;
}

.fbox2 ul{
	list-style:none;
	clear:both;
}

.fbox2 .colA{
	background-color:#eeeeee ;
}
.fbox2 .colB{

}

.fobox2 #payblock ul{
	border-bottom:1px solid #ccc;
	padding-bottom:5px;
}

.fbox2 .fA{
	margin-top:10px;
	color:#000;
	margin-left:5%;
	font-weight:bold;
	font-size:90%;
	text-align:left;
}
.fbox2 .fB{
	margin-left:5%;
	text-align:left;
}
.fbox2 .fB p{
	font-size:80%;
}
.fbox2 .fB .zip{
	width:40%;
	float:left;
}
.fbox2 .fB .zip_search{
	width:50%;
	float:left;
	padding-left:13px;
}
.fbox2 .colB .fB{
	font-size:90%;
}

.fbox2 .commentli{
	width:100%;
	text-align:left;
}
.fbox2 .commentli .mbox{
	margin:10px;
}
.fbox2 .paybox{
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	margin-bottom:10px;
}

.fbox2 ul li p{
	margin:5px;
}

.fbox2 .addrplus{
	margin-top:10px;
}

.fbox2 .fA4{
	width:75%;
	float:left;
	text-align:right;
}

/************************************
  .fbox3
*************************************/

.fbox3{
	clear:both;
	border:1px solid #ccc;
	margin-bottom:20px;
	background-color:#eeeeee;
}

.fbox3 ul{
	list-style:none;
	clear:both;
}

.fbox3 .fA{
	margin-top:10px;
	color:#555;
	margin-left:5%;
	font-size:90%;
	text-align:left;
}
.fbox3 .fB{
	margin-left:5%;
	text-align:left;
	font-weight:bold;
	font-size:100%;
}
.fbox3 .banchi_attention{
	font-weight:normal;
	font-size:85%;
	color:#990000;
}
.fbox3 .mbox{
	margin:10px;
}

/**********************************
  kagoswitch
**********************************/

.kagoswitch{
	clear:both;
	padding-top:10px;
	padding-bottom:20px;
	margin-bottom:40px;
}
.ks_l{
	width:100%;
	text-align:center;
}	
.ks_r{
	width:100%;
	text-align:center;
	margin-bottom:20px;
}

/* --------------------------------- */
/* ステップごとのスタイル */
/* --------------------------------- */

#noITM{
	padding-top:20px;
	padding-bottom:20px;
	text-align:center;
	margin-bottom:20px;
	border-bottom:1px solid #ccc;
}
#noITM .text{
	font-size:110%;
	color:#800000;
}

.step1 .kagoswitch{
	margin-top:24px;
	margin-bottom:24px;
}
.step1 .muryocomment{
	color:#FF6600; 
	font-weight:bold;
}

.step1 #kaigai_box{
	border:4px solid #ccc; 
	padding:10px;
	font-size:80%;
	color:#555;
	margin-top:30px;
}
.step1 #kaigai_box p{
	margin-top:10px;
}

.step2 .bgon{
    background-color:#EBEAE6;
}
.step2 .bgoff{
    background-color:#B0ACA8;
}
.step2 .ck_bgon{
	background-color:#C8E373;
	color:#000;
}
step2 .ck_bgoff{
	background-color:#fff;
	color:#777;
}

.step2 .bgon{
	background-color:#E8FFD1;
}
.step2 .bgoff{
    background-color:#eee;
}
.step2 .err{
	background-color:#FFCCCC;
}
.step2 .error input{
	background-color:#FFCCCC;
}
.step2 .noerr{
	background-color:#ccc;
}
.step2 .iferror{
	display:none;
}
.step2 .error .iferror{
	display:block;
	color:red;
	font-weight:bold;
}

.step2 .switch_box{
	position:relative;
	background-color:white;
	margin-bottom:10px;
}
.step2 .labelA{

}
.step2 .labelB{

}
.step2 #cookie_box{
	clear:both;
	margin-top:10px;
}
.step2 .hosoku2{
	clear:both;
}

.step2 #message{
	width:95% ;
	height:40px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
}
.step2 #message_box{
	text-align:center;
	width:100%;
	margin-bottom:10px;
}

.step3 .haiso span{
	display:block;
}

.step3 .mini_btn{
	margin-top:10px;
}
.step3 .mini_btn input[type="submit"]{
	font-size:80%;
}

.step4 #thx_text{
	font-size:110%;
	text-align:left;
	margin-top:20px;
	font-weight:bold;
}

.step4 #credit_box{
	text-align:center;
}
.step4 #credit_box .button_box{
	margin-top:20px;
	margin-bottom:20px;
}
.step4 #credit_box .text{
	font-weight:bold; 
	color:red; 
	text-align:left;
}
.step4 #credit_box .text2{
	text-align:left;
	color:red; 
	font-weight:bold; 
	margin-bottom:30px;
}

.step4 .already_sended{
	margin-top:20px;
	margin-bottom:20px;
	text-align:left;
	color:teal;
	font-weight:bold;
}
.step4 .last_text{
	margin-top:20px; 
	margin-bottom:20px; 
	font-weight:bold;
}
.step4 .last_comment{
	background-color:#FCE8A7 ;
	padding:20px;
	text-alifn:left;
	margin:20px 10px;
}

.step4 .submit_box{
	text-align:center;
	margin-top:20px;
	margin-bottom:40px;
}

/************************************
  上部の項目
*************************************/

#pay_icon_list{
	width:100%;
	text-align:right;
}

#cart_name{
	font-weight:bold;
	text-align:left;
}
#cart_exp{
	display:none;
}
#cart_flow{
	margin-bottom:10px;
	text-align:center;
}
#cart_exp2{
	display:none;
}
#sp_step_flow{
	text-align:center;
	margin-bottom:5px;
	/*background-color:#424E28; 
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff)); */
}

/**********************************
	other
**********************************/

.infobox{
	width:410px;
	margin-left:354px; 
	margin-bottom:24px;
}
.infobox a{
	color:#777;
}
.attention{
	color:#990000;
	font-weight:bold;
	margin-bottom:26px;
	text-align:left;
}

.subtitle{
	background-color:black;
	color:white;
	font-weight:bold ;
	padding-top:7px;
	padding-bottom:7px;
	padding-left:7px;
	text-align:left;
}
.subtitle2{
	background-color:#000;
	color:#fff ;
	font-weight:bold ;
	padding-top:7px;
	padding-bottom:7px;
	padding-left:7px;
	font-size:85%;
}

.mark{
	color:red;
}


p.black{
color:#000000;
font-weight:bold;
}

p.red{
	color:#800000;
	font-weight:bold;
}

p.white{
color:#ffffff;
font-weight:bold;
}

.look{
	background-color:yellow;
	font-weight:bold;
	font-size:90%;
}

.otodoke{
	margin-top:10px;
	text-align:center;
	color:#C42E00 ;
	font-weight:bold;
}

.cookie_box{
	text-align:center; 
	margin-top:15px; 
	margin-bottom:15px; 
	font-size:90%;
}
.sp_kaigyo{
	display:block;
	margin-bottom:10px;
}