@charset "UTF-8";

:root {
  --BASE-thirdly-blue: #D0EAFC;
  --CORE-jrp-blue: #004095;
  --BASE-TRUE-WHITE: #FFF;
  --transition: .3s ease-in-out;
}

#hapidanbui_cp{
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  padding: 0;
  margin: 0;
  font-weight: 400;
  line-height: 1.6;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;/*Chrome,Safari*/
  -ms-text-size-adjust: 100%;/*EgdeMobile*/
  -moz-text-size-adjust: 100%;/*firefox*/
  overflow: hidden;
}

#hapidanbui_cp * {box-sizing: border-box;}

#hapidanbui_cp a {
  color: #427bbf;
  text-decoration: underline;
  transition: var(--transition);
}

#hapidanbui_cp .warning {
  color: #EA6053;
}

@media (hover: hover) {
  #hapidanbui_cp a:hover {
    opacity: .7;
  }
}

#hapidanbui_cp img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

#hapidanbui_cp a img {
  opacity: 1;
  transition: var(--transition);
}

.pc {display:block;}
.sp {display: none;}

@media screen and (max-width: 750px) {
  .pc {display: none;}
  .sp {display: block;}
}

#hapidanbui_cp ul, #hapidanbui_cp li {list-style: none;}

#hapidanbui_cp .ptop{
  display: none !important;
}

/*--------------
01_ヒーローエリア
--------------*/
#hapidanbui_cp .kv {
  background: var(--BASE-thirdly-blue, #D0EAFC);
}

#hapidanbui_cp h1 {
  max-width: 1028px;
  margin: 0 auto;
  padding: 0;
}

#hapidanbui_cp .navi_container {
  width: 100%;
  background: var(--CORE-jrp-blue, #004095);
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_container {
    margin-top: calc(63/375*100%);
  }
}

#hapidanbui_cp .navi_container::before {
  content: "";
  width: 100%;
  background: url("/hapidanbui_jrp2026/image/wave_bottom_shape.svg") repeat-x center top / 300px 87px,
  linear-gradient(transparent 50%, #004095 50%);
  position: absolute;
  top: 0;
  left: 0;
  margin-top: -87px;
  padding-top: 89px;
}

@media screen and (max-width: 1028px) {
  #hapidanbui_cp .navi_container::before {
    margin-top: calc(-87/1028*100%);
    padding-top: calc(89/1028*100%);
  }
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_container::before {
    margin-top: calc(-74/375*100%);
    padding-top: calc(76/375*100%);
  }
}

#hapidanbui_cp .navi_copy {
  position: absolute;
  width: 518px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  margin: -52px auto 0;
}

@media screen and (max-width: 1028px) {
  #hapidanbui_cp .navi_copy {
    width: calc(518/1028*100%);
    margin: calc(-52/1028*100%) auto 0;
  }
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_copy {
    width: calc(352/375*100%);
    margin: calc(-45/375*100%) auto 0;
  }
}

#hapidanbui_cp .navi_wrap {
  max-width: 1028px;
  padding: 8px 24px 0;
  margin: 0 auto;
}

@media screen and (max-width: 1028px) {
  #hapidanbui_cp .navi_wrap {
    padding: calc(8/1028*100%) calc(24/1028*100%) 0;
  }
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_wrap {
    padding: 0;
  }
}

#hapidanbui_cp .navi {
  margin: 0 auto;
  padding: 3px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: radial-gradient(circle, var(--BASE-TRUE-WHITE, #FFF) 1px, transparent 1px), radial-gradient(circle, var(--BASE-TRUE-WHITE, #FFF) 1px, transparent 1px);
  background-position: right top, left top;
  background-repeat: repeat-y, repeat-y;
  background-size: 2px 6px, 2px 6px;
}

@media screen and (max-width: 1028px) {
  #hapidanbui_cp .navi {
    padding: calc(3/980*100%) 0;
  }
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi {
    padding: 0;
    background-image: none;
  }
}

#hapidanbui_cp .navi li {
  flex: 1;
}

#hapidanbui_cp .navi li + li {
  background-image: radial-gradient(circle, var(--BASE-TRUE-WHITE, #FFF) 1px, transparent 1px);
  background-position: left top;
  background-repeat: repeat-y;
  background-size: 2px 6px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi li + li {
    background-image: none;
    border-left: 1px solid #466389;
  }
}

#hapidanbui_cp .navi li > a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: calc(14/325*100%) 0 calc(32/325*100%);
  box-sizing: border-box;
  text-decoration: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_btn {
    padding: calc(10/125*100%) calc(10/125*100%) calc(22/125*100%);
  }
}

#hapidanbui_cp .navi_btn {
  width: calc(152/325*100%);
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_btn {
    width: 100%;
  }
}

#hapidanbui_cp .navi_btn::after {
  content: "";
  position: absolute;
  background: url("/hapidanbui_jrp2026/image/icon_chevron_down.svg") no-repeat center / contain;
  width: calc(22/152*100%);
  padding-top: calc(22/152*100%);
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto calc(-22/152*100%);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .navi_btn::after {
    width: calc(22/100*100%);
    padding-top: calc(22/100*100%);
    margin: 0 auto calc(-4/100*100%);
  }
}

/*--------------
02_リードコンテナ
--------------*/

#hapidanbui_cp #read_container {
  background: var(--BASE-bg-sky-gradient, linear-gradient(180deg, #87D6F8 0%, #CAEBFE 14.9%, #E3F5FF 29.81%, #EEF9FF 61.06%, #FFF 100%));
  padding-top: 20px;
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #read_container {
    padding-top: 0px;
  }
}

#hapidanbui_cp .cloud_l {
  width: 563px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0 0 -116px -45px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .cloud_l {
    display: none;
  }
}

#hapidanbui_cp .cloud_r {
  width: 563px;
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 0 -199px -96px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .cloud_r {
    width: calc(572/375*100%);
    margin: 0 calc(-199/375*100%) calc(-69/375*100%) 0;
  }
}

#hapidanbui_cp .yacht {
  width: 77px;
  position: absolute;
  bottom:0;
  right: 0;
  left: 240px;
  margin: 0 auto -15px;
  z-index: 10;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .yacht {
    width: calc(77/375*100%);
    margin: 0 auto calc(-15/375*100%);
  }
}

#hapidanbui_cp .read_wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 75px 0 90px;  
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .read_wrap {
    padding: calc(56/375*100%) 0 calc(48/375*100%);  
  }
}

#hapidanbui_cp .seagull_left {
  width: 55px;
  position: absolute;
  left: 0;
  top: 0;
  margin: 19px 0 0 19px;
}

@media screen and (max-width: 750px) {
    #hapidanbui_cp .seagull_left {
      width: calc(55/375*100%);
      margin: calc(19/375*100%) 0 0 calc(19/375*100%);
    }
}

#hapidanbui_cp .seagull_right {
  width: 48px;
  position: absolute;
  right: 0;
  top: 0;
  margin: 101px 19px 0 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .seagull_right {
    width: calc(48/375*100%);
    margin: calc(101/375*100%) calc(19/375*100%) 0 0 ;
  }
}

#hapidanbui_cp .read {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 23px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .read {
    gap: 3.733vw;
  }
}

#hapidanbui_cp .read h2,
#hapidanbui_cp .read .read_txt {
  width: 526px;
  margin: 0;
  padding: 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .read h2,
  #hapidanbui_cp .read .read_txt {
    width: calc(315/375*100%);
  }
}

/*--------------
03_インフォ
--------------*/

#hapidanbui_cp #info {
  background: linear-gradient(180deg, #21A7C0 0%, #37C4DE 100%);
  padding: 64px 20px;
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #info {
    padding: calc(40/375*100%) calc(20/375*100%);
  }
}

#hapidanbui_cp .info_container {
  display: flex;
  max-width: 800px;
  margin: 0 auto;
  padding: 64px 96px;
  flex-direction: column;
  align-items: center;
  gap: 56px;
  border-radius: 16px;
  background: var(--BASE-TRUE-WHITE, #FFF);
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_container {
    padding: calc(40/375*100%) calc(32/375*100%);
    gap: 8.533vw;
  }
}

#hapidanbui_cp .sunglass {
  width: 88px;
  position: absolute;
  right: 0;
  top: 0;
  margin: 2px -6px 0 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .sunglass {
    width: calc(59/375*100%);
    right: 0;
    top: 0;
    margin: calc(2/375*100%) calc(-6/375*100%) 0 0;
  }
}

#hapidanbui_cp .icecream {
  width: 81px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0 0 -15px -1px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .icecream {
    width: calc(54/375*100%);
    position: absolute;
    left: 0;
    bottom: 0;
    margin: 0 0 calc(-14/375*100%) calc(-1/375*100%);
  }
}

#hapidanbui_cp .info_box_wrap {
  max-width: 560px;
  margin: 0 auto;
  padding: 0 calc(20/608*100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_box_wrap {
    margin: 0 auto;
    padding: 0;
    gap: 3.733vw;
  }
}

#hapidanbui_cp .info_ttl {
  max-width: 440px;
  margin: 0 auto;
  padding: 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_ttl {
    width: calc(171/271*100%);
  }
}

#hapidanbui_cp .info_txt01,
#hapidanbui_cp .info_txt02,
#hapidanbui_cp .info_txt03 {
  color: var(--CORE-jrp-blue, #004095);
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  line-height: 100%;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_txt01,
  #hapidanbui_cp .info_txt02,
  #hapidanbui_cp .info_txt03 {
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .info_txt02 {
  font-size: 20px;
  line-height: 150%;
  text-align: left;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_txt02 {
    font-size: clamp(14px, 3.733vw, 28px);
  }
}

#hapidanbui_cp .info_txt03 {
  font-size: 24px;
  line-height: 150%;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_txt03 {
    font-size: clamp(14px, 3.733vw, 28px);
  }
}

#hapidanbui_cp .info_txt01 .year {font-size: 24px;}
#hapidanbui_cp .info_txt01 .m-d {font-size: 40px;}
#hapidanbui_cp .info_txt01 .to {font-size: 20px;}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_txt01 .year {font-size: inherit;}
  #hapidanbui_cp .info_txt01 .m-d {font-size: clamp(22px, 5.866vw, 44px);}
  #hapidanbui_cp .info_txt01 .to {font-size: inherit;}
}

#hapidanbui_cp .info_txt03 .large {font-size: 36px;}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_txt03 .large {font-size: clamp(20px, 5.333vw, 40px);}
}

#hapidanbui_cp .info_notes {
  color: var(--CORE-jrp-blue, #004095);
  font-size: 15px;
  font-weight: 300;
  line-height: 150%; /* 22.5px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .info_notes {font-size: clamp(11px, 2.933vw, 22px);}
}

/*--------------
04_メインセクション
04_01_オリジナル駅弁
--------------*/
#hapidanbui_cp #main_section {
  background:
  url("/hapidanbui_jrp2026/image/img_bottom_forest_pc.png") no-repeat center bottom / 1440px,
  url("/hapidanbui_jrp2026/image/bg_pattern.png") repeat center;
  padding: 0 20px 1040px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #main_section {
    background:
    url("/hapidanbui_jrp2026/image/img_bottom_forest_sp.png") no-repeat center bottom / contain,
    url("/hapidanbui_jrp2026/image/bg_pattern.png") repeat center;
    padding: 0 calc(20/375*100%) calc(467/375*100%);
  }
}

#hapidanbui_cp #ekiben { 
  padding: 132px 0 112px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #ekiben {
    padding: calc(85/375*100%) 0 calc(127/375*100%);
  }
}

#hapidanbui_cp .main_section_container,
#hapidanbui_cp .main_section_container_foods,
#hapidanbui_cp .main_section_container_goods {
  max-width: 920px;
  margin: 0 auto;
  padding-bottom: 135px;
  border-radius: 24px;
  background: var(--BASE-bg-yellow, #FEFAB2);
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_container,
  #hapidanbui_cp .main_section_container_foods,
  #hapidanbui_cp .main_section_container_goods {
    padding-bottom: calc(20/335*100%);
    border-radius: 16px;
  }
}

#hapidanbui_cp .main_section_ttl,
#hapidanbui_cp .main_section_ttl_foods,
#hapidanbui_cp .main_section_ttl_goods {
  max-width: 726px;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left:0;
  right: 0;
  margin: -75px auto 0;
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_ttl,
  #hapidanbui_cp .main_section_ttl_foods,
  #hapidanbui_cp .main_section_ttl_goods {
    width: 100%;
    margin: calc(-55/335*100%) auto 0;
  }
}

#hapidanbui_cp .ekiben_container {
  padding-top: 130px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_container {
    padding-top: calc(63/335*100%);
  }
}

#hapidanbui_cp .ekiben_slide_read {
  max-width: 577px;
  margin: 0 auto;
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_slide_read {
    width: calc(289/335*100%);
  }
}


/* ----- スワイパー_駅弁 ----- */

.ekiben_swiper {
  max-width: 624px;
  margin: 34px auto 0;
  background-color: #fff;
  border-radius: 20px;
  position: relative;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper {
    width: calc(295/335*100%);
    margin: calc(32/335*100%) auto 0;
  }
}

.ekiben_swiper_body {
  width: 100%;
  padding:0;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_body {
    padding:0;
  }
}

.ekiben_swiper_main {
  width: 100%;
  overflow: hidden;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  padding:47px 66px;
}

@media screen and (max-width: 750px) {
  .swiper-slide img {
    padding:calc(22/295*100%) calc(28/295*100%);
  }
}

.ekiben_swiper_pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;  
  margin: 0 auto -37px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 13px;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_pagination {
    position: absolute;
    margin: 0 auto calc(-27/295*100%);
    gap: calc(13/295*100%);
  }
}

.ekiben_swiper_pagination .swiper-pagination-bullet {
  width: 15px;
  height: auto;
  aspect-ratio: 1/1;
  margin: 0 !important;
  background: #D9D9D9;
  opacity: 1;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_pagination .swiper-pagination-bullet {
    width: calc(8/295*100%);
  }
}

.ekiben_swiper_pagination .swiper-pagination-bullet-active {
  background: #2B7CCD;
}

.ekiben_swiper_prev,
.ekiben_swiper_next {
  width: 46px;
  height: auto;
  aspect-ratio: 1/1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin-top: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_prev,
  .ekiben_swiper_next {
    width: calc(22/295*100%);
  }
}

/* デフォルトの矢印を消す */
.ekiben_swiper_prev::after,
.ekiben_swiper_next::after {
  display: none;
}

/* 左矢印 */
.ekiben_swiper_prev {
  left: -24px; /* 枠にかかる感じ */
  background: url("/hapidanbui_jrp2026/image/icon_chevron_incircle_left.svg") no-repeat center / contain;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_prev {
    left: calc(-11/295*100%);
  }
}

/* 右矢印 */
.ekiben_swiper_next {
  right: -24px; /* 枠にかかる感じ */
  background: url("/hapidanbui_jrp2026/image/icon_chevron_incircle_right.svg") no-repeat center / contain;
}

@media screen and (max-width: 750px) {
  .ekiben_swiper_next {
    right: calc(-11/295*100%);
  }
}

/* ----- スワイパー_駅弁 ここまで ----- */

#hapidanbui_cp .ekiben_name {
  margin: 50px auto 0;
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 38.4px;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 1.92px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_name {
    margin: calc(30/335*100%) auto 0;
    font-size: clamp(21.5px, 5.733vw, 43px);
    letter-spacing: 1.075px;
  }
}

#hapidanbui_cp .ekiben_name .price {
  font-size: 40.8px;
  letter-spacing: 0;
}

#hapidanbui_cp .ekiben_name .en {
  font-size: 28.8px;
  letter-spacing: 0;
}

#hapidanbui_cp .ekiben_name .tax {
  font-size: 19.2px;
  letter-spacing: 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_name .price {
    font-size: clamp(22px, 5.866vw, 44px);
  }

  #hapidanbui_cp .ekiben_name .en {
    font-size: clamp(18px, 4.8vw, 36px);
  }

  #hapidanbui_cp .ekiben_name .tax {
    font-size: clamp(14px, 3.733vw, 28px);
  }
}

#hapidanbui_cp .ekiben_name_notes {
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 100%; /* 18px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_name_notes {
    font-size: clamp(10.5px, 2.8vw, 21px);
  }
}

#hapidanbui_cp .ekiben_menu_container {
  background: url("/hapidanbui_jrp2026/image/bg_ekiben_spec.svg") no-repeat center bottom;
  margin: 62px auto 0;
  width: 540px;
  position: relative;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_menu_container {
    margin: calc(22/335*100%) auto 0;
    width: calc(312/335*100%);
  }
}

#hapidanbui_cp .ekiben_menu_balloon {
  position: absolute;
  width: 440px;
  top: 0; 
  left: 0;
  margin: -25px 0 0 60px;
  pointer-events: none;
  z-index: 2;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_menu_balloon {
    width: calc(247/312*100%);
    margin: calc(-7/312*100%) 0 0 calc(42/312*100%);
  }
}

#hapidanbui_cp .ekiben_menu_image {
  width: 353px;
  margin:0 auto;
  padding-top: 178px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_menu_image {
    width: calc(206/312*100%);
    padding-top: calc(104/312*100%);
  }
}

#hapidanbui_cp .ekiben_menu_zoom {
  width: 325px;
  margin:20px auto 0;
  padding-bottom: 80px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_menu_zoom {
    width: calc(188/312*100%);
    margin:calc(11/312*100%) auto 0;
    padding-bottom: calc(37/312*100%);
  }
}

#hapidanbui_cp .ekiben_acrylic_container {
  width: 616px;
  border-radius: 41px;
  background: rgba(255, 255, 255, .8);
  margin: 30px auto 0;
  padding: 0 0 35px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_container {
    width: calc(287/335*100%);
    border-radius: 24px;
    margin: calc(26/335*100%) auto 0;
    padding: 0 0 calc(20/335*100%) 0;
  }
}

#hapidanbui_cp .ekiben_acrylic_ttl {
  width: 510px;
  margin: 0 auto;
  padding-top: 20px;
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_ttl {
    width: 100%;
    margin: 0 auto;
    padding-top: calc(12/287*100%);
  }
}

#hapidanbui_cp .ekiben_acrylic_ttl02 {
  width: 384px;
  margin: 15px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_ttl02 {
    width: calc(222/287*100%);
    margin: calc(8/287*100%) auto 0;
  }
}

#hapidanbui_cp .ekiben_acrylic_list {
  width: 428px;
  margin: 28px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 28px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_list {
    width: calc(240/287*100%);
    margin: calc(16/287*100%) auto 0;
    gap: 4.266vw calc(16/287*100%);
  }
}

#hapidanbui_cp .ekiben_acrylic_list li {
  width: 200px;
  background: url("/hapidanbui_jrp2026/image/bg_paper.svg") no-repeat center top / contain;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_list li {
    width: calc(112/240*100%);
  }
}

#hapidanbui_cp .ekiben_acrylic_list li img {
  width: 130px;
  margin: 0 auto;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_list li img {
    width: calc(74/112*100%);
  }
}

#hapidanbui_cp .ekiben_acrylic_notes {
  margin: calc(28/616*100%) auto 0;
  padding: 0 calc(60/616*100%);
  color: var(--TEXT-text-black, #595F63);
  font-size: 20px;
  font-weight: 400;
  line-height: 150%; /* 30px */
  text-align: center;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_acrylic_notes {
    margin: calc(16/287*100%) auto 0;
    padding: 0 calc(20/287*100%);
    font-size: clamp(11px, 2.933vw, 22px);
  }
}

#hapidanbui_cp .main_info_container {
  width: 616px;
  margin: 56px auto 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_container {
    width: calc(295/335*100%);
    margin: calc(40/335*100%) auto 0;
    gap: 10.666vw;
  }
}

#hapidanbui_cp .main_info_ttl {
  display: flex;
  padding: 16px 0;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  background: var(--BASE-secondary-blue, #2B7CCD);
  color: var(--BASE-TRUE-WHITE, #FFF);
  -webkit-text-stroke-width: 0.15px;
  -webkit-text-stroke-color: var(--BASE-TRUE-WHITE, #FFF);
  font-size: 24px;
  font-weight: 700;
  line-height: 100%; /* 24px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_ttl {
    display: flex;
    padding: calc(14/295*100%) 0;
    font-size: clamp(18px, 4.8vw, 36px);
  }
}

#hapidanbui_cp .main_info_day {
  margin: calc(16/616*100%) auto 0;
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_day {
    margin: calc(16/295*100%) auto 0;
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .main_info_day .m-d {
  font-size: 24px;
}

#hapidanbui_cp .main_info_day .to {
  font-size: 16px;
  font-weight: 300;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_day .m-d {
    font-size: clamp(24px, 6.4vw, 48px);
  }

  #hapidanbui_cp .main_info_day .to {
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .shop_container {
  width: 100%;
  margin: 20px auto 0;
  border-radius: 6px;
  overflow: hidden;
  background-color: var(--BASE-TRUE-WHITE);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .shop_container {
    margin: calc(20/295*100%) auto 0;
    border-radius: 6px;
    overflow: hidden;
    background-color: var(--BASE-TRUE-WHITE);
  }
}

#hapidanbui_cp .shop_container + .shop_container {
  margin: 24px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .shop_container + .shop_container {
    margin: calc(24/295*100%) auto 0;
  }
}

#hapidanbui_cp .shop_area_ttl {
  background: var(--BASE-thirdly-blue, #D0EAFC);
  padding: 12px;
  color: var(--CORE-jrp-blue, #004095);
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 24px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .shop_area_ttl {
    padding: calc(12/295*100%);
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .area_wrap {
  padding: 10px 10px 16px; 
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .area_wrap {
    padding: calc(10/295*100%) calc(20/295*100%) calc(16/295*100%) calc(10/295*100%); 
  }
}

/* ----- アコーディオン ----- */

/* 駅ごと */
#hapidanbui_cp .station_item{
    border-top:2px dotted #000;
    margin-top: 20px;
    padding-top: 20px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_item{
      border-top:2px dotted #000;
      margin-top: calc(20/265*100%);
      padding-top: calc(20/265*100%);
  }
}

#hapidanbui_cp .station_item:first-child{
    border-top:none;
    margin-top: 0;
    padding-top: calc(10/596*100%);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_item:first-child{
      padding-top: calc(10/265*100%);
  }
}

/* ボタン */
#hapidanbui_cp .station_btn{
    width:100%;
    padding-left:8px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border:none;
    background:#fff;
    cursor:pointer;
    text-align:left;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_btn{
      padding-left:calc(8/265*100%);
  }
}

#hapidanbui_cp .station_name{
    color: var(--TEXT-text-black, #595F63);
    font-size: 16px;
    font-weight: 600;
    line-height: 100%;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_name{
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .caution_btn{
    width:100%;
    padding:8px 8px 8px 20px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:none;
    background:var(--BASE-TRUE-WHITE);
    cursor:pointer;
    gap:10px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .caution_btn{
      padding:calc(8/295*100%) calc(8/295*100%) calc(8/295*100%) calc(20/295*100%);
      gap:calc(10/295*100%);
  }
}

#hapidanbui_cp .caution_ttl{
    color: var(--TEXT-text-black, #595F63);
    text-align: center;
    font-size: 18px;
    font-weight: 700;
}

@media screen and (max-width: 750px) {
    #hapidanbui_cp .caution_ttl{
      font-size: clamp(18px, 4.8vw, 36px);
  }
}

/* ＋－アイコン */
#hapidanbui_cp .icon{
    width:24px;
    padding-top: 24px;
    background:url("/hapidanbui_jrp2026/image/icon_incircle_plus.svg") no-repeat center/contain;
    flex-shrink:0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .icon{
    width:calc(24/295*100%);
    padding-top: calc(24/295*100%);
  }
}

#hapidanbui_cp .station_btn.is-open .icon,
#hapidanbui_cp .caution_btn.is-open .icon{
    background-image:url("/hapidanbui_jrp2026/image/icon_incircle_minus.svg");
}

/* コンテンツ */
#hapidanbui_cp .station_content,
#hapidanbui_cp .caution_content{
    height:0;
    overflow:hidden;
    transition:height .35s ease;
}

/* リスト */
#hapidanbui_cp .station_content ul{
    list-style:none;
    margin:0;
    padding-top:16px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_content ul{
      padding-top:calc(16/265*100%);
  }
}

#hapidanbui_cp .station_content li{
    margin-top:8px;
    position:relative;
    padding-left:24px;
    color: var(--TEXT-text-black, #595F63);
    font-size: 16px;
    font-weight: 600;
    line-height: 150%; /* 24px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_content li{
      margin-top:calc(8/265*100%);
      padding-left:calc(24/265*100%);
      font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .station_content li:first-child{
    margin-top:0;
}

/* 三角 */
#hapidanbui_cp .station_content li::before{
    content:"";
    position:absolute;
    background: url("/hapidanbui_jrp2026/image/arrow.svg") no-repeat center top / contain;
    left:0;
    top:0;
    width: 13px;
    padding-top: 11px;
    margin: 7px 0 0 7px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .station_content li::before{
      width: calc(13/265*100%);
      padding-top: calc(11/265*100%);
      margin: calc(7/265*100%) 0 0 calc(7/265*100%);
  }
}

#hapidanbui_cp .station_content a {
    color: var(--TEXT-text-black, #595F63) !important;
    text-decoration:underline;
}

#hapidanbui_cp .caution_list {
  padding: 12px 20px 20px;
  list-style: disc !important;
  color: var(--TEXT-text-black, #595F63);
  font-size: 12px;
  font-weight: 400;
  line-height: 167.5%; /* 20.1px */
  margin-left: 20px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .caution_list {
    padding: calc(12/295*100%) calc(20/295*100%) calc(20/295*100%);
    font-size: clamp(12px, 3.2vw, 24px);
    margin-left: calc(20/295*100%);
  }
}

#hapidanbui_cp .caution_list li {
  list-style: disc !important;
}


/* ----- アコーディオン ここまで -----*/


#hapidanbui_cp .gide_ttl {
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: normal;
  text-align: center;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .gide_ttl {
    font-size: clamp(14px, 3.7333vw, 28px);
  }
}

#hapidanbui_cp .gide_list {
  margin-top: 10px;
  padding: 0 16px;
  color: var(--TEXT-text-black, #595F63);
  font-size: 12px;
  font-weight: 400;
  line-height: 167.5%; /* 20.1px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .gide_list {
    margin-top: calc(10/295*100%);
    padding: 0 calc(16/295*100%);
    font-size: clamp(12px, 3.2vw, 24px);
  }
}

#hapidanbui_cp .main_caution_wrap {
  background-color: var(--BASE-TRUE-WHITE);
  border-radius: 6px;
  overflow: hidden;
}

#hapidanbui_cp .ekiben_illust01 {
  width: 165px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0 0 calc(-100/920*100%) calc(-21/920*100%);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_illust01 {
    width: calc(110/335*100%);
    margin: 0 0 calc(-116/335*100%) calc(-21/335*100%);
  }
}

#hapidanbui_cp .ekiben_illust02 {
  width: 192px;
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 0 -23px -100px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ekiben_illust02 {
    width: calc(128/335*100%);
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 0 calc(-23/335*100%) calc(-113/335*100%) 0;
  }
}

/*--------------
04_メインセクション
04_02_コラボ商品
--------------*/

#hapidanbui_cp #foods {
  padding:73px 0 190px
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #foods {
    padding: calc(73/375*100%) 0 calc(128/375*100%);
  }
}

#hapidanbui_cp .main_section_container_foods {
  padding-bottom: 56px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_container_foods {
    padding-bottom: calc(30/335*100%);
  }
}

#hapidanbui_cp .main_section_ttl_foods {
  margin: -63px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_ttl_foods {
    margin: calc(-63/335*100%) auto 0;
  }
}

#hapidanbui_cp .foods_container {
  padding-top: 197px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_container {
    padding-top: calc(78/335*100%);
    gap: 8.533vw;
  }
}

#hapidanbui_cp .food_read {
  max-width: 610px;
  margin: 0 auto;
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .food_read {
    width: calc(289/335*100%);
  }
}

#hapidanbui_cp .foods_date_ttl {
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_date_ttl:nth-child(2) {
    margin-top: calc(16/335*100%);
  }
}

#hapidanbui_cp .foods_list {
  width: 616px;
  padding: 0 28px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap:40px 48px;
  margin: -28px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_list {
    width: 100%;
    padding: 0 calc(20/335*100%);
    gap:5.6vw calc(21/335*100%);
    margin: calc(-2/335*100%) auto 0;
  }
}

#hapidanbui_cp .foods_list li {
  width: 256px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  background: url("/hapidanbui_jrp2026/image/bg_paper.svg") no-repeat center top / contain;
  text-align: center;
  gap:7px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_list li {
    width: calc(137/295*100%);
    gap:1.665vw;
  }
}

#hapidanbui_cp .foods_list li img {
  width: 256px;
  margin: 0 auto;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_list li img {
    width: calc(137/137*100%);
  }
}

#hapidanbui_cp .foods_list p {
  margin-top: auto;
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  line-height: 150%;
}

#hapidanbui_cp .foods_list p span.cap_text {
  font-size: 0.88883em;
}

#hapidanbui_cp .foods_list p span.title {
  font-weight: 600;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_list p {
    font-size: clamp(12px, 3.2vw, 24px);
  }
}

#hapidanbui_cp .foods_list p .price {
  font-size: 28px;
}

#hapidanbui_cp .foods_list p .en_tax {
  font-size: 16px;
}

#hapidanbui_cp .foods_list p .limit {
  font-size: 16px;
  font-weight: 400;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_list p .price {
    font-size: clamp(18px, 4.8vw, 36px);
  }

  #hapidanbui_cp .foods_list p .en_tax {
    font-size: clamp(11px, 2.933vw, 22px);
  }

  #hapidanbui_cp .foods_list p .limit {
    font-size: clamp(10.5px, 2.8vw, 21px);
  }
}

#hapidanbui_cp .foods_illust01 {
  width: 162px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0 0 calc(-167/920*100%) calc(-11/920*100%);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_illust01 {
    width: calc(108/335*100%);
    margin: 0 0 calc(-92/335*100%) calc(-7/335*100%);
  }
}

#hapidanbui_cp .foods_illust02 {
  width: 218px;
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 0 -12px -206px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .foods_illust02 {
    width: calc(145/335*100%);
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 0 calc(-16/335*100%) calc(-132/335*100%) 0;
  }
}

/* ----- インビュー -----*/

#hapidanbui_cp .inview_up {
  opacity: 0;
}
#hapidanbui_cp .inview_up.active {
  animation: inview_up 0.35s ease-in 0.25s forwards;
}

@keyframes inview_up {
  from {
    opacity: 0;
    transform: translateY(5%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ----- インビュー ここまで -----*/

/*--------------
04_メインセクション
04_03_コラボグッズ
--------------*/

#hapidanbui_cp #goods {
  padding-top:65px
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp #goods {
    padding-top: calc(65/375*100%);
  }
}

#hapidanbui_cp .main_section_container_goods {
  padding-bottom: 87px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_container_goods {
    padding-bottom: calc(40/335*100%);
  }
}

#hapidanbui_cp .main_section_ttl_goods {
  margin: -55px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_section_ttl_goods {
    margin: calc(-55/335*100%) auto 0;
  }
}

#hapidanbui_cp .goods_container {
  padding-top: 140px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_container {
    padding-top: calc(63/335*100%);
    gap: 10.666vw;
  }
}

#hapidanbui_cp .good_read {
  max-width: 610px;
  margin: 0 auto;
  pointer-events: none;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .good_read {
    width: calc(285/295*100%);
  }
}

#hapidanbui_cp .good_read_zoom {
  width: 398px;
  display: flex;
  padding-left: 33.624px;
  justify-content: flex-end;
  align-items: center;
  margin: 32px auto 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .good_read_zoom {
    width: calc(285/295*100%);
    display: flex;
    padding-left: calc(22/295*100%);
    margin: calc(32/295*100%) auto 0;
  }
}

#hapidanbui_cp .goods_list {
  width: 616px;
  margin: 24px auto 0;
  padding: 0 28px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap:48px 40px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_list {
    width: 100%;
    margin: calc(24/295*100%) auto 0;
    padding: 0;
    gap:6.4vw calc(19/295*100%);
  }
}

#hapidanbui_cp .goods_list li {
  width: 260px;
  display: flex;
  flex-direction: column;
  gap:10px;
  cursor: pointer;
  transition: filter var(--transition);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_list li {
    width: calc(138/295*100%);
    gap:1.333vw;
  }
}

#hapidanbui_cp .goods_list li:hover {
  filter: opacity(0.7);
}

#hapidanbui_cp .goods_name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:4px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_name {
    gap:.533vw;
  }
}

#hapidanbui_cp .goods_name p {
  color: var(--BASE-secondary-blue, #2B7CCD);
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 150%;
  text-shadow:
    -1.075px -1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
     1.075px -1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
    -1.075px  1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
     1.075px  1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
     0    -1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
     0     1.075px 0 var(--BASE-TRUE-WHITE, #FFF),
    -1.075px   0   0 var(--BASE-TRUE-WHITE, #FFF),
     1.075px   0   0 var(--BASE-TRUE-WHITE, #FFF);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_name p {
    font-size: clamp(11px, 2.933vw, 22px);
  }
}

#hapidanbui_cp .goods_name p .price {
  font-size: 30px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_name p .price {
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .goods_wrap {
  width: 616px;
  margin: 0 auto;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_wrap {
    width: 100%;
    padding: 0 calc(20/335*100%);
  }
}

#hapidanbui_cp .main_info_notes {
  margin-top: 16px;
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 400;
  line-height: 167.5%; /* 23.45px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_notes {
    margin-top: calc(16/295*100%);
    font-size: clamp(14px, 3.733vw, 28vw);
  }
}

#hapidanbui_cp .main_info_text {
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 400;
  line-height: 167.5%; /* 23.45px */
  margin: 20px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .main_info_text {
    font-size: clamp(14px, 3.733vw, 28px);
    margin: 20px 0;
  }
}

#hapidanbui_cp .ols_wrap {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ols_wrap {
    gap: 5.333vw;
  }
}

#hapidanbui_cp .ols_ttl {
  color: var(--TEXT-text-black, #595F63);
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
  padding: 0;
  margin-bottom: 8px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ols_ttl {
    font-size: clamp(16px, 4.266vw, 32px);
    margin-bottom: calc(8/295*100%);
  }
}

#hapidanbui_cp .ols_text {
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 400;
  line-height: 200%; /* 28px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ols_text {
    font-size: clamp(14px, 3.733vw, 28vw);
  }
}

#hapidanbui_cp .ols_text a {
  color: var(--CORE-jrp-blue, #004095);
  text-decoration-line: underline;
  line-height: 200%;
}

#hapidanbui_cp .ols_text .day {
  font-size: 16px;
  font-weight: 700;
}

#hapidanbui_cp .ols_text .open {
  font-size: 18px;
  font-weight: 700;
}

#hapidanbui_cp .ols_text .plan {
  font-size: 16px;
  font-weight: 700;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ols_text .day {
    font-size: clamp(16px, 4.266vw, 32px);
  }

  #hapidanbui_cp .ols_text .open {
    font-size: clamp(18px, 4.8vw, 36px);
  }

  #hapidanbui_cp .ols_text .plan {
    font-size: clamp(16px, 4.266vw, 32px);
  }
}

#hapidanbui_cp .mt_12 {
  margin-top: 12px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .mt_12 {
    margin-top: calc(12/295*100%);
  }
}

#hapidanbui_cp .ols_list {
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 400;
  line-height: 167.5%; /* 23.45px */
  margin: 20px 0 0 2em;
  padding: 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .ols_list {
    font-size: clamp(14px, 3.733vw, 28px);
    margin: calc(20/295*100%) 0 0 1.5em;
  }
}

#hapidanbui_cp .ols_list li {
  list-style: disc !important;
}

#hapidanbui_cp .goods_illust01 {
  width: 147px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0 0 calc(-134/920*100%) calc(-1/920*100%);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_illust01 {
    width: calc(97/335*100%);
    transform: rotate(-0.89deg);
    margin: 0 0 calc(-84/335*100%) calc(-1/335*100%);
  }
}

#hapidanbui_cp .goods_illust02 {
  width: 128px;
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 0 0 -106px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .goods_illust02 {
    width: calc(85/335*100%);
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 0 calc(-2/335*100%) calc(-82/335*100%) 0;
  }
}

/* ▽ モーダル --------------*/

#hapidanbui_cp .modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
}

/* 表示時だけflex */
#hapidanbui_cp .modal.is-active {
  display: block; 
  overflow-y: auto;/* ← スクロール */
  -webkit-overflow-scrolling: touch; /* ← iOS対応 */
}

/* 背景 */
#hapidanbui_cp .modal_overlay {
  position: fixed; 
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 0; 
}

/* 中身 */
#hapidanbui_cp .modal_content {
  position: relative;
  max-width: 490px;
  /* max-height: 60vh; */
  background: #fff;
  border-radius: 14px;
  overflow: visible; 
  z-index: 1;
  display: flex;
  flex-direction: column;
  margin: 60px auto; 
  pointer-events: auto;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_content {
    width: calc(350/375*100%);
    border-radius: 10px;
    margin: 90px auto; 
  }
}

/* グッズ紹介 */
#hapidanbui_cp .modal_content.-intro {
  background-color: #fff;
  padding: 45px 32px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_content.-intro {
    padding: calc(32/350*100%) calc(20/350*100%);
  }
}

#hapidanbui_cp .intro_wrap {
  display: flex;
  flex-direction: column;
  gap:22px;
  margin: 0 auto;
  padding: 40px 10px 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .intro_wrap {
    gap:3.265vw;
    margin: 0 auto;
    padding: calc(40/310*100%) 0 0;
  }
}

#hapidanbui_cp .intro_goods_name {
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  line-height: 150%; /* 42px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .intro_goods_name {
    font-size: clamp(20px, 4.081vw, 40px);
  }
}

#hapidanbui_cp .intro_goods_price {
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 34px;
  font-weight: 700;
  line-height: 100%; /* 34px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .intro_goods_price {
    font-size: clamp(24px, 6.4vw, 48px);
  }
}

#hapidanbui_cp .intro_goods_price .en-tax {
  font-size: 22px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .intro_goods_price .en-tax {
    font-size: clamp(16px, 3.265vw, 20.896px);
  }
}

#hapidanbui_cp .intro_goods_size {
  color: var(--TEXT-text-black, #595F63);
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  line-height: 150%; /* 30px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .intro_goods_size {
    font-size: clamp(14px, 2.857vw, 18.284px);
  }
}

/* スクロール領域 */
.modal_body {
  overflow-y: visible;
}

/* 閉じるボタン */
#hapidanbui_cp .modal_close {
  position: absolute;
  width: 56px;
  display: block;
  top: 0;
  right: 0;
  margin: 14px 14px 0 0;
  border: none;
  cursor: pointer;
  z-index: 2;
  background-color: transparent;
}


@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_close {
    width: calc(40/350*100%);
    margin: calc(14/350*100%) calc(14/350*100%) 0 0;
  }
}


/* ----- スワイパー_モーダル ----- */

#hapidanbui_cp .modal_swiper {
  width: 100%;
  background-color: #fff;
  position: relative;
  display: block;
}

#hapidanbui_cp .modal_swiper_body {
  padding:0 calc(4/310*100%);
}

#hapidanbui_cp .modal_swiper_main {
  width: 100%;
  background-color: #fff;
}

#hapidanbui_cp .modal_swiper_main .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  padding:12px 28px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_main .swiper-slide img {
    padding:calc(20/302*100%);
  }
}

#hapidanbui_cp .modal_swiper_pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;  
  margin: 0 auto -28px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 13px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_pagination {
    position: absolute;
    margin: 0 auto calc(-28/302*100%);
    gap: calc(8/302*100%);
  }
}

#hapidanbui_cp .modal_swiper_pagination .swiper-pagination-bullet {
  width: 11px;
  height: auto;
  aspect-ratio: 1/1;
  margin: 0 !important;
  background: #D9D9D9;
  opacity: 1;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_pagination .swiper-pagination-bullet {
    width: calc(8/302*100%);
  }
}

#hapidanbui_cp .modal_swiper_pagination .swiper-pagination-bullet-active {
  background: #2B7CCD;
}

#hapidanbui_cp .modal_swiper_prev,
#hapidanbui_cp .modal_swiper_next {
  width: 40px;
  height: auto;
  aspect-ratio: 1/1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin-top: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_prev,
  #hapidanbui_cp .modal_swiper_next {
    width: calc(28/302*100%);
  }
}

/* デフォルトの矢印を消す */
#hapidanbui_cp .modal_swiper_prev::after,
#hapidanbui_cp .modal_swiper_next::after {
  display: none;
}

/* 左矢印 */
#hapidanbui_cp .modal_swiper_prev {
  left: -24px; /* 枠にかかる感じ */
  background: url("/hapidanbui_jrp2026/image/icon_chevron_incircle_left.svg") no-repeat center / contain;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_prev {
    left: calc(-14/302*100%);
  }
}

/* 右矢印 */
#hapidanbui_cp .modal_swiper_next {
  right: -24px; /* 枠にかかる感じ */
  background: url("/hapidanbui_jrp2026/image/icon_chevron_incircle_right.svg") no-repeat center / contain;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .modal_swiper_next {
    right: calc(-14/302*100%);
  }
}

/* ----- スワイパー_モーダル ここまで ----- */

/*--------------
バナーエリア
--------------*/
#hapidanbui_cp .banner_area {
  display: flex;
  padding: 56px 0 72px 0;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  border-bottom: 2px solid var(--CORE-jre-primary-orange, #EA6C00);
  background: var(--BASE-bg-yellow, #FEFAB2);
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area {
    display: flex;
    padding: calc(20/375*100%) 0 calc(24/375*100%) 0;
    gap: 5.333vw;
  }
}

#hapidanbui_cp .banner_area_ttl_wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_ttl_wrap {
    gap: 3.2vw;
  }
}

#hapidanbui_cp .banner_area_ttl {
  width: 319px;
  margin: 0;
  padding: 0;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_ttl {
    width: calc(320/375*100%);
  }
}

#hapidanbui_cp .banner_area_read {
  width: 520px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_read {
    width: 100%;
  }
}

#hapidanbui_cp .banner_area_name {
  width: 307px;
  margin: 0 auto;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_name {
    width: calc(267/375*100%);
  }
}

#hapidanbui_cp .banner_area_banner {
  margin: 20px auto 0;
  width: 670px;
  display: block;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_banner {
    margin: calc(20/375*100%) auto 0;
    width: calc(335/375*100%);
  }
}

#hapidanbui_cp .banner_area_details {
  width: 250px;
  margin: 16px auto 0;
  display: block;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .banner_area_details {
    width: calc(250/375*100%);
    margin: calc(16/375*100%) auto 0;
  }
}

/*--------------
注釈エリア
--------------*/
#hapidanbui_cp .notice_area {
  padding: 32px 20px 104px;
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .notice_area {
    padding: calc(32/375*100%) calc(20/375*100%) calc(104/375*100%);
  }
}

#hapidanbui_cp .notice_wrap {
  max-width:900px;
  margin: 0 auto;
}

#hapidanbui_cp .notice_list {
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 500;
  line-height: 167.5%; /* 23.45px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .notice_list {
    font-size: clamp(14px, 3.7333vw, 28px);
    line-height: 167.5%; /* 23.45px */
  }
}

#hapidanbui_cp .notice_cr {
  border-top: 2px solid #CCC;
  margin-top: 28px;
  padding-top: 28px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: var(--TEXT-text-black, #595F63);
  font-size: 14px;
  font-weight: 400;
  line-height: 100%; /* 14px */
}

@media screen and (max-width: 750px) {
  #hapidanbui_cp .notice_cr {
    margin-top: calc(28/375*100%);
    padding-top: calc(28/375*100%);
    font-size: clamp(14px, 3.7333vw, 28px);
  }
}