body { color: #000; position: relative; background-color: #7eccf3;}
.bg_red { background-color: #7eccf3;}
/* header::before { content: ''; position: absolute; z-index: -1;width: 100%; height: 80%; background: url(/img/top/bg-bf.png);} */
header > .inner { max-width: 1100px; margin: 23px auto 20px;}
header .logo_box { position: relative;}
header .logo_box::before {
  content: ''; position: absolute; top: 60%; right:clamp(-80%,-18.2vw,-50%); transform: translateY(-50%); 
  width: clamp(137px,20.2vw,240px); 
  /* height: clamp(70px,9.2vw,100px); */
  aspect-ratio: 64 / 27;
  /* width: clamp(195px,20.2vw,255px); height: clamp(70px,9.2vw,100px); */
  background: url(/img/top/autumn_sail.webp) no-repeat top / contain;
}
.more {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    #7eccf3  60%
  ); }
  .bg_red .more {
    background: linear-gradient(
    to bottom,
    rgba(249, 213, 213, 0) 0%,
    #7eccf3 60%
  );
  }
.more > .btn { display:inline-block; width:240px; padding:.4em 1em; color:#000; font-weight:bold; background-color:#ac1117; border-radius:2em; }
.btn_area ul li a { background-color: #fff;}

#info { color: #000;}
[class^="info-"] .tel > a { 
  font-size: 2.8em;
  text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
  -1px 1px 0 #FFF, 1px -1px 0 #FFF,
  0px 1px 0 #FFF,  0-1px 0 #FFF,
  -1px 0 0 #FFF, 1px 0 0 #FFF;
}
[class^="info-"] .tel > a::before { text-shadow: 0 0 BLACK;}
[class^="info-"] .shop { font-weight: bold;}

.shop_dtl { background-color: rgba(0, 0, 0, 0.3);}
.shop_dtl_txt .name { color: #000;}
.shop_dtl_txt a { color: #000;}

.f_nav a { color: #000; font-weight: bold;}
.f_nav li::before { border-color: transparent transparent transparent #000;}

.calendar_img { width: fit-content; margin-inline: auto; background-color: #fff;}

@media screen and (max-width:599px) {
  body { color: #000;}
  body::before {
    background: #7eccf3;
  }
  header::before { top: 0; height: 100%; background-position: top; background-size: 45%;}
  header .logo { width: 150px; position: relative;}
  /* header .logo::before {
  content: ''; position: absolute; top: 60%; right: -10em; transform: translateY(-50%); width: clamp(130px,35vw,200px); height: 5.5em; background: url(/img/top/big-bonus.png?20260609) no-repeat top / contain;
  } */
header .logo::before {
  content: '';
  position: absolute;
  top: 60%;
  right: -39vw;
  transform: translateY(-50%);
  width: clamp(135px, 39vw, 200px);
  aspect-ratio: 64 / 27;
  background: url(/img/top/autumn_sail.webp) no-repeat top / contain;
}  
  #gnav [class^="info-"] .shop {color: #000;}

  .more {
    background: linear-gradient(
      to bottom,
      rgba(249, 213, 213, 0) 0%,
      #7eccf3 60%
    );
  }
  .shop_dtl { background-color: unset;}
  .shop_dtl_txt .name { color: #ac1117;}
  .shop_dtl_txt a { color: #000;}

  .f_nav a { color: #000; font-weight: normal;}
  .f_nav li::before { border-color: transparent transparent transparent #000;}
}