@charset "utf-8";
@import url("../fonts/pretendard/pretendard.css");
@import url("../fonts/outfit/outfit.css");

*{outline:none;-webkit-text-size-adjust:none;font-family:inherit;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;}
button,input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="submit"],input[type="reset"]{-webkit-appearance:none;border-radius:0;}

input,select,textarea{-ms-user-select:auto;-moz-user-select:auto;-webkit-user-select:auto;-khtml-user-select:auto;user-select:auto;}

body{margin:0;padding:0;position:relative;font-family:"Pretendard",sans-serif;line-height:1.4;letter-spacing:0;overflow-x:hidden;}
body.fixed{overflow:hidden;}


/*width 1400*/
.sitewidth{max-width:calc(1400px + 60px);margin:0 auto;padding:0 30px;box-sizing:border-box;}
.sitewidth.wide{max-width:calc(1520px + 60px);}
.sitewidth.ultra{max-width:calc(1745px + 60px);}
.sitewidth.max{max-width:1920px;}
.sitewidth.padding_none{padding:0;}
@media all and (max-width:1000px){
	.sitewidth{padding:0 15px;}
	.sitemaxwidth{padding:0 15px;}
}


#wrap{position:relative;overflow:hidden;}


#header{position:fixed;z-index:10;left:0;top:0;width:100%;height:125px;border-bottom:0.5px solid transparent;box-sizing:border-box;transition:background-color ease 0.3s;}
#header .top{position:relative;height:100%;}
#header .top .inner{position:relative;height:100%;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:space-between;column-gap:60px;}
#header .top .logo{position:relative;display:block;text-decoration:none;}
#header .top .logo:before{content:"";display:block;position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;background-size:auto 100%;background-repeat:no-repeat;background-position:left center;background-image:url(../img/logo_inactive.png);opacity:1;transition:opacity ease 0.3s;}
#header .top .logo img{position:relative;display:block;height:45px;opacity:0;transition:opacity ease 0.3s;}
#header .top .menu{position:relative;flex-grow:1;max-width:940px;font-size:20px;font-weight:500;line-height:1.4;color:#FFFFFF;letter-spacing:0.05em;}
#header .top .menu > ul{position:relative;margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:space-between;}
#header .top .menu > ul > li{position:relative;}
#header .top .menu > ul > li.active{color:#007CAA;}
#header .top .menu > ul > li > a{position:relative;display:block;text-decoration:none;white-space:nowrap;}
#header .top .menu > ul ul{position:relative;margin:0;padding:0;list-style:none;display:none;font-size:16px;margin-top:0;color:#000000;font-weight:500;}
#header .top .menu > ul ul li{position:relative;}
#header .top .menu > ul ul li a{position:relative;display:block;text-decoration:none;border-radius:5px;padding:0 10px;height:35px;transition:background-color ease 0.3s;display:flex;flex-wrap:wrap;flex-direction:row;align-items:center;}
#header .top .menu > ul ul li.active{color:#007CAA;}
#header .top .menu > ul ul li a:hover{background-color:#fafafa;}
#header .top .right{position:relative;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:flex-end;column-gap:15px;}
#header .top .right .toggle_language{position:relative;display:block;margin:0;padding:0;border:0;border-radius:0;-webkit-appearance:none;background-color:transparent;width:20px;font-size:0;color:transparent;cursor:pointer;}
#header .top .right .toggle_language:before{content:"";display:block;padding-bottom:100%;background-size:100%;background-repeat:no-repeat;background-position:center center;;background-image:url(../img/icon_language_inactive.svg);opacity:1;transition:opacity ease 0.3s;}
#header .top .right .toggle_language:after{content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background-size:100%;background-repeat:no-repeat;background-position:center center;;background-image:url(../img/icon_language.svg);opacity:0;transition:opacity ease 0.3s;}
#header .top .right .toggle_menu{position:relative;display:none;margin:0;padding:0;border:0;border-radius:0;-webkit-appearance:none;background-color:transparent;width:28px;cursor:pointer;}
#header .top .right .toggle_menu:before{content:"";display:block;padding-bottom:100%;}
#header .top .right .toggle_menu span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:20px;height:2px;background-color:#ffffff;transition:all ease 0.3s;}
#header .top .right .toggle_menu span:first-child{margin-top:-8px;}
#header .top .right .toggle_menu span:last-child{margin-top:8px;}
#header .submenu{position:absolute;display:none;left:50%;top:100%;transform:translateX(-50%);padding:20px 15px;width:100%;background-color:#FFFFFF;border-top:0.5px solid #707070;border-bottom:0.5px solid #dddddd;box-shadow:0 30px 30px rgba(0,0,0,0.1);font-size:16px;font-weight:400;color:#555555;line-height:1.4;}
#header .submenu > ul{position:relative;margin:0 auto;padding:0;max-width:1000px;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;}
#header .submenu > ul > li{position:relative;padding:10px 30px 20px;flex:1;font-weight:600;}
#header .submenu > ul > li:nth-child(n+2){border-left:0.5px solid #707070;}
#header .submenu > ul > li > a{position:relative;font-size:1.2em;text-decoration:none;}
#header .submenu > ul ul{position:relative;margin:0;margin-top:20px;padding:0;list-style:none;}
#header .submenu > ul ul > li{position:relative;font-weight:400;}
#header .submenu > ul ul > li:before{content:'';display:inline-block;vertical-align:middle;width:3px;height:3px;margin-right:3px;background-color:#000;border-radius:50%;}
#header .submenu > ul ul > li:nth-child(n+2){margin-top:10px;}
#header .submenu > ul ul > li > a{position:relative;text-decoration:none;}
#header.scroll_active{background-color:#FFFFFF;border-color:#707070;}
#header.scroll_active .top .logo:before{opacity:0;}
#header.scroll_active .top .logo img{opacity:1;}
#header.scroll_active .top .menu{color:#000000;}
#header.scroll_active .top .toggle_language:before{opacity:0;}
#header.scroll_active .top .toggle_language:after{opacity:1;}
#header.scroll_active .top .toggle_menu span{background-color:#000000;}
#header.active{background-color:#FFFFFF;border-color:#707070;}
#header.active .top .logo:before{opacity:0;}
#header.active .top .logo img{opacity:1;}
#header.active .top .menu{color:#000000;}
#header.active .top .toggle_language:before{opacity:0;}
#header.active .top .toggle_language:after{opacity:1;}
#header.active .top .toggle_menu span{background-color:#000000;}
#header.menu_active{background-color:#FFFFFF;border-color:#707070;}
#header.menu_active .top .logo:before{opacity:0;}
#header.menu_active .top .logo img{opacity:1;}
#header.menu_active .top .menu{color:#000000;}
#header.menu_active .top .toggle_language:before{opacity:0;}
#header.menu_active .top .toggle_language:after{opacity:1;}
#header.menu_active .top .toggle_menu span{background-color:#000000;}
#header.menu_active .top .toggle_menu span:first-child{transform:translate(-50%,-50%) rotate(-45deg);margin-top:0;}
#header.menu_active .top .toggle_menu span:nth-child(2){display:none;}
#header.menu_active .top .toggle_menu span:last-child{transform:translate(-50%,-50%) rotate(45deg);margin-top:0;}
#header.white .top .logo:before{opacity:0;}
#header.white .top .logo img{opacity:1;}
#header.white .top .menu{color:#000000;}
#header.white .top .toggle_language:before{opacity:0;}
#header.white .top .toggle_language:after{opacity:1;}
#header.white .top .toggle_menu span{background-color:#000000;}
@media all and (max-width:1400px){
	#header .top .menu{font-size:18px;}
}
@media all and (max-width:1000px){
	#header{height:60px;}
	#header .top .logo img{height:30px;}
	#header .top .menu{position:fixed;display:none;left:0;top:60px;width:100%;max-width:100%;height:calc(100% - 60px);background-color:#ffffff;padding:20px 15px 60px;box-sizing:border-box;color:#000000;font-size:20px;overflow:auto;}
	#header .top .menu > ul{flex-direction:column;align-items:normal;justify-content:flex-start;row-gap:25px;}
	#header .top .menu > ul > li > a{border-radius:5px;padding:0 10px;height:45px;font-weight:700;transition:background-color ease 0.3s;display:flex;flex-wrap:wrap;flex-direction:row;align-items:center;}
	#header .top .menu > ul > li > a:hover{background-color:#fafafa;}
	#header .top .menu > ul > li > ul{display:block;}
	#header .top .right .toggle_menu{display:block;}
	#header .submenu{display:none !important;}
	#header.menu_active .top .menu{display:block;}
}


#content{position:relative;z-index:1;}
#content .content_header{position:relative;height:430px;background-color:#000000;box-sizing:border-box;}
#content .content_header .bg{position:absolute;z-index:0;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;max-width:1920px;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center center;}
#content .content_header .bg.products{background-image:url(../img/content_header/products.jpg);}
#content .content_header .bg.technology_service{background-image:url(../img/content_header/technology_service.jpg);}
#content .content_header .bg.community{background-image:url(../img/content_header/community.jpg);}
#content .content_header .bg.contact_us{background-image:url(../img/content_header/contact_us.jpg);}
#content .content_header .inner{position:relative;z-index:1;height:100%;display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:center;}
#content .content_header .titles{position:relative;margin-top:60px;font-size:20px;text-align:center;animation:ani_content_header_titles ease 0.7s forwards;}
#content .content_header .titles .title{position:relative;margin:0;padding:0;font-size:50px;line-height:1.4;font-weight:400;color:#ffffff;text-transform:uppercase;letter-spacing:0.06em;word-break:keep-all;}
#content .content_header .titles .description{position:relative;margin:0;padding:0;font-size:1.3em;line-height:1.4;font-weight:400;color:#ffffff;word-break:keep-all;margin-top:35px;animation:ani_content_header_titles_description ease 0.7s forwards;}
#content .content_submenu{position:relative;margin-top:85px;}
#content .content_submenu .inner{position:relative;display:flex;flex-wrap:wrap;flex-direction:row;column-gap:30px;row-gap:15px;}
#content .content_submenu .item{position:relative;padding:5px 25px;border-radius:31px;border:1px solid #007CAA;min-height:62px;min-width:280px;max-width:340px;font-size:22px;font-weight:500;color:#007CAA;line-height:1;letter-spacing:0.04em;text-align:center;text-decoration:none;box-sizing:border-box;cursor:pointer;flex-shrink:0;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;}
#content .content_submenu .item.active{background-color:#007CAA;color:#ffffff;}
#content .content_content{position:relative;min-height:200px;}
#content .content_content > .btnArea{display:none;}

@media all and (max-width:1000px){
	#content .content_header{height:400px;}
	#content .content_header .titles{font-size:18px;margin-top:30px;}
	#content .content_header .titles .title{font-size:2em;}
	#content .content_submenu{margin-top:15px;font-size:20px;}
	#content .content_submenu .inner{display:grid;grid-template-columns:repeat(2,1fr);column-gap:10px;row-gap:10px;}
	#content .content_submenu .item{min-width:0;max-width:100%;flex:1;font-size:1em;min-height:2.8em;border-radius:1.4em;padding:0 10px;}
}
@media all and (max-width:800px){
	#content .content_header{height:350px;}
	#content .content_header .titles{font-size:16px;}
	#content .content_submenu{font-size:18px;}
}
@media all and (max-width:600px){
	#content .content_header{height:300px;}
	#content .content_header .titles{font-size:14px;}
	#content .content_submenu{font-size:16px;}
}
@media all and (max-width:400px){
	#content .content_header{height:250px;}
	#content .content_header .titles{font-size:13px;}
	#content .content_submenu{font-size:14px;}
}


#footer{position:relative;}
#footer .top{position:relative;height:100px;background-color:#2A2A2A;}
#footer .top .inner{position:relative;height:100%;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;}
#footer .top .logo{position:relative;display:block;}
#footer .top .logo a{position:relative;}
#footer .top .logo img{position:relative;display:block;height:45px;}
#footer .bottom{position:relative;background-color:#EEEEEE;}
#footer .bottom .menu{position:relative;padding:40px 0;font-size:16px;font-weight:500;line-height:1.2;color:#464646;letter-spacing:0.05em;}
#footer .bottom .menu > ul{position:relative;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(7,1fr);column-gap:15px;row-gap:25px;}
#footer .bottom .menu > ul > li{position:relative;flex:1;}
#footer .bottom .menu > ul > li > a{position:relative;text-decoration:none;}
#footer .bottom .menu .submenu{position:relative;margin-top:22px;font-size:14px;font-weight:400;line-height:1.2;color:#464646;letter-spacing:0;}
#footer .bottom .menu .submenu ul{position:relative;margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:column;row-gap:20px;}
#footer .bottom .menu .submenu ul > li > a{position:relative;text-decoration:none;}
#footer .bottom .menu .social{position:relative;max-width:160px;display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;column-gap:10px;}
#footer .bottom .menu .social .item{position:relative;display:block;width:20px;background-size:100%;background-repeat:no-repeat;background-position:center center;}
#footer .bottom .menu .social .item:before{content:"";display:block;padding-bottom:100%;}
#footer .bottom .menu .social .item.instagram{background-image:url(../img/social_icon_instagram.png);}
#footer .bottom .menu .social .item.facebook{background-image:url(../img/social_icon_facebook.png);}
#footer .bottom .menu .social .item.linkedin{background-image:url(../img/social_icon_linkedin.png);}
#footer .bottom .info{position:relative;border-top:0.6px solid #B2B2B2;padding:25px 0;font-size:14px;font-weight:300;color:#4A4A4A;line-height:2;letter-spacing:0.05em;}
#footer .bottom .info ul{position:relative;margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;flex-direction:row;}
#footer .bottom .info ul li{position:relative;}
#footer .bottom .info ul li:nth-child(n+2){margin-left:30px;}
#footer .bottom .info ul li:nth-child(n+2):before{content:"";display:block;position:absolute;left:-15px;top:0.5em;height:1em;width:1px;background-color:#4A4A4A;}
#footer .bottom .info a{text-decoration:none;}
#footer .bottom .info p{position:relative;margin:0;padding:0;}

@media all and (max-width:1000px){
	#footer .top{height:60px;}
	#footer .top .logo img{height:30px;}
	#footer .bottom .menu{padding:30px 0;font-size:15px;}
	#footer .bottom .menu > ul{grid-template-columns:repeat(3,1fr);}
	#footer .bottom .menu .submenu{margin-top:10px;font-size:13px;}
	#footer .bottom .menu .submenu ul{row-gap:10px;}
	#footer .bottom .menu .social{max-width:100px;}
	#footer .bottom .info{padding:20px 0;font-size:12px;line-height:1.4;}
	#footer .bottom .info ul{flex-direction:column;row-gap:5px;}
	#footer .bottom .info ul li:nth-child(n+2){margin-left:0;}
	#footer .bottom .info ul li:nth-child(n+2):before{display:none;}
	#footer .bottom .info .copyright{margin-top:10px;}
}
@media all and (max-width:600px){
	#footer .bottom .menu > ul{grid-template-columns:repeat(2,1fr);}
}
