@charset "utf-8";

/* ----------------------------------------------------------
    リセット / 新要素設定
------------------------------------------------------------- */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, blockquote, pre, code, form, fieldset, legend, table, th, td, caption, a, article, aside,
  nav, section, figure, figcaption, footer, header, main, audio, canvas, video, menu, details {
      margin: 0;
      padding: 0;
      background: transparent;
      font-size: 100%;
      vertical-align: baseline;
  }
  fieldset, legend, img { border: 0; }
  article, aside, nav, section, figure, figcaption, footer, header, main, menu, details { display: block; }
  audio:not([controls]) { display: none; }
  [hidden] { display: none; }
  *, *:before, *:after { box-sizing: border-box; }
  
  /* ----- デザイントークン（LP準拠） ----- */
  :root {
      --ink: #18262F;
      --navy: #12304A;
      --navy2: #1C4468;
      --navy-deep: #0B1D2E;
      --green: #2E6B57;
      --green-soft: #E9F3ED;
      --terra: #C0764C;
      --mute: #5C6A75;
      --line: #E7DFCE;
      --line-cool: #E1E8EE;
      --cream: #FBF6EB;
      --sun: #D6A24A;
      --sans: "Noto Sans JP", sans-serif;
      --disp: "Zen Kaku Gothic New", sans-serif;
      --serif: "Zen Old Mincho", serif;
      --radius: 18px;
      --radius-s: 12px;
      --shadow: 0 26px 60px -22px rgba(18, 48, 74, .30);
      --shadow-sm: 0 10px 30px -14px rgba(18, 48, 74, .22);
  }

  /* ----- ベース ----- */
  html {
      overflow-y: scroll;
      -webkit-text-size-adjust: 100%;
  }
  body {
      background: var(--cream);
      background-image:
          radial-gradient(70% 90% at 88% 0%, rgba(46, 107, 87, .08), transparent 60%),
          radial-gradient(60% 80% at 6% 100%, rgba(192, 118, 76, .09), transparent 60%);
      background-attachment: fixed;
      color: var(--ink);
      font-family: var(--sans);
      font-size: 15px;
      line-height: 1.85;
      letter-spacing: .01em;
      word-wrap: break-word;
      -webkit-font-smoothing: antialiased;
      padding: 0 16px;
  }
  
  /* ----- 要素 ----- */
  h1, h2, h3, h4, h5, h6 {
      font-family: var(--disp);
      font-weight: 700;
      line-height: 1.4;
      color: var(--ink);                                                                                                                                   
  }
  p { margin: 0 0 1em; }
  ul, ol { list-style: none; }
  dt { font-weight: bold; }
  hr {
      display: block;
      height: 1px;
      margin: 1em 0;
      padding: 0;
      border: 0;
      border-top: 1px solid var(--line);
  }
  pre {
      font-family: monospace, serif;
      white-space: pre-wrap;
      word-wrap: break-word;
  }
  figure { margin: 0 0 1em; }
  
  a { color: var(--green); }
  a:link, a:visited { text-decoration: underline; text-decoration-color: rgba(46, 107, 87, .45); }
  a:hover, a:active { text-decoration: none; color: var(--navy); }
  a:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; border-radius: 6px; }

  img { vertical-align: middle; max-width: 100%; }

  address, cite, em, dfn, i, var { font-style: normal; }
  em, strong, b { font-weight: bold; }
  code, samp, kbd { font-family: monospace, sans-serif; }
  sup { vertical-align: text-top; }
  sub { vertical-align: text-bottom; }
  del { text-decoration: line-through; }

  table { border-collapse: collapse; border-spacing: 0; }
  th, td { text-align: left; }
  th { font-weight: bold; }                                                                                                                                
  caption { font-weight: normal; text-align: left; }

  /* ----- フォーム系 ----- */
  input, textarea, select {
      margin: 0;
      font-family: inherit;
      font-size: 15px;
  }
  input, button { line-height: normal; vertical-align: middle; }

  input[type=text],
  input[type=password],
  input[type=email],
  input[type=tel],
  input[type=url],
  input[type=number],
  textarea {
      width: 100%;
      max-width: 420px;
      padding: 11px 14px;
      background: #fff;
      color: var(--ink);
      border: 1.5px solid var(--line-cool);
      border-radius: 10px;
      transition: border-color .2s, box-shadow .2s;
  }
  input[type=text]:focus,
  input[type=password]:focus,
  input[type=email]:focus,                                                                                                                                 
  input[type=tel]:focus,
  input[type=url]:focus,
  input[type=number]:focus,
  textarea:focus,
  select:focus {
      outline: none;
      border-color: var(--green);                                                                                                                          
      box-shadow: 0 0 0 3px rgba(46, 107, 87, .15);
  }

  textarea {
      max-width: 100%;
      min-height: 140px;
      overflow: auto;
      vertical-align: top;
  }
  select {
      padding: 10px 14px;
      background: #fff;
      color: var(--ink);
      border: 1.5px solid var(--line-cool);
      border-radius: 10px;                                                                                                                                 
      line-height: normal;
  }
  input[type=radio], input[type=checkbox] {
      accent-color: var(--green);
      width: 17px;
      height: 17px;
      cursor: pointer;
      margin-right: 4px;
  }
  label { cursor: pointer; }
  legend { color: var(--ink); }
  
  input[type=button], input[type=submit] { cursor: pointer; }
  input[type=submit]:disabled,
  input[type=button]:disabled,
  input[type=checkbox]:disabled { cursor: default; opacity: .5; }

  /* 送信・確認ボタン（LPのbtn-primary準拠） */
  input[type=submit] {
      -webkit-appearance: none;
      appearance: none;
      font-family: var(--disp);
      font-weight: 700;
      font-size: 16px;
      letter-spacing: .04em;
      color: #fff;
      padding: 15px 44px;
      border: 0;
      border-radius: 12px;
      background: linear-gradient(140deg, var(--navy2), var(--navy) 60%, var(--navy-deep));
      box-shadow: 0 16px 34px -14px rgba(18, 48, 74, .65), inset 0 1px 0 rgba(255, 255, 255, .14);
      transition: transform .18s, box-shadow .25s;
  }
  input[type=submit]:hover {
      transform: translateY(-2px);                                                                                                                         
      box-shadow: 0 22px 42px -14px rgba(18, 48, 74, .7);
  }

  /* 確認画面の「戻る」等、複数ボタン併存時の間隔 */
  .button_box input[type=submit] { margin: 4px 6px; }

  /* ----- 汎用（システム出力用に維持） ----- */
  .m0{margin:0!important}.m5{margin:5px!important}.m10{margin:10px!important}.m15{margin:15px!important}.m20{margin:20px!important}.m25{margin:25px!important}.m
  30{margin:30px!important}.m35{margin:35px!important}.m40{margin:40px!important}
  .mt0{margin-top:0!important}.mt5{margin-top:5px!important}.mt10{margin-top:10px!important}.mt15{margin-top:15px!important}.mt20{margin-top:20px!important}.mt2
  5{margin-top:25px!important}.mt30{margin-top:30px!important}.mt35{margin-top:35px!important}.mt40{margin-top:40px!important}.mt45{margin-top:45px!important}.m
  t50{margin-top:50px!important}
  .mb0{margin-bottom:0!important}.mb5{margin-bottom:5px!important}.mb10{margin-bottom:10px!important}.mb15{margin-bottom:15px!important}.mb20{margin-bottom:20px
  !important}.mb25{margin-bottom:25px!important}.mb30{margin-bottom:30px!important}.mb35{margin-bottom:35px!important}.mb40{margin-bottom:40px!important}.mb45{m
  argin-bottom:45px!important}.mb50{margin-bottom:50px!important}
  .ml0{margin-left:0!important}.ml5{margin-left:5px!important}.ml10{margin-left:10px!important}.ml15{margin-left:15px!important}.ml20{margin-left:20px!important
  }.ml25{margin-left:25px!important}.ml30{margin-left:30px!important}.ml35{margin-left:35px!important}.ml40{margin-left:40px!important}.ml45{margin-left:45px!im
  portant}.ml50{margin-left:50px!important}
  .mr0{margin-right:0!important}.mr5{margin-right:5px!important}.mr10{margin-right:10px!important}.mr15{margin-right:15px!important}.mr20{margin-right:20px!impo
  rtant}.mr25{margin-right:25px!important}.mr30{margin-right:30px!important}.mr35{margin-right:35px!important}.mr40{margin-right:40px!important}.mr45{margin-rig
  ht:45px!important}.mr50{margin-right:50px!important}
  .p0{padding:0!important}.p5{padding:5px!important}.p10{padding:10px!important}.p15{padding:15px!important}.p20{padding:20px!important}.p25{padding:25px!import
  ant}.p30{padding:30px!important}.p35{padding:35px!important}.p40{padding:40px!important}.p45{padding:45px!important}.p50{padding:50px!important}
  .pt0{padding-top:0!important}.pt5{padding-top:5px!important}.pt10{padding-top:10px!important}.pt15{padding-top:15px!important}.pt20{padding-top:20px!important
  }.pt25{padding-top:25px!important}.pt30{padding-top:30px!important}.pt35{padding-top:35px!important}.pt40{padding-top:40px!important}.pt45{padding-top:45px!im
  portant}.pt50{padding-top:50px!important}
  .pb0{padding-bottom:0!important}.pb5{padding-bottom:5px!important}.pb10{padding-bottom:10px!important}.pb15{padding-bottom:15px!important}.pb20{padding-bottom
  :20px!important}.pb25{padding-bottom:25px!important}.pb30{padding-bottom:30px!important}.pb35{padding-bottom:35px!important}.pb40{padding-bottom:40px!importan
  t}.pb45{padding-bottom:45px!important}.pb50{padding-bottom:50px!important}
  .pl0{padding-left:0!important}.pl5{padding-left:5px!important}.pl10{padding-left:10px!important}.pl15{padding-left:15px!important}.pl20{padding-left:20px!impo
  rtant}.pl25{padding-left:25px!important}.pl30{padding-left:30px!important}.pl35{padding-left:35px!important}.pl40{padding-left:40px!important}.pl45{padding-le
  ft:45px!important}.pl50{padding-left:50px!important}
  .pr0{padding-right:0!important}.pr5{padding-right:5px!important}.pr10{padding-right:10px!important}.pr15{padding-right:15px!important}.pr20{padding-right:20px
  !important}.pr25{padding-right:25px!important}.pr30{padding-right:30px!important}.pr35{padding-right:35px!important}.pr40{padding-right:40px!important}.pr45{p
  adding-right:45px!important}.pr50{padding-right:50px!important}
  .w5per{width:5%!important}.w10per{width:10%!important}.w15per{width:15%!important}.w20per{width:20%!important}.w25per{width:25%!important}.w30per{width:30%!im
  portant}.w35per{width:35%!important}.w40per{width:40%!important}.w45per{width:45%!important}.w50per{width:50%!important}.w55per{width:55%!important}.w60per{wi
  dth:60%!important}.w65per{width:65%!important}.w70per{width:70%!important}.w75per{width:75%!important}.w80per{width:80%!important}.w85per{width:85%!important}
  .w90per{width:90%!important}.w95per{width:95%!important}.w100per{width:100%!important}
  .fl{float:left!important}.fr{float:right!important}
  .tal{text-align:left!important}.tar{text-align:right!important}.tac{text-align:center!important}
  .breakAll{word-break:break-all!important}
  .dispN{display:none!important}.dispI{display:inline!important}.dispIB{display:inline-block!important}.dispB{display:block!important}.dispF{display:flex!import
  ant}
  .fontNormal{font-weight:normal!important}.fontBold{font-weight:bold!important}
  .font10{font-size:10px!important}.font12{font-size:12px!important}.font14{font-size:14px!important}
  .colorBlack{color:#000}
  .clear,.cf{clear:both}
  .clearfix:before,.clearfix:after,.cf:before,.cf:after{content:" ";display:table}
  .clearfix:after,.cf:after{clear:both}

  /* ボタンを囲うclassタグ */
  .button_box {
      clear: both;
      padding: 14px 8px 4px;
      text-align: center;                                                                                                                                  
  }

  /* 左詰の文字を表示するためのclassタグ */
  .left_txt { text-align: left; }

  /* ----- メインコンテンツ ----- */
  #wrapper {
      max-width: 720px;
      width: 100%;
      margin: 36px auto 60px;
      background: #fff;
      border: 1px solid rgba(120, 100, 70, .14);
      border-radius: var(--radius);
      box-shadow: var(--shadow-sm);
      overflow: hidden;
  }
  
  /* ブランドヘッダー（LPヘッダー準拠） */
  #form-brand {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 18px 28px;
      background: rgba(251, 246, 235, .8);
      border-bottom: 1px solid rgba(120, 100, 70, .12);
  }
  #form-brand .brand-mark {
      width: 40px;
      height: 40px;
      border-radius: 12px;
      background: linear-gradient(145deg, var(--navy2), var(--navy-deep));
      display: grid;
      place-items: center;
      flex: none;
      box-shadow: 0 6px 16px -6px rgba(18, 48, 74, .6), inset 0 1px 0 rgba(255, 255, 255, .15);
  }
  #form-brand .brand-name {
      font-family: var(--disp);
      font-weight: 900;
      font-size: 18px;
      color: var(--ink);
      letter-spacing: .02em;
      line-height: 1.25;
  }
  #form-brand .brand-name small {                                                                                                                          
      display: block;
      font-family: var(--serif);
      font-weight: 600;
      font-size: 10px;
      letter-spacing: .18em;
      color: var(--green);                                                                                                                                 
  }

  #header { padding: 40px 25px; }

  .red_txt {
      color: #C0392B;
      font-weight: 500;
  }
  
  /* 説明文を表示するためのタグ */
  #txt_explain {
      color: var(--mute);
      font-size: 14px;
      margin-bottom: 18px;
  }

  #footer {
      margin-top: 40px;
      padding: 15px 0;
      background: var(--navy-deep);
      color: #8FA6B5;
      text-align: center;
      font-size: 12px;
  }
  
  #main { padding: 30px 28px 26px; }

  .section { margin-bottom: 40px; }
  .section:last-child { margin-bottom: 0; }
  
  /* フォーム名（見出し） */
  .section__ttl {
      position: relative;
      margin-bottom: 22px;
      padding: 0 0 14px;
      font-family: var(--disp);
      font-weight: 900;
      font-size: 24px;
      letter-spacing: .01em;
      color: var(--ink);
      background: transparent;
      border-bottom: 1px solid var(--line);                                                                                                                
      word-break: keep-all;
      overflow-wrap: break-word;
  }
  .section__ttl:after {
      content: "";
      position: absolute;                                                                                                                                  
      left: 0;
      bottom: -1px;
      width: 64px;
      height: 3px;
      border-radius: 2px;
      background: linear-gradient(90deg, var(--green), rgba(46, 107, 87, .2));
  }
  .section__body { padding: 0; }

  .block { margin-bottom: 15px; }
  .block:last-child { margin-bottom: 0; }                                                                                                                  
  .block__ttl {
      margin-bottom: 10px;
      font-size: 16px;
      font-weight: bold;
  }
  
  /* 入力テーブル */
  .table {
      width: 100%;
      margin-bottom: 15px;
      border: 1px solid var(--line-cool);
      border-radius: var(--radius-s);
      overflow: hidden;
      background: #fff;
      box-shadow: 0 4px 14px -10px rgba(18, 48, 74, .18);
  }
  .table th {
      width: 32%;
      padding: 16px 18px;                                                                                                                                  
      background: #F6F9F7;
      color: var(--navy);
      border-bottom: 1px solid var(--line-cool);
      border-right: 1px solid var(--line-cool);
      font-family: var(--disp);
      font-weight: 700;
      font-size: 13.5px;
      letter-spacing: .02em;
      vertical-align: top;                                                                                                                                 
  }
  .table td {
      padding: 14px 18px;
      background: #fff;
      border-bottom: 1px solid var(--line-cool);
      color: var(--ink);
      font-size: 14px;
  }
  .table tr:last-child th,
  .table tr:last-child td { border-bottom: none; }

  /* サイトへ戻るリンク（LPのbtn-ghost準拠） */
  .back-link {
      display: inline-block;
      font-family: var(--disp);
      font-weight: 700;
      font-size: 14px;
      color: var(--navy);
      padding: 11px 22px;
      border-radius: 12px;
      border: 1.5px solid #CDBE9E;
      background: rgba(251, 246, 235, .6);
      text-decoration: none !important;
      transition: border-color .2s, background .2s;
  }
  .back-link:hover {
      border-color: var(--navy);
      background: var(--cream);
      color: var(--navy);
  }

  /* ----- スマホ対応 ----- */                                                                                                                             
  @media (max-width: 640px) {
      body { padding: 0 10px; }
      #wrapper { margin: 18px auto 40px; }
      #main { padding: 22px 18px 20px; }
      #form-brand { padding: 14px 18px; }
      .section__ttl { font-size: 20px; }

      /* th/tdを縦積みに */
      .table th, .table td {                                                                                                                               
          display: block;
          width: 100%;
          border-right: none;
      }
      .table th {
          padding: 10px 16px;
          border-bottom: none;
      }
      .table td {
          padding: 4px 16px 16px;
          border-bottom: 1px solid var(--line-cool);
      }
      .table tr:last-child td { border-bottom: none; }
  
      input[type=text],
      input[type=password],
      input[type=email],
      input[type=tel],
      input[type=url],
      input[type=number] { max-width: 100%; }
      input[type=submit] { width: 100%; }
  }

  @media (prefers-reduced-motion: reduce) {
      * { transition: none !important; }                                                                                                                   
  }