@charset "utf-8";

:root {
  --ff-en: "Montserrat", sans-serif;
  --main-color: #D54100;
}

html[data-browse-mode="P"] .for-sp,
html[data-browse-mode="S"] .for-pc {
  display: none;
}

/*----------------------------------
  全体
----------------------------------*/

.page-event .pane-contents .container {
  display: block;
  width: 100%;
}

.page-event .pane-contents .container .pane-main {
  margin: 0;
  margin: initial;
  width: 100%;
}

.pane-topic-path {
  margin: 0 0 0px 0;
  background: transparent;
}

.block-topic-path {
  margin: 0px 0 0px 0;
}

.block-topic-path--item__home {
  padding: 0 0 0 15px;
  position: relative;
}

.block-topic-path--item__home::before {
  content: '';
  width: 12px;
  height: 12px;
  display: block;
  background: url("icon_home.png") left center / 12px 12px no-repeat;
  position: absolute;
  top: calc(50% - 6px);
  left: 0;
}

.block-topic-path--item__home a span {
  color: #666666;
}

.block-topic-path--item__home a:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.block-event-page--accessory {
  display: none;
}

.block-top-event--goods {
  margin-bottom: 40px;
}

/* スクロールバーのスタイルを設定 */

/* Webkit系ブラウザ（Chrome, Safariなど）のスクロールバーのカスタマイズ */

.block-top-event--goods::-webkit-scrollbar {
  height: 10px;
  /* 横スクロールバーの高さ */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

.block-top-event--goods::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのスライダー色 */
  border-radius: 0;
  /* 角を丸めない */
}

/* PC用スタイル（browse-modeがPの時） */

html[data-browse-mode="P"] .block-thumbnail-t {
  display: flex;
  /* 子要素を横並びにする */
  flex-wrap: nowrap;
  /* 折り返しを無効にする */
  overflow-x: auto;
  /* 横スクロールを有効にする */
  padding-bottom: 20px;
  /* スクロールバーのための余白 */
  scrollbar-width: thin;
  /* スクロールバーの幅を細くする */
  scrollbar-color: #111 #F2F2F2;
  /* スクロールバーのカラー */
  /* gap: 15px; */
  gap: 30px;
  margin: 0;
}

html[data-browse-mode="P"] .block-thumbnail-t:not(:has(> li:nth-child(5))) {
  justify-content: center;
  gap: 30px;
}

html[data-browse-mode="P"] .block-thumbnail-t>li {
  width: 276px;
  margin: 0;
  flex-shrink: 0;
}

html[data-browse-mode="P"] .block-thumbnail-t--goods-image figure {
  /*  width: 200px; */
  width: 100%;
  height: 276px;
}

html[data-browse-mode="P"] .block-thumbnail-t--goods-icon {
  margin-top: 18px;
}

/* Webkit系ブラウザ用のスクロールバーのカスタマイズ */

.block-thumbnail-t::-webkit-scrollbar {
  height: 10px;
  /* 横スクロールバーの高さ */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

.block-thumbnail-t::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのスライダー色 */
  border-radius: 0;
  /* 角を丸めない */
}

html[data-browse-mode="S"] ul.block-thumbnail-t--items {
  flex-wrap: nowrap;
  gap: 10px;
}

html[data-browse-mode="S"] .block-thumbnail-t--items li {
  width: 180px;
}

html[data-browse-mode="S"] .block-top-event--goods {
  overflow-x: auto;
  /* 横スクロールを有効にする */
  padding-bottom: 10px;
  /* スクロールバーのための余白 */
  scrollbar-width: thin;
  /* Firefox用: スクロールバーの幅を細くする */
  scrollbar-color: #111 #F2F2F2;
  /* Firefox用: スクロールバーのスライダー色と背景色 */
  color: #FFF;
}

/* スマホ向けのWebkit系ブラウザのスクロールバーのカスタマイズ */

html[data-browse-mode="S"] .block-top-event--goods::-webkit-scrollbar {
  height: 10px;
  /* 横スクロールバーの高さ */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

html[data-browse-mode="S"] .block-top-event--goods::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのスライダー色 */
  border-radius: 0;
  /* 角を丸めない */
}

/* スマホ向けの各商品リストアイテムを横並びにする設定 */

html[data-browse-mode="S"] .block-thumbnail-t {
  display: flex;
  /* 子要素を横並びにする */
  flex-wrap: nowrap;
  /* 折り返しを無効にする */
  overflow-x: auto;
  /* 横スクロールを有効にする */
  padding-bottom: 20px;
  /* スクロールバーのための余白 */
  scrollbar-width: thin;
  /* スクロールバーの幅を細くする */
  scrollbar-color: #111 #F2F2F2;
  /* スクロールバーのカラー */
}

/* スマホ向けのWebkit系ブラウザ用のスクロールバーのカスタマイズ */

html[data-browse-mode="S"] .block-thumbnail-t::-webkit-scrollbar {
  height: 10px;
  /* 横スクロールバーの高さ */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

html[data-browse-mode="S"] .block-thumbnail-t::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのスライダー色 */
  border-radius: 0;
  /* 角を丸めない */
}

#travel_visual {
  margin: 0 0 0px 0;
  position: relative;
}

#travel_visual picture img {
  width: 100%;
  vertical-align: top;
}

#travel_visual .travel-main-message {
  width: 480px;
  height: 280px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: calc(50% - 140px);
  left: calc(50% - 240px);
}

#travel_visual .travel-main-message h1 {
  padding: 0;
  margin: 0 0 50px 0;
  text-align: center;
  position: relative;
}

#travel_visual .travel-main-message h1::after {
  content: '';
  width: 12px;
  height: 6px;
  border-right: #CC0000 6px solid;
  background: #C7B062;
  display: block;
  box-sizing: border-box;
  position: absolute;
  bottom: -25px;
  left: calc(50% - 6px);
}

#travel_visual .travel-main-message h1 .line01 {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  display: block;
}

#travel_visual .travel-main-message h1 .line02 {
  font-size: 36px;
  font-weight: bold;
  text-align: center;
  display: block;
}

#travel_visual .travel-main-message .text {
  font-size: 14px;
  font-weight: normal;
  color: #666666;
  text-align: center;
}

/* PC */

@media only screen and (min-width: 750px) {
  .for-sp {
    display: none;
  }
}

[data-browse-mode="P"] #header {
  margin-bottom: 0;
}

[data-browse-mode="P"] .page-event .pane-contents .container .pane-left-menu {
  display: none;
}

/* SP */

@media only screen and (max-width: 749px) {
  .for-pc {
    display: none;
  }

  #travel_visual .travel-main-message h1::after {
    bottom: -20px;
  }

  #travel_visual .travel-main-message h1 .line02 {
    font-size: 30px;
  }
}

[data-browse-mode="S"] .block-topic-path {
  padding: 10px;
  margin: 0;
  background: #FFF;
}

html[data-browse-mode=P] .block-ranking-r--items {
  gap: 17px;
}

html[data-browse-mode=P] .block-ranking-r .block-ranking-r--items>li {
  margin: 0 0px 50px 0;
}

html[data-browse-mode=P] .block-top-event--wrap {
  padding: 0px 0 0px;
}

.swiper-container {
  overflow: inherit;
}

.swiper-container .block-pickup-list-p--items {
  padding: 0 0 20px 0;
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
}

.swiper-container-horizontal>.swiper-scrollbar {
  height: 10px;
  border-radius: 0;
  background: #D5DBE2;
}

.swiper-container-horizontal>.swiper-scrollbar .swiper-scrollbar-drag {
  border-radius: 0;
  background: #F480AD;
}

.block-pickup-list-p--add-cart {
  display: none;
}

[data-browse-mode="S"] .p-event-frame {
  position: relative;
}

[data-browse-mode="S"] .block-top-event--goods {
  padding-bottom: 20px;
}

[data-browse-mode="S"] .swiper-container {
  overflow: inherit;
}

[data-browse-mode="S"] .block-pickup-list-p--items {
  flex-wrap: nowrap;
  border-top: 0px solid #FFFFFF !important;
  justify-content: flex-start;
}

[data-browse-mode="S"] .block-pickup-list-p--item-body {
  width: 150px !important;
  margin-bottom: 0;
}

[data-browse-mode="S"] .swiper-slide {
  width: auto;
}

[data-browse-mode="S"] .block-pickup-list-p--items li {
  border-bottom: 0px solid #FFFFFF !important;
}

[data-browse-mode="S"] .block-pickup-list-p--items .img-center img {
  max-height: 150px;
}

html[data-browse-mode="S"] .travel-contents-box figure {
  margin: 0;
}

/*SPスクロール*/

html[data-browse-mode="S"] div#goods_list_auto_load_area {
  scrollbar-width: thin;
  scrollbar-color: #111 #F2F2F2;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  position: relative;
  padding-bottom: 20px;
}

/* スクロールバーのスタイルをSwiper風にカスタマイズ */

html[data-browse-mode="S"] div#goods_list_auto_load_area::-webkit-scrollbar {
  height: 10px;
  /* スクロールバーの高さ */
  border-radius: 0;
  /* 角を丸めない */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

html[data-browse-mode="S"] div#goods_list_auto_load_area::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのドラッグ部分の色 */
  border-radius: 0;
  /* 角を丸めない */
}

html[data-browse-mode="S"] .block-goods-detail-j--items {
  flex-wrap: nowrap;
  gap: 16px;
}

html[data-browse-mode="S"] .block-top-event--goods .block-ranking-r--items li {
  min-width: 160px;
  margin: 20px 0 0px;
}

html[data-browse-mode="S"] .block-goods-detail-j--items li.block-goods-detail-j--item {
  min-width: 160px;
  margin: 20px 0 0px;
}

/*カートボタン削除*/

html[data-browse-mode="S"] .block-goods-detail-j--cart-btn {
  display: none;
}

.block-goods-detail-j--cart-btn {
  display: none;
}

.BtnToTop {
  padding: 20px 0 40px;
}

.BtnToTop a {
  width: 340px;
  height: 44px;
  border-radius: 44px;
  font-size: 14px;
  font-weight: bold;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #F480AD;
  margin: 0 auto;
}

/* コンテナ全体の設定 */

.block-pickup-list-p {
  overflow-x: auto;
  /* 横スクロールを有効にする */
  overflow-y: hidden;
  /* 縦スクロールを無効にする */
  position: relative;
  /* スクロールバーの配置のため */
  padding-bottom: 20px;
  /* スクロールバーの余白を確保 */
}

/* リストの設定 */

.block-pickup-list-p--items {
  display: flex;
  /* 子要素を横並びにする */
  flex-wrap: nowrap;
  /* 折り返しを無効にする */
  gap: 0;
  /* 要素間の隙間を設定 */
  padding: 0;
  /* パディングをリセット */
  margin: 0;
  /* マージンをリセット */
  list-style: none;
  /* リストのスタイルを無効にする */
}

/* 各リストアイテムの設定 */

.block-pickup-list-p--items>li {
  flex: 0 0 auto;
  /* サイズを固定する（flexboxの自動伸縮を無効化） */
  width: 200px;
  /* アイテムの幅を設定（例として200pxに設定） */
  margin-right: 10px;
  /* アイテム間の間隔を設定 */
}

/* スクロールバーのスタイルをSwiper風にカスタマイズ */

.block-pickup-list-p::-webkit-scrollbar {
  height: 10px;
  /* スクロールバーの高さ */
  border-radius: 0;
  /* 角を丸めない */
  background: #F2F2F2;
  /* スクロールバーの背景色 */
}

.block-pickup-list-p::-webkit-scrollbar-thumb {
  background: #111;
  /* スクロールバーのドラッグ部分の色 */
  border-radius: 0;
  /* 角を丸めない */
}

/* Firefox 用のスクロールバー設定 */

.block-pickup-list-p {
  scrollbar-width: thin;
  scrollbar-color: #111 #F2F2F2;
}

/*SPスクロール*/

div#goods_list_auto_load_area {
  scrollbar-width: thin;
  scrollbar-color: #111 #F2F2F2;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  position: relative;
  padding-bottom: 20px;
}

.block-goods-detail-j--items {
  flex-wrap: nowrap;
}

/*ブランドロゴ調整*/

.brand_s_img {
  width: 100px;
  height: 100px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.text_101751 {
  font-size: 16px;
  text-align: center;
  margin: 0px 0px 30px;
}

html[data-browse-mode="S"] #travel_visual .travel-main-message .text {
  font-size: 13px;
}

.block-top-event--header {
  color: #000;
  display: flex;
  flex-direction: column;
  gap: 17px;
  font-size: 40px;
  font-weight: bold;
  letter-spacing: .05em;
  line-height: 1;
  position: relative;
  padding: 0;
  padding: initial;
  padding-top: 66px;
  margin: 0;
  margin: initial;
  margin-bottom: 40px;
}

.block-top-event--header::before {
  content: '';
  background-image: url('event-title-lines.png');
  background-size: 100%;
  height: 48px;
  width: 122px;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50%;
}

.block-top-event--header span {
  color: #D54100;
  color: var(--main-color);
  font-family: "Montserrat", sans-serif;
  font-family: var(--ff-en);
  font-size: 20px;
  letter-spacing: 0;
}

html[data-browse-mode="S"] .block-top-event--header {
  gap: 11px;
  padding-top: 40px;
  margin: 0 0 32px;
  font-size: calc(22 / 430 * 100vw);
}

html[data-browse-mode="S"] .block-top-event--header::before {
  height: 28px;
  width: 73px;
}

html[data-browse-mode="S"] .block-top-event--header span {
  font-size: calc(12 / 430 * 100vw);
}

/*----------------------------------
.event-btn
----------------------------------*/

.event-btn {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 10px;
}

.event-btn a {
  background-color: #fff;
  border-style: solid;
  border-width: 1px;
  border-radius: 100px;
  color: #D54100;
  color: var(--main-color);
  display: block;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: .04em;
  text-align: center;
  padding: 14px 14px 13px;
  width: 280px;
  transition: opacity .4s;
  position: relative;
}

html[data-browse-mode="P"] .event-btn a:hover {
  opacity: .8;
}

html[data-browse-mode="S"] .event-btn a {
  font-size: calc(14 / 430 * 100vw);
  padding: 11px 5px 11px;
}

/*----------------------------------
.more-btn-wrap .more-btn
----------------------------------*/

/*pc*/

html[data-browse-mode="P"] .more-btn-wrap {
  display: flex;
  justify-content: center;
}

html[data-browse-mode="P"] .more-btn-wrap .more-btn {
  background-color: #CC0000;
  border-radius: 27px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  padding: 11px 36px 13px;
  min-width: 173px;
  position: relative;
  transition: opacity .3s;
}

html[data-browse-mode="P"] .more-btn-wrap .more-btn::after {
  content: '';
  position: absolute;
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  line-height: 1;
  width: .5em;
  height: .5em;
  border: 0.15em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateX(-25%) rotate(45deg);
  top: calc(50% - 4px);
  right: 16px;
}

html[data-browse-mode="P"] .more-btn-wrap .more-btn:hover {
  opacity: .7;
}

/*sp*/

html[data-browse-mode="S"] .more-btn-wrap {
  display: flex;
  justify-content: center;
}

html[data-browse-mode="S"] .more-btn-wrap .more-btn {
  background-color: #CC0000;
  border-radius: 27px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  padding: 11px 36px 13px;
  min-width: 173px;
  position: relative;
}

html[data-browse-mode="S"] .more-btn-wrap .more-btn::after {
  content: '';
  position: absolute;
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  line-height: 1;
  width: .5em;
  height: .5em;
  border: 0.15em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateX(-25%) rotate(45deg);
  top: calc(50% - 4px);
  right: 16px;
}

html[data-browse-mode="P"] .p-event-frame .block-top-event--wrap::before {
  content: "";
  /* 擬似要素を生成 */
  /* display: block; */
  height: 80px;
  /* 余白の高さ */
  margin-top: -80px;
  /* 余白分を上に移動 */
}

/*----------------------------------
btn_base
----------------------------------*/

.btn_base {
  background: #FFD800;
  color: #222222;
  font-size: 20px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 37px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 3em;
  height: 80px;
  width: 400px;
}

.btn_base::after {
  position: absolute;
  content: "";
  transform: rotate(45deg);
  width: .6em;
  height: .6em;
  right: 2em;
  border-top: .12em solid currentColor;
  border-right: .12em solid currentColor;
}

.anchor::after {
  transform: rotate(135deg);
}

html[data-browse-mode="S"] .btn_base {
  font-size: 18px;
  width: 100%;
}

/*----------------------------------
main-message
----------------------------------*/

.main-message {
  position: relative;
  text-align: center;
}

.main-message-inner {
  background: #4F5984;
  color: #fff;
}

.main-date {
  border-top-color: #FFD800;
  border-top-style: solid;
  background: #fff;
  text-align: center;
  position: absolute;
  top: -45px;
  left: 50%;
  translate: -50%;
  z-index: 1;
}

.main-date dt {
  color: #DD1516;
  font-weight: bold;
  letter-spacing: .1em;
}

.main-message-img {
  position: relative;
  margin: auto;
}

.main-message-img img {
  position: absolute;
  z-index: 1;
}

/*pc*/

html[data-browse-mode="P"] .main-message-inner {
  padding: 37px 0 75px;
  font-size: 22px;
  letter-spacing: .08em;
  line-height: 1.818;
}

html[data-browse-mode="P"] .main-date {
  width: 820px;
  padding: 23px 0 31px;
  border-top-width: 8px;
}

html[data-browse-mode="P"] .main-date dt {
  font-size: 26px;
  margin-bottom: 5px;
}

html[data-browse-mode="P"] .main-date dd {
  font-size: 18px;
}

html[data-browse-mode="P"] .main-message-img {
  width: 1200px;
}

html[data-browse-mode="P"] .main-message-img .img_left {
  top: 4px;
  left: -189px;
}

html[data-browse-mode="P"] .main-message-img .img_right {
  top: 7px;
  right: -215px;
}

/*sp*/

html[data-browse-mode="S"] .main-message-inner {
  padding: 35px 0 45px;
  /* font-size: calc(18 / 430 * 100vw); */
  font-size: min(calc(18 * (100vw / 430)), 18px);
  ;
  font-weight: bold;
  line-height: 1.444;
}

html[data-browse-mode="S"] .main-date {
  top: -71px;
  width: calc(390 / 430 * 100vw);
  padding: 16px 16px 25px;
  border-top-width: 8px;
}

html[data-browse-mode="S"] .main-date dt {
  font-size: calc(24 / 430 * 100vw);
  margin-bottom: 9px;
}

html[data-browse-mode="S"] .main-date dd {
  font-size: calc(16 / 430 * 100vw);
}

html[data-browse-mode="S"] .main-message-img {
  width: 100%;
}

html[data-browse-mode="S"] .main-message-img .img_left {
  top: 4px;
  left: min(calc(102 * (100vw / 430)), 102px);
  width: min(calc(174 * (100vw / 430)), 174px);
  transform: translateX(-100%);
}

html[data-browse-mode="S"] .main-message-img .img_right {
  top: 4px;
  right: min(calc(92 * (100vw / 430)), 92px);
  width: min(calc(159 * (100vw / 430)), 159px);
  transform: translateX(100%);
}

/*----------------------------------
sec-cp
----------------------------------*/

.sec-cp {
  background-image: url('sec-cp-bg.png?20250625');
  background-size: 100% 100%;
  background-position: center bottom;
  padding-top: 195px;
  padding-bottom: round(down, 7.65625%, 1px);
  position: relative;
}

.sec-cp::after {
  content: '';
  background-image: url('sec-cp-bg-btm.png');
  background-size: 100%;
  padding-top: round(down, 8.85416667%, 1px);
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  translate: 0 100%;
  z-index: 1;
}

.point_cp {
  position: relative;
  background: #fff;
  text-align: center;
}

.point_cp-img img {
  position: absolute;
  z-index: 1;
}

.point_cp_ttl {
  position: relative;
}

.point_cp_coupon {
  position: relative;
}

.point_cp_coupon img {
  vertical-align: bottom;
}

.point_cp_code {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 39px;
}

.point_cp_code_txt {
  background-color: #F6F6F6;
  border-radius: 100px;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: .05em;
}

.point_cp_code_copy {
  all: unset;
  outline: revert;
  background-color: #D54100;
  background-color: var(--main-color);
  box-sizing: border-box;
  border-radius: 30px;
  color: #fff;
  display: block;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: .05em;
  padding: 9px;
  min-width: 216px;
}

.point_cp_code_copy+.js-balloon {
  font-weight: bold;
}

.point_cp_code_note {
  font-size: 18px;
  line-height: 1.444;
}

.point_cp_info a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  color: #8A0301;
}

.point_cp_info a:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
}

/*pc*/

html[data-browse-mode="P"] .point_cp {
  width: 1200px;
  margin: 0 auto;
  padding-bottom: 113px;
}

html[data-browse-mode="P"] .point_cp-img .img_left {
  top: -80px;
  left: -70px;
}

html[data-browse-mode="P"] .point_cp-img .img_right {
  top: -80px;
  right: -70px;
}

html[data-browse-mode="P"] .point_cp_ttl {
  top: -17px;
  margin-top: 0;
  margin-top: initial;
  margin-bottom: 10px;
}

html[data-browse-mode="P"] .point_cp_coupon {
  left: -29px;
  margin-bottom: 15px;
}

html[data-browse-mode="P"] .point_cp_code_txt {
  padding: 22px 22px 20px;
  max-width: 626px;
  width: 100%;
}

html[data-browse-mode="P"] .point_cp_code_copy {
  cursor: pointer;
  transition: opacity .3s;
}

html[data-browse-mode="P"] .point_cp_code_copy:hover {
  opacity: .7;
}

html[data-browse-mode="P"] .point_cp_info_btn {
  display: flex;
  justify-content: center;
  gap: 0 15px;
}

html[data-browse-mode="P"] .point_cp_info {
  margin-top: 12px;
  font-size: 14px;
  line-height: 2;
}

/*sp*/

html[data-browse-mode="S"] .sec-cp {
  background-image: url('sec-cp-bg-sp.png');
  padding-top: 155px;
  padding-bottom: 0px;
  background-size: 100%;
  background-position: center top;
}

html[data-browse-mode="S"] .sec-cp::after {
  content: none;
}

html[data-browse-mode="S"] .point_cp {
  width: 100%;
  margin: 0 auto;
  padding: 0 calc(20 / 430 * 100vw) 40px;
}

html[data-browse-mode="S"] .point_cp-img .img_left,
html[data-browse-mode="S"] .point_cp-img .img_right {
  top: -20px;
  width: 60px;
}

html[data-browse-mode="S"] .point_cp-img .img_left {
  left: 0;
}

html[data-browse-mode="S"] .point_cp-img .img_right {
  right: 0;
}

html[data-browse-mode="S"] .point_cp_ttl {
  width: 100%;
  top: -44px;
  margin-bottom: -37px;
}

html[data-browse-mode="S"] .point_cp_coupon {
  margin-left: calc(-20 / 430 * 100vw);
  margin-right: calc(-20 / 430 * 100vw);
}

html[data-browse-mode="S"] .point_cp_code {
  gap: 15px;
  margin-bottom: 25px;
}

html[data-browse-mode="S"] .point_cp_code_txt {
  font-size: calc(20 / 430 * 100vw);
  padding: 16px 10px 14px;
  width: 100%;
}

html[data-browse-mode="S"] .point_cp_code_note {
  font-size: calc(16 / 430 * 100vw);
  line-height: 1.5;
}

html[data-browse-mode="S"] .point_cp_info_btn {
  display: flex;
  flex-direction: column;
  gap: 15px 0;
}

html[data-browse-mode="S"] .point_cp_info {
  margin-top: 22px;
  font-size: calc(13 / 430 * 100vw);
  line-height: 1.8;
}

/*----------------------------------
sec-recommend
----------------------------------*/

.recommend-sections {
  display: flex;
  flex-direction: column;
  gap: 0px;
}

.sec-title {
  display: flex;
  flex-direction: column;
  gap: 22px;
  text-align: center;
  margin-bottom: 113px;
}

.sec-title.-white {
  color: #fff;
}

.sec-title-jp {
  font-size: 55px;
  font-weight: bold;
  line-height: 1;
  margin: 0;
  margin: initial;
}

.sec-title-en {
  font-family: "Montserrat", sans-serif;
  font-family: var(--ff-en);
  font-size: 30px;
  font-weight: bold;
  line-height: 1.333;
}

.sec-recommend {
  background-size: cover;
  background-position: center bottom;
  position: relative;
}

.sec-recommend::after {
  content: '';
  background-size: 100%;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  translate: 0 100%;
  z-index: 1;
}

.sec-recommend.sec-recommend-01 {
  background-image: url('sec-recommend-01-bg.png?v99999');
  padding-top: 80px;
  padding-bottom: 122px;
}

.sec-recommend.sec-recommend-01::after {
  background-image: url('sec-recommend-01-bg-btm.png?v2');
  padding-top: round(down, 9.166666666666666%, 1px);
}

.sec-recommend.sec-recommend-02 {
  background-image: url('sec-recommend-02-bg.png?v1');
  padding-top: 12.5%;
  padding-bottom: 114px;
  background-size: 100%;
}

.sec-recommend.sec-recommend-02::after {
  background-image: url('sec-recommend-02-bg-btm.png?v1');
  padding-top: round(down, 9.010416666666667%, 1px);
}

.sec-recommend.sec-recommend-03 {
  background-image: url('sec-recommend-03-bg.png?v21');
  padding-top: 13.177083333333334%;
  padding-bottom: 123px;
}

.sec-recommend.sec-recommend-03::after {
  background-image: url('sec-recommend-03-bg-btm.png?v1');
  padding-top: round(down, 9.010416666666667%, 1px);
}

.sec-recommend-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: 100%;
}

.box {
  background: #fff;
  filter: drop-shadow(0px 0px 10px rgba(17, 17, 17, 0.1));
  padding-left: 12.666666666666668%;
  padding-right: 12.666666666666668%;
  padding-top: 95px;
  padding-bottom: 120px;
  position: relative;
}

.box::before,
.box::after {
  content: '';
  height: 2px;
  width: 135px;
  rotate: -45deg;
  position: absolute;
}

.box::before {
  top: 31px;
  left: -40px;
}

.box::after {
  bottom: 22px;
  right: -40px;
}

.sec-recommend.sec-recommend-01 .box::before,
.sec-recommend.sec-recommend-01 .box::after {
  background-color: #C1B8CB;
}

.sec-recommend.sec-recommend-02 .box::before,
.sec-recommend.sec-recommend-02 .box::after {
  background-color: #828282;
}

.sec-recommend.sec-recommend-03 .box::before,
.sec-recommend.sec-recommend-03 .box::after {
  background-color: #8898D5;
}

.box>*:last-child {
  margin-bottom: 0;
}

.box-num {
  text-align: center;
  position: absolute;
  top: -93px;
  left: calc(50% - 6px);
  translate: -50%;
}

.box-num img {
  width: 152px;
  vertical-align: bottom;
}

.box-title {
  font-size: 30px;
  font-weight: bold;
  letter-spacing: .05em;
  line-height: 1.333;
  text-align: center;
  padding-bottom: 21px;
  margin-top: 0;
  margin-bottom: 59px;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  max-width: 100%;
  position: relative;
}

.box-title::after {
  content: '';
  height: 10px;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 50%;
  translate: -50%;
}

.sec-recommend.sec-recommend-01 .box-title::after {
  background-image: url('box-title-bd-01.png?v2');
}

.sec-recommend.sec-recommend-02 .box-title::after {
  background-image: url('box-title-bd-02.png?v2');
}

.sec-recommend.sec-recommend-03 .box-title::after {
  background-image: url('box-title-bd-03.png');
}

.recommend-items {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.recommend-item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.recommend-item-head {
  width: 100%;
}

.recommend-item-header {
  width: 23.4375%;
}

.recommend-item-main {
  width: 73.21428571428571%;
}

.recommend-item-footer {
  margin-top: 20px;
  width: 100%;
}

.recommend-item-catch {
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  padding-left: 20px;
  padding-right: 20px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  max-width: 100%;
  width: fit-content;
  position: relative;
}

.recommend-item-catch::before,
.recommend-item-catch::after {
  background-color: currentColor;
  content: '';
  height: 85%;
  width: 2px;
  position: absolute;
  bottom: 0;
}

.recommend-item-catch::before {
  left: 0;
  rotate: -30deg;
}

.recommend-item-catch::after {
  right: 0;
  rotate: 30deg;
}

.recommend-item-img {
  overflow: hidden;
}

.recommend-item-img img {
  border: 1px solid #A2A2A2;
  vertical-align: bottom;
}

.recommend-item-img-swiper {
  position: relative;
}

.recommend-item-img-swiper .swiper-button-prev,
.recommend-item-img-swiper .swiper-button-next {
  background-color: rgba(0, 0, 0, .42);
  height: 40px;
  width: 23px;
  margin-top: 0;
  margin-top: initial;
  translate: 0 -50%;
}

.recommend-item-img-swiper .swiper-button-prev {
  left: 0;
}

.recommend-item-img-swiper .swiper-button-next {
  right: 0;
}

.recommend-item-img-swiper .swiper-button-prev::after,
.recommend-item-img-swiper .swiper-button-next::after {
  color: #FFF;
  font-size: 13px;
}

.recommend-item-img-swiper .swiper-button-disabled {
  display: none;
}

.recommend-item-hdg {
  font-size: 22px;
  font-weight: bold;
  line-height: 1.455;
  margin-bottom: 6px;
}

.recommend-item-shop {
  color: #8A0301;
  font-size: 11px;
  letter-spacing: .04em;
  line-height: 1.273;
  margin-bottom: 9px;
}

.recommend-item-shop a {
  color: inherit;
  font-size: inherit;
}

.recommend-item-price {
  margin-bottom: 6px;
}

.recommend-item-price-head {
  font-size: 16px;
  line-height: 1.5;
  margin-right: -3px;
}

.recommend-item-price-num {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.458;
  margin-right: -3px;
}

.recommend-item-price-tax {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
}

.recommend-item-txt {
  font-size: 14px;
  line-height: 1.643;
  margin-bottom: 18px;
}

.recommend-item-txt+.recommend-item-txt {
  margin-top: 29px;
}

.recommend-item-link-btn {
  background-color: #D54100;
  background-color: var(--main-color);
  border-radius: 24px;
  color: #FFF;
  display: inline-block;
  font-size: 15px;
  line-height: 1.4;
  text-align: center;
  padding: 9px 9px 10px;
  max-width: 100%;
  min-width: 218px;
}

.recommend-item-review {
  background-color: #FCFAF8;
  display: flex;
  gap: 28px;
  padding: 13px 30px 12px 20px;
  position: relative;
}

.recommend-item-review-head {
  display: flex;
  justify-content: center;
  flex-shrink: 0;
  width: 104px;
}

.recommend-item-review-body {
  width: calc(100% - 132px);
}

.recommend-item-review-title {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.75;
  margin-bottom: 5px;
}

.recommend-item-review-user {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 5px;
}

.recommend-item-review-user img {
  vertical-align: bottom;
  width: 33px;
}

.recommend-item-review-user figcaption {
  font-size: 13px;
  line-height: 1.231;
  text-align: center;
}

.recommend-item-review-txt,
.recommend-item-review-txt02 {
  font-size: 14px;
  line-height: 1.714;
  overflow-y: hidden;
  transition: height .3s ease;
}

.recommend-item-review-txt02 {
  /* 子要素の高さ変更時の位置ずれを防ぐ */
  position: relative;
  overflow: visible;
}

.recommend-item-review-txt02>dt {
  font-size: 16px;
  font-weight: bold;
}

.recommend-item-review-txt02>dd {
  display: -webkit-box;
  -webkit-line-clamp: 1.5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative;
  line-height: 1.714;
  max-height: calc(1.714em * 1.9);
  transition: max-height 0.3s ease;
  /* 頭の位置を固定 */
  transform-origin: top;
  will-change: max-height;
  /* 高さ変更時の位置ずれを防ぐ */
  top: 0;
  margin-top: 0;
}

html[data-browse-mode="S"] .recommend-item-review-txt02>dd {
  margin-top: 5px;
}

.recommend-item-review-txt02>dd>* {
  overflow: visible;
}

/* グラデーションオーバーレイ */

.recommend-item-review-txt02>dd::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 2.8em;
  /* 高さを2行分に拡大 */
  background: linear-gradient(rgba(248, 249, 252, 0) 0%,
      rgba(248, 249, 252, 0.3) 25%,
      rgba(248, 249, 252, 0.6) 50%,
      rgba(248, 249, 252, 0.8) 75%,
      rgba(248, 249, 252, 1) 100%);
  pointer-events: none;
  transition: opacity 0.3s ease;
}

/* is-open状態 */

.recommend-item-review.is-open .recommend-item-review-txt02>dd {
  -webkit-line-clamp: unset;
  max-height: none;
  overflow: visible;
  /* 開閉時の位置ずれを防ぐ */
  top: 0;
  margin-top: 0;
}

.recommend-item-review.is-open .recommend-item-review-txt02>dd::after {
  opacity: 0;
}

/* レビューボタンスタイル */

.recommend-item-review--btn {
  all: unset;
  outline: revert;
  cursor: pointer;
  display: block;
  width: 100%;
  height: 30px;
  position: absolute;
  margin: 0;
  transition: opacity 0.3s ease;
  left: 50%;
  transform: translateX(-50%);
  bottom: 5px;
}

.recommend-item-review--btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 5px solid #D54100;
  border-top: 5px solid var(--main-color);
  border-bottom: 0;
  transition: transform 0.3s ease;
}

/* is-open状態でのボタン回転 */

.recommend-item-review.is-open .recommend-item-review--btn {
  opacity: 0;
  pointer-events: none;
}

.recommend-item-review.is-open .recommend-item-review--btn::after {
  transform: translate(-50%, -50%) rotate(180deg);
}

/* ホバー効果（PCのみ） */

html[data-browse-mode="P"] .recommend-item-review--btn:hover {
  opacity: 0.7;
}

.recommend-item-review-more {
  all: unset;
  outline: revert;
  cursor: pointer;
  display: block;
  height: 5px;
  width: 100%;
  position: relative;
}

.recommend-item-review-more::before {
  content: '';
  background: linear-gradient(rgba(248, 249, 252, 0) 0%, rgba(248, 249, 252, 0.46) 17.99%, rgba(248, 249, 252, 0.8) 48.12%, #f8f9fc 88.7%, #f8f9fc 100%);
  height: 22px;
  width: 100%;
  position: absolute;
  top: -22px;
  left: 0;
}

.recommend-item-review-more.open::before {
  content: none;
}

.recommend-item-review-more::after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-top: 5px solid #D54100;
  border-top: 5px solid var(--main-color);
  border-bottom: 0;
  position: absolute;
  top: 0;
  left: calc(50% - 72px);
}

.recommend-item-review-more.open::after {
  rotate: 180deg;
}

.staff-recommend-items {
  display: flex;
  flex-direction: column;
  gap: 119px;
  margin-bottom: 48px;
}

.staff-recommend-item {
  background-color: #F8F9FC;
  display: flex;
  gap: 30px;
}

.staff-recommend-item-header {
  width: calc(50% - 30px);
  position: relative;
}

.staff-recommend-item-img {
  position: absolute;
  right: 0;
  top: -53px;
}

.staff-recommend-item-main {
  padding-top: 34px;
  padding-bottom: 35px;
  padding-right: 30px;
  width: 50%;
}

.bnr-link {
  text-align: center;
}

.bnr-link img {
  height: auto;
  max-width: 100%;
  vertical-align: bottom;
}

/* pc */

html[data-browse-mode="P"] .recommend-item-review-body {
  display: flex;
  /* justify-content: center; */
  flex-direction: column;
}

/* sp */

html[data-browse-mode="S"] .recommend-sections {}

html[data-browse-mode="S"] .sec-title {
  gap: 10px;
  margin-bottom: 42px;
}

html[data-browse-mode="S"] .sec-title-jp {
  font-size: calc(28 / 430 * 100vw);
  line-height: 1.429;
}

html[data-browse-mode="S"] .sec-title-en {
  font-size: calc(15 / 430 * 100vw);
}

html[data-browse-mode="S"] .sec-recommend {
  background-size: 100%;
  background-position: center bottom;
  position: relative;
}

html[data-browse-mode="S"] .sec-recommend {
  padding-left: 10px;
  padding-right: 10px;
}

html[data-browse-mode="S"] .sec-recommend::after {
  content: '';
  background-size: 100%;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  translate: 0 100%;
  z-index: 1;
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-01 {
  background-image: url('sec-recommend-01-bg-sp.png?v9');
  background-size: cover;
  padding-top: 40px;
  padding-bottom: 14.418604651162791vw;
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-01::after {
  background: url('sec-recommend-01-bg-btm-sp.png?v9') no-repeat center center / contain;
  /* padding-top: round(down, 15.348837209302326vw, 1px); */
  /* padding: calc(32 / 430 * 100vw) */
  padding: 0;
  height: calc(64.5 / 430 * 100vw);
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-02 {
  /* background-image: url('sec-recommend-02-bg-sp.png'); */
  background-size: cover;
  padding-top: 27.44186046511628vw;
  padding-bottom: 13.72093023255814vw;
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-02::after {
  background: url('sec-recommend-02-bg-btm-sp.png') no-repeat center center / contain;
  /*  padding-top: round(down, 15.348837209302326vw, 1px); */
  padding: 0;
  height: calc(67 / 430 * 100vw);
  bottom: 1px;
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-03 {
  background-image: url('sec-recommend-03-bg-sp.png');
  background-size: cover;
  padding-top: 27.906976744186046vw;
  padding-bottom: 13.953488372093023vw;
}

html[data-browse-mode="S"] .sec-recommend.sec-recommend-03::after {
  background-image: url('sec-recommend-03-bg-btm-sp.png');
  padding-top: round(down, 15.813953488372093vw, 1px);
}

html[data-browse-mode="S"] .box {
  padding-top: 58px;
  padding-bottom: 40px;
  padding-left: calc(15 / 430 * 100vw);
  padding-right: 0;
}

html[data-browse-mode="S"] .box::before,
html[data-browse-mode="S"] .box::after {
  content: '';
  height: 2px;
  width: 40px;
  rotate: -45deg;
  position: absolute;
}

html[data-browse-mode="S"] .box::before {
  top: 8px;
  left: -8px;
}

html[data-browse-mode="S"] .box::after {
  bottom: 8px;
  right: -8px;
}

html[data-browse-mode="S"] .box>*:last-child {
  margin-bottom: 0;
}

html[data-browse-mode="S"] .box-num {
  top: -47px;
  left: 50%;
}

html[data-browse-mode="S"] .box-num img {
  width: 90px;
}

html[data-browse-mode="S"] .box-title {
  font-size: calc(20 / 430 * 100vw);
  padding-bottom: 18px;
  margin-top: 0;
  margin-bottom: 29px;
}

html[data-browse-mode="S"] .box-title::after {
  content: '';
  height: 10px;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 50%;
  translate: -50%;
}

html[data-browse-mode="S"] .recommend-items {
  flex-direction: row;
  gap: 60px;
  overflow-x: auto;
  padding-right: calc(15 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item {
  display: block;
  flex-shrink: 0;
  width: 251px;
}

html[data-browse-mode="S"] .recommend-item-header {
  width: 100%;
}

html[data-browse-mode="S"] .recommend-item-main {
  width: 100%;
}

html[data-browse-mode="S"] .recommend-item-footer {
  margin-top: 17px;
}

html[data-browse-mode="S"] .recommend-item-catch {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: calc(17 / 430 * 100vw);
  padding-left: calc(18 / 430 * 100vw);
  padding-right: calc(18 / 430 * 100vw);
  max-width: 90%;
  margin-bottom: 20px;
}

html[data-browse-mode="S"] .recommend-item-catch::before,
html[data-browse-mode="S"] .recommend-item-catch::after {
  width: 1px;
}

html[data-browse-mode="S"] .recommend-item-img {
  margin-bottom: 15px;
}

html[data-browse-mode="S"] .recommend-item-img-swiper .swiper-button-prev,
html[data-browse-mode="S"] .recommend-item-img-swiper .swiper-button-next {
  height: 62px;
  width: 36px;
}

html[data-browse-mode="S"] .recommend-item-img-swiper .swiper-button-prev::after,
html[data-browse-mode="S"] .recommend-item-img-swiper .swiper-button-next::after {
  font-size: 22px;
}

html[data-browse-mode="S"] .recommend-item-hdg {
  font-size: calc(20 / 430 * 100vw);
  margin-bottom: 10px;
}

html[data-browse-mode="S"] .recommend-item-shop {
  font-size: calc(11 / 430 * 100vw);
  margin-bottom: 0;
}

html[data-browse-mode="S"] .recommend-item-price {
  margin-bottom: 14px;
}

html[data-browse-mode="S"] .recommend-item-price-head {
  font-size: calc(16 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item-price-num {
  font-size: calc(24 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item-price-tax {
  font-size: calc(16 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item-txt {
  font-size: calc(14 / 430 * 100vw);
  margin-bottom: 18px;
}

html[data-browse-mode="S"] .recommend-item-txt+.recommend-item-txt {
  margin-top: 24px;
}

html[data-browse-mode="S"] .recommend-item-link-btn {
  display: block;
  font-size: 18px;
  line-height: 1.444;
  padding: 14px 14px 13px;
  margin-left: auto;
  margin-right: auto;
  min-width: 223px;
  max-width: 100%;
  width: fit-content;
}

html[data-browse-mode="S"] .recommend-item-review {
  flex-direction: column;
  gap: 15px;
  padding: 10px calc(15 / 430 * 100vw) 14px;
}

html[data-browse-mode="S"] .recommend-item-review-head {
  display: block;
  width: 100%;
}

html[data-browse-mode="S"] .recommend-item-review-body {
  width: 100%;
}

html[data-browse-mode="S"] .recommend-item-review-title {
  font-size: calc(16 / 430 * 100vw);
  line-height: 1.5;
  margin-bottom: 8px;
}

html[data-browse-mode="S"] .recommend-item-review-user {
  flex-direction: row;
  justify-content: center;
  gap: 14px;
}

html[data-browse-mode="S"] .recommend-item-review-user figcaption {
  font-size: calc(13 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item-review-txt,
html[data-browse-mode="S"] .recommend-item-review-txt02 {
  font-size: calc(14 / 430 * 100vw);
}

html[data-browse-mode="S"] .recommend-item-review-txt02 {
  font-size: 14px;
}

html[data-browse-mode="S"] .recommend-item-review-more {
  height: 7px;
}

html[data-browse-mode="S"] .recommend-item-review-more::before {
  height: 46px;
  top: -46px;
}

html[data-browse-mode="S"] .recommend-item-review-more::after {
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-top: 7px solid #D54100;
  border-top: 7px solid var(--main-color);
  border-bottom: 0;
  left: calc(50% - 7px);
}

html[data-browse-mode="S"] .staff-recommend-items {
  flex-direction: row;
  gap: 10px;
  overflow-x: auto;
  padding-right: calc(15 / 430 * 100vw);
  margin-bottom: 30px;
}

html[data-browse-mode="S"] .staff-recommend-item {
  background-color: transparent;
  background-color: initial;
  flex-shrink: 0;
  flex-direction: column;
  gap: 15px;
  width: 270px;
}

html[data-browse-mode="S"] .staff-recommend-item-header {
  width: 100%;
}

html[data-browse-mode="S"] .staff-recommend-item-img {
  position: static;
}

html[data-browse-mode="S"] .staff-recommend-item-main {
  padding: 0;
  width: 100%;
}

html[data-browse-mode="S"] .recommend-item-swiper {
  overflow: hidden;
  margin-bottom: 40px;
}

html[data-browse-mode="S"] .recommend-item-swiper .recommend-items,
html[data-browse-mode="S"] .recommend-item-swiper .staff-recommend-items {
  flex-direction: initial;
  gap: initial;
}

html[data-browse-mode="S"] .recommend-item-swiper-pagination {
  margin-top: 20px;
  position: static;
}

html[data-browse-mode="S"] .recommend-item-swiper.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 10px;
}

html[data-browse-mode="S"] .recommend-item-swiper-pagination .swiper-pagination-bullet {
  height: 17px;
  width: 17px;
}

html[data-browse-mode="S"] .recommend-item-swiper-pagination .swiper-pagination-bullet-active {
  background-color: #D54100;
  background-color: var(--main-color);
}

/*----------------------------------
sec-category
----------------------------------*/

.sec-category {
  background-image: url('sec-category-bg.png?v1');
  background-size: 100% 100%;
  background-position: center bottom;
  padding-top: 10.78125%;
  padding-bottom: 13px;
  position: relative;
}

.sec-category::after {
  content: '';
  background-image: url('sec-category-bg-btm.png');
  background-size: 100%;
  padding-top: round(down, 9.322916666666667%, 1px);
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  translate: 0 100%;
  z-index: 1;
}

.sec-category-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: 100%;
}

.sec-category .sec-title {
  margin-bottom: 43px;
}

.category-panel-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 30px 32px;
  gap: 30px 32px;
}

.category-panel {
  background-color: #fff;
  display: block;
}

.category-panel-img {
  width: 100%;
  vertical-align: bottom;
}

.category-panel-name {
  box-sizing: border-box;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: .06em;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 23px 10px 27px;
}

/* sp */

html[data-browse-mode="S"] .sec-category {
  background-image: url('sec-category-bg-sp.png');
  background-size: cover;
  padding-top: 22.093023255813954vw;
  padding-bottom: 46px;
  padding-left: calc(20 / 430 * 100vw);
  padding-right: calc(20 / 430 * 100vw);
}

html[data-browse-mode="S"] .sec-category::after {
  background-image: url('sec-category-bg-btm-sp.png');
  padding-top: round(down, 9.322916666666667%, 1px);
}

html[data-browse-mode="S"] .sec-category .sec-title {
  margin-bottom: 24px;
}

html[data-browse-mode="S"] .category-panel-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

html[data-browse-mode="S"] .category-panel-name {
  font-size: calc(15 / 430 * 100vw);
  padding: 8px 8px 10px;
}

/*----------------------------------
travel-bg
----------------------------------*/

html[data-browse-mode="P"] .travel-bg {
  background-image: url('travel-bg.png?20251024v4');
  background-position: center top;
  background-repeat: no-repeat;
}

/*----------------------------------
sec-event
----------------------------------*/

.sec-event {
  padding-top: 14.84375%;
  padding-bottom: 60px;
  position: relative;
}

.sec-event-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: 100%;
}

.sec-event-inner>*:last-child {
  margin-bottom: 0;
}

.event-contents-box {
  /* margin-bottom: 100px; */
  margin-bottom: 75px;
}

.event-contents-box .more-button {
  display: none;
}

.ball-rotate>div,
.ball-rotate>div:after,
.ball-rotate>div:before {
  background-color: #D54100;
  background-color: var(--main-color);
  /* ローダー色変更 */
}

.block-top-event--wrap .block-top-event--header {
  display: none;
}

/* sp */

html[data-browse-mode="S"] .sec-event {
  padding-top: calc(109 / 430 * 100vw);
  padding-bottom: calc(176 / 430 * 100vw);
  /* background-image: url('sec-event-bg-top-sp.png'), url('sec-event-bg-btm-sp.png'); */
  /* background-size: 100%, 100%; */
  /*   background-position: center top, center bottom;
  background-repeat: no-repeat, no-repeat; */
  /*  padding-block: 17.209302325581397vw 72.09302325581395vw; */
  position: relative;
}

/* html[data-browse-mode="S"] .sec-event::before {
  content: '';
  background-image: url('sec-event-flower-sp.png');
  background-size: 100%;
  height: 130px;
  width: 126px;
  position: absolute;
  top: -6px;
  right: 50px;
  z-index: 1;
} */

html[data-browse-mode="S"] .sec-event::before,
html[data-browse-mode="S"] .sec-event::after {
  content: '';
  display: block;
  position: absolute;
}

html[data-browse-mode="S"] .sec-event::before {
  background: url('travel-icon01.png?v1') no-repeat center center / contain;
  left: 50%;
  transform: translateX(-50%) translateX(calc(-4 / 430 * 100vw));
  top: calc(-34 / 430 * 100vw);
  bottom: auto;
  width: calc((865 / 2) / 430 * 100vw);
  height: calc((367 / 2) / 430 * 100vw);
  z-index: 2;
}

html[data-browse-mode="S"] .sec-event::after {
  background: url('travel-icon02.png?v1') no-repeat center center / contain;
  left: 50%;
  transform: translateX(-50%) translateX(calc(10 / 430 * 100vw));
  top: auto;
  bottom: 0;
  width: calc((741 / 2) / 430 * 100vw);
  height: calc((294 / 2) / 430 * 100vw);
}

html[data-browse-mode="S"] .sec-event-inner>*:last-child {
  margin-bottom: 0;
}

html[data-browse-mode="S"] .event-contents-box {
  margin-bottom: 60px;
}

/*----------------------------------
tabMenu
----------------------------------*/

.tabMenu {
  display: flex;
  list-style: none;
}

.tabMenu li {
  cursor: pointer;
  text-align: center;
  background: #fff;
  color: #000;
  border: 1px solid #D54100;
  border: 1px solid var(--main-color);
  display: flex;
  justify-content: center;
  align-items: center;
}

.tabMenu li.active {
  background: #D54100;
  background: var(--main-color);
  color: #fff;
}

.tabMenu:nth-of-type(2) li.active {
  background: #D54100;
  background: var(--main-color);
}

.tabTitle {
  font-size: 24px;
  font-weight: bold;
  letter-spacing: .05em;
  text-align: center;
  margin-bottom: 30px;
}

.tabContent {
  display: none;
}

.tabContent.active {
  display: block;
}

/*pc*/

html[data-browse-mode="P"] .tabMenu {
  justify-content: center;
  gap: 0 12px;
  width: 1200px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 36px;
}

html[data-browse-mode="P"] .tabMenu:nth-of-type(2) {
  margin-top: 40px;
}

html[data-browse-mode="P"] .tabMenu li {
  height: 50px;
  width: calc((100% - 60px) / 6);
  border-radius: 3px 3px 0 0;
}

/*sp*/

html[data-browse-mode="S"] .tabMenu {
  flex-wrap: wrap;
  gap: 15px;
  width: 90vw;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}

html[data-browse-mode="S"] .tabMenu li {
  width: calc((100% - 15px) / 2);
  border-radius: 3px;
  min-height: 3.5em;
}

html[data-browse-mode="S"] .tabTitle {
  font-size: calc(20 / 430 * 100vw);
  margin-bottom: 20px;
}

/*----------------------------------
sec-note
----------------------------------*/

.sec-note {
  padding-top: 75px;
  padding-bottom: 122px;
}

.sec-note-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1560px;
  width: 100%;
}

.note-box {
  background-color: #FEFBEC;
  padding-bottom: 100px;
}

.note-box-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 896px;
  width: 100%;
}

.note-box-title {
  top: -15px;
  text-align: center;
  margin-top: 0;
  margin-top: initial;
  margin-bottom: 27px;
  position: relative;
}

.note-list {
  display: flex;
  flex-direction: column;
  gap: 19px;
  margin-bottom: 47px;
}

.note-list-group {
  display: flex;
  align-items: start;
  flex-direction: column;
  gap: 8px;
}

.note-list dt {
  color: #222222;
  background-color: #F3EBBB;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: .05em;
  padding: 5px 13px;
}

.note-list dd {
  color: #000;
  font-size: 16px;
  line-height: 1.75;
}

.note-list a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

html[data-browse-mode="P"] .note-list a:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
}

/* sp */

html[data-browse-mode="S"] .sec-note {
  padding-top: 0;
  padding-bottom: 0;
}

html[data-browse-mode="S"] .note-box {
  padding-left: calc(20 / 430 * 100vw);
  padding-right: calc(20 / 430 * 100vw);
  padding-bottom: 50px;
}

html[data-browse-mode="S"] .note-box-title {
  top: -37px;
  margin-left: calc(-20 / 430 * 100vw);
  margin-right: calc(-20 / 430 * 100vw);
  margin-bottom: -7px;
}

html[data-browse-mode="S"] .note-list {
  margin-bottom: 38px;
}

/*----------------------------------
sec-campaign-list
----------------------------------*/

.sec-campaign-list {
  background-image: url('sec-other-cp-bg.jpg?v1');
  background-size: cover;
  background-position: center top;
  padding-top: 133px;
  padding-bottom: 120px;
}

.sec-campaign-list-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: 100%;
}

.sec-campaign-list .sec-title {
  margin-bottom: 75px;
}

.campaign-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 40px 32px;
  gap: 40px 32px;
  margin-bottom: 50px;
}

.campaign-list li>a {
  background-color: #fff;
  display: block;
  height: 100%;
}

.campaign-list figure {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.campaign-list-detail {
  display: flex;
  align-items: start;
  flex-direction: column;
  flex-grow: 1;
  gap: 10px;
  padding: 17px 17px 24px;
}

.campaign-list-detail .tag {
  border: 1px solid #F4F5F6;
  color: #6A7181;
  font-size: 11px;
  letter-spacing: .04em;
  display: inline-block;
  padding: 0px 3px;
}

.campaign-list-detail .title {
  color: #111;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: .06em;
  line-height: 1.333;
}

/* sp */

html[data-browse-mode="S"] .sec-campaign-list {
  padding-top: 60px;
  padding-bottom: 60px;
  padding-left: calc(20 / 430 * 100vw);
  padding-right: calc(20 / 430 * 100vw);
  margin-top: calc(20 / 430 * 100vw);
}

html[data-browse-mode="S"] .sec-campaign-list .sec-title {
  margin-bottom: 29px;
}

html[data-browse-mode="S"] .campaign-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin-bottom: 40px;
}

html[data-browse-mode="S"] .campaign-list-detail {
  gap: 9px;
  padding: 12px calc(10 / 430 * 100vw) 13px;
}

html[data-browse-mode="S"] .campaign-list-detail .title {
  font-size: calc(16 / 430 * 100vw);
  line-height: 1.438;
}

/* 追従ナビ */

.fixed-nav {
  position: fixed;
  right: 0;
  bottom: 140px;
  z-index: 101;
}

.fixed-nav-list>*+* {
  margin-top: 5px;
}

.fixed-nav-list li a {
  color: #000;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  display: block;
  width: 270px;
  padding: 11px 10px 10px 19px;
  background-color: #FED851;
  transition: opacity .3s;
}

html[data-browse-mode="P"] .fixed-nav-list li a:hover {
  opacity: 0.7;
}

html[data-browse-mode="S"] .fixed-nav {
  width: 100%;
  bottom: 0;
}

html[data-browse-mode="S"] .fixed-nav-list {
  display: flex;
}

html[data-browse-mode="S"] .fixed-nav-list>*+* {
  margin: 0;
}

html[data-browse-mode="S"] .fixed-nav-list li {
  width: 25%;
}

html[data-browse-mode="S"] .fixed-nav-list li a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(11 / 430 * 100vw);
  text-align: center;
  padding: 8px calc(3 / 430 * 100vw);
  height: 100%;
  width: 100%;
  position: relative;
}

html[data-browse-mode="S"] .fixed-nav-list li:not(:last-child) a::after {
  content: "";
  width: 1px;
  height: calc(100% - 10px);
  background: #000;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

/*# sourceMappingURL=style.css.map */