@charset "UTF-8";
/* CSS Document */

/* ==========================================================================
   2. Design System Variables
   ========================================================================== */
:root {
  /* --- 設計の核 --- */
  --base-unit: 16px; 
  --ratio: 1.618;

  /* --- スケール倍率 --- */
  --scale-xs: 0.75;
  --scale-sm: 0.875;
  --scale-lg: 1.25;
  --scale-xl: 1.5;

  /* --- タイポグラフィ（流動的） --- */
  --font-size-xl:   clamp(20px, 4vw + 4px, calc(var(--base-unit) * var(--scale-xl)));
  --font-size-lg:   clamp(18px, 2vw + 8px, calc(var(--base-unit) * var(--scale-lg)));
  --font-size-base: clamp(15px, 1vw + 12px, var(--base-unit));
  --font-size-sm:   clamp(13px, 0.5vw + 11px, calc(var(--base-unit) * var(--scale-sm)));
  --font-size-xs:   clamp(11px, 0.5vw + 9px,  calc(var(--base-unit) * var(--scale-xs)));

  /* --- 余白（文字数ベース / 流動的） --- */
  --space-unit: clamp(0.9rem, 0.8rem + 0.5vw, var(--base-unit));
  --s-mt-05: calc(var(--space-unit) * 0.5);
  --s-mt-10: var(--space-unit);
  --s-mt-15: calc(var(--space-unit) * 1.5);
  --s-mt-20: calc(var(--space-unit) * 2.0);
  --s-mt-25: calc(var(--space-unit) * 2.5);
  --s-mt-30: calc(var(--space-unit) * 3.0);
  --s-mt-40: calc(var(--space-unit) * 4.0);
  --s-mt-50: calc(var(--space-unit) * 5.0);
  --s-mt-60: calc(var(--space-unit) * 6.0);
  --s-mt-70: calc(var(--space-unit) * 7.0);
  --s-mt-80: calc(var(--space-unit) * 8.0);
  --s-mt-90: calc(var(--space-unit) * 9.0);
  --s-mt-100: calc(var(--space-unit) * 10.0);


  /* --- レイアウト設定 --- */
  --container-max-width: 1000px;
  --gutter: calc(var(--base-unit) * var(--ratio)); 
}


/* --- ぶら下げインデント --- */
[class*="indent-"] {
  display: block;
}
.indent-1   { padding-left: 1em;   text-indent: -1em; }
.indent-1-5 { padding-left: 1.5em; text-indent: -1.5em; }
.indent-2   { padding-left: 2em;   text-indent: -2em; }

/* --- 上下マージン（!importantで確実に制御） --- */
.mt-05 { margin-top: var(--s-mt-05) !important; }
.mt-10 { margin-top: var(--s-mt-10) !important; }
.mt-20 { margin-top: var(--s-mt-20) !important; }
.mt-30 { margin-top: var(--s-mt-30) !important; }
.mt-40 { margin-top: var(--s-mt-40) !important; }
.mt-50 { margin-top: var(--s-mt-50) !important; }
.mt-60 { margin-top: var(--s-mt-60) !important; }
.mt-70 { margin-top: var(--s-mt-70) !important; }
.mt-80 { margin-top: var(--s-mt-80) !important; }
.mt-90 { margin-top: var(--s-mt-90) !important; }
.mt-100 { margin-top: var(--s-mt-100) !important; }

.mb-05 { margin-bottom: var(--s-mt-05) !important; }
.mb-10 { margin-bottom: var(--s-mt-10) !important; }
.mb-20 { margin-bottom: var(--s-mt-20) !important; }
.mb-30 { margin-bottom: var(--s-mt-30) !important; }
.mb-40 { margin-bottom: var(--s-mt-40) !important; }
.mb-50 { margin-bottom: var(--s-mt-50) !important; }
.mb-60 { margin-bottom: var(--s-mt-60) !important; }
.mb-70 { margin-bottom: var(--s-mt-70) !important; }
.mb-80 { margin-bottom: var(--s-mt-80) !important; }
.mb-90 { margin-bottom: var(--s-mt-90) !important; }
.mb-100 { margin-bottom: var(--s-mt-100) !important; }

/* --- 左右マージン --- */
.mx-auto { display: block; margin-left: auto !important; margin-right: auto !important; }

/* --- セクション・装飾 --- */
.py-section { padding-top: var(--s-mt-30); padding-bottom: var(--s-mt-30); }
.white { color: #ffffff; }
.bg-white { background-color: #ffffff; }
.bg-light { background-color: #f8f9fa; }

/* 変な位置での改行を防ぐ */
span.aks {
  display: inline-block;
}


/* --- 追加スタイル --- */

.form-area a:hover  {
  opacity: 0.8;
  }
.form-area2 a:hover  {
  opacity: 0.8;
  }

#award .form-area2 {
  padding: 10px 0 40px;
  margin: 50px 0 0;
  text-align: center;
  background: url(../img/bg_stripe.png);
}

#award .form-area2 .entry-btn {
  position: relative;
  margin-top: 5px;
  padding: 25px 0;
  display: inline-block;
  width: 455px;
  background: url("../img/entry/btn_form.svg") no-repeat;
  background-size: 100% 100%;
  color: #fff;
  font-size: 20px;
  text-decoration: none;
}

#award .form-area2 a:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 23px;
  width: 12px;
  height: 12px;
  margin: -7px 0 0 0;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media screen and (max-width:768px) {
  #award .form-area2 {
    padding: 10px 15px 40px;
    margin: 20px 0 5%;
  }

  #award .form-area2 .entry-btn {
    padding: 17px 0;
    width: 95%;
    font-size: 16px;
  }
	
  #award .form-area2 a:after {
    right: 14px;
    width: 10px;
    height: 10px;
    margin: -6px 0 0 0;
  }

}