@import 'https://fonts.googleapis.com/css?family=Roboto:300,400,500,700';
@import 'https://fonts.googleapis.com/css?family=Lato:300,400,700';
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(/static/css/font/f.css);

body {margin:0; line-height:1; font-family:'Roboto','Malgun Gothic', 'Dotum', '돋움', sans-serif; font-size:13px; overflow-x:hidden; cursor:default;}

textarea {font-family:'Roboto','Malgun Gothic', 'Dotum', '돋움', sans-serif; font-size:13px;}

ul,ol {list-style:none; margin:0; padding:0;}

a {color:inherit; text-decoration:inherit;}

div,input {box-sizing:border-box;}

.desktop {display:none;}
.mobile {display:block;}
div.header_container.mobile{display:block;}
div.header_container.desktop {display:none;}

@media (min-width:1200px) { 
	.desktop {display:block;}
	.mobile {display:none;}
}
@media (min-width:1200px) {
	div.header_container.mobile {display:none;}
	div.header_container.desktop {display:block;}
}

@media (max-width:1200px) {
	div.header_container>div.header>div.logo img {max-height:26px !important;}
}

/* header base */
div.header_container {height:70px;position:fixed; z-index:9; top:0; left:0; right:0;}
div.header_container.mobile {height:50px;}
div.header_container>div.header {width:1200px; height:100%; position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; }
div.header_container>div.header>div {min-height:70px;}
div.header_container>div.header>div.logo {position:absolute;top:0;left:0; width:300px; background-color:#0066ff; z-index:1; padding-left:15px;}
div.header_container>div.header>div.logo img {max-height:32px; position:absolute; top:0; bottom:0; margin:auto; border:0;}

div.header_container>div.header>div.menu {width:900px; height:70px; margin-left:300px; line-height:70px; padding:0 15px 0 15px; text-align:right; background-color:white; user-select:none; -moz-user-select:none; -webkit-user-select:none; -o-user-select:none; -ms-user-select:none;}
div.header_container>div.header>div.menu::after {content:''; clear:both; display:block; height:0;}
div.header_container>div.header>div.menu>div {float:right; margin-right:24px; font-family:'Lato'; color:#005bac; font-weight:600; width:auto;}
div.header_container>div.header>div.menu>div>a {font-size:16px; padding-bottom:6px;}
div.header_container>div.header>div.menu>div>a.typeb{font-size:12px; padding:3px 6px; border:1px solid #06f;}
div.header_container>div.header>div.menu>div.current>a {border-bottom:2px solid #0066ff;}

div.header_container>div.header>div.side {position:absolute;top:0;left:-230px; padding-top:70px; width:530px; background-color:#0066ff; box-sizing:content-box; color:white; height:auto;}
div.header_container>div.header>div.side>div.content {position:relative; width:300px; margin-left:230px; white-space:nowrap; height:160px;}
div.header_container>div.header>div.side>div.content::after {content:''; width:470px;height:1px; position:absolute; right:60px; background-color:#3586ff; bottom:0;}
div.header_container>div.header>div.side>div.content>div.content_title {height:50px; position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; padding-top:20px; line-height:30px; text-align:right; padding-right:60px; text-transform:capitalize; font-size:22px; font-weight:600; letter-spacing:2px;}
div.header_container>div.header>div.side>div.content>div.content_title::before {content:'styx'; text-transform:uppercase; position:absolute; top:0; right:60px; font-size:14px; line-height:20px; font-weight:400;}

div.header_container>div.header>div.side>ul.content {margin:50px 0 50px 230px; position:relative; text-align:right; font-size:13px; line-height:16px;}
div.header_container>div.header>div.side>ul.content>li {position:relative; padding-right:60px;}

div.header_container>div.header>div.side>ul.content>li::after,
div.header_container>div.header>div.side>ul.content>li a {transition:color 0.25s ease-in-out, opacity 0.4s ease-in-out; cursor:pointer; user-select:none; -moz-user-select:none; -webkit-user-select:none; -o-user-select:none; -ms-user-select:none;}
div.header_container>div.header>div.side>ul.content>li::after {content:''; opacity:0;}
div.header_container>div.header>div.side>ul.content>li:hover::after,
div.header_container>div.header>div.side>ul.content>li.current::after {height:6px; width:28px; position:absolute; right:0; top:0; bottom:0; margin:auto; background-color:#ff713e; opacity:1;}
div.header_container>div.header>div.side>ul.content>li:hover a,
div.header_container>div.header>div.side>ul.content>li.current a {color:white;}

div.header_container>div.header>div.side>ul.content>li a {display:block; padding:5px 0; color:#8cbaff;}

div.header_container>div.header>div.side>ul.file_link {margin:30px 0 30px 230px; position:relative; text-align:right; font-size:13px; line-height:16px;}
div.header_container>div.header>div.side>ul.file_link>li {padding:0 60px 0 0; margin:6px 0px;}
div.header_container>div.header>div.side>ul.file_link>li a {padding-left:25px; text-decoration:underline; position:relative;}
div.header_container>div.header>div.side>ul.file_link>li a::before {content:''; background:url(/static/images/pdf.svg) no-repeat; position:absolute; width:25px; height:100%; left:0;}

div.header_container.mobile>div.header {width:100%; background-color:white;}
div.header_container.mobile>div.header>div {min-height:50px; width:150px;}
div.header_container.mobile>div.header>div.logo {background-color:transparent;}
div.header_container.mobile>div.header>div.menu {height:50px; margin-left:150px; width:170px; float:right;}

div.header_container.mobile>div.header>div.menu>div {float:left; line-height:50px; margin-right:0;}
div.header_container.mobile>div.header>div.menu>div:last-child {float:right; margin-right:0;}

div.header_container.mobile>div.header>div.menu>div>span {margin:0 6px;}
div.header_container.mobile>div.header>div.menu>div>span.menu_bar {font-family:'f'; font-size:28px; margin:0;}

div.header_container.mobile>div.header>div.menu a {padding:12px 0;}

div.header_container.mobile>div.header>div.side {position:relative; width:auto; left:0; padding-top:0; margin-top:50px;}
div.header_container.mobile>div.header>div.side>div.content {position:relative; width:100%; margin-left:0; white-space:nowrap; height:auto;}
div.header_container.mobile>div.header>div.side>div.content::after {content:none;}
div.header_container.mobile>div.header>div.side>div.content>div.content_title {height:50px; position:relative; top:0; bottom:0; left:0; right:0; margin:auto; padding-top:0; line-height:50px; text-align:left; padding-right:15px; text-transform:capitalize; font-size:16px; font-weight:400; letter-spacing:2px; margin-left:15px; display:inline-block; width:auto;}
div.header_container.mobile>div.header>div.side>div.content>div.content_title::before {content:''; height:1px; width:100%; top:auto; bottom:0; background-color:#8cbaff; left:0; }

div.header_container.mobile>div.header>div.side>ul.content {margin:0; position:relative; text-align:left; font-size:11px; line-height:10px; padding:15px;}
div.header_container.mobile>div.header>div.side>ul.content>li {padding-right:6px; display:inline-block;}

div.header_container.mobile>div.header>div.side>ul.content>li::after,
div.header_container.mobile>div.header>div.side>ul.content>li a {transition:color 0.25s ease-in-out, opacity 0.4s ease-in-out; cursor:pointer; user-select:none; -moz-user-select:none; -webkit-user-select:none; -o-user-select:none; -ms-user-select:none;}
div.header_container.mobile>div.header>div.side>ul.content>li::after {content:none; opacity:0;}
div.header_container.mobile>div.header>div.side>ul.content>li:hover a,
div.header_container.mobile>div.header>div.side>ul.content>li.current a {color:inherit;}

div.header_container>div.header>div.side>ul.content>li a {display:block; padding:5px 0; color:#8cbaff;}

/* header white */
div.header_container.white {background-color:white;}
div.header_container.white>div.header>div.logo {background-color:white;}
div.header_container.white>div.header>div.side {background-color:white;}

/* body base */
div.body_wrapper {min-height:300px;}

div.body_wrapper .container {width:1200px; margin:auto; padding-left:300px;}
div.body_wrapper .container>.wrapper {width:100%; padding:0 15px;}

.technology.body_wrapper>div {padding:150px 0; border-bottom:1px solid #e9e9e9;}
.technology.body_wrapper>div#wp4,
.technology.body_wrapper>div#wp5 {padding:200px 0;}

.technology.body_wrapper>div .wrapper {padding-left:180px !important;}

.technology.body_wrapper>div .wrapper>ul>li {margin-bottom:90px; color:#004787; position:relative;}
.technology.body_wrapper>div .wrapper>ul>li:last-child {margin-bottom:0;}

.technology.body_wrapper>div .wrapper>ul>li>div {padding:0 50px; margin-top:50px;}
.technology.body_wrapper>div .wrapper>ul>li>div.head {padding-left:30px; line-height:20px; position:relative; margin:0; word-break:keep-all;}
.technology.body_wrapper>div .wrapper>ul>li>div.head::before {content:''; width:17px; height:20px; background-image:url(/static/images/dingbat_head.png); background-repeat:no-repeat; background-position:center center; background-size:auto 15px; position:absolute; left:3px;}

/* footer base */
div.footer {height:70px;}
div.footer>div.container {width:1200px; margin:auto; height:50px; line-height:50px;}
div.footer>div.container::after {content:''; clear:both; display:block; height:0;}
div.footer>div.container>div {float:left;}
div.footer>div.container>div.logo {width:300px; height:100%; background-image:url(/static/images/logo_footer.png); background-size:auto 32px; background-repeat:no-repeat; background-position:15px center;}
div.footer>div.container>div.copy {position:absolute; width:auto; height:auto; line-height:20px; margin-top:45px; margin-left:15px; color:#c3c3c3;}
div.footer>div.container>div.content {width:900px; height:30px; line-height:15px; margin:20px 0;}
div.footer>div.container>div.content::after {content:''; clear:both; display:block; height:0;}
div.footer>div.container>div.content>div {padding-left:25px; position:relative; float:left; width:auto; margin-right:35px; color:#004e93;}
div.footer>div.container>div.content>div:first-child {padding-left:60px;}
div.footer>div.container>div.content>div>span{font-weight:bold; position:absolute; left:0; color:#0066ff;}

div.footer>div.container>div.content>div.icons {padding-left:40px;}
div.footer>div.container>div.content>div.icons::after {content:''; clear:both; display:block; height:0;}
div.footer>div.container>div.content>div.icons>div {float:left; width:auto; margin-right:12px;}
div.footer>div.container>div.content>div.icons>div>a {display:block; height:30px;}
div.footer>div.container>div.content>div.icons>div>a img {max-height:30px;}

div.footer>div.container>div.content>div.icons>div:last-child {margin-top:-13px;}
div.footer>div.container>div.content>div.icons>div:last-child img {height:43px; max-height:none;}

@media (max-width: 1200px) {
	div.footer {margin-top:30px;}
	div.footer>div.container {width:100%; height:auto; font-size:11px; line-height:1; padding:0 30px; letter-spacing:-0.5px; margin-top:30px;}
	div.footer>div.container>div {float:none; position:relative; color:#004787; letter-spacing:-1px;}
	div.footer>div.container>div:first-child {margin-bottom:12px;}
	div.footer>div.container>div.content {width:100%;}

	div.footer>div.container>div>div {margin-bottom:12px;}

	div.footer>div.container>div>span>div {margin-bottom:12px; color:#004787;}

	div.footer>div.container>div>span,
	div.footer>div.container>div>div>span {margin-right:12px; margin-bottom:12px; color:#0066ff;}

	div.footer>div.container>div>.icons {position:relative; top:0; bottom:0; right:0; margin:auto; height:28px; width:auto;}
	div.footer>div.container>div>.icons>div {width:20px; height:20px; display:inline-block; margin:0 6px;}
	div.footer>div.container>div>.icons>div:first-child {margin-left:0;}
	div.footer>div.container>div>.icons>div img {width:auto; height:100%;}
	div.footer>div.container>div>.icons>div:last-child {width:auto; height:28px;}
}

/* on top */
div.on_top {position:fixed; bottom:15px; right:15px; width:auto; height:auto; cursor:pointer;}
@media (max-width: 1200px) {
	div.on_top {bottom:30px; right:5px;}
}
/* side_menu (mobile) */
.side_menu {z-index: 10;width:100%;height: 100%; position:fixed; right:0; top:0; bottom:0; left:0; transform:translateX(100%); transition:transform 0.25s ease-in-out;}
.side_menu.open {transform:translateX(0);}
.side_menu>div {position:absolute; right:0; top:0; bottom:0; width:200px; height:100%; background-color:#0066ff; }

.side_menu>div .close {width:20px; height:20px; position:absolute; top:0; left:0; margin:10px; padding:10px;}
.side_menu>div .close img {width:20px;height:20px;}

.side_menu>div ul {margin-top:70px;}
.side_menu>div ul li {line-height:35px; height:35px; white-space:nowrap; text-align:right; color:white;}
.side_menu>div ul li a {display:block; padding-right:25px; font-size:18px;}

.side_menu>div .icons {height: auto;width: auto; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:flex-end; padding-right:25px; margin-top:40px;}
.side_menu>div .icons>div {width: auto; margin:0 3px;}
.side_menu>div .icons>div img {width:20px; height:20px;}

@media (max-width:1200px) {
div.header_container>div.header>div.side>ul.file_link {margin:0; position:absolute; top:15px; right:0;}
div.header_container>div.header>div.side>ul.file_link>li {padding:0 12px 0 0;}
div.header_container>div.header>div.side>ul.file_link>li a {padding-left:20px; max-width:145px; float:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left;}
div.header_container>div.header>div.side>ul.file_link>li a::before {width:17px;}
}

.sound_only {display:none;}