@charset "UTF-8";


.ps_color{
fill:#000000;
}

.red-small{
color: #e63946 !important;
}

.lead-navy{
color: #001839;}

.lead-bcm{
margin-bottom: 0rem;
}

.lead-line{
text-align: center;
}

.bg-color{
  height: 100%;
  width: 100%;
  background-image: linear-gradient(90deg, #dbffde, #e6efff);
}


.tokuten-border{
  display: block;
  padding-bottom: 10px;
  margin-bottom: 3%;
  border-bottom: 1px solid #ccc; /* 色は調整OK */
}

.blue{
color: rgb(0 83 154);
}

.red-bg{
color: red;
font-size:calc(1.4rem +(1vw - 0.32rem)* 0.3584);
}

.summary .place .place_name{
background: linear-gradient(135deg, #ff4d6d, #ff9daa);
}

.summary.summary__page{
margin-top: 46px;
}

.summary .ttl-g{
margin-top: 50px;
}

.ttl-g{
color: #3e3e3e;
}

.summary .news{
    margin-bottom: 7rem;
}

.kabegami{
background-image: url("/images/chillche/chillche_bg.webp");
background-size:50%;
background-repeat: repeat;
}

.line-container,
.summary .news_container .line-container{
max-width: 80rem;
color: #000000;
align-items: center;
gap: 20px;
backdrop-filter: blur(5px);
background-color: rgb(255 255 255 / 87%);
border: 3px solid;
border-image: linear-gradient(to right, #77c17f, #e3e3e3ad, #2d56a3) 1;

}

.line-container_tktn{
margin-top:5rem;
}

.ttl-d__text{
z-index: 5;
}

.info {
background:rgb(255 255 255 / 100%);
}

.ttl-a,
.ttl-b:before,
.ttl-d__text:before,
.ttl-e
{
  background:#2a59a6;
}

.ttl-b:before{
  background:#ffffff00;
}

.ttl-a {
  text-align: center;
  padding: 24px;
  color: #fff;

  background: linear-gradient(135deg, #ff4d6d, #ff9daa);
  box-shadow: 0 10px 25px rgba(255, 77, 109, 0.4);

  letter-spacing: 0.05em;
}

.ttl-b,
.ttl-c,
.right-text{
  color: #001839;
}

.header-top__menu__list li a:hover{
  color: #18A5FF;
}

.ttl-b {
  position: relative;
  margin-bottom: 5rem;
  padding-bottom: 0.28em;
  font-size: 3.4rem;
  line-height: 1.076923;
  letter-spacing: 0.01em;
  font-weight: bold;
  border-bottom: solid 3px #cdcdcd;
  text-align: center;
}

.ttl-c{
border: solid 2px #ff9daa;
background-image:repeating-linear-gradient(135deg, transparent, transparent 8px, #F1F3FF 8px, #F1F3FF 12px);
}

.l-column.goods-list .goods-list__inner{
background: #FFF;
box-shadow:none;
border: solid 1px #ebebeb;
}

.image_boder{
border: 7px #EBD8BB solid;
border-bottom: 0px;
}

.caution-container {
background: #FFF;
}

.l-column.goods-list .col-1 .image {
padding-right: 2rem;
border-right: dotted 3px #ff525d;
}

.space {
  color: #ddd;
  margin: 2rem 0;
}

.main section:nth-last-of-type(4) .inner {
margin: 0 auto 0rem;
}

.button .btn.btn-a {
color: #ffffff;
font-size: 1.6rem;
background: #3b6095;
border-radius: 40px;
border: solid 3px #3b6095;
box-shadow: 3px 5px 9px 0px #33333391;
}


.button .btn.btn-a.btn-online {
    color: #ffffff;
    background: #57bb60;
    border: solid 3px #57bb60;
}


.button .btn.btn-a:hover {
color: #111;
background: #fff;
border: solid 3px #333333;
box-shadow: 0px 0px 0px 0px #2c2530;
}

.button.button-line .btn.btn-a {
color: rgb(255, 255, 255);
font-size: 1.6rem;
background: rgb(2, 185, 2);
border-radius: 40px;
border-width: 3px;
border-style: solid;
border-color: rgb(2, 185, 2);
border-image: initial;
}


.button.button-seiriken .btn.btn-a{
background: #67b1e2;
border: solid 3px #67b1e2;
}

.button.button-chusen .btn.btn-a{
background: #2dc2ff;
border: solid 3px #2dc2ff;
}

.button.button-sns .btn.btn-a{
background: #005871;
border: solid 3px #005871;
}

.button.button-seiriken .btn.btn-a:hover,
.button.button-chusen .btn.btn-a:hover,
.button.button-sns .btn.btn-a:hover{
color: #111;
background: #fff;
border: solid 3px #333333;
box-shadow: 0px 0px 0px 0px #2c2530;
}

.chusen{
margin:5% auto;
}

.item_chusen img{
width:100%;
}

.container__small__news{
width:100%;
}

.ttl-c-tokuten{
border: solid 2px #ff9daa;
background-image: repeating-linear-gradient(135deg, transparent, transparent 8px, #F1F3FF 8px, #F1F3FF 12px);
text-align: left;
}

.lead-tokuten{
text-align:center;
}

@media only screen and (max-width: 599px) {
 .l-column.goods-list .col-1 .image {
border-right: none;
padding-right: 0;
}
 .kabegami{
background-size: 100%;
}
.kabegami01::before {
background-image:none;
background-size: 0%;
}
}

.modal-content{
border:solid rgba(0,0,0,1.00) 5px;
border-image: linear-gradient(to right, #77c17f, #e3e3e3ad, #2d56a3) 5;
}

.contact{
background: #ffffff;
}

.item-tokuten{
margin-top: 5rem;
}

.type__text-blue{
display: inline-block;
padding: 0.1rem 0.6rem;
margin: 0 0.8rem 0.8rem 0;
font-size: 1.1rem;
border: solid 1px #0A7DFF;
color: #0A7DFF;
}

/*----------------------------
----------------------------
----------------------------
----------------------------
----------------------------:*/


.goods-list__inner {
  border-radius: 16px;
  overflow: hidden;
}

.image img {
  border-radius: 10px;
}




/* タイトルの装飾（ttl-bのブラッシュアップ） */
.ttl-b {
  position: relative;
  font-size: 2.8rem;
  color: #001839;
  text-align: center;
  margin-bottom: 4rem;
  border-bottom: none; /* 既存の線を消してデザインし直し */
}

.ttl-b span {
  display: block;
  font-size: 1.4rem;
  color: #ff4d6d; /* アクセントのピンク */
  letter-spacing: 0.2em;
  margin-top: 5px;
}

/* タイトルの装飾（ttl-bのブラッシュアップ） */
.ttl-b {
  position: relative;
  font-size: 4.0rem;
  color: #001839;
  text-align: center;
  margin-bottom: 4rem;
  border-bottom: none; /* 既存の線を消してデザインし直し */
}

.ttl-b span {
  display: block;
  font-size: 1.4rem;
  color: #ff4d6d; /* アクセントのピンク */
  letter-spacing: 0.2em;
  margin-top: 5px;
}


/* テキスト・ボタンエリア */
.campaign-body {
  padding: 30px;
  text-align: center;
}

.campaign-text {
  font-size: 1.6rem;
  line-height: 1.8;
  color: #333;
  margin-bottom: 25px;
  font-weight: 500;
}

/* --- セクションタイトル ttl-g の装飾 --- */
.ttl-g {
  position: relative;
  display: block;
  text-align: center;
  font-size: 4.0rem; /* 英字部分のサイズ */
  font-weight: 800;
  color: #001839; /* 既存のネイビー */
  margin: 60px auto 40px;
  line-height: 1.2;
  letter-spacing: 0.1em;
}

/* 日本語サブタイトル部分 */
.ttl-g span {
  display: block;
  font-size: 1.4rem; /* 日本語部分のサイズ */
  color: #ff4d6d;    /* キャンペーンと合わせたピンク */
  font-weight: 600;
  margin-top: 8px;
  letter-spacing: 0.05em;
}

/* 中央のグラデーション下線 */
/*.ttl-g::after {
  content: "";
  display: block;
  width: 50px;
  height: 4px;
  background: linear-gradient(to right, #ff4d6d, #ff9daa);
  margin: 15px auto 0;
  border-radius: 10px;
}*/

/* --- コンテンツエリアの調整（読みやすさ向上） --- */

/* テーブルやリストを囲む枠線の調整 */
.line-container, 
.line-container-bold {
  border: none !important; /* 既存の派手な枠線をスッキリさせる場合 */
  background-color: #ffffff;
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
  margin-bottom: 40px;
}

/* 注意事項のテーブルスタイル */
.tbl th {
  background-color: #f8f9fa;
  color: #001839;
  font-weight: bold;
  padding: 15px;
  border-bottom: 2px solid #fff;
}

.tbl td {
  padding: 15px;
  border-bottom: 1px solid #eee;
}

/* 赤文字の強調をマイルドかつ目立たせる */
.red, .red-bg {
  color: #e63946 !important;
  font-weight: bold;
}

/* --- スマホ対応 --- */
@media only screen and (max-width: 599px) {
  .ttl-g {
    font-size: 2.0rem;
    margin: 40px auto 25px;
  }
  
  .ttl-g span {
    font-size: 1.2rem;
  }

  .line-container, 
  .line-container-bold {
    padding: 20px 15px;
  }
}




/* リスト全体のレイアウト */
.placeList {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0 auto 40px;
  max-width: 1100px;
}

/* 各店舗カードの設定 */
.placeList li {
    -webkit-backdrop-filter: blur(12px);
    border-radius: 10px;
    width: calc(50% - 15px);
    box-sizing: border-box;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 店舗名 */
.place_name {
ont-size: 2rem;
font-weight: 800;
color: #001839;
margin-bottom: 20px;
/*border-bottom: 2px dotted #ff9daa;*/
display: block;
padding: 5px;
}

/* 開催日時・場所のテキスト */
.place_time, .place_txt {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #333;
  margin-bottom: 15px;
  position: relative;
  padding-left: 28px;
}

/* アイコン（擬似要素で時計とピンを追加） */
.place_time::before, .place_txt::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  color: #ff4d6d;
}
.place_time::before { content: "\f017"; } /* 時計アイコン */
.place_txt::before { content: "\f3c5"; }  /* マップピンアイコン */

/* MAPボタン */
.place_map a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #001839;
    color: #fff !important;
    text-decoration: none;
    padding: 6px 11px;
    border-radius: 50px;
    font-size: 1.4rem;
    font-weight: bold;
    transition: all 0.3s ease;
    margin-left: 10px;
}

.place_map a:hover {
  background: #ff4d6d;
  box-shadow: 0 5px 15px rgba(255, 77, 109, 0.4);
}

.place_map a i {
  margin-left: 8px;
}

/* 下部ボタンの調整 */
.place .button {
  text-align: center;
}

/* --- スマホ対応 --- */
@media only screen and (max-width: 850px) {
  .placeList li {
    width: 100%; /* スマホでは1カラム */
  }
}

@media only screen and (max-width: 599px) {
  .place_name {
    font-size: 1.4rem;
  }
  .place_time, .place_txt {
    font-size: 1.4rem;
  }
}






/* --- ttl-d：周年限定商品用のスペシャル垂れ幕風見出し --- */
.ttl-d {
  position: relative;
  margin: 70px auto 50px;
  text-align: center;
  max-width: 900px;
}

/* 既存のbefore（以前の仕様）を完全にリセット */
.ttl-d__text:before {
  content: none !important;
}

.ttl-d__text {
  display: inline-block;
  position: relative;
  /* 垂れ幕の本体（背景色を透かすことで白バックを避ける） */
  background: rgba(0, 24, 57, 0.85); /* 既存のネイビーを少し透かす */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  
  color: #fff; /* 基本の文字は白 */
  padding: 15px 50px 20px;
  /* 角丸は少しだけ（カプセルにはしない） */
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom: none; /* 下は開ける */
  z-index: 1;
  box-shadow: none; /* 影を消してボタンっぽさを排除 */
}

/* 英語サブタイトル */
.ttl-d__text .eng {
  display: block;
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  color: #ff9daa; /* アクセントのピンク */
  margin-bottom: 5px;
}

/* 日本語メイン */
.ttl-d__text .jp {
  display: block;
  font-size: 2.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
}

/* 「3」という数字の強調 */
.ttl-d__text .num {
  font-size: 3.4rem; /* 大きく */
  font-weight: 900;
  color: #ffd700; /* お祝いのゴールドカラー */
  vertical-align: sub;
  margin: 0 4px;
  text-shadow: 0 0 10px rgba(255, 215, 0, 0.8); /* キラキラさせる */
}


/* --- スマホ対応 --- */
@media only screen and (max-width: 599px) {
  .ttl-d {
    margin: 40px auto 30px;
  }
  .ttl-d__text {
    font-size: 1.6rem;
    padding: 12px 30px 18px;
    width: 90%;
  }
  .ttl-d__text .eng { font-size: 1.2rem; }
  .ttl-d__text .jp { font-size: 1.6rem; }
  .ttl-d__text .num { font-size: 2.4rem; }
  .ttl-d::before, .ttl-d::after {
    display: none; /* スマホではスッキリさせる */
  }
}