/* =========================================================
■ お問合せフォーム
========================================================= */
/**----------デフォルトスタイルを削除---------**/
input, button, textarea, select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}



/**----------全体---------**/

.form_box {
	margin:50px auto 0;
	line-height:20px;
	text-align :left;
}
/**----------大項目---------**/
h5 {
	margin: 0 auto;
	width:98%;
	max-width:1100px;
	box-sizing:border-box;
	position: relative;
	padding: .7em .75em;
	background-color: #f0f0f0;
	border-radius: 6px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .1) inset;
	margin-bottom:20px;
	font-size: 120%;
}
h5::after {
	position: absolute;
	top: 100%;
	left: 80px;
	content: '';
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top: 30px solid #f0f0f0;
}


.form_box p {
	margin-bottom: 1.2em;
}

.form_box .section {
	width: 98%;
	max-width:1000px;
	margin:0 auto;
}

.form_box .section:after {
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	position: relative;
	overflow: hidden;
}
.form_box .section .cell {
	width: 46%;
	margin:0 2%;
	text-align: left;
	float: left;
}

.form_box .section .cell-long {
	width: 96%;
	margin:0 auto;
	text-align: left;
	display: block;
	float: none;
}
.form_box .section .cell + .cell {
	float: right;
}
.form_box .section p + input {
	margin-top: 8px;
}
.form_box .section + .section {
	margin-top: 15px;
}
@media screen and (max-width: 1024px) {
	.form_box .section .cell {
		width: 48%;
		margin:0 1%;
	}
	.form_box .section .cell-long {
		width: 98%;
	}
}

@media screen and (max-width: 768px) {
	.form_box .section .cell {
		width:100%;
		margin:0 auto;
	}
	.form_box .section + .section {
		margin:0 auto;
	}
}
@media screen and (max-width: 480px) {
	h5::after {
		left: 45px;
		border: 20px solid transparent;
		border-top: 20px solid #f0f0f0;
	}
}

/**----------必須マーク---------**/
.marker_water {
	margin-left:6px;
	font-size:70%;
	text-align:center;
	padding:2px 6px;
	color:#fff;
	background-color:#49a9d4;
	border-radius:5px;
}
.buyinfo{
	font-weight:normal;
	margin-bottom:10px;
	width:90%;
	max-width:450px;
	margin:70px auto 20px;
	text-align:left;

}
.buyinfo_list{
	list-style:inside;
}
.buycmnt{
	margin-bottom:10px;
	margin-left:6%;
	font-size:14px;
}
.buycmnt2{
	font-size:14px;
}
.paylink{
	text-decoration: underline;
	cursor:pointer;
	color:#00f;
}

.pay2_cmnt{
	display:none;
	margin-top:0;
	font-size:12px;
	line-height:14px;

}
.total_cmnt{
	margin-top:10px;
	font-size:14px;
}
#msend_disp{
	display:none;
}
.msend_cmnt{
	margin-top:20px;
}

/**----------inputやtextareaのスタイル---------**/

.custom input[type="text"],
.custom textarea,
.custom input[type="password"] {
	outline: none;
	box-sizing:border-box;
	border: 1px solid #bebebe;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-size:16px;
	padding:10px 2%;
	line-height:160%;
	max-width: 100%;
	width:100%;
	border-radius:5px;
	margin-bottom:5px;
}
.custom select{
	padding:10px 2%;
	border-radius:5px;
	margin-bottom:5px;
	border: 1px solid #bebebe;
}

.custom input[type="text"]:focus,
.custom textarea:focus {
	box-shadow: 0 0 7px #49a9d4;
	border: 1px solid #49a9d4;
}
.custom input[type="text"].w_add1 {
	width:15%;
	margin-right:2%;
}
.custom input[type="text"].w_add2 {
	width:83%;
}
.custom input[type="text"].w_add3 {
	width:30%;
	margin-right:2%;
}
@media screen and (max-width: 640px) {
	.custom input[type="text"].w_add1 {
		width:80px;
		padding:15px 1%;
	}
	.custom input[type="text"].w_add2 {
		width:auto;
	}
	.custom input[type="text"].w_add3 {
		width:auto;
	}
}

/**----------ラジオボタン---------**/

.radio1 input[type=radio]{
	    display: none;
	}
	.radio1 label{
	    display:block;
	    position: relative;
	    cursor: pointer;
	    margin-left: 10px;
		margin-top:10px;
	    padding: 5px 5px 5px 20px;
	    border-radius: 2px;
	    text-align: left;
	    line-height: 1;
	}
	.radio1 .d_inb label {
		display:inline-block;
	}
	.radio1 .d_inb .tbl_form_bno {
		margin-bottom:20px;
	}
	.radio1 .d_inb .tbl_form_bno td label {
		margin-right:20px;
	}
	.radio1 label:before{
	    position: absolute;
	    content: "";
	    top: 50%;
	    left: -10px;
	    width: 20px;
	    height: 20px;
	    margin-top: -10px;
	    background: #bdc3c7;
	    border-radius: 50%;
		
	}

	.radio1 input[type="radio"]:checked + label:after {
	    position: absolute;
	    content: "";
	    top: 50%;
	    left: -4px;
	    width: 8px;
	    height: 8px;
	    margin-top: -4px;
	    border-radius: 50%;
	    background: #950000;
	}

.tbl_form td.radio1{
	padding-left:5%;
}
/**----------チェックボックス---------**/
input[type=checkbox] {
	display: none;
}
	#kou .checkbox {
  		width:170px;
	}
	#volume .checkbox {
  		width:450px;
	}
	#site .checkbox {
  		width:140px;
	}
	#form_contact .checkbox{
		width:190px;
	}
	.checkbox {
	  box-sizing: border-box;
	  -webkit-transition: background-color 0.2s linear;
	  transition: background-color 0.2s linear;
	  position: relative;
	  display: inline-block;
	  margin: 7px 10px 7px 0;
	  padding: 20px 0px 20px 47px;
	  border-radius: 8px;
	  background-color: #f6f7f8;
	  vertical-align: middle;
	  cursor: pointer;
	}
	.checkbox:hover {
	  background-color: #87cefa;
	}
	.checkbox:hover:after {
	  border-color: #1a1a1a;
	}
	.checkbox:after {
	  -webkit-transition: border-color 0.2s linear;
	  transition: border-color 0.2s linear;
	  position: absolute;
	  top: 50%;
	  left: 15px;
	  display: block;
	  margin-top: -10px;
	  width: 16px;
	  height: 16px;
	  border: 2px solid #1a1a1a;
	  border-radius: 3px;
	  content: '';
	}

	.checkbox:before {
	  -webkit-transition: opacity 0.2s linear;
	  transition: opacity 0.2s linear;
	  position: absolute;
	  top: 50%;
	  left: 21px;
	  display: block;
	  margin-top: -7px;
	  width: 5px;
	  height: 9px;
	  border-right: 3px solid #950000;
	  border-bottom: 3px solid #950000;
	  content: '';
	  opacity: 0;
	  -webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
	  transform: rotate(45deg);			
	}
	form input[type=checkbox]:checked + .checkbox:before {
	  opacity: 1;
	}
	.checkbox_l{
		width:300px;
	}
@media screen and (max-width: 768px) {
	#form_contact .checkbox {
		width:170px;
	}
}
@media screen and (max-width: 640px) {
	.checkbox {
		margin-right:7px;
		padding:15px 0 15px 40px;
	}
	#form_contact .checkbox {
		width:145px;
	}
	.checkbox::before {
		left:18px;
	}
	.checkbox::after {
		left:12px;
	}	
}
@media screen and (max-width: 414px) {
}
/**----------入力ごとのスタイル---------**/
#postcode{
	width:100px;
}
/**----------必須エラー---------**/
.d_error {
	font-size:0.9em;
	text-align:left;
	font-weight:normal;
	color:#D91C1D;
}
.d_error img{
	margin-bottom:-0.2em;
}
/**----------参照ボタン---------**/
input[type=file] {
	padding:5px 10px;
	font-size: 14px;
}


/**----------送信ボタン---------**/

.button_01 input {
	display: inline-block;
	width: 200px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #333;
	color: #fff;
	font-size:110%;
	
}
.button_01 input:before,
.button_01 input:after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button_01 input,
.button_01 input:before,
.button_01 input:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button_01 input:hover {
	background-color: #59b1eb;
	color: #fff;
}

#btnbox{
	width: 100%;
		text-align: center;
	margin:20px auto 30px;
}
#btnbox p{
	color:#f00;
}
@media screen and (max-width: 480px) {
	#btnbox {
		margin:0 auto 50px;
	}
}

/*----------SELECT-----*/
select.select{
	padding:10px 10px;
	margin-bottom:5px;
}

/* ------------------------------------------------
	IME設定
------------------------------------------------ */
input#NAME1 { ime-mode: active; }
input#KANA1 { ime-mode: active; }
input#MAIL1 { ime-mode: disabled; }
input#MAIL2 { ime-mode: disabled; }
input#TEL1 { ime-mode: disabled; }
input#ADDRNO { ime-mode: disabled; }
input#B_ADDR1 { ime-mode: active; }
input#B_ADDR2 { ime-mode: active; }
input#AGE { ime-mode: disabled; }
input#CMNT { ime-mode: active; }


/*----------------------------------------------------
	新フォーム
----------------------------------------------------*/
/**----------問い合わせcgi表---------**/
table.scr_tbl_cgicmnt{
	width: 98%;
	max-width: 740px;
	margin: 20px auto 70px;
	border: 1px solid #ccc; 
	border-collapse: separate;
	border-spacing:2px;
	line-height:150%;
}
table.scr_tbl_cgicmnt td{
	padding:50px 0;
	text-align:center;
	vertical-align:top;
}
table.scr_tbl_cgicmnt td a{
	text-decoration:none;
	color:#00f;
}

/**----------　ボタン　---------**/
.button {
	width:94%;
	max-width:600px;
	margin:30px auto 0;
}
.button a {
    display: inline-block;
	width:47%;
	max-width:230px;
	margin:0 1% 10px;
	height:50px;
	text-align:center;
	box-sizing:border-box;
	border:1px solid #be001f;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
	font-size:18px;
	letter-spacing:2px;
	padding-top:8px;
	color:#fff!important;
	background:#be001f;
}
.button a:hover {
	border:1px solid #be001f;
	color:#be001f!important;
}
.button a:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.button a:hover:before, 
.button a:active:before,
.button span:hover:before, 
.button span:focus:before, 
.button span:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.button a img + img,
.button span img + img {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0 !important;
	-webkit-transition: all ease 0.5s;
	-o-transition: all ease 0.5s;
	transition: all ease 0.5s;
}
.button a:hover img,
.button a.active img,
.button span:hover img {
	opacity: 0;
}
.button a:hover img + img,
.button a.active img + img,
.button span:hover img + img {
	opacity: 1 !important;
}



@media (max-width: 768px) {
	.button a {
		font-size:18px;
		padding-top:6px;
	}
}
@media (max-width: 480px) {
	.button a {
		font-size:16px;
		width:270px;
		padding-top:8px;
	}
}

.button_line2 a{
	height:80px;
}

.mail_end_cmnt{
	font-weight:normal;
	text-align:left;
	width:80%;
	margin:40px auto;

}
.mail_end_cmnt .txt_red{
	color:#D91C1D;
	font-size:20px;
}

/**----------必須マーク---------**/
.marker_water {
	font-size:11px;
	display:inline-block;
	padding-left:10px;
	vertical-align: middle;
	color:#ff0000;
}
.d_msg .marker_water {
	float:none;
}
/**----------問い合わせcgi表---------**/
table.scr_tbl_cgicmnt{
	width: 98%;
	max-width: 740px;
	height:500px;
	margin: 20px auto;
	border: 1px solid #ccc; 
	border-collapse: separate;
	border-spacing:2px;
	line-height:150%;
}
table.scr_tbl_cgicmnt td{
	padding-top:70px;
	text-align:center;
	vertical-align:top;
}
table.scr_tbl_cgicmnt td a{
	text-decoration:none;
	color:#00f;
}

/**----------確認ボタン---------**/
.submit {
	text-align:center;
	margin-top:70px;
}
/**----------住所---------**/
.tbl_form input#postcode {
	margin-bottom:7px;
	width:50%;
	max-width:100px;
}
.tbl_form input#btn_addr {
	padding:7px 7px 7px;
	border:solid thin #E8E8E8;
	cursor:pointer;
}
.tbl_form .td_addr_left{
	text-align:left;
}
.tbl_form .td_left{
	text-align:left;
	font-weight:normal;
}
.tbl_form .uni_ml70{
	margin-left:70px;
}
@media (max-width: 860px) {
	.tbl_form input.w_ss {
		margin-bottom:5px;
	}
	
}

@media (max-width: 768px) {
	.tbl_form input.w_ss{
		width:60px;
	}
	
	.tbl_form input,
	.tbl_form textarea,
	.tbl_form tr td select {
		font-size:16px;
	}
}		
@media (max-width: 540px) {
	.tbl_form {
		border-top:1px solid #ccc;
	}
	.tbl_form_bno {
		border-top:none;
	}
	.tbl_form tr th {
		width:100%;
		display:block;
		box-sizing:border-box;
		border-bottom:none;
		padding:20px 0 2px;
	}
	.tbl_form tr th.th0 {
		height:1px;
	}

	.tbl_form tr td {
		width:100%;
		display:block;
		box-sizing:border-box;
		padding:5px 2% 20px;
	}
	.tbl_form input,
	.tbl_form textarea {
		padding:5px 2%;
	}
	form .checkbox {
		padding:5px 0 5px 17%;
		width:50%;
	}

	select.uketuke{
		margin:5px 0.5% 0;
		padding:7px 0.5%;
		width:30%;
	}
	.radio_small #radio1 label {
		margin-left:10px;
		padding:15px 30px 15px 15px;
	}
	.tbl_form tr td input,
	.tbl_form tr td textarea,
	.tbl_form tr td select {
		font-size:16px;
	}
	.send {
		margin:10px auto 0;
	}
	.send a {
		margin:0 0 20px;
	}
}
@media (max-width: 414px) {
	.tbl_form input.w_ss02{
		width:32px;
	}
	.tbl_form input.w_ss03 {
		width:52px;
	}
	.radio_small #radio1 label {
		font-size:12px;
	}
	.marker_water {
		font-size:11px;
	}
}
@media (max-width: 414px) {
	.radio_small #radio1 label {
		font-size:11px;
	}
}
.w50p {
	width:50px!important;
}
.uni_mini{
	font-weight:normal;
}
.uni_mini2{
	font-size:12px;
}
.uni_center{
	text-align:center;
}
.uni_left{
	text-align:left;
}