/* チェック柄の背景（全体） */
.individual {
  margin: 0;
  min-height: 100vh;
  /* 色は好みで変更 */
  background-image:
linear-gradient(
    45deg,
    rgba(255, 238, 246, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(255, 238, 246, 0.4) 50%,
    rgba(255, 238, 246, 0.4) 75%, transparent 75%, transparent
  ),
  linear-gradient(
    -45deg,
    rgba(255, 238, 246, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(255, 238, 246, 0.4) 50%,
    rgba(255, 238, 246, 0.4) 75%, transparent 75%, transparent
  );
  background-size: 10px 10px;
  background-position: 0 0, 0 0;
  position: relative;
  overflow-x: hidden;
  font-family: sans-serif;
}

/* 上部の桜の枝画像 */
.sakura-branch {
  top: 0;
  left: 0;
  width: 100%;
  height: 560px;     /* 画像の縦サイズに合わせて調整 */
  background: url("../images/sakura-branch.png") no-repeat center top; /* 画像パス */
  background-size: 984px 560px; /* または contain, auto など */
  pointer-events: none;
  z-index: 10;
}
/* 花びらアニメーション用のレイヤー */
.sakura-petals {
  pointer-events: none;
  position: fixed;
  inset: 0;
  overflow: hidden;
  z-index: 5;
}

/* 花びらの共通スタイル */
.sakura-petals span {
  position: absolute;
  top: -5vh;                /* 画面上部の外から降りてくる */
  width: 16px;
  height: 16px;
  background: radial-gradient(circle at 30% 30%, #ffe6f5, #ff9acb);
  border-radius: 70% 30% 70% 30%;
  opacity: 0.8;
  animation-name: fall;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

/* 落下アニメーション */
@keyframes fall {
  0% {
    transform: translate3d(0, 0, 0) rotateZ(0deg) rotateY(0deg);
  }
  100% {
    transform: translate3d(40vw, 110vh, 0) rotateZ(360deg) rotateY(180deg);
  }
}

/* 花びらを複数パターン生成（位置・速度・サイズを変える） */
.sakura-petals span:nth-child(1) {
  left: 5vw;
  animation-duration: 14s;
  animation-delay: 0s;
  transform-origin: -10vw -10vh;
}
.sakura-petals span:nth-child(2) {
  left: 20vw;
  animation-duration: 18s;
  animation-delay: -3s;
  transform-origin: -5vw -20vh;
}
.sakura-petals span:nth-child(3) {
  left: 40vw;
  animation-duration: 16s;
  animation-delay: -5s;
  transform-origin: -15vw -15vh;
}
.sakura-petals span:nth-child(4) {
  left: 60vw;
  animation-duration: 20s;
  animation-delay: -8s;
  transform-origin: -8vw -30vh;
}
.sakura-petals span:nth-child(5) {
  left: 80vw;
  animation-duration: 22s;
  animation-delay: -10s;
  transform-origin: -12vw -25vh;
}

/* 少しサイズ違い */
.sakura-petals span:nth-child(3),
.sakura-petals span:nth-child(5) {
  width: 20px;
  height: 20px;
}

img {
    margin: 0 auto;
}
.inner {
	max-width: 950px;
	margin: auto;
	padding: 0 1rem;
}
.center {
	text-align: center;
}
.bnr_area .p_head_text {
  text-align: center;
  font-size: 3rem;
  margin-bottom: 2rem;
  font-weight: bold;
}
.text-red {
  color: #f7274e;
}
/* btn*/
.check-btn {
  padding: 10px 24px;
  border: none;
  border-radius: 5rem; 
  font-size: 25px;
  cursor: pointer;
    font-weight: bold;

  /* チェック柄背景 */
  background-color: #0eb780;
background-image:
  /* 1枚目 */
linear-gradient(
    45deg,
    rgba(12, 158, 110, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(12, 158, 110, 0.4) 50%,
    rgba(12, 158, 110, 0.4) 75%, transparent 75%, transparent
  ),
  linear-gradient(
    -45deg,
    rgba(12, 158, 110, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(12, 158, 110, 0.4) 50%,
    rgba(12, 158, 110, 0.4) 75%, transparent 75%, transparent
  );
    
background-size: 16px 16px;
background-position: 0 0, 8px 8px; /* ← 2枚目を半分ずらす */
    
  /* ドロップシャドウ */
  box-shadow: 0 4px 0 #076e4c;
}

/* 押したときの表現（お好みで） */
.check-btn:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0 #076e4c;
}
.check-btn a {
    color: #fff;
}
/* btn*/

.individual p {
	font-weight: normal;
}
ul li {
    color: #571628;
}
.main_visu {
}
.individual .cap_text {
    color: #571628;
    font-weight: 1000;
    margin-top: 1.5rem;
    font-size: 2.2rem;
}
.prize_area {
    padding: 2rem 0;
}
.prize {
    background-color: #fff;
    border-radius: 2.5rem;
    padding: 2rem 0;
}
.mall_title {
    background-color: #fdbbd8;
    padding: 0.5rem;
    margin: 2rem 1.5rem;
    border-radius: 2rem;
}
/* 初期状態では閉じる */
.accordion dd {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.6s ease;
}

/* 開いた状態 */
.accordion dd.is-open {
  max-height: 1000px; /* 中身の高さより少し大きめにしておく */
}

/* 見出しカーソル */
.accordion dt {
  cursor: pointer;
}
/* dt をマークを置きやすい形に */
.accordion dt {
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between; /* 左:画像 右:マーク */
}

/* 桜の背景（丸い台座） */
.accordion dt::before {
  content: "";
  position: absolute;
  right: 16px;          /* 右端からの位置 */
  top: 50%;
  transform: translateY(-50%);
  width: 51px;
  height: 41px;
  background: url("../images/sakura-icon.png") no-repeat center center;
  background-size: contain;
}
/* 三角（▽ / △） */
.accordion dt::after {
  content: "▼";             /* 初期は閉じているので ▽ */
  position: absolute;
  right: 3.25rem;               /* 桜の上に重ねたい位置に調整 */
  top: 55%;
  transform: translateY(-50%);
  font-size: 2rem;
  color: #fff;
  font-weight: bold;
  pointer-events: none;
}

/* dd の開閉アニメ */
.accordion dd {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.6s ease;
}

/* 開いた状態 */
.accordion dd.is-open {
  max-height: 1400px;
}

/* 開いているときは三角を △ に変える */
.accordion dd.is-open + dt::after,
.accordion dt.is-open::after {
  content: "▲";
}
/* 開いているときは dt にクラスを付ける前提に変更 */
.accordion dt.is-open::after {
  content: "▲";
}
.ac_title h3 {
  margin-bottom: 1rem;
  position: relative;
  text-align: center;
  cursor: pointer;
}
/* タイトル行をクリック可能に */
.ac_title h3::before {
  content: "";
  position: absolute;
  top: 35%;
  right: 3rem;
  width: 51px;
  height: 41px;
  background: url("../images/sakura-icon.png") no-repeat center center;
  margin-top: -9px;
  background-size: contain;

}

/* 桜の上に三角マーク */
.accordion .ac_title h3::after {
  content: "▼";                 /* 初期は閉じているので ▽ */
  position: absolute;
  right: 45px;                  /* ::before と同じにして重ねる */
  top: 47%;
  transform: translateY(-50%);
  font-size: 20px;
  color: #fff;
  pointer-events: none;
}

/* 開いているときは △ に */
.accordion .ac_title.is-open h3::after {
  content: "▲";
}

/* アコーディオン本体の開閉 */
.accordion .ac_bottom {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.6s ease;
}
.accordion .ac_bottom .prize_p{
  padding-bottom: 1.5rem;
  border-top: dotted #ffd2e6;
  padding-top: 2rem;
  margin: 2rem;
}
.accordion .ac_bottom.is-open {
  max-height: 1000px;          /* 中身より少し大きめで */
  padding-bottom: 2.5rem;
}
/* btn*/
.entrybtn {
  padding: 10px 24px;
  border: none;
  border-radius: 5rem; 
  font-size: 25px;
  cursor: pointer;
  font-weight: bold;
  background-color: #eb2f4c;
  /* ドロップシャドウ */
  box-shadow: 0 4px 0 #cf2a44;
}

/* 押したときの表現（お好みで） */
.entrybtn:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0 #eb2f4c;
}
.entrybtn a {
    color: #fff;
}
/* btn*/
.attention .accordion {
  padding: 2rem 3.5rem 0;  
  background-color: #efefef;
  border-radius: 2.5rem;
  
}
.attention .ac_title {
  cursor: pointer;
  padding-bottom: 2rem;
}
.attention .accordion .ac_title.is-open {
  padding-bottom: 0;
}
.general-list.li-detail ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.attentitle {
  position: relative;
}
.attention .ac_title h3::before {
  content: "";
  position: absolute;
  top: 35%;
  right: 3rem;
  width: 51px;
  height: 41px;
  background: none;
  margin-top: -9px;
  background-size: contain;

}
.attention .accordion .ac_title h3::after {
  color: #571628;
}
/* 開いているときは △ に */
.attentitle.is-open::after {
  content: "▲";
}

.general-list.li-detail li {
  text-indent: -1em;      /* 1行目を左に戻す */
  padding-left: 1em;      /* 全体を右に寄せる（インデント幅） */
}

.general-list.li-detail .pre {
  margin-right: .3em;     /* 「・」と文字の間隔調整（任意） */
}
.individual .attentitle {
  font-weight: bold;
  font-size: 1.8rem;
  color: #571628;
}
.inner.general .link a {
  background: rgba(0, 0, 0, 0) url("../images/ic_arrow.png") no-repeat scroll 100% 50% / auto 0.6em;
  color: #571628;
  margin-right: .2em;
  padding-right: 0.8em;
  text-decoration: none;
}
.inner.general .attention .link a {
    color: #f7274e;
}
/* POPUP */
.main_contents {
  margin: 0;
  min-height: 100vh;
  /* 色は好みで変更 */
  background-image:
linear-gradient(
    45deg,
    rgba(255, 238, 246, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(255, 238, 246, 0.4) 50%,
    rgba(255, 238, 246, 0.4) 75%, transparent 75%, transparent
  ),
  linear-gradient(
    -45deg,
    rgba(255, 238, 246, 0.4) 25%, transparent 25%,
    transparent 50%, rgba(255, 238, 246, 0.4) 50%,
    rgba(255, 238, 246, 0.4) 75%, transparent 75%, transparent
  );
  background-size: 10px 10px;
  background-position: 0 0, 0 0;
  position: relative;
  overflow-x: hidden;
  font-family: sans-serif;
}
.main_contents h1 {
    color: #571628;
    margin-top: 30px;
    font-size: 2.2rem;
}
.main_contents .inner .general .general-list .li-dots {
    color: #571628;
    margin-top: 20px;
}
.main_contents section {
    margin-top: 20px;
}
.individual .datetxt {
    font-weight: bold;
    color: #f7274e;
}
.inner.general .datetxt .link a {
    font-weight: bold;
    color: #f7274e;
    text-decoration: underline;
}
@media screen and (max-width:690px){
	.bnr_area .p_head_text {
		font-size: 1.8rem;
		margin-bottom: 1rem;
	  }
.sakura-branch {
  width: 100%;
  height: auto;     /* 画像の縦サイズに合わせて調整 */
  background-size: contain; /* または contain, auto など */
}
/* btn*/
.entrybtn {
  padding: 1rem 3rem;
  font-size: 20px;
  font-weight: bold;
}
/* btn*/
.note_list li {
   font-size: 1.4rem;
}
.individual .cap_text {
    margin-top: 1.5rem;
    font-size: 1.8rem;
}
.check-btn {
  padding: 10px 40px;
  font-size: 20px;
}
    .mt0 {
        margin-top: -2rem;
    }
.accordion dt::before {
  right: 16px;          /* 右端からの位置 */
  top: 50%;
  width: 20px;
}
/* 三角（▽ / △） */
.accordion dt::after {
  content: "▼";             /* 初期は閉じているので ▽ */
  position: absolute;
  right: 2.1rem;               /* 桜の上に重ねたい位置に調整 */
  top: 55%;
  transform: translateY(-50%);
  font-size: 1rem;
}
    .accordion + .accordion {
        margin-top: -2.5rem;
    }   
.prize {
    padding: 1rem 1rem;
}
.ac_title h3::before {
  top: 6%;
  right: 1rem;
  width: 20px;
}

/* 桜の上に三角マーク */
.accordion .ac_title h3::after {
  right: 15px;                  /* ::before と同じにして重ねる */
  top: 31%;
  font-size: 1rem;
  color: #fff;
}
.attention .accordion {
  padding: 2rem 0.5rem 0;  
  
}
.attention .ac_title {
  cursor: pointer;
  padding-bottom: 2rem;
}
.accordion .ac_bottom.is-open {
  max-height: 1170px;          /* 中身より少し大きめで */
}
    .tokuten02 img {
        padding-bottom: 2rem;
    }
}