@charset "utf-8";

.chapterTtl p {
	display: flex;
}

/* ==============================
js-tab
============================== */
.js-tab {max-width: 1000px;margin: 80px auto 100px;display: flex;}
.js-tab .tab-btn__item {width: 50%;cursor: pointer;background: #fff;text-align: center;padding: 15px 0;}
.js-tab .tab-btn__item.is-current{background: #2d2d2d;color: #fff;}
.tab_contents {/*display: none;*/visibility: hidden;height: 0;}
.tab_contents.show {/*display: block;*/visibility: visible;height: auto;}
/* */
@media screen and (max-width: 960px){
	.js-tab {padding: 0 20px;margin: 40px auto 60px;}
	.js-tab .tab-btn__item {font-size: 12px;}
}



/* ==============================
leadTtl_middle
============================== */
.leadWrap .leadTtl_middle {
	font-size: 30px;letter-spacing: 0.1em;text-align: center;
}
/* */
@media screen and (max-width: 960px){
	.leadWrap .leadTtl_middle {font-size: 20px;letter-spacing: inherit;}
}



/* ==============================
lifestyle_head 
============================== */
.lifestyle_head {}
/*.lifestyle_head .leadWrap {padding-top: 70px;}*/
.lifestyle_head .decoLine {height: 100px;position: relative;margin-bottom: 70px;}
.lifestyle_head .decoLine:before {content: '';position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 1px;height: 100%;background: #969696;}
.lifestyle_head .chapterTtl p span {
	display: inline-block;
  white-space: pre;
}
/* */
@media screen and (max-width: 960px){
	/*.lifestyle_head .leadWrap {padding-top: 0;}*/
	.lifestyle_head .decoLine {height: 60px;margin-bottom: 60px;}
	.lifestyle_head .leadTxt {text-align: center;margin-top: 30px;}
}



.lifestyle_secTtl {
	font-size: clamp(20px, 1.8vw, 30px);
}
.contentsfullWrap {
	max-width: 1820px;width: 100%;margin: 0 auto;padding: 0 100px;
}
.contentsfull {flex-flow: row; align-items: center;}
.contentsfull .text {flex: 1;}
.contentsfull .photo {margin-right: calc(50% - 49.7vw);display: flex;flex-direction: row;position: relative;}
.contentsfull .photo .chapterTtl {position: relative;padding-left: 0;margin-right: 20px;}
.photo .chapterTtl {padding-left: 20px;}
/* */
@media screen and (max-width: 960px){
	.contentsfullWrap {padding: 0 20px;}
	.contentsfull {flex-flow: column;}
	.contentsfull .text {width: 100%;}
	.contentsfull .photo .chapterTtl {margin-right: 10px;}
	.photo .chapterTtl {padding-left: 10px;}
}










/* ==============================
lifestyle_map 
============================== */
.lifestyle_map {margin-top: 80px;}
.lifestyle_map figure {width: fit-content; margin: 0 auto;}
/* */
@media screen and (max-width: 960px){
	.lifestyle_map {margin-top: 50px;}
}



/* ========================================
kyoto 
======================================== */
#kyoto {}
.photoNameWrap {position: relative;z-index: 2;}
.photoName {width: fit-content;margin: 0 auto;padding: 110px 40px;position: relative;}
.photoName:before {content: '';position: absolute;bottom: 0;left: 0;width: 1px;height: 80%;background: #969696;}
.photoName:after {content: '';position: absolute;top: 0;right: 0;width: 1px;height: 80%;background: #969696;}
.photoName h3 {
	display:flex;
	font-size: clamp(21px, 2.2vw, 40px);
}
.photoName span {
	display: inline-block;
  white-space: pre;
	-webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
  -ms-text-orientation: upright;
  text-orientation: upright;
}
.photoName small {display: block;text-align: right;}
/* */
@media screen and (max-width: 960px){
	.photoName {padding: 60px 30px;}
}



/* GionFestival 
------------------------------ */
.GionFestival {margin-top: 160px;}
.GionFestival .text {display: flex;flex-direction: row-reverse;}
.GionFestival .photo {width: 64.7vw;margin-left: 60px;}
.GionFestival .photo01 .chapterTtl {position: relative;padding-left: 0;margin-right: 20px;}
/* */
@media screen and (max-width: 960px){
	.GionFestival {margin-top: 60px;}
	.GionFestival .contentsfull {flex-flow: column-reverse;}
	.GionFestival .text {flex-direction: row;margin-top: 60px;}
	.GionFestival .photo {width: 95vw;margin-left: auto;margin-right: -20px;}
	.GionFestival .photo01 .chapterTtl {margin-right: 10px;}
}



/* YasakaShrine 
------------------------------ */
.YasakaShrine {margin-top: 160px;}
.YasakaShrine .photo01 {width: 48.2%;flex-flow: row-reverse;margin-top: 0;margin-bottom: auto;}
.YasakaShrine .photo01 .chapterTtl {position: relative;padding-left: 20px;}
.YasakaShrine .photo02 {width: 37.1%;padding-top: 350px;margin-left: 5vw;position: relative;}
.YasakaShrine .photo02 .photoNameWrap {position: absolute;top: 0;left: 0;margin-left: 100px;}
/* */
@media screen and (max-width: 960px){
	.YasakaShrine {margin-top: 60px;}
	.YasakaShrine .photo01 {width: 90%;}
	.YasakaShrine .photo01 .chapterTtl {padding-left: 10px;}
	.YasakaShrine .photo02 {width: 90%;padding-top: 230px;margin-left: auto;margin-top: 30px;}
	.YasakaShrine .photo02 .photoNameWrap {margin-left: 50px;}
}



.bg_texture2 {
	background: #19293d url("../../common/img/page/lifestyle/bg_texture2-1.png")center;
  background-size: cover;
	/*background-attachment: fixed;*/
  padding: 130px 0;
	margin: 160px 0;
}
.bg_texture2.pat02 {background: #19293d url("../../common/img/page/lifestyle/bg_texture2-2.png")center;}
.bg_texture2 * {color: #fff;}
/* */
@media screen and (max-width: 960px){
	.bg_texture2 {
		padding: 40px 0;
		margin: 60px 0;
	}
}



/* Nijo-jo 
------------------------------ */
.Nijo-jo {}
.Nijo-jo .box01 {flex-direction: row-reverse;align-items: center;margin-top: 50px;}
.Nijo-jo .box01 .photo {width: 64.7vw;margin-right: 0;margin-left: calc(50% - 49.7vw);flex-direction: row-reverse;}
.Nijo-jo .box01 .chapterTtl {margin-right: 0;padding-left: 20px;}
.Nijo-jo .box02 {align-items: center;margin-top: -50px;}
.Nijo-jo .box02 .text {width: fit-content;margin: 0 auto;}
.Nijo-jo .box02 .photo {width: 37.1%;margin-left: 5vw;}
/* */
@media screen and (max-width: 960px){
	.Nijo-jo .box01 {flex-direction: row;margin-top: 0;}
	.Nijo-jo .box01 .photo {margin-top: -20px;width: 95vw;margin-right: auto;margin-left: -20px;}
	.Nijo-jo .box01 .chapterTtl {padding-left: 10px;}
	.Nijo-jo .box02 {margin-top: 0;}
	.Nijo-jo .box02 .text {width: 100%;margin: 60px 0;}
	.Nijo-jo .box02 .photo {width: 100%;margin-left: 0;}
}



/* Kamogawa 
------------------------------ */
.Kamogawa {}
.Kamogawa .contentsfull {align-items: start;}
.Kamogawa .contentsfull .text {max-width: 600px;width: 100%;margin: 0 auto;}
.Kamogawa .contentsfull .photoNameWrap {margin-top: 100px;margin-bottom: -30px;}
.Kamogawa .contentsfull .photoName {padding: 70px 40px;}
.Kamogawa .contentsfull .photo {width: 52%;margin-left: 60px;}
/* */
@media screen and (max-width: 960px){
	.Kamogawa .lifestyle_secTtl {padding-left: 20px;}
	.Kamogawa .contentsfull .photoNameWrap {margin-top: 30px;}
	.Kamogawa .contentsfull .photoName {padding: 60px 30px;}
	.Kamogawa .contentsfull .photo {width: 95vw;margin-left: auto;margin-right: -20px;margin-top: 60px;}
}



/* Kiyomizudera 
------------------------------ */
.Kiyomizudera .box01 {align-items: center;}
.Kiyomizudera .box01 .text {width: 30%;}
.Kiyomizudera .box01 .photo {width: 70%;display: flex;flex-direction: row-reverse;}
.Kiyomizudera .box01 .chapterTtl {position: relative;}
.Kiyomizudera .box02 {flex-direction: row-reverse;align-items: center;margin-top: 90px;}
.Kiyomizudera .box02 .text {width: fit-content;margin: 0 auto;}
.Kiyomizudera .box02 .photo {width: 39.6%;display: flex;flex-direction: row-reverse;margin-right: 5vw;}
.Kiyomizudera .box02 .chapterTtl {position: relative;}
/* */
@media screen and (max-width: 960px){
	.Kiyomizudera .box01 .text {width: 100%;}
	.Kiyomizudera .box01 .photo {width: 95vw;margin-left: -20px;margin-right: auto;}
	.Kiyomizudera .box02 {margin-top: 60px;}
	.Kiyomizudera .box02 .text {width: 100%;}
	.Kiyomizudera .box02 .photo {width: 85vw;margin-left: -20px;margin-right: auto;margin-top: 60px;}
}



/* Ginkakuji 
------------------------------ */
.Ginkakuji {}
.Ginkakuji .box01 {align-items: center;}
.Ginkakuji .box01 .text {width: fit-content;margin: 0 auto;}
.Ginkakuji .box01 .photo {width: 39.6%;margin-left: 5vw;}
.Ginkakuji .box02 {align-items: center;flex-direction: row-reverse;margin-top: 90px;}
.Ginkakuji .box02 .text {width: 30%;}
.Ginkakuji .box02 .photo {width: 70%;display: flex;flex-direction: row-reverse;}
.Ginkakuji .box02 .chapterTtl {position: relative;}
/* */
@media screen and (max-width: 960px){
	.Ginkakuji .lifestyle_secTtl {padding-left: 20px;}
	.Ginkakuji .box01 .photo {width: 90%; margin: 60px -20px 0 auto;}
	.Ginkakuji .box02 {flex-direction: column; margin-top: 30px;}
	.Ginkakuji .box02 .photo {width: 95vw;margin-left: -20px;margin-right: auto;margin-top: -20px;}
}



/* Kinkakuji 
------------------------------ */
.Kinkakuji {align-items: center;}
.Kinkakuji .text {}
.Kinkakuji .photo {width: 70%;flex-direction: row;position: relative;}
.Kinkakuji .chapterTtl {position: relative;}
/* */
@media screen and (max-width: 960px){
	.Kinkakuji .photo {width: 95vw;margin-right: -20px;margin-left: auto;}
}



/* Daitokuji 
------------------------------ */
.Daitokuji {margin-top: 90px;align-items: center;}
.Daitokuji .flex {flex-direction: row-reverse;}
.Daitokuji .text {}
.Daitokuji .textInner {width: fit-content;margin: 0 auto;}
.Daitokuji .photo {width: 52.1vw;margin-right: 5vw;margin-left: calc(50% - 49.7vw);flex-direction: row-reverse;}
.Daitokuji .photo .chapterTtl {position: relative;padding-left: 20px;margin-right: 0;}
/* */
@media screen and (max-width: 960px){
	.Daitokuji {margin-top: 60px;}
	.Daitokuji .flex {flex-direction: column;}
	.Daitokuji .photo {width: 85vw;margin-left: -20px;margin-right: auto;margin-top: 60px;}
	.Daitokuji .photo .chapterTtl {padding-left: 10px;}
}



/* Arashiyama 
------------------------------ */
.Arashiyama {}
.Arashiyama .box01 {align-items: center;}
.Arashiyama .box01 .text {}
.Arashiyama .box01 .photo {width: 80.3%;flex-direction: row;position: relative;}
.Arashiyama .box01 .chapterTtl {position: relative;}
.Arashiyama .box02 {align-items: start;flex-direction: row-reverse;margin-top: 150px;}
.Arashiyama .box02 .text {flex: 2;}
.Arashiyama .box02 .textInner {max-width: 780px;margin: 0 auto;padding-left: 5vw;}
.Arashiyama .box02 .text .lifestyle_secTtl {margin-bottom: 100px;}
.Arashiyama .box02 .photo {flex: 1.03;margin-right: 0;margin-left: calc(50% - 49.7vw);}
/* */
@media screen and (max-width: 960px){
	.Arashiyama .box01 .photo {width: 95vw;margin-right: -20px;margin-left: auto;margin-top: 30px;}
	.Arashiyama .box02 {flex-direction: column;margin-top: 60px;}
	.Arashiyama .box02 .textInner {padding-left: 0;}
	.Arashiyama .box02 .text .lifestyle_secTtl {margin-bottom: 60px;}
	.Arashiyama .box02 .photo {width: 80%;}
	.Arashiyama .box02 .arashiyama_03 {width: 80%;margin: 60px -20px 0 auto;}
}










/* ========================================
city 
======================================== */
#city {}



/* shijohorikawa 
------------------------------ */
.Shijohorikawa {margin-top: 160px;}
.Shijohorikawa .item {width: 50%;}
/* */
@media screen and (max-width: 960px){
	.Shijohorikawa {margin-top: 60px;}
	.Shijohorikawa .item {width: 100%;}
}



/* Karasuma-kawaracho 
------------------------------ */
.Karasuma-kawaracho {margin-top: 160px;}
.Karasuma-kawaracho .contentsfull {position: relative;align-items: start;}
.Karasuma-kawaracho .text {padding-top: 200px;margin-left: 150px;}
.Karasuma-kawaracho .textInner {}
.Karasuma-kawaracho .photo {width: 61.8%;margin-left: 5vw;margin-bottom: 260px;}
.kawarachoImg {position: absolute;left: 150px;bottom: 0;width: 41.4%;z-index: 2;}
/* */
@media screen and (max-width: 960px){
	.Karasuma-kawaracho {margin-top: 60px;}
	.Karasuma-kawaracho .text {padding-top: 0;margin-left: 0;}
	.Karasuma-kawaracho .photo {width: 85%;margin-left: auto;margin-bottom: 140px;margin-top: 60px;}
	.kawarachoImg {left: -20px; width: 70%;}
}










/* ========================================
lifeInfoSliderWrap 
======================================== */
.lifeInfoSliderWrap {margin-top: 70px;padding: 260px 0 90px;position: relative;}
.lifeInfoSliderWrap:after {
	content: '';position: absolute;top: 0;right: 0;width: 78vw;height: 100%;background: rgba(0,0,0,0.3);
}

/* lifeInfoSlider
------------------------------ */
.lifeInfoSlider .swiper-slide {}
/* */
@media screen and (min-width: 1521px){
	.lifeInfoSlider .swiper-slide {width: 330px;height: 220px;margin-right: 45px;transform-origin: bottom left;transition: .6s ease-out;}
	.lifeInfoSlider .swiper-slide-active,
	.lifeInfoSlider .swiper-slide-duplicate-active {transform: scale(2.55);}
}
.lifeInfoSlider .sliderNavWrap {max-width: 300px;width: 100%;display: flex;align-items: center;margin-top: 30px;margin-left: 540px;}
.lifeInfoSlider .swiper-pagination {position: static;margin: 0 30px;}
.lifeInfoSlider .swiper-pagination span{padding: 0 10px;}
.lifeInfoSlider .swiper-button-prev,
.lifeInfoSlider .swiper-button-next {position: static;width: 100%;margin: 0;display: block;}
.swiper-button-next:after,
.swiper-button-prev:after {display: none;}
.lifeInfoSlider .swiper-button-prev .icon-arrow,
.lifeInfoSlider .swiper-button-next .icon-arrow{display: flex;justify-content: center;align-items: center;height: 100%;border: 1px solid #2d2d2d;border-radius: 25px;filter: brightness(0) invert(1);}
.lifeInfoSlider .swiper-button-prev .icon-arrow img,
.lifeInfoSlider .swiper-button-next .icon-arrow img{width: 35%;}
.lifeInfoSlider .swiper-button-prev .icon-arrow img {transform: rotate(-180deg);}
.lifeInfoSlider .slider-icon {width: 100%;height: 100%;}

/* lifeInfoTextSliderWrap
------------------------------ */
.lifeInfoTextSliderWrap {}
.lifeInfoTextSliderWrap2 {width: 30%;margin-left: auto;margin-bottom: 60px;}
.lifeInfoTextSlider {}
.lifeInfoTextSlider .swiper-slide {color: #fff;}
.lifeInfoTextSlider .slider__txt {font-size: 10px;letter-spacing: 0.1em;margin-bottom: 20px;}
.lifeInfoTextSlider .slider__name {font-size: clamp(20px, 3vw, 40px);line-height: 1.2;letter-spacing: 0.04em;}
.lifeInfoTextSlider .slider__name .small {display: block;font-size: 14px;margin-top: 10px;}
/* */
@media screen and (min-width: 1521px) {
  .lifeInfoSlider .swiper-slide-active + .swiper-slide,
  .lifeInfoSlider .swiper-slide-active + .swiper-slide + .swiper-slide,
  .lifeInfoSlider .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide,
  .lifeInfoSlider .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide,
  .lifeInfoSlider .lifeInfoSlider .swiper-slide-duplicate-active + .swiper-slide,
  .lifeInfoSlider .lifeInfoSlider .swiper-slide-duplicate-active + .swiper-slide + .swiper-slide,
  .lifeInfoSlider .lifeInfoSlider .swiper-slide-duplicate-active + .swiper-slide + .swiper-slide + .swiper-slide,
  .lifeInfoSlider .lifeInfoSlider .swiper-slide-duplicate-active + .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide {
    transform: translateX(520px);
  }
}
/* */
@media screen and (max-width: 1520px){
	.lifeInfoSliderWrap {
		margin-top: 60px;
		padding: 60px 0;
	}
	.lifeInfoSliderWrap:after {
		width: 100vw;
	}
	.lifeInfoTextSliderWrap2 {
		width: 100%;
		margin-bottom: 30px;
	}
	.lifeInfoSlider .swiper-slide {
		width: 100%;
		height: 100%;
		margin-right: 0;
	}
	.lifeInfoSlider .sliderNavWrap {
		max-width: 250px;
		margin: 30px auto 0;
	}
	.lifeInfoSlider .swiper-pagination {
		font-size: 14px;
		margin: 0 20px;
	}
}









/* ========================================
lifestyle_lifeinfo 
======================================== */
#lifestyle_lifeinfo {}
#lifeInfo {margin-top: 50px;}
#lifeInfo iframe {width: 100%;height: 600px;border: none;}
#lifeInfo .mapWrap {max-width: 100%;width: 100%;margin: 0 auto;}
.lifeInfo_panel:not(.current) {display: none;}
#lifeInfo .tab-btn {display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 10px;}
#lifeInfo .tab-btn li {width: 15.5%;cursor: pointer;display: flex;align-items: center;}
#lifeInfo .tab-btn li .inner_box {width: 100%;padding: 15px 0;background: #fff;font-size: 14px;color: #000;text-align: center;transition: all .7s;}
#lifeInfo .tab-btn li.current .inner_box {background: #2d2d2d;color: #fff;}
@media(hover: hover) {
  #lifeInfo .tab-btn li:hover .inner_box {background: #2d2d2d;color: #fff;}
}
@media screen and (max-width: 960px){
	#lifeInfo {margin-top: 30px;}
	#lifeInfo iframe {height: 500px;}
}
@media screen and (max-width: 640px){
	#lifeInfo .tab-btn li {width: 49%;margin-top: 5px;}
	#lifeInfo .tab-btn li .inner_box {padding: 10px 0;font-size: 12px;}
}

.lifeInfo_panel__frame {display: flex;flex-wrap: wrap;}
.lifeInfo_areaMap {width: 900px;}
.lifeInfo_areaList {width: calc(100% - 900px);height: 600px;overflow: hidden;overflow-y: scroll;
	background: rgba(255, 255, 255, 0.3);padding: 0px;}
.lifeInfo_areaList ul {font-size: 12px;}
.lifeInfo_areaList li {color: #2d2d2d;font-size: 12px;position: relative;overflow: hidden;padding: 12px 15px;border-bottom: 1px solid #ccc;}
.lifeInfo_areaList li .num {background: #2d2d2d;display: inline-block;width: 20px;height: 20px;color: #fff;font-size: 13px;line-height: 1.5;text-align: center;margin: 0 10px 0 0;vertical-align: middle;}
.lifeInfo_areaList li .min{font-size: 11px;display: block;text-align: right;float: right;}
/* */
@media screen and (max-width: 1300px){
	.lifeInfo_areaList {height: 200px;}
	.lifeInfo_areaMap {width: 100%;}
	.lifeInfo_areaList {width: 100%;}
}
@media screen and (max-width: 960px){
	.lifeInfo_areaList li {font-size: 10px;}
	.lifeInfo_areaList li .min{font-size: 8px;}
}













@media screen and (max-width: 960px){
}
@media screen and (max-width: 640px){
}