/* お問い合わせフォーム（追加分：エラー表示・確認画面・ハニーポット）。基本の見た目は sub.css */

.contact-form{scroll-margin-top:120px}
.contact-form [hidden]{display:none!important}

/* JavaScript 無効時の案内 */
.contact-noscript{color:#c62828;font-size:1.4rem;font-weight:700;margin:0 0 30px;text-align:center}

/* エラー表示 */
.contact-error{color:#c62828;font-size:1.3rem;font-weight:700;line-height:1.6;margin:8px 0 0}
.contact-form-input [aria-invalid="true"]{outline:2px solid #c62828;outline-offset:0}
.contact-status{color:#c62828;font-size:1.4rem;font-weight:700;margin:20px 0 0;text-align:center}
.contact-status:empty{display:none}

/* 確認画面 */
.contact-confirm:focus{outline:none}
.contact-confirm-list{margin:0}
.contact-confirm-row{border-bottom:1px solid #eee;display:flex;padding:28px 0}
.contact-confirm-row:first-child{border-top:1px solid #eee}
.contact-confirm-row dt{color:#221715;font-size:1.4rem;font-weight:700;min-width:240px;width:240px}
.contact-confirm-row dd{color:#221715;flex:1;font-size:1.4rem;line-height:1.8;margin:0;overflow-wrap:anywhere;white-space:pre-wrap}
.contact-confirm-agree{color:#221715;font-size:1.4rem;margin:28px 0 0}
.contact-confirm-btns{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}
.contact-back-btn{background:#fff;border:2px solid #221715;border-radius:0;color:#221715;cursor:pointer;display:inline-block;font-size:1.6rem;font-weight:700;letter-spacing:2px;min-width:280px;padding:16px 60px;transition:background .3s,color .3s}
.contact-back-btn:hover{background:#221715;color:#fff}
.contact-submit-btn:disabled,.contact-back-btn:disabled{cursor:default;opacity:.6}
.contact-submit-btn:disabled:hover{background:#ffe402;color:#221715}
.contact-back-btn:disabled:hover{background:#fff;color:#221715}

/* ハニーポット（人には見えない欄。画面外に配置） */
.contact-hp{height:1px;left:-9999px;overflow:hidden;position:absolute;top:auto;width:1px}

/* 送信用の非表示 iframe */
.contact-hidden-iframe{border:0;display:none;height:0;width:0}

@media screen and (max-width:768px){
.contact-form{scroll-margin-top:80px}
/* sub.css では PC 幅にしか無い「必須」と送信ボタンの見た目を、スマホ幅にも付ける（値は sub.css の PC 幅と同じ） */
.contact-required{background:#ffe402;border-radius:3px;color:#221715;display:inline-block;font-weight:700;line-height:1.6}
.contact-submit-btn{background:#ffe402;border:none;border-radius:0;color:#221715;cursor:pointer;font-weight:700;letter-spacing:2px;transition:background .3s,color .3s}
.contact-submit-btn:hover{background:#221715;color:#ffe402}
.contact-confirm-row{flex-direction:column;gap:10px;padding:20px 0}
.contact-confirm-row dt{font-size:1.3rem;min-width:0;width:auto}
.contact-confirm-agree{font-size:1.3rem}
.contact-confirm-btns{flex-direction:column-reverse;gap:12px}
.contact-back-btn{font-size:1.5rem;min-width:auto;padding:14px 40px;width:100%}
}