@charset "utf-8";
.roomList { position:absolute; width:50%; min-height:110%; left:0; bottom:0; padding:5% 4% 2%; background:#6e5f4e; z-index:1;}
.roomList_list {
  touch-action: pan-y; /* 수직 스크롤 허용 */
  -ms-touch-action: pan-y; /* IE/Edge 대응 */
}
.main .roomList {min-height:108%;}
.roomList dl {  }
.roomList dt {font-family: 'Montserrat', sans-serif; font-size:1.25em; line-height:2em; margin-bottom:2em; letter-spacing:0.05em; opacity:0.5; filter: alpha(opacity=50;);}
.roomList dd {position:relative;}
.bx-wrapper { position:relative;}
.roomList .bx-viewport { height: 47.1vw !important}
.bx-controls { position:absolute; top:-40px; right:50%;  }
.bx-controls a { display:inline-block; margin-left:15px; opacity:0.5; filter: alpha(opacity=50;);}
.bx-controls a i { font-size:30px;}
.listCon { display:table; margin-bottom:5% !important;}
.listCon p { display:table-cell; width:50%; vertical-align:middle; }
.listCon a.img { display:block; overflow:hidden; height: 100%;}
.listCon a.img img { width:100%; max-width:407px; vertical-align:top; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.listCon a.img:hover img {-ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05);}
.listCon p.con {padding:5% 0 0 8%;}
.listCon p.con a > span { display:block; color:#fff;}
.listCon p.con .title { font-family: "source-han-serif-korean", 'Jeju Myeongjo',serif; font-size:1.65em; line-height:2em;  font-weight:200;}
.listCon p.con .text { font-weight:100; line-height:1.5em; margin:5% 0 18%; opacity:0.6; filter: alpha(opacity=60;); }
.listCon p.con .view {display:block; color:#fff;}
.listCon p.con .view span { display:inline-block; width:50%; height:1px; background:rgba(255,255,255,0.5); vertical-align:middle; margin-right:10px;}


@media  (max-width: 1420px){
.listCon p.con .title {font-size:1.35em; line-height:1.5em;}
.listCon p.con .text {font-size:0.9em; margin:3% 0 12%;}
.listCon p.con .view span { width:40%; }

}

@media  (max-width: 1024px){
.roomList { padding:3% 3% 2.5%;}
.roomList_list {
  max-height: 90vh;
  /* overflow-y: auto; */
}
.roomList .bx-viewport { height: 43vw !important}
.bx-controls { top:-40px; right:0;}
.listCon { margin-bottom:8% !important;}
.listCon a.img {width:100%}
.listCon p.con {
    width:60%; 
    padding:2% 0 0 5%;
}

.listCon p.con .title {font-size:1.15em; line-height:1.3em;}
.listCon p.con .text {font-size:0.8em; margin:3% 0 6%;}
}

@media  (max-width: 768px){

.roomList { position:relative; width:80%; min-height:auto !important; margin:-10% 0 0 20%; z-index:4;}
.roomList dt { line-height:1.2em; margin-bottom:5%; }
.roomList .bx-viewport { height:57.5vw !important;}
.listCon { margin-bottom:3% !important;}
.listCon a.img {width:100%}
.listCon p.con {width:65%; padding:0 0 0 5%;}
.listCon p.con .text {font-size:0.75em; margin:2% 0 2%;}
/*.listCon p.con .view { display:none;}*/
}

@media  (max-width: 480px){

.roomList { width:90%; margin:-10% 0 0 10%;}
.roomList .bx-viewport { height:65.5vw !important;}
.listCon p.con .title {font-size:1.05em; }
.listCon p.con .text {font-size:0.7em;}
}