@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/notosansgothic.css);
@import url(../../theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css);
@import url(//fonts.googleapis.com/css?family=Lato:700);

html {overflow-y:scroll}
body {margin:0;padding:0;font-family:'Noto Sans Korean', 'Noto Sans KR',"NanumBarunGothic", nbg, dotum, sans-serif;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;}
input, button {margin:0;padding:0;font-size:1em;}
button,input[type=submit]{cursor:pointer;}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;-webkit-appearance:none}
textarea, select {font-size:1em;font-family:dotum}
textarea {border-radius:0;-webkit-appearance:none}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none}
ol,ul,li{list-style:none;padding:0;margin:0;}
.clear{display:block;clear:both;content:''}

/*
#media-320, #media-768, #media-1024, #media-1025 {
    display: none;
    height: 0px;
    overflow: hidden;
}
  
@media all and (max-width: 320px) {
    #media-320 { display: block; }
}
@media all and (min-width: 321px) and (max-width: 768px) {
    #media-768 { display: block; }
}
@media all and (min-width: 769px) and (max-width: 1024px) {
    #media-1024 { display: block; }
}
@media all and (min-width: 1025px) {
    #media-1025 { display: block; }
}

#bootstrap grid
Extra small <576px	
Small ≥576px	
Medium ≥768px	
Large ≥992px	
Extra large ≥1200px

*/

/* app-store-banner */
#app-store-banner .outer-area{background-color:#fff;display:table;width:100%;height:100%;}
#app-store-banner .inner-area{background-color:#fff;display:table-cell;vertical-align:middle;text-align:left;}
#app-store-banner .inner-area .content-area{font-size: 12px;}
#app-store-banner .inner-area .content-area table td {text-align: center;line-height: 16px}
#app-store-banner .inner-area .content-area .close{font-family:dotum; font-size:18px;}
#app-store-banner .inner-area .content-area .title {font-size:14px}
#app-store-banner .inner-area .content-area .sub-title {font-size:11px}
#app-store-banner .inner-area .content-area .star {color:#faba50;font-size:10px}
#app-store-banner .inner-area .content-area .star .material-icons{font-size:14px;letter-spacing: -2px;}
#app-store-banner .inner-area .content-area .btn-down {padding:10px;color:#ff6666;border:1px solid #ff6666;border-radius: 10px}
#app-store-banner .inner-area .content-area:after{display:block;clear:both;content:''}

/* #PC */
@media all and (min-width: 1025px) {
/* @media only all and (min-width:1301px) { */
    #head_home_m {display:none}

    #head_home {width:100% ; float:left; background:#ff7065; height:145px;position:fixed ; z-index:9999}
    #head_home .inner{margin:0px auto; position:relative;left:0px; }	
    #head_home .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:182px; display: table-cell;  vertical-align: middle; height: 145px; background-position: center left}
    #head_home .inner .menu{ position: absolute;  left:20%; top: 57px}
    #head_home .inner .menu ul li{float:left; color:#fff; font-size:24px; text-align: center; margin-right: 50px }
    #head_home .inner .menu ul li a{color:#fff;}
    #head_home .inner .menu ul li a:hover{color:#F33;}
    #head_home .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    #head_home .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    #head_home .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    #head_home .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    #head_home .inner .myinfo{  position:absolute; right:5%; top:40px; }
    #head_home .inner .myinfo .name{ float: left; margin-right: 30px }
    #head_home .inner .myinfo .name .photo{ float: left; width:50px; height: 50px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    #head_home .inner .myinfo .name .photo img{ float: left; width:100%; }
    #head_home .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 22px; margin-top: 7px }
    #head_home .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #f8bb50 }
    #head_home .inner .myinfo a.btn_manager img{ width:100px; }
    #head_home .inner .myinfo a.btn_login{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff; margin-right: 10px }
    #head_home .inner .myinfo a.btn_login img{ width:53px; }
    #head_home .inner .myinfo a.btn_join{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_join img{ width:74px; }
    #head_home .inner .myinfo a.btn_logout{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px;}
    #head_home .inner .myinfo a.btn_logout img{ width:74px; }
    #head_home .inner .myinfo .icon1{float: left; margin-right: 10px }
    #head_home .inner .myinfo .icon1 img{ width: 50px}
    #head_home .inner .myinfo .icon2{float: left; margin-right: 10px  }
    #head_home .inner .myinfo .icon2 img{ width: 50px}
    #head_home .inner .left_icon{display: none}
    #head_home .inner .left_icon i{color: #fff; font-size: 50px}

    .app-banner-on {height:205px}
    .app-banner-off {height:145px}
    
    header.large .head_home_main {width:100%;background:rgba(0, 0, 0, 0.0);position:fixed;z-index:9999}
    header.small .head_home_main {width:100%;background:#ff7065;position:fixed;z-index:9999}
    
    .head_home_main {width:100%;background:rgba(0, 0, 0, 0.0);position:fixed;z-index:9999}    
    .head_home_main .inner{margin:0px auto; position:relative;left:0px; }
    .head_home_main .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:182px; display: table-cell;  vertical-align: middle; height: 145px; background-position: center left}
    .head_home_main .inner .menu{ position: absolute;  left:25%; top: 57px}
    .head_home_main .inner .menu ul li{float:left; color:#fff; font-size:24px; text-align: center; margin-right: 50px }
    .head_home_main .inner .menu ul li a{color:#fff;}
    .head_home_main .inner .menu ul li a:hover{color:#F33;}
    .head_home_main .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    .head_home_main .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    .head_home_main .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    .head_home_main .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    .head_home_main .inner .myinfo{  position:absolute; right:5%; top:40px; }
    .head_home_main .inner .myinfo .name{ float: left; margin-right: 30px }
    .head_home_main .inner .myinfo .name .photo{ float: left; width:50px; height: 50px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    .head_home_main .inner .myinfo .name .photo img{ float: left; width:100%; }
    .head_home_main .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 22px; margin-top: 7px }
    .head_home_main .inner .myinfo a.btn_login{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_login img{ width:53px; }
    .head_home_main .inner .myinfo a.btn_join{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_join img{ width:74px; }
    .head_home_main .inner .myinfo a.btn_logout{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_logout img{ width:74px; }
    .head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #f8bb50 }
    .head_home_main .inner .myinfo a.btn_manager img{ width:100px; }
    .head_home_main .inner .myinfo .icon1{float: left; margin-right: 10px }
    .head_home_main .inner .myinfo .icon1 img{ width: 50px}
    .head_home_main .inner .myinfo .icon2{float: left; margin-right: 10px  }
    .head_home_main .inner .myinfo .icon2 img{ width: 50px}
    .head_home_main .inner .left_icon{display: none}
    .head_home_main .inner .left_icon i{color: #fff; font-size: 50px}
    
    #talk_div{position: fixed; z-index: 100000001; bottom: 10px; right: 15px; text-align: right;}
    #talk_img{cursor: pointer; height: 118px;}
    #coupon_div{position: fixed; z-index: 100000001; bottom: 138px; right: 15px; text-align: right;}
    #coupon_img{cursor: pointer; height: 108px; padding:0px 6px;}
    #order_div{position: fixed; z-index: 100000001; bottom: 118px; right: -5px; text-align: right;}
    #order_img{cursor: pointer; height: 160px;}

    footer{ width: 100%; float: left; box-sizing: border-box; padding: 45px 0px; background-color: #f3f1f4 }
    .bt_menu{ width: 100%; display: flex; flex-direction: row; justify-content: space-between/*float: left;margin-bottom: 30px*/  }
    .bt_menu a{  float: left; font-size: 18px; color: #666 }
    .bt_menu .line{  float: left !important; margin: 0px 10px; font-size: 18px; color: #666 }
    .bt_menu .bt_menu_wide {display: block}

    
    .btm-help{font-size: 18px;}
    .btm-help .cs{font-size: 22px;font-weight: bold}
    .btm-help .counselKakao{color: #999; border: 1px solid; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; padding:0 10px; font-size: 0.9em;}       
    .bt_cs{ width: 100%; float: left; margin-bottom: 30px; font-size: 18px; color: #999999  }
    .bt_cs .label_type1 {display: inline}
    .bt_cs .txt_comma {display: inline}
    .bt_cs .txt_br {display: inline}
    .bt_cs .bt_cs_social {display: none}
        
    .bt_sns{ width: 100%; float: left; margin-bottom: 30px;  text-align: center }
    .bt_sns img{ margin: 0px 10px }

    .sub_head_sp {width:100% ; float:left; height:160px; }
    .sub_head_sp_orderview {width:100% ; float:left; height:298px; }
    .service-info-area {padding-top:145px;}
    .sub_head {width:100% ; float:left; height:45px; position:relative; text-align:center; font-size: 36px; color: #333; line-height: 45px; margin-top: 60px}
    .sub_head .icon1{ display: none}
    .sub_head .icon1 i{  color: #fff; font-size: 20px }
    .sub_head .toplogo{display: none}
    .sub_head .toplogo a{ height:28px; margin-top:6px}
    .sub_head .icon4{ display: none}
    .sub_head .icon4 i{ color:#fff}
    .sub_head .icon5{ display: none}
    .sub_head .icon5 i{ color:#fff}

    .smenu { width: 100%;  float: left; margin-top: 50px  }
    .smenu ul li{ float: left;  width: 100%;}
    .smenu ul li.menu_on{ float: left; padding: 0px 5px; box-sizing: border-box;}
    .smenu ul li.menu_on a{ width: 100%; float: left; padding: 15px 0px; background-color: #ff7065; color: #fff; font-size: 24px; text-align: center;  border-radius: 200px;}		        
    .smenu ul li.menu{ float: left; padding: 0px 20px; box-sizing: border-box;}
    .smenu ul li.menu a{ width: 100%; float: left; padding: 15px 0px; background-color: #999999; color: #fff; font-size: 24px; text-align: center;  border-radius: 200px;}	

    #container{ width: 100%; float: left; box-sizing: border-box; padding: 0px; margin: 0px;  }

    #cont_body{ width: 100%; float: left; box-sizing: border-box;  }
    .m_com_pd{ padding: 0px; box-sizing: border-box }
    .m_com_pd2{ padding: 0px; box-sizing: border-box }
    .pc_top_pd{ width: 100%;float: left; height: 50px }
}

/* #정리 후 삭제 대상 */
@media all and (max-width:1300px) and (min-width:769px) {
    .sub_head_sp {width:100% ; float:left; height:130px; }
    .sub_head_sp_orderview {width:100% ; float:left; height:289px; }
    .service-info-area {padding-top:137px;}
    .sub_head {width:100% ; float:left; height:45px; position:relative; text-align:center; font-size: 30px; color: #333; line-height: 45px; margin-top: 40px;}
    .sub_head .icon1{ display: none}
    .sub_head .icon1 i{  color: #fff; font-size: 20px }
    .sub_head .toplogo{display: none}
    .sub_head .toplogo a{ height:28px; margin-top:6px}
    .sub_head .icon4{ display: none; }
    .sub_head .icon4 i{ color:#fff}	
    .sub_head .icon5{ display: none; }
    .sub_head .icon5 i{ color:#fff}

    .smenu { width: 100%;  float: left; margin-top: 50px  }
    .smenu ul li{ float: left;  width: 100%;}
    .smenu ul li.menu_on{ float: left; padding: 0px 5px; box-sizing: border-box;}
    .smenu ul li.menu_on a{ width: 100%; float: left; padding: 15px 0px; background-color: #ff7065; color: #fff; font-size: 24px; text-align: center;  border-radius: 200px;}	
    .smenu ul li.menu{ float: left; padding: 0px 20px; box-sizing: border-box;}
    .smenu ul li.menu a{ width: 100%; float: left; padding: 15px 0px; background-color: #999999; color: #fff; font-size: 24px; text-align: center;  border-radius: 200px;}	

    #container{ width: 100%; float: left ;box-sizing: border-box; padding: 0px; }

    #cont_body{ width: 100%; float: left ;box-sizing: border-box;  }
    .m_com_pd{ padding: 15px; box-sizing: border-box }
    .m_com_pd2{ padding: 0px 15px; box-sizing: border-box }
    .pc_top_pd{ width: 100%;float: left; height: 30px }
    
    .quick_info{ width: 100%; float: left; background-color: #fb7367; height: 200px;  position: relative }	
    .quick_info .info_my{ margin-top: 50px; text-align: center; overflow: hidden;width: 100%; float: left }	
    .quick_info .info_my .photo{ width:60px; height: 60px;  border-radius: 200px; overflow:hidden; display: inline-block; vertical-align: middle; margin-bottom: 5px}
    .quick_info .info_my .photo img{ width:100%; }
    .quick_info .info_my .name{ width:100%; text-align: center; font-size: 15px; color: #fff ; margin-bottom: 10px}
    .quick_info .info_btn{ width: 100%;  text-align: center; overflow: hidden;}
    .quick_info .info_btn  a.info{  display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #f8bb50; color: #fff; font-size: 14px;  border-radius: 200px; margin: 0px 5px}
    .quick_info .info_btn  a.logout{ display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #e6e6e6; color: #666; font-size: 14px;  border-radius: 200px; margin: 0px 5px}
    .quick_info .info_btn  a.login{ display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #5ecfcd; color: #666; font-size: 14px;  border-radius: 200px; margin: 0px 5px}                
    .quick_info .close{ position: absolute; top: 10px ; right: 10px;  }	
    .quick_info .close i{ color: #fff; font-size: 30px }	
        
    .quick_kko{ width: 100%; float: left; background-color: #f4f4f4; padding: 20px 15px;  }	
    .quick_kko img{ width: 100%;   }
}

@media all and (max-width:1500px) and (min-width:1300px) {
 #head_home .inner .menu ul li{float:left; color:#fff; font-size:18px; text-align: center; margin-right: 20px }
 #head_home .inner .menu ul li a{color:#fff; font-size:20px;}
 
 .head_home_main .inner .menu ul li{float:left; color:#fff; font-size:18px; text-align: center; margin-right: 20px }
 .head_home_main .inner .menu ul li a{font-size:20px;}
}

/* #정리 후 삭제 대상 */
@media all and (max-width:1300px) and (min-width:1025px) {
    #head_home_m { display:none}
    
    #head_home {width:100% ; float:left; background:#ff7065; height:137px;   position:fixed ; z-index:9999}
    #head_home .inner{margin:0px auto; position:relative;left:0px; }	
    #head_home .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:150px; display: table-cell;  vertical-align: middle; height: 137px; background-position: center left}
    #head_home .inner .menu{ position: absolute; top: 55px }
    #head_home .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
    #head_home .inner .menu ul li a{color:#fff;}
    #head_home .inner .menu ul li a:hover{color:#F33;}
    #head_home .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    #head_home .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    #head_home .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    #head_home .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    #head_home .inner .myinfo{  position:absolute; right:20px; top:48px; }
    #head_home .inner .myinfo .name{ float: left; margin-right: 10px }
    #head_home .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    #head_home .inner .myinfo .name .photo img{ float: left; width:100%; }
    #head_home .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
    #head_home .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #f8bb50 }
    #head_home .inner .myinfo a.btn_manager img{ width:80px; }
    #head_home .inner .myinfo a.btn_login{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_login img{ width:53px; }
    #head_home .inner .myinfo a.btn_join{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_join img{ width:74px; }
    #head_home .inner .myinfo a.btn_logout{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_logout img{ width:74px; }
    #head_home .inner .myinfo .icon1{float: left; margin-right: 10px }
    #head_home .inner .myinfo .icon1 img{ width: 40px}
    #head_home .inner .myinfo .icon2{float: left; margin-right: 10px  }
    #head_home .inner .myinfo .icon2 img{ width: 40px}
    #head_home .inner .left_icon{display: none}
    #head_home .inner .left_icon i{color: #fff; font-size: 50px}
	
    #head_home_main {width:100% ; float:left; background:rgba(0, 0, 0, 0.0); height:137px; position:fixed ; z-index:9999}
    #head_home_main .app-banner-on {height:187px}
    #head_home_main .inner{margin:0px auto; position:relative;left:0px; }
    #head_home_main .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:182px; display: table-cell;  vertical-align: middle; height: 145px; background-position: center left}
    #head_home_main .inner .menu{ position: absolute;  left:20%; top: 57px}
    #head_home_main .inner .menu ul li{float:left; color:#fff; font-size:24px; text-align: center; margin-right: 50px }
    #head_home_main .inner .menu ul li a{color:#fff;}
    #head_home_main .inner .menu ul li a:hover{color:#F33;}
    #head_home_main .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    #head_home_main .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    #head_home_main .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    #head_home_main .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    #head_home_main .inner .myinfo{  position:absolute; right:5%; top:40px; }
    #head_home_main .inner .myinfo .name{ float: left; margin-right: 30px }
    #head_home_main .inner .myinfo .name .photo{ float: left; width:50px; height: 50px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    #head_home_main .inner .myinfo .name .photo img{ float: left; width:100%; }
    #head_home_main .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 22px; margin-top: 7px }
    #head_home_main .inner .myinfo a.btn_login{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home_main .inner .myinfo a.btn_login img{ width:53px; }        
    #head_home_main .inner .myinfo a.btn_join{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home_main .inner .myinfo a.btn_join img{ width:74px; }        
    #head_home_main .inner .myinfo a.btn_logout{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home_main .inner .myinfo a.btn_logout img{ width:74px; }		                        
    #head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #f8bb50 }
    #head_home_main .inner .myinfo a.btn_manager img{ width:100px; }
    #head_home_main .inner .myinfo .icon1{float: left; margin-right: 10px }
    #head_home_main .inner .myinfo .icon1 img{ width: 40px}
    #head_home_main .inner .myinfo .icon2{float: left; margin-right: 10px  }
    #head_home_main .inner .myinfo .icon2 img{ width: 40px}
    #head_home_main .inner .left_icon{display: none}
    #head_home_main .inner .left_icon i{color: #fff; font-size: 50px}
    
    .head_home_main .inner .menu ul li{float:left; color:#fff; font-size:24px; text-align: center; margin-right: 20px }
    .head_home_main .inner .myinfo a.btn_login{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_join{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #f8bb50 }
    .head_home_main .inner .myinfo{  position:absolute; right:20px; top:48px; }
    
    
    .head_home_main .inner .myinfo .name{ float: left; margin-right: 10px }
    .head_home_main .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    .head_home_main .inner .myinfo .name .photo img{ float: left; width:100%; }
    .head_home_main .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
        
    .head_home_main .inner .myinfo a.btn_login{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_login img{ width:53px; }
    .head_home_main .inner .myinfo a.btn_join{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_join img{ width:74px; }
    .head_home_main .inner .myinfo a.btn_logoutt{ float: left; border-radius: 200px;  padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_logout img{ width:74px; }
    .head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #f8bb50 }
    .head_home_main .inner .myinfo a.btn_manager img{ width:80px; }

    header.large #head_home_main {width:100% ; float:left; background:rgba(0, 0, 0, 0.0); height:137px;   position:fixed ; z-index:9999}
    header.large #head_home_main .app-banner-on {height:187px}
    header.small #head_home_main {width:100% ; float:left; background:#ff7065; height:137px;   position:fixed ; z-index:9999}
    header.small #head_home_main .app-banner-on {height:187px}
}

/* #tablet */
@media all and (min-width: 769px) and (max-width: 1024px) {
/* @media all and (max-width:1024px) and (min-width:769px) { */
    #head_home_m { display:none}

    #head_home {width:100% ; float:left; background:#ff7065; height:137px;   position:fixed ; z-index:9999}
    #head_home .inner{margin:0px auto; position:relative;left:0px; }            
    #head_home .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:157px; display: table-cell;  vertical-align: middle; height: 137px; background-position: center left; margin-left:70px}
    #head_home .inner .menu{ display: none }
    #head_home .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
    #head_home .inner .menu ul li a{color:#fff;}
    #head_home .inner .menu ul li a:hover{color:#F33;}
    #head_home .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    #head_home .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    #head_home .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    #head_home .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    #head_home .inner .myinfo{  position:absolute; right:20px; top:40px; }
    #head_home .inner .myinfo .name{ display: none}
    #head_home .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    #head_home .inner .myinfo .name .photo img{ float: left; width:100%; }
    #head_home .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
    #head_home .inner .myinfo a.btn_manager{ display: none}
    #head_home .inner .myinfo a.btn_manager img{ width:80px; }
    #head_home .inner .myinfo a.btn_login{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_login img{ width:53px; }
    #head_home .inner .myinfo a.btn_join{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_join img{ width:74px; }
    #head_home .inner .myinfo a.btn_logout{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #fff ; margin-right: 10px;  margin-top: 5px}
    #head_home .inner .myinfo a.btn_logout img{ width:74px; }
    #head_home .inner .myinfo .icon1{float: left; margin-right: 10px }
    #head_home .inner .myinfo .icon1 img{ width:50px}
    #head_home .inner .myinfo .icon2{float: left; margin-right: 10px  }
    #head_home .inner .myinfo .icon2 img{ width: 50px}
    #head_home .inner .left_icon{position:absolute; left:20px; top:43px;}
    #head_home .inner .left_icon i{color: #fff; font-size: 50px}

	.app-banner-on {height:197px}
	.app-banner-off {height:137px}
	
	header.large .head_home_main {width:100%;background:rgba(0, 0, 0, 0.0);position:fixed;z-index:9999}   
    header.small .head_home_main {width:100%;background:#ff7065;position:fixed;z-index:9999}
	
    .head_home_main {width:100%;background:rgba(0, 0, 0, 0.0);position:fixed;z-index:9999}    
    .head_home_main .inner{margin:0px auto; position:relative;left:0px; }
    .head_home_main .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:157px; display: table-cell;  vertical-align: middle; height: 137px; background-position: center left; margin-left:70px}
    .head_home_main .inner .menu{ display: none }
    .head_home_main .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
    .head_home_main .inner .menu ul li a{color:#fff;}
    .head_home_main .inner .menu ul li a:hover{color:#F33;}
    .head_home_main .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    .head_home_main .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    .head_home_main .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    .head_home_main .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    .head_home_main .inner .myinfo{  position:absolute; right:20px; top:40px; }
    .head_home_main .inner .myinfo .name{ display: none}
    .head_home_main .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    .head_home_main .inner .myinfo .name .photo img{ float: left; width:100%; }
    .head_home_main .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
    .head_home_main .inner .myinfo a.btn_login{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_login img{ width:53px; }
    .head_home_main .inner .myinfo a.btn_join{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_join img{ width:74px; }        
    .head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 10px 30px; background-color: #f8bb50 }
    .head_home_main .inner .myinfo a.btn_manager img{ width:100px; }
    .head_home_main .inner .myinfo a.btn_logout{ float: left; border-radius: 200px; padding: 7px 20px; background-color: #fff ; margin-right: 10px;;  margin-top: 5px}
    .head_home_main .inner .myinfo a.btn_logout img{ width:74px; }
    .head_home_main .inner .myinfo .icon1{float: left; margin-right: 10px }
    .head_home_main .inner .myinfo .icon1 img{ width:50px}
    .head_home_main .inner .myinfo .icon2{float: left; margin-right: 10px  }
    .head_home_main .inner .myinfo .icon2 img{ width: 50px}
    .head_home_main .inner .left_icon{position:absolute; left:20px; top:43px;}
    .head_home_main .inner .left_icon i{color: #fff; font-size: 50px}     

    #talk_div{position: fixed; z-index: 100000001; bottom: 10px; right: 15px; text-align: right;}
    #talk_img{cursor: pointer; height: 118px;}
    #coupon_div{position: fixed; z-index: 100000001; bottom: 138px; right: 15px; text-align: right;}
    #coupon_img{cursor: pointer; height: 108px; padding:0px 6px;}
    #order_div{position: fixed; z-index: 100000001; bottom: 118px; right: -5px; text-align: right;}
    #order_img{cursor: pointer; height: 160px;}

    footer{ width: 100%; float: left ;box-sizing: border-box;  padding: 20px 20px; background-color: #f3f1f4 }
    .bt_menu{ width: 100%; display: flex; flex-direction: row; justify-content: space-between/*float: left; margin-bottom: 20px*/ }
    .bt_menu a{  float: left; font-size: 16px; color: #666 }
    .bt_menu .line{  float: left; margin: 0px 10px;font-size: 18px; color: #666  }
    .bt_menu .bt_menu_wide {display: none}
    
    .btm-help{font-size: 16px;}
    .btm-help .cs{font-size: 20px;font-weight: bold}
    .btm-help .counselKakao{color: #999; border: 1px solid; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; padding:0 10px; font-size: 0.9em;}
        
    .bt_cs{ width: 100%; float: left; margin-bottom: 30px;  font-size: 16px; color: #999999  }
    .bt_cs .label_type1 {display: inline}
    .bt_cs .txt_comma {display: inline}
    .bt_cs .txt_br {display: inline}
    .bt_cs .bt_cs_social {display: block;margin: 10px 0;}
        
    .bt_sns{ width: 100%; float: left; margin-bottom: 30px;  text-align: center }
    .bt_sns img{ margin: 0px 10px }
}

/* #mobile */
/* @media all and (min-width: 321px) and (max-width: 768px) { */
@media only all and (max-width:768px) {
    #head_home {width:100% ; float:left; background:#ff7065;  height:50px; position:fixed ; z-index:9999}
    #head_home .inner{margin:0px auto; position:relative;left:0px; }
    #head_home .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:90px; display: table-cell;  vertical-align: middle; height: 50px; background-position: center left; margin-left:50px}
    #head_home .inner .menu{ display: none }
    #head_home .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
    #head_home .inner .menu ul li a{color:#fff;}
    #head_home .inner .menu ul li a:hover{color:#F33;}
    #head_home .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    #head_home .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    #head_home .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    #head_home .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    #head_home .inner .myinfo{  position:absolute; right:10px; top:10px; }
    #head_home .inner .myinfo .name{ display: none}
    #head_home .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    #head_home .inner .myinfo .name .photo img{ float: left; width:100%; }
    #head_home .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
    #head_home .inner .myinfo a.btn_login{ display: none; float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_login img{ width:53px; }        
    #head_home .inner .myinfo a.btn_join{display: none;  float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    #head_home .inner .myinfo a.btn_join img{ width:74px; }                    
    #head_home .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 0px 7px 5px 7px; background-color: #f8bb50;  }
    #head_home .inner .myinfo a.btn_manager img{ width:70px; }
    #head_home .inner .myinfo a.btn_logout{ display: none; }
    #head_home .inner .myinfo a.btn_logout img{ width:74px; }		                
    #head_home .inner .myinfo .icon1{float: left; margin-right: 10px }
    #head_home .inner .myinfo .icon1 img{ width:30px}
    #head_home .inner .myinfo .icon2{float: left; margin-right: 10px  }
    #head_home .inner .myinfo .icon2 img{ width: 30px}        
    #head_home .inner .left_icon{position:absolute; left:10px; top:10px;}
    #head_home .inner .left_icon i{color: #fff; font-size:30px}        
        
    #head_home_m {width:100% ; float:left;  background:#ff7065;  position:fixed ; z-index:999999999 !important;  }
    #head_home_m .m_head{width:100% ; float:left;  background:#ff7065; height:50px; position:relative; text-align:center; box-sizing:border-box; padding:5px 0px}
    #head_home_m .m_head .toplogo{width:100% ; float:left;  text-align:center}
    #head_home_m .m_head a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:120px; display: table-cell;  vertical-align: middle; height: 100px; background-position: center left}
    #head_home_m .m_head .icon1{ position:absolute; top:10px; left:10px;}
    #head_home_m .m_head .icon1 img{ width:30px}
    #head_home_m .m_head .icon2{ position:absolute; top:10px; left:50px;}
    #head_home_m .m_head .icon2 img{ width:30px}
    #head_home_m .m_head .icon3{ position:absolute; top:10px; right:50px;}
    #head_home_m .m_head .icon3 img{ width:30px}
    #head_home_m .m_head .icon4{ position:absolute; top:12px; right:10px; z-index:9999999999999999999999999999999999; color:#fff}
    #head_home_m .m_head .icon4 i{ color:#fff}
    #head_home_m .m_head .icon4 img{ width:30px;}
    #head_home_m .m_head .icon_left{ position:absolute; top:10px; left:5px;}
    #head_home_m .m_head .icon_left img{ width:28px}
    #head_home_m .m_head .icon5 i{ color:#fff}
    #head_home_m .m_head .icon5 img{background:url(../_img/search/icon_3.png); width:28px;}
    
    .app-banner-on {height:110px}
    .app-banner-off {height:50px}
    
    header.large .head_home_main {width:100%;background:#ff7065;position:fixed;z-index:9999}
    header.small .head_home_main {width:100%;background:#ff7065;position:fixed;z-index:9999}
    
    .head_home_main {width:100%;background:#ff7065;position:fixed;z-index:9999}    
    .head_home_main  .inner{margin:0px auto; position:relative;left:0px; }
    .head_home_main .inner a.toplogo{ float:left; background: url( ../_img/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:90px; display: table-cell;  vertical-align: middle; height: 50px; background-position: center left; margin-left:50px}
    .head_home_main .inner .menu{ display: none }
    .head_home_main .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
    .head_home_main .inner .menu ul li a{color:#fff;}
    .head_home_main .inner .menu ul li a:hover{color:#F33;}
    .head_home_main .inner .search{  position:absolute; right:50px; top:9px; width:70px}
    .head_home_main .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
    .head_home_main .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
    .head_home_main .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
    .head_home_main .inner .myinfo{  position:absolute; right:10px; top:10px; }
    .head_home_main .inner .myinfo .name{ display: none}
    .head_home_main .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
    .head_home_main .inner .myinfo .name .photo img{ float: left; width:100%; }
    .head_home_main .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }
    .head_home_main .inner .myinfo a.btn_login{ display: none; float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_login img{ width:53px; }        
    .head_home_main .inner .myinfo a.btn_join{display: none;  float: left; border-radius: 200px; padding: 10px 30px; background-color: #fff ; margin-right: 10px}
    .head_home_main .inner .myinfo a.btn_join img{ width:74px; }                    
    .head_home_main .inner .myinfo a.btn_manager{ float: left; border-radius: 200px; padding: 0px 7px 5px 7px; background-color: #f8bb50;  }
    .head_home_main .inner .myinfo a.btn_manager img{ width:70px; }
    .head_home_main .inner .myinfo a.btn_logout{ display: none; }
    .head_home_main .inner .myinfo a.btn_logout img{ width:74px; }		                
    .head_home_main .inner .myinfo .icon1{float: left; margin-right: 10px }
    .head_home_main .inner .myinfo .icon1 img{ width:30px}
    .head_home_main .inner .myinfo .icon2{float: left; margin-right: 10px  }
    .head_home_main .inner .myinfo .icon2 img{ width: 30px}        
    .head_home_main .inner .left_icon{position:absolute; left:10px; top:10px;}
    .head_home_main .inner .left_icon i{color: #fff; font-size:30px}      

    .sub_head_sp {width:100% ; float:left; height:60px; }
    .sub_head_sp_orderview {width:100% ; float:left; height:140px; }		
    .service-info-area {padding-top:50px;}	
    .sub_head {width:100% ; float:left;  background:#fff; height:50px; text-align:center; font-size: 20px; color: #000; line-height: 45px; position: relative; padding-top: 10x  }
    .sub_head .icon1{ position: absolute; left: 10px; top: 0px; }
    .sub_head .icon1 i{  color: #999; font-size: 20px }
    .sub_head .toplogo{width:100% ; float:left;  text-align:center}
    .sub_head .toplogo a{ height:28px; margin-top:6px}
    .sub_head .icon4{  display: none;  position:absolute; top:3px; right:10px;  z-index: 999999999;color:#fff; width: 40px; height: 40px}
    .sub_head .icon4 i{ color:#999}
    .sub_head .icon5{ position:absolute; top:3px; right:10px;  z-index: 999999999;color:#fff; width: 40px; height: 40px}
    .sub_head .icon5 i{ color:#999}

    .smenu { width: 100%;  float: left; margin-top: 10px; padding: 0px 0px; border-bottom: 1px solid #ccc;  }
    .smenu ul li{ float: left;   margin-bottom: 0px; height: 50px}
    .smenu ul li.menu_on{ float: left; padding: 0px 3px; box-sizing: border-box;}
    .smenu ul li.menu_on a{ width: 100%; float: left; padding: 10px 0px; background-color: #ff7065; color: #fff; font-size: 11px; text-align: center;  border-radius: 200px;}	
    .smenu ul li.menu{ float: left; padding: 0px 3px; box-sizing: border-box;}
    .smenu ul li.menu a{ width: 100%; float: left; padding: 10px 0px; background-color: #999999; color: #fff; font-size: 11px; text-align: center;  border-radius: 200px;}	

    #container{ width: 100%; float: left; box-sizing: border-box; padding: 0px;  margin: 0px;  }

    #cont_body{ width: 100%; float: left; box-sizing: border-box;  }
    .m_com_pd{ padding: 10px; box-sizing: border-box }
    .m_com_pd2{ padding: 0px 10px; box-sizing: border-box }
    .pc_top_pd{ width: 100%;float: left; height: 0px  }

    #talk_div{position: fixed; z-index: 100000001; bottom: 50px; right: 15px; text-align: right;}
    #talk_img{cursor: pointer; height: 69px;}
    #coupon_div{position: fixed; z-index: 100000001; bottom: 128px; right: 15px; text-align: right;}
    #coupon_img{cursor: pointer; height: 60px; padding:0px 5px;}
    #order_div{position: fixed; z-index: 100000001; bottom: 118px; right: 0px; text-align: right;}
    #order_img{cursor: pointer; height: 89px;padding:0px 5px;}

    footer{ width: 100%; float: left; box-sizing: border-box;  padding: 20px 15px; background-color: #f3f1f4  }
    .bt_menu{ width: 100%; display: flex; flex-direction: row; justify-content: space-between/*float: left;margin-bottom: 10px*/  }
    .bt_menu a{ float: left; font-size: 12px; color: #666 }
    .bt_menu .line{  float: left; margin: 0px 5px; font-size: 14px; color: #666  }
    .bt_menu .bt_menu_wide {display: none}
    
    .btm-help{font-size: 12px;}
    .btm-help .cs{font-size: 16px;font-weight: bold}
    .btm-help .counselKakao{color: #999; border: 1px solid; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; padding:0 10px; font-size: 0.9em;}
        
    .bt_cs{ width: 100%; float: left; margin-bottom: 30px; font-size: 12px; color: #999999}
    .bt_cs .label_type1 {display: block}
    .bt_cs .txt_comma {display: none}
    .bt_cs .txt_br {display: none}
    .bt_cs .bt_cs_social {display: block;margin: 10px 0;}

    .bt_sns{ width: 100%; float: left;   text-align: center }
    .bt_sns img{ margin: 0px 3px }

    .quick_info{ width: 100%; float: left; background-color: #fb7367; height: 200px;  position: relative }	
    .quick_info .info_my{ margin-top: 50px; text-align: center; overflow: hidden;width: 100%; float: left }	
    .quick_info .info_my .photo{ width:60px; height: 60px;  border-radius: 200px; overflow:hidden; display: inline-block; vertical-align: middle; margin-bottom: 5px}
    .quick_info .info_my .photo img{ width:100%; }
    .quick_info .info_my .name{ width:100%; text-align: center; font-size: 15px; color: #fff ; margin-bottom: 10px}
    .quick_info .info_btn{ width: 100%;  text-align: center; overflow: hidden;}
    .quick_info .info_btn  a.info{  display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #f8bb50; color: #fff; font-size: 14px;  border-radius: 200px; margin: 0px 5px}
    .quick_info .info_btn  a.logout{ display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #e6e6e6; color: #666; font-size: 14px;  border-radius: 200px; margin: 0px 5px}
    .quick_info .info_btn  a.login{ display: inline-block; vertical-align: middle; padding: 5px 10px; background-color: #5ecfcd; color: #666; font-size: 14px;  border-radius: 200px; margin: 0px 5px}                    
    .quick_info .close{ position: absolute; top: 10px ; right: 10px;  }	
    .quick_info .close i{ color: #fff; font-size: 30px }	
        
    .quick_kko{ width: 100%; float: left; background-color: #f4f4f4; padding: 20px 15px;  }	
    .quick_kko img{ width: 100%;   }
}