section{position:relative;text-align:center;}
section *{font-family: 'S-CoreDream-4Regular', sans-serif;}
/*img {max-width: 100%;}*/
@font-face {
  font-family: 'S-CoreDream-2ExtraLight';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-2ExtraLight.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'S-CoreDream-3Light';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'S-CoreDream-4Regular';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face { font-family: 'S-CoreDream-5Medium';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-5Medium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'S-CoreDream-7ExtraBold';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-7ExtraBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'S-CoreDream-9Black';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-9Black.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}



/* //////////// sec01  //////////// */
#sec01 .container-fluid{padding:0;}
.swiper-slide {height:100vh;background-position: center;background-size: cover;}
.s_title{position:absolute;left:50%;top:20%;z-index:30;transform:translate(-50%, 0%);width:100%;max-width:1110px;padding:0px 15px;}
.s_title img{max-width:100%}
.s_bgtext{position:absolute;left:50%;bottom:10%;z-index:30;transform:translate(-50%, 0%);padding:2rem;background-color:rgba(39,39,39,.5);width:100%;max-width:730px;}
.s_bgtext p{margin:10px 0px;color:#fff;font-size:1rem;}
@media (min-width: 576px) {
  .swiper-slide{height:90vh;}
}
@media (min-width: 768px) {
  .swiper-slide{height:80vh;}
}
@media (min-width: 992px) {
  .swiper-slide{height:70vh;}
  .s_bgtext p{font-size:1.2rem;}
}

/* //////////// sec02  //////////// */
#sec02{}
.sec02_nav { background: #4397ff; border-top: 2px solid #b9efff70; border-bottom: 2px solid #4288d0;}
.sec02_nav  .container { padding: 0px;}
.titi01 { font-size: 2rem; color: #1259ff; padding: 50px 0 30px 0; letter-spacing: -1px;}
.titi01 span { font-size: 2.2rem; font-family: 'S-CoreDream-7ExtraBold', sans-serif;}
@media (min-width: 992px) {
  .titi01 { font-size: 30px;}
  .titi01 span { font-size: 48px;}
}

.hotels { padding: 0; list-style: none; overflow: hidden; text-align: center; margin: 0; }
.hotels li { width: 50%; float: left; padding: 1rem 0; }
.linkto_name_kr{font-size:1.2rem;}
.linkto_no, .linkto_no, .linkto_name_en, .linkto_arrow_right{display:none;}
.hotels li a { color: #fff !important; display: block; cursor:pointer;}
.hotels li a span { font-size: 12px; letter-spacing: 5;}
.hotels li a img { padding-top: 10px;}
.hotels li:hover { background: #1259ff; color: #fff;-webkit-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s;}


#hotel_nav_btns.fixed{position:fixed;top:55px;z-index:30;width:100%;}
#hotel_nav_btns.fixed .linkto_no,
#hotel_nav_btns.fixed .linkto_no,
#hotel_nav_btns.fixed .linkto_name_en,
#hotel_nav_btns.fixed .linkto_arrow_right{height:0px;opacity:0;}

@media (min-width: 992px) {
  #hotel_nav_btns.fixed{top:50px;}
  .hotels li{width: 25%;}
  .linkto_no, .linkto_no, .linkto_name_en, .linkto_arrow_right{display:block;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  .linkto_name_kr{font-size:1.2rem;}
  .linkto_name_en{font-size:0.9rem;}
  .linkto_arrow_right img{width:30px;}
}



.hotelitem{}
.hotel_bg { background: -webkit-linear-gradient(top, rgba(247,247,247,1) 0%,rgba(247,247,247,1) 300px,rgba(255,255,255,1) 300px,rgba(255,255,255,1) 100%);
padding-bottom: 60px;}

#hotel1 .hotel1 { background: url(../img/es_mallorca_hotel/sec02_bg01.jpg) no-repeat center; height: 900px; background-size: cover; text-align: left;}
#hotel2 .hotel2 { background: url(../img/es_mallorca_hotel/sec02_bg02.jpg) no-repeat center; height: 900px; background-size: cover; text-align: left;}
#hotel3 .hotel3 { background: url(../img/es_mallorca_hotel/sec02_bg03.jpg) no-repeat center; height: 900px; background-size: cover; text-align: left;}
#hotel4 .hotel4 { background: url(../img/es_mallorca_hotel/sec02_bg04b.jpg) no-repeat center; height: 900px; background-size: cover; text-align: left;}

.hotelitem_tit {position: relative; color: #fff; float: left; width: 100%;}
.hotel_tita { font-weight:lighter; background-color: #ffffff40; transform: rotate(90deg); margin: 0;
   padding-bottom: 3px; font-size: 18px; width: 220px; padding-left: 10px; letter-spacing: 4px;}
.hotel_titb { font-weight:lighter; background-color: #ffffff40; transform: rotate(90deg); margin: 0;
padding-bottom: 3px; font-size: 24px; width: 300px; padding-left: 10px; }
.hotel_titc { font-weight:lighter; background-color: #ffffff40; transform: rotate(90deg); margin: 0;
 padding-bottom: 3px; font-size: 24px; width: 300px; padding-left: 10px; }
.hotel_tit01 { font-weight: lighter; font-size: 60px; }
.hotel_tit02 { font-size: 2rem; font-weight: 800; margin-top: -16px;}
.hotel_tit03 { font-size: 1.6rem; font-weight: 400; padding-top: 40px; word-spacing: -1px; letter-spacing: -1px;}
@media (min-width: 992px) {
  .hotel_tit02 { font-size: 60px;}
  .hotel_tit03 { font-size: 22px;}
}
.hotelitem_txt01 { position: absolute; top: 200px; left:-100px;}
.hotelitem_txt01b { position: absolute; top: 240px; left:-140px;}
.hotelitem_txt01c { position: absolute; top: 200px; left:-110px;}
.hotelitem_txt02 { position: absolute; top: 80px; left: 70px;}
.line_under { border: 1px solid #ffffff; width: 60px; margin-top: 10px;}

.sec02_topWrap { position: relative; margin: 100px 0 60px 0;}
.infoTit { position: relative; float: left; width: 100%; margin-bottom: 35px;}
.infoTit .bar01 { width: 100%; height: 1px; background: #e1e1e1; position: absolute; top: 50%;}
.infoTit p {
    font-family: 'Roboto', sans-serif; float: left; font-size: 3rem; color: #e1e1e1; font-weight: 100; line-height: 1;
    margin: 0; display: inline-block; background: #f7f7f7; position: relative;}
.item_txt03 { font-size: 20px; word-break: keep-all; padding-bottom: 30px; letter-spacing: -1px;}
.item_txt04 { font-size: 18px; padding-bottom: 30px;}
.item_txt04 span { font-size: 16px; color: #fff; background-color: #666; border-radius: 20px; padding: 0 10px; margin-right: 10px;}

.sec02_txtWrap { text-align: left; font-weight: lighter;}
.sec02_txtWrap02 { text-align: left;  font-weight: lighter;}
.sec02_topWrap02 .infoTit p {
    font-family: 'Roboto', sans-serif; float: left; font-size: 3rem; color: #e1e1e1; font-weight: 100; line-height: 1;
    margin: 0; display: inline-block; background: #fff; position: relative;}
@media (min-width: 992px) {
  .infoTit p,
  .sec02_topWrap02 .infoTit p{font-size: 72px;}
}

.hotel_btn { padding: 50px 0;}
.hotel_btn_txt { background-color: #1594c1; border-radius: 60px; display: inline-block; color: #fff; font-size: 24px; color: #fff;
padding: 20px 40px; margin: 0 auto;  letter-spacing: -1px; }
.hotel_btn_txt:hover { background-color: #00b783; }

.areaWrap .areaWrap_tit { background:#4397ff url(../img/es_mallorca_hotel/tit_bg.png) no-repeat center;
  height: 250px; color: #fff; font-size: 48px; padding-top: 60px; line-height: 1.2; letter-spacing: -2px;}
.areaWrap .areaWrap_tit span { font-family: 'S-CoreDream-7ExtraBold', sans-serif;}

.areaWrap .area01 { background: url(../img/es_mallorca_hotel/area01_bg.jpg) no-repeat top center;background-size: cover; height: 700px; margin: 30px 0;}
.areaWrap .area02 { background: url(../img/es_mallorca_hotel/area02_bg.jpg) no-repeat top center;background-size: cover; height: 700px; margin: 30px 0;}
.areaWrap .area03 { background: url(../img/es_mallorca_hotel/area03_bg.jpg) no-repeat top center;background-size: cover; height: 700px; margin: 30px 0;}
.areaWrap .area04 { background: url(../img/es_mallorca_hotel/area04_bg.jpg) no-repeat top center;background-size: cover; height: 700px; margin: 30px 0;}




.area_bg{width:100%;height:100%;min-height:500px;background-position: 50% 50%;background-repeat: no-repeat;background-size: cover;}
.area_expl{padding:1.4rem 1.4rem 0rem 1.4rem;background-color:#fff;text-align:left;}
.area_expl img{max-width:100%}
#area_bg_1_1{background-image:url(/es/event/img/es_mallorca_hotel/area1_1.jpg);}
#area_bg_1_3{background-image:url(/es/event/img/es_mallorca_hotel/area1_3.jpg);}
#area_bg_2_1{background-image:url(/es/event/img/es_mallorca_hotel/area2_1.jpg);}
#area_bg_2_3{background-image:url(/es/event/img/es_mallorca_hotel/area2_3.jpg);}
#area_bg_3_1{background-image:url(/es/event/img/es_mallorca_hotel/area3_1.jpg);}
#area_bg_3_3{background-image:url(/es/event/img/es_mallorca_hotel/area3_3.jpg);}
#area_bg_4_1{background-image:url(/es/event/img/es_mallorca_hotel/area4_1.jpg);}
#area_bg_4_3{background-image:url(/es/event/img/es_mallorca_hotel/area4_3.jpg);}


.areaWrap .area01 .container { position: relative;}
.areatxt { }
.tit01 { padding-left: 500px; text-align: left;}
.tit02 { text-align: left;}
.txt01 { font-family: 'S-CoreDream-7ExtraBold', sans-serif; font-size: 36px; color: #4397ff;}
.txt01 span { font-size: 18px;}
.txt01 img { vertical-align: bottom;}
.txt02 { font-size: 18px; padding-top: 20px; letter-spacing: -0.6px; line-height: 1.6;}

@media only screen and ( max-width: 1200px ) {
  .tit02 { width: 500px;}
  .tit01 { padding-left: 450px;}
  .txt02 { font-size: 16px;}
  .txt01 { font-size: 30px;}
}
@media only screen and ( max-width: 991px ) {
  .hotels li { font-size: 18px; }
  .hotels li a span { letter-spacing: 0px;}
  .areaWrap .areaWrap_tit { font-size: 30px; height: 200px;}
  .tit01 { padding-left: 300px;}
  .tit02 {width: 430px;}
}
@media only screen and ( max-width: 767px ) {
}
