@charset "utf-8";
/* CSS Document 新潟観光DP優待特典 エリアMAP連動アコーディオン */
/* https://www.driveplaza.com/etc/drawari/niigata/ */

/* ▼モバイルファースト (全環境に共通のデザイン) */
/* エリアマップ 背景地図 */
.l-container .c-areaMap {
  position: relative;
  height: auto;
  width: 100%;
  background-size: 100%;
  background-repeat: no-repeat;
  margin: 16px auto 0;
}

.l-container .c-areaMap {
  background-image: url("../../../../../assets/img/etc/drawari/niigata/tokuten/bg_map_tokuten.gif");
  background-color: #e7e7e7;
}

.l-container .c-areaMap::before {
  content: "";
  display: block;
  padding-top: 100%;
}

/* エリアマップ エリア選択ボタン */
.l-container .c-areaMap .c-areaMapBtn {
  display: block;
  position: absolute;
  cursor: pointer;
  transition: 0.4s;
  background-color: #ffffff;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.11);
  border-left: 4px solid #aaaaaa;
  border-radius: 0 0 20px 0;
  padding: 2px 28px 2px 2px;
  font-family: "A+EqpB-游ゴシック体 Pr6N B", "游ゴシック体", YuGothic, "Yu Gothic Medium", "Yu Gothic UI", sans-serif;
  font-weight: normal !important;
  font-size: 1.2rem;
  font-feature-settings: "palt";
}

.l-container .c-areaMapBtn.area01 { border-left-color: #c9ae00; }
.l-container .c-areaMapBtn.area02 { border-left-color: #d71800; }
.l-container .c-areaMapBtn.area03 { border-left-color: #008acf; }
.l-container .c-areaMapBtn.area04 { border-left-color: #00cccc; }
.l-container .c-areaMapBtn.area05 { border-left-color: #ffaa00; }
.l-container .c-areaMapBtn.area06 { border-left-color: #009900; }
.l-container .c-areaMapBtn.area07 { border-left-color: #ef37ad; }
.l-container .c-areaMapBtn.area08 { border-left-color: #8b00c0; }
.l-container .c-areaMapBtn.area09 { border-left-color: #006699; }

.l-container .c-areaMap .c-areaMapBtn a {
  width: 100%;
  height: 100%;
  color: #333333;
}

.l-container .c-areaMap .c-areaMapBtn:after {
  position: absolute;
  right: calc( 0% + 1.0rem );
  color: #333333;
  content: "\f078";
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
}

/* アコーディオン コンテナ */
.l-container .ui-acContainer {
  background-color: #ffffff;
  box-shadow: 1px 1px 16px 0 rgba(0, 0, 0, 0.11);
  border-radius: 0 0 32px 0;
}

/* アコーディオン タイトル */
.l-container .ui-acHeader {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 1.8rem;
  line-height: 1.5;
  margin-top: 24px;
  padding: 1.6rem 5.6rem 1.6rem 1.6rem;
  min-height: 6.4rem;
  border-left: 4px solid #aaaaaa;
}

.l-container .ui-acContainer.area01 .ui-acHeader { border-left-color: #c9ae00; }
.l-container .ui-acContainer.area02 .ui-acHeader { border-left-color: #d71800; }
.l-container .ui-acContainer.area03 .ui-acHeader { border-left-color: #008acf; }
.l-container .ui-acContainer.area04 .ui-acHeader { border-left-color: #00cccc; }
.l-container .ui-acContainer.area05 .ui-acHeader { border-left-color: #ffaa00; }
.l-container .ui-acContainer.area06 .ui-acHeader { border-left-color: #009900; }
.l-container .ui-acContainer.area07 .ui-acHeader { border-left-color: #ef37ad; }
.l-container .ui-acContainer.area08 .ui-acHeader { border-left-color: #8b00c0; }
.l-container .ui-acContainer.area09 .ui-acHeader { border-left-color: #006699; }

.l-container .ui-acHeader::after {
  position: absolute;
  right: calc( 0% + 1.6rem );
  color: #2d720a;
  content: "\f055"; /* ＋ 開く */
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  font-size: 3.2rem;
}

.l-container .ui-acHeader.js-acActive {
  border-bottom: 1px solid #e7e7e7;
}

.l-container .ui-acHeader.js-acActive::after {
  position: absolute;
  right: calc( 0% + 1.6rem );
  color: #b5b5b5;
  content: "\f056"; /* － 閉じる */
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  font-size: 3.2rem;
}

/* アコーディオン コンテンツ */
.l-container .ui-acContents {
  padding: 32px 16px;
}


/* ▼モバイルのみ付け足すデザイン */
@media all and (max-width: 767px) {
  /* エリアマップ エリア選択ボタン 表示位置指定（SP） */
  .l-container .c-areaMap .c-areaMapBtn.area01 { top: 15%; left:  2%; }
  .l-container .c-areaMap .c-areaMapBtn.area02 { top:  5%; left: 45%; }
  .l-container .c-areaMap .c-areaMapBtn.area03 { top: 20%; left: 45%; }
  .l-container .c-areaMap .c-areaMapBtn.area04 { top: 32%; left: 25%; }
  .l-container .c-areaMap .c-areaMapBtn.area05 { top: 45%; left: 15%; }
  .l-container .c-areaMap .c-areaMapBtn.area06 { top: 56%; left: 35%; }
  .l-container .c-areaMap .c-areaMapBtn.area07 { top: 67%; left:  2%; }
  .l-container .c-areaMap .c-areaMapBtn.area08 { top: 80%; left: 10%; }
  .l-container .c-areaMap .c-areaMapBtn.area09 { top: 40%; left: 68%; }

  /* エリアマップ エリア選択ボタン アイコン（SP） */
  .l-container .c-areaMap .c-areaMapBtnIcon img {
    width: 24px;
    height: 24px;
    margin-right: 0.4rem;
  }
}

/* ▼タブレット用として付け足すデザイン */
@media all and (min-width: 768px) {
  /* エリアマップ エリア選択ボタン */
  .l-container .c-areaMap .c-areaMapBtn {
    padding: 4px 32px 4px 4px;
    font-size: 1.4rem;
  }
  /* エリアマップ エリア選択ボタン 末尾テキスト追加（タブレット～PC表示のみ） */
  .l-container .c-areaMap .c-areaMapBtn .c-areaMapBtnName::after {
    content: "エリア";
    font-feature-settings: "palt";
  }
  /* エリアマップ エリア選択ボタン アイコン（タブレット） */
  .l-container .c-areaMap .c-areaMapBtnIcon img {
    width: 32px;
    height: 32px;
    margin-right: 0.4rem;
  }

  /* エリアマップ エリア選択ボタン 表示位置指定（タブレット） */
  .l-container .c-areaMap .c-areaMapBtn.area01 { top: 15%; left: 10%; }
  .l-container .c-areaMap .c-areaMapBtn.area02 { top:  5%; left: 50%; }
  .l-container .c-areaMap .c-areaMapBtn.area03 { top: 20%; left: 45%; }
  .l-container .c-areaMap .c-areaMapBtn.area04 { top: 35%; left: 30%; }
  .l-container .c-areaMap .c-areaMapBtn.area05 { top: 45%; left: 20%; }
  .l-container .c-areaMap .c-areaMapBtn.area06 { top: 56%; left: 40%; }
  .l-container .c-areaMap .c-areaMapBtn.area07 { top: 67%; left: 11%; }
  .l-container .c-areaMap .c-areaMapBtn.area08 { top: 81%; left: 16%; }
  .l-container .c-areaMap .c-areaMapBtn.area09 { top: 40%; left: 68%; }
}

/* ▼PC用として付け足すデザイン */
@media all and (min-width: 960px) {
  /* エリアマップ 背景地図 */
  .l-container .c-areaMap {
    position: relative;
    height: auto;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    margin: 24px auto 0;
  }
  /* エリアマップ エリア選択ボタン */
  .l-container .c-areaMap .c-areaMapBtn {
    padding: 4px 36px 4px 4px;
    font-size: 1.8rem;
  }

  /* エリアマップ エリア選択ボタン 表示位置指定（PC） */
  .l-container .c-areaMap .c-areaMapBtn.area01 { top: 15%; left: 10%; }
  .l-container .c-areaMap .c-areaMapBtn.area02 { top: 10%; left: 50%; }
  .l-container .c-areaMap .c-areaMapBtn.area03 { top: 25%; left: 45%; }
  .l-container .c-areaMap .c-areaMapBtn.area04 { top: 35%; left: 30%; }
  .l-container .c-areaMap .c-areaMapBtn.area05 { top: 45%; left: 25%; }
  .l-container .c-areaMap .c-areaMapBtn.area06 { top: 58%; left: 40%; }
  .l-container .c-areaMap .c-areaMapBtn.area07 { top: 67%; left: 10%; }
  .l-container .c-areaMap .c-areaMapBtn.area08 { top: 80%; left: 15%; }
  .l-container .c-areaMap .c-areaMapBtn.area09 { top: 40%; left: 68%; }

  /* エリアマップ エリア選択ボタン アイコン（PC） */
  .l-container .c-areaMap .c-areaMapBtnIcon img {
    width: 36px;
    height: 36px;
    margin-right: 0.4rem;
  }

  /* アコーディオン コンテナ */
  .l-container .ui-acContainer {
    background-color: #ffffff;
    box-shadow: 1px 1px 16px 2px rgba(0, 0, 0, 0.08);
    border-radius: 0 0 32px 0;
  }
}


/* ↓↓↓ エリアMAP連動アコーディオン（2025年度）ここから ※公開終了後に削除 ↓↓↓ */


/* ▼モバイルファースト (全環境に共通のデザイン) */
/* エリアマップ 背景地図（2025年度） */
.l-container .c-areaMap2 {
  position: relative;
  height: auto;
  width: 100%;
  background-size: 100%;
  background-repeat: no-repeat;
  margin: 16px auto 0;
}

.l-container .c-areaMap2 {
  background-image: url("../../../../../assets/img/etc/drawari/niigata/bg_map_tokuten.gif");
  background-color: #e7e7e7;
}

.l-container .c-areaMap2::before {
  content: "";
  display: block;
  padding-top: 100%;
}

/* エリアマップ エリア選択ボタン（2025年度） */
.l-container .c-areaMap2 .c-areaMapBtn2 {
  display: block;
  position: absolute;
  cursor: pointer;
  transition: 0.4s;
  background-color: #ffffff;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.11);
  border-left: 4px solid #aaaaaa;
  border-radius: 0 0 20px 0;
  padding: 2px 28px 2px 2px;
  font-family: "A+EqpB-游ゴシック体 Pr6N B", "游ゴシック体", YuGothic, "Yu Gothic Medium", "Yu Gothic UI", sans-serif;
  font-weight: normal !important;
  font-size: 1.2rem;
  font-feature-settings: "palt";
}

.l-container .c-areaMapBtn2.area91 { border-left-color: #c9ae00; }
.l-container .c-areaMapBtn2.area92 { border-left-color: #d71800; }
.l-container .c-areaMapBtn2.area93 { border-left-color: #008acf; }
.l-container .c-areaMapBtn2.area94 { border-left-color: #00cccc; }
.l-container .c-areaMapBtn2.area95 { border-left-color: #ffaa00; }
.l-container .c-areaMapBtn2.area96 { border-left-color: #009900; }
.l-container .c-areaMapBtn2.area97 { border-left-color: #ef37ad; }
.l-container .c-areaMapBtn2.area98 { border-left-color: #8b00c0; }
.l-container .c-areaMapBtn2.area99 { border-left-color: #006699; }

.l-container .c-areaMap2 .c-areaMapBtn2 a {
  width: 100%;
  height: 100%;
  color: #333333;
}

.l-container .c-areaMap2 .c-areaMapBtn2:after {
  position: absolute;
  right: calc( 0% + 1.0rem );
  color: #333333;
  content: "\f078";
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
}

/* アコーディオン コンテナ（2025年度） */
.l-container .ui-acContainer2 {
  background-color: #ffffff;
  box-shadow: 1px 1px 16px 0 rgba(0, 0, 0, 0.11);
  border-radius: 0 0 32px 0;
}

/* アコーディオン タイトル（2025年度） */
.l-container .ui-acHeader2 {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 1.8rem;
  line-height: 1.5;
  margin-top: 24px;
  padding: 1.6rem 5.6rem 1.6rem 1.6rem;
  min-height: 6.4rem;
  border-left: 4px solid #aaaaaa;
}

.l-container .ui-acContainer2.area91 .ui-acHeader2 { border-left-color: #c9ae00; }
.l-container .ui-acContainer2.area92 .ui-acHeader2 { border-left-color: #d71800; }
.l-container .ui-acContainer2.area93 .ui-acHeader2 { border-left-color: #008acf; }
.l-container .ui-acContainer2.area94 .ui-acHeader2 { border-left-color: #00cccc; }
.l-container .ui-acContainer2.area95 .ui-acHeader2 { border-left-color: #ffaa00; }
.l-container .ui-acContainer2.area96 .ui-acHeader2 { border-left-color: #009900; }
.l-container .ui-acContainer2.area97 .ui-acHeader2 { border-left-color: #ef37ad; }
.l-container .ui-acContainer2.area98 .ui-acHeader2 { border-left-color: #8b00c0; }
.l-container .ui-acContainer2.area99 .ui-acHeader2 { border-left-color: #006699; }

.l-container .ui-acHeader2::after {
  position: absolute;
  right: calc( 0% + 1.6rem );
  color: #2d720a;
  content: "\f055"; /* ＋ 開く */
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  font-size: 3.2rem;
}

.l-container .ui-acHeader2.js-acActive {
  border-bottom: 1px solid #e7e7e7;
}

.l-container .ui-acHeader2.js-acActive::after {
  position: absolute;
  right: calc( 0% + 1.6rem );
  color: #b5b5b5;
  content: "\f056"; /* － 閉じる */
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  font-size: 3.2rem;
}

/* アコーディオン コンテンツ（2025年度） */
.l-container .ui-acContents2 {
  padding: 32px 16px;
}


/* ▼モバイルのみ付け足すデザイン */
@media all and (max-width: 767px) {
  /* エリアマップ エリア選択ボタン 表示位置指定（SP）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2.area91 { top: 15%; left:  2%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area92 { top:  5%; left: 45%; }

  .l-container .c-areaMap2 .c-areaMapBtn2.area93 { top: 20%; left: 45%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area94 { top: 32%; left: 25%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area95 { top: 45%; left: 15%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area96 { top: 56%; left: 35%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area97 { top: 67%; left:  2%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area98 { top: 80%; left: 10%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area99 { top: 40%; left: 68%; }

  /* エリアマップ エリア選択ボタン アイコン（SP）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtnIcon2 img {
    width: 24px;
    height: 24px;
    margin-right: 0.4rem;
  }
}

/* ▼タブレット用として付け足すデザイン */
@media all and (min-width: 768px) {
  /* エリアマップ エリア選択ボタン（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2 {
    padding: 4px 32px 4px 4px;
    font-size: 1.4rem;
  }
  /* エリアマップ エリア選択ボタン 末尾テキスト追加（タブレット～PC表示のみ）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2 .c-areaMapBtnName2::after {
    content: "エリア";
    font-feature-settings: "palt";
  }
  /* エリアマップ エリア選択ボタン アイコン（タブレット）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtnIcon2 img {
    width: 32px;
    height: 32px;
    margin-right: 0.4rem;
  }

  /* エリアマップ エリア選択ボタン 表示位置指定（タブレット）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2.area91 { top: 15%; left: 10%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area92 { top:  5%; left: 50%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area93 { top: 20%; left: 45%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area94 { top: 35%; left: 30%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area95 { top: 45%; left: 20%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area96 { top: 57%; left: 40%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area97 { top: 67%; left: 11%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area98 { top: 81%; left: 16%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area99 { top: 40%; left: 68%; }
}

/* ▼PC用として付け足すデザイン */
@media all and (min-width: 960px) {
  /* エリアマップ 背景地図（2025年度） */
  .l-container .c-areaMap2 {
    position: relative;
    height: auto;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    margin: 24px auto 0;
  }
  /* エリアマップ エリア選択ボタン（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2 {
    padding: 4px 36px 4px 4px;
    font-size: 1.8rem;
  }

  /* エリアマップ エリア選択ボタン 表示位置指定（PC）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtn2.area91 { top: 15%; left: 10%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area92 { top: 10%; left: 50%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area93 { top: 25%; left: 45%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area94 { top: 35%; left: 30%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area95 { top: 45%; left: 25%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area96 { top: 58%; left: 40%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area97 { top: 67%; left: 10%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area98 { top: 80%; left: 15%; }
  .l-container .c-areaMap2 .c-areaMapBtn2.area99 { top: 40%; left: 68%; }

  /* エリアマップ エリア選択ボタン アイコン（PC）（2025年度） */
  .l-container .c-areaMap2 .c-areaMapBtnIcon2 img {
    width: 36px;
    height: 36px;
    margin-right: 0.4rem;
  }

  /* アコーディオン コンテナ（2025年度） */
  .l-container .ui-acContainer2 {
    background-color: #ffffff;
    box-shadow: 1px 1px 16px 2px rgba(0, 0, 0, 0.08);
    border-radius: 0 0 32px 0;
  }
}