*{outline: 0}

:root{
	--atsens-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Hiragino Sans", "Yu Gothic", Meiryo, "Helvetica Neue", Arial, sans-serif;
}

select::-ms-expand { 
	display: none;
}
select {
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
    background: url(/img/sub/sel_arr.png) right 30px center no-repeat !important;
}

.eng{
	font-family: var(--atsens-font-sans);
	font-weight: 400;
	font-style: normal;
}

*{ margin: 0; padding: 0; }
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, button,
time, mark, audio, video, a, textarea, input{;margin:0;  padding:0;  border:0; font-size:100%; vertical-align:baseline; background:transparent; -webkit-text-size-adjust:none; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; font-family: var(--atsens-font-sans); font-style: normal; }
html{ -ms-touch-action:auto;}
html,body, section{width:100%;}

img{}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav, section{}
legend, caption{width:0;height:0;visibility:hidden;font-size:0;line-height:0;}
button{cursor:pointer; border:none; padding:0; }
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0;}
li,dd{list-style:none;}
blockquote, q {quotes:none;}
address, caption, em, cite, i, a {font-weight:normal; font-style:normal; text-decoration: none;color: #333}
table {border-collapse:collapse; border-spacing:0; table-layout:fixed;}
iframe{width:100%;vertical-align:middle;}
caption{display:none;}
figcaption{display:block;}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance:none;  margin:0; }

strong {font-weight: bold }

input[type="text"], input[type="number"],input[type="email"], input[type="search"],
input[type="password"], input[type="date"], input[type="tel"], select{display:table-cell; vertical-align:middle; padding:  0 0 0 7px; height: 40px; line-height: 1; box-sizing: border-box; background:#fff; border:1px solid #cccccc;
  border-radius:0; color:#999; font-size:12px;font-family: var(--atsens-font-sans);}

input[type="search"] {border-radius:0; -webkit-border-radius:0; -webkit-appearance:textfield;}
input[type="search"]::-webkit-search-results-decoration {-webkit-appearance:none;}

input[type='checkbox'],input[type='radio'] {vertical-align:middle; margin-top:0;  cursor : pointer;}

input.disabled {background:#fff;}

input[type=date]::-webkit-clear-button,
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-calendar-picker-indicator {
    display: none;
}


select::-ms-expand{display:none; }
select{ cursor: pointer; outline :none; overflow :hidden; color:#999; width:100%;;  }
textarea{width:100%;height:100px; resize:none; border:1px solid #cccccc;   padding:10px; color:#999;}


.blind{position:absolute; top:-999999px; width:0; height:0; font-size:0; overflow:hidden;}
.clear:after{content:""; display: table; clear: both;}
.clearfix{overflow:hidden;}
.clearfix:after{clear:both; display:table; content:'';}
.center{text-align:center; display:block; float:none !important;}
.accessibility{display: none}
.hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: none;
    clip: rect(0,0,0,0);
    overflow: hidden;
}


.inner{ width: 1400px; margin: 0 auto; }


/* 헤더 공통 */
#header{ position: fixed; width: 100%; left: 0; top: 0; z-index: 10; height: 100px; transition: background .3s;z-index: 1000; }
/*#header.on{ background: rgba(255,255,255,0);backdrop-filter:blur(20px) }*/
#header.ac{ background-color: #fff; }
#header .wrap{ max-width: 1920px; margin: 0 auto; position: relative; height: 100%; }
#header h1{ position: absolute; left: 60px; top: 50%; transform: translate(0,-50%);}
#header h1 a{ display: block ;width: 100%; height: 100%; position: relative; }
#header h1 a svg{ mix-blend-mode: overlay;; }
/*#header.on h1 a svg *{ fill: #002F58; }*/
#header.sub h1 a svg *{ fill: #002F58; }
#header.ac h1 a svg *{ fill: #002F58; }

#header .gnb{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
#header .gnb > ul > li{ float: left; padding: 0 36px; position: relative; }
#header .gnb > ul > li > a{ font-size: 18px; font-weight: 800; color: #FFFFFF; line-height: 100px; display: block; text-align: center; transition: color 0.3s; position: relative; }
#header .gnb > ul > li > ul{ position: absolute; left: -10%; top: 100%; width: 120%; padding: 30px 0; display: none; background-color: #416848; }
#header .gnb > ul > li > ul li{ text-align: center; margin-bottom: 24px; }
#header .gnb > ul > li > ul li:last-child{ margin-bottom: 0; }
#header .gnb > ul > li > ul li a{ font-size: 16px; font-weight: 500; color:#FFCC00;  transition: color 0.3s; }
#header .gnb > ul > li:hover > a{ color: #FFCC00; }
#header .gnb > ul > li.on > a{ color: #FFCC00; }

#header .gnb > ul > li > a:after{ content: ""; display: block; width: 0; height: 2px; background-color:#FFCC00; position: absolute; left: 50%; bottom: 0; transform: translate(-50%,0); transition: width .3s; }
#header .gnb > ul > li:hover > a:after{ width: 100%; }
#header .gnb > ul > li.on > a:after{ width: 100%; }

#header .gnb > ul > li > ul > li:hover > a{ color: #fff; }

#header.on .gnb > ul > li > a{ color: #000000; }
#header.on .gnb > ul > li:hover > a{ color: #FFCC00; }
#header.ac .gnb > ul > li > a{ color: #000000; }
#header.ac .gnb > ul > li:hover > a{ color: #FFCC00; }

#header .sub_nav > div{ display: none; height: 100%;  position: fixed; width: 100%; height: 100px; top: 100px; left: 0; background-color: #fff; display: none; }
#header .sub_nav > div{ text-align: center; }
#header .sub_nav > div > ul{ width: 100%; display: flex; justify-content: space-between; justify-content: center; align-items: center; height: 100%;}
#header .sub_nav > div > ul > li{ margin-right: 50px; }
#header .sub_nav > div > ul > li > a{ font-size: 16px; color: rgba(0,0,0,0.5); transition: color .3s; font-weight: 500;  }
#header .sub_nav > div > ul > li > a:hover{ color: #000; }
#header .sub_nav > div > ul > li:last-child{ margin-right: 0; }
#header .lang { position: absolute; right: 120px; top: 50%; transform: translate(0,-50%);}
#header .lang button{ color: #fff; font-size: 18px; font-weight: 800; display: block; }

/*
#header.on .lang button{ color: #002F58; }
#header.on .lang svg path{ stroke:#002F58; }
#header.on .lang svg line{ stroke:#002F58; }
#header.on .lang svg circle{ stroke:#002F58; }
#header.ac .lang button{ color: #000; }
#header.ac .lang svg path{ stroke:#000; }
*/

#header:before{content: '';display: block;width: 100%;height: 100px;background: rgba(255, 255, 255, 0.0);backdrop-filter: blur(20px) brightness(0.9);position: absolute;top: 0;left: 0;transition-duration: 0.5s}
#header.on:before{height: 100px}
#header.open:before{height: 220px}
#header.sub .lang button{ color: #002F58; }
#header.sub .lang svg path{ stroke:#002F58; }
#header.sub .lang svg line{ stroke:#002F58; }
#header.sub .lang svg circle{ stroke:#002F58; }
#header #gnb > ul{display: flex;justify-content: center;gap: 80px}
#header #gnb > ul > li > a{display: flex;height: 100px;align-items: center;font-size: 20px;color: #FFFFFF;font-weight: 600;font-family: var(--atsens-font-sans);position: relative;font-weight: 500}
#header #gnb > ul > li > a:after{content: '';display: block;width: 78px;left: 50%;margin-left: -39px;height: 1px;background: #FFFFFF;position: absolute;bottom: -1px;transform: scaleX(0);transition-duration: 0.5s}
#header #gnb > ul > li:hover > a:after{transform: scaleX(1)}
#header #gnb > ul > li > a:before{content: '';display: block;width: 116px;height: 58px;border-radius: 58px 58px 0 0;background: #57F9FF;position: absolute;bottom: -20px;left: 50%;margin-left: -58px;filter: blur(30px);;transform: scale(0.7);transform-origin: center bottom;transition-duration: 0.7s;z-index: -1;opacity: 0}
#header #gnb > ul > li:hover > a:before{opacity: 1;transform: scale(1)}
#header .all_menu_b{ position: absolute; right: 60px; top: 50%; transform: translate(0,-50%); cursor: pointer; }
#header #gnb > ul ul{position: absolute;left: 0;display: flex;width: 100%;justify-content: center;height: 92px;gap: 100px;align-items: center;border-top: 1px solid rgba(255,255,255,0.2);display: none}
#header #gnb > ul li:hover ul{display: flex}
#header #gnb > ul ul li a{display: block;font-size: 16px;color: #FFFFFF;font-family: var(--atsens-font-sans);}
#header #gnb > ul > li > ul.ia-solution-submenu{gap: 34px;height: auto;min-height: 120px;padding: 18px 40px;align-items: stretch}
#header #gnb > ul > li > ul.ia-solution-submenu > li{margin: 0;text-align: left}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-group{display: flex;align-items: center;gap: 20px;padding: 0 24px;border-right: 1px solid rgba(255,255,255,0.18)}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-group:last-child{border-right: 0}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-title{font-size: 18px;font-weight: 700;color: #FFFFFF;white-space: nowrap}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-products{display: flex;gap: 16px;align-items: center}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-products a{font-size: 15px;color: rgba(255,255,255,0.78);white-space: nowrap}
#header #gnb > ul > li > ul.ia-solution-submenu .ia-nav-products a:hover{color: #57F9FF}

#header .all_menu{ position: fixed; right: 0; top: 0; height: 100%; width: 80%; max-width: 320px; background-color: #fff; padding-top: 140px; padding-bottom: 60px; padding-left: 50px; z-index: 999;
  transform: translate(100%,0); transition: transform .8s; overflow-y: scroll;
}
#header .all_menu.on{ transform: translate(0,0); box-shadow: 0px 30px 0px 0px rgb(69 80 95 / 12%); }


#header .lang ul{ width: 70px; position: absolute; left: 50%; top: 100%; transform: translate(-50%,0); background-color: #3282DE; display: none; }
#header .lang ul li a{ height: 40px; text-align: center; width: 100%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 15px; opacity: .7; transition: opacity .3s; }
#header .lang ul li a:hover{ opacity: 1; }

#header .all_menu .close_b{ width: 28px; height: 28px; position: absolute; right: 20px; top: 20px; background-color: transparent; transform: rotate(45deg);}
#header .all_menu .close_b span:nth-child(1){ width: 100%; height: 2px; background-color: #5b606a; display: block; position: absolute; left: 0; top: 13px; }
#header .all_menu .close_b span:nth-child(2){ width: 2px; height: 100%; background-color: #5b606a; display: block; position: absolute; left: 13px; top: 0; }
#header .all_menu > ul > li{ margin-bottom: 30px; }
#header .all_menu > ul > li:last-child{ margin-bottom: 0; }
#header .all_menu > ul > li > a{ font-size: 16px; font-weight: 500; color:#313741; letter-spacing: -0.5px; display: block; position: relative; }
#header .all_menu > ul > li > a:after{ content:""; display: block; width: 0; height: 2px; background-color: #FFCC00; position: absolute; left: -50px; top: 50%; transform: translate(0,-50%);}
#header .all_menu > ul > li:hover > a{ color: #FFCC00; }
#header .all_menu > ul > li:hover > a:after{ width: 30px; transition: width .5s; }

#header .all_menu > ul > li > ul{ margin-top: 20px; display: none; }
#header .all_menu > ul > li > ul.on{ display: block; }
#header .all_menu > ul > li > ul > li > a{ font-size: 16px; font-weight: 500; color:#494d54; opacity: .6; letter-spacing: -0.5px; display: block; transition: opacity .4s; }
#header .all_menu > ul > li > ul > li:hover > a{ opacity: 1; }
#header .all_menu > ul > li > ul > li{ margin-bottom: 12px; }
#header .all_menu > ul > li > ul > li:last-child{ margin-bottom: 0; }
#header .all_menu .sub_b{ margin-top: 10px; display: none; }
#header .all_menu .sub_b li a{ font-size: 14px; color: #666; line-height: 24px; opacity: .4; transition: opacity.3s; }
#header .all_menu .sub_b li a:hover{ opacity: 1; }
#header #m_open{position: fixed;height: 100vh;right: 0;width: 640px;background: #fff;z-index: 999;padding-top: 90px;top: 0;box-shadow: 0 0 40px #002F5800;transform: translateX(100%);transition-duration: 0.7s;overflow-y: scroll;padding-bottom: 60px}
#header #m_open.on{box-shadow: 0 0 40px #002F5820;transform: translateX(0%)}
#header #m_open .b_w{position: absolute;top: 27px;right: 60px;display: flex;gap: 15px}
#header #m_open .b_w svg{display: block}
#header #m_open .gnb_w{display: flex;flex-direction: column;gap: 40px}
#header #m_open .gnb_w strong{display: block;padding: 0 80px;font-size: 40px;font-weight: 600;color: #000000;font-family: var(--atsens-font-sans);text-transform: uppercase;margin-bottom: 7px}
#header #m_open .gnb_w .w > ul > li > a, #header #m_open .gnb_w .w > ul > li > button{display: flex;align-items: center;height: 38px;align-items: center;font-size: 20px;color: #72787F;line-height: 1;gap: 15px;padding: 0 80px;width: 100%;transition: 0.5s}
#header #m_open .gnb_w .w > ul > li:hover > a{color: #000}
#header #m_open .gnb_w .w > ul > li i, #header #m_open .gnb_w .w > ul > li i svg{display: block}
#header #m_open .gnb_w .w > ul > li ul{display: flex;padding: 0 80px;gap: 40px;background: #EDF0F3}
#header #m_open .gnb_w .w > ul > li ul li a{display: block;line-height: 50px;font-size: 17px;color: #7E8692;font-weight: 500}
#header #m_open .gnb_w .w > ul > li ul li:hover a{color: #3282DE}
#header #m_open .gnb_w .w > ul > li.ia-mobile-cluster{margin-bottom: 10px}
#header #m_open .gnb_w .w > ul > li.ia-mobile-cluster > button{font-weight: 700;color: #252D57}
#header #m_open .gnb_w .w > ul > li.ia-mobile-cluster > ul{display: flex;flex-wrap: wrap;gap: 8px 24px;padding-top: 6px;padding-bottom: 6px}
#header #m_open .gnb_w .w > ul > li i svg{transform: rotate(180deg);transition: 0.5s}
#header #m_open .gnb_w .w > ul > li.on i svg{transform: rotate(0deg);}
#header #m_open .gnb_w .w > ul > li.on button{color: #000}
#header #m_open .gnb_w .w > ul > li.on button path{stroke: #000000}
#header #m_open .gnb_w .w > ul > li button path{stroke: #72787F}
#footer{background: #111111;padding: 60px 40px;padding-right: 75px;}
#footer .ft01{display: flex;justify-content: space-between;padding-top: 60px}
#footer .ft01 .left {display: flex;flex-direction: column;gap: 50px}
#footer .ft01 .left ul{display: flex;gap: 60px}
#footer .ft01 .left ul li span{display: block;font-size: 16px;color: #FFFFFF;font-weight: 600;margin-bottom: 8px;}
#footer .ft01 .left ul li p{display: block;font-size: 16px;color: #BBBBBB;font-weight: 400;line-height: 24px;}
#footer .ft01 .right{padding-left: 60px;position: relative}
#footer .ft01 .right:before{content: '';display: block;width: 1px;height: 600px;top: -60px;left: 0;background: #292929;position: absolute}
#footer .ft01 .right > ul{display: flex;gap: 100px;}
#footer .ft01 .right > ul > li > a{display: block;font-size: 16px;color: #FFFFFF;margin-bottom: 20px}
#footer .ft01 .right > ul > li > ul{display: flex;flex-direction: column;gap: 12px}
#footer .ft01 .right > ul > li > ul > li > a{display: block;font-size: 16px;color: #CCCCCC;line-height: 1}
#footer .ft01 .right > ul > li > ul > li ul{display: flex;flex-direction: column;gap: 10px}
#footer .ft01 .right > ul > li > ul > li ul{margin-top: 10px}
#footer .ft01 .right > ul > li > ul > li ul li a{display: block;font-size: 15px;color: #999999;line-height: 1}
#footer .ft01 .right .footer-solution-ia > li > a{font-weight: 600;color: #CCCCCC}
#footer .ft01 .right .footer-solution-ia > li + li{margin-top: 18px}
#footer .ft01 .right .footer-solution-ia > li ul{padding-left: 12px;border-left: 1px solid #292929}
#footer .ft02{display: flex;justify-content: space-between;flex-direction: row-reverse;margin-top: 78px;align-items: flex-end;;}
#footer .ft02 ul{display: flex;gap: 10px;}
#footer .ft02 ul li svg{display: block;}
#footer .ft02 address{font-size: 16px;color: #666666;}
#footer .ft02 address a{color: inherit;text-decoration: underline;;}
#footer .ft00{display: flex;justify-content: space-between;align-items: flex-end;padding-bottom: 30px;border-bottom: 1px solid #292929}
#footer .ft00 ul{display: flex;gap: 62px}
#footer .ft00 ul li a{font-size: 18px;color: #F1F1F1;font-weight: 500}
#footer .ft00 ul li{font-size: 18px;color: #F1F1F1;font-weight: 500}
.btn_top{position: fixed;bottom: 40px;right: 40px;z-index: 99;transition-duration: 0.5s;opacity: 0}
.btn_top.on{opacity: 1}
.btn_top button{width: 70px;height: 70px;;background: #3282DE;border-radius: 60px;display: flex;align-items: center;justify-content: center;flex-direction: column;transition-duration: 0.5s}
.btn_top button:hover{border-radius: 10px}
.btn_top button i{position: relative;display: block;overflow: hidden}
.btn_top button i svg{display: block;transition: 0.5s}
.btn_top button b{display: block;transition: 0.5s}
.btn_top button:hover i svg{transform: translateY(-100%)}
.btn_top button:hover b{transform: translateY(-100%)}
.btn_top button i svg:nth-child(2){position: absolute;top: 100%}
.btn_top button strong{position: relative;overflow: hidden;display: block}
.btn_top button strong b:nth-child(2){position: absolute;top: 100%;left: 0}
.btn_top button strong b{font-size: 15px;font-family: var(--atsens-font-sans);color: #fff;font-weight: 500}
@media (max-width: 1716px){
    #header #m_open .gnb_w strong{font-size: 30px}
    #header #m_open{padding-top: 90px}
    #header #m_open .gnb_w .w > ul > li > a, #header #m_open .gnb_w .w > ul > li > button{height: 40px;font-size: 16px}
    #header #m_open .gnb_w .w > ul > li ul li a{line-height: 40px;font-size: 14px}
}
@media (max-width: 1416px){
    #footer .ft01 .left ul{flex-wrap: wrap;gap: 20px}
    #header #m_open .gnb_w{gap: 30px}
    #header #m_open{padding-top: 120px}
}

@media (max-width: 1160px){
	#header{height: 60px}
	#header:before,#header.on:before{height: 60px}
	#header #gnb{display: none}
	#header h1{left: 20px}
	#header h1 svg{width: 70px;height: auto}
	#header .all_menu_b{right: 20px}
	#header .all_menu_b button svg,#header .lang button svg{width: 36px;height: auto}
	#header .lang{right: 60px}
}

@media (max-width: 980px){
	#header .all_menu_b{display: block}
	#header:before{height: 60px}
	#header.on:before{height: 60px}
	#header #gnb {display: none}
    #header #m_open .gnb_w .w > ul > li > a, #header #m_open .gnb_w .w > ul > li > button{height: 40px;font-size: 14px}
    #header #m_open .gnb_w .w > ul > li ul{gap: 20px}
    #header #m_open .gnb_w .w > ul > li ul li a{line-height: 40px;font-size: 13px}
    #header #m_open .gnb_w strong{font-size: 20px}
	#header h1{ left: 20px; }
	#header h1 svg{ width: 70px; height: auto; }
	#header{ height: 60px; }
	#header .all_menu_b{ right: 20px; }
	#header .all_menu_b button svg{ width: 36px; height: auto; }
	#header .lang button svg{ width: 36px; height: auto; }
	#header .lang{ right: 60px; }
    #footer .ft01 .left ul li p, #footer .ft01 .left ul li span{font-size: 12px;line-height: 1.5;;}
    #footer{padding: 40px 20px;}
    #footer .ft02{margin-top: 20px;}
    #footer .ft02 svg{width: 26px;height: 26px;}
    #header #m_open .gnb_w .w > ul > li > a, #header #m_open .gnb_w .w > ul > li > button, #header #m_open .gnb_w strong, #header #m_open .gnb_w .w > ul > li ul{padding: 0 25px}
    #header #m_open .b_w{right: 20px;top: 20px}
    #header #m_open .b_w svg{width: 30px;height: auto}
    #header #m_open{padding-top: 60px;width: 260px}
    #header #m_open .gnb_w{gap: 10px}
    #header #m_open .gnb_w .w > ul > li > a, #header #m_open .gnb_w .w > ul > li > button{height: 25px}
    .btn_top button i svg{width: 13px;height: auto}
    .btn_top button strong b{font-size: 12px}
    .btn_top button {width: 45px;height: 45px}
    .btn_top{right: 20px;bottom: 20px}

}

@media (max-width: 800px){

}

@media (max-width: 414px){

}