@charset "utf-8";


h2.thankyou_last{
width: 100%;
text-align: center;
font-size: 17px;
padding: 0 0 30px 0;
margin: 100px auto 0 auto;

}

p.last_desc{
width: 100%;
text-align: center;
line-height: 2.2;
/*フォント句読点、約物は詰めない*/
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;

font-size: 13px;
}

p.last_desc_en{
width: 100%;
text-align: center;
line-height: 2.2;
/*フォント句読点、約物は詰めない*/
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;

font-size: 15px;
}




/*chromeの背景問題*/
input:-webkit-autofill {
box-shadow: 0 0 0 1000px white inset;
}


#contact{
width: 86%;
margin: 0 auto 120px auto;
height: auto;
}

#contact input,
#contact textarea {
font-family: inherit;
font-weight: 600;
}



#contact h1{
margin: 50px auto 0 auto;
padding: 0 0 30px 0;

width: 100%;
text-align: center;
font-size: 17px;

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;
}




#contact .accent{
width: 100%;
text-align:center;
padding: 100px 0 100px 0;
margin:0 auto;

font-weight: 400;
font-style: normal;
font-size:14px;
line-height: 2.5;

color:#000;
}







/*エラー*/
#contact .mw_wp_form .error-message {
display: none;
transition:all 0.8s ease;
opacity:0;
margin:20px 0 40px 0;
}
#contact .mw_wp_form_error .error-message {
display: block;
color: #B70000;
transition:all 0.8s ease;
opacity:1;
margin:20px 0 40px 0;
}

.error{
font-size: 13px !important;
margin:12px 0 0 0px !important;
}
/*エラー*/




/*テーブル全体*/
#contact .contact_japanese{
width:90%;
margin:50px auto 0 auto;
font-size:13px;
}



#contact .kaisetu{
width:100%;
margin:30px auto 20px auto;
font-size:11px;
line-height:1.5;

}

/*英語*/
#contact.font_sitei .kaisetu{
font-size:12px;
}


#contact .gaiyou{
line-height:2.5;
margin:0px auto 50px auto ;
}



#contact table {
width:100%;
border-collapse: collapse;
border-top:1px solid #ccc;
}

#contact table tr{
display:block;/*縦並び*/
width:100%;
border-bottom:1px solid #ccc;
}

#contact table th span{
color:#d60000;
margin:0 0 0 3px;
}

#contact table th{
display:block;/*縦並び*/
width:100%;
text-align:left;
padding:40px 0 12px 0;
margin:0;
font-size:12px;
font-weight: normal;
line-height: 1.4;

color:#000;
}
#contact.font_sitei table th{
font-size: 13px;
}

#contact table td{
display:block;/*縦並び*/
width:100%;
text-align:left;
margin:0;

font-size:12px;
line-height:1.5;
}


#contact input[type="text"] {
border: none;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);


margin:0;
padding: 10px;

width:100%;
height:45px;

font-size:13px;
color:#545454;

box-sizing: border-box;
}

/*英語*/
#contact.font_sitei input[type="text"] {
font-size:15px;
}

#contact input[type="text"]:focus {
border: none;
outline: 0;
}



#contact input[type="email"] {
border: none;
font-size:13px;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);


margin:0;
padding: 10px;

width:100%;
height:45px;

font-size:13px;
color:#545454;

box-sizing: border-box;
}
/*英語*/
#contact.font_sitei input[type="email"] {
font-size:15px;
}


#contact input[type="email"]:focus {
border: none;
outline: 0;
}




/*同意するーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
#contact .kojin{
font-size:11px;
}

#contact .doui_check{
margin:18px 0 18px 0;
}


#contact input[type="checkbox"]{
display: none;
}

#contact input[type="checkbox"]:checked{
-webkit-transition: border-color 0.2s linear;
transition: border-color 0.2s linear;
border: 2px solid #bbb;
}

#contact .mwform-checkbox-field-text{
color:#000;
}


#contact .kiyaku + span{
padding: 0px 0 0 23px;
position:relative;
}

/*最初の円*/
#contact .kiyaku + span::before{
-webkit-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 15px;
height: 15px;
border: 1px solid #000;
border-radius: 50%;
}

/*チェックしたら*/
#contact .kiyaku:checked + span::before{
color: #009a9a;
border: 1px solid #009a9a;
}

#contact .kiyaku:checked + span{
color: #009a9a;
}

/*選択時の小さい円*/
#contact .kiyaku:checked + span::after{
content: "";
display: block;
position: absolute;
top: 3px;
left: 3px;
width: 11px;
height: 11px;
background: #009a9a;
border-radius: 50%;
}

#contact textarea{
border: none;
outline: 0;
font-size:13px;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);

color:#545454;
margin:0;
padding: 10px;
width:100%;
height:200px;
box-sizing: border-box;
}
/*英語*/
#contact.font_sitei textarea{
font-size:15px;
}

#contact textarea:focus{
border: none;
outline: 0;
}




#contact .contact_japanese table td textarea.naiyou{
height:200px;
}










/*送信ボタン*/
#contact .submitbtn{
width:100%;
margin:40px 0 120px 0 ;
}

#contact .submitbtn input {
border: 0;
cursor: pointer;
display: block;
width: 100%;
background: #8FA6C1;
color: #fff;
height: 48px;
line-height: 48px;
font-size:14px;


-webkit-appearance: none;
border-radius: 0;
}




/*ボタンレイアウト*/
#contact .submitbtn{
width:100%;
display: block;
margin:40px auto 0 auto;
}


/*送信ボタン　基本*/
#contact .submitbtn input {
border: 0;
cursor: pointer;
display: block;
width:100%;
background: #000;
color: #fff;
height: 55px;
line-height: 56px;
font-size:14px;
}


/*確認ボタン*/
#contact .btn-confirm{
width:100%;
margin: 0 0 20px 0;
background: #000;
}

/*戻って編集ボタン*/
#contact .btn-back{
width:100%;
margin:0 0px 30px 0px;
background: #f1f1f1 !important;
color:#000 !important;
}

/*送信するボタン*/
#contact .send{
width:100%;
margin:0 0px 30px 0px;
}






/*送信完了*/
#contact .sended{
width:90%;
margin:100px auto 100px auto;
}
#contact .sended h2{
font-size:15px;
margin:0px auto 40px auto;
}

#contact .sended p{
font-size:13px;
line-height:2.0;
}







/*確認画面に遷移した場合　SP----------------------------------------------------*/
#contact .mw_wp_form_preview{

}


#contact .mw_wp_form_confirm table tr.kojin-tr{
display:none;
}






/*スマホ終了　PC開始（横幅880px以上）
----------------------------------------------------------------------------------------------------------------------------------*/
@media (min-width: 880px) {
#contact{
width:1000px;
margin: 120px auto 100px auto;
}

#contact h1{
margin: 0 auto 0 auto;
padding: 0 0 0 0;

width: 100%;
font-size:22px;
}


#contact .sended{
width:700px;
margin:100px auto 100px auto;
}

#contact .sended h2{
font-size:15px;
margin:0px auto 40px auto;
}


#contact .sended p{
font-size:14px;
line-height:2.0;
}





#contact .kaisetu{
width:1000px;
margin:30px auto 30px auto;
font-size:14px;
line-height:1.5;
color:#000;
}


#japanese_text .kaisetu{
font-size:12px;
}

#contact.font_sitei .kaisetu{
font-size:14px;
}

.contact_confirm .kaisetu{
display:none;
}


#contact table {
margin: 0;
padding: 0;
width: 100%;
border-collapse: collapse;
}

#contact table tr{
display:block;/*縦並び*/
width:100%;
border-bottom:1px solid #ccc;
}

#contact table th{
position:relative;
display:table-cell;/*横並び*/
width:180px;
vertical-align: middle;
padding:0 0 0 14px;
margin:0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;

font-size: 14px;
line-height: 1.4;
font-weight: normal;
}

#contact table th:after{
position: absolute;
right:0;
top:20px;
display: block;
content: "";
width: 1px;
height : -webkit-calc(100% - 40px);
height : calc(100% - 40px);
border-right: solid 1px #ccc;
}


/*お問い合わせ内容　テキストエリアのセル*/
#contact table tr.last_area th:after{
position: absolute;
right:0;
top:20px;
display: block;
content: "";
width: 1px;
height : -webkit-calc(100% - 40px);
height : calc(100% - 40px);
border-right: solid 1px #ccc;
margin:0;
padding:0;
}


#contact table td{
display:table-cell;/*横並び*/
width:620px;
vertical-align: middle;
padding:20px 0 20px 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
font-weight: normal;
}




#contact input[type="text"] {
border: none;
font-size:13px;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);

color:#545454;
height:45px;
margin:0;
padding: 10px;
width:560px;
}

/*英語*/
#contact.font_sitei input[type="text"] {
font-size:14px;
}

#contact input[type="text"]:focus {
border: none;
outline: 0;
}


#contact input[type="email"] {
border: none;
font-size:13px;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);

color:#545454;
height:45px;
margin:0;
padding: 10px;
width:560px;
}
/*英語*/
#contact.font_sitei input[type="email"] {
font-size:14px;
}

#contact input[type="email"]:focus {
border: none;
outline: 0;
}


#contact textarea{
border: none;
outline: 0;
font-size:13px;
-webkit-border-radius : 0;
-webkit-appearance : none;
-webkit-tap-highlight-color : rgba(0,0,0,0);

color:#545454;
margin:0;
padding: 10px 10px 10px 10px;
width:560px;
height:200px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
/*英語*/
#contact.font_sitei textarea{
font-size:14px;
}

#contact textarea:focus{
border: none;
outline: 0;
}






/*同意するーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

#contact table tr.kojin-tr th:after{
position: absolute;
right:0;
top:20px;
display: block;
content: "";
width: 1px;
height: 100px;
border-right: solid 1px #ccc;
}


#contact .kojin{
font-size:13px;
}

#contact .doui_check{
margin:12px 0 0 0;
}

#contact input[type="checkbox"]{
display: none;
}

#contact input[type="checkbox"]:checked{
-webkit-transition: border-color 0.2s linear;
transition: border-color 0.2s linear;
border: 2px solid #bbb;
}

#contact .mwform-checkbox-field-text{
color:#000;
}


#contact .kiyaku + span{
margin: 0;
padding: 0px 0 0 23px;
position:relative;
cursor: pointer;
line-height: 15px;
}

#contact .kiyaku + span:hover {
cursor: pointer;
opacity:0.5;
transition-duration: 0.5s;
}

#contact .kiyaku + span:hover > ::before{
cursor: pointer;
opacity:0.5;
transition-duration: 0.5s;
}


/*最初の円*/
#contact .kiyaku + span::before{
-webkit-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 15px;
height: 15px;
border: 1px solid #000;
border-radius: 50%;
}

/*チェックしたら*/
#contact .kiyaku:checked + span::before{
color: #009a9a;
border: 1px solid #009a9a;
}

#contact .kiyaku:checked + span{
color: #009a9a;
}

/*選択時の小さい円*/
#contact .kiyaku:checked + span::after{
content: "";
display: block;
position: absolute;
top: 3px;
left: 3px;
width: 11px;
height: 11px;
background: #009a9a;
border-radius: 50%;
}












/*確認画面-----------------------------------------------------------------------------------------------------------------------------------------------------*/
#contact .mw_wp_form_preview table td{
font-size: 14px;
vertical-align: middle;
height: 45px;

color:#000;
}

#contact .mw_wp_form_preview table tr.pre td{
font-size: 14px;
height: 45px;

color:#000;
}

#contact .mw_wp_form_preview table tr.last_area td{
line-height:2.0;
}

/*テキストエリアのセル*/
#contact .mw_wp_form_preview table tr.last_area th:after{
position: absolute;
right:0;
top:20px;
display: block;
content: "";
width: 1px;
height : -webkit-calc(100% - 40px);
height : calc(100% - 40px);
border-right: solid 1px #ccc;
}


/*最後は個人情報エリアなので非表示　確認する必要なし*/
#contact .mw_wp_form_confirm table tr.kojin-tr{
display:none;
}



/*送信ボタン*/
#contact .mw_wp_form_confirm input .submitbtn{
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
width:360px;
margin:40px auto 0 auto;
text-align:center;
}


/*確認画面：送信する　戻る*/
#contact .mw_wp_form_preview .submitbtn{
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*横並び・右から左*/
flex-direction: row-reverse;
width:800px;
margin:40px auto 0 auto;
text-align:center;
}



/*送信ボタン　基本*/
#contact .submitbtn input, #contact .submitbtn button{

border: 0;
cursor: pointer;
display: block;
width: 360px;
background: #000;
color: #fff;
height: 55px;
line-height: 56px;
font-size:12px;
line-height: 12px;

outline: 0;/*クリックした時の青い境界線を消す*/
}

#contact.font_sitei .submitbtn input, #contact.font_sitei .submitbtn button{
font-size: 15px;
line-height: 15px;
}

#contact .submitbtn input .btn-confirm:hover {
background: #666;
color: #fff;
transition: all 0.8s;
}



/*確認ボタン*/
#contact input .btn-confirm{
flex-basis: 360px;
margin:0 20px 0 20px;
background: #000;
}

/*戻って編集ボタン*/
#contact .submitbtn input .btn-back{
flex-basis: 360px;
background: #f1f1f1;
margin:0 20px 0 20px;
background: #e0e3e7;
color:#000;

}

#contact .submitbtn input .btn-back:hover {
background: #666;
color: #000;
transition: all 0.8s;
}

/*送信するボタン*/
#contact .btn-confirm{
margin:0 20px 0 0px !important;
}

#contact .btn-confirm:hover {
opacity: 0.6;
transition: all 0.5s;
}




}/*880px以上終了！*/
