/* -------------------------------------------------- */
/* フォーム */
/* -------------------------------------------------- */

/* ベース */
section.contents { padding-top:80px; margin-bottom:35px; }
section.contents form { margin-bottom:24px; }

/* 見出し */
.img-title { margin-bottom:40px; }

/* フォーム項目 */
.form input[type="text"], .form input[type="email"], .form textarea { background-color:#ccc; border-radius:4px; border:1px solid var(--bk); padding:5px; width:100%; }
.form input[type="text"]:focus, .form input[type="email"]:focus, .form textarea:focus { background-color:var(--wh); }

/* フォーム配置 */
form div.form-content { gap:16px; margin-bottom:24px; }
.form-block { gap:4px; }

/* テキスト */
.form-block p { font-weight:700; line-height:200%; }
.form-block p.answer { font-weight:500; }
.msg { color:#f00; }
p.attention { color:var(--or-2); font-size:18px; font-weight:700; margin-bottom:40px; }

/* ボタン */
p.form-button .img-btn { aspect-ratio:196/54px; border:none; transition:.3s; height:54px; width:194px; }
p.form-button .img-btn.conf-button { background-image:url('../img/form/conf-ov.png'); }
p.form-button .img-btn.back-button { background-image:url('../img/form/back-ov.png'); }
p.form-button .img-btn img { aspect-ratio:196/54px; transition:.3s; height:54px; width:194px; }
p.form-button .img-btn:hover img { opacity:0; transition:.3s; }

/* -------------------------------------------------- */
/* 個人情報の取り扱い */
/* -------------------------------------------------- */

/* ベース */
p.privacy-button { font-size:12px; font-weight:400; line-height:20px; }

/* -------------------------------------------------- */
/* モーダルウインドウ */
/* -------------------------------------------------- */

/* ベース */
.modal { align-items:center; backdrop-filter:blur(6px); display:none; justify-content:center; position:fixed; top:50%; left:50%; transform:translateY(-50%) translateX(-50%);  max-height:100%; height:100vh; width:100vw; z-index:10000; }
.modal-content { background-color:var(--wh); border-radius:24px; box-shadow:2px 2px 3px var(--bk); padding:40px 20px; position:relative; overflow-y:scroll; max-height:75vh; height:auto; width:90vw; }
.modal-close { cursor:pointer; font-size:24px; font-weight:700; transform:translateY(calc( -37.5vh + 10px )); position:fixed; top:50%; right:30px; }

/* 要素配置 */
.modal-content div.flex { gap:24px; }

/* テキスト */
.modal-content p { font-size:14px; font-weight:400; line-height:32px; }

/* 見出し */
.contact-text h3 { align-items:center; background-color:var(--bl); border-radius:40px; color:var(--wh); font-size:16px; font-weight:700;  justify-content:center; line-height:32px; margin-bottom:8px; height:35px; width:85px; }

@container( min-width:1000px ) {

/* ベース */
.modal-content { overflow:auto; padding:40px 80px; max-height:75vh; height:auto; max-width:800px; width:90vw; }
.modal-close { font-size:30px; top:50%; left:50%; transform:translateY( calc( -37.5vh + 25px ) ) translateX(350px); right:auto; }

/* テキスト */
.modal-content p { font-size:16px; }

}