/***********************************************************************************************************************

master.css

***********************************************************************************************************************/
.master #contents{
	overflow-x: hidden;
}
.master .hd_logo_wrap .logo .black{ display: none;}
.master .hd_logo_wrap .logo .white{ display: block;}


/* modal-video *********************************/
.modal-video-body{
  max-width: 1280px; /*1280px 1920px*/
}
.modal-video{
  background-color: rgba(0,0,0,0.8);
}
  

/*** imgViewer2用 **********************************/
.leaflet-container {
  background: #fff; /*#ddd*/
}


/*** swiper用 **********************************/
.master .slide_wrap{
	margin: 5% 0 0; /*3% 0*/
	padding: 4em 0 3em;
	background-color: #002a4a;
}
.master .slide_wrap figcaption{
	font-size: 14px;
	font-size: clamp(12px, 1.4vw, 14px);
	color: #fff;
	padding: 0.2em 0 0;
	text-align: left;
}


.history_wrap .swiper-wrapper {
  /*transition-timing-function: linear;　滑らかに流す時*/
}
.history_wrap{
	margin-top: 5%;
}
.history_wrap .swiper-slide{
	width: 250px;
}


@media screen and (max-width: 767px) {
.master .slide_wrap{
	margin-top: 8%;
	padding: 3em 0 2em;
}
.history_wrap{
	margin-top: 8%;
}
.history_wrap .swiper-slide{
	width: 200px;
}
}




/*** sec **********************************/
.sec_city{
	padding-top: 5%;
}
.sec_place{
	padding-top: 0;
}
.sec_center{
	/*padding-top: 15%;*/
}
.sec_security{
	padding: 5% 0;
	margin-top: 5%;
	background: #E5F1D9;
background: linear-gradient(90deg, rgba(229, 241, 217, 1) 0%, rgba(199, 225, 245, 1) 100%);
}


@media screen and (max-width: 767px) {
.sec_city{
	padding-top: 40px;
}
.sec_center{
	/*padding-top: 25%;*/
}
.sec_security{
	padding: 8% 0;
	margin-top: 8%;
}
}




/*** h1〜  **********************************/
h1.h1_ttl{
	position: absolute;
	top: 14%;
	left: 9%;
	font-size: 1.5vw;
	color: #fff;
	letter-spacing: 0.1em;
	text-shadow: 0 0 10px #000;
}
h1.h1_ttl .en{
	display: block;
	font-family: 'Trajan Pro', sans-serif;
	/*font-family: "Lato", sans-serif;
	font-style: normal;
	font-weight: 100;*/
	font-size: 470%;
	letter-spacing: normal;
}

h2.h2_ttl{
	position: relative;
	font-size: 34px;
	font-size: clamp(22px, 3vw, 34px);
	text-align: center;
}
h2.h2_ttl .en{
	position: relative;
	display: block;
	font-family: 'Trajan Pro', sans-serif;
	/*font-family: "Lato", sans-serif;
	font-style: normal;
	font-weight: 100;*/
	font-size: 230%; /*250%*/
	color: #727171;
	margin-bottom: 0.1em;
}

.center_wrap h2.h2_ttl{
	position: absolute;
	top: 5%;
	left: 50%;
	transform: translateX(-50%);
	text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
	width: 90%;
}
.center_wrap h2.h2_ttl .en{
	color: #fff;
	text-shadow: none;
}


h3.h3_place{
	font-size: 2.2vw;
	letter-spacing: 0.15em;
	color: #3e3a39;
	line-height: 1.6em;
	margin-bottom: 0.5em;
}
h3.h3_place .big01{ font-size: 230%; letter-spacing: normal;} /*font-size: 300%;*/
h3.h3_place .big02{ font-size: 160%; letter-spacing: normal;} /*font-size: 200%;*/


h4.h4_place{
	font-size: 30px;
	font-size: clamp(18px, 2vw, 30px);
	color:#3e3a39;
	text-align: center;
	line-height: 1.6em;
	margin-bottom: 1.2em; /*0.8em*/
}
h4.h4_place .big{
	font-size: 140%;
	/*display: block;*/
}
h4.h4_place .small{
	font-size: 70%;
}
h4.h4_place.clr_fff{
	color: #fff;
}

h4.h4_security{
	font-size: 30px;
	font-size: clamp(20px, 2vw, 30px);
	color:#3e3a39;
	text-align: center;
	line-height: 1.6em;
	margin-bottom: 2em;
}

h5.h5_securiry{
	font-size: 20px;
	font-size: clamp(16px, 2vw, 20px);
	line-height: 1.8em;
	color: #3e3a39;
	margin-bottom: 0.2em;
}

h5.h5_center{
	font-size: 22px;
	font-size: clamp(18px, 2vw, 22px);
	line-height: 1.8em;
	color: #3e3a39;
	margin-bottom: 0.8em;
}

h6.h6_check{
	font-size: 22px;
	font-size: clamp(18px, 2vw, 22px);
	line-height: 1.8em;
	text-align: center;
	color: #3e3a39;
	margin-bottom: 1em;
}

p.p_lead{
	text-align: center;
	line-height: 2.5em;
	margin: 1.8em 0 1em;
}

p.font_14{
	font-size: 14px;
	font-size: clamp(12px, 1.4vw, 14px);
}




@media screen and (max-width: 979px) {
h1.h1_ttl{
	top: 20%;
	left: 5%;
}
}


@media screen and (max-width: 767px) {
h1.h1_ttl{
	top: auto;
	bottom: 7%;
	font-size: 4vw;
}
h1.h1_ttl .en{
	font-size: 320%;
	font-weight: 300;
}
h2.h2_ttl .en{
	font-size: 200%;
}
h3.h3_place{
	font-size: 30px;
	font-size: clamp(18px, 3vw, 30px);
}
h4.h4_security{
	margin-bottom: 1.2em;
}
p.p_lead{
	/*text-align: justify;*/
	line-height: 2em;
}
/*p.p_lead .resp_autowrap{
	display: inline;
}*/
}


@media screen and (max-width: 639px) {
.center_wrap h2.h2_ttl{
	position: relative;
	margin-bottom: 1em;
}
.center_wrap h2.h2_ttl .en{
	color: #727171;
}
}




/*** hd **********************************/
.hd {
	position: relative;
}

.hd_main img{
	width: 100%;
	height: auto;
}
.hd_main figcaption{
	position: absolute;
	bottom: 5px;
	right: 5px;
	color: #fff;
	text-shadow: 0 0 3px rgba(0,0,0,0.8), 0 0 3px rgba(0,0,0,0.8), 0 0 3px rgba(0,0,0,0.8);
}

.hd_main .pc{}
.hd_main .sp{ display: none;}


@media screen and (max-width: 767px) {
.hd_main .pc{ display: none;}
.hd_main .sp{ display: block;}
}




/*** shikihai_box **********************************/
.shikihai_box{
	position: relative;
	z-index: 1;
	margin-top: 50px;
	padding: 3% 0 0; /*6% 0 0*/
}
figure.shikihai{
	width: 100%;
	max-width: 1190px;
	margin: 0 auto;
	padding: 0 0 2em; /* 3em 0 */
}

.town_box{
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
	padding-top: 5%;
}

.bn_town a{
	display: block;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
}
.bn_town a:hover{
	opacity: 0.7;
}


@media screen and (max-width: 767px) {
.shikihai_box{
	padding-top: 6%;
}
figure.shikihai{
	height: 250px;
}
figure.shikihai img{
	height: 100%;
}
}


/*** movie_box **********************************/
.movie_box{
	margin-top: 5%;
}
.movie_box img{
	width: 100%;
	height: auto;
	cursor: pointer;
	transition: all .3s linear;
}
.movie_box:hover img{
	opacity: 0.7;
}

.movie_box .pc{}
.movie_box .sp{ display: none;}


@media screen and (max-width: 767px) {
.movie_box{
	margin-top: 10%;
}
.movie_box .pc{ display: none;}
.movie_box .sp{ display: block;}
}



/*** list_place **********************************/
.list_place{
	display: flex;
	flex-flow: wrap;
	align-items: center;
	margin-top: 12%; /*8%*/
}
.list_place.reverse{
	flex-direction: row-reverse;
}

.list_place li{
}
.list_place li.photo{
	width: 63.88888889%;
}
.list_place li.txt{
	position: relative;
	width: 29.86111111%;
	margin-left: -4%;
	padding: 3% 0 1%;
}
.list_place.reverse li.txt{
	margin-left: 0;
	margin-right: -4%;
}

.list_place li.txt:after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.9;
	background: #E5F1D9;
background: linear-gradient(90deg, rgba(229, 241, 217, 1) 0%, rgba(199, 225, 245, 1) 100%);
}

.list_place li.txt .inner{
	position: relative;
	z-index: 1;
	width: 84%;
	margin: 0 auto;
}

.list_place li img{
	width: 100%;
	height: auto;
}


.list_place li.photo figcaption{
	font-size: 10px;
	padding: 0.5em 1em 0;
}
.list_place.reverse li.photo figcaption{
	text-align: right;
}



@media screen and (max-width: 1023px) {
.list_place li.txt{
	width: 38%;
}
}


@media screen and (max-width: 767px) {
.list_place{
	margin-top: 20%; /*15%*/
}
.list_place li.photo{
	width: 100%;
}
.list_place li.txt{
	width: 92%;
	margin: -20px auto 0;
	padding: 6% 0 3%;
}
.list_place.reverse li.txt{
	margin: -20px auto 0;
}

.list_place li.photo figure{
	position: relative;
}
.list_place li.photo figcaption{
	position: absolute;
	bottom: 30px;
	right: 4%;
	padding: 0;
	color: #fff;
	text-shadow: 0 0 5px #000, 0 0 5px #000;
}
}




/*** list_place_mini **********************************/
.list_place_mini{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	margin-top: 7%;
}
.list_place_mini li{
	width: 47.5%;
}

.list_place_mini li figcaption{
	text-align: right;
	padding-top: 0.5em;
}


@media screen and (max-width: 767px) {
.list_place_mini{
	margin-top: 10%;
}
.list_place_mini li{
	width: 85%;
}
.list_place_mini li:last-child{
	margin: 10% 0 0 auto; /*7% 0 0 auto*/
}

.sec_place .list_place_mini li{
	margin: 0 auto;
}
.sec_place .list_place_mini li:last-child{
	margin: 10% auto 0;
}
}



/*** zumen **********************************/
.zumen{
	margin-top: 4%;
}



/*** list_plant **********************************/
.plant_wrap{
	width: 90%; /* 63.88888889%*/
	max-width: 1200px;
	margin: 3% auto 0; /*5% auto 0*/
}
.list_plant{
	width: 100%; /* 83.6956521% */
	/*margin-left: auto;*/
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
}
.list_plant li{
}
.list_plant li.plant_l{
	width: 48.051948%;
}
.list_plant li.plant_r{
	width: 50.649350%;
}
.list_plant li img{
	width: 100%;
	height: auto;
}

.list_plant li.plant_l figcaption{
	font-size: 10px;
	text-align: right;
	padding-top: 0.5em;
}


@media screen and (max-width: 1023px) {
.plant_wrap{
	/*margin: 3% auto 0;*/
	margin-top: 5%; /*8%*/
	width: 92%;
}
.list_plant{
	width: 100%;
}
}


@media screen and (max-width: 767px) {
.plant_wrap{
	margin-top: 10%;
}
.list_plant li.plant_l{
	width: 100%;
	order: 2;
}
.list_plant li.plant_r{
	width: 100%;
	order: 1;
	margin-bottom: 2.5%;
}
}




/*** list_security **********************************/
.list_security{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
}
.list_security li{
	width: 45%;
}
.list_security li .photo{
	margin-bottom: 1.5em;
}

@media screen and (max-width: 767px) {
.list_security li{
	width: 100%;
}
.list_security li:last-child{
	margin-top: 8%;
}
}



/*** btn_cts **********************************/
.btn_cts{
	position: relative;
	width: 90%; /*100%*/
	max-width: 350px; /* 350px*/
	margin: 2.5em auto 0;
}

.btn_cts a{
	position: relative;
	z-index: 2;
	display: block;
	color: #fff;
	font-family: 'Trajan Pro', sans-serif;
	/*font-family: "Lato", sans-serif;
	font-style: normal;
	font-weight: 300;*/
	font-size: 24px; /*28px*/
	font-size: clamp(16px, 2.4vw, 24px); /*clamp(18px, 2.8vw, 28px)*/
	text-align: center;
	letter-spacing: 0.05em; /*0.1em*/
	line-height: 1; /*60px*/
	padding: 0.7em 0 0.5em; /*0.5em 1em → 0.7em 1em 0.5em*/
	background-color: #002a4a;
 }
.btn_cts a:hover{
	color: #fff;
	background-color: #6cb2dc;
}
.btn_cts a .small{
	font-size: 50%;
	padding-left: 1em;
}


@media screen and (max-width: 767px) {
.btn_cts{
	margin-top: 1.5em;
}
.btn_cts a{
	padding: 1.2em 1em 1em; /*1em 1em*/
}
}



/*** arrow **********************************/
.btn_cts .arrow {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -10px;
  display: block; /*inline-block*/
  width: 11.6px;
  height: 22.2px;
}

.btn_cts .arrow::before,
.btn_cts .arrow::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.5px);
  right: 0;
  width: 16px;
  height: 1px;
  border-radius: 9999px;
  background-color: #fff; /*#000000*/
  transform-origin: calc(100% - 0.5px) 50%;
}

.btn_cts .arrow::before {
  transform: rotate(45deg);
}

.btn_cts .arrow::after {
  transform: rotate(-45deg);
}





/*** bn_box **********************************/
.bn_box{
	margin-top: 8%;
}


@media screen and (max-width: 767px) {
.bn_box{
	margin-top: 12%;
}
}



/*** bn_town **********************************/
.bn_town{
	margin: 0; /*4em 0 0*/
}
.bn_town a{
	display: block;
}
.bn_town a:hover{
	opacity: 0.7;
}






/*** panoramaBox  **********************************/
.panorama_wrap{
	position: relative;
	width: 100%;
	margin: 5% auto 0;
}
.panoramaBox{
	margin: 0;
	user-select: none;
}
i.icon_LR{
	display: none;
}


@media screen and (max-width: 2800px) { /*(max-width: 2310px*/
.panorama_wrap{
}
.panoramaBox{
	position: relative;
  width: 100%;
  /*height: 620px;*/
  padding: 0 0 20px;
  margin: auto;
  cursor: grab; /*pointer*/
  
  /* 横にはみ出した要素をスクロールするプロパティ */
  overflow-x: scroll;
  overflow-y: hidden;
  
  /* 縦書きにするプロパティで右側スタート →　スタートをセンターに変更するので非表示 */
  /*-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;*/
  
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}
 
.panoramaBox img{
	width: 2800px!important; /*2310px*/
	max-width: 2800px!important; /*2310px*/
	height: auto!important;
}

i.icon_LR{
	display: block;
	width: 40px;
	margin: 0 0 10px 10px;
}
}


@media screen and (max-width: 1023px) {
.panoramaBox img{
	width: 2040px!important; /*1700px*/
	max-width: 2040px!important; /*1700px*/
}
i.icon_LR{
	width: 30px;
}
}

@media screen and (max-width: 767px) {
.panorama_wrap{
	margin-top: 8%;
}
.panoramaBox img{
	width: 1600px!important; /*1300px*/
	max-width: 1600px!important; /*1300px*/
}
i.icon_LR{
	width: 25px;
}
}




/*** 横スクロールバーデザイン（Firefoxは効かない）  **********************************/
.panoramaBox::-webkit-scrollbar {
 height: 4px;
}
.panoramaBox::-webkit-scrollbar-thumb {
  background-color: #4cc5cb;
  border-radius: 2px;
}
.panoramaBox::-webkit-scrollbar-track {
  background: #ccc;
}






/*************************************************************************************
*************************************************************************************

print

*************************************************************************************
**************************************************************************************/

@media print {

}