@charset "utf-8";
/* 現行Smoothcontactフォームの計測値に合わせている
   本文 Noto Sans JP / 文字 #555 / 区切り #ccc / ボタン #2E5075・枠#274363
   レイアウト=縦積み / 入力欄の角丸なし / selectのみ radius 4px           */
:root{
  --navy:#2e5075; --navy-b:#274363; --navy-h:#22405f;
  --ink:#555; --line:#ccc; --sub:#888; --err:#c0392b; --soft:#f6f7f9;
}
*{box-sizing:border-box}
body{margin:0;padding:0;background:transparent;color:var(--ink);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium",sans-serif;
  font-size:13px;line-height:1.75;-webkit-text-size-adjust:100%}
.wrap{max-width:100%;margin:0 auto;padding:4px 8px 40px}

.testbar{background:#fff5d6;border:1px solid #e6c65c;color:#7a5b00;border-radius:4px;
  padding:9px 13px;margin:0 0 18px;font-size:12.5px;font-weight:500}

/* --- 1項目 = ラベル(上) + 入力(下) の縦積み。区切りは下線 --- */
.row{display:block;border-bottom:1px solid var(--line);padding:14px 8px}
.row:first-of-type{border-top:1px solid var(--line)}
.lb{font-size:13px;color:var(--ink);margin:0 0 7px;font-weight:500}
.in{display:block}
.req{display:inline-block;margin-left:7px;background:#b8543f;color:#fff;font-size:10.5px;
  font-weight:500;padding:1px 6px;border-radius:2px;vertical-align:1px;letter-spacing:.03em}

/* 住所などのグループ */
.in.group .gsub{display:block;margin-bottom:9px}
.in.group .gsub:last-child{margin-bottom:0}
.gl{display:block;font-size:12px;color:var(--sub);margin:0 0 4px}

input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;padding:8px 13px;border:1px solid var(--line);border-radius:0;
  font-size:16px;font-family:inherit;background:#fff;color:var(--ink);line-height:1.5}
select{border-radius:4px;appearance:none;padding-right:34px;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23888' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:11px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--navy);
  box-shadow:0 0 0 2px rgba(46,80,117,.14)}
textarea{resize:vertical;line-height:1.7}
input.w-zip{max-width:200px}
.zipwrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.zipmsg{font-size:12px;color:var(--sub)}
.zipmsg.ok{color:#2e7d32}.zipmsg.ng{color:var(--err)}

.opts{display:flex;flex-wrap:wrap;gap:6px 20px}
.opt{display:inline-flex;align-items:flex-start;gap:7px;cursor:pointer;font-size:13.5px;padding:3px 0}
.opt input{width:17px;height:17px;margin:2px 0 0;flex:0 0 17px;accent-color:var(--navy);cursor:pointer}
.opt.consent a{color:var(--navy);text-decoration:underline}
.otherinput{flex:1 1 100%;max-width:360px;margin-top:3px}

input[type=file]{width:100%;font-size:13px;padding:9px;border:1px dashed #bbb;border-radius:0;background:var(--soft)}
.note{margin:7px 0 0;font-size:11.5px;color:var(--sub);line-height:1.65}
.fe{margin:6px 0 0;color:var(--err);font-size:12.5px;font-weight:500}

.notice{background:#fdf1ee;border:1px solid #e0b3a8;color:#8c2f22;border-radius:3px;
  padding:11px 14px;margin:0 0 16px;font-size:13px}

.ssl{margin:20px 0 0;padding:10px;background:var(--soft);border:1px solid #e7e9ec;
  font-size:12px;color:var(--sub);text-align:center}
.submit{margin:18px 0 0}
button{width:100%;background:var(--navy);color:#fff;border:1px solid var(--navy-b);border-radius:4px;
  padding:13px 8px;font-size:14px;font-weight:500;letter-spacing:.06em;cursor:pointer;
  font-family:inherit;transition:background .18s}
button:hover{background:var(--navy-h)}
button[disabled]{background:#9aa5b1;border-color:#8b95a1;cursor:default}

.done{text-align:center;padding:36px 12px}
.done h1{font-size:19px;color:var(--navy);margin:0 0 16px;font-weight:500;letter-spacing:.04em}
.done p{margin:0 0 10px;font-size:13.5px}
.receipt{margin-top:20px!important;padding:13px;background:var(--soft);border:1px solid #e7e9ec;font-size:13.5px}
.receipt strong{color:var(--navy);font-size:17px;letter-spacing:.05em}
.done .sub{font-size:12.5px;color:var(--sub)}
.done .warn{margin-top:16px;color:#8a6d00;background:#fff8e1;border:1px solid #f0dfa8;padding:11px;font-size:12.5px}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

@media (max-width:700px){
  .wrap{padding:4px 2px 32px}
  .row{padding:13px 4px}
  .otherinput{max-width:100%}
  input.w-zip{max-width:100%}
}

/* ===== 添付ファイル欄（1つずつ追加・自分で削除できる） ===== */
.filebox{border:1px dashed #bbb;background:var(--soft);padding:14px}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0}
.filebtn{display:inline-block;background:#fff;border:1px solid var(--navy);color:var(--navy);
  border-radius:4px;padding:11px 22px;font-size:14px;cursor:pointer;min-height:44px;
  line-height:22px;transition:background .18s,color .18s;user-select:none}
.filebtn:hover{background:var(--navy);color:#fff}
.vh:focus + .filebtn{box-shadow:0 0 0 3px rgba(46,80,117,.25)}
.filebtn.off{opacity:.45;cursor:not-allowed;border-color:#aaa;color:#999}
.filebtn.off:hover{background:#fff;color:#999}
.filehint{margin:8px 0 0;font-size:11.5px;color:var(--sub)}

.filelist{list-style:none;margin:12px 0 0;padding:0;border-top:1px solid #dfe3e7}
.filelist li{display:flex;align-items:center;gap:10px;padding:9px 2px;
  border-bottom:1px solid #e7eaee;font-size:13px}
.filelist .fn{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filelist .fs{flex:0 0 auto;color:var(--sub);font-size:12px}
.filelist li.over{background:#fdf1ee}
.filelist li.over .fn,.filelist li.over .fs{color:var(--err);font-weight:600}
.delbtn{flex:0 0 auto;background:#fff;border:1px solid #c9ced5;color:#666;border-radius:4px;
  min-width:56px;min-height:34px;padding:6px 12px;font-size:12.5px;cursor:pointer;
  font-family:inherit;line-height:1.2}
.delbtn:hover{background:#fdf1ee;border-color:#c98b7f;color:var(--err)}
.filesum{margin:10px 0 0;font-size:12.5px;color:var(--sub)}
.filesum.ng{color:var(--err);font-weight:600}
.filesum b{color:var(--ink)}

@media (max-width:700px){
  .filebtn{display:block;width:100%;text-align:center;padding:13px;font-size:15px}
  .filelist li{flex-wrap:wrap;gap:6px 10px;padding:10px 2px}
  .filelist .fn{flex:1 1 100%}
  .filelist .fs{flex:1 1 auto}
  .delbtn{min-width:72px;min-height:38px}
}