.header {width: 100%; position: relative;  z-index:1111; background:#e9ebef;}
.header > .inner{ display:flex; justify-content: space-between;align-items: flex-end;}
.header > .inner:before{ content:''; position:absolute; bottom:0; right:35%; width:400px; height:200px; background:url(../img/common/top-img.png) no-repeat 50% 100%; background-size:auto 100%; }
.header .logo{ padding-top:50px;}
.header .logo img{width: 350px;  }
.header .top-icon ul{ display:flex;text-align:center; padding-bottom:30px; }
.header .top-icon ul li a{ color:#333; display:block;}
.header .top-icon ul li img{ height:45px;}
.header .top-icon ul li p{ font-size:19px; margin-top:10px;}
.header .top-icon ul li+li{ margin-left:50px;}
.header .nav { display:flex;align-items: center; margin-top:15px;}
.header .nav .close {display: none;}
.header .nav .deps_1 {display: flex;}
.header .nav .deps_1 > li {height: 100%; font-size:25px; font-weight: 500; position: relative}
.header .nav .deps_1 > li+li{ margin-left:70px;}
.header .nav .deps_1 > li a{ padding:40px 0; display: block;white-space:nowrap; display: flex; align-items: center; color: #333 ; position: relative; font-size:27px;}
.header .quick-text {display: none}
.header .nav .deps_1 > li .deps_2 {position: absolute;left:50%; bottom: 15px; transform: translateY(100%); width:250px; margin-left:-125px;  background:#292e33; opacity: 0; transition: all .3s ;padding: 17px 0; visibility: hidden}
.header .nav .deps_1 > li .deps_2 li > a {padding: 8px 0px;justify-content: center; font-size: 19px; color: #fff}
.header .nav .deps_1 > li .deps_2 li > a:hover{ color:#0CF}

.header > .icon-box  { position:absolute; top:50%; transform: translateY(-50%); right:0;}
.header > .icon-box button {padding:10px; font-size: 24px; color: #333; cursor:pointer}
.header > .icon-box button.ham {display: none}
.header .fix_btn_box {position: fixed; right: 40px; bottom: 40px; opacity: 1; z-index: 5 ; transition: all .3s}

/*전체메뉴*/
#modal{display:none;}
.modal-btn{font-size:25px;cursor: pointer;; margin-right:30px;}
.dialog {display:none;position: fixed;left: 0;top: 0;z-index: 10;width: 100%;height: 100%;background:url(../img/common/modal-bg.jpg) no-repeat 50% 50% / cover;}
.dialog>.tb {display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.dialog>.tb .inner img{ width:500px;}
.dialog>.tb .inner > ul{display: grid; grid-template-columns:repeat(5, 1fr); text-align:center; border-top:2px solid #fff; padding-top:30px; margin-top:50px;}
.dialog>.tb .inner > ul > li+li{ border-left:1px solid rgb(255,255,255,0.3)}
.dialog>.tb .inner > ul > li > a{ font-size:35px; font-weight:700; border-bottom:1px solid #fff; display:block; margin:0 20px 30px 20px; padding-bottom:20px;}
.dialog>.tb .inner > ul > li:first-child a{ margin-left:0;}
.dialog>.tb .inner > ul > li:last-child a{ margin-right:0;}
.dialog>.tb .inner > ul > li > ul > li{ line-height:40px;}
.dialog>.tb a{ color:#fff;}
input[id="modal"]:checked + label + .dialog{  display: block;}
.dialog .m-close{font-size:55px;cursor:pointer; display:block; color:#fff; position:absolute; top:30px; right:30px;}

.inner{ position:relative; width:1920px; margin:0 auto;}

.over{transition: all 0.3s; display:block;}
.over:hover,
.over:focus,
.over:hover,
.over:focus { border-radius: 1rem 2.8rem 1rem 1rem !important; border-color: #0a50a1 !important; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1) !important; background: #fff; }


#footer{ background:#292e33; color:rgb(255,255,255,0.7); margin-top:170px;}
#footer .inner{ padding:100px 0;}
#footer .inner h1{ font-size:35px;}

.footer_link ul{ display:flex;align-items: center;}
.footer_link ul li+li{ margin-left:25px;}
.footer_link ul a{ color:rgb(255,255,255,0.7)}

.footer_info{ display:flex; justify-content: space-between;align-items: center;  margin-top:30px;}
.footer_info p{ color:rgb(255,255,255,0.5)}

.footer_info span+span{ margin-left:15px;}
#footer .copy{ background:#171c1e; padding:20px 0; text-align:center; font-size:17px; letter-spacing:0; color:rgb(255,255,255,0.3)}
#footer .copy a{color:rgb(255,255,255,0.3)}
/* siteLink */
.siteLink {  }
.siteLink .siteBtn { position: relative; }
.siteLink .siteBtn button { width: 100%;display: flex; justify-content: space-between;align-items: center; background:rgb(255,255,255,0.1); padding:15px 20px; border-radius: 0.8rem;  color:rgb(255,255,255,0.5); letter-spacing:1px;font-size:17px; }
.siteLink .siteBtn button i { display: inline-block; color: #666; margin-left:50px; } 
.siteLink .siteBtn .sitelst { position: absolute; width:100%; box-sizing:border-box; padding: 0.9rem; bottom: calc(100% + 0.2rem); background: #fff; border-radius: 0.8rem; display: none; z-index: 2; }
.siteLink .siteBtn .sitelst ul { height:178px; overflow-y: auto; }
.siteLink .siteBtn .sitelst ul li + li { margin-top:10px; }
.siteLink .siteBtn .sitelst ul li a { display: block; color: #444; font-size:18px; }
.siteLink .siteBtn .sitelst ul li a:hover{ color:#0072bc; font-weight:600;}
/* siteLink:active */
.siteLink .siteBtn button i { transition: all 0.3s; }
.siteLink .siteBtn.on button { background: #004895; color: #fff; }
.siteLink .siteBtn.on button i { transform: rotate(180deg); color: #fff; }


@media (max-width: 1980px) {
	
	.inner{ width:1440px;}
	.header > .inner:before{height:150px; width:285px; right:27%; }
	.header .logo{ padding-top:37px;}
	.header .logo img{width:270px;}
	.header .nav .deps_1 > li {font-size:21px;}
	.header .top-icon ul li+li{ margin-left:37px;}
	.header .nav .deps_1 > li a {padding:30px 0; font-size:23px;}
	.header .nav .deps_1 > li+li{ margin-left:60px;}
	.header .nav .deps_1 > li .deps_2 { width:200px; margin-left:-100px;}
	.header .nav .deps_1 > li .deps_2 li > a { font-size: 17px;}
	
	
	.header .top-icon ul li img{ height:35px;}
	.header .top-icon ul li p{ font-size:15px;}
	
	.dialog>.tb .inner > ul{ margin-top:30px;}
	.dialog>.tb .inner img{ width:400px;}
	.dialog>.tb .inner > ul > li > a{ font-size:30px;}
	.dialog>.tb .inner > ul > li > ul > li{ line-height:30px;}
	.dialog .m-close{font-size:40px;}
	
	#footer{ margin-top:130px; }
	.footer_info{ margin-top:10px;}
	#footer .inner{ padding:70px 0;}
	#footer .inner h1{ font-size:27px;}
	#footer .copy{ font-size:15px;}
	.footer_link h1 img{ width:300px; }
	.footer_info p b{font-size:16px;}
	
	.siteLink .siteBtn button{ font-size:14px; padding:10px 20px;}
	.siteLink .siteBtn button i{ font-size:20px;}
	.siteLink .siteBtn .sitelst ul li a {  font-size:15px; }
	.siteLink .siteBtn .sitelst ul { height:158px;}

	
	
}

@media (max-width: 1440px) {



    .header .nav .close ,
    .header > .icon-box button.ham,
    .header .quick-text {display: block}
	.header > .inner{align-items: center; padding:20px 0;}
	.header > .inner:before{ display:none;}

    .header .nav .close {position: absolute; right:20px; top: 20px; color: #333; font-size: 28px}
    .header .nav {position: fixed; left:0%;right: auto ;top: 0; width: 100%; height: 100%; z-index: 10; display: block; background-color: #002f60;
        transform: translate(100%,0); padding:0; transition: left .5s ease-in-out;overflow: auto; display: flex; flex-direction: column; align-items: flex-start;; margin-top:0;}
    .header.on .nav {left: -100%; }
    .header .nav .quick-text{display:flex; justify-content: space-between;align-items: center;width: 100%; padding:20px 20px; box-sizing:border-box; background:#fff;}
    .header .nav .quick-text .m-logo img{ width:250px;}
    .header .nav .quick-text > p {font-size: 24px; color: #fff; font-weight: 700; padding: 0 40px;}
    .header .nav .quick-text .navi_bg {padding: 0; box-shadow: none; border-radius: 0; display: flex; margin-top: 20px;border-bottom: 10px solid rgba(255,255,255, 0.2) }
    .header .nav .quick-text .navi_bg li {width: 20%; border: 1px solid rgba(255,255,255, 0.2); height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 15px;}
    .header .nav .quick-text .navi_bg li + li {margin-top: 0; border-left: none;}
    .header .nav .quick-text .navi_bg .icon_box {height:40px ; display: flex; align-items: center ; justify-content: center }
    .header .nav .quick-text .navi_bg li .ico_tit {word-break: keep-all;}
    .header .nav .quick-text .navi_bg li .ico_tit br {display: none;}

    .header .nav .bot-text {display: block; display: flex; font-size: 15px; width: 100%; padding-left: 40px; padding-top: 15px;}
    .header .nav .bot-text ul {display: flex; width: 100%;}
    .header .nav .bot-text ul li {border: 1px solid rgba(255,255,255, 0.2); color: #fff; border-radius: 50px; padding: 0 15px; height: 35px; line-height: 33px; font-size: 13px;}
    .header .nav .bot-text ul li + li {margin-left: 15px;}
    .header .nav > ul {display: flex;flex-direction: column; align-items: flex-start; padding: 20px 0;}
    .header.on > .right .spe .ham {display:none}
    .header.on > .right .spe .close {display:flex; position: fixed; right: 0; top: 0px; width: 80px; height: 80px;}
    .header .nav .deps_1 {padding:0 10px; margin-top:15px; box-sizing:border-box; width: 100%; height: auto}
    .header .nav .deps_1 > li {width: 100%;  height: auto; font-weight: 500; font-size:20px; border-bottom:1px solid rgb(255,255,255,0.05) }
    .header .nav .deps_1 > li+li{ margin-left:0px;}
    .header .nav .deps_1 > li > a {height: auto; padding: 0px;color: #fff !important; display: flex; align-items: center; justify-content: flex-start; padding:  20px 30px 0px;  padding-bottom:20px ;}
    .header .nav .deps_1 > li > a::after { content: "\ea4e";  font-family: "remixicon";display: none; posi0tion: static; width: auto; height:auto; font-size:20px; transform: translateX(0); vertical-align: middle; line-height: 1; margin-left: auto; font-weight: 500; width: auto; transition: all .3s;}
    .header .nav .deps_1 > li:nth-of-type(1),
    .header .nav .deps_1 > li:nth-of-type(2),
    .header .nav .deps_1 > li:nth-of-type(3),
    .header .nav .deps_1 > li:nth-of-type(4),
    .header .nav .deps_1 > li:nth-of-type(5) {cursor: pointer}
    .header .nav .deps_1 > li:nth-of-type(1) > a,
    .header .nav .deps_1 > li:nth-of-type(2) > a,
    .header .nav .deps_1 > li:nth-of-type(3) > a,
    .header .nav .deps_1 > li:nth-of-type(4) > a,
    .header .nav .deps_1 > li:nth-of-type(5) > a{pointer-events: none}
    .header .nav .deps_1 > li:nth-of-type(1) > a:after,
    .header .nav .deps_1 > li:nth-of-type(2) > a:after,
    .header .nav .deps_1 > li:nth-of-type(3) > a:after,
    .header .nav .deps_1 > li:nth-of-type(4) > a:after,
    .header .nav .deps_1 > li:nth-of-type(5) > a:after{display: inline-block}
    .header .nav .deps_1 > li:first-child a{margin-top: 0; }
    .header .nav .deps_1 > li.on {background-color: transparent; color: #fff;}
    .header .nav .deps_1 > li.active > a::after {transform: rotate(180deg);     }

    .header .nav .deps_1 > li .deps_2 {position: static; transform: none; opacity: 1;visibility: visible; transition: none; display: none; left:0; margin:0; width:100%; background:rgb(0,0,0,0.25)}
    .header .nav .deps_1 > li .deps_2 li > a {justify-content: flex-start; padding-left: 40px; color:rgb(255,255,255,0.6);}

    .navi_bg {; border-radius: 55px; padding:45.5px 20px 42.5px; box-shadow:2px 1px 25px rgba(0,0,0,0.35);}
    .navi_bg li + li {margin-top:40px;}
    .navi_bg i {font-size:35px; color: rgba(255,255,255,0.3); display: block; text-align: center;}
    .navi_bg .ico_tit {font-size:13px; font-weight: 400; margin:15px auto 0; color:#fff; display: block; text-align: center;}
    .navi_bg a {display: block; width:100%; text-align: center;}
    .navi_bg img {width:36px; opacity: 0.3;}
    .navi_bg a i, .navi_bg a img {transition: 0.3s ease-in-out;}

    .header .logo{ padding-top:0;}
    .header .fix_btn_box .menu_btn_box {display: none}
    .header .logo a{ margin-left:10px;}
    .header .top-icon{ margin-right:50px;}
    .header .top-icon ul li img{ height:25px;}
    .header .top-icon ul li p{ font-size:14px; margin:0; text-align:left;}
    .header .top-icon ul li p br{ display:none;}
    .header .top-icon ul li+li{ margin-left:20px;}
    .header .top-icon ul li a{ display:flex;gap:7px;align-items: center;}
   .deps_3 {display: none;}
   
   
   .modal-btn{ display:none;}
   .header .top-icon ul{ padding-bottom:0;}
   
    .top-icon-mo{}
   
   
   .inner{ width:100%;}
   
   #footer .inner{ padding:70px 10px; box-sizing:border-box;}
   

}





@media (min-width: 1440px){
    .header .nav .deps_1 > li:hover a:before {opacity: 1; bottom: -5px; }
    .header .nav .deps_1 > li:hover .deps_2 {opacity: 1; bottom: 0;   visibility:inherit}
    .header .fix_btn_box .top_btn_box:hover {box-shadow: none; background: #000;}
    .header .fix_btn_box .top_btn_box:hover i {color:#fff;}
    .header .fix_btn_box .menu_btn_box:hover ul{max-height: 542px; opacity: 1}
    .header .fix_btn_box .menu_btn_box:hover >i {opacity: 0;visibility: hidden}
    .header .fix_btn_box .menu_btn_box ul li a:hover .icon {opacity: 1}

}

@media (max-width:1024px){
	.header .top-icon{ display:none;}
	.header .nav .quick-text{ display:block; padding:0}
	.header .nav .quick-text .m-logo{ padding:20px;}
	.header .top-icon-mo{ display:block; border-top:1px #ddd solid;; margin-top:10px; margin-right:0;}
	.header .top-icon-mo ul{display: grid; grid-template-columns:repeat(4, 1fr);}
	.header .top-icon-mo ul li+li{ border-left:1px #ddd solid; margin:0;} 
	.header .top-icon ul li a{justify-content: center; padding:15px 0;}
	
	.footer_info{ display:block;}
	.footer_info p span{ display:block;}
	.footer_info p span+span{ margin:0;}
	
	.siteLink{ margin:20px 0;}
}
@media (max-width:640px){
	.header{ background:#fff;}
	.header .top-icon-mo{ margin-top:0;}
	.header .top-icon ul li a{ display:block;}
	.header .top-icon ul li p{ text-align:center; padding-top:10px;}
	
	.over:hover,
	.over:focus,
	.over:hover,
	.over:focus {border-radius:17px !important; border-color:none !important; box-shadow:none !important; background: #fff; }

	#footer{ margin-top:70px;}
	
	
}
@media (max-width:480px){
	.header .logo img, .header .nav .quick-text .m-logo img{ width:210px;}
	.header .top-icon ul li p br{ display:block;}
	
	#footer .inner h1{ font-size:23px;}
	.footer_link ul a{ font-size:15px;}
	.footer_link ul li+li{ margin-left:13px;}
	
	.footer_info p{ font-size:15px;}
	#footer .copy{ font-size:13px;}
}