@charset "UTF-8";
/* CSS Document */

/* <!-- 共通 --> */
body{
	margin: 0px;
	-webkit-text-size-adjust: 100%;

	background-color: #fff;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Yu Gothic', YuGothic, Roboto, Ubuntu, 'Hiragino Kaku Gothic Pro', 'Hiragino Sans GB', Meiryo, 'Malgun Gothic', 'Helvetica Neue', sans-serif;

	overflow-x:hidden;
	color: #000;
}

img {
    vertical-align: top;
}
img {
    vertical-align: middle;
    width: 100%;
    height: auto;
}


.view-pc{    
    display: block !important;              /* フレックスボックスにする */
}
.view-mobile{
    display:none !important;
}
.wrapper{
	display:block;
	width:100%;
	position: relative;
	margin: 0 auto 0;

	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Yu Gothic', YuGothic, Roboto, Ubuntu, 'Hiragino Kaku Gothic Pro', 'Hiragino Sans GB', Meiryo, 'Malgun Gothic', 'Helvetica Neue', sans-serif;
    line-height: 2.2;
    font-size: clamp(14px, 1.8vw, 18px);
}


/* 最初の導入部 */

.first-info{
	margin-top:0%;
	margin-bottom:0%;
	background-color:#fdf2f5;
	padding-bottom:0%;
}
.first-info .first-info-block-out{
	display:block;
	width:100%;

	background:#fdf2f5 url(../images/hirame_tund-pc.jpg) no-repeat top center;
	background-size: cover;
	height: calc(1670vw /  18.0);
	min-height: 600px;
}
.first-info-block{
	font-family: "游明朝","Yu Mincho","YuMincho",serif;
	font-size: clamp(16px, 2.6vw, 38px);
	font-weight: 600;
	line-height: 2.0;
	margin:0 auto 0;
	width:50%;
	padding-top:19%;
	max-width: 800px;
	text-shadow: none;
}


/* ビデオ */
.video_box {
	display:block;
	width:100%;
	padding:0;
	
	background-color:#fdf2f5;

	height:auto;
	position: relative;
	padding-bottom : 56.25%;
}
.video_box iframe {
	position: absolute;
	top: 15%;
	left: 50%;
	transform: translateX(-50%);
	width: 60%;
	height: 60%;
}


/* 共通・その他各部 */
.bw{
	background-color:#fff;
}
.bp{
	background-color:#fdf2f5;
}

.event,
.hotel,
.restaurant,
.period{
	padding:10% 0 10% 0;
}

.access1,
.map{
	padding:15% 0 10% 0;
}

.title-box.bw{
	margin:0 auto 0;
	padding:0;
	padding-top:6%;
	background:#fff url(../images/sakura-bw.png) no-repeat center top ;
	background-size: calc(160vw /  18.0);
	height:auto;
}

.title-box.bp{
	margin:0 auto 0;
	padding:0;
	padding-top:6%;
	background:#fdf2f5 url(../images/sakura-bp.png) no-repeat center top;
	background-size: calc(160vw /  18.0);
	height:auto;
}

.title-box h2{
	margin-top:-2%;
	font-size: clamp(30px, 5.6vw, 70px);
}
.period .title-box h2{
	margin-top:0%;
}
.event .title-box h2{
	margin-top:0%;
}

.title-box p{
	padding-top:0%;
	font-weight: 600;
	margin-top: -32px;
	font-size: clamp(18px, 3.2vw, 36px);
}

.title-box p.catch1{
	padding-top:3%;
	font-size: clamp(14px, 1.8vw, 26px);
	font-weight: 600;
	margin-top: 0px;
	line-height:2;
}

.title-box h2.red1{
	color:#e95079;
}
.period p.catch1,
.event p.catch1,
.map p.catch1,
.access1 p.catch1{
	color:#e95079;
}

.title-box h2.purple{
	color:#920783;
} 
.hotel p.catch1{
	color:#920783;
}

.title-box h2.red2{
	color:#e60012;
} 
.restaurant p.catch1{
	color:#e95079;
}


/* リンクブロック */
/* LINK部分ヘッダー */
.link-header{
	margin:4% auto 0;
	width:90%;
	max-width: 1050px;
	font-size: clamp(14px, 1.6vw, 18px);
}
.link-header p{
	line-height: 1.3;
	text-align: left;
}

/* 温泉マーク */
.link-header p.onsen{
	position: relative;
	padding-left:1em;
}
.onsen::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/mk1.png);
	background-color: #fdf2f5;
}

/* バリアフリーマーク */
.link-header p.barrier-free{
	position: relative;
	padding-left:1em;
	margin-bottom: -0.2em;
}
.barrier-free::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/mk2.png);
	background-color: #fdf2f5;
}

/* 車椅子マーク */
.link-header p.wheelchair{
	position: relative;
	padding-left:1em;
}
.wheelchair::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/mk3.png);
	background-color: #fff;
}

/* 団体客マーク */
.link-header p.group_customers{
	position: relative;
	padding-left:1em;
	margin-bottom: -0.2em;
}
.group_customers::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/mk4.png);
	background-color: #fff;
}

/* 注意 */
.link-header p.note1{
	font-size: 0.8em;
	padding-bottom: 2em;
}

/* リンクボックス */
.link-box {
	margin:0 auto 0;
	width:90%;
	max-width: 1050px;
	line-height: 1;
}

.link-box{
	display: flex;
	column-gap: 5%;
	flex-wrap: wrap;
}
.link-box-elm{
	width: calc(50% - 2.5%);
	padding:3.5% 0 3.5% 0;
}

.hotel .link-box {
    padding-bottom: 15%;
}
.restaurant .link-box {
    padding-bottom: 15%;
}

/* イベント・キャンペーン */
.event-box{
	display:block;
	width: 85%;
	max-width:1050px;
	margin:3% auto 0;
}
.event-ttl{
	display:flex;
	flex-wrap: wrap;
	width: 100%;
	background-color: #e95079;
	font-weight: 900;
	color: #fff000;
	text-align: center;
	font-size: clamp(28px, 3.6vw, 44px);
    justify-content: center;
    align-items: center;
    padding: 1% 0 1% 0;
    border-radius: 30px 30px 0 0;
}
.event-ttl .byt{
	padding-top: 1%;
	width: 100%;
	line-height: 1.5;
}
.event-ttl .byt-s{
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 600;
	color: #fff
}
.swt{
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 600;
	width: 100%;
	color: #fff;
	line-height: 0.4;
	padding-bottom: 2%;
}

.event-bdy{
	width: 100%;
	padding: 1% 0 1% 0;
	background-color: #fff;
	font-size: 14px;
	color: #000;
	text-align: center;
	border-radius: 0 0 30px 30px;
}

.kikan-box{
	display: inline-block;
	width: 100%;
	text-align: center;
	font-size: clamp(20px, 2.6vw, 36px);
	font-weight: 600;
	letter-spacing: 0.05em;
}
.kikan-box p{
	color:#e95079;
}
.kikan-box p .kikan{
	color:#000;
}

.event{
	padding-bottom:5%;
}
.event-info-box{
	display:flex;
	width: 90%;
	max-width:1200px;
	margin:0 auto;
}
.event-info-elm1{
	width:30%;
	padding:1% 1%;
	line-height: 1;
}
.event-info-elm2{
	width:70%;
	text-align: left;
	padding:2% 2%;
	font-size: clamp(12px, 1.6vw, 20px);
	line-height: 1.8;
}

button.emk{
    display: block;
    width: 70%;
    max-width: 750px;
    margin: 5% auto 7%;
}

.can-box{
	width: 120%;
    margin: 0 auto;
    padding-top: 5%;
    padding-bottom: 10%;
    margin-left: -10%;
}

.can-box .can-box-elm{
	width: 47.5%;
	padding-right: 4%;
}
.can-box img.smlx{
	width:43.5%;
}


/* MAP */
.map .code-box img{
	padding:5% 0 0;
}
.map .map-box img{
	padding:4% 0 0;
}
.code-box{
	width: 31%;
    margin: 2% auto;
}
.map-box{
	width: 90%;
    margin: 2% auto;
	max-width: 1050px;
}

.map-box .map-2{
	margin-top:6%;	
	margin-bottom:6%;
}


/* アクセス */
.access1 img.amap{
	padding:0 0 13%;
}
.access-box{
	width: 90%;
    margin: 2% auto 2%;
	max-width: 1050px;
}

.rent-box{
	width: 90%;
    margin: 2% auto 21%;
	max-width: 1200px;
}
.rent-box-ttl{
	width: 40%;
    margin: 2% auto 5%;
	max-width: 500px;

}

.rent-flex-box{
	display:flex;
	width: 100%;
	max-width: 1000px;
    margin: 2% auto;

	justify-content: left;
	align-items: center;
	color:#000;
}
.rent-flex-elm{
	width:33.333333%;
	text-align: left;
	line-height: 1.1;
}

.rent-flex-box p.namae1{
	font-size: clamp(12px, 2.6vw, 32px);
	font-weight: 600;
	color:#000;
}

.rent-flex-box p.tel,
.rent-flex-box p.free{
	color:#e95079;
	font-size: clamp(12px, 2.8vw, 36px);
	font-weight: 600;
	letter-spacing: 0.1em;
}

/* telマーク */
.rent-flex-elm p.tel{
	position: relative;
	padding-left:1.1em;
}
.tel::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/tel.png);
}

/* freeマーク */
.rent-flex-elm p.free{
	position: relative;
	padding-left:1.2em;
}
.free::before {
	content: '';
	position: absolute;
	top: 50%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	background-image: url(../images/free.png);
}



/* Footer */
footer{
	display:block;
	width: 100%;
	background-color: #669900;
	padding:4% 7% 5% 7%;
	font-size: clamp(10px, 1.4vw, 16px);
}

.sns-box{
	display:flex;
	width: 35%;
    margin-left: auto;
	justify-content: right;
	align-items: center;
}

.sns-elm{
	width:45%;
}

.association-box{
	display:flex;
	flex-wrap: wrap;
	width: 100%;
	max-width: 1200px;
    margin:0 auto;
	justify-content: left;
	align-items: center;
	color:#fff;
    font-weight: 600;
	letter-spacing: 0em;
	padding:10% 0 10% 0;
}

.association-elm.inquiry{
	display:flex;
	flex-wrap: wrap;
	width:65%;
	height: calc(160vh / 18.0);
	line-height: 1.3;
	justify-content: left;
	align-items: center;
	font-size: clamp(16px, 3.3vw, 38px);

	background-position: left;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url(../images/asso-1.png);

	text-align: left;
	padding-left: calc(200vh / 18.0);
}
.association-elm.inquiry div.tel-addr{
	display:flex;
	flex-wrap: nowrap;
	position: relative;
	margin-left:0%;
}

.association-elm.inquiry div.tel-addr p.telno{
	font-size: clamp(16px, 2.1vw, 32px);
	padding-right:2%;
}

.association-elm.inquiry div.tel-addr span{
	font-size: clamp(10px, 1.4vw, 22px);
	position: absolute;
	top: 26%;
	font-weight: normal;
}
.association-elm.inquiry div{
	width:100%;
}

.association-elm.sponsor{
	display:flex;
	flex-wrap: wrap;
	width:35%;
	height: calc(160vh / 18.0);
	line-height: 1.3;
	justify-content: left;
	align-items: center;
	font-size: clamp(16px, 2.1vw, 32px);

	background-position: left;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url(../images/asso-2.png);

	text-align: left;
	padding-left: calc(200vh / 18.0);
}
.association-elm.sponsor p{
	width:100%;
}

footer p.copyl{
	display:inline-block;
	width: 90%;
	margin:0 auto;
	font-size: clamp(14px, 2.6vw, 22px);
	text-align: center;
	color:#fff;
}



@media only screen and (max-width: 1000px){ /* 1000px以下 */
	.association-box {
		padding: 5% 0 5% 0;
	}
	.association-elm.inquiry{
		width:100%;
		margin-bottom: 5%;
		height: calc(140vh / 18.0);
	}
	.association-elm.sponsor{
		width:100%;
		margin-bottom: 0%;
		height: calc(140vh / 18.0);
	}

	.association-elm.inquiry div.tel-addr {
		display:flex;
		flex-wrap: wrap;
		margin-left: 0;
		margin-top:0%;
	}
	.association-elm.inquiry div.tel-addr p{
		width:100%;
	}
		
	.association-elm.inquiry div.tel-addr span{
		position: relative;
		top: 0%;
	}
	
	/* Footer */	
	.association-elm.inquiry{
		font-size: clamp(24px, 2.8vw, 34px);
		line-height: 1.2;
	}

	
	.association-elm.inquiry div.tel-addr p.telno{
		font-size: clamp(20px, 2.6vw, 32px);
		padding-right:2%;
		line-height: 1.0;
	}
	
	.association-elm.inquiry div.tel-addr p.addr{
		margin-top:0%;
	}

	.association-elm.inquiry div.tel-addr span{
		font-size: clamp(20px, 2.4vw, 24px);
		line-height: 1.0;
	}
	
	.association-elm.sponsor{
		font-size: clamp(24px, 2.6vw, 32px);
	}

	.sns-box {
		display: flex;
		width: 100%;
		margin-left: auto;
		justify-content: right;
		align-items: center;
	}

}






@media only screen and (max-width: 767px){ /* 767px以下 */
	
	.view-pc{    
		display:none !important;
	}
	.view-mobile{
		display: block !important;  
	}

	.non-youso{
		display:none !important;
	}

	.wrapper {
	    margin: 0 auto 0;
	}


	/* 共通 */
	.title-box.bw{
		background-size: calc(260vw /  18.0);
	}

	.title-box.bp{
		background-size: calc(260vw /  18.0);
	}


	.title-box h2 {
		font-size: clamp(26px, 5.6vw, 72px);
	}
	.title-box p {
		padding-top: 0%;
		font-weight: 600;
		margin-top: -20px;
		font-size: clamp(18px, 3.2vw, 36px);
	}
		
	.hotel .title-box h2,
	.restaurant .title-box h2,
	.access1 .title-box h2,
	.map .title-box h2{
		margin-top:-2%;
	}
	
	.event .title-box h2,
	.period .title-box h2{
		margin-top:4%;
	}
	.title-box p.catch1 {
		margin-top: 4%;
	}

	.title-box p{
		font-size: clamp(14px, 3.2vw, 36px);
	}


	.hotel,
	.restaurant{
		padding:10% 2% 10% 2%;
	}



	/* 最初の導入部 */
		
	.first-info{
		padding-bottom:15%;
	}
	
	.first-info .first-info-block-out{
		background:#fdf2f5 url(../images/hirame_tund-mv.jpg) no-repeat top center;
		background-size: contain;
		height: auto;
	}
	.first-info-block {
		font-family: "游明朝", "Yu Mincho", "YuMincho", serif;
		font-size: clamp(15px, 2.6vw, 38px);
        margin: 0 auto 0;
        width: 90%;
		padding-top: 25%;
	/*	text-shadow: 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff;*/
	}


	/* ビデオ */
	.video_box {
		max-width: 850px;
		width: 100%;
		margin: -30% auto 0;
	}
	.video_box iframe {
		position: absolute;
		top: 15%;
		left: 50%;
		transform: translateX(-50%);
		width: 75%;
		height: 75%;
	}


	/* リンクブロック */
	.link-box {
		margin:0 auto 0;
		width:95%;
		max-width: 1000px;
	}
			
	.link-box{
		display: flex;
		column-gap: 2%;
		flex-wrap: wrap;
	}
	.link-box-elm{
		width: calc(50% - 1%);
		padding:2% 0 2% 0;
/*		width: 100%;
        padding: 2%;
*/
	}


	/* イベント・キャンペーン */
	.event-ttl{
		display:flex;
		flex-wrap: wrap;
		padding:3% 0 3% 0;
		font-size: clamp(14px, 3.6vw, 44px);

	}
	.event-ttl .byt{
		line-height: 1.5;
		width: 100%;
	}
	.event-ttl .byt-s{
		line-height: 1.5;
		font-size: clamp(12px, 2.4vw, 32px);
	}
	.event-ttl .swt{
		line-height: 0.4;
		width: 100%;
		font-size: clamp(12px, 2.4vw, 32px);
	}

	.kikan-box {
		font-size: clamp(16px, 2.6vw, 36px);
		line-height:1.3;
	}

	.event-bdy{
		padding:3% 0 3% 0;
	}
	.event-info-box{
		display:flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	.event-info-elm1{
		width:50%;
		padding:1% 2%;
	}
	.event-info-elm2{
		width:90%;
		text-align: left;
		padding:1% 2%;
	}
	.event-box{
		display:block;
		width: 83%;
	}
	.can-box{
		width: 100%;
		margin:0 auto;
	}
	.can-box .can-box-elm{
		width: 113%;
        margin: 2% 0 2% -9%;

	}
	.can-box img.smlx{
		width: 112%;
        margin-top: 5%;
        padding-left: 9%;
	}
	.event{
		padding-bottom:5%;
	}
	.code-box {
		width: 60%;
	}
	button.emk {
		width: 80%;
	}

	/* アクセス */
	.rent-box-ttl {
		width: 80%;
		margin: 3% auto;
		max-width: 500px;
	}
	.rent-flex-box{
		display:flex;
		flex-wrap: wrap;
		justify-content: left;
		align-items: center;
	}
	.rent-flex-elm{
		width:80%;
		margin: 1% auto 1%;
	}
	.rent-flex-box p.namae1 {
		font-size: clamp(20px, 2.6vw, 32px);
	}
	.rent-flex-box p.tel, 
	.rent-flex-box p.free {
		font-size: clamp(20px, 2.6vw, 32px);
	}


	/* Footer */	
	.association-box {
		padding: 8% 0 5% 0;
	}
	
	.association-elm.inquiry{
		font-size: clamp(16px, 2.6vw, 34px);
		line-height: 1.2;
	}
	
	.association-elm.inquiry div.tel-addr {
		margin-top:1%;
	}


	.association-elm.inquiry div.tel-addr p.telno{
		font-size: clamp(16px, 2.4vw, 32px);
		line-height: 1.0;
	}
		
	.association-elm.inquiry div.tel-addr p.addr{
		margin-top:-1%;
	}

	.association-elm.inquiry div.tel-addr p span{
		font-size: clamp(10px, 1.4vw, 18px);
		line-height: 1.0;
	}
	

	.association-elm.sponsor{
		font-size: clamp(16px, 2.2vw, 32px);
		line-height: 1.3;
	}

	footer p.copyl{
		font-size: clamp(10px, 2.6vw, 22px);
	}
	
}




.clearfix:after {
  content: "";
  display: block;
  clear: both;
} 
.clearfix:before {
  content: "";
  display: block;
  clear: both;
} 
.clearfix {
  display: block;
}