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


/* =========================================================
　お部屋
========================================================= */


/* カテゴリータイトル
--------------------------------------------------------- */
.c_title::before {
	content: "Rooms";
}
@media screen and (max-width:767px) {
	.c_title {
		background: url(../common/img/category_title.png) no-repeat center bottom, url(images/category_title_bg.jpg) no-repeat center center;
		background-size: 220px auto, cover;
	}
}
@media screen and (min-width:768px) , print {
	.c_title {
		background: url(../common/img/category_title.png) no-repeat center bottom, url(images/category_title_bg.jpg) no-repeat center center;
		background-size: 340px auto, cover;
	}
}

/* ページ内リンク
--------------------------------------------------------- */
@media screen and (max-width:767px) {
	.nav {
		padding: 20px 0px;
		width: 100%;
	}
	.nav ul {
		width: 100%;
    	margin: 0 auto;
	}
	.nav li {
		font-family: "游明朝体","ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
		font-size: 1.3em;
		font-weight: bold;
		border-top: 5px solid #cc9933;
		background: hsla(0,0%,0%,0.05);
		display: inline-block;
		width: 100%;
		padding: 10px 0px 20px 0px;
		margin: 0px -1px;
		text-align: center;
	}
	.nav li a {
		width: 100%;
		margin: 0 auto;
		padding: 10px 50px 15px 40px;
		color:#333;
		background-image: url(images/arrow.png);
		background-position: right center;
		background-repeat: no-repeat;
		background-size:15%;
	}
}
@media screen and (min-width:768px) , print {
	.nav {
		padding: 20px 0px;
		width: 100%;
	}
	.nav ul {
		width: 100%;
    	margin: 0 auto;
		white-space:nowrap;
		text-align: center;
	}
	.nav li {
		font-family: "游明朝体","ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
		font-size: 1.3em;
		font-weight: bold;
		border-top: 5px solid #cc9933;
		background: hsla(0,0%,0%,0.05);
		display: inline-block;
		white-space:normal;
		width: 23.74%;
		padding: 0.5em 0.65em 1.2em 0.65em;
		margin: 0px -1px;
		text-align: center;
	}
	.nav li a {
		width: 100%;
		margin: 0 auto;
		padding: 0.5em 0.55em 1.3em 0.55em;
		color:#333;
		background-image: url(images/arrow.png);
		background-position: center bottom;
		background-repeat: no-repeat;
	}
}


/* 各部屋
--------------------------------------------------------- */
.room_box {
	padding: 0 10px 20px;
}
.room_box .room_box_box h3 span {
	font-size: 45%;
	display: block;
}
@media screen and (max-width:767px) {
	.type {
		background: #eee;
	}
	.type h3 {
		font-size: 180%;
		text-align: center;
		padding: 1em 10px 0;
		line-height: 1.4;
	}
	.type_st_box ,
	.type_sp-a_box ,
	.type_sp-b_box ,
	.type_dx_box {
		padding: .6em 10px 2em;
	}
	.type_dx_box h4 {
		text-align: center;
		font-size: 180%;
		margin: .4em 0;
		line-height: 1;
	}
	.type_st_box h4 ,
	.type_sp-a_box h4 ,
	.type_sp-b_box h4 ,
	.type_dx_box h4 {
		text-align: center;
		font-size: 200%;
		margin: .4em 0;
		line-height: 1;
	}
	.type_st_box h4 span ,
	.type_sp-a_box h4 span ,
	.type_sp-b_box h4 span ,
	.type_dx_box h4 span {
		font-size: 60%;
		font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
	}
	.type p {
		padding: 0;
	}
	.type p.text {
		padding-bottom: 1em;
	}
	.type a {
		background: #c93 url(../common/img/arrow_w.png) no-repeat 98% center;
		background-size: 7px auto;
		display: block;
		color: #fff;
		padding: .6em;
		margin: .5em 0;
		text-align: center;
	}
	.room_box .room_box_box h3 span {
		font-size: 45%;
		display: block;
	}
	.room_box .room_box_box a {
		background: #c89533 url(../common/img/arrow_w.png) no-repeat 98% center;
		background-size: 7px auto;
		display: block;
		color: #fff;
		padding: .6em;
		margin: .6em 0 0;
		text-align: center;
	}
	.room_box {
		padding: 0 10px 20px;
	}
	#standard ,
	#superior ,
	#dx {
		padding-top: 70px;
	}
	.room_box .room_box_box h3 {
		text-align: center;
		font-size: 220%;
		margin: .4em 0;
		line-height: 1.2;
	}
}
@media screen and (min-width:768px) , print {
	.room_box.st_a ,
	.room_box.st_b ,
	.room_box.su_a ,
	.room_box.su_b ,
	.room_box.su_c ,
	.room_box.si_a ,
	.room_box.si_b {
		padding: 50px 0 45px 0;
	}
	.room_box .room_box_box {
		text-align: center;
	}
	.room_box .room_box_box h3 {
		font-size: 240%;
		margin: 0 0 .4em;
		line-height: 1.2;
	}
	.room_box .room_box_box h3 span {
		font-size: 50%;
		display: block;
	}
	.room_box.st_a .room_box_box h3 ,
	.room_box.st_b .room_box_box h3 {
		background-size: 50px 50px;
		padding: 34px 0 0;
	}
	.room_box.su_a .room_box_box h3 ,
	.room_box.su_b .room_box_box h3 ,
	.room_box.su_c .room_box_box h3 {
		padding: 34px 0 0;
	}
	.room_box.si_a .room_box_box h3 ,
	.room_box.si_b .room_box_box h3 {
		padding: 34px 0 0;
	}
	.room_box_btn{
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		width: 660px;
		margin: 0 auto;
	}
	.room_box .room_box_box a {
		background: #cc9933 url(../common/img/arrow_w.png) no-repeat 98% center;
    	background-size: auto auto;
		background-size: 7px auto;
		display: block;
		color: #fff;
		padding:1em 3.8em 1em 3.8em;
		margin: .6em 10px 0;
		text-align: center;
	}
}
	

/* 畳の薫りが心を和らげる
--------------------------------------------------------- */
@media screen and (max-width:767px) {
	.miryoku:before {
		content: "";
		display: block;
		height: 160px;
		margin: 0 -10px 1em -10px;
	}
	.miryoku:before {
		background: url(images/img_01.jpg) no-repeat left center;
		background-size: 100% auto;
	}
	.miryoku {
		padding: 4em 10px 4em 10px;
	}
	.pickup h3 {
		font-size: 180%;
		line-height: 1.4;
		text-align: center;
	}
	.pickup h3 br {
		display: none;
	}
	.pickup p br {
		display: none;
	}
	.pickup p.capton {
		font-size: 80%;
	}
	.pickup img {
		width: 50%;
		border: 1px solid #fff;
		box-sizing: border-box;
	}
}
@media screen and (min-width:768px) , print {
	.pickup {
		margin: 0 auto 2em;
	}
	.miryoku {
		padding: 5em 35% 5em 5%;
		background: url(images/img_01_bg.jpg) no-repeat right center;
		background-size: cover;
	}
	.pickup h3 {
		font-size: 180%;
		line-height: 1.4;
		color: #c22;
	}
	.miryoku h3::after {
		content: "";
		display: block;
		background: #c22;
		height: 2px;
		width: 4em;
		margin: .4em auto .2em 0;
	}
	.pickup .capton {
		font-size: 80%;
	}
	.pickup img {
		width: 40%;
	}
	.pickup-text {
		max-width: 650px;
	}
}


/* コラム　愛犬と一緒にご宿泊
--------------------------------------------------------- */
@media screen and (max-width:767px) {
	.column {
		padding: 2em 3em;
		background: #f0e9da url(../common/img/column_bg.png) no-repeat left top;
    	background-size: 30px 30px;
	}
	.column_text br {
		display: none;
	}
	.column_text h4 {
		line-height: 1.4;
		font-size: 160%;
		text-align: center;
	}
	.column_text h4:after {
		content: "";
		display: block;
		width: 15%;
		height: 2px;
		margin: .6em auto .8em;
		background: #c99633;
	}
	.column_text img {
		padding-bottom: 1em;
	}
	.column ul {
		padding-left: 1.4em;
	}
	.column ul li {
		list-style: disc;
		text-indent: -.4em;
	}
    .information_btn {
        text-align: center;
    }
    .information_btn a {
        background: #c93 url(common/img/arrow_w.png) no-repeat right 10px center;
        background-size: auto 14px;
        display: block;
        color: #fff;
        padding: 1em;
    }
}
@media screen and (min-width:768px) , print {
	.column {
		margin: 6em auto;
		max-width: 1000px;
		display: flex;
		justify-content: space-between;
		align-items: stretch;
		font-size: 90%;
		background-color: #f2ebe4;
	}
	.column_text {
		width: 50%;
		padding: 3em 2em 4em 4em;
		background: #f2ebe4 url(../common/img/column_bg.png) no-repeat left top;
    	background-size: 30px 30px;
	}
	.column_text h4 {
		line-height: 1.4;
		font-size: 210%;
		color: #b78400;
	}
	.column_text h4::after {
		content: "";
		display: block;
		width: 20%;
		height: 2px;
		margin: .4em auto .6em 0;
		background: #c99633;
	}
	.column_text img {
		display: none;
	}
	.column ul {
		padding-left: 1.4em;
	}
	.column ul li {
		list-style: disc;
		text-indent: -.4em;
	}
    .information_btn {
        text-align: center;
    }
    .information_btn a {
        padding: 1em 1em .9em;
        color: #fff;
        display: block;
        background: #c89533 url(common/img/arrow_w.png) no-repeat 95% center;
        background-size: 7px auto;
    }
	.column_photo {
		width: 50%;
		background: url(images/column_01.jpg) no-repeat right center;
		background-size: cover;
	}
	.column_photo img {
		display: none;
	}
}

	
/* お部屋でのおもてなし
--------------------------------------------------------- */
@media screen and (max-width:767px) {
	.point {
		font-size: 80%;
		line-height: 1.6;
		margin: 4em auto 6em;
		max-width: 1000px;
	}
	.point h4 {
		font-size: 180%;
		color: #c22;
		text-align: center;
	}
	.point p {
		margin: 0 0 2em;
	}
	.point_box .point_box_01 {
		background: #f6f6f6 url(images/omotenashi_img_01.png) no-repeat 50vw center;
		background-size: 50% auto;
		padding: 1em 51% 1em 10px;
	}
	.point_box .point_box_02 {
		background: #fff url(images/omotenashi_img_02.png) no-repeat 50vw center;
		background-size: 50% auto;
		padding: 1em 51% 1em 10px;
	}
	.point_box .point_box_03 {
		background: #f6f6f6 url(images/omotenashi_img_03.png) no-repeat 50vw center;
		background-size: 50% auto;
		padding: 1em 51% 1em 10px;
	}
	.point_box .point_box_04 {
		background: #fff url(images/omotenashi_img_04.png) no-repeat 50vw center;
		background-size: 50% auto;
		padding: 1em 51% 1em 10px;
	}
	.point_box section > img {
		display: none;
	}
	.point_box section h5 {
		font-size: 120%;
		font-weight: bold;
	}
}
@media screen and (min-width:768px) , print {
	.point {
		background: hsla(0,0%,0%,0.05);
		margin: 4em 0;
		padding: 2em 0;
	}
	.point h4 {
		line-height: 1.4;
		font-size: 180%;
		text-align: center;
	}
	.point_box {
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
		max-width: 1000px;
		margin: 0 auto;
	}
	.point_box section {
		width: 23%;
		font-size: 80%;
		line-height: 1.6;
	}
	.point_box section img {
		padding-bottom: .5em;
	}
	.point_box section h5 {
		text-align: center;
		font-weight: bold;
		font-size: 130%;
		margin-bottom: 0;
	}
}


/* 貸し出し備品
--------------------------------------------------------- */
@media screen and (max-width:767px) {
	.rental {
		text-align: center;
		padding: 0 10px 4em;
		font-size: 80%;
	}
	.rental h4 {
		font-size: 180%;
	}
	.rental_box {
	}
	.rental_box > p {
		line-height: 1.6;
		padding: 0 0 1.2em;
	}
	.rental_box p span {
		font-size: 80%;
	}
	.rental_box_01 {
	}
	.rental_box_01 p {
		width: 48%;
		float: left;
		padding: 0 1% 1em;
	}
}
@media screen and (min-width:768px) , print {
	.rental {
		text-align: center;
		padding: 0 0 4em;
	}
	.rental h4 {
		font-size: 200%;
	}
	.rental_box {
	}
	.rental_box > p {
		line-height: 1.6;
		padding: 0 0 1.2em;
	}
	.rental_box p span {
		font-size: 80%;
	}
	.rental_box_01 {
		max-width: 1000px;
		margin: 0 auto;
	}
	.rental_box_01 p {
		width: 19%;
		float: left;
		padding: 0 .5% 1em;
	}
}

.sdgs_amenities{
    max-width: 850px;
    margin: 40px auto 20px;
    border: solid 2px #006e4f;
    padding: 20px;
    box-sizing: border-box;
	font-size: 110%;
}
.sdgs_amenities > h3{
	color:#006e4f;
	font-size: 1.2em;
	font-weight: bold;
}
.sdgs_amenities > h3,
.sdgs_amenities > p{
	margin: 0.5em 0;
}
@media screen and (max-width: 999px) {
	.sdgs_amenities{
    max-width: 100%;
    margin: 40px 20px 20px;
}
}