@charset "utf-8";
/* CSS Document */
body{margin: 0;padding: 0;}
h1{background: #4a4a4a;margin: 0;padding: 1em 0;text-align: center;color: #ffffff;font-size: 140%;font-weight: normal;}
a:link,a:visited{color:#ff5656;text-decoration: underline;}
a:active,a:hover,a:focus{color:#4169e1;text-decoration: underline;}

#base{padding: 0 0 0 0;box-sizing:border-box;}
#base .block01{border-bottom:#333 dashed 1px;padding: 1em 0;}
h2{font-weight: normal;font-size: 140%;margin:0 1em 0 0.5em;padding: 0 0 0 0;display:inline-block;}
.link{display: inline-block;}
.foot_link{width: 100%;padding: 3em 0;text-align: center;}

#base .block01 .form_base02{padding: 0 0 1em 0;}

#base .block01 .form_base .koumoku,#base .block01 .form_base02 .koumoku{display:inline-block;box-sizing:border-box;vertical-align:top;padding:0.6em 0;margin: 0 0 1em 0;}
#base .block01 .form_base .input_area,#base .block01 .form_base02 .input_area{display:inline-block;box-sizing:border-box;vertical-align:top;padding:0.2em 0 0.2em 0;margin: 0 0 1em 0;}

.form_base input,.form_base textarea,.form_base02 input,.form_base02 textarea{padding: 0.5em;box-sizing: border-box;background-color:#fafafa;border:0;border:#bfbfbf 1px solid;font-size:100%;line-height: 1.5;font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
.form_base textarea,.form_base02 textarea {width: 100%;box-sizing: border-box;}
.form_base input[type="text"],.form_base input[type="email"],.form_base input[type="tel"]{width: 80%;}
.form_base02 input[type="text"]{width: 100%;}

.address_block{position: relative;}
.address_block input[type="text"]{width:15%;margin: 0 0.8em}
.address_block span{display: inline-block;margin: 0 0 0 0;font-size: 120%;}
.address_block span.note{display: inline-block;margin: 0 0 0 0.8em ;font-size: 100%;}
.address_block p textarea{margin: 1em 0 0 0;}
.address_block span.error{display:block;margin: 0;font-size: 100%;}
span.error{display:block;color:#ff5656;padding: 0.3em 0; font-size: 16px;}
span.attention{display:block;padding: 0.3em 0 0 0;}
/*
#zipcode_list{max-width: 300px;border:#bfbfbf 2px solid;background-color:#ffffff;position:absolute;z-index:100;top:3em;left:2.2em;box-sizing: border-box;}
#zipcode_list ul{list-style: none;margin: 0;padding:0;}
#zipcode_list ul li{border-bottom:#bfbfbf 1px solid;}
#zipcode_list ul li a:link,#zipcode_list ul li a:visited{display: block;padding:0.5em;text-decoration: none;color:#000;}
#zipcode_list ul li a:hover,#zipcode_list ul li a:active,#zipcode_list ul li a:focus{background-color:#fafafa;color:#4169e1;}
#zipcode_list .nav{text-align: center;padding:0.5em 3em;margin: 0;}
#zipcode_list .nav a:link,#zipcode_list .nav a:visited{text-decoration: none;color:#000;}
#zipcode_list .nav a:hover,#zipcode_list .nav a:active,#zipcode_list .nav a:focus{text-decoration:underline;color:#4169e1;}
#zipcode_list .nav span{margin: 0 1em;}
*/
#products{width: 100%;border-collapse: collapse;margin: 0 0 1em 0;background:#fff;}
#products th{border: #bfbfbf 1px solid;padding: 0.5em;text-align: center;font-weight: normal;}
#products th.item{width:10%;}
#products th.p_number{width:20%;}
#products th.p_name{width:70%;}
#products td{padding: 0!important;border: #ccc 1px solid;text-align:center;}
#products td input{background-color:#fafafa;margin:0 !important;border: none;width:100%;text-align:center;}
#products td.p_number_td input{width: 25%;text-align:left;}
#products td.p_number_td input:first-child{width:55% !important;text-align:right;}
#products td.p_number_td span{display: inline-block;padding: 0.5em 0; border-left:#bfbfbf 1px solid;border-right: #bfbfbf 1px solid;box-sizing: border-box;width:20%;text-align: center;}
#products td.p_name_td input{text-align:left;}
#products td.p_name_td{text-align:left;}

input[type="button"],input[type="submit"]{
border:0;border:1px solid #bfbfbf;
border-radius:3px;padding: 0.5em 1.5em;
background-color:#747474;
}
input[type="button"]:hover,input[type="submit"]:hover{
cursor:pointer;border-color:#333333;
background-color:#000000;
}

select{padding: 0.4em;margin: 0 0.5em 0 0;background-color:#fafafa;border: 0;border:1px solid #bfbfbf;}
option{padding: 0.5em;}
.date input{width: 6em !important;margin: 0 0.5em 0 0;}
.date span{display: inline-block;margin: 0 0.5em 0 0;}

.btn_base{text-align: center;padding: 10px 0 0 0;margin: 0;}
.btn_base input[type="button"]{margin: 0 1em;}
.btn_base input[type="button"], .btn_base input[type="submit"]{
background-color:#747474;
color: #FFFFFF;
}
.btn_base input[type="button"]:hover, .btn_base input[type="submit"]:hover{
background-color:#000000;
}
.delete_btn{
color: #FFFFFF;
}

#form_foot{text-align: center;padding: 1em 0;}#form_foot span{font-size: 120%;display: inline-block;margin-right: 0.8em;}

#confirm .announce{font-size: 120%;margin: 0 0 1em 0;}
#confirm .block01{line-height:2;background-color:#fafafa;border:#bfbfbf solid 1px;margin:0 0 1em 0;font-size: 110%;}
#confirm .koumoku{line-height: 1.5 !important;}
#confirm #products th{background-color:#fafafa;}
#confirm #products td{padding: 0.5em !important;min-height:20px !important;}
#confirm .long{width: 100% !important;display: block !important;margin: 0 0 0 0 !important;}

#complete{margin: 0 0 2em 0;}
#complete .message{width:100%;margin: 0;background-color:#fafafa;border:#bfbfbf solid 1px;box-sizing: border-box;font-size:140%;}
#complete .message p{font-size:80%;padding: 1em 0;line-height: 2;}

/**/
#guide_block{background: #f2f2f2;padding: 0.5em;box-sizing: border-box;width: 100%;margin: 0 0 0 0;}
#guide_block h2{margin: 0 0 0 0 !important;padding: 0.5em 0 !important;box-sizing: border-box;font-size:120%;text-align:center !important;display:block;font-weight: bold;}
#guide_block h3{margin: 0 0 0 0 !important;padding: 0 0 0.5em 0 !important;box-sizing: border-box;text-align: left;font-size: 100%;}
#guide_block h3:before{content: "■";}
#guide_block h3 span{font-size: 100%;font-weight: normal;}
#guide_block h4{margin: 0.5em 0 0.5em 0 !important;padding: 0 0 0.5em 0.5em !important;box-sizing: border-box;text-align: left;border-bottom: #333333 1px solid;}
#guide_block .guide_contents{background: #ffffff;margin: 0 0 0 0 !important;padding: 1em !important;box-sizing: border-box;font-size: 100%;}
#guide_block .guide_contents p{margin: 0 0.5em 0 0.5em;padding: 0;text-align: left;}
#guide_block .guide_contents p.note{margin: 0 0 1em 0.5em;}
#guide_block .guide_contents div{margin: 0;padding: 0;}
#guide_block .guide_contents ol{margin: 0 0 0 30px !important;padding: 0 0 0 0 !important;text-align: left;}
#guide_block .guide_contents ol li{margin: 0 0 0.5em 0 !important;padding: 0 0 0 0 !important;}
#guide_block .guide_contents ol li p{float: left;}
#guide_block .guide_contents .contents_block{margin-bottom: 1.5em;}
#guide_block .guide_contents ul.table_hosyo{list-style: none;width: 90%;margin: 1em 0 0 0;padding: 0;border-top:#cccccc 1px solid;}
#guide_block .guide_contents ul.table_hosyo li{display:-moz-flex;display:-webkit-flex;display:-o-flex;display:-ms-flex;flex-wrap:wrap;display: flex;justify-content: space-between;border-bottom:#cccccc 1px solid;padding: 0.8em 0;}


@media screen and (min-width:769px){
#base{width: 1200px;margin: 2em auto;padding: 0 0 0 0;box-sizing:border-box;}
#base .block01 .form_base,#base .block01 .form_base02{width: 90%;margin: 0 auto;}
#complete .message{padding: 0px;}
#base .block01 .form_base .koumoku,#base .block01 .form_base02 .koumoku{width: 15%;}
#base .block01 .form_base .input_area,#base .block01 .form_base02 .input_area{width: 82%;}
}

@media screen and (max-width:768px){
#base{width: 96%;margin: 1em auto;padding: 0 0 0 0;box-sizing:border-box;}
#base .block01 .form_base .koumoku,#base .block01 .form_base02 .koumoku{width: 20%;}
#base .block01 .form_base .input_area,#base .block01 .form_base02 .input_area{width:78%;}
#base .block01 .form_base,#base .block01 .form_base02{width:96%;margin: 0 auto;}
.form_base02 .long{display: block !important;width: 100% !important;margin: 0 !important;}
#confirm .block01 .form_base,#confirm .block01 .form_base02{width:90%;margin: 0 auto;}
#complete .message{padding: 0px;}
}


#complete .message .message1{
	text-align: center;
	color: #4E95D9;
	margin: 30px 0px 0px 0px;
	font-size: 26px;
	font-weight: bold;
}


#complete .message .message2{
	text-align: center;
	color: #000000;
}


#complete .message .message3{
	text-align: center;
	color: #4E95D9;
	font-weight: bold;
}

#complete .message .message4{
	text-align: center;
	color: #FF0000;
}

#complete .message pre{
	border: 1px solid #999999;
	background-color: #EFEFEF;
	padding: 20px 20px;
	margin: 30px 80px;
}