@charset "utf-8";



/*main banner*/
.main-bn-swip .s1{background-image:url(../img/main/image1.jpg);}
.main-bn-swip .s2{background-image:url(../img/main/image2.jpg);}
.main-bn-swip .s3{background-image:url(../img/main/image3.jpg);}
.main-bn-swip .s4{background-image:url(../img/main/image4.jpg);}
.main-bn-swip .s5{background-image:url(../img/main/image5.jpg);}
.main-bn-swip .s6{background-image:url(../img/main/image6.jpg);}
.main-bn-swip .s7{background-image:url(../img/main/image7.jpg);}
.main-bn-swip .s8{background-image:url(../img/main/image8.jpg);}
.main-bn-swip .s9{background-image:url(../img/main/image9.jpg);}
.main-bn-swip .s10{background-image:url(../img/main/image10.jpg);}
.main-bn-swip .s11{background-image:url(../img/main/image11.jpg);}
.main-bn-swip .s12{background-image:url(../img/main/image12.jpg);}
.main-bn-swip .s13{background-image:url(../img/main/image14.jpg);}

/*intro*/
.intro{display:flex;width:1400px;margin:0 auto; padding: 120px 0; border-bottom: solid 1px rgba(0,0,0,.1); justify-content:space-between; flex-direction: row-reverse;}
.intro .con-tit{margin-bottom:40px; text-align: left;}
.intro-l{width:55%;height:490px;}
.intro-l .intro-img{width:100%;height:100%;background-image:url(../img/main/image3.jpg);background-size:cover;background-position:50% 0%;display: inline-block; filter:brightness(.95);}
.intro-r{width:45%;padding:0 30px;text-align:left;}
.intro-txt{display:flex;width:100%;height:100%; justify-content:center;align-items:baseline;flex-direction:column; text-align: left;}
.intro-txt>p{margin-bottom:40px;font-size:15px;font-weight:300;color:#333;line-height:1.75em;}


/*rooms*/
.roomslst{overflow:hidden;width:100%; padding-top: 120px; border-bottom: solid 1px rgba(0,0,0,.1);}
.roomslst_con{margin-top: 80px;}
.rooms-details{display:flex;overflow:hidden;width:1400px;height: 1000px;margin:0 auto;justify-content:space-between;}
.rooms-details .room_top, .rooms-details .room_bot{display:flex; overflow:hidden; width:49%; height: 100%; justify-content:space-between;}
.rooms-details-line{display:flex; width:48%; height:100%;flex-direction:column;justify-content:space-between;}
.rooms-details-conbx{display:flex;width:100%;background-size:cover;background-position:center center;justify-content:center;align-items:center;}
.rooms-details-conbx a{ display: block; width: 100%; height: 100%;}
.rooms-details-conbx.conbx-l{height:55%;}
.rooms-details-conbx.conbx-s{height:45%;}

.room_top .rooms-details-line:nth-child(1) .conbx-l{background-image:url(../img/main/image2.jpg); filter:brightness(.9); backface-visibility: hidden;}
.room_top .rooms-details-line:nth-child(1) .conbx-s{background-image:url(../img/sub1/image4.jpg); filter:brightness(.9); backface-visibility: hidden; background-position: 70% 50%;}
.room_top .rooms-details-line:nth-child(2) .conbx-s{background-image:url(../img/main/image3.jpg); filter:brightness(.9); backface-visibility: hidden;}
.room_top .rooms-details-line:nth-child(2) .conbx-l{background-image:url(../img/sub1/image8.jpg); filter:brightness(.9); backface-visibility: hidden; background-position: 65% 50%;}
.room_bot .rooms-details-line:nth-child(1) .conbx-l{background-image:url(http://hanokmoonstar.cdn1.cafe24.com/sub2/1/image3.jpg); backface-visibility: hidden; background-position: 35% 100%;}
.room_bot .rooms-details-line:nth-child(1) .conbx-s{background-image:url(../img/sub3/1/image3.jpg); backface-visibility: hidden; background-position: 60% 50%;}
.room_bot .rooms-details-line:nth-child(2) .conbx-s{background-image:url(http://hanokmoonstar.cdn1.cafe24.com/sub2/2/image8.jpg); backface-visibility: hidden;}
.room_bot .rooms-details-line:nth-child(2) .conbx-l{background-image:url(../img/sub3/2/image6.jpg); backface-visibility: hidden; background-position: 70% 50%;}

.rooms-details .desc{ text-align: center; margin: 20px 0 60px;}
.rooms-details .desc h2{font-size: 20px; padding-bottom: 12px;}
.rooms-details .desc p{ font-size: 12px; line-height: 1.5em;}
.rooms-details .desc{}
.roomslst_con .btn{margin:10px auto 100px; width: 180px;}



#content_05.section_07{ width: 100%; position: relative; padding: 120px 0; border-bottom: solid 1px rgba(0,0,0,.1);}
#content_05.section_07 .con-tit{ padding-bottom: 80px;}
#content_05.section_07 .inner_con{ margin: 0 auto; position: relative; width: 100%;}

#content_05.section_07 .inner_con .inner{ display: flex; width: 100%; flex-wrap:wrap; }
#content_05.section_07 .inner_con .inner .item{ width: 50%; height: 540px; display: flex; position: relative; flex-wrap:wrap; align-content: center; overflow: hidden;}
#content_05.section_07 .inner_con .inner .item>a{ width: 100%; height: 100%; display: flex; flex-wrap:wrap; align-content: center; z-index: 2;}

#content_05.section_07 .inner_con .inner .item.item1:before{content:''; width: 100%; height: 100%; background: url(../img/sub3/1/image2.jpg) 50% no-repeat; background-size: cover; position: absolute; aspect-ratio: auto 16 / 9; display: block; top: 50%; left:50%; transform:translate(-50%, -50%); filter:brightness(.3); z-index: 1; transition: all .4s ease-in-out;}
#content_05.section_07 .inner_con .inner .item.item2:before{content:''; width: 100%; height: 100%; background: url(../img/sub3/2/image6.jpg) 60% 50% no-repeat; background-size: cover; position: absolute; aspect-ratio: auto 16 / 9; display: block; top: 50%; left:50%; transform:translate(-50%, -50%); filter:brightness(.3); z-index: 1; transition: all .4s ease-in-out;}


#content_05.section_07 .inner_con .inner .item1:hover:before{ filter:brightness(.7); }
#content_05.section_07 .inner_con .inner .item2:hover:before{ filter:brightness(.7); }


#content_05.section_07 .inner_con .inner .item .text_con{ width: 100%; text-align: center; padding: 0; color:#fff; }
#content_05.section_07 .inner_con .inner .item .text_con i{ font-size: 54px; margin-bottom: 14px; text-shadow: 0 1px 3px rgba(0,0,0,1);}
#content_05.section_07 .inner_con .inner .item .text_con h2{ font-size: 34px; padding-bottom:20px; text-shadow: 0 1px 3px rgba(0,0,0,1);}
#content_05.section_07 .inner_con .inner .item .text_con h3{ padding:20px 0 10px; font-size: 14px; text-shadow: 0 1px 3px rgba(0,0,0,1);}
#content_05.section_07 .inner_con .inner .item .text_con h5{ font-size: 14px; line-height: 2em; font-family: 'Jeju Myeongjo', serif; text-shadow: 0 1px 3px rgba(0,0,0,1);}

.layout{position: absolute; top:0; height: 100%; width: 1px; background:rgba(255,255,255,.8); z-index: 1;}
.layout2{ left:50%; transform: translateX(-50%); }



/************************반응형****************************/

  

  @media screen and (min-width:1px) and (max-width:1400px){

    .intro{width:100%;padding:120px 20px;}
    .intro-r{padding:0;padding-left:20px;}

    .rooms-details{width: 100%; height: 840px;}
}

  @media screen and (min-width:1px) and (max-width:1024px){
    
    .intro{flex-direction:column;}
    .intro-l{width:100%;}
    .intro-r{width:calc(100% + 40px); margin-left: -20px; padding:0;}
    .intro-txt{padding:40px 20px 0px;}
    .intro .con-tit{margin-bottom:20px;}
    .intro-txt>p{font-size:13px;line-height:23px;}
      
      
    .roomslst_con{margin-top: 40px;}
    .rooms-details{ height: 1600px;justify-content:space-between; flex-direction: column; }
    .rooms-details .room_top, .rooms-details .room_bot{width:100%; justify-content:space-around;}
    .rooms-details-line{width:48%; height:100%;flex-direction:column;justify-content:space-between;}
      
    #content_05.section_07 .con-tit{ padding-bottom: 40px;}
}

@media screen and (min-width:1px) and (max-width:780px){
    .intro{margin:0 auto;}
    .intro-l{height:350px;}
    .intro-txt>p{font-size:12px;line-height:22px;}

    .rooms-details-conbx.conbx-s{ height: 55%; }

    #content_05.section_07 .inner_con .inner{ flex-direction: column;}
    #content_05.section_07 .inner_con .inner .layout{display: none;}
    #content_05.section_07 .inner_con .inner .item{ width: 100%; height: auto;}
    #content_05.section_07 .inner_con .inner .item.item1{ margin-bottom: 1px;}
    #content_05.section_07 .inner_con .inner .item .text_con{ padding:60px 0;}
    #content_05.section_07 .inner_con .inner .item.item1:before{ filter:brightness(.7); }
    #content_05.section_07 .inner_con .inner .item.item2:before{ filter:brightness(.7); }

}

@media screen and (min-width:1px) and (max-width:640px){
    .rooms-details{ height: 1200px;}
    .rooms-details .desc{margin: 14px 0 42px;}
    .rooms-details .desc h2{font-size: 16px; padding-bottom: 8px;}
    .rooms-details .desc p{ font-size: 11px; ;}

    .rooms-details-conbx.conbx-s{ height: 55%; }
}