@charset "utf-8";

.moNav { display:none; }
@media all and (max-width: 1024px) {
    body { overflow-x:auto;min-width:320px; }
    .moNav { display:block;position:relative; }
    .moNav .logo { display:inline-block;width:23.334%; padding-left:27px; }
    .moNav .logo a { display:inline-block;padding-top:21px;padding-bottom:18px; }
    .moNav .btnMoBasket a,
    .moNav .btnMoSearch a { display:table;width:100%;height:100%; padding-top:2px; text-align:center; }
    .moNav .btnMoSearch a span,
    .moNav .btnMoBasket a span { display:table-cell;vertical-align:middle; }
    .moNav .btnMoSearch { position:absolute;top:0;right:12%;width:9.726%;height:100%; }
    .moNav .btnMoSearch a img { max-width:30px;width:48.572%; }
    .moNav .btnMoBasket { position:absolute;top:0;right:24%;width:9.726%;height:100%; }
    .moNav .btnMoBasket a img { max-width:36px;width:70%; }
    /*20200905 ��ٱ��� ������ ��Ÿ�� �߰� ���� */
	.moNav .btnMoBasket a span i { position:absolute; right:0; top:50%; margin-top:-20px; width:20px; line-height:20px; background:#ffe469; border-radius:50%; color:#333; font-size:12px; text-align:center;}
    /*20200905 ��ٱ��� ������ ��Ÿ�� �߰� �� */
	.moNav .btnMoGnb { position:absolute;top:0; right:2%; width:9.723%;height:100%; }
    .moNav .btnMoGnb button { display:block;width:100%;height:100%; }
    .moNav .btnMoGnb button img { max-width:32px;width:54.286%; }
    .moNav .gnb { background-color:#f6f6f5;-webkit-transform:translateX(-100%);-moz-transform:translateX(100%);-ms-transform:translateX(100%);-o-transform:translateX(100%);transform:translateX(100%); }
    .moNav .gnb .gnbWrap { display:none;text-align:left; }
    .moNav .gnb .moTit { padding:0 22px;border-bottom:1px solid #48b08f;background-color:#179b71;color:#fff;font-size:14px;line-height:49px;font-weight:400; }
    .moNav .userBox { position:relative;padding-top:20px;padding-bottom:30px;padding-left:30px;background-color:#179b71; }
    .moNav .userBox .img { overflow:hidden;position:absolute;top:20px;left:23px;width:64px;height:64px;border-radius:50%; }
    .moNav .userBox .info { margin-top:9px;color:#fff; }
    .moNav .userBox .info h3 { font-size:15px;font-weight:300; }
    .moNav .userBox .info h3 strong { font-weight:500; }
    .moNav .userBox .info ul { margin-top:9px;font-size:0; }
    .moNav .userBox .info ul li { display:inline-block;border:1px solid #56b395;border-left:none;vertical-align:top;font-size:12px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }
    .moNav .userBox .info ul li:first-child { border-left:1px solid #56b395; }
    .moNav .userBox .info ul li a { display:block;min-width:55px;padding:0 2px;color:#fff;font-weight:300;line-height:21px;text-align:center; }
    .moNav .userItems { background-color:#09865e; }
    .moNav .userItems ul { font-size:0; }
    .moNav .userItems ul li { display:inline-block;width:33.33333%;vertical-align:top;font-size:12px;text-align:center;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }
    .moNav .userItems ul li+li { border-left:1px solid #179b71; }
    .moNav .userItems ul li a { display:block;padding:16px 0;color:#fff; }
    .moNav .userBox .info h3 a { display:inline-block;height:31px;padding:7px 12px 0 28px;border:1px solid #56b395; background:url(../imgs/common/icon_lock.png) 11px 50% no-repeat; background-size: 11px auto;color: #fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }
    .moNav .gnb .gnbList { padding:22px 0;background-color:#fff; }
    .moNav .gnb .gnbList > li > a { display:block;position:relative;width:100%;padding:15px 0;padding-left:49px;background:url(../imgs/common/bu_4p.png) no-repeat 37px 50%;background-size:2px auto;color:#000;font-size:15px;text-align:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }
    .moNav .gnb .gnbList .gnbSub { display:none; }
    .moNav .gnb .gnbList .gnbSub>ul span { position:relative; display:inline-block; padding-left:40px; }
    .moNav .gnb .gnbList .gnbSub>ul img{ position:absolute; left:0; top:50%; margin-top:-14px; width:28px; }
    .moNav .gnb .gnbList .gnbSub>ul { border-top:1px solid #e8e8e8; }
    .moNav .gnb .gnbList .gnbSub>ul>li { border-bottom:1px solid #e8e8e8; }
    .moNav .gnb .gnbList .gnbSub>ul>li>a { display:block;padding:15px 0 15px 50px;color:#5f5f5f;font-size:14px; }
    .moNav .gnb .gnbList .gnbSub div ul { border-top:1px solid #e8e8e8;background-color:#f6f7f7; }
    .moNav .gnb .gnbList .gnbSub div a {display: block;padding:8px 0;padding-left:50px;color: #3e3e3e;font-size: 13px;}
    .moNav .social { overflow:hidden;padding-top:22px;padding-bottom:22px;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8; }
    .moNav .social h4 { float:left;margin-top:6px;padding-left:35px;color:#383838;font-size:15px;font-weight:400; }
    .moNav .social ul { float:right;padding-right:30px;font-size:0; }
    .moNav .social ul li { display:inline-block;margin:0 2px;vertical-align:top; }
    .moNav .social ul li a { display:block; }
    .moNav .social ul li a img { height:26px; }
    .moNav .costomer { padding:25px 0 25px 35px; }
    .moNav .costomer h4 { color:#383838;font-size:15px;font-weight:400; }
    .moNav .costomer p { margin-top:10px;margin-bottom:9px;color:#2d2d2d;font-weight:500;font-size:14px; }
    .moNav .costomer p a { display:inline-block;color:#2d2d2d; }
    .moNav .costomer dl { overflow:hidden;margin:4px 0;color:#737373;font-size:12px; }
    .moNav .costomer dl dt { display:inline-block;float:left; }
    .moNav .costomer dl dd { display:block;margin-left:2.4em; }
    .moNav .gnb .gnbClose { overflow:hidden;position:absolute;top:0;right:0; }
    .moNav .gnb .gnbClose button { overflow:hidden;display:inline-block;width:50px;height:50px;background:url(../imgs/common/icon_close.png) 50% 50% no-repeat;background-size:15px auto;color:#fff;text-indent:-999px; }

    .gnbOpen .moNav .gnb { z-index:100;overflow-y:auto;position:fixed;top:0;right:0; width:100%; max-width:320px;height:100%; opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-transition:0.4s;-o-transition:0.4s;-moz-transition:0.4s;transition:0.4s; }
    .gnbOpen .moNav .gnb .gnbWrap { display:block; }

    .moNav .gnbList .iconPlus { overflow:hidden;display:block; position:absolute; top:16px; right:18px; width:13px; height:13px;text-indent:-999px; }
    .moNav .iconPlus:before,
    .moNav .iconPlus:after { content:""; position:absolute; background-color:#aeaeae;
        -webkit-transition:-webkit-transform 300ms cubic-bezier(0.4, 0, 0.4, 1);
        transition:-webkit-transform 300ms cubic-bezier(0.4, 0, 0.4, 1);
        -o-transition:-o-transform 300ms cubic-bezier(0.4, 0, 0.4, 1);
        -moz-transition:transform 300ms cubic-bezier(0.4, 0, 0.4, 1), -moz-transform 300ms cubic-bezier(0.4, 0, 0.4, 1);
        transition:transform 300ms cubic-bezier(0.4, 0, 0.4, 1);
        transition:transform 300ms cubic-bezier(0.4, 0, 0.4, 1), -webkit-transform 300ms cubic-bezier(0.4, 0, 0.4, 1), -moz-transform 300ms cubic-bezier(0.4, 0, 0.4, 1), -o-transform 300ms cubic-bezier(0.4, 0, 0.4, 1);}
    .moNav .iconPlus:before {top:0; left:50%; width:1px; height:100%; margin-left:-1px;}
    .moNav .iconPlus:after {top:50%; left:0; width:100%; height:1px; margin-top:-1px;}
    .moNav .iconPlus.active:before {-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg);}
    .moNav .iconPlus.active:after {-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);}

    .gnbOpen .overlayBg { height:100%;opacity:1; -webkit-transition:opacity 0.4s; -o-transition:opacity 0.4s; -moz-transition:opacity 0.4s; transition:opacity 0.4s;z-index:2; }
}
/*@media all and (max-width:767px) {
    .moNav .btnMoBasket,
    .moNav .btnMoSearch { width:9.726%; }
    .moNav .btnMoBasket { right:11.726%; }
}*/
