a[href^=tel] { color: inherit; text-decoration: none; }
.mBtn-menu {
    display: none;
}

[hidden] {
    display: none;
}

.show-pc {
    display: block;
}

.show-mobile {
    display: none;
}

@media (max-width: 1500px) {
    header .familySite{top: 129px; right: 20px;}

}
@media (max-width: 767px) {
    
    .show-pc {
        display: none;
    }

    .show-mobile {
        display: block;
    }

    .swiper-btns {
        right: 0;
        left: 5%;
    }

    .Swipers  .swiper-pagination {
        bottom: 3%;
    }
    .Swipers .swiper-pagination-bullet{
width: 6px;
height: 6px;
    }
    .Swipers .swiper-pagination-bullet-active{
        background-color: #415c6d;
        width: 13px;
    }

    .mBtn-menu {
        display: block;
    }
    .Swipers .swiper-btn {width: 32px;}
    .Swipers2 .swiper-btn {width: 32px;}

    header {
        flex-direction: column;
        z-index: 9001;
    }
    .top-reserve{display: none;}
    header .bg {
        /*background: rgba(255, 255, 255, 0.6);*/
        /* background-color: #BDA78A; */
        background-color: rgb(45 105 120 / 90%);
        position: absolute;
        top: 0;
        left: 0;
        height: 0;
    }

    header .logo {
        margin-top: 20px !important;
        position: static;
    }

    header .logo img { width: 175px; }

    header .mBtn-menu {
        margin-top: 0 !important;
        cursor: pointer;
        position: absolute;
        display: block;
        text-align: center;
        width: 60px;
        height: 40px;
        top: 20px;
        right: 20px;
    }


    header .mBtn-menu .xi-close {
        display: none;
    }

    header .mBtn-menu .xi-close, header .mBtn-menu .xi-bars {
        color: #ffffff;
        font-size: 0px;
        font-weight: 100;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
        width: 40px;
        height: 25px;
        margin-bottom: 5px;
    }
    header .mBtn-menu .xi-bars{
        background: url(../images/xi-bar.png) 50% 50%/cover;

    }
    header .mBtn-menu .xi-bars span{
        position: relative;
        top: 30px;
        display: block;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
        
        font-size: 13px;
        
    }
    #m-gnb-open{width: 40px; }
    #m-gnb-open img{width: 100%; display: block; margin: 10px 0 0 15px;}
    header .mBtn-menu .xi-close, header .mBtn-menu .xi-bars::after{
        
    }

    header .mBtn-menu.on .xi-close {
        display: block;
        font-size: 32px;
        text-align: center;
        width: 100%;
        margin-top: 0px;

    }
    header .mBtn-menu.on .xi-close span{display: block; font-size: 14px; width: 100%; margin-top: 5px; font-weight: 100; text-align: center; }

    header .mBtn-menu.on #m-gnb-open {
        display: none;
    }
 

    header .gnb {
        position: relative;
        width: 100%;
        padding: 20px;
        justify-content: flex-end;
        flex-direction: column;
        height: auto;
    }

    header .gnb > li {
        display: none;
    }

    header .gnb > li > a {
        text-shadow: 1px 1px 1px rgb(0 0 0 / 50%);
        position: relative;
        display: block;
        font-size: 27px;
        padding: 25px 20% ;
        height: auto;
        font-family: nanumbarungothicregular;
    }

    header .gnb > li > a .xi-angle-down {
        position: absolute;
        right: 30%;
        top: 20px;
        display: none;
    }

    header .gnb .mobile-link-stop:hover .xi-angle-down::before, header .gnb .mobile-link-stop:focus .xi-angle-down::before, header .gnb .mobile-link-stop.on .xi-angle-down::before {
        content: "\e944";
    }

    header .lnb {
        position: static;
        width: auto;
        height: auto;
        margin: 0 20% 30px;
        transform: none;
        top: 0;
    }

    header .lnb li {
        background-color: transparent;
    }

    header .lnb li:first-child::before {
        display: none;
    }

    header .lnb li > a {
        color: rgba(255, 255, 255, 0.8) !important;
        font-size: 18px;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);
    }
  
 
   

    header.on .gnb li {
        display: block;
    }

    header.on .bg {
        width: 100%;
        height: 100vh;
        right: 0;
        bottom: 0;
    }
    header .familySite								{position:absolute;top:65px;left:15px;z-index:5; right: unset;}
header .familySite > a							{padding:12.5px 0;font-size:13px;}
header .familySite ul							{width:100%;height:135px;overflow:hidden;}
header .familySite ul li						{margin-bottom:1px;}
header .familySite ul li a						{background:#fff;padding:3px 10px 3px 5px;}
header .familySite ul li a span 				{position:relative;top:-7px;font-size:12px;margin-left:5px;}

    .table .visual {
        height: 85vw;
        min-height: auto;
    }

    .table .contents {
        margin-top: 50px;
    }

    #community .visual {
        height: 85vw;
    }
    .community .snb {width: 100%;}
    .community .snb li a{font-size: 13px; padding: 7px 0;}

    /* popup */
    #index .img-popup {
        top: 15% !important;
    }

    /* index */
    #index .visual .heading h1 {
        font-size: 50px;
    }

    #index .Swipers .InBox{
        height: 60vw;
    }
    #index .Swipers2 .InBox{
        height: 60vw;
    }

    #index .visual .heading p {
        font-size: 18px;
    }

    #index .Swipers .swiper-btns {
        right: 0;
        left: 5%;
    }
    #index .floating_video .header-title{
        display: none;
    }

    #index .floating_video{
        padding-bottom: 0;
    }

    #index .floating_video iframe {
        position: absolute;
        width: 100%; 
        height: 100%;
        left: 50%; transform: translate(-50%);
    }

    #index .special_offer {
        height: 440px;
        
    }
      .Swipers2  .swiper-slide{ padding: 0% 0; transition: all .0s;}
  .Swipers2 .swiper-slide-active{padding: 0% 0;} 

     .room-swiper .roomsWrap h3 strong {font-size: 35px;}
     .room_swiper .InBox {height:560px;}
     .rooms_info .Box {width:430px;}
     .main-swiper{padding: 0;}
     .photo-txt span {font-size: 20px;}
     .photo-txt span::after {height: 20px; margin: 4px auto;}
     .main-swiper .roomsWrap h3 strong {font-size: 18px;}

     .main-swiper .roomsWrap .Swipers .swiper-pagination{display: block;}


 .rooms_info { width:100%; height:160px; bottom:-103%; left:unset; right: 0%; z-index:60;}
 .rooms_info .Box {width:100%; height:100%; box-shadow: none; background-color: #fff;}
 .rooms_info .Box h5:nth-child(2) {padding-top: 10px;}
 .rooms_info .Box h5 span { font-size:13px; color:#927036; margin-bottom:10px;}
 .rooms_info .Box h5 strong {font-size:25px;  color:#222; margin-bottom:0px; padding: 32px 0 15px;}
 .rooms_info .Box h5 p {display: block; font-size:11px;  color:#666; margin-bottom: 10px;}
 .rooms_info .Box .line {display:inline-block; width:30px; height:1px; border:1px solid #917035; vertical-align:middle;}
 .rooms_info .Box a {height: auto; width: 157px;}
 .rooms_info .info_bg { width:80%; height:77%; top:3%; left:5%; z-index:-1; border:1px solid #545454;}
 .room-swiper .roomsWrap h3 { width: 85%; margin: 0 auto;   font-size: 14px; padding: 80px 0 30px;  text-align: left; }
 .room-swiper .roomsWrap h3 span{font-size: 25px; margin-top: 29px; text-align: left;}
 .room-swiper .roomsWrap .main-txt {font-size: 12px;line-height: 25px;  width: 85%; margin: 0 auto 30px;  text-align: left;}
 .room-swiper{    padding: 0px 0 205px;}
    #index .special_offer .photo{
        position: relative;
        width: 100%;
        height: 100%; top: 67px;
    }
    #index .main-swiper .roomsWrap h3 {    font-size: 11px; padding: 80px 0 30px; color: #626262; }
    #index .main-swiper .roomsWrap h3 span{font-size: 25px; margin-top: 29px; color: #000;}
    #index .main-swiper .roomsWrap .main-txt {font-size: 12px; line-height: 25px;}
    #index .main-swiper .roomsWrap .main-txt2{font-size: 13px; padding-bottom: 65px; line-height: 25px;}

    #index .main-txt3 {padding-left: 7.5%; width: 100%;}

    #index .main-txt3 h3 {    font-size: 14px; padding: 80px 0 30px;  }
    #index .main-txt3 h3 span{font-size: 25px; margin-top: 29px;}
    #index .main-txt3 .main-txt {font-size: 13px; margin-bottom: 26px; line-height: 25px;}
    /* #index .main-txt3 .main-txt br{display: none;} */
    #index .main-txt3 .main-txt2{font-size: 12px; padding-bottom: 0px; line-height: 25px;}



    #index .content_video {
        padding-top: 0px;
        padding-bottom: 0px;
        height: auto;
    }

    #index .content_video .inner {
        min-width: 100%;
        max-width: 100%;
    }

    #index .content_video .inner > * {
        position: relative;
    }

    #index .content_video .text{
        left: 50px;
    }

    #index .content_video .video {
        width: 90%;
        display: none;
    }

    #index .content_video .heading {
        left: 20px;
        font-size: 50px;
        top: 10%;
    }

    #index .content_video .text {
        width: 100%;
        display: block;
        top: 0;
        padding-left: 20px;
        padding-right: 65px;
    }

    #index .content_video .text h3 {
        font-size: 20px;
    }
    #index .special_offer .overlay{
        top: 100%;
         bottom: 0;
        
    }
     .content_rooms .Swipers2 .swiper .swiper-wrapper #tab0::after{font-size: 40PX;}
#index .content_rooms .Swipers2 .swiper .swiper-wrapper #tab1::after{font-size: 15PX;}
#index .content_rooms .Swipers2 .swiper .swiper-wrapper #tab2::after{font-size: 15PX;}
#index .content_rooms .Swipers2 .swiper .swiper-wrapper #tab3::after{font-size: 15PX;}
#index .content_rooms .Swipers2 .swiper .swiper-wrapper a{position: relative; }
#index .logoMiddle{display: block;}
 .view-more{position: absolute; bottom:0; right:2%;font-size:13px;width:100px; height:27px; }
.view-more > *{color: #fff;}

    .content_rooms .room_btn > div h3::before {
        width: 100%;
    }
    .content_rooms .room_btn > div span::before {
        width: 30%;
        left: 50%;
        transform: translateX(-50%);
    }
    .content_rooms .room_btn > div span::after{right: 42px; top: 2px;}
    .content_rooms .Swipers2 .swiper .swiper-pagination-bullet-active{background-color: #415c6d;}


    .content_rooms {
        height: auto;
    }
    #index .photo-txt a{  }
#index .photo-txt{ line-height: 24px; width: 100%;  font-size: 11px; right : 50%; transform: translate(50%,-50%);    top: 68%;}


    /* about */
    #about .myframe {
        height: 85vw;
    }
    #about .visual .scroll{
        display: none;
    }

    #about .visual .heading h1 {
        font-size: 50px;
    }

    #about .text {
        width: 87%;
        height: 320px;
        
        padding-top: 11%;
    }
    #about .location p{
        word-break: keep-all;
        line-height: 19px;
    }
    #about .location .ph-num{
        
        
    }
   
    #about .Swipers {
        width: 90%;
        height: 60vw;
        right: 0;
    }
/* #about .ph-num{display: block;} */
    #about .text{
        animation-name: abouttext;
        animation-duration: .5s;
        animation-fill-mode: forwards;
    }

    #about article {
        height: 1500px;
    }

    #about .location {
        width: 77%;
        top: 720px;
    }

    #about .location h3 {
        font-size: 30px;
        margin-top: 30px;
        margin-bottom: 20px;
    }

    #about #map {
        top: 1000px;
    }
    .root_daum_roughmap_landing{height: 378px !important;}

    #about #map .root_daum_roughmap .wrap_map {
        height: 300px !important;
    }
    #about .Swipers .swiper .swiper-pagination-bullet { transition: 0.5s; width: 6px; height: 6px;} 
    #about .Swipers .swiper .swiper-pagination-bullet-active { background-color: #415c6d; width: 12px; border-radius: 40%; } 
    
    @keyframes abouttext {
        0%{    opacity: 0; transform: translateX(-70px);}
        100%{opacity: 1; transform: translateX(0px);}
    }
    /* room */
    #rooms .Swipers2 .swiper-slide{padding: 0; }
    .btn-pc{display: none !important;}
    .btn-mb{display: block !important;}
    #rooms .Swipers2 .InBox{height: 60vw;}
    /* #rooms .room-swiper{overflow-x: hidden;} */
    .rooms_info { width:100% !important; height:160px !important; bottom:-75%; left:unset; right: 0%; z-rooms:60;}
    #rooms .room-swiper{background-color: #fff;     }
#rooms .rooms_info .Box {width:100%; height:100%; box-shadow: none; background-color: #fff;}
#rooms .rooms_info .Box h5:nth-child(2) {padding-top: 10px;}
#rooms .rooms_info .Box h5 span { font-size:13px; color:#927036; margin-bottom:10px;}
#rooms .rooms_info .Box h5 strong {font-size:25px;  color:#222; margin-bottom:0px; padding: 32px 0 15px;}
#rooms .rooms_info .Box h5 p {display: block; font-size:11px;  color:#666; margin-bottom: 10px;}
#rooms .rooms_info .Box .line {display:inline-block; width:30px; height:1px; border:1px solid #917035; vertical-align:middle;}
#rooms .rooms_info .Box a {height: auto; width: 157px;}
#rooms .rooms_info .info_bg { width:80%; height:77%; top:3%; left:5%; z-rooms:-1; border:1px solid #545454;}
#rooms .room-swiper .roomsWrap h3 { width: 85%; margin: 0 auto;   font-size: 14px; padding: 80px 0 30px;  text-align: left; }
#rooms .room-swiper .roomsWrap h3 span{font-size: 25px; margin-top: 29px; text-align: left;}
#rooms .room-swiper .roomsWrap .main-txt {font-size: 11px;line-height: 25px;  width: 85%; margin: 0 auto 30px;  text-align: left;}
.rooms .room-nm{margin-top: 100px;}
.rooms .room-nm span{display: block; font-size: 14px; margin-bottom: 10px; font-family: BMHANNA, serif;  }
.rooms .room-nm strong{display: block; font-family: BMHANNA, serif;font-size: 25px; padding: 20px 0 40px; text-transform: uppercase;}
.rooms .room-nm div{ font-size: 16px;}
.room-txt1{display: flex; flex-direction: column; flex-wrap: wrap-reverse; background-color: #fff !important;}
.rooms .room-txt1 .main-txt2{order: 2; font-size: 14px; line-height: 25px; padding: 0 0px; margin-bottom: 30px;}
.rooms .room-txt1 .var{order: 1; height: 25px; margin-bottom: 25px;}
.rooms .contents .inner > span{display: none;}
    .rooms .contents {
        padding: 100px 10% 78PX;
        flex-direction: column;
    }

    .rooms .visual {
        height: 85vw;
        overflow: visible;
    }

    .rooms .Swipers{
        overflow: hidden;
    }

    .rooms .Swipers .swiper-slide {
        height: 100vw;
    }
    .rooms .visual h1{
        top: 124%;
        left: 50%; transform: translateX(-50%);
        color: black;
        display: none;
    }
    .rooms .room-nm{display: block;}
    .rooms .room-reserve-txt2{display: block;}
    .rooms  .room-reserve-txt2 a{display: block;}
    .rooms  .room-reserve-txt3 a{display: none;}
.rooms  .room-reserve-txt{font-size: 20px;   margin: 3% 2% 0 0;}
.rooms  .room-reserve-txt i{position: relative; top: 4px; font-size: 30px; margin: 5px 7px 0 0; }

.rooms  .room-reserve-txt i{margin-right: 5px;}
.rooms  .room-reserve-txt2{font-size: 15px; display: block;  }
/* .rooms  .room-reserve-txt2 i{position: relative; top: 4px; font-size: 30px; margin: 5px 7px 0 0; } */
.rooms  .room-reserve-txt2 a{  text-align: center; margin: 40px auto 30px; display: block; line-height: 40px; height: 40px; width: 160px;  background: #4a4a4a; color: #fff; border-radius: 3px;}
.swipeRoom{ font-size: 30px;}
.content_rooms .room_btn > div span{font-size: 14px;}
.rooms .contents .inner h3{font-size: 26px; text-align: left;}
.rooms .contents .inner {  height: 700px; padding: 15px;}
.rooms .contents .inner ul li{display: flex; order: 1;}
.rooms .contents .inner ul li:nth-child(1), .rooms .contents .inner ul li:nth-child(2) {width: 100%;}
.rooms .contents .inner ul{width: 100%;}
.rooms .contents .inner ul li:nth-child(3){order: 8;}
.rooms .contents a{text-align: center; padding: 30px 0 0;}
.rooms .contents a img{width: 200px;}
    #pc-video{display: none;}

    .rooms .visual h1 strong {
        font-size: 50px;
    }
    .rooms .visual h1 span{
        display: none;
    }
    /* #rooms .fram{position: relative;}
    .room_01 .fram::after{
        position: absolute;
        top: 15%; left: 50%; transform: translateX(-50%); 
        display: block;
        content: '씨엘(하늘)';
        font-size: 15px;
        
        text-align: center;
        
    }
    .room_01 .fram::before{
        display: block;
        content: 'CIEL';
        font-size: 60px;
        margin-bottom: 30px;
        text-align: center;
    }
    .room_02 .fram::after{
        position: absolute;
        top: 15%; left: 50%; transform: translateX(-50%); 
        display: block;
        content: '메르(바다)';
        font-size: 15px;
        text-align: center;
    }
    .room_02 .fram::before{
        display: block;
        content: 'MER';
        font-size: 60px;
        margin-bottom: 30px;
        text-align: center;
    }
    .room_03 .fram::after{
        position: absolute;
        top: 15%; left: 50%; transform: translateX(-50%); 
        display: block;
        content: '브리즈(바람)';
        font-size: 15px;
        text-align: center;
    }
    .room_03 .fram::before{
        
        display: block;
        content: 'BREEZE';
        font-size: 60px;
        margin-bottom: 30px;
        text-align: center;
    }
    .room_04 .fram::after{
        position: absolute;
        top: 15%; left: 50%; transform: translateX(-50%); 
        display: block;
        content: '솔레일(햇볕)';
        font-size: 15px;
        text-align: center;
    }
    .room_04 .fram::before{
        display: block;
        content: 'SOLEIL';
        font-size: 60px;
        margin-bottom: 30px;
        text-align: center;
    } */




 
    #rooms .visual .scroll{
        display: none;
    }
  
    #rooms .content_rooms .Swipers2 .swiper .swiper-pagination{
     ;
      
    }
     .content_rooms .Swipers2 .swiper .swiper-pagination-bullet{
        width: 6px ;
        height: 6px ;
    }
     .content_rooms .Swipers2 .swiper .swiper-pagination-bullet-active{width: 12px;}

    .content_rooms .room_btn > div{
        width: 50%;
        text-align: center;
    }
    .content_rooms .room_btn > div:nth-child(2),
    .content_rooms .room_btn > div:nth-child(4){
        
    }

    #about .content_rooms {
        height: 700px;
    }

    #about .content_rooms .heading {
        font-size: 50px;
    }

    #about .content_rooms .room_btn {
        top: 20%;
    }

    #about .content_rooms .Swipers2 {
        width: 80%;
        height: 400px;
        left: 20%;
    }

  
    .fram {display: block;
    padding: 0% 0 0;}
    .fram2{
        display: none;
    }
    
    .rooms .fram  #area {
        position: relative; /* absolute는 부모가 relative일 때 부모를 따라간다. */
        width: 100%;
        padding-bottom: 56.25%; /* 16:9 비율 */
        margin: 50px 0 ;
      }
      
      .rooms .fram   #video {
        position: absolute;
        width: 100%; /* 부모에 맞게 꽉 채운다. */
        height: 100%;
        left: 50%; transform: translate(-50%);
      }
  
    /* special */
    #special .myframe {
        height: 85vw;
    }
    .visual .scroll{display: none;}
    .special .contents {
        margin: 80px 0 100px;
        padding-bottom: 0;
    }

    .special .contents .txt {
        position:relative;
        background: none;
        padding: 0;
        opacity: 1;
        border-radius: 0;
    }

    .special .contents .txt h3 strong {
        font-size: 50px;
    }

    .special .contents .txt h3 span {
        padding-left: 0;
        font-size:20px;
    }

    .special .contents .txt .infos {
        padding: 15px 0;
    }

    .special .contents .txt .infos span {
        font-weight: 400;
        font-size: 12px;
    }

    .special .contents .txt .infos b {
        font-weight: 600;
    }

    .special .contents .Swipers {
        margin-bottom: 50px;
    }

    .special .Swipers .swiper-view {
        height: 60vw;
        min-height: auto;
    }

    .special .visual {
        height: 100vw;
    }

    .special .visual h1 strong {
        font-size: 30px;
        letter-spacing: 0;
    }

    .special .contents .Swipers {
        width: 100%;
        margin-top: 80px;
    }

    .special .contents .txt {
        left: auto;
        padding: 0 20px;
    }

    #community .visual .heading h1 {
        font-size: 50px;
    }
    #reserve .visual .heading h1{
        font-size: 40px;
    }
    #reserve .frame_02 {
        padding: 20px;
    }

    #reserve .table-area {
        overflow-x: scroll;
    }

    #reserve .table-area table {
        min-width: 1000px;
    }

    .special #Contents .Lists > div{height: 50vw; margin-bottom: 23%;}
    .special #Contents .Lists > div > .img{width: 70%;}
    .special #Contents .Lists > div > .txt {width: 50%;}
    .special #Contents .Lists > div > .txt h3 strong{font-size: 16px;}
    .special #Contents .Lists > div > .txt p{font-size: 12px;}
    .special #Contents .Lists > div > .txt h3 span{font-size: 14px;}
    .special #Contents .Lists > div > .txt div a{padding: 10px 0; font-size: 14px;}

    .special #Contents .Lists > div > .txt div {margin-top: 31px;width: 136px;}

    .m-special2{display: block;}
    .special2 .visual{height: 100vw;}
    #special2 .btn > strong{font-size: 30px;}
    #special2 .btn > span {font-size: 15px;}
    #special2 .btn > a span {font-size: 12px;}
    #special2 .info2 {bottom: 30px; width: 70%; display: none !important;}
    #special2 .info2 .inner span {font-size: 16px; margin: 0 0 10px}
    #special2 .info2 .inner ul li {font-size: 12px; line-height: 16px;}
    #special2 .btn{display: none;}


    body {
        font-size: 15px;
    }

    header {
        flex-direction: column;
    }

    header .logo {
        margin-top: 16px !important;
        margin-left: -20px;
    }

    /* header .logo img { width: 80px; } */

    header > *:not(.gnb):not(.bg) {
        margin-top: 20px;
        text-align: center;
        height: 57px;
    }

    header .gnb {
        font-size: 12px;
        width: 100%;
    }

    header .gnb > li > a {
        font-size: 24px;
    }

    footer {
        padding: 40px 0 80px;
    }
    footer .info p{font-size: 12px;}
    footer .info p:last-of-type {margin-bottom: 20px;}
    footer .info span {line-height: 20px; font-size: 12px;}
    footer .info > a{font-size: 12px;}


    footer .inner {
        flex-direction: column;
        text-align: center;
    }

    footer .inner img {
        display: block;
        margin: 0 auto;
        margin-top: 30px;
        margin-bottom: 30px;
    }

    footer .logo {
        float: none;
        width: 169px;
    }
    footer .logo img{
        display: block;
        margin: 0 auto;
        margin-top: 30px;
        margin-bottom: 30px;
    }
    #Banner{height: 85vw; min-height: 100px;}
    /* index */
        /* special */
        #index .myframe {
            height: 85vw;
        }
    #index .visual .heading h1 {
        font-size: 25px;
        margin-bottom: 0;
    }
    .iframe_outer{
        position: relative; 
                width: 100%;
                padding-bottom: 56.25%
    }
    .iframe_outer iframe{
      
    }

    .content_rooms .inner {
        min-width: 100%;
        max-width: 100%;
    }

    .content_rooms .room_btn {
        top: 16%;
    }

    #index .special_offer .text {
        left: 10%;
    }

    #index .content_rooms {
        padding-top: 0;
    }

   .content_rooms .Swipers2 {
        width: 80%;
        height: 400px;
        left: 20%;
    }
    #rooms .content_rooms .Swipers2{
        left: 0;
        top: 220px;
        width: 100%;

    }

    #index .floating_video iframe {
        min-height: 200px;
    }

    #index .content_video .inner {
        height: 500px;
    }

    #index .content_video .heading {
        left: 20px;
        top: 10%;
        font-size: 30px;
    }
    #index .visual .heading h1 span{
        letter-spacing: 3px;
        font-size: 15px;
    }

    #index .content_video .text {
        height: 80%;
        color: #ffffff;
    }

    #index .content_video .text p {
        font-size: 15px;
    }
    #index .content_video .text p a{
        display: block;
        font-size: 15px;
        color: #ffffff;
        margin-top: 15px;
    }
    .Swipers2 .swiper-pagination{display: none;}
#index .index-room-ft{position: absolute; left: 50%; top: 6%; transform: translateX(-50%); display: block; font-size: 30px; }
.content_rooms .room_btn > div h3{font-size: 23px;}
.index-txt2{display: block; text-indent: 20px;}
.index-txt2 p{ font-size: 20px; margin: 50px 0 0px;}
.index-txt2 span{display: block; font-size: 30px;}
    /* #index .content_video .text p::after{
        display: block;
        content: '▶ About Monaise';
        margin-top: 15px;
    } */
    .content_video.active .heading{display: none;}
    #index .content_video .text{padding-top: 10%;}
    #index .content_rooms  .heading p{display: none;}
    #index .content_rooms   h1{display: none;}
    .content_rooms .room_btn > div {margin-bottom: 31px;}


    #index .content_video .text h3 {
        font-size: 20px;
        font-weight: bold;
    }


    /* about */
    #about article {
        height: 1700px;
    }
    #about .visual .heading{
        width: 100%;
        text-align: right;
        left: unset;
        top: 90%;
      
        
        
    }
    #about .visual .heading h1{margin-right: 5%;}

    #about .text h3 {
        font-size: 22px;
        margin-bottom: 10px;
    }

    #about .text p {
        font-size: 13px;
    }

    #about #map {
        width: 100%;
    }

    #about .visual .heading h1 {
        font-size: 25px;
    }
    

    #about .location {
        height: 300px;
        top: 600px;
    }

    #about #map {
        top: 820px;
    }
    #about .load{width: 90% ; margin: 0 auto;     font-size: 12px;
        line-height: 16px;}
    #about .load p{font-size: 21px;}
    .rooms .content_rooms .heading {
        font-size: 30px;
        left: 50%; transform: translateX(-50%);
        top: 6%;

    }
  #travel .contents .frame ul li span{font-size: 12px;}
  #travel .contents .frame ul li strong{font-size: 25px;}
  #travel .contents .frame ul li em{font-size: 15px;}
  #travel .visual .heading h1 {  font-size: 40px;  } 

    .rooms .contents .inner:last-of-type ul li {
        background-position: left 6px;
    }

    .rooms .contents .inner ul li {
        line-height: 2.2;
        font-size: 12px;
    }

    .content_rooms {
        padding-top: 0;
    }

    .content_rooms .inner {
        height: 550px;
    }
  

    /* special */
    .special .contents .txt h3 strong {
        font-size: 40px;
    }

    #special .section .banner {
        background-size: 100%;
    }
    #index .visual .scroll{
        display: none;
    }


    .content_rooms .inner{
        height: 620px;
    }
    .rooms .content_rooms .room_btn{
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        left: 50%; transform: translateX(-50%);
        
    }
    #index .content_rooms .room_btn{
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        left: 0%; 
        
    }
    .content_rooms .Swipers2 .swiper .swiper-pagination{
       
    }
     .content_rooms .Swipers2 {
        left: 0;
        top: 400px;
        width: 100%;
    }

    footer .info p span{
        color:#989898 !important;
    }
    footer .info  span{
        color:#989898 !important;
    }

    
}