@charset "utf-8";

.fs11 { font-size: 1.1rem !important; }
.fs13 { font-size: 1.3rem !important; }
.fs15 { font-size: 1.5rem !important; }

.fsS ul li { font-size: 1.2rem; }

/* コンテンツ幅 フル */
.contentsInr { width: auto; padding: 0px; }

@media all and (max-width: 739px){
	.ctm_contentsFull {}
}

/* コンテンツ幅 950px */
.contentsInr .contentsUnit { padding: 0 10px; margin: 0 auto; }

@media all and (min-width: 740px){
	.contentsInr .contentsUnit { width: 950px !important; padding: 0px; margin: 0 auto; }
}

/* icon */
.material-symbols-outlined { font-variation-settings: 'wght' 200; }

.materialSymbolsOutlined:before { font-family: "Material Symbols Outlined"; }
.materialIcons:before { font-family: "Material Icons"; }

/* font */
.monogatari .ctm_pageTtl .heading,
#Lead,#Lead h1,
#Navi .tabs_parent > li > a { font-family: "Shippori Mincho", serif; font-style: normal; letter-spacing: 0.1em; }
.monogatari .ctm_pageTtl h3.heading,
.monogatari .ctm_pageTtl h4.heading { letter-spacing: 0.05em; }

#Point .pointListBlock .numList > li:before,
#Point .pointListBlock .numList > li:after,
#Schedule .ctm_pageTtl h3.heading { font-family: 'Petit Formal Script', cursive; letter-spacing: 0; }

/* heading */
.monogatari .ctm_pageTtl .heading { font-weight: 700; }

.monogatari .ctm_pageTtl .ttlLv1 .heading { position: relative; }
.monogatari .ctm_pageTtl.pageTtl_typeA .heading:before,
.monogatari .ctm_pageTtl.pageTtl_typeA .heading:after,
.monogatari .ctm_pageTtl.pageTtl_typeB .heading:before,
.monogatari .ctm_pageTtl.pageTtl_typeB .heading:after { content: ""; position: absolute; display: inline-block; }
.monogatari .ctm_pageTtl.pageTtl_typeA .heading:before { width: 220px; height: 220px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/ssy/monogatari/img_sites/heading_bg01.png) no-repeat; background-size: contain; top: -60px; left: -50px; }
.monogatari .ctm_pageTtl.pageTtl_typeA .heading:after  { width: 40px; height: 40px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/ssy/monogatari/img_sites/heading_bg03.png) no-repeat; background-size: contain; bottom: -30px; right: 0; }
.monogatari .ctm_pageTtl.pageTtl_typeB .heading:before { width: 40px; height: 40px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/ssy/monogatari/img_sites/heading_bg03.png) no-repeat; background-size: contain; bottom: -25px; left: 0; }
.monogatari .ctm_pageTtl.pageTtl_typeB .heading:after  { width: 220px; height: 220px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/ssy/monogatari/img_sites/heading_bg02.png) no-repeat; background-size: contain; top: -50px; right: -50px; }
@media all and (min-width: 740px){
	.monogatari .ctm_pageTtl.pageTtl_typeA .heading:before { width: 270px; height: 270px; top: -30px; left: -280px; }
	.monogatari .ctm_pageTtl.pageTtl_typeA .heading:after  { width: 50px; height: 50px; bottom: -30px; right: -60px; }
	.monogatari .ctm_pageTtl.pageTtl_typeB .heading:before { width: 50px; height: 50px; bottom: -30px; left: -70px; }
	.monogatari .ctm_pageTtl.pageTtl_typeB .heading:after  { width: 270px; height: 270px; top: -30px; right: -290px; }
	
}

@media all and (max-width: 739px){
	.monogatari .ctm_pageTtl .ttlLv1 h2 { font-size: 2.8rem; }
	.monogatari .ctm_pageTtl .ttlLv2 h3 { font-size: 2.2rem; }
}
@media all and (min-width: 740px){
	.monogatari .ctm_pageTtl .ttlLv2 h3 { font-size: 2.6rem; }
}

/* list */
.monogatari .txtList > li:before { background: #d7b250; }
.monogatari .txtList > li .txtList > li:before { background: #333; }

/* box */
.endBox { padding: 20px; margin-bottom: 20px; background: #fff; border: 2px solid #c00; }
@media all and (max-width: 739px){
	.endBox .fs3L { font-size: 2.0rem !important; }
}

/* slide */
#Train .trainListBlock .slick-list li,
#Hotel .hotelListBlock .slick-list li { position: relative; }
#Train .trainListBlock .slick-list li:after,
#Hotel .hotelListBlock .slick-list li:after { content: ""; position: absolute; bottom: 1px; left: 10px; font-size: 1.1rem; color: #fff; text-shadow: 1px 1px 8px rgba(0, 0, 0, 1.0); }

.slick-box .slidControl { bottom: 18px; padding: 7px 10px !important; }
@media all and (min-width: 740px){
	.slick-box .slidControl { bottom: 20px; padding: 7px 15px 8px 10px !important; }
}

/* .imgParts figcaption, */
.txtCaption { font-size: 1.2rem; }



/* Lead */
#Lead .heroimgWrap .mainTtl { font-size: 2.0rem; }
#Lead .heroimgWrap .mainLead { font-size: 1.6rem; color: #fff; }
@media all and (max-width: 739px){
	#Lead,#Lead h1 { letter-spacing: 0.05em; }
}
@media all and (min-width: 740px){
	#Lead .heroimgWrap .mainTtl { font-size: 3.0rem; }
	#Lead .heroimgWrap .mainLead { font-size: 1.8rem; }
}



/* Point */
#Point.ctm_contentsFull { background: linear-gradient(90deg, rgba(243, 239, 219, 0.5) 0%, rgba(243, 239, 219, 1.0) 100%); }

#Point .pageTtlBlock { position: relative; }
#Point .pageTtlBlock #logo_JPK60th { position: absolute; width: 108px; top: 0; right: 0; }
@media all and (min-width: 740px){
	#Point .pageTtlBlock #logo_JPK60th { width: 80px; top: 20px; }
}

#Point .pointListBlock .numList > li { font-size: 1.6rem; border-bottom: 1px solid #d7b250; }
#Point .pointListBlock .numList > li + li { margin-top: 1.75rem; }
#Point .pointListBlock .numList > li:before,
#Point .pointListBlock .numList > li:after { display: inline-block; position: absolute; white-space: nowrap; color: #b48e2b; }
#Point .pointListBlock .numList > li:before { content: ""counter(numList)"."; padding-right: 1.0rem; top: 1.0rem; left: 4.6rem; font-size: 3.4rem; width: 3.4rem; }
#Point .pointListBlock .numList > li:after { content: "point"; top: 0; left: 0; font-size: 1.6rem; width: 4.6rem; }
@media all and (max-width: 739px){
	#Point .pointListBlock .numList > li { padding: 0 0 1.5rem 8.2rem !important; }
}
@media all and (min-width: 740px){
	#Point .pointListBlock .numList > li { padding: 0 0 1.5rem 9.5rem !important; }
	#Point .pointListBlock .numList > li:before { left: 5.0rem; width: 4.0rem; }
	#Point .pointListBlock .numList > li:after { font-size: 1.8rem; width: 5.5rem; }
}

#Point .pointListBlock .numList strong { color: #8e6b0d; }



/* Navi */
#Navi.ctm_contentsFull { background: #fff; }

@media all and (max-width: 739px){
	#Navi .clm_1_2col.colWrap .col:nth-of-type(n+2) { margin-top: 0; }
	#Navi .clm_1_2col.colWrap .col:nth-of-type(n+2) .txtListBox { margin-top: 0.2em ; }
}

#Navi .txtList > li span { color: #b48e2b; }

#Navi .tabs_parent > li,
#Navi .tabs_parent > li > a { font-size: 1.8rem; font-weight: 500; color: #fff; background: #d7b250; }
#Navi .tabs_parent > li > a > span:after { background-image: url(/content/dam/sites/global/Y18/img/icon_arrow_btm_white_01.png); }



/* Train */
#Train.ctm_contentsFull { background: linear-gradient(90deg, rgba(243, 239, 219, 1.0) 0%, rgba(243, 239, 219, 0.5) 100%); }

#Train .trainListBlock { border: 1px solid #d7b250; border-radius: 20px; box-shadow: 5px 5px 25px 0 rgba(0, 0, 0, 0.1); background: #fff; background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/ssy/monogatari/img_sites/train_bg01.png); background-repeat: no-repeat; background-size: 900px; background-position: top center; }
#Train_03.trainListBlock { padding-bottom: 30px; }
#Train .trainListBlock .blockInr { padding: 20px 20px 30px; }
@media all and (min-width: 740px){
	#Train .trainListBlock { background-size: 1100px; }
	#Train .trainListBlock .blockInr { padding: 20px 30px 30px; }
}



#Train .trainListBlock .ctm_pageTtl .ttlLv2 { position: relative; margin: 30px 0 0; }
#Train .trainListBlock .ctm_pageTtl .ttlLv2 strong { font-weight: 900; }
#Train .trainListBlock .ctm_pageTtl .ttlLv2 sup { position: absolute; top: -3.0rem; left: -20px; padding: 0.1rem 1.0rem 0.3rem; color: #fff; background: #d7b250; }
#Train .trainListBlock .ctm_pageTtl .ttlLv2 sub { color: #b48e2b; vertical-align: 0.3rem; }
@media all and (min-width: 740px){
	#Train .trainListBlock .ctm_pageTtl .ttlLv2 sup { left: -30px; }
}

#Train .trainListBlock .ttlLv3 h4 { border-left: 3px solid #d7b250; }

#Train_01 strong { color: #2e51a5; }
#Train_02 strong { color: #349466; }
#Train_03 strong { color: #a82d3c; }

#Train_01 .slick-list li:nth-child(n+2):after { content: "外観（イメージ）"; }
#Train_02 .slick-list li:nth-child(2):after { content: "（イメージ）"; }
#Train_02 .slick-list li:nth-child(3):after { content: "車窓からの景色（イメージ）"; }
#Train_02 .slick-list li:nth-child(4):after { content: "お食事（イメージ）"; }
#Train_02 .slick-list li:nth-child(5):after { content: "おもてなし（イメージ）"; }
#Train_03 .slick-list li:nth-child(2):after { content: "（イメージ）"; }
#Train_03 .slick-list li:nth-child(3):after { content: "車窓からの景色（イメージ）"; }
#Train_03 .slick-list li:nth-child(4):after { content: "お食事（イメージ）"; color: #333; text-shadow: none; }
#Train_03 .slick-list li:nth-child(5):after { content: "おもてなし（イメージ）"; }

#Train .trainListBlock .guBox { padding: 30px 20px; background: #fee6f1; }
#Train .trainListBlock .guBox .ctm_pageTtl .ttlLv2 sup { top: -4.0rem; }
@media all and (min-width: 740px){
	#Train .trainListBlock .guBox { padding: 30px; }
}



/* Schedule */
#Schedule.ctm_contentsFull { background: #fff; }

#Schedule .scheduleWrap { max-height: 500px; overflow-y: scroll; }

#Schedule .scheduleListBlock { padding: 20px 30px 30px; border-radius: 20px;
background: linear-gradient(90deg, rgba(243, 239, 219, 0.6) 0%, rgba(243, 239, 219, 0.6) 25%, rgba(243, 239, 219, 1.0) 100%); box-shadow: 5px 5px 25px 0 rgba(0, 0, 0, 0.1); }

#Schedule .scheduleListBlock .ctm_pageTtl .ttlLv2 { margin-top: 0; }
#Schedule .scheduleListBlock .ctm_pageTtl h3 { position: relative; display: inline-block; padding: 0 100px; font-size: 4.2rem; }
#Schedule .scheduleListBlock .ctm_pageTtl h3:before,
#Schedule .scheduleListBlock .ctm_pageTtl h3:after { content: ''; position: absolute; display: inline-block; top: 50%;
width: 80px; height: 14px; border-top: double 6px #d7b250; border-bottom: double 6px #d7b250; }
#Schedule .scheduleListBlock .ctm_pageTtl h3:before { left:  0; }
#Schedule .scheduleListBlock .ctm_pageTtl h3:after  { right: 0; }
#Schedule .scheduleListBlock .ctm_pageTtl h3 sup { font-size: 2.2rem; color: #d7b250; vertical-align: 0; }
@media all and (min-width: 740px){
	#Schedule .scheduleListBlock .ctm_pageTtl h3 { padding: 0 140px; font-size: 4.6rem; }
	#Schedule .scheduleListBlock .ctm_pageTtl h3:before,
	#Schedule .scheduleListBlock .ctm_pageTtl h3:after { width: 120px; }
	#Schedule .scheduleListBlock .ctm_pageTtl h3 sup { font-size: 2.4rem; }
}

#Schedule .scheduleBox { margin-left: 2.0rem; padding-left: 2.0rem; border-left: 1px solid #d7b250; }
 
#Schedule .scheduleBox dl { margin-left: -3.5rem; }
#Schedule .scheduleBox dt { float: left; margin-top: -0.75rem; padding-top: 0.5rem; background: #f8f5e9; }
#Schedule .scheduleBox dt .material-symbols-outlined { color: #d7b250; font-size: 2.8rem; }
#Schedule .scheduleBox dd { margin-bottom: 2.5rem; padding-left: 4.0rem; }



/* Hotel */
#Hotel.ctm_contentsFull { background: linear-gradient(90deg, rgba(243, 239, 219, 1.0) 0%, rgba(243, 239, 219, 0.5) 100%); }

#Hotel .hotelListBlock { padding: 20px; border: 1px solid #d7b250; background: #fff; box-shadow: 5px 5px 25px 0 rgba(0, 0, 0, 0.1); }
@media all and (min-width: 740px){
	#Hotel .hotelListBlock { padding: 30px; }
}

#Hotel .hotelListBlock .titleBox { text-align: center; }

#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 { margin: 0; padding-bottom: 15px }
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 h3 { font-size: 2.0rem; }
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 strong,
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 sup,
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 sub { padding: 0.1rem 1.0rem 0.3rem; }
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 strong { color: #b48e2b; border: 1px solid; border-image: linear-gradient(to right, #d7b250, #b48e2b) 1; }
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 sup { color: #fff; background: #d7b250; vertical-align: 2.0rem; }
#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 sub { color: #fff; background: #b48e2b; vertical-align: -1.5rem; }

#Hotel .hotelListBlock .titleBox .btnSrg { border-top: double 3px #d7b250; border-bottom: double 3px #d7b250; background: linear-gradient(180deg, rgba(199, 236, 254, 0.8) 0%, rgba(199, 236, 254, 0.0) 40%); }
#Hotel .hotelListBlock .titleBox .btnSrg .btn { background-color: transparent; border: none; }
@media all and (min-width: 740px){
	#Hotel .hotelListBlock .titleBox .btnSrg .btn { font-size: 2.2rem; }
}

#Hotel .hotelListBlock .ttlLv4 { padding: 10px 20px 0 0; }
#Hotel .hotelListBlock .ttlLv4 h5 { color: #d7b250; text-align: center; border-right: 3px solid #d7b250; border-bottom: 3px solid #d7b250; }
@media all and (max-width: 739px){
	#Hotel .hotelListBlock .ttlLv4 h5 { padding: 0 0.4em; }
}

#Hotel_01 .slick-list li:nth-child(2):after { content: "お部屋（一例）"; }
#Hotel_01 .slick-list li:nth-child(3):after { content: "会席料理（一例）"; }
#Hotel_01 .slick-list li:nth-child(4):after { content: "大浴場"; }
#Hotel_02 .slick-list li:nth-child(2):after { content: "お部屋（一例）"; }
#Hotel_02 .slick-list li:nth-child(3):after { content: "懐石料理（一例）"; }
#Hotel_02 .slick-list li:nth-child(4):after { content: "客室露天風呂（一例）"; }
#Hotel_03 .slick-list li:nth-child(2):after { content: "お部屋（一例）"; }
#Hotel_03 .slick-list li:nth-child(3):after { content: "懐石料理（一例）"; }
#Hotel_03 .slick-list li:nth-child(4):after { content: "客室露天風呂（一例）"; }
#Hotel_03 .slick-list li:nth-child(5):after { content: "客室露天風呂（一例）"; }
#Hotel_03 .slick-list li:nth-child(6):after { content: "外観（一例）"; }
#Hotel_04 .slick-list li:nth-child(2):after { content: "外観"; }
#Hotel_04 .slick-list li:nth-child(3):after { content: "会席料理（一例）"; }
#Hotel_04 .slick-list li:nth-child(4):after { content: "客室露天風呂"; }
#Hotel_04 .slick-list li:nth-child(5):after { content: "お部屋（一例）"; }



/* Price */
#Price.ctm_contentsFull { background: #fff; }



/* Apply */
#Apply.ctm_contentsFull { background: #fff; }

#Apply .cmp_contactBlock .data { display: none; }



@media all and (max-width: 739px){
	.monogatari .js-eqHeightCols .js-eqHeightCols-item,
	.monogatari .js-eqHeightCols .js-eqHeightCols-item-2,
	.monogatari .js-eqHeightCols .js-eqHeightCols-item-3,
	.monogatari .js-eqHeightCols .js-eqHeightCols-item-4 { height: auto!important; }
}

@media all and (max-width: 739px){
}
@media all and (min-width: 740px){
}