@charset "utf-8";
/* ------------------------------------------------------------ common */

#fv { background: url(../images/contact/fv.jpg) center top no-repeat #000;}

#contact_intro { background: url(../images/contact/bg_01_.jpg) center bottom no-repeat #000; padding: 60px 0 50px; background-size: cover;}
#contact_intro img { float: left;}
#contact_intro div div { float: left; width: 540px; padding: 0 0 0 55px;}
#contact_intro div div h3 { font-size: 30px; font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; padding: 0 0 25px; letter-spacing: 1px;}
#contact_intro div div p { font-size: 15px; line-height: 34px; letter-spacing: 1px;}

#steps { padding: 75px 0 1px; background: #252525;}
#steps h3 { text-align: center; font-size: 30px; font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; padding: 0 0 50px; letter-spacing: 2px;}
#steps ol li { list-style-type: none; margin: 0 0 20px;}
#steps ol li img { float: left;}
#steps ol li .box { float: left; width: 645px; background: #0a0c06; padding: 45px 25px 45px 30px; min-height: 134px;}
#steps ol li .box p.number { float: left; width: 55px; font-size: 107px; font-family: 'edition'; color: #9b896e; letter-spacing: 5px; line-height: 100%;} 
#steps ol li .box div { float: left; width: 575px; padding: 0 0 0 15px;}
#steps ol li .box div h4 { font-size: 22px; padding: 0 0 15px;}

#contact_form { background: #252525; padding: 60px 0 125px;}
#contact_form .box { background: url(../images/buy/bg_01.gif); padding: 5px;}
#contact_form .box .contact_container { background: url(../images/index/bg_10.gif) center top no-repeat #1a1a1a; padding: 55px 0 60px}
#contact_form .box .contact_container .contact { padding: 0 30px 30px; }
#contact_form .box .contact_container .contact div { float: left; width: auto; text-align: center;}
#contact_form .box .contact_container .contact div h4 { font-size: 16px; color: #b39d7f;}
#contact_form .box .contact_container .contact div p { font-size: 38px; line-height: 38px; padding: 13px 0 0; font-style: italic; font-family: serif;}
#contact_form .box .contact_container .contact div p.closed{ padding: 0px; font-size: 14px; line-height: 180%;font-family: 'Lato', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ', Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, sans-serif; font-style: normal;} 
#contact_form .box .contact_container .contact div p small { font-size: 20px; padding: 0 15px 0 0;}
#contact_form .box .contact_container .contact div span { letter-spacing: 1px;}
#contact_form .box .contact_container .contact div a.line{color: #efefef; background: #81735d; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; width: 300px; text-align: center; padding: 15px 0; display: block;  font-size: 18px; margin: 37px 0px 37px 30px; pointer-events: none;}
#contact_form .box .contact_container .contact .fax ,
#contact_form .box .contact_container .contact .phone { width: calc(100% / 2 - 2%);}
#contact_form .box .contact_container .contact .phone { border-right: 1px solid #7e7e7e;}
#contact_form .box .contact_container .english_contact { text-align: center; font-size: 15px; color: #777; padding: 0 0 55px; letter-spacing: 2px; }


#contact_form .box .contact_container .attention { background: url(../images/buy/bg_01.gif); padding: 5px; margin: 0 auto 50px; text-align: center; width: 790px;}
#contact_form .box .contact_container .attention p { background: #121212; padding: 25px 45px;}
#contact_form .box .contact_container .attention p span { color: #9d0000;}
#contact_form .box .contact_container .form h4 { font-size: 26px; font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; text-align: center; border-bottom: 1px solid #6d6d6d; color: #b39d7f; padding: 0 0 25px; margin: 95px 0 35px;}
#contact_form .box .contact_container .form table { width: 100%; text-align: left;} 
#contact_form .box .contact_container .btn_tt{text-align: left; padding: 0 0 30px;width: 200px; display: flex ; margin: 0 auto; align-items: center;}
#contact_form .box .contact_container .btn_tt p{ text-align: center; width: calc(100% - 35px);display: inline-block;font-size: 16px; color: #fff;}
#contact_form .box .contact_container .btn_tt span{position: relative; width: 18px; height: 18px; display: inline-block; margin: 0 0 0 auto;}
#contact_form .box .contact_container .btn_tt span:before{display: block; content: ""; width: 100%; height: 2px; position:absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: #fff;transition: 0.5s;}
#contact_form .box .contact_container .btn_tt span:after{display: block; content: ""; width: 100%; height: 2px; position:absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) rotateZ(90deg); background: #fff;transition: 0.5s;}
#contact_form .box .contact_container .btn_tt.active span:after{ transform: translate(-50%,-50%) rotateZ(0deg); }
#contact_form .box .contact_container .form_box{/* display: none; */ padding: 0 0 30px;}
#contact_form .box .contact_container .form table th { width: 195px; padding: 20px 0; text-align: left;}
#contact_form .box .contact_container .form table th span { color: #9d0000;}
#contact_form .box .contact_container .form table td input[type="text"],
#contact_form .box .contact_container .form table td textarea { width: 580px; padding: 8px 0 8px 10px;}
#contact_form .box .contact_container .form table tr.contents th { vertical-align: text-top;}
#contact_form .box .contact_container .form p { text-align: center;}
#contact_form .box .contact_container .form input[type="submit"] { width: 260px; height: 50px; line-height: 50px; color: #efefef; background: #81735d; margin: 40px 0 0;
border-radius: 3px; 
-moz-border-radius: 3px; 
-webkit-border-radius: 3px;}
#contact_form .box .contact_container .form table tr.number th,
#contact_form .box .contact_container .form table tr.number td { padding: 25px 0 30px;}
#contact_form .box .contact_container .form table tr.contents th { padding: 0;}

#contact_form .box .contact_container .form table tr.stock td { padding: 20px 0 10px; }
#contact_form .box .contact_container .form table tr.stock td img { float: left; }
#contact_form .box .contact_container .form table tr.stock td div { padding: 30px 0 0 170px; }
#contact_form .box .contact_container .form table tr.stock td div h5 { font-size: 18px; color: #9b896e; }
#contact_form .box .contact_container .form table tr.stock td div p { text-align: left; }

/* ------------------------------------------------------------ check */
.note h3 { font-size: 24px; padding: 0 0 15px; }
.note p { padding: 0 0 15px; font-size: 16px; }
.note p.caution { color: #d20000; }
.note p.btn a { background: #edb31c; border: none; color: #efefef; padding: 0 100px; height: 50px; line-height: 50px; cursor: pointer; font-size: 16px; display: inline-block; *display: inline; *zoom: 1;
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; }


/* ------------------------------------------------------------ contact error, confirm確認 */

/*.color { background: #1a1a1a; }*/
#contact_form .box .contact_container .form table { }
#contact_form .box .contact_container .form div.note table td { padding: 15px 0; border-bottom: 1px solid #6c6c6c; }
#contact_form .box .contact_container .form div.note table th { padding: 15px 0; border-bottom: 1px solid #6c6c6c; font-weight: bold; }
#contact_form .box .contact_container .form div.note { text-align: center; padding: 50px; }
#contact_form .box .contact_container .form div.note h3 { font-size: 30px; color: #b39d7f;  font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; }
#contact_form .box .contact_container .form { padding: 0; margin: 0 auto; width: 790px;border-top: 1px solid #6c6c6c;}
#contact_form .box .contact_container .form div.note { background: #252525; }
#contact_form .box .contact_container .form div.note p.caution { color: #fff; }
#contact_form .box .contact_container .form div.note p.alert { padding: 40px 0 60px; }
#contact_form .box .contact_container .form div.note p.alert span { display: block; color: #d20000;}
#contact_form .box .contact_container .form div.note p.btn { padding: 50px 0 0; }
#contact_form .box .contact_container .form div.note p.btn a { width: 260px; margin: 0; padding: 0; margin-bottom: 10px; background: #6a6a6a;}
#contact_form .box .contact_container .form div.note input[type="submit"]{ margin: 0; vertical-align: top; }

/* ------------------------------------------------------------ thanks */

#thanks { background: #252525 ; text-align: center; padding: 70px 0 0;}
#thanks h3 {  font-size: 30px; color: #b39d7f;  font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; padding: 0 0 30px; }
#thanks p.notice { font-size: 18px; padding: 30px 0; background: #1a1a1a; }
#thanks p.note { padding: 50px 0; }

@media only screen and (max-width:640px){

/* ------------------------------------------------------------ common */

/* ------------------------------------------------------------ firstview */

#fv { background-size: auto 160px; }
#fv p { text-align: center; font-size: 14px; padding: 10px 0 25px; line-height: 24px; letter-spacing: 1px; }

/* ------------------------------------------------------------ contact */

#contact_intro { padding: 40px 0 35px; }
#contact_intro img { float: none; width: 100%; height: auto; }
#contact_intro div div { float: none; width: 100%; padding: 0; }
#contact_intro div div h3 { font-size: 20px; letter-spacing: 0; text-align: center; padding: 10px 0 20px; }
#contact_intro div div p { font-size: 14px; letter-spacing: 0; }

#steps { padding: 50px 0 30px; }
#steps h3 { font-size: 24px; letter-spacing: 1px; padding: 0 0 35px; }
#steps ol li img { float: none; width: 100%; height: auto; }
#steps ol li .box { width: 90%; padding: 5%; }
#steps ol li .box p.number { width: auto; font-size: 70px; }
#steps ol li .box div { width: 80%; padding: 0; float: right; } 
#steps ol li .box div h4 { font-size: 18px; padding: 0 0 10px; }
#steps ol li .box div p { font-size: 13px; }
#contact_form .box .contact_container .form_box{/* display: none;  */padding: 0 0 20px; }

#contact_form { padding: 0 0 40px; }
#contact_form .box .contact_container { padding: 0; background: none; }
#contact_form .box .contact_container .contact { padding: 0; }
#contact_form .box .contact_container .contact div { float: none; width: 100%; padding: 5% 0; }
#contact_form .box .contact_container .attention p { padding: 3% 5% }
#contact_form .box .contact_container .contact div span { letter-spacing: 0; font-size: 12px; }
#contact_form .box .contact_container .contact div h4 { font-size: 14px; }
#contact_form .box .contact_container .contact div p { font-size: 28px; }
#contact_form .box .contact_container .contact div p small { font-size: 16px; }
#contact_form .box .contact_container .contact .fax, 
#contact_form .box .contact_container .contact .phone { width: 100%; border-right: none; border-bottom: 1px solid #6f6f6f; }

#contact_form .box .contact_container .contact div a.line{width: 100%; padding: 15px 0;font-size: 14px; margin: 0 ; }
#contact_form .box .contact_container .contact .fax{padding: 5% 0 ;}
#contact_form .box .contact_container .contact .phone{padding:5% 0 ;}

#contact_form .box .contact_container .english_contact { font-size: 12px; padding: 20px 0 30px; }

#contact_form .box { padding: 0 10px; background: none; }
#contact_form .box .contact_container .form table{}
#contact_form .box .contact_container .form table th { display: block; width: 100%; padding: 25px 0 10px 0 !important; }
#contact_form .box .contact_container .form table td { display: block; width: 100%; }
#contact_form .box .contact_container .form table td input[type="text"], 
#contact_form .box .contact_container .form table td textarea { width: 94%; padding: 1% 3%; -webkit-appearance: none; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; }
#contact_form .box .contact_container .btn_tt{padding: 0px 0 20px;width: auto;}
#contact_form .box .contact_container .btn_tt p{width: 100%;font-size: 14px;}
#contact_form .box .contact_container .btn_tt span{width: 15px; height: 15px;}
#contact_form .box .contact_container .btn_tt span:before{ height: 1px;}
#contact_form .box .contact_container .btn_tt span:after{height: 1px;}

#contact_form .box .contact_container .attention { margin: 0; width: auto;}
#contact_form .box .contact_container .form h4 { margin: 0; padding: 15% 0 5%; font-size: 20px; }
#contact_form .box .contact_container .form table tr.number th { padding: 25px 0 10px; }
#contact_form .box .contact_container .form table tr.number td { padding: 0 0 10px; }
#contact_form .box .contact_container .form input[type="submit"] { width: 100%; }

#contact_form .box .contact_container .form table tr.stock td { padding: 10px 0; }
#contact_form .box .contact_container .form table tr.stock td img { width: 40%; height: auto; }
#contact_form .box .contact_container .form table tr.stock td div { padding: 20px 0 0 43%; }
#contact_form .box .contact_container .form table tr.stock td div h5 { font-size: 18px; color: #9b896e; }
#contact_form .box .contact_container .form table tr.stock td div p { text-align: left; }

.color { background: none; }
#contact_form .box .contact_container .form { padding: 0; width: auto;margin: 30px 0 0;}
#contact_form .box .contact_container .form p { font-size: 14px; }
#contact_form .box .contact_container .form div.note p.btn { padding: 30px 0; }
#contact_form .box .contact_container .form div.note h3 { font-size: 24px; padding: 20px 0; }
#contact_form .box .contact_container .form div.note table { border: none; }
#contact_form .box .contact_container .form div.note table th { background: #1a1a1a; }
#contact_form .box .contact_container .form div.note table th,
#contact_form .box .contact_container .form div.note table td { font-size: 14px; width: 94%; padding: 3% !important; border: none; }
#contact_form .box .contact_container .form div.note p.btn a { width: 90%; margin: 0 auto 10px; padding: 0; font-size: 14px; height: 45px; line-height: 45px; }
#contact_form .box .contact_container .form div.note input[type="submit"]{ width: 90%; margin:  auto; height: 45px; line-height: 45px; }
#contact_form .box .contact_container .form div.note { padding: 3%; background: #3a3a3a; }

#thanks { padding: 50px 0 30px; }
#thanks h3 { font-size: 24px; }
#thanks p.notice { font-size: 16px; padding: 30px 3%; }
#thanks p.note { padding: 30px 0; }
}