@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1680px){
}
@media screen and (max-width:1420px){
body{ }
.box1{}
.PC{ display:none !important}
.PHONE{ display:block !important}

#header .banner_top .btn{ left:auto; right:0; margin-left:0;}
}
@media screen and (max-width:1240px){
body{ font-size:15px}
.di_wrap > li{ font-size:.938rem}
.box1{ width:96%}

}
@media screen and (max-width:1140px){
body{ font-size:14px}
.di_wrap > li{ font-size:.875rem}

#header .menu_wrap .menu .gnb > li .dp1{ font-size:.938em;}

#footer .cs_wrap .no .tt{ font-size:1.25em}
#footer .cs_wrap .no .t1.tt{ font-size:1.313em}

/*greeting*/
.greetings .img .m_img{right:90px;}
.greetings .img .line_de{ display:none;}


}
@media screen and (max-width:1024px){
#header .banner_top .btn{ width:3em;}
#header .banner_top .btn .tt{ display:none !important}

#header .top_wrap{ border-bottom:1px solid #ccc; padding-bottom:1em;}
#header .top_wrap .box1{ position:relative;}
#header .top_wrap .logo{ width:10em; padding-left:3em}
#header .top_wrap .menu > li .in .xi.arrow{ display:none;}

#header .menu_wrap{ display:none}

#header .all_btn{ position:absolute; top:.375em; left:0; width:60px;}
#header .all_btn .btn{ height:1.5em; text-align:left;}
#header .all_btn .ham{ position:relative; display:block; margin:0 auto; width:20px !important; left:0;}
#header .all_btn .ham,
#header .all_btn .ham:before,
#header .all_btn .ham:after { width:25px; height:2px; background:#111; transition:.2s;}
#header .all_btn .ham:before,
#header .all_btn .ham:after { content:""; position:absolute; left:0;}
#header .all_btn .ham:before{ top:-8px;}
#header .all_btn .ham:after { bottom:-8px;}

#quick{ display:none}


/*greetings*/
.greetings .img .m_img{right:65px;}
.greetings .img .bg_img{right:45px;}
.greetings .tx_b .tx_b_01{ font-size:1em;}
.greetings .tx_b .tx_s{ font-size:.9em;}
.greetings .tx_b .tx_b_01 .eg_tx{ font-size:.8em; letter-spacing:12px;}
.greetings .tx_b .tx_b_01 .tt_s{ font-size:1.5em;}
.greetings .tx_b .tt_st{ font-size:1em;}

.enterInfo_bottom .gnb > li{ width:25%}

/**/
.pr_con_wrap .fixIn{ display:none}

.ceo_img{ display: none;}
.ceo_txt{ width: 100%;}

}

@media screen and (max-width:920px){

/*greetings*/
.greetings .img .bg_img{ width:320px; right:30px; height:410px;}
.greetings .img .m_img{ width:320px; right:50px; height:410px;}
.greetings .tx_b .tx_b_01 .eg_tx{ display:none;}

/**/
.mainVisual_wrap,
.mainVisual .slick-track,
.mainVisual .item{ height:33.5em}

.main_tab .tab > li{ flex:1 0 16.66%; max-width:16.66%;}

}

@media screen and (max-width:860px){
body{ font-size:13px}
.di_wrap > li{ font-size:.813rem}

.pc_hide{ display:block}

/*모바일퀵*/
.mQuick{ display:block; position:fixed; z-index:1002; left:0; bottom:0; width:100%; background:#393a3e; border-top:1px solid #111; text-align:center;}
.mQuick .vm_wrap{ height:60px;}
.mQuick ul > li{ width:25%;}
.mQuick ul > li > a{ color:#fff; padding:.8em 0}
.mQuick ul > li > a .xi{ display:block; font-size:1.500em;}
.mQuick ul > li > a .tt{ display:block; font-size:.750em;}

#header .banner_top.on .btn{ display:none}
#header .top_wrap .down{ display:none;}
#header .top_wrap .etc .search_wrap{ width:15em;}

.main_banner{ padding:1em 0 !important}
.main_banner .inner{ margin-left:-1em}
.main_banner .inner .link{ margin-left:1em}
.main_banner .resize{ padding-bottom:66%}
.main_banner .inner .link .con_wrap{ padding-top:1.75em;}
.main_banner .inner .link .con_wrap > dt{ font-size:1.250em}

.main_con{ padding:2em 0}
.main_tit .tt{ font-size:1.750em}
.list_prod_wrap.st1 .list_prod .prod .el{ width:50%}
.list_prod_wrap .list_prod .resize{ padding-bottom:88%}
.list_prod_wrap .list_prod .prod .in .con_wrap{ font-size:.875rem}
.list_prod_wrap .list_prod .prod .in .best_num{ width:2.8em; height:2.8em; line-height:2.8em}
.list_prod_wrap .list_prod .prod .in .best_num .no{ font-size:1.250em}
.main_new .in_wrap .tit_wrap .con{ font-size:.750rem}
.main_new .tit_wrap .txt.t2{ font-size:1.570em}
.main_new .tit_wrap .txt.t1{ font-size:1.750em}
.main_new .main_arrow_wrap{ font-size:.7rem}

.main_new .tit_wrap .txt.t1{ padding:0}
.main_new .in_wrap{ flex-wrap:wrap}
.main_new .in_wrap .inner{ max-width:100%; flex:1 0 100%; min-height:20.75em; padding:3em 0}
.list_prod_wrap.slide.st2 .list_prod .resize{ padding-bottom:100%}
.main_event_slide .main_arrow_wrap{ display:none}

#footer .menu_wrap .sns_menu{ display:none}
#footer .info_wrap{ padding-bottom:6em;}
#footer .info_wrap .etc:before{ display:none;}
#footer .info_wrap .etc .inner{ padding-left:0}
#footer .cs_wrap .cs_box.st3{ display:none}
#footer .cs_wrap .cs_box.st1,
#footer .cs_wrap .cs_box.st2{ width:50%}
#footer .cs_wrap{ padding:1em 0}
.main_customer .customer_wrap .inner{ width:100%;}
.main_customer .cs .cs_wrap .tt{}
.main_customer .cs .cs_wrap .txt .tt:before{ display:none}
.main_customer .cs{ padding:1em; background:#f9f9f9}

/**/
#contents .doc{ padding:2em 0 0}
#contents .sub_top_wrap .sub_visual .t2{ font-size:1.570em}
#contents .sub_top_wrap .sub_gnb .box1{ width:100%; max-width:100%}
#contents .sub_top_wrap .sub_visual{ padding:1.5em 0}

/*board*/
.input_st.w3{ width:18.25em}
.board_search_wrap{ font-size:.750rem;}
.board_search_wrap .left{ display:none;}
.board_search_wrap .left,
.board_search_wrap .right{ float:none}
.board_search_wrap .input_st[type=text]{ width:14em}
.board_view_top, .board_view_middle, .board_view_bottom{ font-size:.750rem}
.board_st.view{ font-size:.750rem}
.board_st{ font-size:.750rem}
.w_no{ width:2.5em}
.w_name{ width:3.5em}
.w_date{ width:7em}
.w_hit{ width:5em}
.w_img{ width:7em}
.w_star{ width:6em}
.w_btn{ width:4em}
.w_prod{ width:15em}
.w_state{ width:3em}
.w_price{ width:8em}
.w_check{ width:2em}
.w_btn2{ width:4em}
.w_order_num{ width:6em}
.w_vol{ width:6em}
.w_point{ width:5em}
.input_st.s1{ font-size:.875em}
.input_st.w5{}
.dp2_order .w_prod{ width:7em}
.dp2_order .w_price{ width:5em}
.dp2_order .w_date{ width:4em}
.board_search_wrap .search_cate{ overflow-x:scroll}
/*.search_cate .input_st.s3{ min-width:10em}*/
.board_search_wrap .search_cate.left{ padding-bottom:.3em}
.board_search_wrap .search_cate.left button{ flex:1 0 5em}
.board_search_wrap .search_cate button{ flex:1 0 auto}
.board_st th, .board_st td{ padding:.5em}
input[type=button].input_st, input[type=submit].input_st, button.input_st, a.input_st{ min-width:3.5em}
.table_st th, .table_st td{ height:1.5em}
.my_search_wrap{ font-size:.750rem;}
.my_search_wrap > em{ display:block; margin:.3em 0}
.my_search_wrap input[type=button].input_st, input[type=submit].input_st, button.input_st, a.input_st{}
.input_sec{ display:inline-block}
.input_st.s2{ height:2.8em;}
.board_st.faq .BScon .w_tit{ padding-top:1em}
.shopping .w_price{ width:5em}
.shopping .w_prod{ width:6em}
.shopping .table_st.noline .label_st.ml30{ margin-left:20px !important}


.table_st .total_wrap:before, .table_st .total_wrap:after{ display:none}
.order_wrap{ padding-right:0}
.order_wrap .order_fix_wrap{ width:100%}
.order_wrap .order_fix_wrap .order_fix{ width:100%; position:static !important; top:unset !important}
.fixWrap .fixIn .fixObj.scroll{ position:static !important; bottom:0; top:unset !important}
.fixWrap .fixIn{ position:static !important; margin-top:1em}
.fixWrap .fixIn .fixObj.bottom{ position:static !important; top:unset !important}




/*.order_wrap .order_fix_wrap .order_fix{ width:100%; position:relative; bottom:0; top:unset !important}
.order_wrap .order_fix_wrap{ width:100%}
.fixWrap .fixIn{ position:relative}
.fixWrap .fixIn .fixObj.bottom{ position:relative; bottom:0;}
.fixWrap .fixIn .fixObj.scroll{ top:unset !important; position:relative; bottom:0}
.table_st .total_wrap:before, .table_st .total_wrap:after{ display:none}*/

/**/
.response{ border-top:none;}
.response,
.response caption,
.response thead,
.response tbody,
.response tfoot,
.response th,
.response td,
.response tr{ display:block; box-sizing:border-box; text-align:left;}
.response thead tr{ padding:0 1.5em;}
.response thead tr th:not(.w_no){ display:none;}
.response tbody tr{ margin-top:5px; padding:0.5em 1.5em; border:1px solid #777; position:relative;}
.response tbody tr:first-child{ margin-top:0; display:none}
.response tbody tr th{ position:absolute; top:-9999px; left:-9999px;}
.response tbody tr td{position:relative;padding:6px 0 6px 70px !important;width:100% !important;height:auto !important;min-height:30px;line-height:30px;border:none;}
.response tbody tr td:before{ content:attr(data-th); position:absolute; top:-1px; bottom:-1px; left:0; padding:6px 0; line-height:30px; color:#777; font-weight:bold; white-space:nowrap; box-sizing:border-box;}
/*.response tbody tr .w_no{position:absolute;z-index:2;top:15px;left:1.5em;padding:0 !important;}*/
.response tbody tr .w_prod{ position:relative; z-index:1;}
.response tbody tr .w_price,
.response tbody tr .w_point{ width:auto !important; display:inline-block; vertical-align:top;}
.response tbody tr .w_price{ padding-right:2.5em !important;}
.response thead tr th{ position:relative; margin-bottom:.5em; width:100% !important; height:auto !important; min-height:30px; line-height:1.2; padding:0; border:none; text-align:left;}
.response thead tr th:after{ content:attr(data-th); display:inline-block; vertical-align:middle; padding:0 0 0 5px; font-size:1.250em; color:#000; font-weight:bold; box-sizing:border-box;}
.response .prod_info{ display:inline-block; width:auto;}
.response .prod_info .img{ display:block;}
.response .prod_info .img{ width:auto; max-width:300px;}
.response .prod_info .tit{ display:block; padding:1em 0 0 0; font-size:1.125em; line-height:1.2;}
.response .vol .btn{ line-height:1;}
.response .label_st.de{ font-size:1.250em; vertical-align:middle;}

.response .tt_prod_price,
.response .tt_prod_price + *,
.response .tt_prod_point,
.response .tt_prod_point + *,
.response .tt_prod_num,
.response .tt_prod_num + *{ vertical-align:top;}

.response.join_response th{ position:unset; top:unset; left:unset; display:block; padding-bottom:2em; margin-bottom:.3em; border-left:0}
.response.join_response tbody tr td{ padding:0 .5em !important}
.response.join_response .input_st.w1{ width:20em}
.response.join_response .label_select:after{ margin-top:-1em}
.response.join_response select.input_st{ width:20em}
.response.join_response .input_st.w3{ width:20em}

.response tbody tr td .no_cart{ padding-left:0 !important; margin-left:-70px; font-size:.875em}


/*제품페이지*/
.list_prod_wrap .wrap_top .wrap_tab > li{ width:5em}
.tab_st > li > a .va{ font-size:1em}
.list_prod_wrap .list_prod .prod .in .con_wrap{ padding-bottom:1.5em}

.mall_view_top .mall_view_img{ width:100%}
.mall_view_top .mall_view_img .thumb{ text-align:center}
.mall_view_top .mall_view_info{ width:100%; margin-top:1em}
.mall_view_top .mall_view_info .prod_tit .t1{ font-size:1.125em}
.mall_view_wrap{ padding:1em}


/*회원가입*/
.tbox .t0{ font-size:1.375em}
.tbox .t2{ font-size:.875em}
.join_type > li .in .tit{ font-size:1.375em}
.w_form_tit{ width:8em}
.login_wrap .login .link_wrap > li > a{ padding:0 .5em}

.main_top .wrap_sec .con1{ left:auto; right:0; width:37%; z-index:1; height:auto}
.main_top .wrap_sec .con2{ padding:0; margin:0; width:61%}
.main_top .wrap_sec .con3{ position:relative; width:100%; padding-right:39%; box-sizing:border-box; margin-top:1em}
.main_top .wrap_sec .con3:after{ content:""; clear:both; display:block}
.main_top .wrap_sec .con3 .mainTopShopMD{ float:left; width:48%}
.main_top .wrap_sec .con3 .mainTopShopMD + .mainTopShopMD{ float:right}
.main_top .shop_list .mainTopShop_wrap{ padding-bottom:163%}
.main_top .shop_list .mainTopShop .in .tit{ font-size:1.25em}
.main_top .shop_list .mainTopShop .in .tt{ display:block; font-size:.938em; margin:.5em 0}
.main_top .shop_list_best{ position:relative; font-size:1.125em; margin-top:.625em}
.main_top .shop_list_best .list > li > a{ line-height:2em}
.main_top .banner_link{ width:37%; left:auto; right:0}
.mall_view_top .mall_view_btn > li .btn{ font-size:.875em}

.mainVisual_wrap,
.mainVisual .slick-track,
.mainVisual .item{ height:28.5em}

.main_tit_banner{ overflow:hidden; padding:1em 0 .5em 0}
.main_tit_banner .banner{ position: relative; top:0}
.main_tit_banner .banner.left{ float:left; width:49.5%}
.main_tit_banner .banner.right{ float:right; width:49.5%; margin-bottom:.5em}
.main_tit_banner .main_tit{ clear:both; padding-top:3em; margin:0; width:100%}

.main_middle .wrap_sec .con2{ width:100%; margin:0}
.main_middle .wrap_sec .con1,
.main_middle .wrap_sec .con3{ position:static; float:left; width:50%; overflow:hidden}
.main_middle .wrap_sec .mainMiddleBanner{ float:left; width:49%}
.mainMiddleBanner{ margin:.5em .5% 1em .5%}
.mainMiddleBanner::before,
.mainMiddleBanner::after{ border:none}
.mainMiddleBanner .in .resize{ padding-top:0}

.tab.cateImg .gnb > li{ width:25%}
.tab.cateImg .gnb > li > a{ padding-bottom:40%; margin-top:.25em; margin-bottom:.25em}
.tab.cateImg .el > a .va{ width:100%; border-radius:0; box-sizing:border-box; border:none}
.tab.cateImg .el > a .va .tt{ font-size:.875em}

.st1.list_prod_wrap .list_prod .prod > li{ width:25%}
.st4.list_prod_wrap{ min-height:inherit}
.st4.list_prod_wrap .list_prod .prod .in .con_wrap{ bottom:0; width:45%}

.mainPartners .el{ width:25%}

#footer .cs_wrap{ text-align:center}
#footer .cs_wrap .wrap1{ width:100%}
#footer .cs_wrap .link{ display:inline-block; width:100%; max-width:30em}
#footer .cs_wrap .wrap2{ margin:2em 2.5%; width:45%}
#footer .cs_wrap .cs_tit2{ margin-bottom:.5em}

#footer .info_wrap .logo{ float:none; width:50%; max-width:15em; margin-bottom:1em}
#footer .info_wrap .info,
#footer .info_wrap .etc{ float:none; width:100%}
#footer .info_wrap .etc > dl{ border-top:1px solid rgba(255,255,255,.1); border-left:none; padding-left:0; padding-top:1em; margin-top:1em}
#footer .etc_wrap .box1{ width:100%}
#footer .etc_wrap .logo > li > a{ padding-bottom:20%}


/*greetings*/

.greetings .img{ width:100%;}
.greetings .img .con_box{ margin-top:0;}
.greetings .img .m_img{width:100%; position: unset; height:250px;}
.greetings .img .bg_img{ display:none;}
.greetings .con_box{ float:none;}
.greetings .tx_b{ width:100%;}

/**/
.sub_lnb_wrap,
.sub_con_wrap{ float:none; width:100%}
.sub_lnb_wrap{ position:relative; min-height:8.3em; padding-left:0; box-sizing:border-box; margin-bottom:1em}
.sub_lnb_wrap .cateImg{ position:absolute; left:0; top:0; width:10em; height:8.3em}
.sub_lnb_wrap .cate_list{ border:none}
.sub_lnb_wrap .cate_list .dp2:after{ content:""; clear:both; display:block}
.sub_lnb_wrap .cate_list .dp2 > li{ float:left; width:33.33%}
.sub_lnb_wrap .cate_list .dp3_wrap{ display:none}
.sub_lnb_wrap .list_banner{ display:none}

.st3.list_prod_wrap .list_prod .prod > li:nth:child(3n+1){ clear:both}

.pr_top .top_in{ padding:1em 0; margin:0}
.pr_top .top_in .info{ max-width:100%; display:block}
.pr_top .top_in .no{ position:relative; width:auto; margin-top:2em}

.map_contents > li .map_size{ height:20em}

.page_tit .t1{ font-size:1.5rem}
.enterInfoCon1 .el{ display:flex; flex-wrap:wrap}
.enterInfoCon1 .el .img_wrap{ width:100%; margin-left:0; order:-1}
.enterInfoCon1 .el .con_wrap{ position:relative; width:100%}
.enterInfoCon1 .el .con_wrap .no{ margin:1em 0 0 0}
.enterInfoCon1 .el .con_wrap .tt{ padding-left:0}
.enterInfoCon2 > li{ width:50%}
.enterInfoCon2 > li .in{ padding-right:1em; padding-bottom:6em}
.enterInfoCon3 .con_wrap .tt br{ display:none}

.addCon1 > li{ }
.addCon1 > li .in{ margin-top:0}
.addCon1 > li .resize{ padding-bottom:100% !important; font-size:.75em}
.addCon3,
.monitor{ float:none; width:auto}
.addCon3{ margin-bottom:2em}
.addCon3 .st1.in{ margin-left:0}

.memberstatus_wrap .img{ position:relative; width:auto; margin-top:1em}
.memberstatus_wrap .con{ padding-left:0}

.table_wrap{ overflow-x:auto}
.table_wrap > table{ width:1200px}

.form_wrap{ padding:0; border:none}
.form_wrap .tit_wrap,
.form_wrap .con_wrap{ float:none; width:auto}
.form_wrap .tit_wrap .page_tit{ margin-bottom:0}

.login_w{ padding:1.5em}

.join_type{ display:flex; flex-wrap:wrap}
.join_type > li{ float:none; width:100%}
.join_type > li:last-child{ order:-1}
.join_type > li .in{ min-height:inherit; padding:1.5em}

.step_st{ font-size:.75em}
.page_tit{ font-size:2em}
}


@media screen and (max-width:640px){
body{ font-size:13px}

.pc_hide{ display:block} /*모바일퀵*/

.m_response{ visibility:visible; display:table-row} /*회원가입테이블*/
.p_response{ display:none} 

#header .banner_top .btn .xi{ font-size:1.5em}

#header .top_wrap .box1{ display:flex; flex-wrap:wrap; justify-content:space-between;}
#header .top_wrap .logo,
#header .top_wrap .etc,
#header .top_wrap .menu{ float:none;}
#header .top_wrap .menu{ flex:1; text-align:right;}
#header .top_wrap .menu > li.go_hancom{ float:none; display:inline-block;}
#header .top_wrap .menu > li.go_hancom .in{ padding-left:.75em; padding-right:.75em;}
#header .top_wrap .etc{ order:10; width:100%; margin:1em 0 0 0; height:3em; text-align:center;}
#header .top_wrap .etc .search_wrap{ display:inline-block; width:100%;}
#header .top_wrap .etc .search_wrap.active .detail_box{ left:0;}

/*모바일퀵*/
.mQuick{ display:block; position:fixed; z-index:1002; left:0; bottom:0; width:100%; background:#393a3e; border-top:1px solid #111; text-align:center;}
.mQuick .vm_wrap{ height:60px;}
.mQuick ul > li > a{ color:#fff; padding:.8em 0}
.mQuick ul > li > a .xi{ display:block; font-size:1.500em;}
.mQuick ul > li > a .tt{ display:block; font-size:.750em;}

.mainVisual_wrap, .mainVisual .slick-track, .mainVisual .item{ height:20.5em}
.mainVisual_wrap .slick-dots{ bottom:1em}

/*메인후기*/
.main_review .review_wrap .inner.w1{ display:none}
.main_review .review_wrap .inner.w2{ flex:1 0 100%; max-width:100%}
.main_review .review_wrap .list.st2 .in .img_wrap{ width:40%}
.main_review .review_wrap .list.st2 .in .con_wrap{ width:50%}

#footer .menu_wrap .menu > li > a{ padding:0 .3em}

.main_tab .tab > li{ flex:1 0 25%; max-width:25%;}
.main_tab .tab > li .in .tt{ font-size:.875em}

.main_company .inner > li{ flex:1 0 80%;}


/*회원가입*/
.join_type > li .in .btn_area{ width:100%}
.w_form_tit{ width:6em}
.input_st.w1{ width:10em}
.table_st th, .table_st td{ padding:.5em}
.agree_wrap > li{ width:100%}
.board_tt3{ font-size:.570em}


.dp1_customer.dp2_review .w_img{}
.dp1_customer.dp2_review td.w_tit{}
.tab_st1 > li > a .ko{ font-size:.750em}
.dp1_mypage.dp2_point .tt_point{ font-size:.875em}


.main_top .wrap_sec .con1{ position:static; width:100%; margin-top:1em}
.main_top .wrap_sec .con1 .tab_idx,
.main_top .wrap_sec .con1 .con_idx{ overflow:hidden}
.main_top .wrap_sec .con1 .tab_idx > li{ float:right; width:49%}
.main_top .wrap_sec .con1 .tab_idx > li:first-child{ float:left}
.main_top .wrap_sec .con1 .con_idx .idx{ float:right; width:49%; visibility:visible !important; position:relative !important; opacity:1 !important}
.main_top .wrap_sec .con1 .con_idx .idx:first-child{ float:left}
.main_top .shop_list .tab > li > a{ line-height:2em}
.main_top .shop_list .tab > li > a::after{ display:none !important}
.main_top .shop_list .mainTopShop_wrap{ padding-bottom:144%}
.main_top .wrap_sec .con2{ margin:0; width:100%}
.main_top .wrap_sec .con3{ padding-right:0}
.main_top .wrap_sec .con3 .mainTopShopMD{ width:49%}
.main_top .wrap_sec .con3 .mainTopShopMD .img img{ width:100%}
.main_top .banner_link{ display:none}

.cateImg .el > a .va{ font-size:.75em}
.main_bottom_cate .cateImg .gnb > li{ width:33.33%}

.st1.list_prod_wrap .list_prod .prod > li{ width:33.33%}
.main_st.st2.list_prod_wrap .list_prod .prod > li:nth-child(1){ position:static; width:50%}
.main_st.st2.list_prod_wrap .list_prod .prod > li:nth-child(4), .main_st.st2.list_prod_wrap .list_prod .prod > li:nth-child(8){ margin-left:0}
.st2.list_prod_wrap .list_prod .prod > li{ width:25%}
.st2.list_prod_wrap .list_prod .prod > li .in{ margin-bottom:0}
.st2.list_prod_wrap .list_prod .prod > li .in .con_wrap .t3{ height:1.2em}

.main_plus{ position:relative; height:auto; padding-bottom:0}
.main_plus .con1{ position:absolute; left:1em; top:39.8%; width:34%}
.main_plus .con2{ float:none; width:100%}
.st4.list_prod_wrap{ min-height: inherit}
.main_st.st4.list_prod_wrap{ padding:1em}
.st4.list_prod_wrap .list_prod{ margin:-.5em 0 0 -.5em}
.st4.list_prod_wrap .list_prod .prod .in .img_wrap{ float:none !important; width:100%}
.st4.list_prod_wrap .list_prod .prod .in .con_wrap{ position:static; width:100%; text-align:left !important}
.st4.list_prod_wrap .list_prod .prod .in{ margin:.5em 0 0 .5em}
.st4.list_prod_wrap .list_prod .prod > li{ width:20%; height:0; padding-bottom:40%}
.st4.list_prod_wrap .list_prod .prod > li:nth-child(1){ position:static; float:none; width:100%; left:0}
.st4.list_prod_wrap .list_prod .prod > li:nth-child(1) .img_wrap{ float:left !important; width:50%}
.st4.list_prod_wrap .list_prod .prod > li:nth-child(1) .con_wrap{ float:right; width:47%}
.st4.list_prod_wrap .list_prod .prod > li:nth-child(2),
.st4.list_prod_wrap .list_prod .prod > li:nth-child(5){ margin-left:40%}
.st4.list_prod_wrap .list_prod .prod > li:nth-child(3), .st4.list_prod_wrap .list_prod .prod > li:nth-child(7){ margin-left:0}

.mainPartners .el{ width:50%}

#footer .cs_wrap .wrap2{ margin-left:5%; margin-right:0; width:95%; text-align:center}
#footer .menu_wrap{ position:relative}
#footer .menu_wrap .menu{ padding:.5em 0}
#footer .menu_wrap .va_wrap{ height:2em}
#footer .menu_wrap .gotop{ position:absolute; left:50%; top:-2em; height:2em; width:2.5em; margin-left:-1em; background:#222}
#footer .menu_wrap .gotop .tt{ display:none}
#footer .etc_wrap .logo > li{ width:50%}

/**/
.sub_lnb_wrap{ padding:0}
.sub_lnb_wrap .cateImg{ position:relative; width:auto; height:auto; margin:1em}
.sub_lnb_wrap .cate_list .dp2 > li{ width:50%}

.list_search_wrap{ padding:2em 1.5em 1.5em 1.5em}
.list_search_wrap .list_search > li{ width:100% !important; box-sizing:border-box}
.sub .st1.list_prod_wrap .list_prod .prod > li{ width:50%}
.sub .st2.list_prod_wrap .list_prod .prod > li{ width:33.33%}
.list_prod_wrap .list_prod_tit .t1{ font-size:1.25em}
.list_prod_wrap .list_prod_tit .st1.btn{ font-size:.75em}
.st3.list_prod_wrap .list_prod .prod .in .img_wrap,
.st3.list_prod_wrap .list_prod .prod .in .con_wrap{ float:none; width:auto}
.map_contents > li{ width:auto; float:none; margin-bottom:1em}
.shop.mall_view_top .mall_view_img,
.shop.mall_view_top .mall_view_info{ width:auto; float:none; margin-bottom:1em}
.mall_view_top .mall_view_img .big .zoomArea{ display:none}
.shop.mall_view_top .board_btn_wrap .input_st{ min-width:10em}

.enterInfoCon3 .img_wrap{ width:auto !important; margin:0 !important}
.enterInfoCon3 .con_wrap{ position:relative; width:100%}
.addCon1 > li .in .con_wrap .tt{ font-size:1em}

.location .sub_tbl .tbl_st{ font-size:.875em;}
.location .sub_tbl .tbl_st tbody th,
.location .sub_tbl .tbl_st tbody td{ padding:.5em .5em;}
.location .sub_tbl .tbl_st tbody th .xi{ display:block;}
.location .sub_tbl .tbl_st .w_form_tit{ width:5em;}
.root_daum_roughmap .wrap_map{ height:20em !important;}

.sub_com_box{ padding:1em;}
.sub_com_box .list > li{ flex:1 0 25%; max-width:25%;}

/**/
.board_photo > li{ width:50%;}
.w_name{ display:none;}
.w_hit{ display:none;}
.board_st.list .m_st{ display:none;}


.mall_view_top{ flex-direction: column;}
}

@media screen and (max-width:500px){
body{ font-size:13px}
.mainVisual_wrap, .mainVisual .slick-track, .mainVisual .item{ height:14.5em}
.main_banner .inner .link .con_wrap > dd{ max-width:100%;}

/**/
.my_search_wrap input[type=button].input_st, input[type=submit].input_st, button.input_st, a.input_st{}
.input_st.w3{ width:14.25em}
.main_customer .cs .etc_wrap .btn{ float:none}
.main_customer .cs .etc_wrap .sns{ float:none; width:100%; padding:1em 0 0}

.dp1_customer.dp2_review .w_img{ opacity:0; width:0}
.tab_st1 > li > a .en{ display:none}

.sub_com_box .list > li{ flex:1 0 33.33%; max-width:33.33%;}
.fl_wrap > .goods{ float:none;}

.main_con{ border-bottom: 1px solid #ddd; }
.main_banner{ padding: 2em 0 !important;}


.main_customer .cs .cs_wrap .tit .tt{ padding-left: .5em;}
}


@media screen and (max-width:320px){
.board_search_wrap button{ padding:0 .5em}
#header .top_wrap .logo{ width:8em;}
#header .top_wrap .menu{ margin-top:-.25em;}
#header .top_wrap .menu > li.go_hancom .in{ font-size:.875em;}
#header .all_btn{ top:.125em;}
.mainVisual_wrap, .mainVisual .slick-track, .mainVisual .item{ height:11.5em}
#footer .menu_wrap .menu > li > a{ font-size:.875em}
.mainVisual_wrap .slick-dots{ bottom:1em}
}

@media all and (orientation:landscape){

}