/* RESET CSS */
article, aside, details, figcaption, figure, footer, header, hgroup, img, menu, nav, section {
  display: block;
}
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, i, frame, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}
:root {
  font-size: 10px; /* 1rem = 10pxに調整 */
}
/* ---------------------------------------------------
・このCSSはPCとSPの表示比率を合わせています。
・サイズの単位は原則vwにしてください。
---------------------------------------------------- */
.parent-container {
  width: 60rem; /* 親要素の幅を指定 */
  max-width: 100%; /* 横幅が画面幅を超えないように制限 */
}
iframe {
  width: 100%; /* 親要素に対して100% */
  height: calc(100% * 0.5625); /* 16:9比率 */
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
table + p {
  margin-top: 2rem;
}
img {
  padding: 0;
  max-width: 100%;
  height: auto;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
a[href^="tel:"] {
  pointer-events: none;
  text-decoration: none;
  color: #666;
}
/*--------Basic--------*/
.iframe_wrap {
  width: 550px;
  height: 400vh;
  border: 1px solid #ccc;
  margin: 0 auto;
}
.small {
  font-size: 60%;
}
.large {
  font-size: 130%;
}
.top {
  margin-top: 2vw;
}
.souki {
  width: 100%;
}
.souki_wrap {
  width: 100%;
  margin: 0 auto 4vw;
  background: linear-gradient(90deg, rgba(255, 200, 123, 1) 0%, rgba(255, 237, 185, 1) 50%, rgba(255, 200, 123, 1) 100%);
  border-radius: 3vw;
  padding: 6px;
}
.souki_wrap:last-child {
  margin-bottom: 0;
}
.souki_notice {
  width: 90%;
  margin: 2vw auto 0;
  font-size: 2.5vw;
  line-height: 1.5;
  color: #8A8A8A;
  text-indent: -1em;
  padding-left: 1em;
}
.souki_notice + .souki_notice {
  margin: 0 auto 0;
}
.souki_wrap_block {
  background: #ffffff;
  border-radius: 3vw;
  padding-bottom: 4vw;
}
.souki_wrap_title {
  background: linear-gradient(90deg, rgba(255, 200, 123, 1) 0%, rgba(255, 237, 185, 1) 50%, rgba(255, 200, 123, 1) 100%);
  border-radius: 2vw 2vw 0vw 0vw;
  text-align: center;
}
.souki_wrap_title h2 {
  margin: 0;
  padding: 3vw 0 2vw;
  font-size: 5vw;
  background: linear-gradient(90deg, rgba(91, 61, 15, 1) 0%, rgba(183, 127, 19, 1) 50%, rgba(91, 61, 15, 1) 100%);
  -webkit-background-clip: text;
  color: transparent;
  font-family: "Noto serif JP", "Hiragino Mincho ProN", serif;
  font-weight: bold;
  border-radius: 40px;
}
.souki_wrap_list {
  position: relative;
  width: 90%;
  margin: 2vw auto 0;
}
.souki_wrap_list p {
  width: 100%;
}
.souki_wrap_list img {
  width: 100%;
}
.souki_wrap_body {
  position: relative;
  width: 90%;
  margin: 2vw auto 0;
}
.souki_wrap_body img {
  width: 100%;
}
.souki_wrap_body p {
  font-size: 5vw;
  font-weight: bold;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif;
  margin: 0;
  line-height: 1.4;
  color: #303030;
}
.souki_wrap_title h2:before {
  content: '';
  display: inline-block;
  width: 4vw;
  height: 9vw;
  background-image: url(../img/souki_sp_title01.png);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
}
.souki_wrap_title h2:after {
  content: '';
  display: inline-block;
  width: 4vw;
  height: 9vw;
  background-image: url(../img/souki_sp_title02.png);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
}
.souki_wrap_top {
  padding: 2vw 0;
}
/*矢印*/
.arrow_box {
  position: relative;
  padding: 1vw 0 3vw;
}
/* 縦線と矢印を描画 */
.arrow_box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 16vw;
  width: 0.5vw; /* 縦線の幅 */
  height: 100%;
  background-color: #333;
  transform: translateX(-50%);
  z-index: 200;
}
.arrow_box::after {
  content: '';
  position: absolute;
  bottom: -3vw; /* 下に配置 */
  left: 16vw;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border: 2vw solid transparent; /* 三角形のベースを透明に */
  border-top: 2vw solid #333; /* 下向き矢印 */
}
.fin {
  width: fit-content !important;
  font-size: 4vw;
  font-weight: bold;
  color: #555555;
  position: relative;
  left: 16vw;
  transform: translateX(-50%);
  margin: 3vw 0 4vw;
}
/*期間終了後表示*/
.image-wrapper {
  position: relative;
}
.image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7); /* 半透明の黒 */
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 5vw;
  font-weight: bold;
  opacity: 0; /* 初期状態は非表示 */
  border-radius: 15px;
  z-index: 500;
}
.expired .overlay {
  opacity: 1; /* 期限が過ぎた場合に表示 */
}