@charset "utf-8";
@font-face{ font-family: 'KoPubWorldBatangB'; src: url('/fonts/KoPubWorld-Batang-Bold.woff2') format('woff2'), url('/fonts/KoPubWorld-Batang-Bold.woff') format('woff');}

html{ font-size: 20px; }
body{ font-size: 1rem; }

.container{ width: 100%;}
main{margin-top: 1.5rem;}

main .page-title{ position: relative; margin-bottom: 1.15rem; font-size: 1rem;}
main .page-title span{ padding-top: .25rem; font-size: .6rem;}
main .main-img{ margin: 0 .5rem; width: calc(100% - 1rem); height: auto;}
main article{ padding: 1.5rem 0; margin: 0 .5rem; border-bottom-width: .05rem;}
main article:last-child{ padding-bottom: 3.5rem;}
main article .content-title{ margin-bottom: .75rem; font-size: .8rem;}
main article p{ padding-left: .4rem; margin-bottom: .5rem; font-size: .6rem;; text-indent: -0.4rem;}
main button{ margin: 0 .5rem 2.5rem; width: 3.5rem;}
main button a{ line-height: 1.5rem; font-size: .6rem;}
main .place-info{ padding: 0 0 3.25rem;}
main .place-info p{ padding: 1.5rem 0; margin-bottom: 1.25rem; border-bottom-width: .05rem; font-size: .6rem; text-indent: 0;}
main .place-info.restaurant button{ display: block; position: static; margin: .75rem 0 0 auto; width: 3.5rem;}
main .place-info.restaurant button a{ font-size: .6rem; line-height: 1.5rem;}
main .place-info table tbody tr{ display: grid; grid-template-columns: 4.5rem 1fr;}
main .place-info table tbody tr th, main .place-info table tbody tr td{ padding: .25rem .5rem; font-size: .6rem;}
main .place-info table tbody tr th{ width: calc(100% - 1rem);}
main .place-info table tbody tr td{ width: calc(100% - 1rem);}
main .place-info.wedding button{ display: block; position: static; margin: .75rem 0 0 auto; width: 8rem;}
main .place-info.wedding button{ font-size: .6rem; line-height: 1.5rem;}

.side-tab-bar{ margin: 1rem .5rem 0;}
.side-tab-bar li{ border-width: .05rem;}
.side-tab-bar li a{ font-size: .5rem; line-height: 1.4rem;}
.side-tab-bar li:first-child{ border-radius: 1.25rem 0 0 1.25rem;}
.side-tab-bar li:last-child{ border-radius: 0 1.25rem 1.25rem 0;}
.side-tab-bar.amenities{ flex-wrap: wrap; gap: .5rem 0;}
.side-tab-bar.amenities li{ flex-basis: 32%;}
.side-tab-bar.amenities li:nth-child(3n){ border-radius: 0 1.25rem 1.25rem 0;}
.side-tab-bar.amenities li:nth-child(3n+1){ border-radius: 1.25rem 0 0 1.25rem;}

main::before,
main::after{ content: ""; display: block; clear: both;}

/* greetings */
main .greetings-content{ margin: 1.5rem .5rem 3.65rem; font-size: .7rem;}

/* information */
main .cancel-policy p{ padding-left: .4rem; text-indent: -0.4rem; }
main .main-img.info{ width: calc(100% - 1rem);}
main .info-location{ display: block; padding: .75rem 1rem; margin: 1.5rem .5rem 0; border: .1rem solid #998465;}
main .info-location li{ padding-left: 1.5rem; padding-bottom: .5rem; font-size: .7rem;}
main .info-location li:last-child{ padding-bottom: 0;}
main .info-location li::before{ width: 1rem; height: 1rem; background-size: 1rem 1rem;}

/* location */
#map{ margin: 0 .5rem; width: calc(100% - 1rem); height: 10rem;}
main .address{ padding: .75rem .6rem; margin: 1.5rem .5rem 0; border-width: .1rem; font-size: .7rem; color: #3E2B2C; line-height: 1rem;}
main .address span{ display: block; padding-left: 0;}
main .car .content-title::before{ content: ""; display: inline-block; padding-right: .35rem; width: 1.0665rem; height: .8rem; background: url("../img/introduce/location/car_icon.png") no-repeat; background-size: 1.0665rem .8rem;}
main .bus .content-title::before{ content: ""; display: inline-block; padding-right: .35rem; width: .8rem; height: .8rem; background: url("../img/introduce/location/bus_icon.png") no-repeat; background-size: .8rem .8rem;}
main .train .content-title::before{ content: ""; display: inline-block; padding-right: .35rem; width: .744rem; height: .85rem; background: url("../img/introduce/location/train_icon.png") no-repeat; background-size: .744rem .85rem;}

/* tourist-spots */
main .spot-list{ padding-top: 0; }
main .spot-list ul{ grid-template-columns: 1fr; gap: normal;}
main .spot-list ul li{ margin: 0 auto 3rem; width: 17rem; height: 17rem;}
main .spot-list ul li img{ height: 10rem;}
main .spot-list ul li h4{ padding: .75rem .55rem; font-size: .9rem;}
main .spot-list ul li h4 a{ top: 1.05rem; right: .55rem; font-size: .5rem;}
main .spot-list ul li p{ padding: 0 .55rem; text-indent: 0;}

@media screen and (max-width: 360px){
	main .spot-list ul li{ width: 100%;}
}

/* tourist-spots-detail */
main .spot-detail{ padding-bottom: 1.5rem; border: 0; }
main .spot-detail p{ padding-left: .6rem; text-indent: -.4rem; }
.swiper.gallary-swiper{ margin: 0 .5rem; width: calc(100% - 1rem); height: auto;}
.swiper.gallary-swiper .swiper-button-next::after{content: url("/img/slideButtonNext.png"); font-size: 0;}
.swiper.gallary-swiper .swiper-button-prev::after{content: url("/img/slideButtonPrev.png"); font-size: 0;}
.swiper.thumbs-swiper{ margin: 3px .5rem 0; width: calc(100% - 1rem); height: 150px;}
.swiper.thumbs-swiper .swiper-slide{ position: relative; filter: brightness(60%); box-sizing: border-box;}
.swiper.thumbs-swiper .swiper-slide-thumb-active{ border: 7px solid #fff; filter: brightness(100%);}
.swiper.thumbs-swiper .swiper-slide-thumb-active::before{ content: ""; position: absolute; top: -7px; bottom: -7px; left: -7px; right: -7px; border: 2px solid #856F57; background-color: transparent;}
.swiper-slide img{ display: block; width: 100%; height: 100%; object-fit: cover;}

/* contact_us */
main .contact-foreword{ padding-left: 0; margin: 1.6rem .5rem 1.7rem; font-size: .6rem;}
main .qna{ padding: 0 0 1rem;}
main .qna table thead tr th{ border-bottom-width: .05rem;}
main .qna table thead tr th h4{ padding: 0 0 .25rem; font-size: .8rem;}
main .qna table tbody tr th{ padding: .25rem 0; width: 5rem; font-size: .6rem;}
main .qna table tbody tr td{ padding: .25rem 0;}
main .qna table tbody tr td input[type=text], main .qna table tbody tr td select, main .qna table tbody tr td textarea{ width: 5rem; height: 1rem; border-width: .05rem; font-size: .6rem; text-indent: .4rem;}
main .qna table tbody tr td textarea{ width: 100%; height: 10rem;}
main .qna table tbody tr td span{ padding: 0 .2rem; font-size: .75rem; line-height: 1rem;}
main .qna table tbody tr td label{ padding-right: .75rem; margin-left: 1.5rem; font-size: .6rem;}
main .qna table tbody tr:nth-child(1) th,main .qna table tbody tr:nth-child(1) td{ padding-top: .5rem; }
main .qna table tbody tr:nth-child(2) select{ width: 2.25rem;}
main .qna table tbody tr:nth-child(2) input[type=text]{ width: 3rem;}
main .qna table tbody tr:nth-child(3) select{ width: 5.7rem;}
main .qna table tbody tr:nth-child(5) textarea{ height: 3.5rem;}
main .qna table tbody tr:nth-child(6) p{ top: .25rem; left: 0; font-size: .6rem;}

/* special_offers */
main .offer-list ul{ grid-template-columns: 1fr; gap: normal;}
main .offer-list ul li{ margin: 0 auto 1.5rem; width: 17rem; height: 22.75rem;}
main .offer-list ul li a img{ height: 12.75rem;}
main .offer-list ul li a h4{ padding: 1rem 1rem .75rem; font-size: .8rem;}
main .offer-list ul li a p{ padding: 0 0 .45rem 0; margin: 0 1rem; height: 3.6rem; border-bottom-width: .05rem; font-size: .6rem; line-height: .9rem; text-indent: 0;}
main .offer-list ul li a p:last-child{ padding: .75rem 0 0 0;}

@media screen and (max-width: 360px){
	main .offer-list ul li{ width: 100%;}
}

/* special_offers_detail */
main .offer-detail{ margin-bottom: 1.5rem; min-height: auto; border-width: .05rem;}


/* natural_alkaline_sauna */
@media screen and (max-width: 720px){
	main .sauna table tbody tr:nth-child(2) th,main .sauna table tbody tr:nth-child(2) td{ height: auto;}
}

/* accommodation */
main .room-list{ margin-bottom: 0;}
main .room-list ul{grid-template-columns: 1fr; grid-gap: 0;}
main .room-list li{ margin-bottom: 1.5rem;}
main .room-list li a img{ width: 100%; transition: none;}
main .room-list li a:hover img{ transform: none; filter: brightness(100%);}
main .room-list li a span::before{ content: none;}
main .room-list li a span::after{ content: none;}
main .room-list li:last-child{ margin-bottom: 0;}


/* room (공통) */
.room-tab-bar{ margin: 1rem .5rem 0;}
.room-tab-bar li{ border-width: .05rem;}
.room-tab-bar li a{ font-size: .5rem; line-height: 1.4rem;}
.room-tab-bar li:first-child{ border-radius: 1.25rem 0 0 1.25rem;}
.room-tab-bar li:last-child{ border-radius: 0 1.25rem 1.25rem 0;}
.room-tab-dual-bar{ margin: 1rem .5rem 0;}
.room-tab-dual-bar li{ border-width: .05rem;}
.room-tab-dual-bar li a{ font-size: .5rem; line-height: 1.4rem;}
.room-tab-dual-bar li:first-child{ border-radius: 1.25rem 0 0 1.25rem;}
.room-tab-dual-bar li:last-child{ border-radius: 0 1.25rem 1.25rem 0;}
main .room-detail{ padding-bottom: 3.5rem;}
main .room-detail h4{ font-size: .8rem;}
main .room-detail h5{ padding: 1.5rem .5rem; width: 3.5rem; font-size: .6rem;}
main .room-detail h5:nth-of-type(1){ padding-bottom: .75rem;}
main .room-detail > p{ padding-left: .5rem; margin: 1rem 0 1.5rem;}
main .room-detail > button{ top: 1.5rem; }
main .room-detail .room-info{ border-top-width: .05rem; border-bottom-width: .05rem;}
main .room-detail .room-info tbody tr{ display: grid; grid-template-columns: 4rem 1fr;}
main .room-detail .room-info tbody tr th{ padding: .25rem .5rem; width: 3rem; font-size: .6rem;}
main .room-detail .room-info tbody tr td{ padding: .25rem .5rem; width: auto; font-size: .6rem;}
main .room-detail .room-info tbody tr:first-child th,main .room-detail .room-info tbody tr:first-child td{padding-top: .25rem;}
main .room-detail .room-info tbody tr:first-child th:first-child,main .room-detail .room-info tbody tr:first-child td:nth-child(2){padding-top: 1.5rem;}
main .room-detail .room-info tbody tr:last-child th,main .room-detail .room-info tbody tr:last-child td{padding-bottom: .25rem;}
main .room-detail .room-info tbody tr:last-child th:nth-last-child(2),main .room-detail .room-info tbody tr:last-child td:last-child{padding-bottom: 1.5rem;}
main .room-detail .room-facilty{ display: block; width: 100%;}
main .room-detail .room-facilty tbody tr{ display: inline-block; vertical-align: top;}
main .room-detail .room-facilty tbody tr:nth-child(2n){ width: calc(100% - 4.5rem);}
main .room-detail .room-facilty tbody tr th{ padding: .25rem .25rem .25rem .5rem; width: 3.75rem; font-size: .6rem;}
main .room-detail .room-facilty tbody tr td{ padding: .25rem 0; font-size: .6rem;}
main .room-detail .room-facilty tbody tr:first-child th{ padding-top: .25rem;}
main .room-detail .room-facilty tbody tr:last-child td{ padding-bottom: 1.5rem;}
main .room-detail .equipped-list-bar{ display: flex; flex-wrap: wrap; padding: .8rem .5rem 1.5rem; border-top-width: .05rem; border-bottom-width: .05rem;}
main .room-detail .equipped-list-bar li{ display: inline-block; margin-top: .3rem; margin-right: 0;}
main .room-detail .equipped-list-bar li span{ padding-top: 4.9rem; width: 4.5rem; font-size: .7rem; line-height: 1rem; white-space: nowrap;}
main .room-detail .equipped-list-bar li span::before{ top: calc(50% - .5rem);}
main .room-detail .attention-content{ width: calc(100% - 4.95rem); padding: 1.5rem .2rem 0 .25rem; font-size: .6rem; text-indent: 0;}

main .other-room{ padding: 0 0 3.5rem;}
main .other-room h4{ padding-bottom: 1.5rem; font-size: .8rem;}
main .other-room .other-room-swiper{height: 250px;}
main .other-room .other-room-swiper img{ height: 6.25rem; }
main .other-room .other-room-swiper figcaption{ padding-top: .5rem; font-size: .6rem;}
main .other-room .other-room-swiper .swiper-button-next,
main .other-room .other-room-swiper .swiper-button-prev{ margin: auto; height: auto; top: 50%; transform: translateY(-50%); }

/* 사이트 맵 */
.sitemap-container > ul{ grid-template-columns: repeat(2,1fr); padding: 0 0 .25rem .5rem; border-bottom: .05rem solid #707070;}
.sitemap-container > ul > li{ padding-bottom: .75rem; font-size: 0;}
.sitemap-container > ul > li a{ font-size: .6rem;}
.sitemap-container > ul > li > a::before{ padding-right: .5rem;}
.sitemap-container > ul > li ul{ padding: .75rem 0 0 .75rem;}
.sitemap-container > ul > li ul li{ padding-bottom: .75rem;}
.sitemap-container > ul > li ul li a{ font-size: .6rem;}
.sitemap-container > ul > li:first-child{ grid-column: 1 / span 2; padding: 1rem 0 .75rem;}
.sitemap-container > ul > li:first-child h3 a{ font-size: .8rem;}
.sitemap-container > ul > li:last-child{ padding-bottom: .75rem;}