@charset "utf-8";
/* SP */


.pc {
   display: none;
}


/* フレックスベース---------------------- */
.flex, .spflex {
   display: flex;
   justify-content: center;
   align-items: center;
 }
 
 .column, .spcolumn {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }


.wd_half {
   width: 94%;
   margin: 0 auto;
}

a.more_btn {
   display: flex;
   background-image: url(../img/morebtn.png);
   background-size: contain;
   background-repeat: no-repeat;
   width: 16.88rem;
   height: 5rem;
   color: #ffffff;
   justify-content: center;
   font-size: 1.5rem;
   font-weight: 600;
   margin: 1rem auto 2rem;
   align-items: center;
   padding-bottom: 1rem;
}

a.gopagetop {
   width: 12.5rem;
   display: block;
   height: fit-content;
   margin: 1rem auto 0;
}

a.gopagetop.pc {
   display: none;
}

/* margin---------------------- */
.pc_mg_bottom_05 { margin-bottom: 0.5rem; }
.pc_mg_bottom_1 { margin-bottom: 1rem; }
.pc_mg_bottom_2 { margin-bottom: 2rem; }
.pc_mg_bottom_3 { margin-bottom: 3rem; }
.pc_mg_bottom_4 { margin-bottom: 4rem; }
.pc_mg_bottom_5 { margin-bottom: 5rem; }
.pc_mg_bottom_6 { margin-bottom: 6rem; }
.pc_mg_bottom_7 { margin-bottom: 7rem; }
.mg_bottom_1 { margin-bottom: 1rem; }
.mg_bottom_2 { margin-bottom: 2rem; }


/* title---------------------- */
h2 {
   font-size: 3.13rem;
   text-align: center;
   font-weight: 600;
   line-height: 0.7;
}

h3,h4,h5,h6 {
   font-weight: 500;
   line-height: 1;
}
.pc10 { font-size: 0.625rem; }
.pc12 { font-size: 0.75rem; }
.pc14 { font-size: 0.875rem; }
.pc16 { font-size: 1.0rem; }
.pc18 { font-size: 1.125rem; }
.pc20 { font-size: 1.25rem; }
.pc22 { font-size: 1.375rem; }
.pc24 { font-size: 1.5rem; }
.pc26 { font-size: 1.625rem; }
.pc28 { font-size: 1.75rem; }
.pc30 { font-size: 1.875rem; }
.pc32 { font-size: 2.0rem; }
.pc34 { font-size: 2.125rem; }
.pc36 { font-size: 2.25rem; }
.pc38 { font-size: 2.375rem; }
.pc40 { font-size: 2.5rem; }
.pc42 { font-size: 2.625rem; }
.pc44 { font-size: 2.75rem; }
.pc46 { font-size: 2.875rem; }
.pc48 { font-size: 3.0rem; }
.pc50 {font-size: 3.13rem;}

p {
   text-align: justify;
   font-size: 1.5rem;
   font-weight: 400;
   /* word-break:break-all; */
   word-break: auto-phrase;
    text-align: left;
    hyphenate-character: auto;
text-justify:inter-character;
line-height: 1.2;
}

.b {
   font-weight: 600;
}

.center {
   text-align: center;
}
.block {
   display: block;
}

body, html {
   margin: 0;
   padding: 0;
   width: 100%;
   height: 100%;
   font-style: normal;
   font-weight: 200;
   scroll-behavior: smooth;
   background:#ffffff;
}


a {
   transition: all 0.3s ease; 
}
a:hover {
   opacity: 0.7;
   transition: all 0.3s ease; 
}


.wrapper {
width: 100%;
}


main {
   overflow: hidden;
}

/* メインコンテンツ */
.main-content {
   padding-top: 4rem;

   /* scroll-behavior: smooth; */
}

/* ヘッダー */
header {
   /* overflow: hidden; */
   position: fixed;
   top: 0;
  z-index: 15;
   width: 100%;
   background: #ffffff;
   height: 4rem;
}

#header.UpMove {
   animation: UpAnime 0.5s forwards;
 }
 
 #header.DownMove {
   animation: DownAnime 0.5s forwards;
 }
 
 @keyframes UpAnime {
   from {
     opacity: 1;
     transform: translateY(0);
   }
   to {
     opacity: 0;
     transform: translateY(-100%);
   }
 }
 
 @keyframes DownAnime {
   from {
     opacity: 0;
     transform: translateY(-100%);
   }
   to {
     opacity: 1;
     transform: translateY(0);
   }
 }


.hd_top {
   height: 4rem;
   justify-content: flex-start;
   gap: 1.5rem;
   align-items: center;
   padding: 0.5rem;
}

h1 {
   display: flex;
   align-items: center;
   width: 10rem;
   height: 100%;
   
}

/* 翻訳プルダウン */
.gt_selector {
   border: none;
   background: #C2191F;
   color: #ffffff;
   width: 7rem;
   height: 2.50rem;
   /* appearance: none; */
   display: flex;
   align-items: center;
   padding-left: 1rem;
   font-size: 16px;
   font-weight: 200;
   border-radius: 0;
   
}

.hd_bottom {
   background: #C2191F;
   height:5.63rem;
}

.hd_bottom nav {
   width: 100%;
   height: 100%;
}
.hd_bottom nav a {
   font-size: 0.9rem;
   white-space: nowrap;
   font-weight: 500;
   color: #ffffff;
   display: flex;
   flex-direction: column;
   justify-content: flex-end;
   align-items: center;
flex-grow: 1;
gap: 0.3rem;
height: 100%;
    padding-bottom: 0.3rem;
}

.hd_bottom nav a.pc {
   display: none;
}
.hd_bottom nav a img.experience {width:2.75rem ;height:2.94rem ;}
.hd_bottom nav a img.price {width:2.13rem ;height:2.94rem  ;}
.hd_bottom nav a img.products {width:2.63rem ;height:2.63rem ;}
.hd_bottom nav a img.storeinfo {width:2.94rem  ;height:2.44rem ;}
.hd_bottom nav a img.sns {width:2.2rem ;height:2.2rem ;}


.bottom_menu {
   position: fixed;
   bottom: 0;
   width: 100%;
   display: flex;
   gap: 0;
   z-index: 11;
}

.bottom_menu a {
   width: 50%;
   /* width: calc(50% - 0.88rem); */
   height: 4.38rem;
   position: relative;
   display: flex;
   padding: 0 0.44rem;
   justify-content: space-between;
   align-items: center;
   line-height: 1;
   font-size:1.50rem ;
   font-weight: 600;
   color: #ffffff;
}
.bottom_menu a span {
   width: 1px;
   height: 100%;
   background: #ffffff;
}
.bottom_menu a:before {
content: '';
position: absolute;
top: 0.44rem;
left: 0;
width: 100%;
height: 1px;
background-color: #ffffff;
}

.bottom_menu a:after{
content: '';
position: absolute;
bottom: 0.44rem;
left: 0;
width: 100%;
height: 1px;
background-color: #ffffff;
}

.bottom_menu a span.bt_access {
   width:auto;
   height:auto;
   background:transparent;
   display: flex;
   justify-content: center;
   align-items: center;
   font-size: 1.5rem;
   gap: 0.5rem;
}

.bottom_menu a span.bt_access p {
   font-weight: 600;
   line-height: 0.7;
}

.bottom_menu a span.bt_access small {
   font-size: 0.9rem;
}

.bottom_menu a span.bt_access.bn {
   font-size: 1.2rem;
}

.bottom_menu a span.bt_access img {
   width: auto;
   height: 2rem;

}

.bottom_menu a.howtolink {
   background: #D4A443;
}
.bottom_menu a.contactlink {
   background: #000000;
}

.bottom_menu a div.sit {
   position: absolute;
   top: -1.2rem;
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   display: block;
   width: 97px;
   height: 38px;
   background-size: contain;
   background-repeat: no-repeat;
   animation: blink 2s infinite; 
}

@keyframes blink {
  0%, 100% {
    opacity: 1;   /* 通常表示 */
  }
  50% {
    opacity: 0;   /* 半分のタイミングで透明に */
  }
}

.bottom_menu a div.sit.open {
   background-image: url(../img/sit_open.png);
}

.bottom_menu a div.sit.busy {
   background-image: url(../img/sit_busy.png);
}

.bottom_menu a div.sit.full {
   background-image: url(../img/sit_full.png);
}



/* フッター */
footer {
   background:#ffffff;
   background-image: url(../img/footer_bg.png);
   background-repeat: no-repeat;
   background-position: top right 20%;
   width: 100%;
   padding-top: 4rem;
}

.ft_main {

   background: #C2191F;
   padding: 2rem 2.5rem 5rem;
}

.ft_main p.copyright {
   color:#FFFFFF;
   text-align: center;

}

.ft_main .flex {
   width: 100%;
   justify-content: center;
   gap: 1rem;
   color: #ffffff;
}

.ft_main .flex a {
   width: 3.44rem;
   color: #ffffff;
   white-space: nowrap;
}

.ft_main .flex.ftlink {
   width: 100%;
   justify-content: center;
   gap: 1rem;
   color: #ffffff;
}
.ft_main .flex.ftlink a {
   width: fit-content;
   color: #ffffff;
   white-space: nowrap;
}

.ft_main .flex span {
   display: block;
}


main {
   width: 100%;
   background: #ffffff;
   /* overflow: hidden;    */
}

main .mainvisual img {
   height: auto;
}

.top_rental {
   background-image: url(../img/top_rental_bg.png);
   position: relative;
   padding: 1.5rem 0 1rem;
}
.top_rental:before {
   content: "";
   /* content: url(../img/top_rental_line.png); */
   position: absolute;
   top: -1rem;
   left: 0;
   width: 100%;
   height: 50px;
   display: flex;
   justify-content: center;

   background-image: url('../img/top_rental_line.png'); /* 背景画像を指定 */
   background-size: cover; /* 背景画像をコンテナのサイズに合わせてカバー */
   background-position: center; /* 背景画像を中央に配置 */
   background-repeat: no-repeat; /* 背景画像の繰り返しをなしに設定 */
}

.top_rental h2 {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 0.5rem;
   width: 100%;

   color: #D78E00;
}
.top_rental h2:before {
   content: url(../img/rental_h2_bg1.png);
}
.top_rental h2:after {
   content: url(../img/rental_h2_bg2.png);
}

.top_rental h2.op {
   font-size: 2.63rem;
   margin-bottom: 1.7rem;
   gap: 0.5rem;
   white-space: nowrap;
}
.top_rental h2.op:before,
.top_rental h2.op:after {
   content: "";
   display: block;
   width: 5.5rem;
   height: 4px;
   background: #CFB278;
}

.top_rental .rental_art {
   width: 100%;
   overflow: hidden;
   gap: 0.6rem;
}

.top_rental .rental_art p {
padding-right: 1rem;
font-size: 1.38rem;
}

.top_rental .rental_art img {
   margin-left: -2.5rem;
   width: 16rem;
}

.top_rental .rental_art.tr_article img {
   border-radius: 50%;
}

.top_rental .rental_art.rev {
   flex-direction: row-reverse;
   
}

.top_rental .rental_art.rev h3 {
   padding-left: 0.7rem;
}

.top_rental .rental_art.rev p {
   padding-left: 1rem;
   padding-right: 0;
   }
   

.top_rental .rental_art.rev img {
   margin-right: -2.5rem;
   margin-left: 0;
}

.top_rental a.gorental,
.gocontact {
   display: flex;
   justify-content: center;
   align-items: center;
   line-height: 1;
   margin: 1rem auto 2rem;
   width: 18.75rem;
   height: 3.75rem;
   background-image: url(../img/gorental.png);
   color: #ffffff;
   font-size: 1.88rem;
   font-weight: 600;
}


.top_rental .rental_art_hair {
   gap: 0.7rem;
   align-items: flex-start;
   margin-bottom: 1.5rem;
}

.top_rental .rental_art_hair img {
   width: 10rem;
}

.top_rental .rental_art_hair p {
   font-size: 1.38rem;
}

.top_rental a.gorental.hair {
   display: flex;
   justify-content: center;
   align-items: center;
   line-height: 1;
   margin: 0.5rem 0;
   width: 10.50rem;
   height: 3.38rem;
   background-image: url(../img/gorentalhair.png);
   background-size: contain;
   color: #ffffff;
   font-size: 1.88rem;
   font-weight: 600;
}


.top_rental .rental_art_hair.rev {
   flex-direction: row-reverse;
}

.top_gallery {}

.top_gallery h2 {
   background-image:url(../img/topgallery_h_bg.png) ;
   background-repeat: no-repeat;
   background-position: -2.50rem top;
   height: 7.50rem;
   display: flex;
   align-items: flex-end;
   justify-content: center;
   font-weight: 600;
}

.top_gallery iframe {

   aspect-ratio: 1 / 1;
}


.top_products {
   background: #ffeeee;
   position: relative;
   padding: 4.2rem 0 2rem;
}
.top_products:before {
   content: "";
   /* content: url(../img/top_line2.png); */
   position: absolute;
   top: -1.74rem;
   left: 0;
   width: 100%;
   height: 73px;
   display: flex;
   justify-content: center;
   background-image: url('../img/top_line2.png'); /* 背景画像を指定 */
   background-size: contain; /* 背景画像をコンテナのサイズに合わせてカバー */
   background-position: center; /* 背景画像を中央に配置 */
   background-repeat: no-repeat; /* 背景画像の繰り返しをなしに設定 */
}

.top_products img.h3img {
   width: 60%;
   display: block;
   margin-left:auto;
   margin-right:auto;
}

.top_products div.flex {
   gap: 0.5rem;
}

.top_products h3 {
   line-height: 1.1;
}

.top_products .topproducts_image {
   overflow: hidden;
}
.top_reviews {
background-image: url(../img/top_review_bg.png);
background-size: 100%;
background-repeat: no-repeat;
background-position: top left;
}



.product_photo_slide_area {
   overflow: hidden;
}

.product_photo_thumbnail,
.product_photo_thumbnail2 {
width: calc(100% + 8px);
}

.product_photo_thumbnail img,
.product_photo_thumbnail2 img {
   /* margin: 0 10px; */
}

/* スライダー全体のスタイル */
.product_photo_thumbnail.slick-slider,
.product_photo_thumbnail2.slick-slider {
   margin: 0 auto; /* センタリング */
}

/* 各サムネイル要素に適用するスタイル */
.product_photo_thumbnail .slick-slide,
.product_photo_thumbnail2 .slick-slide {
   margin: 0 5px; /* 左右に5pxの余白 */
}

/* 最初のサムネイルの左余白を取り除く */
.product_photo_thumbnail .slick-slide:first-child,
.product_photo_thumbnail2 .slick-slide:first-child {
   margin-left: 0;
}

/* 最後のサムネイルの右余白を取り除く */
.product_photo_thumbnail .slick-slide:last-child,
.product_photo_thumbnail2 .slick-slide:last-child {
   margin-right: 0;
}


.top_reviews h2 {
   padding-top: 2rem;
}
.top_reviews h2 img {
   width: 7.50rem;
}

.top_reviews .review_art {
   border: solid 1px #d9d9d9;
   border-radius: 1.25rem;
   padding: 1rem;
}

.review_art .titlearea {
   justify-content: flex-start;
   gap: 0.7rem;
}

.review_art .titlearea img {
   width: 3.75rem;
   border-radius: 50%;
}
.review_art .titlearea

.review_art .titlearea h3 {}
.review_art .titlearea h3 small {
   display: block;
   font-weight: normal;
   color: #9d9d9d;
}

.top_store {
   overflow: hidden;
}

.top_store img.topptore_img {
   width: 110%;
   margin-left: -5%;
}

.top_store .snslink {
   justify-content: space-between;
}

.top_store .snslink a {
   width: 49%;
}

.top_store .snslink span.shopinfo_txt {}


.top_faq {}

.top_faq h2 {
   gap: 1rem;
   white-space: nowrap;
}
.top_faq h2 img {
   width: 5.31rem;
}


/* ぱんくず */
.breadcrumbs {
}

.breadcrumbs ul {
   justify-content: flex-start;
   gap: 0.5rem;
   padding: 1rem 0.5rem;
} 
.breadcrumbs ul li,
.breadcrumbs ul li a {
color: #E37F83;
}


/* お問い合わせ */
article.contact {
   padding-bottom: 3rem;
}

ul.contact_step {
   justify-content: center;
   gap: 0.4rem;
   align-items: center;
}

ul.contact_step li {
   text-align: center;
   position: relative;
}


ul.contact_step li.line {
   width: 2rem;
   height: 2px;
   background: #C2191F;
   margin-bottom: 1.6rem;
}

ul.contact_step li span {
   background-image:url(../img/contact_step.png) ;
   background-size: contain;
   background-repeat: no-repeat;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #ffffff;
   line-height: 1;
   width:3.2rem ;
   height: 3.13rem;
   font-weight: 500;
   padding-top: 0.2rem;
}

ul.contact_step li small {
   color: #C2191F;
}

ul.contact_step li.thin:after {
   content: "";
   display: block;
   width: 100%;
   height: 100%;
   background: #ffffff77;
   position: absolute;
   top: 0;
   left: 0;

}

.form_contents {
   border: solid 1px #d9d9d9;
   padding: 1.5rem 2rem;
}

.form_contents h3.pc_mg_bottom_05 {
   margin-bottom: 0.2rem;
}

.form_contents input:not(.radio__btn) {
   border: 0;
   width: 100%;
   height: 2.5rem;
   border-radius: 10px;
   background: #FBF0F1;
   padding-left: 0.5rem;
}

.form_contents textarea {
   border: 0;
   width: 100%;
   height: 17.19rem;
   border-radius: 10px;
   background: #FBF0F1;
   padding: 0.7rem;
}

.radio__btn {
   appearance: none;
   -webkit-appearance: none; /* Chrome, Safari用 */
   position: absolute; /* ボタンを画面から隠す */
   opacity: 0; /* 見えなくする */
 }
 
 label.radio {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   font-size: 1.2rem;
   width: 100%;
   height: 2.5rem;
   padding: 0.5rem;
   border-radius: 10px;
   background: #FBF0F1;
   cursor: pointer;
   margin-bottom: 0.5rem;
 }
 
 .radio__btn:checked + label.radio {
   background: #E37F83;
   color: #ffffff;
   font-weight: 500;
 }
 
 .radio__text {
   /* margin-top: 0.4rem; */
   display: flex;
   align-items: center;
 }

 .radio__text::before {
   content: '';
   display: inline-block;
   width: 1.44rem;
   height: 1.44rem;
   border-radius: 50%;
   border: 1px solid #d9d9d9;
   margin-right: 0.7rem;
 }
 
 .radio__btn:checked + label.radio .radio__text::before {
   border:solid 7px #C2191F; /* チェック時の枠線の色 */
   background: #ffffff; /* チェック時の背景色 */
 }
 

 .submit_btn {
   background-image: url(../img/form_check_btn.png);
   background-size: contain;
   width: 16.88rem;
   height: 5rem;
   border: 0;
   background-color:#ffffff;
   margin: 0 auto;
   font-size: 1.5rem;
   font-weight: 600;
   color: #ffffff;
   display: flex;
   align-items: center;
   padding-bottom: 1rem;
}

.form_area.result {
   padding-bottom: 0.4rem;
   border-bottom: solid 1px #d9d9d9;
}

.form_area.result.txtarea {
   border: none;
}


/* HOWTOUSE */
article.howto {}

img.howtoicon {
   width: 5.63rem;
   display: block;
   margin-right: auto;
   margin-left: auto;
}

div.howto_imgarea {
   width: 80%;
   margin-right: auto;
   margin-left: auto;
   position: relative;
}
div.howto_imgarea span.leftnum {
   position: absolute;
   top: 0;
   left: 0;
   color: #ffffff;
   background-image: url(../img/contact_step.png);
   background-size: contain;
   width: 5.63rem;
   height: 5.63rem;
   line-height: 1;
   padding: 0.31rem 0 0 0.31rem;
}
div.howto_imgarea span.rightnum {
   position: absolute;
   top: 0;
   right: 0;
   color: #ffffff;
   background-image: url(../img/contact_step.png);
   background-size: contain;
   width: 5.63rem;
   height: 5.63rem;
   line-height: 1;
   padding: 0.31rem 0 0 0.31rem;
}

div.howto_imgarea h3.left_position {
   position: absolute;
   bottom: 1rem;
   left: -1rem;
   line-height: 1.1;
   text-align: left;
}

.howto p {
   width: 85%;
   margin-right: auto;
   margin-left: auto;
}

.howto_line {
   width: 8rem;
   margin-right: auto;
   margin-left: auto;
}


/* experience */
article.exp {}

ul.exp_menu {
   gap: 0.5rem;
}

ul.exp_menu li {
   width: 32%;
   height: 7.5rem;
   aspect-ratio: 1 / 1;
}

ul.exp_menu li a {
   background: #C2191F;
   color: #ffffff;
   width: 100%;
   height: 100%;
   line-height: 1.1;
   gap: 0.8rem;
}
ul.exp_menu li a:after {
   content: "";
   background-image: url(../img/expmenuicon.png);
   background-size: contain;
   background-repeat: no-repeat;
   width: 2.19rem;
   height: 0.94rem;
}

img.expicon {
   width: 70%;
   margin-left: auto;
   margin-right: auto;
}


.exp_art_num {
   overflow: hidden;
   width: 100%;
   gap: 0.5rem;
   align-items: flex-start;
}
.exp_art_num img {
   width: 16rem;
   height: auto;
   aspect-ratio: 1/1;
}
.exp_art_num h4 {
   position: relative;
   z-index: 1;
   font-size: 1.25rem;
   font-weight: 600;
   /* white-space: nowrap; */
   padding-top: 2.3em;
   letter-spacing: -0.008em;
}
.exp_art_num span.num {
   font-size: 4.38rem;
   color: #FFBFC2;
   position: absolute;
   top: 0;
   font-weight: 600;
   z-index: -1;
}

/* 奇数記事 1 3*/
.exp_art_num.odd {
   padding-right: 1rem
}
.exp_art_num.odd img {
   margin-left:-3rem ;
}
.exp_art_num.odd span.num {
   left: -1.5rem
}

.exp_art_num.odd div {
   width: calc(100% - 15rem);
}


/* 偶数記事 2 */
.exp_art_num.even {
   padding-left: 1rem;
   justify-content: flex-start;
}

.exp_art_num.even img {
   margin-right: -2rem;
}

.exp_art_num.even span.num {
   left: 0;
}

.exp_art_num.even div {
   
}


.exp_art_num.even.gtnumba {
   padding-top: 2rem;
   margin-top: -1.5rem;
}

.exp_art_num.even.gtnumba img {
   margin-right: -1rem;
   margin-top: -2rem;
}


.exp_bubble {
   width: calc(100% - 1.4rem);
   margin-right: auto;
   margin-left: auto;
   height:7rem ;
   background-image: url(../img/exp_bubble.png);
   background-size: cover;
   background-repeat: no-repeat;
   color: #ffffff;
   padding-bottom: 2rem;
}


/* STIRE INFO */
img.topptore_img.si {
   margin-top: -0.6rem;
}
article.storeinfo {}

ul.store_exp {}

ul.store_exp li {
   gap: 1rem;
}
ul.store_exp li span {
   line-height: 1;
}
ul.store_exp li img {
   width: 17.50rem;
   height: auto;
   aspect-ratio: 1/1;
}
ul.store_exp li:nth-child(2) {
   margin-top: -4.5rem;
}
ul.store_exp li:nth-child(3) {
   margin-top: -4rem;
}
ul.store_exp li.odd {}

ul.store_exp li.odd img {
margin-left: -5rem;
}


ul.store_exp li.even img {
   margin-right: -4rem;
   }


div.aboutus {
   position: relative;

}

div.aboutus .line-top {
   position: absolute;
   top: 0.8rem;
   display: block;
   width: 100%;
   height: 7px;
   background: #C2191F;
   border-top: solid 2px #ffffff;
   border-bottom: solid 2px #ffffff;
   z-index: 2;
}
div.aboutus .line-bottom {
   position: absolute;
   bottom: 0.8rem;
   display: block;
   width: 100%;
   height: 7px;
   background: #C2191F;
   border-top: solid 2px #ffffff;
   border-bottom: solid 2px #ffffff;
   z-index: 2;
}

div.aboutus .line-left {
   position: absolute;
   top: 0;
   left: 0.8rem;
   display: block;
   width: 3px;
   height: 100%;
   background: #C2191F;
   border-top: solid 2px #ffffff;
   border-bottom: solid 2px #ffffff;
   z-index: 1;
}

div.aboutus .about_main {
   padding: 3rem;
}

div.aboutus .line-right {
   position: absolute;
   top: 0;
   right: 0.8rem;
   display: block;
   width: 3px;
   height: 100%;
   background: #C2191F;
   border-top: solid 2px #ffffff;
   border-bottom: solid 2px #ffffff;
   z-index: 1;
}

img.abouticon {
   width: 2.00rem;
   height: 2rem;
   margin-right:auto ;
   margin-left: auto;
   display: block;
}

article.information {}

article.information span {
   display: block;
   line-height: 1;
}
article.information .snslink {
   justify-content: space-between;
   gap: 1rem;
}

/* スライダー */
.slick-dots li {
   box-sizing: border-box;
 }
/* トップ分 */
.shop_photo_slide_area {
   overflow: hidden;
}
.shop_photo {
   width: 100%;
}

.shop_photo_thumbnail img {
   width:100%;/*スライダー内の画像を横幅100%に*/
   height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.shop_photo_thumbnail .slick-slide {
   margin: 0 3px; /* サムネイル間の余白を設定 */
}

/* スライダーコンテナの調整で左右端の余白を削除 */
.shop_photo_thumbnail .slick-list {
   margin: 0 -6px; /* コンテナのマージンを調整して余白を消す */
   padding: 0;
}
/*ドットナビゲーションの設定*/
.slick-dots {
	position: relative;
	z-index: 3;
   text-align:center;
	margin:1rem 0 0 0;/*ドットの位置*/
}

.shop_photo_thumbnail .slick-dots {
   margin-top: 0.5rem;
}

.slick-dots li {
    display:inline-block;
	margin:0 5px;
   border-radius: 0;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:0.88rem;/*ドットボタンのサイズ*/
    height:0.88rem;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ffffff;/*ドットボタンの色*/
    border: solid 1px #C2191F;
    font-size: 5px;
}

.slick-dots .slick-active button{
    background:#C2191F;/*ドットボタンの現在地表示の色*/
}

/* 下分 */
ul.shopinfo_slider {
   width: 90%;
   margin-right: auto;
   margin-left: auto;


}
ul.shopinfo_slider li {
   overflow: hidden;
   border-radius: 7.38rem;
}


/* PRICE */
article.price {}

.price_menu {
   flex-wrap: wrap;
   gap: 0.5rem;
}
.price_menu a {
   width: calc(50% - 0.25rem);
   height:3.75rem;
   background: #C2191F;
   color: #ffffff;
   font-weight: 600;
   line-height: 0.8;
   text-align: center;
   position: relative;
}
.price_menu a:after {
   content: "";
   display: block;
   width: 0.7rem;
}

.price_menu a:before {
   content: "";
   display: block;
   width: 1rem;
   height: 1rem;
   position: absolute;
   right: 0.7rem;
   border-top: solid 2px #ffffff;
   border-right: solid 2px #ffffff;
   top: 45%;
   transform: translateY(-50%) rotate(135deg);
   -webkit-transform: translateY(-50%) rotate(135deg);
   -ms-transform: translateY(-50%) rotate(135deg);
   
}

.price h3 {
   line-height: 0.9;
   justify-content: center;
   gap: 0.3rem;
}

h3#kimono img {
   width: 4.31rem;
}

h3#furisode img,
h3#luxuryfurisode img {
   width: 4.31rem;
}

h3#TeaCeremony img {
   width: 4.69rem;
}

div.setcontent {
   border: solid 3px #CFB278;
   padding: 2px;
}
div.setcontent div {
   width: 100%;
   padding: 1.2rem 0;
   border: solid 1px #CFB278;
}

div.setcontent h4 {
   color: #D78E00;
}

div.price_exp {
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0px 0px 15px -5px #777777;
   padding-bottom: 1.3rem;
}

div.price_exp h4 {
   background-color: #C2191F;
   color: #ffffff;
   padding: 0.7rem 0;
}

div.price_exp span.price_exp_tit {
   font-size: 3.75rem;
   line-height: 0.8;
   font-weight: 600;
}

div.price_exp span.price_exp_tit.price_exp_tit2 {
   font-size: 2.8rem;
}

div.price_exp span.price_exp_tit.price_exp_tit3 {
   font-size: 2.4rem;
}



div.price_exp .usage {
   padding :0 1.3rem ;
   justify-content: flex-start;
   gap: 0.5rem;
}

div.price_exp .usage img {
   width: 5.00rem;
}

div.price_exp .usage div {
   width: calc(100% - 5.5rem);
}

div.price_exp .usage div.usage_rn {
   width: 100%;
} 



div.price_exp .usage div span {
   width: 100%;
   gap:0.7rem;
   white-space: nowrap;
}
div.price_exp .usage div span:after {
   content: "";
   display: block;
   width: 100%;
   height: 1px;
   background: #000000;
}
div.price_exp .usage div strong {
   font-weight: 600;
   line-height: 1;
}

div.price_exp .bubble {
   position: relative;
   width: calc(100% - 2.6rem);
   margin-right: auto;
   margin-left: auto;
   height: 2.19rem;
   font-weight: 500;
   background: #C2191F;
   color: #ffffff;
   border-radius: 1.88rem;
   justify-content: center;
   align-items: center;
   line-height: 1;
}
div.price_exp .bubble:after {
   content: "";
   position: absolute;
   bottom: -15px; /* :afterよりも1pxだけ下に */
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   border-width: 1rem 1rem 0;
   border-style: solid;
   border-color: #C2191F transparent transparent transparent;
   z-index: 2;
}


div.price_exp .bubble_op {
   position: relative;
   width: calc(100% - 2.6rem);
   margin-right: auto;
   margin-left: auto;
   height: 2.19rem;
   font-weight: 500;
   background: #C2191F;
   color: #ffffff;
   border-radius: 1.88rem;
   justify-content: center;
   align-items: center;
   line-height: 1;

}

div.price_exp h6 {
   /* background: #dddddd; */
   width: calc(100% - 4rem);
   height: 1.6rem;
   border-radius: 0.1rem;
   display: flex;
   margin-right: auto;
   margin-left: auto;
   justify-content: center;
   align-items: center;
   line-height: 1;
   font-weight: bokd;
}



div.price_exp .imgarea {
   width: calc(100% - 2.6rem);
   margin-right: auto;
   margin-left: auto;
   position: relative;
   z-index: 1;
   gap: 0.5rem;
}

div.price_exp ul.imgarea {
   flex-wrap: wrap;
}
div.price_exp ul.imgarea li {
   width: calc(33% - 0.4rem);
}


div.price_exp ul.imgarea li.two_element {
   width: calc(50% - 0.25rem);
}


div.price_exp .imgarea img {
   border-radius: 10px;
}


div.price_exp ul.imgarea li.two_element img {
   border-radius: 0;
}

div.price_exp a.morebtn {
   position: relative;
   background: #D4A443;
   width: 15.00rem;
   height: 3.13rem;
   margin-right: auto;
   margin-left: auto;
   color: #ffffff;
   font-weight: 600;
   line-height: 1;
   justify-content: center;
   align-items: center;
}
div.price_exp a.morebtn:before,
div.price_exp a.morebtn:after {
   content: "";
   position: absolute;
   width: 1px;
   height: 100%;
   background: #ffffff;
   top: 0;
}
div.price_exp a.morebtn:before {
   left: 0.2rem;
}
div.price_exp a.morebtn:after {
   right: 0.2rem;
}

div.price_exp a.morebtn .line_top,
div.price_exp a.morebtn .line_bottom {
   position: absolute;
   width: 100%;
   height: 1px;
   background: #ffffff;
   left: 0;
}

div.price_exp a.morebtn .line_top {
   top: 0.2rem;
}
div.price_exp a.morebtn .line_bottom {
   bottom: 0.2rem;
}

div.price_exp .plusplan {
   width: calc(100% - 2.6rem);
   margin-right: auto;
   margin-left: auto;
   border-radius: 10px;
   background: #FFEEEE;
   padding: 0.8rem;
   gap: 0.8rem;
}

div.price_exp .plusplan div span {
   font-weight: 600;
   display: block;
   line-height: 1.1;
}

div.price_exp .plusplan img {
   width: 6.25rem;
}

ul.plan_art {
   flex-wrap: wrap;
   gap: 1rem;
   justify-content: space-between;
   align-items: flex-start;
}
ul.plan_art li {
   width: calc(50% - 0.5rem);
}
ul.plan_art li span {
   font-weight: 600;
}


div.price_exp .btp_btn {
   background: #F1A100;
   position: relative;
   width: calc(100% - 2.6rem);
   height: 4.375rem;
    margin-right: auto;
    margin-left: auto;
    color: #ffffff;
    font-weight: 600;
    line-height: 1;
    justify-content: center;
    align-items: center;
    gap: 1rem;
   text-align: center;
   line-height: 0.8;
}

div.price_exp .btp_btn font {
   display: block;
}

div.price_exp .btp_btn.contact_btn {
   background: #C2191F;
}

div.price_exp .btp_btn .line_top {
   top: 0.2rem;
   position: absolute;
    width: 100%;
    height: 1px;
    background: #ffffff;
    left: 0;
}

div.price_exp .btp_btn .line_bottom {
   bottom: 0.2rem;
   position: absolute;
    width: 100%;
    height: 1px;
    background: #ffffff;
    left: 0;
}

div.price_exp .btp_btn:after {
   right: 0.2rem;
   content: "";
    position: absolute;
    width: 1px;
    height: 100%;
    background: #ffffff;
    top: 0;
}
div.price_exp .btp_btn:before {
   content: "";
   position: absolute;
   width: 1px;
   height: 100%;
   background: #ffffff;
   top: 0;
   left: 0.2rem;
}

div.price_exp .btp_btn .btp_btn_icon {
   position: relative;
   background: #FFDCA8;
   width: 1.5rem;
   height: 1.5rem;
   border-radius: 100%;
}

div.price_exp .btp_btn .btp_btn_icon:before {
   content:"";
   position: absolute;top: 50%;
   left: 56%;
   transform: translate(-50%, -50%);
   -webkit-transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%);
   width: 12px;
   height: 15px;
   background: #F1A100;
   clip-path: polygon(100% 50%, 0 0, 0 100%);


}

div.price_exp .btp_btn.contact_btn .btp_btn_icon {
   background: #E37F83;
}
div.price_exp .btp_btn.contact_btn .btp_btn_icon:before {
   background: #FFFFFF;

} 



/* モーダル */
/* オーバーレイのスタイル */
#overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5); /* 薄暗い背景 */
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.3s, visibility 0.3s;
   z-index: 20;
 }
 
 /* モーダルウィンドウの基本スタイル */
 #modal1, #modal2 {
   position: fixed;
   bottom: -100%; /* 初期状態では画面外に */
   left: 50%;
   transform: translate(-50%, 0%); /* X軸方向に-50%移動して中央に配置 */
   background: white;
   width: 80vw;
   height: 60vh;
   overflow: auto;
   /* max-width: 400px; */
   padding: 20px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   transition: bottom 0.3s;
   visibility: hidden;
   z-index: 9999999;
   transition: opacity 0.3s, transform 0.5s; 
 }
 
 /* モーダルウィンドウの表示スタイル */
 #modal1:not(.hidden),
 #modal2:not(.hidden) {
   top: 20vh; /* 画面の下から20%の位置に */
   transform: translate(-50%, 0%); /* Y軸の変化を削除 */
   visibility: visible;
 }
 
 #modal1.hidden,
#modal2.hidden {
  top: 100vh; /* 画面外の下部から開始 */
  opacity: 0;
  transform: translate(-50%, 100%); /* 初期位置を下に設定 */
}


 /* オーバーレイの表示スタイル */
 #overlay:not(.hidden) {
   opacity: 1;
   visibility: visible;
 }
 
 /* モーダルコンテンツ */
 .modal-content {
   text-align: center;
 }
 
 .modal-content p {
   white-space: pre-wrap;
 }
 .modal-content p span {
   font-weight: bold;
 }

.modalClose {
   border: 0;
   font-size: 1.3rem;
   color: #ffffff;
   font-weight: bold;
   background: #C2191F;
   padding: 0.5rem 3rem;
   border-radius: 1.5rem;
}


/* FAQ */


/* FAQ */
.accordion-item {
   background-color: #ffffff;
   border: solid 1px #ababab;
   border-radius: 1.25rem;
   margin-bottom: 0.5rem;
}
.accordion-title {
   cursor: pointer;
   padding: 0.8rem;

   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;

 }

 .accordion-title span {
   font-weight: bold;
 }
 
 
 .accordion-title button.toggle {
   background: none;
   border: none;
   font-size: 2rem;
   color: #C2191F;
   font-weight: 500;
   padding: 0.2rem;
 }
 
 .accordion-content {
   display: none;
   padding: 20px;
 }
 
 /* 最初はこのスタイルが無視されますが、JavaScriptで制御します */
.accordion-item {
   display: none;
 }
 
 #loadMore {
   background: none; /* 背景色を取り除く */
   border: none; /* ボーダーを取り除く */
   padding: 0; /* パディングを取り除く */
   margin: 0 auto; /* マージンを取り除く */
   width: 100%;
   text-align: center;
   cursor: pointer; /* カーソルをポインタに */
   font-size: 1.5rem;
   color: #C2191F;
   font-weight: 600;
   display: none; /* JavaScriptによって最初に5件以上ある場合のみ表示される */
   line-height: 1;
 }


/* イベント */
article.event {
   position: relative;
   margin-bottom: 65px;
   }
   
   article.event .event_top,
   article.event .event_fes_date
   {
      position: relative;
      z-index: 2;
   }


img.eventtopimg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: auto;
}

   
   article.event .event_top {
      text-align: center;
      height: 119.05vw;
   }


article.event .event_top.event_top_renew {
   height: 104.76vw;
}

   article.event .event_top h2 {
      padding-top: 25px;
      margin-bottom: 0.85rem;
      color: #F3DD93;
      text-shadow: 0px 0px 20px #000;
      font-size: 2.375rem;
      font-style: normal;
      font-weight: 500;
      line-height: 2.3rem;
      letter-spacing: 0.19rem;
   position: relative;
   z-index: 5;
   }
   
   article.event .event_top p {
      color: #FFF;
      text-align: center;
      text-shadow: 0px 0px 20px #000;
      font-size: 1.25rem;
      font-style: normal;
      font-weight: 400;
      line-height: 1.4rem; /* 140% */
      letter-spacing: 0.1625rem;
      margin-bottom: 1.3rem;

   position: relative;
   z-index: 5;
   }
   article.event .event_top h3 {
      color: #F3DD93;
      text-align: center;
      font-size: 3.75rem;
      font-style: normal;
      font-weight: 600;
      line-height: 1;
      letter-spacing: 0.1875rem;
   
      text-shadow: 0px 0px 20px #000;
      margin-bottom: 1.35rem;

   position: relative;
   z-index: 5;
   }
   
   article.event .event_top h3 small {
      font-size: 1.875rem;
      font-weight: 500;
      letter-spacing: 0.09375rem;

   position: relative;
   z-index: 5;
   }
   
article.event .booknow_area {

   position: relative;
   z-index: 5;
}

   
   article.event .event_top_img {
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 1;
   }
   
   article.event .event_top_img img {
      width: 100%;
   }
   
   article.event .event_fes_date {
      margin-top: 96.90vw;
   }



article.event .event_fes_date .eventhd {
   background-image: url('../img/event_hd_bg.png');
   background-repeat: no-repeat; 
   background-position: top;
   background-size: cover;
   height: 23.33vw;
}

article.event .event_fes_date .eventmain {
   background-image: url('../img/event_hd_bg2.png');
   background-repeat: repeat; 
   background-position: top;
   background-size: contain;
   padding-bottom: 7rem;
}



   article.event .event_fes_date .fes_date_detail {
      height: 157.38vw;
      text-align: center;
   }

   article.event .event_fes_date .fes_date_detail.detail_renew {
      height: auto!important;
   }
   article.event .event_fes_date .fes_date_detail strong {
      font-size: 1.75rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      color: #ffffff;
      display: flex;
      width: 27.38vw;
      height: 27.38vw;
      justify-content: center;
      align-items: center;
      line-height: 1;
      margin-bottom: 80vw;
   }
   .mantosai {
      margin-bottom: 0.9rem;
   }
   .tenjin {
      margin-bottom: 1.35rem;
   }

   .yodogawa {
      margin-bottom: 0.9rem;

   }


   article.event .event_fes_date .fes_date_detail.mantosai strong {
      margin-left: auto;
      margin-right: 7.6vw;
      margin-bottom: 81.67vw;

   }
   
   article.event .event_fes_date .fes_date_detail.tenjin strong { 
      margin-left: 7.14vw; 
   }
   article.event .event_fes_date .fes_date_detail.yodogawa strong {
      margin-left: auto;
      margin-right: 7.6vw;
      margin-bottom: 81.67vw;
   
    }
    article.event .event_fes_date .fes_date_detail.uneme strong { 
      margin-left:7.14vw;
      margin-top: 1.2vw;
    }
   
   article.event .event_fes_date .fes_date_detail h4 {
      color: #ffffff;
      text-align: center;
      font-size: 2.5rem;
      font-style: normal;
      font-weight: 600;
      line-height: 2.75rem;
      margin-bottom: 0.8rem;
   }
   
   article.event .event_fes_date .fes_date_detail.yodogawa h4 {
      line-height: 2.7rem;
      margin-bottom: 18px;
   }
   
   article.event .event_fes_date .fes_date_detail.uneme h4 {
      margin-bottom: 23px;
   }
   
   article.event .event_fes_date .fes_date_detail p {
      color: #ffffff;
      text-align: center;
      font-size: 1.625rem;
      font-style: normal;
      font-weight: 350;
      line-height: 1.2;
      margin-bottom: 10px;
   }
   
   article.event .event_fes_date .fes_date_detail dl {
      width: 83.33vw;
      height: 14.29vw;
      background: #FFF;
      box-shadow: 0px 0px 15px 3px rgba(0, 0, 0, 0.50);
      gap: 0;
      margin: 0 auto;
   }
   
   .fes_date_detail dl dt {
      width: 33.33vw;
      height: 100%;
      background: #CB9D45;
      color: #ffffff;
      text-align: center;
      font-size: 1.75rem;
      font-style: normal;
      font-weight: 350;
      line-height: 1.625rem;
      display: flex;
      justify-content: center;
      align-items: center;
   }
   
   .fes_date_detail dl dd {
      width: 50vw;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      font-size: 2rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      letter-spacing: -0.1rem;
      white-space: nowrap;
   }



article.event_list {
   width: 96%;
   margin: 0 auto 2rem;
   border-bottom: solid 2px #C2191F;
	 padding-top:30px;
}

article.event_list h3 {
   text-align: center;
   /*font-size: 2.5rem;*/
   font-size: 2rem;
   font-style: normal;
   font-weight: 600;
   line-height: normal;
   letter-spacing: 0.03rem;
   margin-bottom: 1rem;
}


.tabs {
   width: 96%;
   margin: 0 auto;
   border-bottom: solid 2px #C2191F;
   gap: 2px;
   padding: 0 5px;
}

.tabs button {
   width: 32%;
   height: 3.75rem;
   /* margin: 0 2px; */
   /* padding: 10px 20px; */
   display: flex;
   justify-content: center;
   align-items: center;
   border: none;
   cursor: pointer;
   outline: none;
   transition: background-color 0.3s;
   border-radius: 0.625rem 0.625rem 0rem 0rem;
   background: #ffffff;
   color: #C2191F;
   border:solid 1px #C2191F;
   border-bottom: none;
   font-size: 1.15rem;
   font-weight: 650;
}

.tabs button.active {
   background: #C2191F;
   color: #ffffff;
   border: none;
}

.tab-content {
   width: 96%;
   margin: 0 auto;
   display: none;
   opacity: 0;
   transition: opacity 0.5s;
   padding: 0.2rem 0;
}

.tab-content.active {
   display: block;
   opacity: 1;
}

.tab-content div.eventlistdetail {
   width: 100%;
   padding: 10px;
   border-bottom: solid 1px #FFBFC2;
   gap: 10px;
   align-items: flex-start;
}

.tab-content div.eventlistdetail:last-child {
   border: none;
}

.tab-content div.eventlistdetail img {
   width: calc(40% - 5px);
}

.tab-content div.eventlistdetail div {
   width: calc(60% - 5px);
   gap: 0.2rem;
   align-items: flex-start;
   justify-content: flex-start;
}

.tab-content div.eventlistdetail div span.place {
   color: #ffffff;
   display: flex;
   justify-content: center;
   align-items: center;

   width: 5.9375rem;
   height: 1.625rem;
   /* padding: 0 0.7rem; */

   text-align: center;
   font-size: 1.125rem;
   font-style: normal;
   font-weight: 650;
   line-height: normal;
   letter-spacing: 0.05625rem;
}
.tab-content div.eventlistdetail div span.place.osaka {
   background: #E37F83;
}
.tab-content div.eventlistdetail div span.place.kyoto {
   background: #CFB278;
}
.tab-content div.eventlistdetail div span.place.hyogo {
   background: #9BBE8E;
}
.tab-content div.eventlistdetail div span.place.nara {
   background: #7FB3E3;
}
.tab-content div.eventlistdetail div span.place.kobe {
   background: #4F87C0;
}


.tab-content div.eventlistdetail div h4 {
   font-size: 1.25rem;
   font-style: normal;
   font-weight: 650;
   line-height: 1.25rem; /* 100% */
   white-space: nowrap;
}

.tab-content div.eventlistdetail div span.date_title {
   color: #939393;
   font-size: 1.2rem;
   font-weight: 300;
   line-height: 1;
}

.tab-content div.eventlistdetail div p.date {
   color: #1E1E1E;
   font-size: 1.375rem;
   font-weight: 550;
   line-height: 1;
   letter-spacing: -0.03rem;
}



.detail_renew {
   position: relative;
   padding-top: 2rem;
}

.detail_renew strong.fes_place {
   position: absolute;
   background:#e7bb22;
   border-radius: 50%;
   z-index: 3;
}

.detail_renew .fes_img {
   position: relative;
   /* width: 379px;
   height: 403px; */
   width: 90%;
   aspect-ratio: 379 / 403;
   margin: 2rem auto 1rem;
}
.detail_renew .fes_img .fes_frame {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   -webkit-transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%);
   width: 100%;
   height: auto;
   z-index: 5;
}
.detail_renew .fes_img .fes_photo_main {
   position: absolute;
   width: 93%;
   height: auto;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   -webkit-transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%);
   border-radius: 50%;
   z-index: 4;
}


.fes_name {
   font-family: "kokuryu", sans-serif;
   font-weight: 400;
   font-style: normal;
   position: absolute;
   bottom: 150px;
   z-index: 6;
   background-image: url(../img/fes_name_bg.png);
   background-size: contain;
   font-size: 2.4rem;
   letter-spacing: -0.2em;
   text-align: center;
   width: 45.24vw;
   height: 51.67vw;
   display: flex;
   justify-content: center;
   align-items: center;
   padding-right: 0.4rem;
   padding-top: 0.7rem;
}


.detail_right strong.fes_place {
   right: 1rem;
}

.detail_right .fes_name {
   left: -15px;
   transform: rotate(-25deg);
}


.detail_left strong.fes_place {
   left: 1rem;
}

.detail_left .fes_name {
   right: -15px;
   transform: rotate(25deg);
}

img.fes_bottom {
   position: absolute;
   width: 100%;
   height: auto;
   bottom: -2rem;
}


.detail1 {
   background-image: url(../img/event_fire1.png);
   background-position: left top;
   background-repeat: no-repeat;
   background-size: 45%;
}

.detail2 {
   background-image: url(../img/event_fire2.png);
   background-position: right top;
   background-repeat: no-repeat;
   background-size: 38%;
}



/* 秋イベント */
article.event.autumn {
   margin-bottom: 0;
}

.event_autumn, .autumn_park {
   font-size: 3.81vw;
}

.autumn_top {
   position: relative;
}

.autumn_top h2 {
   position: absolute;
   top: 2.5rem;    
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   font-weight: 300;
   color: #ffffff;
   text-align: center;
   display: block;

   font-size: 1.8rem;
   line-height: 1.1;
   letter-spacing: 0.1rem;
   white-space: nowrap;
}

.autumn_top h2 strong {
   font-weight: 300;
   font-size: 4.2rem;
   display: block;
   line-height: 0.8;
}

.autumn_bottom {
   position: relative;

}

.autumn_bottom p {
   position: absolute;
   top: 2.5rem;    
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   font-size: 1.8rem;
   font-weight: 300;
   color: #ffffff;
   text-align: center;
   width: 85%;

   line-height: 1.1;
   letter-spacing: 0.1rem;
}

.booknow_area.autumn {
   background-image: url(../img/autumn_booknow.webp);
   background-size: cover;
   width: 100%;
   height: 4.5rem;
   color: #ffffff;
   display: flex;
   justify-content: center;
   align-items: center;
   font-weight: 300;
}

.booknow_area.autumn a {
   width: 100%;
   height: 4.5rem;
   color: #ffffff;
   display: flex;
   justify-content: center;
   align-items: center;
   font-size:1.4rem;
   font-weight: 300;

   letter-spacing: 0.1rem;
}

.booknow_area.autumn a:after {
   content: "▶︎";
   font-size:1.2rem;
}

.autumn_park {
   margin-bottom: 1rem;
}
.autumn_park .parks {
   position: relative;
   margin: 0;
}

.autumn_park .parks .parktxtarea {
   position: absolute;
   top: 0!important;
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   width: 100%;
}

.autumn_park .parks .parktxtarea.leftmargin h3,
.autumn_park .parks .parktxtarea.leftmargin span,
.autumn_park .parks .parktxtarea.leftmargin p,
.autumn_park .parks .parktxtarea.leftmargin ul {
   margin-left: 10%;
}

.autumn_park .parks .parktxtarea.rightmargin h3,
.autumn_park .parks .parktxtarea.rightmargin span,
.autumn_park .parks .parktxtarea.rightmargin p,
.autumn_park .parks .parktxtarea.rightmargin ul {
   margin-right: 10%;
}


.parktxtarea h3 {
   color: #ffffff;
   font-size: 2.5rem;
   font-weight: 300;
   text-align: center;
   display: block;
   width: 85%;
   height: 3.5rem;
   line-height: 1.1;
   letter-spacing: 0.03em;
   white-space: nowrap;
   margin: 0 auto;
}

.parktxtarea span {
   color: #D7C98D;
   text-align: center;
   font-size: 1.8rem;
   width: 85%;
   display: block;
   letter-spacing: 0.06em;
   margin: 0 auto 0.8rem;
}

.parktxtarea p {
   color: #D7C98D;
   text-align: center;
   font-size: 1.8rem;
   font-weight: 300;
   letter-spacing: 0.06em;
   line-height: 1.2;
   width: 85%;
   margin: 0 auto 0.6rem;
}

.parktxtarea ul {
   position: relative;
   width: 85%;
   margin: 0 auto;
}

.parktxtarea ul li:not(.parkmins) {
   position: absolute;
   text-align: center;
   color: #ffffff;
   font-size: 1.4rem;
   letter-spacing: 0.06rem;
   font-weight: 300;
   width: 70%;
   left: 30%;
   display: flex;
   justify-content: center;
   align-items: center;
   line-height: 1;
}

.parktxtarea ul li:first-child {
   height: 50%;
   top: 0;
}

.parktxtarea ul li:nth-child(2) {
   height: 50%;
   top: 50%;

}

.parktxtarea ul li strong {
   font-weight: 300;
   font-size: 1.8rem;
}

.parktxtarea ul li.smtxt {
   font-size: 1.4rem;
}

.parktxtarea ul li.smtxt strong {
   font-size: 1.7rem;
}

/* 個別調整 */

/* park2 */
.autumn_park .park2 .parktxtarea {
   /* top: 25.7rem; */
}

.autumn_park .park2 .parktxtarea span,
.autumn_park .park2 .parktxtarea p {
   color: #EAD994;
}

/* park3 */
.autumn_park .park3 .parktxtarea {
   /* top: 25.4rem; */
}

.autumn_park .park3 .parktxtarea h3 {
   font-size: 2.6rem;
}



/* park4 */
.autumn_park .park4 .parktxtarea {
   /* top: 25rem; */
}

.autumn_park .park4 .parktxtarea h3 {
   font-size: 2.6rem;
   line-height: 0.9;
   height: 5.2rem;
}

.autumn_park .park4 .parktxtarea span,
.autumn_park .park4 .parktxtarea p {
   color: #EAD994;
}

.autumn_park .park4 .parktxtarea span {
   margin-bottom: 0.5rem;
}
.autumn_park .park4 .parktxtarea p {
   line-height: 0.9;
   margin-bottom: 0.8rem;
}

/* park5 */
.autumn_park .park5 .parktxtarea {
   /* top: 25.5rem; */
}
.autumn_park .park5 .parktxtarea h3 {
   font-size: 2.3rem;
   line-height: 0.9;
   height: 4.7rem;
   margin-bottom: 0.7rem;
}


/* park6 */
.autumn_park .park6 .parktxtarea {
   /* top: 25.2rem; */
}

.autumn_park .park6 .parktxtarea h3 {
   height: 2.7rem;
}

.autumn_park .park6 .parktxtarea span,
.autumn_park .park6 .parktxtarea p {
   color: #EAD994;
}

.autumn_park .park6 .parktxtarea p {
   line-height: 1;
}

/* park7 */
.autumn_park .park7 .parktxtarea {
   /* top: 25.1rem; */
}
.autumn_park .park7 .parktxtarea h3 {
   font-size: 2.6rem;
   line-height: 1;
   height: 5.6rem;
}


.autumn_park .park7 .parktxtarea p {
   line-height: 1;
   margin-bottom: 0.5rem;
}

/* park8 */
.autumn_park .park8 .parktxtarea {
   /* top: 25.7rem; */
}
.autumn_park .park8 .parktxtarea h3 {
   font-size: 2.7rem;
   line-height: 0.9;
   height: 4.7rem;
   margin-top: -0.5rem;
}
.autumn_park .park8 .parktxtarea span,
.autumn_park .park8 .parktxtarea p {
   color: #EAD994;
}

/* park9 */
.autumn_park .park9 .parktxtarea {
   top: 25.2rem;
}
.autumn_park .park9 .parktxtarea h3 {
   font-size: 2.6rem;
   line-height: 0.85;
   height: 5rem;
}
.autumn_park .park9 .parktxtarea span,
.autumn_park .park9 .parktxtarea p {
   color: #EAD994;
}


/* park10 */
.autumn_park .park10 .parktxtarea {
   top: 25.7rem;
}
.autumn_park .park10 .parktxtarea h3 {
   font-size: 2.6rem;
}







/* ハンバーガーメニュー */

/* メニュー全体のスタイル */
.menu-container {
   position: relative;
}

/* ハンバーガーメニューアイコン */
.hamburger {
   width: 2.5rem;
   height: 25px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   cursor: pointer;
   z-index: 1001;
   position: fixed;
   top: 50%;
   right: 0.2rem;
   transform: translateY(-50%);
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
}

.hamburger.pc {
   display: none;
}

.hamburger span {
   display: block;
   height: 1px;
   width: 2rem;
   background: #C2191F;
   transition: all 0.3s ease;
}

/* メニューのスタイル（デフォルト非表示・全画面） */
.menu {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100vh;
   background: rgba(255, 255, 255, 0.942);
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.3s ease, visibility 0.3s ease;
}

.menu ul {
   list-style: none;
   margin: 0;
   padding: 0;
   text-align: center;
}

.menu ul li {
   margin: 0.7rem 0;
}

.menu ul li a {
   text-decoration: none;
   color: #C2191F;
   font-size: 1.5rem;
   /* font-weight: bold; */
   transition: color 0.3s ease;
}

.menu ul li a:hover {
   color: #f39c12;
}

/* メニューが開いたとき */
.menu.active {
   opacity: 1;
   visibility: visible;
}

/* ハンバーガーメニューのアニメーション（×に変化） */
.hamburger.active span:nth-child(1) {
   transform: rotate(45deg) translate(7px, 15px);
}

.hamburger.active span:nth-child(2) {
   opacity: 0;
}

.hamburger.active span:nth-child(3) {
   transform: rotate(-45deg) translate(1px, -11px);
}

/* スクロール禁止 */
body.no-scroll {
   overflow: hidden;
}




/* クリエイターズフォトプラン */
.cr_plan ul {
   width: calc(100% - 2rem);
   margin: 0 auto 1rem;
   justify-content: space-between;
}
.cr_plan ul.crs_list {
   flex-wrap: wrap;
}

.cr_plan ul li {
   width: 32%;

}
.cr_plan ul li a {
   width: 100%;
   color: #000000!important;
   font-size: 0.85rem;
}
.cr_plan ul li a font {
   color: #000000;
   font-size: 0.7rem;
}

.cr_plan ul li img {
   width: 100%;
   height: auto;
   aspect-ratio: 1 / 1;
   object-fit: cover;
   object-position: center;

}

.cr_plan ul.crs_list li a {
   position: relative;
   width: 100%;
   height: fit-content;
   display: block;

}

.cr_plan ul.crs_list li a:before {
   content: "";
   position: absolute;
   bottom: 1.2rem;
   right: 0rem;
   display: block;
   width: 2.5rem;
   height: 2.5rem;
   background-image: url(../img/crs_icon.png);
   background-repeat: no-repeat;
   background-size: cover;
   z-index: 3;
}


a.gocontact.cr {
   background: #C2191F;
   font-size: 1.4rem;
}

.cr_profile {
   width: 100%;
   gap: 0.5rem;
   align-items: flex-start;
}

.cr_profile img {
   width: 40%;
}

.cr_profile p {
   width: calc(60% - 0.5rem);
   text-align: left;
}
.cr_profile p span {
   font-weight: bold;
   margin-bottom: 0;
   padding: 0;
}

h3.cr_hd {
   width: 100%;
   border-bottom: solid 2px #C2191F;
   margin-bottom: 0.5rem;
   padding-bottom: 0.5rem;
   font-weight: bold;
}

p.cr_txt {
   margin-bottom: 2rem;
   display: block;
}

div.cr_photo {
   flex-wrap: wrap;
   gap: 0.8rem;
   justify-content: flex-start;
}

div.cr_photo a {
   width: calc(50% - 0.4rem);
}

div.cr_photo img {
   width: 100%;
   height: auto;
   aspect-ratio: 1 / 1;
   object-fit: cover;
   object-position:center;
}



/* 紅葉プラン */
.event.koyo {}

.event.koyo .koyomv {
   position: relative;
}
.event.koyo .koyomv p {
   position: absolute;
   z-index: 2;
   color: #ffffff;
   text-align: center;
   top: 2rem;
   left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    display: block;
    width: 90%;
    font-size: 1.3rem;
letter-spacing: 0.1rem;
line-height: 1.1;
}


.event.koyo .koyomv p span {
text-shadow: 0px 0px 9.9px rgba(243, 158, 79, 1);
font-size: 2rem;
line-height: 100%;
letter-spacing: 0.2rem;
text-align: center;

}

.event.koyo .koyomv p strong {
text-shadow: 0px 0px 9.9px rgba(243, 158, 79, 1);
      font-weight: 400;
      font-size: 4rem;
      line-height: 100%;
      letter-spacing: 0.4rem;
      text-align: center;
      padding-bottom: 1rem;
display: block;

}

.event.winter .koyomv p span,
.event.winter .koyomv p strong {

text-shadow: 0px 0px 9.9px #4FF3EE;
}

.event.koyo .koyomv p span.subtxt {
   text-shadow: none;
font-size: 1.4rem;
line-height: 100%;
    font-size: 1.7rem;
letter-spacing: 0.1rem;
text-align: center;
padding-top: 1rem;
display: block;

}


.event.koyo .koyomv img {
   position: relative;
   z-index: 1;
}


.event.koyo .planarea {
   background: #C2191F;
   color: #ffffff;
   padding: 1.5rem 1rem;
}

.event.koyo .planarea h3 {
   text-align: center;
   margin-bottom: 0.5rem;
}

.event.koyo .planarea img {
   border-radius: 1rem;
}

.event.koyo .planarea p {
   padding: 0.5rem;
   margin-bottom: 0.5rem;
}

.event.koyo .planarea hr {
   border: none;
   display: block;
   background-color: #ffffff;
   height: 1px;
   width: 100%;
   margin: 2rem auto;
}

.event.koyo .planarea div.pl {
   background: #ffffff;
   border-radius: 9999px;
   padding: 1rem;
   line-height: 0.6;
   text-align: center;
}

.event.koyo .planarea div.pl small {
   text-align: right;
}


div.koyobg {
   display: block;
   width: 100%;
   height: 100px;
   background-image: url(../img/koyo_bg.png);
   background-repeat: no-repeat;
   background-position: left top;

}

article.event_list.koyo {
   margin-top: -30px;
}

article.event_list.koyo h3 {
   border-bottom: solid 1px #C2191F;
}

.koyo .tab-content div.eventlistdetail div span.place.osaka {
   background: #C04F4F;
}
.koyo .tab-content div.eventlistdetail div span.place.kyoto {
   background: #C0AB4F;
}
.koyo .tab-content div.eventlistdetail div span.place.hyogo {
   background: #9BBE8E;
}
.koyo .tab-content div.eventlistdetail div span.place.nara {
   background: #C0774F;
}
.koyo .tab-content div.eventlistdetail div span.place.kobe {
   background: #4F87C0;
}

.koyo .tab-content div.eventlistdetail img {
   aspect-ratio: 160 / 130;
   object-fit: cover;
}


.koyo .tab-content div.eventlistdetail div p.date {
   font-size: 1.1rem;
   font-weight: normal;
   line-height: 1.2;
}

.koyo .tab-content div.eventlistdetail div a {
   display: flex;
   width: fit-content;
   padding: 0.3rem 0.2rem 0.3rem 0.6rem;
   color: #ffffff;
   border-radius: 9999px;
   background: linear-gradient(90deg, #F27400 0%, #FB4218 50.96%, #DA2B09 90.38%);

}

.koyo .tab-content.winter div.eventlistdetail div a {
   background: #000000;
   text-align: center;
   padding: 0.3rem 1rem 0.3rem 1rem;

}

/* 固定メニュー */
.bottom_menu.koyo a {
   padding: 0;
   height: fit-content;
}
.bottom_menu.koyo a:before,
.bottom_menu.koyo a:after {
   content: none;
}



/* プラン追加 */
div.goto_att {
   width: calc(100% - 2.6rem);
   margin: 1rem auto 0;
   background: #fceed5;
   padding: 0.7rem;
}

div.goto_att a {
   display: flex;
   background: #ffffff;
   border-radius: 9999px;
   color: #F0A200;
   border: solid 1px #F0A200;
   font-size: 0.8rem;
   justify-content: center;
   align-items: center;
   width: fit-content;
   padding: 0.4rem 1rem;
   margin: 0.65rem auto;
   position: relative;
   gap: 0.5rem;
}

div.goto_att a span {
   position: relative;
   background: #fde7bf;
   border-radius: 50%;
  width: 1.4rem;
  height: 1.4rem;
}

/* 三角（再生アイコン） */
div.goto_att a span::after {
  content: "";
  position: absolute;
  right: 20%;
  top: 50%;
    /* transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); */
  /* 三角はボーダーで作る */
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 7px solid #ea980f; /* 三角の色 */
  /* 視覚中心にくるように少し左寄せで補正 */
  transform: translate(-35%, -50%);
}

.plan_select {
   gap: 1rem;
}

.plan_select li {
   width: 40%;
}

.plan_select li a {
   border: solid 1px #C2191F;
   border-radius: 7px;
   background: #C2191F;
   color: #ffffff;
   width: 100%;
   padding: 0.7rem;
   font-weight: bold;
   font-size: 1.2rem;
}

.plan_select li.now a {
   background: #ffffff;
   color: #C2191F;
}

.plan_tp {
   width: calc(100% - 2.6rem);
   margin: 0 auto 1rem;
}

.plan_tp strong.flex {
   justify-content: space-between;
}

.plan_tp strong a {
   font-size: 0.8rem;
   width: fit-content;
   padding: 0.4rem 0.3rem;
   color: #000000;
   font-weight: normal;
   display: block;
   border: solid 1px #A6A6A6;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
   border-radius:5px;
}
.plan_tp strong a:hover {
   box-shadow: none;
   transform: translateY(2px);
   opacity: 1;
}

.plan_tp strong.plandt {
   justify-content: flex-start;
   gap: 0.2rem;
}

.plan_tp strong.plandt img.icon {
   width: 1rem;
   height: 1rem;
}

.plan_tp h5,
.plan_content h5 {
   font-weight: normal;
   display: block;
   border-bottom: solid 1px #ccc;
}

.plan_tp hr {
   margin: 0.5rem 0;
}



.plan_more {
}

/* ▼ 開閉ボタン */
.plan_more .toggle_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #b71c1c; /* 赤 */
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  position: relative;
  font-size: 1rem;
  margin-right:auto ;
  margin-left:auto ;
}

/* ▼ 矢印 */
.plan_more .arrow {
  display: inline-block;
  margin-left: 10px;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #fff; /* 下向き矢印 */
  transition: transform 0.3s ease;
}

/* ▼ 開いたときの矢印（上向き） */
.plan_more.open .arrow {
  transform: rotate(180deg);
}

/* ▼ 開閉コンテンツ（アニメーション用） */
.plan_more .plan_content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 1s ease;

}

/* ▼ 表示時 */
.plan_more.open .plan_content {
  max-height: 10000px; /* 想定より少し大きめにしておく */
}

/* ▼ 閉じるボタン */
.plan_more .close_btn {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  color: #000;
  width: fit-content;
  margin: 1rem auto 0;
}

.plan_more .close_btn span {
   border: solid 2px #000000;
   border-radius: 50%;
   display: flex;
   width: 17px;
   height: 17px;
   font-size: 9px;
   justify-content: center;
   align-items: center;
}

.plan_content {
   padding-top: 1rem;
}

.plan_content .wd_area {
   width: calc(100% - 2.6rem);
   margin-right: auto;
   margin-left: auto;
}


.plan_content h5 {
   text-align: left;
   padding-bottom: 0.3rem;
}


.route_icons {
  gap: 2rem;
}

.route_item {  }

.ic_circle {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
}

.ic_circle img { width: 2.25rem; height: 2.25rem; }

.ic_taxi  { background: #2faa59; }   /* 緑の丸 */
.ic_train { background: #d1453b; }   /* 赤の丸 */
.ic_walk  { background: #111; }      /* 黒の丸 */
.hd_icon { background: #DCDCDC;}
.route_time strong { font-weight: 700; }
.route_time small  { margin-left: 2px; }

.route_photo { margin: 16px 0; }
.route_caption { 

}


span.fare {
   justify-content: flex-end;
   padding-right: 3rem;
   gap: 0.5rem;
}

span.fare img {
   width: 1.3rem;
   height: auto;
}

ul.station {
   justify-content: flex-start;
   align-items: stretch;
}
ul.station li:first-child {
   padding:2px;
   width: 10%;
}

ul.station li img {
   width:1.9rem ;
   height: 1.9rem;
}

ul.station li:nth-child(2) {
   padding: 5px 3px;
   line-height: 0.9;
   width: 20%;
}

ul.station li:last-child {
   width: 70%;
   align-items: center;
   justify-content: flex-start;
   padding-left: 0.5rem;

}




ul.train_line {
   position: relative;
   justify-content: flex-start;
   align-items: stretch;
   min-height: 140px;
}
ul.train_line li.stations {
   position: absolute;
   left: 0.5rem;
   top: 50%;
       transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    font-size: 0.7rem;
}

ul.train_line li:nth-child(2):not(ul.rail-ul li)  {
      width: 10%;
}

ul.train_line li:nth-child(3):not(ul.rail-ul li) {
      width: 20%;
      height: auto;
      background-image: url(../img/train_line.png);
      background-repeat: repeat-y;
      background-size: 30%;
      background-position: center center;
}


ul.train_line li:nth-child(4):not(ul.rail-ul li)  {
   padding-top: 0.5rem;
}

:root {
  /* 路線カラー（必要に応じて路線ごとに変えてください） */
  --rail-color: #C2191F;
}



/* ラッパー */
.rail {
  position: relative;
  padding-left: 50px;           /* バッジ分の余白 */
}

/* 縦レール（バッジの下からULの下端まで） */
.rail::before {
  content: "";
  position: absolute;
  left: 22px;                   /* バッジ中心と合わせる */
  top: 16px;                    /* タイトル下あたりから開始（微調整用） */
  bottom: 8px;                  /* 下端の余白 */
  width: 3px;
  height: 2rem;
  background: var(--rail-color);
  /* border-radius: 2px; */
}

/* バッジ（テキスト or 画像） */
.rail-badge {
  position: absolute;
  left: 10px;
  top: -2px;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  background: var(--rail-color);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  line-height: 1;
  overflow: hidden;
}
.rail-badge img { width: 40%; height: auto; display: block; }

.nankai .rail-badge img {
   width: 80%;
}

/* 本文 */
.rail-title { 
   color: var(--rail-color);
   height: 1.5rem;
   display: flex;
   align-items: center;
 }

/* リスト */
.rail-ul {
  margin: 0;
  padding-top: 1rem;
  list-style: none;
  position: relative;
}
.rail-ul:before {
   content: "";
   display: block;
   position: absolute;
   left: -28px;
   top: 0;
   width: 3px;
   height: 75%;
   background: var(--rail-color);
}

.nankai .rail-ul:before {
   height: 89%;
}


/* 各項目：複数行でもテキストは自然に折返し */
.rail-ul li {
  position: relative;
  padding: 4px 0 4px 16px;        /* テキスト左に少し余白 */
  /* margin: 10px 0; */
  line-height: 0.9;
   color: var(--rail-color);
}

.nankai .rail-ul li {
   letter-spacing: -0.04em;
   white-space: nowrap;
}

/* 枝線（縦レール → ダイヤの左まで） */
.rail-ul li::before {
  content: "";
  position: absolute;
  /* li基準で、縦レール位置（.rail::before の left:28px）まで戻る */
  left: -28px;                 /* = 28px(レール) + 8px(ダイヤ中心までの余白) */
  top: 8px;                  /* 1行目の中央あたり（フォントに応じて微調整） */
  width: 28px;                 /* 枝の長さ（ダイヤ手前まで） */
  height: 0;
  border-top: 3px solid var(--rail-color);
}

/* ダイヤ */
.rail-ul li::after {
  content: "";
  position: absolute;
  left: -3px;                  /* テキスト側へ寄せて配置 */
  top:4px;
  width: 12px;
  height: 12px;
  background: var(--rail-color);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  /* border-radius: 1px; */
}

/* アンカー（下線を使いたい場合） */
.rail-ul a {
  text-decoration: underline;
  color: inherit;              /* 色指定不要の要望に合わせて継承 */
}

/* 線路カラー別 */
.rail.chuo { --rail-color: #00BD1C; }
.rail.nankai { --rail-color: #2d6fbd; } 




ul.train_line li.train_time {
   margin-left: auto;
   height: auto;
   padding-right: 0.7rem;
}

ul.train_line li.train_time.nankai {

   padding-right: 0.7rem;
}


.train_time {
  position: relative;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  height: 100%; /* 親要素に応じて可変 */
}


/* 矢印部分（上・下共通） */
.train_time span:not(.time) {
  position: relative;
  width: 2px;
  background: #C2191F;
  flex: 1; 
  min-height: 3rem;
}

.train_time span.arrow_top:before {
   content: "";
   display: block;
   position: absolute;
   top: 0;
   left: 50%;

    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
   background: #C2191F;
   width: 10px;
   height: 8px;
   clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

.train_time span.arrow_bottom:after {
   content: "";
   display: block;
   position: absolute;
   bottom: 0;
   left: 50%;

    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
   background: #C2191F;
   width: 10px;
   height: 8px;
   clip-path: polygon(0 0, 50% 100%, 100% 0);
}


ol.museum_route {
  counter-reset: num;            /* カウンターを初期化 */
  list-style: none;              /* デフォルトの番号を消す */
  margin: 0;
  padding: 0;
}

.museum_route li {
  position: relative;
  counter-increment: num;        /* カウンターを1ずつ進める */
  margin: 0;         /* 左にインデントを作る */
  line-height: 1.2;
   padding-left: 1.3em;
   margin-bottom: 0.6rem;
}

/* 番号部分 */
.museum_route li::before {
  content: counter(num) ".";
  position: absolute;
  left: 0;
  top: 0;
}