@charset "UTF-8";
.ps_color{
fill:#ffffff;
}

.type__text-blue {
display: inline-block;
font-size: 1.1rem;
color: rgb(106, 176, 255);
padding: 0.1rem 0.6rem;
margin: 0px 0.8rem 0.8rem 0px;
border-width: 1px;
border-style: solid;
border-color: rgb(106, 176, 255);
border-image: initial;
}

.news_time{
margin-top: 3rem;
}

.summary .place_container{
margin-bottom: 0rem;
}

.summary .news_container .line-container{
border: 4px #38c6bc solid;
}

.summary .place .place_name {
background:#ca161e;
margin-bottom: 2rem;
padding: 3%;
}


.chusen{
margin: 5% auto;
}

.kabegami{
background-image: url("/images/gloomy/gloomy_sa_bg.webp");
background-size:5%;
background-repeat: repeat;

}

.newsList li {
padding: 15px 0;
}

.newsList li:hover {
background-color: rgba(255, 236, 0, 0.3); /* ホバーで黄色透明 */
}

.summary .newsList {
border-bottom: 3px dashed #235d8a; /* 点線を太くしてコミック風に */
}

.summary .newsList a {
border-top: 3px dashed #235d8a; /* 点線を太くしてコミック風に */
}

/* --------2/5に以下CSSを消す-------- */
.summary .placeList {
display: flex;
flex-wrap: wrap;
justify-content: center; /* ← 全体を中央寄せ */
column-gap: 3rem;
row-gap: 3rem;
margin-bottom: 3rem;
}

/* li を2列幅にする */
.summary .placeList > li {
width: calc(50% - 1.5rem); /* gap の半分を引く */
max-width: 50rem;          /* 広がりすぎ防止（任意） */
}

.summary .placeList > li {
border: 4px solid #235d8a;
background: #fff;
box-shadow: 6px 6px 0px #235d8a;
padding: 10px;
}

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


/* --------2/5に以上CSSを消す-------- */
.lead-navy{
color: #240f00;}

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

.lead-line{
text-align: center;
margin-top: 4rem;
}

.bg-color{
height: 100%;
width: 100%;
background-image:linear-gradient(#afe0f9, #d8f2ff 69%);
}

.ttl-g {
display: flex;            /* Flexboxを有効化 */
align-items: center;      /* 垂直方向（上下）の中央揃え */
justify-content: center;  /* 水平方向（左右）の中央揃え */
gap: 15px;                /* 画像と文字の間の隙間 */

color: #f193a9;
font-family: 'Arial Black', sans-serif;
text-transform: uppercase;
font-size: 3.5rem;
text-shadow: 
4px 4px 0px #0f3e63,
-1px -1px 0px #235d8a,  
1px -1px 0px #235d8a,
-1px  1px 0px #235d8a,
1px  1px 0px #235d8a;
margin-bottom: 3rem;
line-height: 1;           /* 行高によるズレを防止 */
}

.ttl-g_news{
margin-bottom: 0rem;
}

.ttl-g_place{
margin-bottom: 5rem;
}

.ttl-icon{
width: 1em;
height: 1em;
filter: drop-shadow(2px 2px 0px #235d8a);
}

.ber{
position: relative;
width: 100%;
height: 100px;
margin-bottom: 6rem;
}

.ber::before{
content: "";
position: absolute;
inset: 0;

background-image: url(/images/gloomy/gloomy_sa_bar.webp);
background-size: 7%;
background-repeat: repeat-x;

filter:drop-shadow(6px 5px #184569);
}

.ber1{
width: 100%;
height: 35px;

background-size: 7%;
background-repeat: no-repeat;
background-position: right top; /* ← 右端 */
}

.tbl{
margin-top: 4rem;
}

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

.line-container {
background: repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f1faff 10px, #f1faff 20px);
border: 5px solid #235d8a !important;
box-shadow: 5px 5px 0px #235d8a;
border-radius: 0px;
padding: 20px;
position: relative;
overflow: visible; /* 影をはみ出させるため */
margin: 0rem auto 5rem;
}

.line-container::before {
content: "NOTES!";
position: absolute;
top: -25px;
left: 20px;
background: #1497ff;
color: #fff;
padding: 5px 15px;
font-size: 1.2rem;
font-weight: bold;
transform: rotate(-5deg);
z-index: 9;
box-shadow: 3px 3px 0px #235d8a;
}

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

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

.info {
background: #ffffff00;
}
#header{
background: rgb(26 26 26);
border-bottom: solid 0px #CCC;
}

.header-item {
color: #ffffff;
}

.ttl-a,
.ttl-b:before,
.ttl-d__text:before,
.ttl-e
{
background:#5889d5;
box-shadow: 5px 5px 0px #235d8b;
}

.ttl-a{
margin-bottom: 0rem;
}


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

.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;
}

.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;
}

.l-column {
justify-content: normal;
}

.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: #235d8a;
border-radius: 5px;
border: solid 3px #235d8a;
}

.button.button-online .btn.btn-a{
color: rgb(255, 255, 255);
font-size: 1.6rem;
background: rgb(130 0 5);
border-radius: 5px;
border-width: 3px;
border-style: solid;
border-color: rgb(130 0 5);
border-image: initial;
}

.button-online .btn.btn-a:hover{
color: #111;
background:#fff;
border-color: rgb(130 0 5);
opacity: 1;
}

.button .btn.btn-a {
display: inline-flex;       /* inline-blockから変更 */
align-items: center;        /* 垂直方向（上下）の中央揃え */
justify-content: center;    /* 水平方向（左右）の中央揃え */
text-align: center;
    
/* 2. サイズと余白の調整 */
min-height: 3.5em;          /* 高さを確保（文字が下に寄るのを防ぐ） */
padding: 0 30px;            /* 上下paddingを0にしてFlexboxに任せる */
line-height: 1;             /* 行間の干渉をリセット */
    
/* 3. アメコミ風デザイン */
background: #ffd949;        /* 鮮やかなイエロー */
color: #000 !important;     /* 文字色は絶対黒 */
font-weight: 900;
font-size: 1.6rem;
text-decoration: none;
border: 4px solid #235d8a;     /* 太い黒枠 */
box-shadow: 4px 4px 0px #235d8a; /* ズレた黒影 */
border-radius: 0px;         /* 角を尖らせるとよりアメコミ風 */
transition: all 0.1s;
}

.button .btn.btn-a:hover {
transform: translate(2px, 2px);
box-shadow: 2px 2px 0px #000;
background: #fff;
}

.button .btn:after {
top: 35%;
bottom: 50%;
}

.l-column.goods-list .goods-list__inner {
box-shadow: 3px 3px 0px 0px #235d8b;
border: 3px solid #235d8b;
}

.ttl-g_news_title{
margin: 13% auto 7%;
}

.contact{
background: #ffffff;
}

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

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

.summary .place .placeList li {
width: 100%;
}

.summary .placeList > li {
width: calc(50% - 1.5rem);
max-width: 65rem;
}


/* 表のスタイル */
.cute_table {
width: 100%;
border-collapse: separate;
border-spacing: 0 10px; /* 行間に隙間を作ってポップに */
margin-bottom: 20px;
}

.cute_table th {
width: 18%;
vertical-align: middle;
text-align: center;
padding: 10px 5px;
}

/* 左側のラベル部分（アメコミ風バッジ） */
.cute_label {
display: inline-block;
background: #f193a9; /* ピンク */
color: #fff;
font-weight: 900;
font-size: 1.5rem;
padding: 4px 10px;
border: 3px solid #000;
border-radius: 10px;
box-shadow: 3px 3px 0px #000;
width: 100%;
box-sizing: border-box;
}

.cute_table td {
padding: 10px 15px;
background: #fdfaf1; /* 優しいクリーム色 */
border-left: none; /* ラベルと分けるために左枠は消す場合も */
border-radius: 0 15px 15px 0; /* 右側だけ丸く */
color: #240f00;
font-weight: bold;
font-size: 1.5rem;
line-height: 1.6;
}

/* ラベル側のセルも角を丸く（左側） */
.cute_table th {
border-right: none;
border-radius: 15px 0 0 15px;
background: #fdfaf1;
}

/* MAPボタンをど真ん中に可愛く配置 */
.place_map {
text-align: center;
margin: 5% auto;
}

.cute_map_btn {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ca161e;
color: #fff !important;
padding: 12px 30px;
border: 4px solid #000;
border-radius: 50px; /* カプセル型 */
font-weight: 900;
font-size: 1.6rem;
text-decoration: none;
box-shadow: 5px 5px 0px #000;
transition: 0.2s;
}

.cute_map_btn:hover {
transform: scale(1.05) rotate(-2deg);
background: #f193a9;
}

.summary .place .place_time {
padding: 15px;
}

.l-column {
margin-bottom: 11rem;
}

.ttl-idebok {
margin: 5rem 15rem;
text-align: left;
}

@media only screen and (max-width: 599px){
.ttl-g .return{
font-size: 2.5rem;
}

.ttl-idebok {
margin: 0rem;
}


.summary .place .place_time {
padding: 0px;
margin-bottom: 1.8rem
}

.summary .place .place_name {
margin-bottom: 4rem;
}

.summary .placeList {
margin-bottom: 0rem;
}

.l-column {
margin-bottom: 6rem;
}


.header-top__hamburger .bar{
background: #ffffff;
}

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

.ber{
height: 100px;
margin-bottom: 3rem;
}

.ber::before{
background-size: 25%;
filter: drop-shadow(6px 5px #184569);
}

 .l-column.goods-list .col-1 .image{
border-right: none;
padding-right: 0;
}

.kabegami01::before{
background-image:none;
background-size: 0%;
}

.ttl-g_news_title {
    margin: 30% auto 20%;
}

/* --- スマホ時に表を縦並びにする設定 --- */
.cute_table, 
.cute_table tbody, 
.cute_table tr, 
.cute_table th, 
.cute_table td {
display: block; /* 全ての要素を縦に並べる */
 width: 100%;    /* 横幅いっぱい */
}

.cute_table tr {
margin-bottom: 20px; /* 行ごとの隙間 */
border-radius: 15px;
overflow: hidden;
background: #fdfaf1;
}

.cute_table th {
padding: 10px;
border-right: none;
border-radius: 0; /* 角丸をリセット */
background: #fff; /* ラベル背景を白に */
text-align: left; /* ラベルを左寄せに */
}

.cute_table td {
padding: 15px;
border-radius: 0; /* 角丸をリセット */
border-left: none;
font-size: 1.6rem; /* スマホ用に少し小さく調整 */
}

.cute_label {
width: auto; /* ラベルが横いっぱいに広がらないように */
display: inline-block;
box-shadow: 2px 2px 0px #000; /* 影を少し小さく */
}

.cute_table th, .cute_table td {
/* 元のPC用スタイルを打ち消し */
border: none; 
}
    
/* ラベルと中身の区切りに点線を追加 */
.cute_table th {
border-bottom: 2px dashed #f193a9;
 }
.place_map {
margin: 10% auto 15%;
}

.ttl-d__text {
  padding: 0.5em 1em;
 }
}

.list li{
text-align: left;
}