@charset "UTF-8";

/*인사말*/
.intro_bg {background:url('/WebContent/design/sunbichon/img/sub/intro1.jpg') repeat-y top center / cover;}
.intro {text-align:center; position:relative; }
.intro .top .lg {font-size:32rem; font-family:'Godo', sans-serif; font-weight:600; color:var(--p_color); line-height:1.45;}
.intro .top .md {font-size:24rem; font-family:'Godo', sans-serif; font-weight:400; margin-top:10rem;}
.intro .list {margin-top:40rem;}
.intro .list li { margin-bottom:40rem;}
.intro .list li strong {display:block; font-size:24rem; font-weight:600; font-family:'Godo', sans-serif; color:#453313; }
.intro .list li strong::before {content:''; display:block; margin:0 auto; flex-shrink:0; flex-grow:0; width:32rem; height:33rem; margin-bottom:20rem;  background:url('/WebContent/design/sunbichon/img/sub/intro2.png') no-repeat 0 0/contain;}
.intro .list li p {color:#5b5b5b; margin:10rem auto;}
@media all and (max-width:1023px){
  .intro .top .lg {font-size:28rem;}
  .intro .top .md {font-size:20rem;}
  .intro .list li strong {font-size:20rem;}
}
@media all and (max-width:599px){
  .intro .top .lg {font-size:26rem;}
  .intro .list li strong::before {width:24rem; height:25rem;}
}

/*이용안내*/
.guide .top {text-align:center;}
.guide .top .lg {font-size:32rem; font-family:'Godo', sans-serif; font-weight:600; color:var(--p_color); line-height:1.45;}
.guide .top .md {font-size:24rem; font-family:'Godo', sans-serif; font-weight:400; margin-top:10rem;}
.guide .open {margin-top:40rem; margin-bottom:15rem;}
.guide .open ul {display:flex; margin:-7rem;}
.guide .open ul li {display:flex; flex-direction:column; align-items:center; width:calc(33.333% - 14rem); margin:7rem; border:1px solid #ddd; padding:30rem; border-radius:6rem;}
.guide .open span {display:block;  line-height:1.5;}
.guide .open .season {font-size:24rem; font-weight:600;}
.guide .open .month {font-size:18rem; color:#565656;}
.guide .open .time {font-size:32rem; font-weight:600; color:#985915; margin-top:10rem;}
@media all and (max-width:1023px){
  .guide .top .lg {font-size:28rem;}
  .guide .top .md {font-size:20rem;}
  .guide .open .season {font-size:22rem; font-weight:600;}
  .guide .open .month {font-size:17rem; color:#565656;}
  .guide .open .time {font-size:28rem; font-weight:600; color:#985915; margin-top:10rem;}
}
@media all and (max-width:768px){
  .guide .open ul {flex-wrap:wrap;}
  .guide .open ul li {width:100%;}
}
@media all and (max-width:599px){
  .guide .top .lg {font-size:26rem;}
}

/*선비촌둘러보기*/
.around_bg {background:#d6e9ea;}
.around {text-align:center; position:relative; background:url('/WebContent/design/sunbichon/img/sub/around2.png') no-repeat center 100rem;}
.around .tree span {position:absolute; display:block;}
.around .tree span.left {top:4%; left:-1%; width:303rem; height:293rem; background:url('/WebContent/design/sunbichon/img/sub/tree2.png') no-repeat 0 0/contain;}
.around .tree span.right {top:-17%; right:-1%; width:319rem; height:308rem; background:url('/WebContent/design/sunbichon/img/sub/tree1.png') no-repeat 0 0/contain;}
.around .cloud span {position:absolute; display:block; background:url('/WebContent/design/sunbichon/img/sub/cloud1.png') no-repeat 0 0/contain; width:162rem; height:88rem;}
.around .cloud span.left {top:50%; left:10%;}
.around .cloud span.right {top:60%; right:10%;}
.around .txt {font-family:'Godo', sans-serif; max-width:1023rem; margin:0 auto;}
.around .txt .lg {font-size:32rem; font-weight:600; color:#073e41; margin-bottom:20rem;}
.around .txt .sm {font-size:18rem;}
@media all and (max-width:1440px){
  .around .tree {display:none;}
  .around .txt {max-width:100%; padding:0 30rem;}
}
@media all and (max-width:1280px){
  .around .cloud {display:none;}
}
@media all and (max-width:599px){
  .around {background-position:center top; background-size:cover;}
  .around .txt .lg {font-size:26rem;}
  .around .txt .sm {font-size:16rem;}
}

/*전통혼례/스몰웨딩/돌잔치*/
.ceremony {position: relative; padding-bottom: 400rem;}
.ceremony .top {text-align:center; padding:60rem 30rem; box-shadow: 0 0 10rem rgba(0,0,0,0.2); background: #ffffff;}
.ceremony .top .lg {margin:0; font-size:32rem; font-family:'Godo', sans-serif; font-weight:600; color:var(--p_color); line-height:1.45;}
.ceremony .top .md {font-size:17rem; margin-top:20rem;}
.ceremony .top .contact {margin: 16rem auto; font-family:'Godo', sans-serif; font-size: 24rem; font-weight: 600;}
.ceremony_slide {position: absolute; top: 350rem; z-index: -1; width: 100vw; left: 50%; transform: translateX(-50%);}
@media all and (max-width:1600px){
  .ceremony { padding-bottom: 200rem;}
}
@media all and (max-width:1023px){
  .ceremony .top .lg {font-size:28rem;}
}
@media all and (max-width:768px) {
  .ceremony_slide {top: 400rem;}
}
@media all and (max-width:680px) {
  .ceremony_slide {top: 450rem;}
}
@media all and (max-width:599px){
  .ceremony .top .lg {font-size:26rem;}
  .ceremony .top .sm {font-size:16rem;}
}

/*고택소개*/
.old_house .top {text-align:center; border-bottom:1px dashed #ddd; padding-bottom:60rem;}
.old_house .top span {font-size:100rem; color:#c7d4ee; letter-spacing:-3rem; line-height:1;}
.old_house .top .lg {margin:30rem 0 0 0; font-size:32rem; font-family:'Godo', sans-serif; font-weight:600; color:var(--p_color); line-height:1.45;}
.old_house .top .md {font-size:17rem; font-family:'Godo', sans-serif; font-weight:400; margin-top:20rem;}
.old_house .flex {display:flex; justify-content:space-between; margin-top:80rem;}
.old_house .flex .left {width:calc(50% - 30rem); }
.old_house .flex .left .slick-slide {position:relative;}
.old_house .flex .left .slick-slide span {position:absolute; bottom:0; right:0; background:rgba(0,0,0,0.7); color:#fff; display:inline-block; padding:10rem; font-size:14rem;}
.old_house .flex .left .slick-slide img {width:100%; height:300rem; object-fit:cover;}
.old_house .flex .right {width:calc(50% - 30rem);}
.old_house .flex .right .tit {font-size:26rem; font-family:'Godo', sans-serif; font-weight:600;}
.old_house .flex .right .txt {margin:20rem 0 0 3rem; }
.old_house .flex:nth-child(odd) .left {order:1;}
.old_house .flex:nth-child(odd) .right {order:0;}
.old_house .slick-arrow {position:absolute; top:-40rem; z-index:2; display:block; width:40rem; height:40rem; background:#EFF4FF url('/WebContent/design/sunbichon/img/layout/icon_control.svg') no-repeat 100% 0/500% auto; text-indent:-9999rem; border:0;}
.old_house .slick-arrow.slick-prev {background-position:0 0; right:40rem;}
.old_house .slick-arrow.slick-next {background-position:75% 0; right:0}
@media all and (max-width:1023px){
  .old_house .top span {font-size:80rem;}
  .old_house .top .lg {font-size:28rem;}
}
@media all and (max-width:768px){
  .old_house .flex {flex-wrap:wrap;}
  .old_house .flex .left {width:100%;}
  .old_house .flex .right {width:100%; margin-top:30rem;}
  .old_house .flex:nth-child(odd) .left {order:0;}
  .old_house .flex:nth-child(odd) .right {order:1;}
}
@media all and (max-width:599px){
  .old_house .top .lg {font-size:26rem;}
  .old_house .top .sm {font-size:16rem;}

}

/*예약하기*/
.reserve {position: relative;}
.reserve .go_btn {position: fixed; right: 20rem; bottom: 80rem; z-index: 6; opacity: 1; visibility: visible; transition: opacity 0.2s ease, visibility 0.2s ease, bottom 0.2s ease; padding: 8rem 16rem; background: #fff; border-radius: 6rem; border: 1px solid var(--p_color); color: var(--p_color); font-weight: 600;}
.reserve .go_btn.hide { opacity: 0; visibility: hidden; pointer-events: none;}
.reserve .top {border-bottom:1px dashed #ddd; padding-bottom:60rem; display:flex; justify-content:space-between;}
.reserve .top .left {width:calc(50% - 30rem); }
.reserve .top .left .slick-slide {position:relative;}
.reserve .top .left .slick-slide span {position:absolute; bottom:0; right:0; background:rgba(0,0,0,0.7); color:#fff; display:inline-block; padding:10rem; font-size:14rem;}
.reserve .top .left .slick-slide img {width:100%; height:300rem; object-fit:cover;}
.reserve .top .lg {margin:30rem 0 0 0; font-size:32rem; font-family:'Godo', sans-serif; font-weight:600; color:var(--p_color); line-height:1.45;}
.reserve .top .md {font-size:17rem; font-weight:400; margin-top:20rem;}
.reserve .top .right {width:calc(50% - 30rem);}
.reserve .top .slick-arrow {position:absolute; top:50%; transform: translateY(-50%); z-index:2; display:block; width:40rem; height:40rem; background:#EFF4FF url('/WebContent/design/sunbichon/img/layout/icon_control.svg') no-repeat 100% 0/500% auto; text-indent:-9999rem; border:0;}
.reserve .top .slick-arrow.slick-prev {background-position:0 0; left:0;}
.reserve .top .slick-arrow.slick-next {background-position:75% 0; right:0}
.reserve .info {display: flex; flex-wrap: wrap; gap: 20rem; justify-content: center;}
.reserve .info > li {width: calc((100% - 180rem)/10); min-width: 85rem; text-align: center;}
.reserve .info > li p::before {content: ''; display: block; width: 100%; height: 115rem; background: url('/WebContent/design/sunbichon/img/sub/reserveinfo.jpg') no-repeat 0 center/1000%;}
.reserve .info > li.icon01 p::before {background-position-x: 0;}
.reserve .info > li.icon02 p::before {background-position-x: 11.11%;}
.reserve .info > li.icon03 p::before {background-position-x: 22.22%;}
.reserve .info > li.icon04 p::before {background-position-x: 33.33%;}
.reserve .info > li.icon05 p::before {background-position-x: 44.44%;}
.reserve .info > li.icon06 p::before {background-position-x: 55.55%;}
.reserve .info > li.icon07 p::before {background-position-x: 66.66%;}
.reserve .info > li.icon08 p::before {background-position-x: 77.77%;}
.reserve .info > li.icon09 p::before {background-position-x: 88.88%;}
.reserve .info > li.icon10 p::before {background-position-x: 100%;}
@media all and (max-width:1300px) {
  .reserve .info > li p::before {height: 100rem;}
}
@media all and (max-width:1023px){
  .reserve .top .lg {font-size:28rem;}
}
@media all and (max-width:768px) {
  .reserve .top {flex-wrap:wrap;}
  .reserve .top .left {width:100%;}
  .reserve .top .right {width:100%; margin-top:30rem;}
  .reserve .info > li p::before {height: 80rem;}
  .reserve .go_btn {right: 0; bottom: 60rem; width: 60rem; height: 60rem; word-break: break-all; border: none; background: var(--p_color); color: #ffffff; line-height: 1.3; font-weight: 600;}
  #content .reserve .go_btn::after {display: none;}
}
@media all and (max-width:599px){
  .reserve .top .lg {font-size:26rem;}
  .reserve .top .sm {font-size:16rem;}
}