@charset "utf-8";

/* コンテンツ幅 フル */
.contentsInr { width: auto; padding: 0px; }

.kyoto-ocha .ctm_contentsFull { margin-top: 0; }
@media all and (max-width: 739px){
	.kyoto-ocha .ctm_contentsFull { padding: 30px 0; }
}
@media all and (min-width: 740px){
	.kyoto-ocha .ctm_contentsFull { margin-top: 0; }
}

/* コンテンツ幅 950px */
.contentsInr .contentsUnit,
.contentsInr .module { padding: 0 10px; margin: 0 auto; }

@media all and (min-width: 740px){
	.contentsInr .contentsUnit,
	.contentsInr .module { width: 950px !important; padding: 0px; margin: 0 auto; }
	.contentsInr .module { float: none !important; }
}

/* font */
#Story .ctm_pageTtl .ttlLv2 h3,
#Story .ctm_pageTtl .ttlLv3 h4,
#Spot  .ctm_pageTtl .ttlLv2 h3,
#Spot  .ctm_pageTtl .ttlLv3 h4,
.kyoto-ocha .ctm_pageTtl .ttlLv1 h2 sub { font-family: "Kiwi Maru", serif; font-weight: 400; font-style: normal; }

/* icon */
.kyoto-ocha .material-symbols-outlined { font-variation-settings: 'wght' 300; vertical-align: middle; }

/* iconTxt */
.kyoto-ocha [class^="ctm_iconTxt_br"] { display: inline-block; padding: 3px 1.0rem 1px; color: #fff; border-radius: 4px; letter-spacing: 0.1rem; }

.kyoto-ocha .txtLimited { position: absolute; transform: rotate(-12deg); padding: 0.2em 0.5em 0.1em 0.5em; font-weight: bold; color: #16b2e3; background: #fff; border: 2px solid #16b2e3; }

/* list */
.fsS li { font-size: 1.4rem; }
.fsL li { font-size: 1.8rem; }
@media all and (min-width: 740px){
	.fsS li { font-size: 1.2rem; }
	.fsL li { font-size: 1.6rem; }
}

/* ctm_pageTtl */
.kyoto-ocha .ctm_pageTtl .ttlLv1 { position: relative; margin: 80px 0 40px 0; padding: 5px 0; }
.kyoto-ocha .ctm_pageTtl .ttlLv1:after { content: ""; position: absolute; display: inline-block; 
width: 70%; height: 100px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/heading_bg01.png?v=2) no-repeat; background-size: 100%; top: -55px; left: 0; right: 0; margin: 0 auto; }
.kyoto-ocha .ctm_pageTtl .ttlLv1 h2 { position: relative; font-weight: normal; }
.kyoto-ocha .ctm_pageTtl .ttlLv1 h2 sub { position: absolute; display: block; color: #56a460; letter-spacing: 0.2rem; font-size: 1.8rem; top: -70px; left: 0; right: 0; margin: 0 auto; }
@media all and (min-width: 740px){
	.kyoto-ocha .ctm_pageTtl .ttlLv1:after { width: 25%; }
}


@media all and (max-width: 739px){
	.kyoto-ocha .ctm_pageTtl .ttlLv1 h2 { font-size: 2.8rem; }
	.kyoto-ocha .ctm_pageTtl .ttlLv2 h3 { font-size: 2.6rem; }
	.kyoto-ocha .ctm_pageTtl .ttlLv3 h4 { font-size: 2.2rem; }
}

@media all and (min-width: 740px){
	.kyoto-ocha .ctm_pageTtl .ttlLv2 h3 { font-size: 3.6rem; }
	.kyoto-ocha .ctm_pageTtl .ttlLv3 h4 { font-size: 2.2rem; }
}

/* caption */
.kyoto-ocha .imgParts figcaption,
.kyoto-ocha .txtCaption { font-size: 1.2rem; }

/* Button type horizon
.kyoto-ocha .ctm_btnList_horizon .btnBox { display: block; width: 100%; height: 100%; }
.kyoto-ocha .ctm_btnList_horizon .col > div { height: 100%; }
.kyoto-ocha .ctm_btnList_horizon .col .btn { display: table; width: 100%; height: 100%; padding-top: 10px; padding-bottom: 10px; margin-top: 0px; }
.kyoto-ocha .ctm_btnList_horizon .col .btnInr { display: table-cell; vertical-align: middle; width: 100%; height: 100%; }
*/

/* anchorList */
@media all and (max-width: 739px){
	.kyoto-ocha .anchorList .btn { margin-top: 0; }
}



/* Lead */
#Lead.ctm_contentsFull { padding: 20px 0; color: #fff; background: #c0b532; }

#Lead .ctm_pageTtl .ttlLv4 { margin: 0; }
#Lead .ctm_pageTtl .ttlLv4 h5 { font-size: 1.6rem; }



/* Navi */
#Navi.ctm_contentsFull { background: #fff; }

@media all and (max-width: 739px){
	#Navi .ctm_btnList_horizon .col .btn { margin-top: 0; width: 80vw; }
}



/* Coupon */
#Coupon.ctm_contentsFull { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/contents_bg01.jpg?v=1); background-size: 100%; }

/* @media all and (min-width: 740px){
	#Coupon .clm_1_2col.colWrap .col:nth-of-type(n+2) { border-left: 1px solid #333; padding-left: 20px; }
} */

.ctm_pageTtl.hc02.coupon__block--ttl .ttlLv3 .heading span { font-size: 150%; color: #D64330; }

.ctm_pageTtl.hc03 { color: #fff; background-color: #56a460; }
.ctm_pageTtl.hc03 .ttlLv2 h3 { font-size: 2.0rem; font-weight: normal; }
@media all and (min-width: 740px){
	.ctm_pageTtl.hc03 .ttlLv2 h3 { font-size: 3.0rem; }
}

.hc03_txt01 { font-size: 120%; }

.hc03_txt02 { font-size: 60%; display: block; }

.coupon__block--r { border-left: 2px solid #fff; padding-left: 30px; padding-bottom: 10px; }

.coupon__block--ttl .ttlLv3 { margin-top: 0; margin-bottom: 0; }

.couponArea_detail .colWrap.clm_1_2col { align-items: center; }

.couponArea_detail .colWrap.clm_1_2col .col:nth-child(1) { width: 54%; }
.couponArea_detail .colWrap.clm_1_2col .col:nth-child(2) { width: 42%; }

@media screen and (max-width:960px) {
	.coupon__block--r { padding-left: 0px; padding-bottom: 0px; border-left: none; }
	.couponArea_detail .colWrap.clm_1_2col .col:nth-child(1) { width: 100%; }
	.couponArea_detail .colWrap.clm_1_2col .col:nth-child(2) { width: 100%; }
}



/* Story */
#Story.ctm_contentsFull { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/contents_bg02.jpg?v=3); background-size: 75%; color: #fff; }

/*#Story .contentsUnit { position: relative; }
#Story .contentsUnit:after { content: ""; position: absolute; display: inline-block; width: 75%; height: 200px;
background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/story_bg01_pc.png?v=1) no-repeat; background-size: 100%; top: 120px; left: 0; right: 0; margin: 0 auto; z-index: 1; }
*/

#Story .contentsUnit { width: 100%; height: auto; background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/story_bg01_sp.png?v=1); background-size: contain; background-repeat: no-repeat; background-position: top; }
@media all and (min-width: 740px){
	#Story .contentsUnit { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/story_bg01_pc.png?v=1); background-repeat: no-repeat; background-position: center; }	
}

@media all and (max-width: 739px){
	#Story .ctm_pageTtl .ttlLv1 { margin-bottom: 30px; }
}

#Story .ctm_pageTtl .ttlLv1 h2 sub { color: #fff; }

#Story .ttlLv4 h5 { font-size: 1.8rem; font-weight: normal; text-align: center; line-height: 1.5; }



/* Map */
#Map.ctm_contentsFull { background: #fff; }

@media all and (max-width: 739px){
	#Map .mapBlock .map_btn { display: none; }
}
@media all and (min-width: 740px){
	#Map .mapBlock { position: relative; width: 950px; height: 770px; }

	#Map .mapBlock .map_btn { position: absolute; }
	#Map .mapBlock #map_btn_spot01_01 { top: calc(  168px / 2 ); left: calc(  772px / 2 ); width: calc(  604px / 2 ); }
	#Map .mapBlock #map_btn_spot01_03 { top: calc( 1232px / 2 ); left: calc(  838px / 2 ); width: calc(  394px / 2 ); }
	#Map .mapBlock #map_btn_spot01_05 { top: calc(  672px / 2 ); left: calc( 1110px / 2 ); width: calc(  710px / 2 ); }
	#Map .mapBlock #map_btn_spot03_01 { top: calc(  350px / 2 ); left: calc(  124px / 2 ); width: calc(  546px / 2 ); }
	#Map .mapBlock #map_btn_spot03_02 { top: calc(  844px / 2 ); left: calc(  254px / 2 ); width: calc(  458px / 2 ); }
	#Map .mapBlock #map_btn_spot04_01 { top: calc( 1012px / 2 ); left: calc(   18px / 2 ); width: calc(  422px / 2 ); }
}



/* Spot */
#Spot.ctm_contentsFull { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/contents_bg01.jpg?v=5); background-size: 100%; }

#Spot .spotListBlock { position: relative; border-radius: 25px; box-shadow: 10px 10px 20px 0 rgba(0, 0, 0, 0.05); }

#Spot .spotListBlock .headingWrap { padding: 30px; border-radius: 25px 25px 0 0; }

#Spot_01.spotListBlock .headingWrap { background: #56a460; }
#Spot_02.spotListBlock .headingWrap { background: #ec778e; }
#Spot_03.spotListBlock .headingWrap { background: #a45b7e; }
#Spot_04.spotListBlock .headingWrap { background: #427bb0; }

#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col { color: #fff; }
#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(1) { position: relative; }
#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(1):after { content: ""; position: absolute; display: inline-block; width: 115%; height: 100px; background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/spot_bg01_sp.png?v=3) no-repeat; background-size: 100%; }

@media all and (max-width: 739px){
	#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(1):after { top: -33px; left: -35px; }
}
@media all and (min-width: 740px){
	#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(1) { width: calc(40% - 15px); }
	#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(2) { width: calc(60% - 15px); 
	border-left: 1px solid #fff; padding-left: 20px; }
	#Spot .spotListBlock .headingWrap .clm_1_2col.colWrap .col:nth-of-type(1):after { background: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/spot_bg01_pc.png?v=2) no-repeat; 
	background-size: 100%; width: 110%; bottom: -78px; left: -40px; }
}

#Spot .spotListBlock .headingWrap .ctm_pageTtl .ttlLv2 { margin: 0; color: #fff; }

#Spot .spotListBlock .listWrap { padding: 30px; border-radius: 0 0 25px 25px; background: #fff; }

@media all and (max-width: 739px){
	#Spot .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2),
	#Spot .listWrap .clm_1_2col.colWrap .col:nth-of-type(n+2) { margin-top: 20px; padding-top: 20px; }
	#Spot_01 .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2),
	#Spot_01 .listWrap .clm_1_2col.colWrap .col { border-top: 2px dotted #56a460; padding-top: 20px; }
	#Spot_02 .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2) { border-top: 2px dotted #ec778e; }
	#Spot_03 .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2) { border-top: 2px dotted #a45b7e; }
	#Spot_04 .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2) { border-top: 2px dotted #427bb0; }
	#Spot_05 .listWrap .clm_1_3col.colWrap .col:nth-of-type(n+2),
	#Spot_05-02 .clm_1_3col.colWrap .col { border-top: 2px dotted #a788c7; padding-top: 20px; }
	#Spot_05 .mgtXL { margin-top: 20px !important; }
}

@media all and (min-width: 740px){
	#Spot .spotListBlock .listWrap .clm_1_3col.colWrap { justify-content: space-between; }
	#Spot .spotListBlock .listWrap .clm_1_3col.colWrap .col { margin: 0; width: 31%; }
	#Spot_01 .listWrap .clm_1_2col.colWrap { justify-content: space-between; }
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(1) { width: 31%; }
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(2) { width: 65.5%; }
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(2) .clm_1_2col_02 { display: flex; justify-content: space-between; }
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(2) .clm_1_2col_02:before,
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(2) .clm_1_2col_02:after { content: none; }
	#Spot_01 .listWrap .clm_1_2col.colWrap .col:nth-of-type(2) .clm_1_2col_02 > .responsivegrid { width: 47.33%; }
}

#Spot .spotListBlock .listWrap img { border-radius: 20px; }

#Spot .spotListBlock .listWrap .txtCaption { position: relative; }
#Spot .spotListBlock .listWrap .txtCaption p { position: absolute; top: 5px; right: 0;}

#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { margin: 30px 0 5px; }
@media all and (min-width: 740px){
	#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { margin: 30px 0 10px; }
}

#Spot_01.spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { color: #56a460; }
#Spot_02.spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { color: #ec778e; }
#Spot_03.spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { color: #a45b7e; }
#Spot_04.spotListBlock .listWrap .ctm_pageTtl .ttlLv3 { color: #427bb0; }

#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 sub { position: relative; display: inline-block; padding: 0 40px; }

#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 sub:before,
#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 sub:after { content: ''; position: absolute; display: inline-block; top: 50%;
width: 30px; height: 2px; background: #e0d65c; }
#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 sub:before { left: 0; }
#Spot .spotListBlock .listWrap .ctm_pageTtl .ttlLv3 sub:after { right: 0; }



/* Link */
#Link.ctm_contentsFull { background: #fff; }

@media all and (max-width: 739px){
	#Link .linkListBlock { margin: 0 auto; width: 90%; }
	#Link .linkListBlock .clm_1_3col.colWrap .col:nth-of-type(n+2),
	#Link .linkListBlock .clm_1_2col.colWrap .col:nth-of-type(n+2) { margin-top: 24px; }
}

@media all and (min-width: 740px){
	#Link .linkListBlock .clm_1_2col.colWrap { width: 630px; margin: 0 auto; }
	#Link .linkListBlock .clm_1_2col.colWrap .col { width: 300px; }
}

#Link .linkListBlock img { border-radius: 20px; }



/* Note */
#Note.ctm_contentsFull { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/contents_bg02.jpg?v=5); background-size: 75%; }

#Note .noteListBlock { padding: 20px; background: #fff; border: 2px solid #c00;	border-radius: 25px; }
@media all and (min-width: 740px){
	#Note .noteListBlock { padding: 20px 30px; }
}


/* Promotion */
#Promotion.ctm_contentsFull { background: #fff; }

#Promotion .logoListBlock { padding: 0 10px 20px; border: 2px solid #333; }
#Promotion .logoListBlock .ctm_pageTtl .ttlLv3 { margin-bottom: 0; }
#Promotion .logoListBlock .ctm_pageTtl .ttlLv3 h4 { padding: 0; }
#Promotion .logoListBlock .logoWrap .img { text-align: center; }

@media all and (max-width: 739px){
	#Promotion .logoListBlock .logoWrap .img { margin: 0; width: 100%; }
	#Promotion .logoListBlock .ctm_pageTtl .ttlLv3 h4 { font-size: 1.8rem; }
}

@media all and (min-width: 740px){
	#Promotion .logoListBlock { padding: 0 20px 20px; }
	#Promotion .logoListBlock .logoWrap img { width: 75%; }
}



/* Hotel */
#Hotel.ctm_contentsFull { background: #fff; }

#Hotel .ctm_pageTtl .ttlLv2 h3 { font-size: 2.4rem; }

#Hotel .hotelListBlock .col { background-image: linear-gradient(180deg, rgba(252, 215, 222, 1), rgba(255, 255, 255, 1) 15%); }

#Hotel .hotelListBlock .ctm_pageTtl .ttlLv2 { margin: 20px 0 20px; }

#Hotel .hotelListBlock .hotelImgWrap { display: flex; }

/*
#Hotel .ctm_bdrColumn .ctm_pageTtl .ttlLv3 { margin: 10px 0 0; color: #e9727a; border-bottom: 1px solid #e9727a; }
#Hotel .ctm_bdrColumn .ctm_pageTtl .ttlLv3 h4 { font-size: 2.0rem; }
*/

#Hotel .hotelWelcomeBlock { padding: 30px; background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/kyoto-ocha/img_sites/contents_bg01.jpg?v=1); background-size: 75%; border-radius: 25px; }

#Hotel .hotelWelcomeBlock .img { text-align: center; }

@media all and (max-width: 739px){
	#Hotel .hotelWelcomeBlock .clm_1_2col.colWrap .col:nth-of-type(1) img { width: 70%; }
}
@media all and (min-width: 740px){
	#Hotel .hotelWelcomeBlock .clm_1_2col.colWrap .col:nth-of-type(1) { width: calc(25% - 15px); }
	#Hotel .hotelWelcomeBlock .clm_1_2col.colWrap .col:nth-of-type(2) { width: calc(75% - 15px); }
}

#Hotel .hotelWelcomeBlock .ctm_pageTtl .ttlLv2 { margin-top: 40px; padding: 6px; color: #eea853; background: #fff; }
#Hotel .hotelWelcomeBlock .ctm_pageTtl .ttlLv2 h3 { position: relative; display: block; padding: 10px 0; 
font-size: 2.2rem; border-top: 2px solid #eea853; border-bottom: 2px solid #eea853; }
#Hotel .hotelWelcomeBlock .ctm_pageTtl .ttlLv2 h3 sup { position: absolute; display: inline-block; top: -45px; left: 0; right: 0; margin: auto; font-size: 1.8rem; vertical-align: middle; color: #fff; }
#Hotel .hotelWelcomeBlock .ctm_pageTtl .ttlLv2 h3 strong { color: #333; }

#Hotel .hotelWelcomeBlock .text p { color: #fff; }



@media all and (max-width: 739px){
	.kyoto-ocha .js-eqHeightCols .js-eqHeightCols-item,
	.kyoto-ocha .js-eqHeightCols .js-eqHeightCols-item-2,
	.kyoto-ocha .js-eqHeightCols .js-eqHeightCols-item-3,
	.kyoto-ocha .js-eqHeightCols .js-eqHeightCols-item-4 { height: auto!important; }
}

@media all and (max-width: 739px){
}
@media all and (min-width: 740px){
}