.resp.resp-1000 { display: none; }

.moOnly{
    display:none;
}

*.btn:active,
*.btn:hover {
    outline: none;
    user-select: none;
}

/* Mobile responsive, Default 1000px, iPhone 11 Pro, Max, XR max-width : 812, 896 */
@media only screen and (max-width: 1000px) {

    /* emove fade-effect in mobile */
    [krt-scroll-fade]:not(.fade) {
        opacity: 1 !important;
    }
    html, body {
        width: 100%; height: 100%;
    }
    .resp.resp-1000 { display: inherit;}
    .resp.desktop { display: none; }

     /* Header & Footer */
     header {
        padding:20px;
        position: relative;
        z-index: 11;
        flex-direction: column;
        align-items: flex-start;
        background-color: #fff;
        height: 60px;

    }

    header.fixed{padding:20px;}

    header.expanded  .header__link{color:#000;}

    header.expanded {
        background: #fff;
        height: 200px;


    }
    header.expanded nav.flex:first-child .header__link {
        display: block;
        position: relative;

    }
    header .header__hamburger .bg__toggleDropdown {
        display: none;
        position: fixed;
        top: 60px;
        left: 0;
        width: 100%;
        height: 100%;
    }
    header.expanded .header__hamburger .bg__toggleDropdown {
        display: block;
    }
    header nav.flex:first-child {
        margin: 0;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        color: #000;
    }
    header nav.flex:first-child .header__hamburger {
        margin-bottom: 0;
    }
    header.fixed nav.flex:first-child .header__hamburger {
        margin-top: 0;
    }
    header nav.flex:first-child .header__link {
        margin-left: 0;
        width: 100%;
        height: 48px;
        line-height: 48px;
        border-top: 1px solid #e2e2e2;
    }
    header:not(.expanded) nav.flex:first-child .header__link {
        pointer-events: none;
        border-top-width: 0;
        border-bottom-width: 0;
        display: none;
    }

    

    .floatingBanner{
        position:fixed;
        display: block;
        width:208px;height:85px;
        right:0;
        top:0px;
        background:url(../img/mo/m_floating_banner.png) no-repeat 50% 0;
        background-size:208px auto;
        z-index: 9999;
    }
    
    .cafeBanner{
        display: block;
        width:60px;height:60px;
        right:20px;
        bottom:80px;
        background:url(../img/cafe_btn.png) no-repeat 50% 0;
        background-size:60px auto;
        z-index: 9999;
    }
    
    .topbtn{
        position:fixed;
        display: block;
        width:60px;height:60px;
        right:20px;
        bottom:20px;
        background:url(../img/top_btn.png) no-repeat 50% 0;
        background-size:60px auto;
        z-index: 9999;
    }

    .download_btn{
        padding-top: 10px;
        z-index: 2;
    }

    .btnIOS{
        width:126px !important;
        height:auto !important;
        margin-left: auto;
        margin-right: auto;
        /*margin-right: 2.5vw;*/
        /*border: 2px solid red;*/
    }

    .btnAndroid{
        width:126px !important;
        height:auto !important;
        margin-left: auto;
        margin-right: auto;
        /*margin-left: 2.5vw;*/
        /*border: 2px solid red;*/
    }

    .main-text{
        display: block;
        width:370px;
        height:120px;
        background:url(../img/mo/m_main_text.png) no-repeat 50% 0;
        background-size:360px auto;
    }


    .text-margintop{
        margin-top: 5vw;
    }

    .btnOpenEvent{
        bottom: 0px;
        z-index: 1;
    }

    .eventBanner{
        display: block;
        width:1000px;
        height:50px;
        background:url(../img/mo/m_banner.png) no-repeat 50% 0;
        background-size:auto 50px;
    }

    .icon.icon__hamburger {
        width: 27px;
        height: 20px;
        margin-bottom:15px;
        display: inline-block;
        vertical-align: middle;
        background: url(../img/mo/m_menu.png) no-repeat 50% center / contain;
        }


/* Footer */
footer{
    flex-direction: column;
}

footer .logo{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-right:0;
    margin-bottom:10px;
}

footer .text{
    margin-left:0;
}

footer .text span{
    display: none;
}

footer .column {
    margin-top:5px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/* main */
section#main {width:100%;height: 90vh;min-height: 640px;}
section#main .play-media {
    display: none;
}
section#main .bg.bg__topVideo {
    background: url(../img/mo/m_main.png) no-repeat center 50% /cover;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top:0;
}
section#main .play-media + .flex {
    z-index: 9;
    width: 80%;
    height: auto;
    margin-top: -50vw;

}
section#main .play-media + .flex > .wrap.flex {
     margin-top: 20px;
}

section#main img[src] {
    width: 100%;
    height: 100%;
}

section#main .btn_video img[src]{
    width:55%;
    height:auto;
    margin-left:30px;
}
section#main .logo_big{
    width:280px !important;
    margin-top:-20px;
}

/* reservation */
section#reservation {
    width:100%;
    height: 178vw;
}

section#reservation .inner{
    position: relative;
    display:flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 15vw);
    height: auto;
    top: 64vw;
    margin:0 auto;
    flex-direction: column;
}

section#reservation .leftinput form{
    margin-top:0;

}

.p_form{
    width:90%;
    z-index: 9;
    height: auto;
}
section#reservation .leftinput{
    width: 100%;
    float: none;
    height: 47vw;
}

section#reservation .leftinput .os-selection{
    width:100%;
    height:auto;
    position: absolute;
}

section#reservation .leftinput .os-selection p label.ios{
    float:left;
    display:block;
    width: 5vw;
    height:5vw;
    background:url(../img/checkbox.png) no-repeat 0 0;
    background-size:5vw auto;
}

section#reservation .leftinput .os-selection p input#ios:checked + label.ios{
    float:left;
    display:block;
    width:5vw;
    height:5vw;
    background:url(../img/checkbox.png) no-repeat 0 -5vw;
    background-size:5vw auto;

}

section#reservation .leftinput .os-selection p label.android{
    float:left;
    display:block;
    width:5vw;
    height:5vw;
    background:url(../img/checkbox.png) no-repeat 0 0;
    background-size:5vw auto;

}

section#reservation .leftinput .os-selection p input#android:checked + label.android{
    float:left;
    display:block;
    width:5vw;
    height:5vw;
    background:url(../img/checkbox.png) no-repeat 0 -5vw;
    background-size:5vw auto;

}

section#reservation .leftinput .os-selection .tt{
    padding-left:1vw;
    font-size: 5vw;
    line-height:5vw;
    letter-spacing: -0.5vw;
}

section#reservation .leftinput .num_area{
    position: absolute;
    width:100%;
    margin-top: 0;
    top: 8vw;
    height: 10vw;
    display: flex;
}

section#reservation .leftinput .num_area .num1{
    width:20vw;
    font-size:5vw;
    height: 10vw;
    line-height: 10vw;
}

section#reservation .leftinput .num_area .num2{
    line-height: 10vw;
    width:55vw;
    font-size:5vw;
    letter-spacing: -0.2vw;
    height: 9vw;
}
section#reservation .leftinput .num_area .num2::placeholder{
    font-size:4vw;
    text-align:left;
}

section#reservation .leftinput .btn_register{
    position: absolute;
    top: 20vw;
    width:100%;
    font-size:5vw;
    height:15vw;
    line-height: 15vw;
    letter-spacing: -0.2vw;
    margin-top: 0;
}

section#reservation .leftinput .agree{
    position: absolute;
    top: 36vw;
    width:100%;
    height: 5vw;
    margin-top: 0;
}

section#reservation .leftinput .agree label.personal{
    float:left;
    display:block;
    width:5vw;
    height:5vw;
    background:url(../img/checkbox.jpg) no-repeat 0 0;
    background-size:5vw auto;
}

section#reservation .leftinput .agree input#personal:checked + label.personal{
    float:left;
    display:block;
    width:5vw;
    height:5vw;
    background:url(../img/checkbox.jpg) no-repeat 0 -5vw;
    background-size:5vw auto;

}

section#reservation .leftinput .agree .tt{
    padding-left:1vw;
    letter-spacing: -0.2vw;
    font-size:3vw;
    line-height:5vw;
}

section#reservation .leftinput .agree .personal_detail{
    width: auto;
    height: 5vw;
    font-size: 2.5vw;
    line-height:5vw;
    letter-spacing: -0.2vw;
    padding:0 2vw;
}

section#reservation .rightreward{
    width: 100%;
    float: none;
    height: 20vw;
    margin-top: 34vw;
}

section#reservation .rightreward .ri-title{
    font-size: 3vw;
    top: 0;
    background:url(../img/mo/m_reservation_ri.png) no-repeat 50% 0;
    background-size:25vw auto;
    width:25vw;
    height:6vw;
}

section#reservation .rightreward .sub-tt{
    font-size: 3.5vw;
    top: 1vw;
    line-height: 4vw;
}

section#reservation .bg.bg__event {
    background:url(../img/mo/m_reservation.png) no-repeat center 0/ contain;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}

/* rewardevent */
section#rewardevent {
    width: 100%;
    height: 232.6vw;
}

.win section#rewardevent {
    height: 233.1vw;
}

section#rewardevent .reward_item{
    width: 70vw;
    height: auto;
    top: 53vw;
}

section#rewardevent .reward_item .reward_1000{
    width: 71%;
    height:auto;
    left: 11vw;
}

section#rewardevent .reward_item a img[src]{
    width: 70vw;
    height:auto;
    padding-top: 13.5vw;
}

section#rewardevent .inner{
    width: 100%;
    height: 100%;
    top: 44vw;
}

section#rewardevent .inner .reward-left{
    width: 42vw;
    height:120vw;
}

section#rewardevent .inner .reward-left [class^="reward-"]{
    width: 100%;
    height: 35vw;
    background-size: 52vw auto;
    background-position: -7vw -2vw;
}

section#rewardevent .inner .reward-right{
    width: 42vw;
    height:auto;
}
section#rewardevent .inner .reward-right [class^="reward-"]{
    width: 100%;
    height: 35vw;
    background-size: 52vw auto;
    background-position: -4vw -2vw;
}

section#rewardevent .inner .reward-left .reward-50{
    margin-top: 7vw;
}

section#rewardevent .inner .reward-left .reward-20{
    margin-top: 0vw;
}
section#rewardevent .inner .reward-right .reward-70{
    margin-top: 24vw;
}


section#rewardevent .inner .reward-right .reward-30{
    margin-top: 1vw;
}

section#rewardevent .inner .reward-right .reward-10{
    margin-top: 0;
}

section#rewardevent .inner .reward-center{
    float: left;
    left:0;
    margin-top:20vw;
    width: 16vw;
    height: 1vw;
}

section#rewardevent .inner .reward-center .icon_area{
    width: 15.8vw;
    height:80vw;
}

section#rewardevent .inner .reward-center .bar_area{
    position: absolute;
    top:22vw;
    margin-left: 6.3vw;
    width: 3vw;
    height: 100vw;
}


section#rewardevent .inner .reward-center .reward_icon{
    margin-bottom: 3vw;
    width: 100%;
    height: 14.8vw;
    background:url(../img/reward_num.png) no-repeat 50%;
    background-size: 32vw auto;
}

section#rewardevent .inner .reward-center .reward_icon#icon_100{
    background-position: 0 0;
}

section#rewardevent .inner .reward-center .reward_icon#icon_70{
    background-position: 0 -14.8vw;
}

section#rewardevent .inner .reward-center .reward_icon#icon_50{
    background-position: 0 -29.6vw;
}

section#rewardevent .inner .reward-center .reward_icon#icon_30{
    background-position: 0 -44.4vw;
}

section#rewardevent .inner .reward-center .reward_icon#icon_20{
    background-position: 0 -59.4vw;
}

section#rewardevent .inner .reward-center .reward_icon#icon_10{
    background-position: 0 -74vw;
}

section#rewardevent .inner .reward-center .reward_bar{
    width: 3vw;
    height: 19vw;
    background:url(../img/reward_bar.png) no-repeat 0 0;
    background-size: 6vw auto;
}

section#rewardevent .inner .reward-left .invite_complete{
    background-position: 0 -37vw;
}

section#rewardevent .inner .reward-right .invite_complete{
    background-position: -11vw -38.1vw;
}

section#rewardevent .inner .reward-center .reward_bar.invite_complete{
    background-position: -3vw 0 !important;
}

section#rewardevent .inner .reward-center .reward_icon.invite_complete{
    background-position-x: -16.3vw !important;
}

section#rewardevent .bg.bg__event {
    background:url(../img/mo/m_reward.png) no-repeat center 0/ contain;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}


/* shareevent */
section#shareevent {
    width:100%;
    height: 228.7vw;
}

.win section#shareevent {
    height: 229.3vw;
}

section#shareevent .inner{
    position: relative;
    display:flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 10vw);
    height: 70vw;
    top: 64vw;
    margin:0 auto;
    z-index: 9;
    flex-direction: column;
}

section#shareevent .inner .share{
    width: 100%;
    height: auto;
}

section#shareevent .inner .share .ticket{
    position:absolute;
    margin-top: 5vw;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

section#shareevent .inner .share .ticket .ticket_text{
    float:left;
    height: 10vw;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
	left:-2vw;
    margin: 0;
}

section#shareevent .inner .share .ticket .ticket_text .fixed_tt{
	/* padding-top:3vw; */
	font-size: 4vw;
	line-height: 4vw;
	color: #868686;
	/* background-color:rgba(0,0,0,0.5); */
}

section#shareevent .inner .share .ticket .ticket_text .ticket_num{
    padding-left: 1vw;
    font-size: 8vw;
    line-height: 14vw;
	letter-spacing: -0.5vw;
    font-weight: bolder;
}

section#shareevent .inner .share .ticket .used_btn{
    width: 30vw;
    height: 10vw;
    border-radius: 10vw;
    font-size: 4vw;
    text-align: center;
    color:#fff;
    line-height: 10vw;
    top: 0;
    float: left;
    left:2vw;
}
section#shareevent .inner .share .ticket .ticket_count_btn{
    position: relative;
	float: left;
	left: 2vw;
    width:47vw;
    height:46px;
    border-radius: 23px;
    background-color: #8f4e36;
    font-size:18px;
    text-align: center;
    color:#fff;
    line-height:46px;
    top:0;
}
section#shareevent .inner .share .share_btn{
    position:absolute;
    display:flex;
    justify-content: center;
    align-items: center;
    margin-top:0;
    left:4vw;
    width: 84vw;
    height:17vw;
    top: 0;
}

section#shareevent .inner .share .share_btn .btn_facebook{
    background:url(../img/share_fb.png) no-repeat center 50%;
    width: 60vw;
    height: 15vw;
    background-size:14vw auto;

}

section#shareevent .inner .share .share_btn .btn_twitter{
    background:url(../img/share_tw.png) no-repeat center 50%;
    width: 60vw;
    height: 15vw;
    background-size:14vw auto;
}

section#shareevent .inner .share .share_btn .btn_story{
    background:url(../img/share_ka.png) no-repeat center 50%;
    width: 60vw;
    height: 15vw;
    background-size:14vw auto;
}

section#shareevent .inner .share .share_btn .btn_kakao{
    background:url(../img/share_kakao.png) no-repeat center 50%;
    width: 60vw;
    height: 15vw;
    background-size:14vw auto;
}

section#shareevent .inner .share .share_btn .btn_link{
    background:url(../img/share_link.png) no-repeat center 50%;
    width: 60vw;
    height: 15vw;
    background-size:14vw auto;
}

section#shareevent .inner .share_reward{
    position: relative;
    display: block;
    width: 100%;
    height:30vw;
    margin:0 auto;
    top: 16vw;
    -webkit-padding-before:3vw;
}

.win section#shareevent .inner .share_reward{
    top: 13.5vw;
}

section#shareevent .inner .share_reward [class^="share_reward_"].win{
    width: 19.4vw;
    height: 29vw;
    background: url(../img/share_reward_on.png) no-repeat center 50%;
}

section#shareevent .inner .share_reward .share_reward_1.win{
    width: 20.1vw;
    margin-left: 0;
    background-size: 97vw auto;
    background-position: 0 0;
}

section#shareevent .inner .share_reward .share_reward_2.win{
    margin-left: 18vw;
    background-size:98vw auto;
    background-position: -20.3vw 0;
}

section#shareevent .inner .share_reward .share_reward_3.win{
    margin-left:35vw;
    background-size:98vw auto;
    background-position: -39.7vw 0;
}

section#shareevent .inner .share_reward .share_reward_4.win{
    margin-left:52vw;
    background-size:98vw auto;
    background-position: -59.2vw 0;
}

section#shareevent .inner .share_reward .share_reward_5.win{
    margin-left:70vw;
    background-size:98vw auto;
    background-position: -78.6vw 0;
}

section#shareevent .bg.bg__event {
    background:url(../img/mo/m_shareevent.png) no-repeat center 0/ contain;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}

/* hashtag */
section#hashtag {
    width:100%;
    height: 464vw;
}

.win section#hashtag {
    height: 457vw;
}

section#hashtag .sns{
    position: relative;
    display: block;
    display:flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 5vw);
    height: 116vw;
    top: 155vw;
    margin:0 auto;
    z-index: 9;
}

section#hashtag .sns .arrow{
    position: absolute;
    top:52vw;
    width:100%;
    height:30vw;
    z-index: 10;
    left: 0;
}

section#hashtag .sns .arrow .left{
    background:url(../img/arrow.png) no-repeat 50%;
    background-size:15vw auto;
    width:7vw;
    height: 11vw;
    background-position: 0 0;
    cursor: pointer;
}

section#hashtag .sns .arrow .right{
    background:url(../img/arrow.png) no-repeat;
    float:right;
    right:0;
    background-size:15vw auto;
    width:7vw;
    height: 11vw;
    background-position: -7.3vw 0;
    cursor: pointer;
}

section#hashtag .sns .facebook{
    width:75vw;
    height:116vw;
    background:url(../img/mo/m_hashtag_face.png) no-repeat 50%;
    background-size:75vw auto;
}

section#hashtag .sns .insta{
    width:75vw;
    height:116vw;
    background:url(../img/mo/m_hashtag_ins.png) no-repeat 50%;
    background-size:75vw auto;
}

section#hashtag .bg.bg__event {
    background:url(../img/mo/m_hashtag.png) no-repeat center 0;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}

/* introduction */
section#introduction {
    width:100%;
    height: 133vw;
}

section#introduction .tag_btn{
    position: relative;
    display: flex;
    width: calc(100% - 20vw);
    height: 20vw;
    top:58vw;
    margin:0 auto;
    z-index: 9;
    justify-content: space-between;
    flex-wrap: nowrap;
}

section#introduction .tag_btn button{
    background:url(../img/sectionbtn.png) no-repeat;
    width: 18vw;
    height: 19vw;
    background-size: 76vw auto;
    cursor: pointer;
}

section#introduction .tag_btn button:hover{
    background-position-y:-20vw;
}

section#introduction .tag_btn button.on{
    background-position-y:-19vw;
}

section#introduction .tag_btn .farm_btn{
    background-position: 0 0;
}

section#introduction .tag_btn .delivery_btn{
    background-position: -19vw 0;
}

section#introduction .tag_btn .deco_btn{
    background-position: -38vw 0;
}

section#introduction .tag_btn .food_btn{
    background-position: -57vw 0;
}

section#introduction .tag{
    position: relative;
    display:block;
    width: calc(100% - 25vw);
    height: 43vw;
    top: 60vw;
    margin:0 auto;
    z-index: 9;
}

section#introduction .tag .farm_tag{
    position: absolute;
    left:40vw;
    top:26vw;
    width:13vw;
    height:15vw;
    background:url(../img/farm.gif) no-repeat;
    background-size:12vw auto;
    cursor: pointer;
}


section#introduction .tag .delivery_tag{
    position: absolute;
    left:22vw;
    top:28vw;
    width:13vw;
    height:15vw;
    background:url(../img/delivery.gif) no-repeat;
    background-size:12vw auto;
    cursor: pointer;
}


section#introduction .tag .deco_tag{
    position: absolute;
    left:9vw;
    top:6vw;
    width:13vw;
    height:15vw;
    background:url(../img/deco.gif) no-repeat;
    background-size:12vw auto;
}


section#introduction .tag .food_tag{
    position: absolute;
    left:52vw;
    top:6vw;
    width:13vw;
    height:15vw;
    background:url(../img/food.gif) no-repeat;
    background-size:12vw auto;
}

section#introduction .tag .farm_tag:hover{
    left:43vw;
    width:7vw;
    height:15vw;
    background:url(../img/farm-hover.png) no-repeat;
    background-size:7vw auto;
}

section#introduction .tag .delivery_tag:hover{
    left:25vw;
    width:7vw;
    height:15vw;
    background:url(../img/delivery-hover.png) no-repeat;
    background-size:7vw auto;
}

section#introduction .tag .deco_tag:hover{
    left:12vw;
    width:7vw;
    height:15vw;
    background:url(../img/deco-hover.png) no-repeat;
    background-size:7vw auto;
}

section#introduction .tag .food_tag:hover{
    left:55vw;
    width:7vw;
    height:15vw;
    background:url(../img/food-hover.png) no-repeat;
    background-size:7vw auto;
}


section#introduction .detail{
    position: relative;
    display: block;
    width: 100%;
    height: 54vw;
    top: 62vw;
    margin:0 auto;
    z-index: 9;
}

section#introduction .btn_ly_close{
    right:5vw;
    margin-top:2vw;
    width:10vw;
    height:10vw;
    background-size:10vw auto;
    z-index:999;
}

section#introduction .arrow{
    position: absolute;
    left:1vw;
    top:24vw;
    width: calc(100% - 2vw);
    height:11vw;
    z-index: 10;
}

section#introduction .arrow .left{
    background:url(../img/arrow.png) no-repeat 50%;
    background-size:15vw auto;
    width:7.7vw;
    height: 11vw;
    background-position: 0.6vw 0;
    cursor: pointer;
}


section#introduction .arrow .right{
    background:url(../img/arrow.png) no-repeat;
    float:right;
    right:0;
    background-size:15vw auto;
    width:7.7vw;
    height: 11vw;
    background-position: -7.2vw 0;
    cursor: pointer;
}

section#introduction .detail .dot{
    position: absolute;
    top:50vw;
    left: 38vw;
    width: 24vw;
    height:2.3vw;
    z-index: 10;
}

section#introduction .detail .dot [class^="dot_"]{
    float: left;
    margin-left:5.5vw;
    width: 1.4vw;
    height:2.3vw;
    display: inline-flex;
    background:url(../img/dot.png) no-repeat;
    background-size:3.7vw auto;
    background-position-x: -2.3vw;
    cursor: pointer;
}

section#introduction .detail .dot [class^="dot_"].on{
    float: left;
    margin-left:5.5vw;
    width: 2.3vw;
    height:2.3vw;
    background:url(../img/dot.png) no-repeat;
    background-size:3.8vw auto;
    background-position: 0 0;
    cursor: pointer;
}
section#introduction .detail .dot .dot_farm{
    margin-left:0 !important;
}

section#introduction .detail_book{
    position: relative;
    display:block;
    width: 100%;
    height: 30vw;
    margin:0 auto;
    z-index: 9;
}

section#introduction .detail_book .inner{
	/*
    position: absolute;
    right:60px;
    */
    position: relative;
    left:18.4vw;
    top: 33.5vw;
    display:block;
    width: 43vw;
    height: 12.3vw;
    margin:0 auto;
    z-index: 11;
}

section#introduction .detail_book .inner .sh1{
    float: left;
    left:0;
    width: 21.2vw;
    height: 100%;
    margin:0 auto;
    cursor: pointer;
    z-index: 9;

}
section#introduction .detail_book .inner .sh2{
    float: right;
    right:0;
    width: 21.2vw;
    height: 100%;
    margin:0 auto;
    cursor: pointer;
    z-index: 9;
}

section#introduction .detail_book .farm_book{
    width:100%;
    height:55vw;
    background:url(../img/mo/m_farm_book.png) no-repeat;
    background-size:100vw auto;
}

section#introduction .detail_book .delivery_book{
    width:100%;
    height:55vw;
    background:url(../img/mo/m_deilvery_book.png) no-repeat;
    background-size:100vw auto;
}

section#introduction .detail_book .deco_book{
    width:100%;
    height:55vw;
    background:url(../img/mo/m_deco_book.png) no-repeat;
    background-size:100vw auto;
}

section#introduction .detail_book .food_book{
    width:100%;
    height:55vw;
    background:url(../img/mo/m_food_book.png) no-repeat;
    background-size:100vw auto;
}
section#introduction .bg.bg__event {
    background:url(../img/mo/m_introduction.png) no-repeat center 0;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}

/* linefriend */
section#linefriend {
    width:100%;
    height: 262.2vw;
}

section#linefriend.mo{
    height:200vw !important;
}

section#linefriend .friedn_btn{
    position: relative;
    width: 100%;
    height: 185vw;
    top:68vw;
    margin:0 auto;
    background: url(../img/mo/m_group_character.png) no-repeat center 0;
    background-size:65vw auto;
    z-index: 9;
    
}

section#linefriend .friedn_btn .top{
    position: relative;
    margin: 0 auto;
    top:4.5vw;
    right:0.5vw;
    width:56vw;
    height:74vw;
    cursor: pointer;
}

section#linefriend .friedn_btn .next{
    position: relative;
    margin: 0 auto;
    top:22vw;
    right:0.5vw;
    width:56vw;
    height:74vw;
    cursor: pointer;   
}

section#linefriend .friedn_btn button{
    width:22vw;
    height:28vw;
    border-radius:1vw;
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}

section#linefriend .friedn_btn button{
    background: url(../img/look.png) no-repeat center;
    background-color: rgba(0,0,0,0.3);
}

section#linefriend .friedn_btn .top button{
    margin-right:0;

}

section#linefriend .friedn_btn .next button{
    margin-right:0;
}

section#linefriend .friedn_btn .cony-btn{
    margin-right:0 !important;
    float:right;
}

section#linefriend .friedn_btn .sally-btn{
    margin-right:0 !important;
    margin-top:16.5vw;
}

section#linefriend .friedn_btn .james-btn{
    margin-right:0 !important;
    float:right;
    margin-top:16.5vw;
}

section#linefriend .friedn_btn .leonard-btn{
    margin-right:0 !important;
    float:right;
}

section#linefriend .friedn_btn .jessica-btn{
    margin-right:0 !important;
    margin-top:17vw;
    margin-left:16.5vw;
}

section#linefriend .detail{
    position: relative;
    display:block;
    top:70vw;
    width: 100%;
    height: 117vw;
    margin:0 auto;
    z-index: 9;
}

section#linefriend .btn_ly_close{
    right:41vw;
    top:90vw;
    width:20vw;
    height:7vw;
    font-size:4vw;
    color:#943981;
    text-align:center;
    border-radius:8vw;
    border:2px solid #943981;
    background:none;
    z-index:999;
}


section#linefriend .arrow{
    position: absolute;
    left:1vw;
    top:54vw;
    width: calc(100% - 2vw);
    height:11vw;
    z-index: 10;
}

section#linefriend .arrow .left{
    background:url(../img/arrow.png) no-repeat 50%;
    background-size:15vw auto;
    width:7.7vw;
    height: 11vw;
    background-position: 0.6vw 0;
    cursor: pointer;
}


section#linefriend .arrow .right{
    background:url(../img/arrow.png) no-repeat;
    float:right;
    right:0;
    background-size:15vw auto;
    width:7.7vw;
    height: 11vw;
    background-position: -7.2vw 0;
    cursor: pointer;
}

section#linefriend .detail .dot{
    position: absolute;
    top:104vw;
    left: 28vw;
    width: 44vw;
    height:2vw;
    z-index: 12;
}

section#linefriend .detail .dot [class^="dot-"]{
    float: left;
    margin-left:5.5vw;
    width: 1.4vw;
    height:2.3vw;
    display: inline-flex;
    background:url(../img/dot.png) no-repeat;
    background-size:3.7vw auto;
    background-position-x: -2.3vw;
    cursor: pointer;
}

section#linefriend .detail .dot [class^="dot-"].on{
    float: left;
    margin-left:5.5vw;
    width: 2.3vw;
    height:2.3vw;
    background:url(../img/dot.png) no-repeat;
    background-size:3.8vw auto;
    background-position: 0 0;
    cursor: pointer;
}

section#linefriend .detail .dot .dot-brown{
    margin-left:0 !important;
}

section#linefriend .detail .detail_book{
    position: relative;
    display:flex;
    width: calc(100% - 20vw);
    height: 115vw;
    border-radius:5vw;
    margin:0 auto;
    background:#ffe9ff;
    box-shadow:0 0.5vw 1vw rgba(0,0,0,0.2);
    z-index: 9;
}

section#linefriend .detail .detail_book [class^="book-"]{
    margin-top:6vw;
    width:100%;
    height: 100vw;
    flex-direction: column;

}

section#linefriend .detail .detail_book .left{
    display: flex;
    justify-content: space-between;
    align-items:center;
    margin: 0 auto;
    width: calc(100% - 8vw);
    height: 13vw;
    position: relative;
}

section#linefriend .detail .detail_book .book-brown [class^="detailbtn-"]{
    background:url(../img/brown_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-cony [class^="detailbtn-"]{
    background:url(../img/cony_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-sally [class^="detailbtn-"]{
    background:url(../img/sally_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-james [class^="detailbtn-"]{
    background:url(../img/james_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-moon [class^="detailbtn-"]{
    background:url(../img/moon_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-leonard [class^="detailbtn-"]{
    background:url(../img/leonard_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .book-jessica [class^="detailbtn-"]{
    background:url(../img/jessica_btn.png) no-repeat 0 0;
    background-size:22vw auto;
}

section#linefriend .detail .detail_book .left [class^="detailbtn-"]{
    width:11vw;
    height: 13.2vw;
    background-position: 0 0;
}

section#linefriend .detail .detail_book .left [class^="detailbtn-"]:hover{
    background-position-x: -11vw;
}

section#linefriend .detail .detail_book .left [class^="detailbtn-"].on{
    background-position-x: -11vw;
}

/* section#linefriend .detail .detail_book .left .detailbtn-1 {
    margin-left:5%;
} */

section#linefriend .detail .detail_book .left .detailbtn-2 {
    /* margin-left:1%; */
    background-position-y: -13.3vw;
}

section#linefriend .detail .detail_book .left .detailbtn-3 {
    /* margin-left:1%; */
    background-position-y: -26.5vw;
}

section#linefriend .detail .detail_book .left .detailbtn-4 {
    margin-top:0;
    /* margin-left:1%; */
    background-position-y: -39.8vw;
}

section#linefriend .detail .detail_book .left .detailbtn-5 {
    margin-top:0;
    /* margin-left:1%; */
    background-position-y: -53.1vw;
}

section#linefriend .detail .detail_book .left .detailbtn-6 {
    margin-top:0;
    /* margin-left:1%; */
    background-position-y: -66.35vw;
}

section#linefriend .detail .detail_book .right{
    float:flex;
    justify-content:center;
    align-items:center;
    width: 100%;
    height: 69.6vw;
    margin-top:10vw;
    margin-right:0 !important;
    
}

section#linefriend .detail .detail_book .right img[src]{
    width:90%;
    margin-left:5%;
}


section#linefriend .bg.bg__event {
    background:url(../img/mo/m_character.png) no-repeat center 0;
    background-size:100% auto;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
}

/* notice */
section#notice {
    height: 100vw;
    width: 100%;
}

section#notice ul{
    width: calc(100% - 20vw);
}

section#notice p{
    font-size:3vw;
    color:#fff;
    margin-bottom:4vw;
}

section#notice li{
    font-size:2.5vw;
    line-height:3vw;
}


/* layer popup */
/* common */
.dimmed{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100;background:#000;filter:alpha(opacity=70);opacity:0.7;}
.ly_wrap{*zoom:1;position:fixed;top:50%;left:50%;z-index:110}
.pop_tt{position: relative;justify-content: center;display: flex;align-items: center;text-align: center;color: #8f4e36;left: -3px;letter-spacing: -1px;}
[class^="btn_pop_"]{position:absolute;text-indent:-999px;z-index: 10;}


/* 동영상 */
.ly_mov{width:calc(100% - 5vw);height:53.4vw;margin:-30vw 0 0 -47.5vw;}

.wrap_mov iframe{
    width:100%;
    height:53.4vw;
}
.btn_ly_close{
    position:absolute;
    right: 0;
    margin-top:-18vw;
    width:17vw;
    height:17vw;
    background:url(../img/btn_close.png) no-repeat;
    background-size:17vw auto;
}

/*pop*/
/* 사전등록팝업 */
.ly_reservation_pop{
    position:fixed;
    top:50%;
    right:0;
    left:0;
    z-index:110
}

/*사전예약완료*/
.ly_reservation_pop.rsv_complete .ly_cont{
    position:relative;
    display: block;
    margin:0 auto;
    width:100%;
    height: 90vw;
    margin-top: -50vw;
    background: url(../img/pop3.png) no-repeat center 50%;
    background-size: 90vw auto;
    /* background-color: #000; */
}

.ly_reservation_pop.rsv_complete .ly_cont .pop_tt{
    top: 22vw;
    font-size: 0;
    font-weight: bolder;
    line-height: 7vw;
    letter-spacing:-0.5vw;
}

.ly_reservation_pop.rsv_complete .ly_cont .btn_pop_ok{
    width: 40vw;
    height:14vw;
    background: none;
    /* background-size:35vw auto; */
    top: 70vw;
    left: 30vw;
}

/*사전예약이미완료*/
.ly_reservation_pop.rsv_already .ly_cont{
    position:relative;
    display: block;
    margin:0 auto;
    width:100%;
    height: 90vw;
    margin-top: -50vw;
    background: url(../img/pop3.png) no-repeat center 50%;
    background-size: 90vw auto;
    /* background-color: #000; */
}

.ly_reservation_pop.rsv_already .ly_cont .pop_tt{
    top: 92vw;
    font-size: 4vw;
    font-weight: bolder;
    line-height: 7vw;
    letter-spacing:-0.5vw;
}

.ly_reservation_pop.rsv_already .ly_cont .btn_pop_ok{
    width: 40vw;
    height:14vw;
    background: none;
    /* background-size:35vw auto; */
    top: 70vw;
    left: 30vw;
}
.ly_reservation_pop{
    position:fixed;
    top:50%;
    right:0;
    left:0;
    z-index:110
}

.ly_reservation_pop .ly_cont{
    position:relative;
    display: block;
    margin:0 auto;
    width:100%;
    height:90vw;
    margin-top:-40vw;
    background: url(../img/pop1.png) no-repeat center 50%;
    background-size:100vw auto;
}

.ly_reservation_pop .ly_cont .pop_tt{
    top:33vw;
    font-size: 6vw;
    font-weight: bolder;
    line-height: 7vw;
    letter-spacing:-0.5vw;
}

.ly_reservation_pop .ly_cont .btn_pop_ok{
    width:35vw;
    height:14vw;
    background: url(../img/pop_ok.png) no-repeat center 0; 
    background-size:35vw auto;
    top:50vw;
    left:32vw;
}

.ly_reservation_pop.privacy .ly_cont{
    position:relative;
    display: block;
    margin:0 auto;
    width:90vw;
    height:128vw;
    margin-top:-60vw;
    background: url(../img/privacy_pop.png) no-repeat center 0;
    background-size:95vw auto;

}

.ly_reservation_pop.privacy .ly_cont .pop_tt{
    top:126vw;
    left:0.1vw;
    width:90vw;
    right:0;
    text-align: right;
    font-size: 3vw;
    font-weight: bolder;
    line-height: 7vw;
    color:#fff;
    letter-spacing:-0.2vw;
    background-color: #8f4e36;
}

.ly_reservation_pop.privacy .ly_cont .btn_pop_ok{
    width:35vw;
    height:13vw;
    background: url(../img/pop_ok.png) no-repeat center 0; 
    background-size:35vw auto;
    top:110vw;
    left:28vw;
}

/* 공유이벤트 팝업 */
.share_pop{
    position:fixed;
    top:50%;
    right:0;
    left:0;
    z-index:110
}

.share_pop .ly_cont{
    position:relative;
    display: block;
    margin:0 auto;
    width:90vw;
    height:66vw;
    margin-top:-35vw;
    background: url(../img/effect_bg.png) no-repeat center 0;
    background-size:90vw auto;
}

.share_pop .ly_cont .pop_tt{
    top:22vw;
    font-size: 4vw;
    font-weight: bold;
    line-height: 5vw;
    letter-spacing:-0.2vw;
}

.share_pop.share_phone .ly_cont .pop_tt{
    top:16vw;
    font-size: 4vw;
    font-weight: bold;
    line-height: 5vw;
    letter-spacing:-0.2vw;
}

.share_pop .ly_cont .num_area{
    position: relative;
    margin:0 auto;
    margin-top:19vw;
    width:70vw;
    height:12vw;
    border:2px solid #b5a191;
    border-radius: 2vw;
    
}

.share_pop .ly_cont .num_area .num1{
    float: left;
    width:20vw;
    height:11vw;
    text-align: center;
    font-size:6vw;
    color:#98522e;
    line-height:11vw;
}

.share_pop .ly_cont .num_area .num2{
    float: left;
    width:48vw;
    height:10vw;
    border:none;
    font-size:4vw;
    text-align: center;
    color:#98522e;
    line-height:10vw;
    border-radius: 1vw;
}

.share_pop .ly_cont .btn_pop_ok{
    width:30vw;
    height:11vw;
    background: url(../img/pop_ok.png) no-repeat center 0; 
    background-size:30vw auto;
    top:43vw;
    left:30vw;
}

.share_pop.go .ly_cont .pop_tt{
    top:24vw;
    font-size: 4vw;
    font-weight: bold;
    line-height: 5vw;
    letter-spacing:-0.2vw;
}

.share_pop .ly_cont .btn_pop_go{
    width:46vw;
    height:10vw;
    background: url(../img/pop_go.png) no-repeat center 0; 
    top:37vw;
    left:21vw;
    background-size:45vw auto;
}

.share_pop.pick .ly_cont .pop_tt{
    top:14vw;
    font-size: 4vw;
    font-weight: bold;
    line-height: 5vw;
    z-index: 110;
}

.share_pop.pick .ly_cont .btn_pop_ok{
    width:30vw;
    height:11vw;
    background: url(../img/pop_ok.png) no-repeat center 0; 
    background-size:30vw auto;
    top:45vw;
    left:29.5vw;
}

.share_pop.pick .ly_cont .item_bg{
    position:relative;
    display: block;
    margin:0 auto;
    width:73.5vw;
    height:50vw;
    top:3.5vw;
}

.share_pop.pick .ly_cont .item_bg.deco{
    background: url(../img/effect_deco.gif) no-repeat;
    background-size:72vw auto;
}

.share_pop.pick .ly_cont .item_bg.gacha{
    background: url(../img/effect_gacha.gif) no-repeat;
    background-size:70vw auto;
}

.share_pop.pick .ly_cont .item_bg.biggem{
    background: url(../img/effect_biggem.gif) no-repeat;
    background-size:70vw auto;
}

.share_pop.pick .ly_cont .item_bg.gem{
    background: url(../img/effect_gem.gif) no-repeat;
    background-size:70vw auto;
}

.share_pop.pick .ly_cont .item_bg.coin{
    background: url(../img/effect_coin.gif) no-repeat;
    background-size:74vw auto;
}

.screen_pop .ly_cont .pop_img.farm-sh1{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/fram-sh1.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 9999;
}

.screen_pop .ly_cont .pop_img.farm-sh2{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/fram-sh2.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 110;
}

.screen_pop .ly_cont .pop_img.de-sh1{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/de-sh1.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 110;
}

.screen_pop .ly_cont .pop_img.de-sh2{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/de-sh2.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 110;
}

.screen_pop .ly_cont .pop_img.deco-sh1{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/deco-sh1.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 110;
}

.screen_pop .ly_cont .pop_img.food-sh1{
    width:95vw;height:53.4vw;margin:-30vw 0 0 -47.5vw;
    background: url(../img/food-sh1.png) no-repeat center 0; 
    background-size: 95vw auto;
    z-index: 110;
}

    }