/*Content CSS*/
.category-wrap {width:100%; height:60px; clear:both; background-attachment:scroll; position:relative; z-index:30; background-color:rgba(0,0,0,0.6); margin:-60px auto 0; }
.sub_navI_warp { background:transparent; width: 100%; max-width:1300px; z-index:3; position:relative; margin:0 auto; }
.all-wrap{max-width:1300px; height:60px; margin:0 auto;   transition:all .3s ease;}
.all-wrap .loca-wrap{width:100%;margin:0 auto;height:60px}
.all-wrap .loca-wrap .loca-area i { position:relative; float:left; display:inline-block; height:60px; line-height:60px; color:#fff; padding:0; margin-top:0; text-align:center; font-style: normal; font-size: 20px; font-weight: normal; }
.all-wrap .loca-wrap .loca-area i a { display: inline-block; height: 100%; color:#fff; }
.all-wrap .loca-wrap .loca-area .arrow_r { display: inline-block; font-size: 17px; margin:0 0 0 20px; }

.all-wrap .loca-wrap .loca-area {height:60px;float:left;}
.all-wrap .loca-wrap .loca-area > a {display:inline-block;width:54px;height:100%; float:left; line-height:100%; text-align:center;}
.all-wrap .loca-wrap .loca-area > a img {margin-top:17px;}
.all-wrap .loca-wrap .loca-area>ul {float: left;margin:0; padding:0}
.all-wrap .loca-wrap .loca-area>ul>li{float:left;width:240px;height:60px;position:relative;}
.all-wrap .loca-wrap .loca-area>ul>li button{height:60px;width:100%;position:relative;text-align:left;padding-left:1px; padding-left: 18px; background-color: transparent; line-height: 60px; }
.all-wrap .loca-wrap .loca-area>ul>li button:focus {outline: none; border: none;}
/* .all-wrap .loca-wrap .loca-area>ul>li button.active{background-image:url('../img/loca_arrow_on.png');background-position-y:50%;background-position-x:100%;background-repeat:no-repeat;} */
.all-wrap .loca-wrap .loca-area>ul>li button span { background-color: transparent; color:#fff; font-size:20px; }
.all-wrap .loca-wrap .loca-area>ul>li button .arrow_r { position:absolute; right:0; top:21px; margin:0; }
.all-wrap .loca-wrap .loca-area>ul>li button .arrow2 { position:absolute; right:30px; top:20px; width:20px; height: 20px; border-radius: 50%; border:1px solid rgba(255,255,255,0.8); text-align: center; line-height: 18px; font-size: 10px; color:rgba(255,255,255,0.6); transition:all .2s; }
.all-wrap .loca-wrap .loca-area>ul>li button.active .arrow2 { transform: rotate(90deg); }
.all-wrap .loca-wrap .loca-area>ul>li:last-child .arrow2 { right:0; }

.all-wrap .loca-wrap .loca-area>ul>li div{overflow:hidden;height:0;position:relative; margin-top:1px;}
.all-wrap .loca-wrap .loca-area>ul>li div ul{display:block;position:absolute;width:100%;left:0;border:1px solid #ddd; padding:0}
.all-wrap .loca-wrap .loca-area>ul>li div ul li a{ border-bottom:1px solid #ddd; background:#fff;height:48px;color:#000;line-height:48px;display:block;-webkit-transition:background .3s ease;-moz-transition:background .3s ease;-o-transition:background .3s ease;-ms-transition:background .3s ease; font-size:16px; box-sizing:border-box; padding-left: 18px; }
.all-wrap .loca-wrap .loca-area>ul>li div ul li a:hover {background: #f7f7f7; text-decoration:none;}
.all-wrap .loca-wrap .loca-area>ul>li div ul li:last-child {border-bottom: 1px solid #ddd;}
.all-wrap .loca-wrap .share-area {float: right; display:block; padding-top:16px;box-sizing: border-box;}
.all-wrap .loca-wrap .share-area .hide-wrap{width:181px;height:34px;overflow:hidden;float:left}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area{width:181px;height:34px;position:relative;left:180px}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul {overflow: hidden; padding:0; margin:0; float:right;}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul li {float: left;margin-left: 30px; cursor:pointer; line-height: 38px;}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul li:first-child {margin-left: 0;}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul li:last-child {margin-right: 30px;}
.all-wrap .loca-wrap .share-area .share-btn{width:52px;height:34px;background-image:url('../img/share_open_bt.png');float:right;text-indent:-9999px;box-sizing:unset;background-repeat:no-repeat;background-position-x:right;transition:all .5s ease; background-color: inherit; border:0; margin-right:20px;background-color: transparent;}
.all-wrap .loca-wrap .share-area .share-btn.active {background-image: url('../img/share_close_bt.png');border-left: 1px solid rgba(255,255,255,0.2);}
.share-btn:focus {outline: none; border: none;}

.hide-area ul li a i {font-size: 20px; color:rgba(255,255,255,0.5); transition: all 0.2s;}
.hide-area ul li a:hover i {font-size: 20px; color:rgba(255,255,255,1);}


/* 서브비주얼 넘버
.sub1 - 회사소개
.sub2 - 사업영역
.sub3 - 소식
*/
.sub_visual.sub1 + .category-wrap { background-color: rgba(255,255,255,0.6); }
.sub_visual.sub1 + .category-wrap .all-wrap .loca-wrap .loca-area i { color: #000 !important; }
.sub_visual.sub1 + .category-wrap .all-wrap .loca-wrap .loca-area i a { color:#000; }
.sub_visual.sub1 + .category-wrap .all-wrap .loca-wrap .loca-area>ul>li button span { color: #000;  }
.sub_visual.sub1 + .category-wrap .all-wrap .loca-wrap .loca-area>ul>li button .arrow2 { border: 1px solid rgba(0,0,0,0.8); }




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

    .sub_navI_warp { max-width: 100%; padding:0 60px; }

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

    .all-wrap { height: 55px; }
    .all-wrap .loca-wrap { height: 55px; }
    .sub_navI_warp { padding:0 40px; }
    .category-wrap { height: 55px; margin: -55px auto 0; }
    .all-wrap .loca-wrap .loca-area { height: 55px; }
    .all-wrap .loca-wrap .loca-area i { height: 55px; line-height: 55px; font-size: 19px; }
    .all-wrap .loca-wrap .loca-area>ul>li { height: 55px; }
    .all-wrap .loca-wrap .loca-area>ul>li button { height: 55px; line-height:55px; }
    .all-wrap .loca-wrap .loca-area>ul>li button span { font-size: 19px; }
    .all-wrap .loca-wrap .loca-area>ul>li button .arrow_r { top: 19px; }
    .all-wrap .loca-wrap .loca-area>ul>li button .arrow2 { top: 19px; }


}

@media screen and (max-width:767px) {
    .all-wrap { height: 50px; }
    .sub_navI_warp { padding: 0 15px; }
    .category-wrap { height: 50px; margin: -50px auto 0; }
    .all-wrap .loca-wrap { height: 50px; }
    .all-wrap .loca-wrap .loca-area { height: 50px; width: 100%; }
    .all-wrap .loca-wrap .loca-area i.home { display: none; }
    .all-wrap .loca-wrap .loca-area>ul { width: 100%; }
    .all-wrap .loca-wrap .loca-area>ul>li { width: 50%; height: 50px; }
    .all-wrap .loca-wrap .loca-area>ul>li button { height: 50px; line-height: 50px; padding-left: 10px;  }
    .all-wrap .loca-wrap .loca-area>ul>li button:focus { outline:none !important; }
    .all-wrap .loca-wrap .loca-area>ul>li button.active .arrow2 { transform: none; }
    .all-wrap .loca-wrap .loca-area>ul>li button span { font-size: 17px; }

    .all-wrap .loca-wrap .loca-area>ul>li div ul li a { height: 45px; line-height: 45px; font-size: 15px; padding-left: 10px; }

    .all-wrap .loca-wrap .loca-area>ul>li button .arrow_r { top: 16px; }
    .all-wrap .loca-wrap .loca-area>ul>li button .arrow2 { right: 25px; top: 15px; }


}