/* rooms visual */ #rooms_visual{position:relative; text-align:center; width:100%; padding:0; margin:0px auto; overflow:hidden; } #rooms_visual:after{ content:""; display:block; clear:both;} #rooms_visual .swiper-slide-active div.backgroundimg{opacity: 1; -ms-transform: scale(1, 1) rotate(.001deg); -webkit-transform: scale(1, 1) rotate(.001deg); transform: scale(1, 1) rotate(.001deg); -webkit-transition-delay: 0s; transition-delay: 0s;} #rooms_visual .sliderkit-text {width:100%; height:220px; position:absolute; bottom:18%; left:50%; margin-left:-50%; text-align:center; z-index:2;} #rooms_visual .sliderkit-text h1.lviewa{opacity:0; font-size:4em; color:#fff; font-weight:500; line-height:1.3em; letter-spacing:-0.05em; text-shadow: 0px 0px 10px rgba(0,0,0,.2); padding-bottom:10px; font-family: 'Noto Serif KR', sans-serif;} #rooms_visual .sliderkit-text h1.sviewa{opacity:0; font-size:1.3em; color:#fff; letter-spacing:0.01em; line-height:1.3em;/* text-shadow: 0px 1px 4px #000;*/ padding-bottom:10px; font-family: 'Noto Serif KR', sans-serif;} #rooms_visual .sliderkit-text div{opacity:0; margin-top:10px;} #rooms_visual .sliderkit-text div button{border:1px solid #fff; background:none; color:#fff; width:120px; height:30px; line-height:28px; font-size:1em; text-align:center; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #rooms_visual .sliderkit-text div button:hover{background-color:#000; border:1px solid #000;} #rooms_visual .swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:20px; top:50%; margin-top:-25px; display:block; background:url("../image/visual_prev_on.png") center left no-repeat; opacity : 0.7; width:50px; height:50px; color:rgba(255,255,255,0); transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #rooms_visual .swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:20px; top:50%; margin-top:-25px; display:block; background:url("../image/visual_next_on.png") center right no-repeat; opacity : 0.7; width:50px; height:50px; color:rgba(255,255,255,0); transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #rooms_visual .swiper-button-prev:hover,.swiper-container-rtl .swiper-button-next:hover{opacity :1; } #rooms_visual .swiper-button-next:hover,.swiper-container-rtl .swiper-button-prev:hover{opacity :1; } #rooms_visual .swiper-container-horizontal > .swiper-pagination-bullets{bottom:15%;} #rooms_visual .swiper-pagination-bullet-active{background-color:#fff;} /* rooms List Type01 */ #roomsListType01{width:100%; max-width:1600px; margin:0px auto; overflow:hidden; margin-bottom:0px;} #roomsListType01 .con_title {text-align:center; margin-bottom:50px;} #roomsListType01 .con_title h3 { display:block; font-size:2em; font-weight:700; color:#000; line-height:1em;} #roomsListType01 .con_title p { display:block; font-size:1.25em; color:#555; margin-top:20px;} #roomsListType01 #pro_bnr{margin-left:-30px;} #roomsListType01 #pro_bnr .pro_box{float:left; width:calc(25% - 30px); margin-left:30px; margin-bottom: 30px; -webkit-transform: translate3d(0, 0, 0); display:block;} #roomsListType01 #pro_bnr .pro_box img{width:100% ; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease; } #roomsListType01 #pro_bnr .pro_box:hover img{opacity:1; filter: alpha(opacity=100); -webkit-filter: grayscale(100%); filter: gray;} #roomsListType01 #pro_bnr .pro_box .pro_txt{display:block; position:absolute; bottom:0; width:100%; height:35px; line-height:35px; background-color:rgba(0,0,0,0.55); text-align:center; color:#fff; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease; } #roomsListType01 #pro_bnr .pro_box .pro_txt p{display:block; height:35px; line-height:35px; width:100%; font-size:1em; color:#fff; text-align:center; } #roomsListType01 #pro_bnr .pro_box .pro_txt p span {display:none; font-size:0.95em; color:#fff; line-height:1.5em; margin-top:10px;} #roomsListType01 #pro_bnr .pro_box .pro_txt button{opacity:0; position:absolute; bottom:10px; right:10px; border:0px; font-size:2em; color:#fff; line-height:1.5em; background:none; font-family: 'Lobster', cursive; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease; } #roomsListType01 #pro_bnr .pro_box:hover .pro_txt{opacity:1; width:100%; height:100%; bottom:0; left:0; } #roomsListType01 #pro_bnr .pro_box:hover .pro_txt p{position:absolute; top:50%; margin-top:-30px;} #roomsListType01 #pro_bnr .pro_box:hover .pro_txt p span{display:block;} #roomsListType01 #pro_bnr .pro_box:hover .pro_txt button{opacity:1;} /* rooms List Type02 */ #roomsListType02 { width:100%; max-width:1300px; margin:0 auto; } #roomsListType02:after{ content:""; display:block; clear:both;} #roomsListType02 .rooms_list { position:relative; width:100%; margin-bottom:50px;} #roomsListType02 .rooms_list:after{ content:""; display:block; clear:both;} #roomsListType02 .rooms_list:last-child {margin-bottom:0;} #roomsListType02 .rooms_list .img_left { float:left; width:600px; background-color:#000;} #roomsListType02 .rooms_list .img_left img { width:100%; } #roomsListType02 .rooms_list .img_right { float:right; width:600px; background-color:#000;} #roomsListType02 .rooms_list .img_right img { width:100%; } #roomsListType02 .rooms_list .txt_area { position: absolute; right:0; top:0px; width:48%; height:100%; padding:0; background-color:rgba(255,255,255,.95);} #roomsListType02 .rooms_list .txt_area:after{ content:""; display:block; clear:both;} #roomsListType02 .rooms_list .txt_area h4.b_tit{ display:block; height:50px; line-height:50px; font-size:1.85em; font-weight:600; color:#000; margin-bottom:20px; } #roomsListType02 .rooms_list .txt_area table.rooms_tbl{ width:100%; border-collapse:separate; *border-collapse:collapse; border-spacing:0; box-sizing:border-box;} #roomsListType02 .rooms_list .txt_area table.rooms_tbl tr th{ width:25%; color:#555; text-align:left; font-size:1em; font-weight:500; padding-left:10px; border-bottom:1px solid #777; } #roomsListType02 .rooms_list .txt_area table.rooms_tbl tr th.s_tit {position:relative; } #roomsListType02 .rooms_list .txt_area table.rooms_tbl tr th.s_tit:before {content:""; width:3px; height:3px; position:absolute; left:0; top:50%; border-bottom:1px solid #ddd; background-color:#d59337; } #roomsListType02 .rooms_list .txt_area table.rooms_tbl tr td{ width:75%; color:#555; font-size:1em; padding:10px 20px; word-break:keep-all; border-bottom:1px solid #ddd; } #roomsListType02 .rooms_list .type_other { position: absolute; left: 0; top:0; width:48%; height:100%; padding:0; background-color:rgba(255,255,255,.95); } #roomsListType02 .btn{width:100%; margin:0 auto; text-align:center; font-size:1em; font-weight:normal;} #roomsListType02 .rooms_btn_more {display:inline-block; margin:25px 5px; width:150px; height:40px; line-height:40px; color:#000; border:1px solid #000; text-align:center; font-size:1em; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #roomsListType02 .rooms_btn_more:hover{color:#fff; background-color:#000;} #roomsListType02 .rooms_btn_more_re {display:inline-block; margin:25px 5px; width:150px; height:40px; line-height:40px; color:#fff; background-color:#293d6b; border:1px solid #293d6b; text-align:center; font-size:1em; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #roomsListType02 .rooms_btn_more_re:hover{color:#fff; background-color:#000; border:1px solid #000;} #roomsListType02 .rooms_list .swiper-pagination{bottom:15px;} #roomsListType02 .rooms_list .swiper-slide img{width:100%;} /* rooms List Type03 */ #roomsListType03 .thumbs-gallery {width:100%; padding:0px 0;} #roomsListType03 .thumbs-gallery .swiper-container { width:100%; max-width:1500px; margin-left: auto; margin-right: auto; background-color:#fff; border:1px solid #ddd;} #roomsListType03 .thumbs-gallery .swiper-slide { width:100%; background-size: cover; background-position: center; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-left {float:left; width:50%; height:590px;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-left:after { content:""; display:block; clear:both;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-left img {width:100%; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right {float:right; display:table; width:50%; height:590px; padding:0 50px; text-align:center; background-color:#fafafa;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right:after { content:""; display:block; clear:both;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner {display:table-cell; vertical-align:middle; width:100%; height:100%; text-align:center;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoTitle {display:block;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoTitle h4 { display:block; font-size:2em; font-weight:700; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoTitle .tit1 { display:block; font-size:1.5em;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoTitle .tit2 { display:block; font-size:1em; margin-top:20px;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon {width:100%; margin-top:50px; box-sizing:border-box; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon:after { content:""; display:block; clear:both;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul {width:100%; margin:0; padding:20px 0; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul li {display:inline-block; padding:0 15px; margin:0; border-left:1px solid #eee; box-sizing:border-box; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul li:first-child { border-left:0; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul li div {display:table-cell; vertical-align:middle; text-align:center;} #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul li div i {display:inline-block; width:50px; height:50px; line-height:50px; text-align:center; font-size:2em; } #roomsListType03 .thumbs-gallery .swiper-slide .swiper-slide-right .con_left_inner .infoIcon ul li div span {display:block; font-size:1em; line-height:1.4em;} #roomsListType03 .thumbs-gallery .gallery-top { width: 100%; transition: 0.5s all ease;} #roomsListType03 .thumbs-gallery .gallery-top:after{ content:""; display:block; clear:both;} #roomsListType03 .thumbs-gallery .swiper-container-rtl .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {display:block !important;} #roomsListType03 .thumbs-gallery .swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:0; top:50%; margin-top:-30px; display:block; background:#fff url("../image/thumbs-gallery-prev.png") center center no-repeat; opacity : 0.7; width:60px; height:60px; color:rgba(255,255,255,0); transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #roomsListType03 .thumbs-gallery .swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:0; top:50%; margin-top:-30px; display:block; background:#fff url("../image/thumbs-gallery-next.png") center center no-repeat; opacity : 0.7; width:60px; height:60px; color:rgba(255,255,255,0); transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #roomsListType03 .thumbs-gallery .swiper-button-prev:hover,.swiper-container-rtl .swiper-button-next:hover{opacity :1; } #roomsListType03 .thumbs-gallery .swiper-button-next:hover,.swiper-container-rtl .swiper-button-prev:hover{opacity :1; } #roomsListType03 .reserv_bt_s{display:block; margin:30px auto; width:200px; height:50px; line-height:50px; color:#fff; background-color:#293d6b; text-align:center; font-size:1.15em; transition: 0.5s all ease; -webkit-transition: 0.5s all ease; -moz-transition: 0.5s all ease; -ms-transition: 0.5s all ease; -o-transition: 0.5s all ease;} #roomsListType03 .reserv_bt_s:hover{background-color:#000;} /* common information */ .common_information{ width:100%; max-width:1300px; margin:0 auto; } .common_information .info1{width:100%; overflow:hidden;} .common_information .info1 .detail{width:49%;} .common_information .info1 .detail.left{float:left;} .common_information .info1 .detail.right{float:right;} .common_information .info1 .detail ul{background: #fafafa; padding:10px;} .common_information .info1 .detail ul li {} .common_information .info1 .detail ul li p.tit {display:inline-block; width:15%; padding:15px 0; font-size: 1em; font-weight:500; color: #333; text-align:center; border-bottom:1px solid #888;} .common_information .info1 .detail ul li p.txt {display:inline-block; width:84%; font-size: 1em;padding:15px 10px; border-bottom:1px solid #ddd;} .common_information .info1 .detail h2{width:100%; padding: 20px 0; text-align: center;font-size: 1.2em; font-weight:500; color: #fff; background: #363636;} /* rooms View Type01 */ .rooms_info { width:100%; max-width:1300px; padding:0; margin:20px auto; margin-top:30px; background-color:#fff; border-top:2px solid #000; border-bottom:1px solid #ddd; box-sizing:border-box; } .rooms_info:after { content:""; display:block; clear:both;} .rooms_info h3.caution_tit {font-size:2em; font-weight:700; color:#333; text-align:center; margin-bottom:15px;} .rooms_info ul { float:left; font-size:0; width:100%; padding:30px 0; margin:0; text-align:center; } .rooms_info ul li { display:inline-block; vertical-align:top; *display:inline;*zoom:1; width:33.33333%; font-size:13px; margin:0; box-sizing:border-box; border-right:1px solid #eee; box-sizing:border-box;} .con_arrow {font-size:1.6em; font-weight:700; line-height:30px; color: #000; margin:50px 0 20px 0; border:0px solid red;} .con_arrow:before { content: ""; width:16px; height:16px; display:inline-block; border:5px #655135 solid; box-sizing:border-box; border-radius:14px; background:#fff; margin-right:10px;} .con_arrow2 {font-size:1.6em; font-weight:700; line-height:30px; color: #000; border:0px solid red;} .con_arrow2:before { content: ""; width:16px; height:16px; display:inline-block; border:5px #52b6b3 solid; box-sizing:border-box; border-radius:14px; background:#fff; margin-right:10px;} .con_arrow:first-child { margin:0 0 20px 0;} table.rooms_price{width:100%; max-width:1300px; border-collapse:separate; border-spacing:0px; border-top:1px solid #002b5c; border-left:1px solid #eee; margin:0 auto; } table.rooms_price th{ color:#333; text-align:center; font-weight:500; padding:10px 10px; border-bottom:1px solid #eee; border-right:1px solid #eee; background-color:#f8f8f8;} table.rooms_price td{ text-align:center; padding:10px 0px; border-bottom:1px solid #eee; border-right:1px solid #eee;} .fc_pointer {color:#BC0000; } .page_title{width:100%; margin-bottom:70px;} .page_title h1{width:100%; margin:0 auto; text-align:center; font-size:2.5em; font-weight:600;} .page_title h1:after {content:""; clear:both; display:block; width:30px; margin:10px auto; border:1px solid #000;} .page_title h2{width:100%; margin:0 auto; text-align:center; font-size:1.2em; color:#666; margin-top:20px; } .vision_type2 {width:100%; min-width:320px; max-width:1200px; margin:0 auto; } .vision_type2:after {display:block; visibility:hidden; clear:both; content:""} .vision_type2 h2.title {text-align:center; font-size:2em; font-weight:600; color:#333; line-height:1.2em; margin-bottom:40px; } .vision_type2 span.stitle {display:block; width:100%; text-align:center; margin:0 auto; font-size:1.3em; font-weight:400; color:#333; line-height:1.6em; margin-bottom:40px; } .vision_type2 .img_div img{width:100%; max-width:1200px; border-radius:85px; margin-bottom:30px} .vision_type2 ul {margin:0; padding:0; } .vision_type2 ul li {clear:both; padding:0px; margin:0; margin-bottom:30px; width:100%; border-radius:85px; border:1px solid #ddd; background-color:#fafafa; overflow:hidden;} .vision_type2 ul li .circle_box {display:block; float:left; width:170px; height:170px; border-radius:85px; } .vision_type2 ul li .circle_box {background:#655135; } .vision_type2 ul li .circle_box .icon {display:block; position:relative; left:0; top:25%; width:100%; height:100%; text-align:center; } .vision_type2 ul li .circle_box .icon i {display:block; font-size:3em; color:#fff; } .vision_type2 ul li .circle_box .icon em {display:block; font-size:1.2em; color:#fff; font-style:normal; margin-top:10px;} .vision_type2 ul li .con_txt {display:block; float:left; width:70%; margin-left:50px; margin-top:30px;} .vision_type2 ul li .con_txt p {font-size:1.6em; color:#000;font-weight:600; text-align:left; } .vision_type2 ul li .con_txt span {font-size:1.2em; color:#555; text-align:left; line-height:1.5em;} .vision_type2 ul li.inverse_li{background-color:#fff;} .vision_type2 ul li.inverse_li .circle_box {float:right; } .vision_type2 ul li.inverse_li .con_txt {float:right; } .s_tit {width:100%; height:30px; line-height:30px; text-align:left; border-left:5px solid #000; margin:50px auto; margin-bottom:10px; font-size:1.5em; text-indent:10;} @media screen and (max-width: 992px){ .content_wrap{width:96%;} .page_title{margin-bottom:50px;} .page_title h1{font-size:2em;} .page_title h2{font-size:1em;} .s_tit{font-size:1.2em;} .vision_type2 h2.title { font-size:1.5em; } .vision_type2 span.stitle{font-size:1em; width:90%;} .vision_type2 ul li {width:100%; margin-bottom:50px; border-radius:40px; border-bottom-left-radius:0px; border-bottom-right-radius:0px} .vision_type2 ul li .circle_box{float:none; width:100%; border-radius:40px; } .vision_type2 ul li.inverse_li .circle_box{float:none; width:100%; border-radius:40px; } .vision_type2 ul li .con_txt{float:none; width:90%; margin:0px; padding:30px 5%;} .vision_type2 ul li.inverse_li .con_txt{float:none; width:90%; margin:0px; padding:30px 5%;} .vision_type2 .img_div img{border-radius:40px;} } @media screen and (max-width: 480px){ .vision_type2 ul li{border-radius:15px;} .vision_type2 ul li .circle_box{border-radius:15px; } .vision_type2 ul li.inverse_li .circle_box{ border-radius:15px; } .vision_type2 .img_div img{border-radius:15px;} }