@charset "utf-8";

/* お問合せフォーム ----------*/
/*common*/
.mz-contact-wrap .contact_tit { padding-left: 1.8em; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_mail.svg); background-position: left .5em top 50%; background-repeat: no-repeat; background-size: 1em; }
.mz-contact-wrap .description { width: 90%; padding: 1em 2em; margin: 1em auto; font-size: 13px; background: #ececec; border-radius: .5em; }
.mz-contact-wrap .description span { margin: 0 3px; display: inline-block; }
.mz-contact-wrap .description.back { display: flex; }
.mz-contact-wrap .description .back_btn a { padding: 0 20px; margin-right: 20px; font-weight: bold; color: #49E; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arl_blue.svg); background-position: 0 50%; background-repeat: no-repeat; background-size: 8px; border-right: #888 solid 1px; display: block; }
.mz-contact-wrap .description .back_btn a:hover { color: #e3004b; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arl_crimson.svg); }
.mz-contact-wrap .font-red { color: #e3004b; font-weight: bold; }
/*問合せ項目選択*/
.mz-contact-wrap .form_select { width: 740px; margin: 10px auto; display: flex; }
.mz-contact-wrap .form_select li { width: 32%; margin: 0 .665%; }
.mz-contact-wrap .form_select li a { height: 100%; padding: 120px 5px 5px 5px; font-size: 13px; line-height: 1.3em; color: #235; background-color: #6AF; background-position: left 50% top 25px; background-repeat: no-repeat; background-size: 80px; border-radius: 8px; display: block; }
.mz-contact-wrap .form_select li a h3 { padding-right: 3px; margin: 0 auto 15px auto; font-size: 24px; font-weight: bold; text-align: center; color: #FFF; }
.mz-contact-wrap .form_select li a.general { background-image: url(https://dimj76dz6kqyc.cloudfront.net/bat_w.svg); background-size: 125px; }
.mz-contact-wrap .form_select li a.mallfeedback { background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_staff_w.svg); }
.mz-contact-wrap .form_select li a.reviews { background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_review_w.svg); }
.mz-contact-wrap .form_select li a p { min-height: 7em; padding: 1em; background-color: #CEF; border-radius: 5px; }
.mz-contact-wrap .form_select li a:hover { color: #410; background-color: #e3004b; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.3); }
.mz-contact-wrap .form_select li a:hover p { background-color: #FDD; }
/*送信完了*/
.mz-contact-wrap .complete_message { width: 640px; padding: 100px 0 120px 0; margin: 0 auto; background: url(https://dimj76dz6kqyc.cloudfront.net/bat_lg.svg) 100% 50% no-repeat; background-size: 360px; }
.mz-contact-wrap .complete_message h3 { margin: .5em auto; font-size: 1.8em; font-weight: bold; line-height: 1.2em; }
.mz-contact-wrap .complete_message p span { margin-right: 5px; color: #48E; }
.mz-contact-wrap .top_btn { width: 100%; margin: 0 auto; border-top: #666 solid 1px; }
.mz-contact-wrap .top_btn a { width: 15em; padding-right: 20px; margin: 0 10px 0 auto; font-weight: bold; line-height: 3em; text-align: right; color: #666; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arr.svg); background-position: 100% 45%; background-repeat: no-repeat; background-size: 8px; display: block; }
.mz-contact-wrap .top_btn a:hover { color: #e3004b; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arr_crimson.svg) }
/*投稿フォーム*/
#contact_form table { width: 704px; padding: 2px; margin: -1px auto 10px auto; border: #888 solid 1px; }
#contact_form table th { width: 220px; padding: 10px; font-size: 13px; font-weight: bold; text-align: center; color: #444; background-color: #ececec; vertical-align: middle; }
#contact_form table td { width: 480px; padding: 5px 10px; }
#contact_form input, #contact_form textarea { padding: 5px 5px 5px 10px; font-size: 18px; line-height: 26px; background-color: #fafafa; box-shadow: 0 3px 3px 0 rgba(204,204,204,0.5) inset, 0 0 0 1px #888; outline: 0; border-width: 0; display: inline-block; }
#contact_form input:focus, #contact_form textarea:focus { box-shadow: 0 0 0 1px #999 inset, 0 0 3px 3px #8BF; }
#contact_form input[type="text"], #contact_form input[type="email"] { width: 90%; border-radius: 4px; -webkit-appearance: none; appearance: none; }
#contact_form textarea { width: 100%; height: 9em; border-radius: 4px 4px 0 4px; }
#contact_form .url label { font-size: 13px; display: block; }
#contact_form .url input[type="text"] { width: 268px; margin-left: 5px; border-radius: 4px; display: inline-block; -webkit-appearance: none; appearance: none; }
#contact_form input[type="submit"] { width: 260px; padding-left: 30px; margin: 0 auto; font-size: 18px; font-weight: bold; line-height: 40px; text-align: center; color: #e3004b; background-color: #FFF; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_mail_crimson.svg); background-position: left 30px top 50%; background-repeat: no-repeat; background-size: 24px; box-shadow: 0 0 0 2px #e3004b inset, 0 1px 3px 0 rgba(0,0,0,0.3); border-radius: 5px; display: block; -webkit-appearance: none; appearance: none; }
#contact_form input[type="submit"]:hover { color: #FFF; background-color: #e3004b; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_mail.svg); }
#contact_form .form_submit { display: flex; justify-content: center; }
#contact_form .form_submit input[type="submit"] { margin: 0; }
#contact_form .cancel_btn { width: 180px; padding: 5px 0; margin-right: 20px; font-size: 15px; font-weight: bold; line-height: 40px; text-align: center; color: #48E; background-color: #FFF; box-shadow: 0 0 0 2px #48E inset, 0 1px 3px 0 rgba(0,0,0,0.3); border-radius: 5px; display: block; -webkit-appearance: none; appearance: none; }
#contact_form .cancel_btn:hover { color: #FFF; background-color: #48E; }
#contact_form .check_list { padding: 8px 5px 8px 15px; border: #CCC solid 1px; border-radius: 4px; display: flex; flex-wrap: wrap; }
#contact_form .check_list label { width: 50%; line-height: 30px; display: block; }
#contact_form .check_list label:last-child { flex-grow: 2; }
#contact_form .review_author_check { width: 460px; padding: 3px; line-height: 36px; background: #DDD; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3) inset; border-radius: 4px; display: flex; }
#contact_form .review_author_check input { display: none; }
#contact_form .review_author_check input + label { width: 33.33%; font-size: 13px; font-weight: bold; text-align: center; color: #444; border-right: #888 solid 1px; display: block; cursor: pointer; }
#contact_form .review_author_check input + label:last-child { border: none; }
#contact_form .review_author_check input:checked + label { color: #48E; background: #FFF; box-shadow: 0 0 0 1px #AAA inset, 0 1px 2px 1px rgba(0,0,0,0.3); border: none; border-radius: 3px; cursor: default; }
#contact_form .review_author_check input:disabled + label { color: #999; text-shadow: 0 1px 0 #FFF; }
#contact_form .required { font-size: 12px; color: #e3004b; }
#contact_form .caption { margin: 5px 0 5px 10px; font-size: 13px; line-height: 15px; color: #666; }
#contact_form .caption a { font-size: 14px; font-weight: bold; margin: 0 5px; }
#contact_form .report input { margin-left: .25em; }
#contact_form .report label { padding-left: 1.25em; font-size: .8em; color: #e3004b; background: url(https://dimj76dz6kqyc.cloudfront.net/ico_flag_red.svg) 0 50% no-repeat; background-size: 1em; }
#contact_form .mz-contact-tab { width: 704px; margin: 10px auto; }
#contact_form .mz-contact-tab>input[type="radio"] { display: none; }
#contact_form .mz-contact-tab>input[type="radio"] + label { padding: 10px 20px; font-weight: bold; text-align: center; background-color: #DDD; border-color: #888; border-width: 1px; border-style: solid; border-radius: 5px 5px 0 0; display: inline-block; cursor: pointer; z-index: 10; }
#contact_form .mz-contact-tab>input[type="radio"]:checked + label { color: #48E; background-color: #FFF; border-bottom-color: #FFF; cursor: default; }
#contact_form .mz-contact-tab>input[type="radio"] ~ div { display: none; }
#contact_form .mz-contact-tab>input[type="radio"] ~ div table { padding-top: 6px; }
#contact_form .mz-contact-tab>input[type="radio"]#type0:checked ~ .general { display: block; }
#contact_form .mz-contact-tab>input[type="radio"]#type1:checked ~ .mallfeedback { display: block; }
#contact_form .mz-contact-tab>input[type="radio"]#type2:checked ~ .reviews { display: block; }