@charset "utf-8";

/* base */
body,html{height:100%;}
body {color:#555; font-size:14px; font-family:'Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; background: #000000;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input, table, tr, th, td, textarea, pre {margin:0; padding:0;}
header, footer, nav, menu,
article, aside, section, hgroup,
figure, figcaption, canvas, details, summary {display:block; margin:0; padding:0;}
table {margin:0; padding:0; border-spacing:0; border-collapse:collapse; border:0;}
h1, h2, h3, h4, h5, h6{font-weight: normal; font-size: 12px;}
fieldset, img {border: none; vertical-align: top;}
ul, ol, li{list-style: none}
em {font-style:normal;}
pre {padding-top: 5px;}
hr {display:none}
address {font-style:normal;}
img{max-width:100%;}
mark{background-color:transparent;}
.clear{clear:both;}
.hide{display:none;}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

#skip{position:absolute; overflow:hidden; height:0; width:0; font-size:0; visibility:hidden;}

/* 레이아웃 공통 */
#wrap{display: block; overflow: hidden; width:100%; margin: 0 auto; background:000000;}
#contents{display: block; overflow: hidden; width:100%;}

/* 링크처리 */
a:link {color:#ffffff; text-decoration:none;}
a:visited {color:#636363; text-decoration:none;}
a:hover {color:#414141; text-decoration:none;}
a:active {color:#414141; text-decoration:none;}
a:hover span {text-decoration:none; cursor:pointer;}

/* 입력 form */
html.firefox fieldset {display:table-cell !important;}
button, input[type='button'], input[type='reset'], input[type='submit'] {overflow:visible;} /* ie6 ~ ie7 버튼 길어짐 해결 css */
button:hover, input[type='button']:hover, input[type='reset']:hover, input[type='submit']:hover {text-decoration:none;}
button:hover span {text-decoration:none;}
input, select, textarea{width:100%; color:#747474; font-size: 1em; border: 1px solid #ffffff; background-color: #ffffff;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
input{text-align:center; padding:18px 5px 14px 5px;}
select{padding:8px 5px 7px 5px; background-image: url("http://appdata.hungryapp.co.kr/images/mobitalk/sub/select_arrow_gray02.png"); background-repeat: no-repeat; background-size:18px; background-position: right center; -webkit-appearance: none; -moz-appearance: none; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
textarea{height:130px; padding:8px; border: 1px solid #dcdcdc;}
input[type='radio'], input[type='checkbox'] {float:left; width:18px; height:18px; margin-top:6px; display: inline-block; border: 1px solid #cbcbcb; background: #ffffff; cursor: pointer;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color : #848484; font-weight:500;}
label{color:#747474; font-size: 1.0em; line-height: 2.5;}
input::placeholder {color: #727272; opacity: 1;  /* Firefox */}
input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #727272;}
input::-ms-input-placeholder { /* Microsoft Edge */ color: #727272;}
label.radio_img {float:left; width:25px; height:25px; background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//radio_off.png') no-repeat; background-size:25px 25px;}
input[type="radio"]:checked.radio_img + label.radio_img {background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//radio_on.png') no-repeat; background-size:25px 25px;}
label.image_checkbox {float:left; width:25px; height:25px; background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//checkbox_off.png') no-repeat; background-size:25px 25px;}
input[type="checkbox"]:checked.image_checkbox + label.image_checkbox {background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//checkbox_on.png') no-repeat; background-size:25px 25px;}

/* form_box */
.form_box{overflow: hidden; width:100%;}
.form_box input{width:calc(100% - 125px); float: left; margin-bottom: 0.5%; margin-right: 1% }

/* 말줄임 */
.txt_reduce{display: block; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-box-orient: vertical;}

/* 배경아이콘 */
.bg_icon{overflow:hidden; line-height:50000; font-size:0; display:inline-block;}

/* 정렬 */
.fl_left {float:left !important;}
.fl_right {float:right !important;}
.fl_clear {clear:both; height:0; font-size:0; line-height:0;}
.dp_block {display:block !important;}
.dp_iblock {display:inline-block !important;}

/*bar*/
#header{position:fixed; left:0; right:0; z-index:10; background:rgba(0,0,0,0.9); border-bottom:1px solid #000000; border: solid 2px black}
#header .bl_header{position:relative; width:1024px; margin:0 auto;}
#header h1{width:15%; }
#header h1 img{width:100%; margin: 10% 0 10% 13%}

#header ul {position:absolute; right:16%; top:34%; width:57.2%; }
#header ul li {float: left; width: 22%; padding:0 1.5%;  }
#header ul li img{width: 100%}

#header .bar_sns{position:absolute; right:4%; top:25%; width:11.5%;}
#header .bar_sns li{float: left;width: 48%; padding: 0 5%}
#header .bar_sns img {width: 90%}

/* main */
.main {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_01.jpg')no-repeat; position: relative; background-position: center top}
.main_t {text-align: center;}

/*main*/
.re {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_02.jpg')no-repeat; background-position: center top; position: relative; height: 1020px}
.main_re{width: 1024px; margin: 0 auto;}

/*사전예약*/
.fbox_1 {width: 950px;  margin: 0 auto; padding: 0 3%}
.bl_fbox{position:relative; display:block; overflow: hidden; width:1000px; margin:0 auto; padding:30px 0; font-size: 0.95em; color: #ffffff; line-height: 1.7em; border: 1px solid #ffffff; background-color:rgba(0,0,0,0.7);}
.bl_fbox_w {padding: 20px 0 70px 0;  }
.bl_MOBILE {display: none}
.radio li{float: left; margin: 0 10px 20px 0;}
.radio_txt {color: #ffffff; }
.btn_y img{ height: 51px }

.fbox_4 {margin: 5px 0; }
.fbox_4 {margin: 5px 0; }
.fbox_4 li{padding: 3px 0; }
.fbox_4 a{color: #ffffff}
.check {margin: 7px}
.fbox_4 li{padding: 2px}
.fbox_4 li .bl_more {position: absolute; right: 90px}
.fbox_4 li .bl_more1 {position: absolute; right: 90px}
.fbox_5 {margin: 0 auto; text-align: center; padding: 15px;}
.fbox_5 img{margin:0; width: 28%}

/*스샷*/
.bl_sc {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_03.jpg')no-repeat; background-position: center top; position: relative; height: 920px   }
.sc_text {margin: 0 auto; text-align: center}
.sc_img { text-align: center; margin: 0 auto; padding: 30px 0 50px 0}
.sc_img img{width: 850px;}
.sc_arrow { width: 1024px; text-align: center; margin: 0 auto;   }
.arrow1 {float: left; margin: 200px 0 0 0; }
.arrow2 {float: right; margin: 200px 0 0 0;  }
.sc_2 {display: none}
.sc_3 {display: none}
.sc_4 {display: none}
.sc_5 {display: none}
.sc_6 {display: none}


/*캐릭터*/
.bl_ch {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_04.jpg')no-repeat; background-position: center top; position: relative; height: 980px }
.ch_text {margin: 0 auto; text-align: center}
.ch_img{width: 900px; text-align: center; margin: 0 auto; position: relative;}
.ch_2{display: none}

.ch_arrow {width: 690px; margin: 0 auto; text-align: center }
.arrow3 {float: left; margin: 57px 0 0 20px;}
.arrow4  {float: right; margin: 57px 20px 0 0; }
.ch_m {width: 500px; margin: 0 auto; padding: 30px 0 60px 0; text-align: center; overflow: hidden; display: block;}
.ch_m ul {overflow: hidden; display: block;  padding-top: 3px;  margin: 0 auto;  }
.ch_m li { float: left; width: 50%; text-align: center}
.ch_m li img {padding: 3px}
.ch_m .ch_m_2 {display: none}

/*이벤트*/
.bl_ev {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_05_.jpg')no-repeat; background-position: center top; position: relative; }
.bl_ev2 {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_05_2.jpg')no-repeat; background-position: center top; position: relative; }
.ev_text {width: 1024px; margin: 0 auto;  }
.ev_m_btn ul{width:100%; text-align: center; margin: 0 auto; display: block; overflow: hidden;  }
.ev_m_btn li{float: left; width:50%;}
.ev_m_btn .btn1{/*position: absolute; width: 100%; left: -100px; */padding: 11px 0 0 0;text-align:right;}
.ev_m_btn .btn2{/*position: absolute; width: 100%; right: -150px;*/ padding:11px 0 0 0;text-align:left;}
.ev_{text-align: center;padding: 170px 20px 0 0}
.ev_img img {margin: 30px 0 0 0}
.ev_btn {width: 1024px; text-align: center; margin: 0 auto; }
.ev_btn img {margin: 0 auto; text-align: center; margin-top: 100px; margin-bottom: 100px}

/*footer*/
.footer {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_06.jpg')no-repeat; background-position: center top;}
.footer_img {margin: 0 auto; width: 1024px}

/* responsive */
@media screen and (max-width: 1280px) {
   
    #header .bl_header {width: 100%}
    #header h1{margin: 0 0 0 2%}
    #header ul{position:absolute; right:17%; top:35%; width:57.5%;}
    #header .bar_sns{position:absolute; right:-5%; top:25%; width:15%;}
    
    .main_re {position: relative; width: 100%}
    .bl_re{background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//re_bg_02.jpg')no-repeat; background-size: cover}
    .re {position:relative;  margin:0 auto; background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3//re_bg_03.jpg') no-repeat; background-position: center top; background-size:100%;; height: 100%}
    .bl_fbox { position:relative; display:block; overflow: hidden; width:94%; margin:0 3% 8% 3%; padding:20px 0; font-size: 0.95em; color: #ffffff; line-height: 1.7em; border: 1px solid #ffffff; background-color:rgba(0,0,0,0.7);}
    .bl_fbox_w{padding: 0}
    .fbox_1 {width: 100%; top: 0; }
    .form_box input{width:calc(90% - 40px); margin-bottom: 1%; }
    .btn_y { float: right; }
    .btn_y img{height: 50px}
    .fbox_5 {padding: 0}
    .fbox_5 img {width:220px; }
    .bl_PC {display: none}
    .bl_MOBILE {display: inline}
    
    .bl_sc {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_1280_03.jpg')no-repeat; background-size: 100%; position: relative; width: 100%; height: 100%}
    .sc_img {width: 65%; padding: 2% 0 7.5% 0; }
    .sc_1 {padding: 3px}
    .sc_arrow ul{width: 100%; }
    .sc_arrow li img{width: 70%}
    .arrow1 {position: absolute; left: 9%; margin-top: 17%;  }
    .arrow2 {position: absolute; right: 9%; margin-top: 17% }
    .arrow1 img{width: 70%}
    .arrow2 img{width: 70%}
    
    .bl_ch{background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_1280_04.jpg')no-repeat; background-size: 100%; position: relative; width: 100%; height: 100%}
    .ch_text {width: 100%; margin-top: }
    .ch_img {width: 70%; }
    .ch_m img{width: 90%}
    .arrow3 {position: absolute; left: 25%; margin-top: 6%; margin-left: 0}
    .arrow4 {position: absolute; right: 25%; margin-top:6%; margin-right: 0 }
    .arrow3 img{width: 70%}
    .arrow4 img{width: 70%}
    .ch_m {width: 40%; margin: 0 auto; padding:2% 2% 3% 2% }
    .ch_m li img {padding: 0 0 10% 0; }
    .ch_m .ch_m_2 {width: 100%; margin-left: 25%}
    
    .bl_ev{background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_1024_05_.jpg')no-repeat; background-size: 100%; position: relative; width: 100%;  }
	.bl_ev2{background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_1024_05_.2jpg')no-repeat; background-size: 100%; position: relative; width: 100%;  }
    .ev_text{width: 79%}
    .ev_m_btn ul{width: 100%; }
    .ev_m_btn li{ width: 100%; overflow: hidden; display: block; margin-top: 1%}
    .ev_m_btn .btn1{position: absolute; width: 22.8%; left: 27.2%; padding: 0.1% 0 0 0}
    .ev_m_btn .btn2{position: absolute; width: 22.8%; right: 27.2%; padding: 0.1% 0 0 0}

    .ev_ {width: 55%; margin: 0 auto; padding: 28% 2% 0 0}
    .ev_img img {margin: 5% 0 0 0}
    .ev_btn {width: 80%; padding: 5% 0 0% 0;}
    .ev_btn img{margin-top: 5%; width: 50%;  margin-bottom: 5%}
    
    /*footer*/
    .footer {background: url('http://appdata.hungryapp.co.kr/images/Events/hnms3//bg_06.jpg')no-repeat; background-size: 100%; position: relative; width: 100%; height: 100%}
    .footer_img {width: 100%}
    
}

@media screen and (max-width: 800px) {
    .form_box input{width:calc(90% - 75px); }
    .arrow1 {position: absolute; left: 7%; margin-top: 17%;  }
    .arrow2 {position: absolute; right: 7%; margin-top: 17% }
    .arrow1 img{width: 65%}
    .arrow2 img{width: 65%}
    .arrow3 {position: absolute; left: 20%; margin-top: 5%; margin-left: 0}
    .arrow4 {position: absolute; right: 20%; margin-top: 5%; margin-right: 0 }
}
@media screen and (max-width: 600px) {
    .form_box input{width:calc(90% - 90px);}
    .arrow1 {position: absolute; left: 5%; margin-top: 15%;}
    .arrow2 {position: absolute; right: 5%; margin-top: 15% }
    .arrow1 img{width: 60%}
    .arrow2 img{width: 60%}
        
    .arrow3 {position: absolute; left: 20%; margin-top: 5%; margin-left: 0}
    .arrow4 {position: absolute; right: 20%; margin-top: 5%; margin-right: 0 }
    .arrow3 img{width: 55%; }
    .arrow4 img{width: 55%}
}

@media screen and (max-width: 400px) {
    .form_box input{width:calc(90% - 100px);}
    .arrow1 {position: absolute; left: 0; margin-top: 20%;}
    .arrow2 {position: absolute; right: 0; margin-top: 20% }
    .arrow1 img{width: 50%}
    .arrow2 img{width: 50%}
        
    .arrow3 {position: absolute; left: 14%; margin-top: 5%; margin-left: 0}
    .arrow4 {position: absolute; right: 14%; margin-top: 5%; margin-right: 0 }
    .arrow3 img{width: 45%; }
    .arrow4 img{width: 45%}
 }


 #skip{position:absolute; overflow:hidden; height:0; width:0; font-size:0; visibility:hidden;}

#popup_1 { position: relative; width:100%; height:135%; background-color:rgba(0,0,0,0.8); z-index:5000; top:0; left:0;padding-bottom:30px}
.popup {position: relative;  width:1024px;  margin: 0 auto; text-align: center;}
.bg {background:url('http://appdata.hungryapp.co.kr/images/Events/hnms3/bg.png') no-repeat; background-size:100%; min-height:1200px;}
.text {padding-top: 57% }
.close {position: absolute; width: 980px; top: 47% }
.close img{position: absolute; margin-left: 39%}




/* responsive */
@media screen and (max-width: 1024px) {
#popup_1 {position:relative; }
.popup { width: 100%; height: 100%}
.btn{margin: 0 auto; text-align: center; }
.btn img{width: 44%}
    
.close {position: absolute;  width: 12%; top:47%; margin-left:75%}
.close img{position: absolute; float: right;}


}

@media screen and (max-width: 768px) {      
.close {position: absolute;  width: 11%; top:35%; margin-left:75%}
}

@media screen and (max-width: 414px) {      
.close {position: absolute;  width: 11%; top:19%; margin-left:75%}
}

@media screen and (max-width: 411px) {      
.close {position: absolute;  width: 11%; top:19%; margin-left:75%}
}

@media screen and (max-width: 375px) {      
.close {position: absolute;  width: 11%; top:17%; margin-left:75%}
}

@media screen and (max-width: 360px) {      
.close {position: absolute;  width: 11%; top:17%; margin-left:75%}
}

@media screen and (max-width: 320px) {      
.close {position: absolute;  width: 11%; top:15%; margin-left:75%}
}