@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
/** base **/
html,
body {
    height: 100%;
    overflow-y: hidden;
}

body {
    position: relative;
    width: 100%;
    font-family: "Raleway", "Dotum", "Arial", sans-serif;
    font-size: 12px;
    color: #333;
}

.posNum {
    position: fixed;
    left: 50%;
    top: 20%;
    width: 300px;
    height: 50px;
    margin: -25px 0 0 -150px;
    background: #111;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
    z-index: 9999;
}

/** scrollBox **/
.scrollBox {
    min-width: 1200px;
    height: 100%;
    position: relative;
}

.scrollBox .wrap {
    min-width: 1200px;
    position: relative;
    overflow: hidden;
}

.scrollBox .wrap > div {
    height: 1000px;
    position: relative;

}

.scrollBox .wrap .objs > li {
    position: absolute;
    left: 50%; /* 브라우저 창의 크기에 따라 반응을 해야 해서 가운데 기준을 잡는다 */
}

/**--------------- Scene01 **/

#scene01 {
    position: relative;
    height: 980px;
    /*padding-top: 70px;  메뉴 높이값만큼 여백 넣기 */

}

/** gnb **/
#header {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100px;
    z-index: 999;
}

#header.on {
    border-bottom: 1px solid #57504e;
}

#header h1 {
    text-align: left;
    height: 30px;
    line-height: 30px;
    margin-left: 358px;
    margin-top: 27px;
    padding-right: 110px;
}

#header h1 a {
}

#header .innerGnb {
    width: 782px;
    margin-top: -10px;
    margin-left: 678px;
}

#header .innerGnb li {
    float: left;
    margin-right: 60px;

}

#header .innerGnb li:last-child {
    margin-right: 0px;
}

#header .innerGnb li a {
    display: block;
    height: 12px;
    line-height: 12px;
    text-align: left;
}

#header .innerGnb .on a {
}

#header .topMenu {
    width: 250px;
    height: 13px;
    position: absolute;
    left: 50%;
    top: 33px;
    margin-left: 597px;;
}

#header .topMenu li {
    float: left;
    margin-right: 14px;
}

#header .topMenu li:last-child {
    margin-right: 0px;
}

#mega {
    width: 100%;
    /*height: 290px;*/
    height: 0;
    background: rgba(0, 0, 0, 0.65);
    position: absolute;
    left: 0;
    top: 101px;
    overflow: hidden;
    transition: all 0.5s;
}

#mega.on {
    height: 290px;
}

#mega .inner {
    width: 780px;
    margin-left: 676px;
    position: relative;
    padding-top: 53px;

}

#mega .inner ul {

    float: left;
    text-align: center;
}

#mega .inner .sub1 {
    width: 125px;
    margin-right: 23px;
}

#mega .inner .sub1 li:last-child {
    margin-top: 37px;
}

#mega .inner .sub2 {
    width: 119px;
    margin-right: 15px;

}

#mega .inner .sub2 li {
    margin-bottom: 38px;
}

#mega .inner .sub2 li:last-child {
    margin-bottom: 0px;
}

#mega .inner .sub3 {
    width: 71px;
    margin-right: 40px;
}

#mega .inner .sub3 li {
    margin-bottom: 38px;
}

#mega .inner .sub3 li:last-child {
    margin-top: 35px;
}

#mega .inner .sub4 {
    width: 103px;
    margin-right: 50px;
}

#mega .inner .sub4 li {
    margin-bottom: 35px;
}

#mega .inner .sub4 li:first-child {
    margin-bottom: 38px;
}

#mega .inner .sub5 {
    width: 72px;
    margin-right: 50px;
}

#mega .inner .sub5 li {
    margin-bottom: 37px;
}

#mega .inner .sub5 li:last-child {
    margin-bottom: 0px;
}

#mega .inner .sub6 {
    width: 103px;
}

#mega .inner .sub6 li {
    margin-bottom: 38px;
}

/*header end*/

#scene01 .bgWrap {
    width: 1920px;
    height: 980px;
}

#scene01 .bgWrap .slidesjs-pagination {
    width: 36px;
    position: absolute;
    left: 50%;
    margin-left: 826px;
    top: 469px;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .bgWrap .slidesjs-pagination > li {
    margin-bottom: 20px;
}

#scene01 .bgWrap .slidesjs-pagination > li > a {
    width: 36px;
    height: 1px;
    display: block;
    background: url("../img/scene01/scroll2.png") no-repeat 0 0;
}

#scene01 .bgWrap .slidesjs-pagination > li > a.active {
    width: 36px;
    height: 1px;
    background: url("../img/scene01/scroll1.png") no-repeat 0 0;
}

input {
    width: 52px;
    height: 44px;
    outline: none;
    background: transparent;
    box-sizing: border-box;
    font-size: 50px;
    color: white;
    font-weight: lighter;
    border: none;
}

#scene01 .date1 input::placeholder {
    color: white;
    font-size: 50px;
    font-family: "Noto Sans CJK KR Light", "sans-serif";
}

#scene01 .date2 input::placeholder {
    color: white;
    font-size: 50px;
    font-family: "Noto Sans CJK KR Light", "sans-serif";
}

#scene01 .slideUp {
    z-index: 100;
}

#scene01 .slideUpWrap > * {
    z-index: 100;
}

#scene01 .title1 {
    width: 858px;
    height: 83px;
    position: absolute;
    left: 50%;
    top: 350px;
    margin-left: -429px;
}

#scene01 .titleLine {
    width: 1px;
    height: 55px;
    position: absolute;
    left: 50%;
    top: 450px;

}

#scene01 .subtitle {
    width: 332px;
    height: 16px;
    position: absolute;
    left: 50%;
    top: 522px;
    margin-left: -166px;
}

#scene01 .checkIn {
    width: 786px;
    height: 15px;
    position: absolute;
    left: 50%;
    top: 715px;
    margin-left: -398px;
}

#scene01 .checkInWrap {
    width: 870px;
    height: 38px;
    position: absolute;
    left: 50%;
    top: 750px;
    margin-left: -398px;
}

#scene01 .checkInWrap li {
    float: left;
}

/*#scene01 .checkInWrap img {*/
/*float: left;*/
/*}*/

#scene01 .checkInWrap li.date1 {
    width: 51px;
    height: 38px;
    padding-right: 19px;
    line-height: 38px;
    vertical-align: middle;

}

#scene01 .checkInWrap li.month {
    width: 100px;
    height: 49px;
    position: relative;
}

#scene01 .checkInWrap li.month .slidesjs-previous {
    width: 16px;
    height: 38px;
    background: url("../img/scene01/dateSelect1.png") no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .checkInWrap .dateBtn1 {
    width: 16px;
    height: 38px;
    padding-right: 74px;
    cursor: pointer;
}

#scene01 .checkInWrap li.date2 {
    width: 51px;
    height: 38px;
    padding-right: 19px;
    line-height: 38px;
    vertical-align: middle;
}

#scene01 .checkInWrap li.month2 {
    width: 100px;
    height: 49px;
    position: relative;
}

#scene01 .checkInWrap li.month2 .slidesjs-previous {
    width: 16px;
    height: 38px;
    background: url("../img/scene01/dateSelect2.png") no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .checkInWrap .dateBtn2 {
    width: 16px;
    height: 38px;
    padding-right: 74px;
    cursor: pointer;
}

/**/
#scene01 .checkInWrap li.adultNum {
    width: 22px;
    height: 38px;
    padding: 0 38px;
    margin-right: 76px;
    position: relative;
}

#scene01 .checkInWrap li.adultNum .slidesjs-previous {
    width: 13px;
    height: 38px;
    background: url("../img/scene01/adultMin.png") no-repeat center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .checkInWrap li.adultNum .slidesjs-next {
    width: 13px;
    height: 38px;
    background: url("../img/scene01/adultPlus.png") no-repeat center;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .checkInWrap li.childNum {
    width: 22px;
    height: 38px;
    padding: 0 38px;
    margin-right: 76px;
    position: relative;
}

#scene01 .checkInWrap li.childNum .slidesjs-previous {
    width: 13px;
    height: 38px;
    background: url("../img/scene01/childMin.png") no-repeat center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .checkInWrap li.childNum .slidesjs-next {
    width: 13px;
    height: 38px;
    background: url("../img/scene01/childPlus.png") no-repeat center;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
    text-indent: -9999px;
}

#scene01 .dateLine1 {
    width: 1px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 713px;
    margin-left: -178px;
}

#scene01 .dateLine2 {
    width: 1px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 713px;
    margin-left: 80px;
}

#scene01 .dateLine3 {
    width: 1px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 713px;
    margin-left: 257px;
}

#scene01 .bookBtn {
    width: 165px;
    height: 49px;
    position: absolute;
    left: 50%;
    top: 843px;
    margin-left: -82px;
    cursor: pointer;
}

/** ---------------------------Scene02 ---------------------**/

#scene02 {
    height: 861px;
    background: #3d352e;
    position: relative;
}

#sc02_slides {
    width: 1px;
    height: 1px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: -1;
}

#scene02 .title {
    width: 311px;
    height: 94px;
    margin: 0 auto;
    padding-top: 115px;
}

#scene02 .xDeco {
    width: 32px;
    height: 36px;
    margin: 0 auto;
    padding-top: 310px;
}

#scene02 .offerImg {
    width: 369px;
    height: 409px;
    position: absolute;
    left: 50%;
    top: 327px;
    margin-left: -458px;
}

#scene02 .offerTxt {
    width: 371px;
    height: 409px;
    position: absolute;
    left: 50%;
    top: 327px;
    margin-left: 91px;
}

#scene02 .offerImg > div {
    position: absolute;
    left: -369px;
    top: 0;
    transition: all 1s;
    opacity: 0;
}

#scene02 .offerTxt > div {
    position: absolute;
    left: 371px;
    top: 0;
    transition: all 1s;
    opacity: 0
}

#scene02 .offerImg > div.on {
    left: 0;
    opacity: 1;
}

#scene02 .offerTxt > div.on {
    left: 0;
    opacity: 1;
}

#scene02 .prev {
    width: 24px;
    height: 49px;
    position: absolute;
    left: 50%;
    top: 513px;
    margin-left: -601px;
    cursor: pointer;
}

#scene02 .next {
    width: 24px;
    height: 49px;
    position: absolute;
    left: 50%;
    top: 513px;
    margin-left: 599px;
    cursor: pointer;
}

/** -----------------------------Scene03----------------- **/
#scene03 {
    height: 892px;
    background: #f2e9d7;
    position: relative;
}

#sc03_slides {
    width: 1920px;
    height: 892px;
    position: absolute;
    left: 0;
    top: 0;
}

#sc03_slides .slidesjs-pagination {
    width: 16px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 784px;
    margin-left: 503px;
    z-index: 100;
    text-indent: -9999px;
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item {
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item a {
    position: absolute;
    left: 0;
    top: 0;
    background: none;
    width: 19px;
    height: 14px;
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(1) a.active {
    background: url("../img/scene03/01Btn.png") no-repeat center;
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(2) a.active {
    background: url("../img/scene03/02Btn.png") no-repeat center;
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(3) a.active {
    background: url("../img/scene03/03Btn.png") no-repeat center;
}

#sc03_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(4) a.active {
    background: url("../img/scene03/04Btn.png") no-repeat center;
}

#scene03 .roomTitle > div {
    width: 1429px;
    height: 111px;
    position: absolute;
    left: 50%;
    top: 61px;
    margin-left: -777px;
    opacity: 0;
    transition: all 0.5s;
}

#scene03 .roomTitle > div.on {
    opacity: 1;
}

#scene03 .roomImg > div {
    width: 1276px;
    height: 727px;
    position: absolute;
    left: 50%;
    top: 100px;
    margin-left: -961px;
    opacity: 0;
    transition: all 0.5s;
}

#scene03 .roomImg > div.on {
    top: 164px;
    opacity: 1;
}

#scene03 .roomTxt > div {
    width: 489px;
    height: 478px;
    position: absolute;
    left: 50%;
    top: 290px;
    margin-left: 500px;
    opacity: 0;
    transition: all 1s;
}

#scene03 .roomTxt > div.on {
    opacity: 1;
    margin-left: 123px;
    transition-delay: 0.25s;
}

#scene03 .slide {
    width: 165px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 784px;
    margin-left: 467px;
}

#scene03 .slide > div {
    float: left;
    margin-right: 22px;
}

#scene03 .slide > div:last-child {
    float: right;
    margin-right: 22px;
}

#scene03 .slide .btn04_2 {
    padding-left: 13px;
}

#scene03 .slide .prevBtn {
    float: left;
}

/**----------------------------- Scene04----------------- **/
#scene04 {
    height: 536px;
    background: white;
    position: relative;
}

#scene04 .title {
    width: 419px;
    height: 93px;
    padding-top: 79px;
    margin-left: 754px;
}

#scene04 .rewards {
    width: 899px;
    height: 200px;
    position: absolute;
    left: 50%;
    top: 262px;
    margin-left: -600px;
    /*display: none; 위아래 자동 구동이여서 이건 구동없이 보자고 하심*/
}

#scene04 .join {
    width: 166px;
    height: 200px;
    position: absolute;
    left: 50%;
    top: 262px;
    margin-left: 364px;
    /*display: none;위아래 자동 구동이여서 이건 구동없이 보자고 하심*/
}

/** ----------------------------Scene05 ------------**/
#scene05 {
    height: 891px;
    position: relative;
}

#scene05 .bg4 {
    width: 1920px;
    height: 891px;
    position: absolute;
    left: 0;
    top: 0;
}

#scene05 .bg3 {
    width: 938px;
    height: 518px;
    position: absolute;
    left: 50%;
    top: 123px;
    margin-left: -571px;
}

#scene05 .bg2 {
    width: 1038px;
    height: 574px;
    position: absolute;
    left: 50%;
    top: 163px;
    margin-left: -520px;
}

#scene05 .text1 {
    width: 448px;
    height: 444px;
    position: absolute;
    left: 50%;
    top: 323px;
    margin-left: 112px;
    z-index: 100;
    /*text-indent: -9999px;*/
}

#scene05 .palsun1 .more {
    width: 114px;
    height: 31px;
    position: absolute;
    left: 50%;
    top: 364px;
    margin-left: -157px;
    cursor: pointer;
}

#scene05 .ariake1 .more {
    width: 114px;
    height: 31px;
    position: absolute;
    left: 50%;
    top: 364px;
    margin-left: -157px;
    cursor: pointer;
}

#scene05 .parkview1 .more {
    width: 114px;
    height: 31px;
    position: absolute;
    left: 50%;
    top: 364px;
    margin-left: -157px;
    cursor: pointer;
}

#scene05 .conti1 .more {
    width: 114px;
    height: 31px;
    position: absolute;
    left: 50%;
    top: 364px;
    margin-left: -157px;
    cursor: pointer;
}

#scene05 .slide {
    width: 1395px;
    height: 48px;
    position: absolute;
    left: 50%;
    top: 422px;
    margin-left: -697px;
}

#scene05 .prevBtn {
    float: left;
    cursor: pointer;
    position: relative;
    z-index: 9999;
}

#scene05 .nextBtn {
    float: right;
    cursor: pointer;
    position: relative;
    z-index: 9999;
}

/** --------------------------------Scene06------------- **/
#scene06 {
    height: 836px;
    background: url("../img/scene06/bg.png") no-repeat center;
    position: relative;

}

#scene06 .title img {
    width: 282px;
    height: 86px;
    position: absolute;
    left: 50%;
    top: 99px;
    margin-left: -141px;
}


.eventWrap1 {
    width: 1400px;
    height: 476px;
    position: absolute;
    left: 50%;
    top: 264px;
    margin-left: -590px;
}
.eventWrap1 .live {
    float: left;
    height: 476px;
}
.eventWrap1 .live .bg {
    float: left;
    cursor: pointer;
    width: 80px;
    height: 476px;
}
.eventWrap1 .live:nth-child(1) .bg {
    background: url("../img/scene06/event01Btn.png") no-repeat 0 0;
}
.eventWrap1 .live:nth-child(1) .bg.on {
    background: url("../img/scene06/event01Btn.png") no-repeat 0 0;
}
.eventWrap1 .live:nth-child(2) .bg {
    background: url("../img/scene06/event02Btn.png") no-repeat 0 0;
}
.eventWrap1 .live:nth-child(2) .bg.on {
    background: url("../img/scene06/event02Btn.png") no-repeat 0 0;
}
.eventWrap1 .live:nth-child(3) .bg {
    background: url("../img/scene06/event03Btn.png") no-repeat 0 0;
}
.eventWrap1 .live:nth-child(3) .bg.on {
    background: url("../img/scene06/event03Btn.png") no-repeat 0 0;
}

.eventWrap1 .live:nth-child(4) .bg {
    background: url("../img/scene06/event04Btn.png") no-repeat 0 0;

}
.eventWrap1 .live:nth-child(4) .bg.on {
    background: url("../img/scene06/event04Btn.png") no-repeat 0 0;
}




.eventWrap1 .live .contents_wrap {
    /*width: 1054px;*/
    width: 0;
    height: 476px;
    float: left;
    display: none;
    overflow: hidden;
}
.eventWrap1 .live .contents_wrap.on {
    width: 849px;
    display: block;
}










/**---------------------------------Scene07------------- **/
#scene07 {
    height: 351px;
    background: #291e17;
    position: relative;
}

#sc07_slides {
    width: 1920px;
    height: 351px;
    position: absolute;
    left: 0;
    top: 0;
}

/*#sc07_slides .slidesjs-pagination {*/
    /*width: 16px;*/
    /*height: 14px;*/
    /*position: absolute;*/
    /*left: 50%;*/
    /*top: 784px;*/
    /*margin-left: 500px;*/
    /*z-index: 100;*/
    /*text-indent: -9999px;*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item {*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item a {*/
    /*position: absolute;*/
    /*left: 0;*/
    /*top: 0;*/
    /*background: none;*/
    /*width: 19px;*/
    /*height: 14px;*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(1) a.active {*/
    /*background: url("../img/scene07/01Btn.png") no-repeat center;*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(2) a.active {*/
    /*background: url("../img/scene07/02Btn.png") no-repeat center;*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(3) a.active {*/
    /*background: url("../img/scene07/03Btn.png") no-repeat center;*/
/*}*/

/*#sc07_slides .slidesjs-pagination .slidesjs-pagination-item:nth-child(4) a.active {*/
    /*background: url("../img/scene07/04Btn.png") no-repeat center;*/
/*}*/

#scene07 .slide {
    width: 176px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 270px;
    margin-left: -83px;
    z-index: 200;
}

#scene07 .slide > div {
    float: left;
    margin-right: 22px;
}

#scene07 .slide > div:last-child {
    float: right;
    margin-right: 0px;
}

#scene07 .slide .btn04_2 {
    padding-left: 40px;
}

#scene07 .slide .prevBtn {
    float: left;
    cursor: pointer;
}

#scene07 .slide .nextBtn {
    cursor: pointer;
}

#scene07 .review {
    width: 626px;
    height: 208px;
    padding-top: 75px;
    position: absolute;
    left: 50%;
    margin-left: -313px;

}

#scene07 .review .slidesjs-pagination {
    width: 16px;
    height: 13px;
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -13px;
    z-index: 100;
    text-indent: -9999px;
}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item {

}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item a {
    width: 16px;
    height: 13px;
    background: none;
    position: absolute;
    left: 0;
    top: 0;
}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item:nth-child(1) a.active {
    background: url("../img/scene07/01Btn.png");
}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item:nth-child(2) a.active {
    background: url("../img/scene07/02Btn.png");
}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item:nth-child(3) a.active {
    background: url("../img/scene07/03Btn.png");
}

#scene07 .review .slidesjs-pagination .slidesjs-pagination-item:nth-child(4) a.active {
    background: url("../img/scene07/04Btn.png");
}

/**-------------------------- Scene08 --------------------**/

#scene08 {
    height: 470px;
    background: url("../img/bg.png") no-repeat center top fixed;
    background-size: cover;
    text-align: center;
    position: static;
}

#scene08 .location {
    padding-top: 98px;
    padding-bottom: 62px;

}


/** footer **/
#footer {
    height: 424px;
    background: url("../img/scene08/footer.png") no-repeat left top;
    position: relative;
}


#footer > ul{
    position: absolute;
    left: 1354px;
    top: 83px;

}
#footer > ul > li{
    width: 41px;
    height: 41px;
    background: transparent;
    float: left;
    margin-right: 12px;
}

#footer > ul > li:nth-child(3){margin-right: 10px;}
#footer > ul > li:nth-child(4){margin-right: 0;}
#footer > ul > li > a{display: block; width: 100%; height: 100%;}