@charset "utf-8";
/* @latest 2020.02.03 yhy */

#top {position:relative; float:left; width:100%;}
.head-group {float:left; width:100%; box-sizing:border-box; clear:both;
             position:relative; background:#fff; z-index:1;
             -webkit-transition:top 500ms, background 500ms;
             transition:top 500ms, background 500ms; z-index:999 !important;}
.header {width:100%; /*height:28px;*/ background:#f3f3f3;
        box-sizing:border-box; opacity:1;
        border-bottom:1px solid #ebebeb;
        -webkit-transition:top 500ms, opacity 1s;
        transition:top 500ms, opacity 1s;}
.header .inner {width:100%; max-width:1300px; margin:0 auto; /* padding:0 75px; */ box-sizing:border-box;
                /*line-height:70px;*/ /* text-align:right; */ vertical-align:middle; /*height:0;*/ position:relative;}


ul.gnb1 {display:none;}
.gnb.data:after{content:''; display:block; clear:both;}
ul.gnb {width:100%; height: 28px;line-height: 28px; text-align: right; box-sizing:border-box; opacity: 1; border-bottom: 1px solid #ebebeb; background:#f3f3f3;}
ul.gnb li{display:inline-block; font-size:14px;font-weight:600;}





ul.gnb li a {color:#333; position:relative; opacity:0.8;}
ul.gnb li + li{position:relative; padding-left:10px; margin-left:10px;}
ul.gnb li + li:after{content:''; display:block; position: absolute; top:8px; left:0; width:1px; height:12px; background:#ccc;}
ul.gnb li:last-child a:after {display:none;}
ul.gnb li a:hover {color:#d97400;}
ul.gnb li a:focus {outline:thin dotted;}
ul.gnb li.link-group {padding:0; border:none;}
ul.gnb li.link-group select {height:25px !important;  margin-top:-2px; padding:0 20px 0 5px; box-sizing:border-box;
                            font-size:13px; color:black; line-height:28px; border:1px solid rgba(0,0,0,0.3); border:none;
                            background:url(/images/wzwg/cmm/arrow_black.png) no-repeat right 5px center; background-size:6px;
                            appearance:none; -webkit-appearance:none; margin-left:10px;}
ul.gnb li.link-group select::-ms-expand {opacity:0;}
ul.gnb li.link-group select option {color:#333;}


/* srch setting */
.header .srchbox {background:#fff; border-bottom:1px solid #fbd9b2; height:30px; box-sizing:border-box; width:240px; line-height:30px; margin-left:10px;}
.header .srchbox input[type="text"] {background:transparent; border:none; float:left; padding-left:10px !important; font-size:12px;}
.header .srchbox .head_srchbtn {text-indent:-9999px; width:28px; height:28px; box-sizing:border-box; margin:0 2px 2px 0;
                                background:url(/images/wzwg/cmm/icon_set.png); background-repeat:no-repeat; background-position:-178px 4px;}
.header .srchbox .head_srchbtn:focus {outline:thin dotted;}


.menu {position: relative; width:100%; z-index:1;
        -webkit-transition:height 500ms, background 500ms, transform 500ms margin-top 500ms;
        transition:height 500ms, background 500ms, transform 500ms margin-top 500ms;}
.menu .inner {width:100%; /*max-width:1300px;*/ margin:0 auto;box-sizing:border-box;
              -webkit-transition:height 500ms, line-height 500ms;transition:height 500ms, line-height 500ms;}
.menu .inner:after{content:''; display: block; clear: both;}
.menu .logo{width: 100%;
    max-width: 1300px;
    height: 130px;
    margin: 0 auto;
    padding: 15px 10px;
    line-height: 80px;
    text-align: left;
    box-sizing: border-box;
    vertical-align: middle;
    background: #fff;}

.menu .logo a img {width: auto; max-height: 90%; max-width: 35%; display: inline-block; vertical-align: middle; -webkit-transition: max-height 500ms, -webkit-transform 500ms; transition: max-height 500ms, transform 500ms;}



.lnb:before {content: ""; position: absolute;
left: 0; width: 100%; height: 1px; border-bottom: 1px solid rgba(51,51,51,0.2); margin-top: -2px;}


.lnb {width: 100%; max-width: 1300px; margin: 0 auto; box-sizing: border-box;}
.lnb > li{float: left; /*display:inline-block;*/ vertical-align:middle;box-sizing:border-box; padding: 0 4px;overflow: hidden; background:#fff;}
.lnb > li.selected {border:none !important;}
.lnb > li:last-child:after {content:""; display:none;}
.lnb > li > a {/* height: 70px; */
                width: 100%;
                line-height: 22px;
                display: inline-block;
                box-sizing: border-box;
                /* max-height: 63px; */
                vertical-align: middle;
                text-align:center;
                box-shadow: 0 0 1px rgba(0, 0, 0, 0);
                font-size: 20px;
                color: #555;
                font-weight: 600;
                padding: 24px 0px 24px;
                background: #fff;
                overflow: hidden;
                position: relative;
                -webkit-transform: perspective(1px) translateZ(0);
                transform: perspective(1px) translateZ(0);
                }
.lnb > li > a:before {content: ""; position: absolute; z-index: -1; left: 51%; right: 51%; bottom: 0; background: #f18201; height: 2px;
                    -webkit-transition-property: left, right;
                    transition-property: left, right;
                    -webkit-transition-duration: 0.3s;
                    transition-duration: 0.3s;
                    -webkit-transition-timing-function: ease-out;
                    transition-timing-function: ease-out;}

.lnb > li.selected>a:before,
.lnb > li > a:focus:before,
.lnb > li:hover > a:before {left:0; right:0;}


.lnb > li.selected > a {color:#7099c5;position:relative; font-weight:600;}
.lnb > li.selected > a:hover {line-height:25px;}

.lnb > li > ul {
                display:none;
                height: auto;
                overflow: hidden;
                top:0px !important;
                width:1300px !important;
                padding: 0 0 0 324px;
                left:0;
                right:0;
                /* background: #fff; */
                margin:0 auto;
                border-top:1px solid #e0e0e0;
                box-sizing:border-box;
                position:absolute;
                color:#333;
                z-index: -1;
                text-align:left;
                -webkit-transition:top 0.3s;
                -moz-transition:top 0.3s;
                -ms-transition:top 0.3s;
                -o-transition:top 0.3s;
                transition:top 0.3s;
                }
.lnb > li > ul.on {display:block; top:200px !important; width:auto;
                    -webkit-transition:top 0.3s;
                    -moz-transition:top 0.3s;
                    -ms-transition:top 0.3s;
                    -o-transition:top 0.3s;
                    transition:top 0.3s;}
.lnb > li:hover > ul,
.lnb > li > a:focus {outline:none;}
.lnb > li > a + ul > li {text-align:left;margin-left: 1px;display: block;display: table;float: left;width: 100%;box-sizing: border-box;background: #fff;
                        border-bottom: 1px solid rgba(214, 207, 198, 0.9); border-right:1px solid transparent; -webkit-transition:border-right 0.5s;transition:border-right 0.5s;}
.lnb > li > a + ul > li:only-of-type>a,
.lnb > li > a + ul > li:nth-of-type(2):last-of-type>a,
.lnb > li > a + ul > li:nth-of-type(3):last-of-type>a {padding-bottom:50px;}
.lnb > li > a + ul.on > li {border-right: 1px solid #ececec;}
.lnb > li > a + ul > li:last-child {border-bottom:none;}
.lnb > li > a + ul > li.selected:after {transform:rotate(-180deg); border-top:6px solid #0a58a3;}
.lnb > li > a + ul > li.selected {border:none !important;}
.lnb > li > a + ul > li.selected > a {font-weight:600; border-bottom:2px solid #0a58a3; box-sizing:border-box;}
.lnb > li > a + ul > li > a {display: table-cell;vertical-align: top;/* display:block; */width: 30%;height: 100%;box-sizing: border-box;padding: 10px 15px;color: #fff;background: #f8f8f8;background: #f18201;/* border-bottom: 1px solid rgba(51,51,51,0.08); *//* float:left; */font-size: 17px;line-height: 150%;
                            -webkit-transition:background 0.5s;transition:background 0.5s;/* border-bottom: 1px solid rgba(255,255,255,0.3); */}
.lnb > li > a + ul > li > a:hover{font-weight:600;}
.lnb > li > a + ul > li > a:focus{box-sizing:border-box; font-weight:600;}
.lnb > li > a + ul > li > a:only-child {float:left;}
.lnb > li > a + ul > li > a + ul {line-height: 150%;box-sizing:border-box;/* float: left; */width: 70%;padding: 7px 5px;display: table-cell;vertical-align: bottom;/* border-bottom: 1px solid #ececec; */}
.lnb > li > a + ul > li > a + ul > li {float:left;display: inline-block;}
.lnb > li > a + ul > li > a + ul > li a {color: #555;font-size: 15.5px;font-weight:600; line-height: 150%;padding: 2px 12px;position: relative;display:block;-webkit-transition:color 0.5s;transition:color 0.5s;}
.lnb > li > a + ul > li > a + ul > li a:after {content:"";width:1px;height: 12px;background: #ccc;display: inline-block;position: absolute;right: 0;top: 8px;}
.lnb > li > a + ul > li > a + ul > li:last-child a:after {content:""; display:none;}
.lnb > li > a + ul > li > a + ul > li a:hover {font-weight:600; color:#f18201;}
.lnb > li > a + ul > li > a + ul > li a:focus {font-weight:600; color:#f18201;}


#lnbBg {/* display:block !important; */ /* opacity:0; */
        -webkit-transition:top 0.3s;
        -moz-transition:top 0.3s;
        -ms-transition:top 0.3s;
        -o-transition:top 0.3s;
        transition:top 0.3s;
        -webkit-transition:height 0.3s;
        -moz-transition:height 0.3s;
        -ms-transition:height 0.3s;
        -o-transition:height 0.3s;
        transition:height 0.3s;}

#lnbBg.on { display:block !important; overflow:hidden;
            top: 200px !important; z-index:-2 !important;
            border-top:1px solid rgba(51,51,51,0.1);border-bottom:1px solid rgba(51,51,51,0.2);
            -webkit-transition:top 0.3s;
            -moz-transition:top 0.3s;
            -ms-transition:top 0.3s;
            -o-transition:top 0.3s;
            transition:top 0.3s;
            -webkit-transition:height 0.3s;
            -moz-transition:height 0.3s;
            -ms-transition:height 0.3s;
            -o-transition:height 0.3s;
            transition:height 0.3s;}

#lnbBg.on:before {content: ""; position: absolute; left:-15px; bottom:-15px; width: 180px; height: 180px; opacity: 0.1;
                    background: url(/module/upload/file/selectImageView.ink?atchFileId=30000003767&fileSn=0);
                    background-repeat: no-repeat;
                    background-size: 1000px;
                    background-position: -823px 1px;}

/* srchbtn */
.lnb_search {position: absolute; top: 72px; right: 67px; z-index: 999;}
.lnb_search:after{content:''; display: block; position: absolute; top:3px; right: 36px; width:1px; height: 21px; background: #ccc;}
.lnb_search .btn_search {float:left; width:30px;height:30px; font-size:0; line-height:0; }
.lnb_search .btn_search:before {display: inline-block; content: "\f002"; font-family: 'FontAwesome'; font-size: 19px; color:#e46e16;}


#searchPannel .search_box {width:100%; height:100%;}
#searchPannel .search_box .search_box_inner {width:100%; height:100%;}
#searchPannel .search_box .search_box_inner input[type="text"]:focus {outline:auto; outline-color:#ddd; background:#f1f1f1; color:#333;}



@media (min-width:991px){
  #searchPannel {display: block !important; position:absolute; width: 26%; left:auto; top:67px; right: 60px; height:32px; background: transparent; border: 2px solid #cecece; z-index: 999;}
  #searchPannel .search_box .search_box_inner input[type="text"] {width: 87%; height:26px; margin:3px 0 3px 3px; padding: 0 10px; font-size: 15px; background: transparent; border: none;}

}


/* pad */
    @media (min-width:991px) and (max-width:1300px){
      #searchPannel .search_box .search_box_inner input[type="text"] {width: 82%;}
      #searchPannel{width: 25%;}

      .lnb_search {margin-right:0;}
      .lnb > li{padding:0;}
      .lnb > li > a{font-size: 18px;}

      .menu .logo{margin-left:15px;}
    }

/* mobile */
    @media (max-width:990px){
      #searchPannel {position:absolute; top:0; right: 50px; width: calc(100% - 100px); height:50px; line-height:50px; z-index: 999;}
      #searchPannel .search_box .search_box_inner input[type="text"] {width:95%;}

      .lnb_search:after{display:none;}
      .lnb_search{top:13px; right:10px;}
      #lnbBg.on{border-top:none; border-bottom:none;}
      #lnbBg {display:none !important;}
    }


/* allmenu (sitemap-popup btn) */
.all_menu {position: absolute; right: 0; width:30px; height:30px; margin-top: 42px; margin-right:15px; z-index: 999;}
.all_menu .btn_allmenu {background:url("/sample/templatehead/basic/img/menuBar_white.png") #f18201 no-repeat center; width:30px; height:30px; text-indent:-9999px;}
.all_menu .wzpopup-wrap {display:none;}
.all_menu .wzpopup .pop-container {text-align:left;}
.all_menu #fade {display:none;}

    @media (min-width:991px){
      .menu .inner {position:relative;}
      .fixedhead .menu .inner .all_menu {height:50px; line-height:normal;}
      .fixedhead .header{height: 0;}
    }
    @media (max-width:990px){
      .all_menu {display:none;}
      .lnb:hover ~ #lnbBg {display:none !important;}
    }

.menu ul#m_nav {display:none;}


/* mobile popup menu design */
.showMenu {width:50px; height:50px; cursor:pointer; background:url("/sample/templatehead/basic/img/menuBar.png")no-repeat center; position:absolute; top:0; left:0;}

#m_nav {float:left; width:95%; max-width:400px; height:calc(100vh - 100px); overflow-y:scroll; background:#fff; padding:0 0 20px;
        position:absolute; top:49px; left:0; text-align:left; box-shadow:1px 2px 5px 0px rgba(0,0,0,0.1); box-sizing:border-box;}
    #m_nav > li {width:100%; float:left; box-sizing:border-box; position:relative; border-bottom:1px solid #f3f3f3;}
    #m_nav > li > a {width:100%; font-size:14px;  float:left; padding:13px 30px 13px 20px; line-height:20px; font-weight:600; display:block;  box-sizing:border-box;}
    #m_nav > li.mnGroup {position:relative;}
    #m_nav li.mnGroup.selected {border-bottom:none;}
    #m_nav > li.mnGroup > a:after {content:"\276D"; display:inline-block; transform:rotate(90deg); position:absolute; right:15px; top:13px;}
    #m_nav li.mnGroup.selected > a:after {transform:rotate(-90deg) !important; margin-right:-2px;}
    #m_nav li a {color:#333; word-break:keep-all;}
    #m_nav li > a:hover  {color:#2d59b0;}
    #m_nav li > ul {float:left; background:#f7f7f7; width:100%;}
    #m_nav li > ul > li {float:left; width:100%; border-bottom:1px solid #eee;}
    #m_nav li > ul > li.mnGroup > a:after {content:"\276D"; display:inline-block; transform:rotate(90deg); position:absolute; right:15px; top:10px;}
    #m_nav li > ul > li > a {float:left; width:100%; font-size:13px; padding:11px 20px 11px 25px; height:auto; line-height:18px; position:relative; box-sizing:border-box;}
    #m_nav li ul li ul {background:#ececec; width:100%;}
    #m_nav li ul li ul li {border-bottom:1px solid #e3e2e2;}
    #m_nav li ul li ul li:last-child {border-bottom:none;}
    #m_nav li ul li ul li a {padding-left:35px;}

    /* popup login menu */
    #m_nav > li.mobile_gnb, #m_nav > li:last-child {background:#2b2b2b;}
    #m_nav > li.mobile_gnb ul li, #m_nav > li:last-child ul li {width:33.33%; box-sizing:border-box; float:left; text-align:center; border:1px solid rgba(255,255,255,0.2); border-width:1px 1px 1px 0; margin-top:-1px; line-height:70px;}
    #m_nav > li.mobile_gnb ul li:nth-child(3n), #m_nav > li:last-child ul li:nth-child(3n) {border-right:none;}
    #m_nav > li.mobile_gnb ul li:nth-child(3n+1), #m_nav > li:last-child ul li:nth-child(3n+1) {clear:both;}
    #m_nav > li.mobile_gnb ul li a, #m_nav > li:last-child ul li a {color:#fff; width:100%; line-height:20px; vertical-align:middle; display:inline-block;}

    #m_nav > li:last-child ul li.link-group {}
    #m_nav > li:last-child ul li.link-group a:after {display:none;}
    #m_nav > li:last-child ul li.link-group select {width:92%; background:url(/images/wzwg/cmm/arrow_white.png) no-repeat right 5px center; color:#fff; outline:none; border-radius:2px; line-height:30px; height:30px; border-color:rgba(255,255,255,0.3);}
    #m_nav > li:last-child ul li.link-group select option {background:white; color:black;}


    @media (max-width:990px){
      .header ul.gnb {display:none;}
      .header .inner .btn_wrap {margin-top:0;}

      ul.lnb{display:none;}
      .menu {height:50px; padding-top:0;}
      .menu .inner {padding:0;display:block;height:50px; overflow:hidden;}

      .menu .logo {width:100%;height:50px;line-height:50px;text-align:center; padding:0 15px;display:block; background:#fff;}
      .menu .logo a img {max-height:35px;}
      .showMenu, .menu:hover .showMenu {height:51px;overflow:hidden;}
    }


/* PC ver_ left menu */
    @media all and (min-width:991px) and (max-width:1400px){
        .header .inner {padding:0 15px;}
    }
     @media all and (min-width:991px) and (max-width:1300px){
        /* .menu {border-bottom:1px solid rgba(0,0,0,0.1);} */
        .lnb > li > ul {width:99.8% !important; max-width:1300px; left:50%; transform:translateX(-50%); padding:0 0 0 20%;}
    }

    @media (min-width:1051px){
      .menu ul#m_nav, .showMenu {display:none !important;}
    }

    @media (min-width:991px) and (max-width:1050px){
        .menu ul#m_nav, .showMenu {display:none !important;}
        ul.gnb {padding-left:10px;}
    }


/* fixed setting */
.fixedhead {position:fixed;top:0;background:#fff; box-shadow:0px 0px 5px 2px rgba(0,0,0,0.1);z-index:10;}

    @media all and (min-width:991px){
      .fixedhead .lnb > li > a {padding:0 0 24px}
      .fixedhead:hover {box-shadow:0px 0px 3px 0px rgba(0,0,0,0.3); background:#fff;
                      -webkit-transition:box-shadow 500ms, background 500ms, -webkit-transform 500ms;
                      transition:box-shadow 500ms,background 500ms, transform 500ms;}
      .fixedhead .header .inner {max-width:100%;}
      .fixedhead .header ul.gnb {display:none;}
      .fixedhead .header .inner .btn_wrap {/* margin-top:0; */display: none;}

      .fixedhead .menu {margin-top:0; height:50px;
                      -webkit-transition:height 500ms, background 500ms, transform 500ms, margin-top 500ms;
                      transition:height 500ms, background 500ms, transform 500ms, margin-top 500ms;}
      .fixedhead .menu:hover {background:rgba(255,255,255,1);
                              -webkit-transition:background 500ms, -webkit-transform 500ms;
                              transition:background 2s, transform 500ms;}
      .fixedhead .menu .inner {height:50px;line-height:50px;}
      .fixedhead .menu .logo {display:inline-block;height:50px;line-height:50px;padding:0 10px;width:auto;max-width:100%;position:absolute; display:none;}
      .fixedhead .menu .logo a img {max-height:35px;  max-width:100%; transform-origin:top;
                                   -webkit-transition:max-height 500ms, -webkit-transform 500ms;
                                   transition:max-height 500ms, transform 500ms;}
      .fixedhead .lnb {height:50px;}
      .fixedhead .lnb:before {display:none;}
      .fixedhead .lnb > li {border:none;height:50px;line-height:50px;padding-top:0;}
      .fixedhead .lnb > li > a {height: 50px;line-height: 50px;}
      .fixedhead .lnb > li > ul {top:51px !important; border-top:none;}

      .fixedhead #lnbBg.on {top:50px !important;}
    }
    @media (min-width:991px) and (max-width:1299px){
      .fixedhead .menu .logo {display:none;}
      .fixedhead .header {right:0;}
      .fixedhead .header .inner {padding:0;}
      .fixedhead .header .inner .btn_wrap .lnb_search {width:50px;height:50px;margin-right:-0;border-left:1px solid #ddd;box-sizing:border-box;float:left;}
      .fixedhead .header .inner .btn_wrap .lnb_search .btn_search:before {margin:10px;}
      .fixedhead .header .inner .btn_wrap .all_menu {width:50px; height:50px; float:left;}
      .fixedhead .header .inner .btn_wrap .all_menu .btn_allmenu {width:50px; height:50px;}
      .fixedhead #searchPannel {right:100px;}
    }


/* lofa : speacial menu text */
.lnb > li > ul span.oneDepth_menuNm {position:absolute;left: 0;font-size: 38px;line-height: 105%;width:300px;margin-top: 20px;padding-left: 15px;font-weight: 600;display: block !important;}

    @media (min-width:991px) and (max-width:1299px){
        .lnb > li > ul span.oneDepth_menuNm {font-size:32px; width:18%; word-break:break-all;}
    }