@charset "UTF-8";

/* header */
.header{position:fixed; top:0; left:0; width:100%; height:100px; padding:0 40px; color:#fff; z-index:1000; transition:transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;}
.header h1 a{display:block; width:170px; height:42px; margin-top:20px; font-size:0; background:url(../img/logo.png) no-repeat top left / cover;}
.header.searchPage{background-color:rgba(32, 32, 32, 0.2);}

.menuGroup{display:flex; align-items: center; position:absolute; top:45px; right:40px; margin-left:auto;}
.menuGroup .lang{position:relative;}
.menuGroup .lang a,
.menuGroup .lang button{display:block; position:relative; font-size:16px; font-weight:500; color:#fff; line-height:1; font-family:'volte' !important;}
.menuGroup .lang button:after{content:""; display:inline-block; position:relative; width:13px; height:9px; margin-left:10px; background:url(../img/ico_lang.png) no-repeat top left / cover;}
.menuGroup .lang ul{display:none; position:absolute; top:100%; left:0; width:100%; padding-top:14px;}
.menuGroup .lang ul li+li{margin-top:0;}
.menuGroup .lang ul li a{padding:7px 0;}
.menuGroup .lang ul li a:hover{color:#08a9ff !important;}
.menuGroup .lang.opened button:after{transform:rotate(180deg);}
.menuGroup .lang.opened ul{display:block;}
.menuGroup .btn_open_search{display: block; width:22px; height:19px; margin-left:25px; background:url(../img/ico_search.png) no-repeat top left / cover; font-size:0;}
.menuGroup .link_toMain,
.menuGroup .btn_open_gnb{display: block; width:22px; height:19px; margin-left:25px; background:url(../img/ico_menu.png) no-repeat top left / cover; font-size:0;}
.menuGroup .btn_open_gnb{display:none;}

.gnb{position:fixed; top:0; left:265px; line-height:1; z-index:1100;}
.gnb>ul{display:flex; position:relative;}
.gnb>ul>li+li{margin-left:30px;}
.gnb>ul .depth01{display:block; padding-top:15px; line-height:86px; font-size:20px; font-weight:500; color:#fff;}
.gnb>ul .depth02{display:none; position:absolute; top:65px; left:0; width:800px; padding-bottom:30px; overflow:hidden;}
.gnb>ul .depth02>li{float:left; margin-top:30px;}
.gnb>ul .depth02>li:first-child{margin-left:0;}
.gnb>ul .depth02 a{display:block; font-size:18px; font-weight:500; color:#fff;}
.gnb>ul .depth03 li{margin-top:20px;}
.gnb>ul .depth03 a{font-size:15px; font-weight:400;}
.gnb:hover>ul .depth01{opacity:0.5;}
.gnb>ul>li:hover .depth01{opacity:1;}

.menu_service .depth02>li{margin-left:50px;}
.menu_service .depth02 a{width:190px;}
.menu_service .depth02>li:nth-of-type(2) a,
.menu_service .depth02>li:nth-of-type(4) a,
.menu_service .depth02>li:nth-of-type(6) a{width:190px;}

.menu_tech .depth02>li{margin-left:70px;}
.menu_tech .depth02 a{width:auto;}
.menu_tech ul li:nth-of-type(4){margin-left:0; clear:left;}
.menu_tech ul li:nth-of-type(4) a{width:265px;}

.menu_news .depth02>li{margin-left:70px;}
.menu_firm .depth02>li{margin-left:70px;}

.gnb_m{display:none;}

.header:hover{background:rgba(255, 255, 255, 0.8); box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.04);}
.header:hover h1 a{background-position:bottom left;}
.header:hover .menuGroup .lang a,
.header:hover .menuGroup .lang button{color:#202020;}
.header:hover .menuGroup .lang button:after{background-position:bottom left;}
.header:hover .menuGroup .btn_open_search{background-position:bottom left;}
.header:hover .menuGroup .link_toMain{background-position:bottom left;}
.header:hover .gnb>ul .depth01{color:#202020;}
.header:hover .gnb>ul .depth02 a{color:#202020;}
.header:hover .menuGroup .btn_open_gnb{background-position:bottom left;}
.header.is-fixed h1 a{background-position:bottom left;}
.header.is-fixed .menuGroup .lang a,
.header.is-fixed .menuGroup .lang button{color:#202020;}
.header.is-fixed .menuGroup .lang button:after{background-position:bottom left;}
.header.is-fixed .menuGroup .btn_open_search{background-position:bottom left;}
.header.is-fixed .menuGroup .link_toMain{background-position:bottom left;}
.header.is-fixed .menuGroup .btn_open_gnb{background-position:bottom left;}
.header.is-fixed .gnb>ul .depth01{color:#202020;}
.header.is-fixed .gnb>ul .depth02 a{color:#202020;}
.header.is-show{transform:translateY(0);background:rgba(255, 255, 255, 0.8); box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.04);}
.header.is-hide{transform:translateY(-100%);}
.header._black h1 a{background-position:bottom left;}
.header._black .menuGroup .lang a,
.header._black .menuGroup .lang button{color:#202020;}
.header._black .menuGroup .lang button:after{background-position:bottom left;}
.header._black .menuGroup .btn_open_search{background-position:bottom left;}
.header._black .menuGroup .link_toMain{background-position:bottom left;}
.header._black .menuGroup .btn_open_gnb{background-position:bottom left;}
.header._black .gnb>ul .depth01{color:#202020;}
.header._black .gnb>ul .depth02 a{color:#202020;}

@media screen and (max-width:1080px){
    .header{display:flex; align-items: center; height:14.81481vw; padding:0 7.4074vw;}
    .header h1 a{width:25.92592vw; height:6.3888vw; margin-top:0;}

    .menuGroup{position:relative; top:0; right:0; margin-left:auto;}
    .menuGroup .lang a,
    .menuGroup .lang button{font-size:3.7037vw;}
    .menuGroup .lang button:after{width:3.14814vw; height:2.22222vw; margin-left:1.85185vw;}
    .menuGroup .lang ul{display:none; top:0; left:auto; right:0; width:auto; padding-top:0;}
    .menuGroup .lang ul li+li{margin-top:0; margin-left:2.77777vw;display:block;}
    .menuGroup .lang ul li a{padding:0 0.648148vw;}
    .menuGroup .lang.opened button{transform:translateX(-24.8148vw);}
    .menuGroup .lang.opened button:after{transform:rotate(-90deg);}
    .menuGroup .lang.opened ul{display:flex;}

    .menuGroup .btn_open_search{width:5.31851vw; height:4.5444vw; margin-left:5.5555vw;}
    .menuGroup .link_toMain,
    .menuGroup .btn_open_gnb{width:5.31851vw; height:4.4444vw; margin-left:5.5555vw;}
    .menuGroup .btn_open_gnb{display:block;}
    .menuGroup .link_toMain{display:none;}

    .gnb{display:none;}
    .gnb_m{display:block; position:fixed; top:0; left:100%; width:100%; height:100%; margin-left:0; padding-left:12.59259vw; overflow-y: auto; z-index:1100;}
    .gnb_m .dim{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(32, 32, 32, 0.7); opacity:0; transition:opacity 0.3s ease;}
    .gnb_m>ul{display:block; position:relative; min-height:640px; background:#fff; transform:translateX(100%);  transition:transform 0.3s ease;}
    .gnb_m>ul>li{padding-left:7.4074vw; background-repeat:no-repeat; background-position:left center; background-size:cover;}
    .gnb_m>ul>li+li{margin-left:0;}
    .gnb_m>ul .depth01{display:block; height:20vh; line-height:20vh; font-size:6.66666vw; transition: all 0.3s ease; color:#fff; font-weight:500;}
    .gnb_m>ul>li:nth-of-type(1){background-image:url(../img/gnb_bg_01.jpg);}
    .gnb_m>ul>li:nth-of-type(2){background-image:url(../img/gnb_bg_02.jpg);}
    .gnb_m>ul>li:nth-of-type(3){background-image:url(../img/gnb_bg_03.jpg);}
    .gnb_m>ul>li:nth-of-type(4){background-image:url(../img/gnb_bg_04.jpg);}
    .gnb_m>ul>li:nth-of-type(5){background-image:url(../img/gnb_bg_05.jpg);}
    .gnb_m>ul .depth02{display:none; position:relative; top:0; left:0; width:auto;}
    .gnb_m>ul .depth02>li{float:none; width:auto; margin-top:7.407407vw; margin-left:0;}
    .gnb_m>ul .depth02 a{font-size:5.185185vw; color:#202020;}
    .gnb_m>ul .depth03{margin-left:5.5555vw;}
    .gnb_m>ul .depth03 li{margin-top:5.55555vw;}
    .gnb_m>ul .depth03 a{font-size:3.7037vw;}

    .gnb_m>ul>li.is-opened{padding-top:11.1111vw; padding-bottom:11.1111vw; background:#fff;}
    .gnb_m>ul>li.is-opened .depth01{height:auto; line-height:1; color:#202020;}
    .gnb_m>ul>li.is-opened .depth02{display: block;}

    .gnb_m .btn_close_gnb{position:absolute; top:11.11111vw; left:3.703703vw; width:6.66666vw; transform:translateX(-200%); transition:transform 0.3s ease;}
    .gnb_m .btn_close_gnb img{width:100%;}

    .gnb_m.m_opened{left:0;}
    .gnb_m.m_opened .dim{position:fixed; opacity: 1;}
    .gnb_m.m_opened>ul{transform:translateX(0%);}
    .gnb_m.m_opened .btn_close_gnb{position:fixed; transform:translateX(0%);}
}

/* 상단 검색영역 */
.searchBox{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1100;}
.searchBox .dim{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5); opacity:0;}
.searchBox .btn_close_search{position:absolute; top:405px; left:50%; width:38px; margin-left:-19px; opacity:0;}
.searchBox .btn_close_search img{width:100%;}
.searchBox .inner{display:flex; justify-content: center; align-items: center; flex-direction: column; position:relative; height:380px; background:#5e5e5e; transform:translateY(-100%);}
.searchBox .inner>div{display:flex; align-items: center; width:1000px;}
.searchBox .inner>div+div{margin-top:20px;}
.searchBox .inner p{width:400px; font-size:36px; font-weight:500; color:#fff;}
.searchBox .inner .forms{display:flex; width:600px;}
.searchBox .inner .searchBar{display:flex; align-items: center; width:100%; background:#747474;}
.searchBox .inner .searchBar input{width:calc(100% - 42px); height:50px; padding:0 10px; border:0; color:#fff; background:transparent;}
.searchBox .inner .searchBar input::placeholder{color:#afafaf}
.searchBox .inner .searchBar .btn_search{display:inline-block; width:22px; margin:0 10px;}
.searchBox .inner .searchBar .btn_search img{width:100%;}
.searchBox .inner .form_select{display:inline-block; position:relative; margin-right:10px;}
.searchBox .inner .form_select:after{content:""; display:block; position:absolute; top:50%; right:10px; width:15px; height:10px; margin-top:-5px; background:url(../img/ico_select.png) no-repeat top left / cover;}
.searchBox .inner .form_select select{width:165px; height:50px; padding:0 40px 0 10px; border:0; outline:none; background:#747474; color:#fff; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; cursor:pointer;}
.searchBox .forms form{width:100%;}

@media screen and (max-width:1080px){
    .searchBox .btn_close_search{top:68.51851vw; width:7.407407vw; margin-left:-3.703703vw;}
    .searchBox .inner{display:block; height:62.96296vw; padding:7.407407vw;}
    .searchBox .inner>div{display:block; width:100%;}
    .searchBox .inner>div+div{margin-top:5.55555vw;}
    .searchBox .inner p{width:auto; font-size:2.96296vw;}
    .searchBox .inner .forms{flex-wrap: wrap; width:auto;}
    .searchBox .inner .searchBar input{width:calc(100% - (4.8148vw + (2.77777vw * 2))); height:9.25925vw; padding:0 2.77777vw;}
    .searchBox .inner .searchBar .btn_search{width:4.8148vw; margin:0 2.77777vw;}
    .searchBox .inner .form_select{width:calc((100% - 1.85185vw) / 2); margin-right:0; margin-bottom:1.85185vw;}
    .searchBox .inner .form_select+.form_select{margin-left:1.85185vw;}
    .searchBox .inner .form_select:after{right:10px; width:15px; height:10px; margin-top:-5px;}
    .searchBox .inner .form_select select{width:100%; height:9.25925vw; padding:0 40px 0 10px;}
}

/* 푸터 */
.footer{position:relative; padding:25px; background:#5e5e5e; color:#dbdbdb; font-size:12px;}
.footer .link{position:absolute; top:25px; right:25px;}
.footer .link a{display:inline-block; color:#dbdbdb;}
.footer .copyright{position:absolute; bottom:25px; right:25px;}

@media screen and (max-width:1080px){
    .footer{padding:0; font-size:2.407407vw;}
    .footer .link{position:relative; top:0; right:0; padding:2.7777vw 0; border-top:1px solid #8b8b8b; border-bottom:1px solid #8b8b8b; text-align: center;}
    .footer address{padding:3.703703vw 7.4074vw;}
    .footer .copyright{position:relative; bottom:0; right:0; padding:0 7.4074vw 3.703703vw;}
}

.addrInfo strong{display:block;}
.addrInfo span+span{margin-left:10px;}
@media screen and (max-width:1080px){
	.addrInfo{line-height:1.5;}
	.addrInfo span+span{margin-left:0;}
}

/* 240701 IP TecheCenter 추가 */
.menu_iptech .depth02>li{margin-left:20px;}
.menu_iptech .depth02 a{width:190px;}
.menu_iptech .depth02>li:nth-of-type(4){clear:left; margin-left:0;}
.menu_iptech .depth02>li:nth-of-type(6){clear:left; margin-left:0;}
/* 240701 IP TecheCenter 추가 end */
