/* Noto Sans KR (korean) http://www.google.com/fonts/earlyaccess */
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 100;
    src: url(/fonts/NotoSansKR/NotoSansKR-Thin.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Thin.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    src: url(/fonts/NotoSansKR/NotoSansKR-Light.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Light.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    src: url(/fonts/NotoSansKR/NotoSansKR-Regular.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Regular.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    src: url(/fonts/NotoSansKR/NotoSansKR-Medium.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Medium.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 700;
    src: url(/fonts/NotoSansKR/NotoSansKR-Bold.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Bold.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Bold.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 900;
    src: url(/fonts/NotoSansKR/NotoSansKR-Black.woff2) format('woff2'),
        url(/fonts/NotoSansKR/NotoSansKR-Black.woff) format('woff'),
        url(/fonts/NotoSansKR/NotoSansKR-Black.otf) format('opentype');
}
@font-face {
    font-family: 'ArchitectsDaughter';
    src: url(/fonts/ArchitectsDaughter-Regular.ttf) format('opentype');
}

/* Common */
*, *:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
* {margin:0; padding: 0;text-size-adjust: none;-webkit-text-size-adjust: none;}
body {
    font-family: 'Noto Sans KR','Apple SD Gothic Neo','Apple Gothic','AppleGothic','sans-serif','dotum';
    font-size:14px;
    line-height:1.6;
    letter-spacing: -0.5px;
    word-spacing: 0px;
    margin:0 auto;
    color:#222222;
    background-color:#FFF;
}

li{list-style:none;}
form,button{border:0; vertical-align:top;}
img {border:0;
    vertical-align:bottom;
}
em, address{font-style:normal;}

a{color:#222222; text-decoration: none;outline: none;}
a:visited {color: #222222;}
a:active{color: #222222;}
a:hover{text-decoration: none;}
a.visit {}
a.visit:visited {}
a.visit:active{}
a.visit:hover{}
.strong {font-weight: 600;}
input::placeholder {color: #aaaaaa;}

.bg_blue {background-color: #0b4abb;}

/* 면편집 레이아웃 */
.din {position: relative;clear: both;overflow: hidden;width: 1280px;max-width: 100%;margin: 0 auto 35px auto;padding:0;}
.din.din100 {width: 100%;} /* 하위 영역에서 폭을 지정할 경우 */

/* 1단 */
.din.din1 {}
.din.din1 > div[data-dinnum] {width:100%;}

/* 2단 1:1 */
.din.din2-11 {}
.din.din2-11 > div[data-dinnum] {float:left;width: 50%;}

/* 2단 1:2 */
.din.din2-12 {}
.din.din2-12 > div[data-dinnum] {float:left;}
.din.din2-12 > div[data-dinnum="1"] {width: 290px;padding-right: 40px;}
.din.din2-12 > div[data-dinnum="2"] {width: calc(100% - 370px);padding-left: 40px;}

/* 2단 2:1 */
.din.din2-21 {}
.din.din2-21 > div[data-dinnum] {float:left;}
.din.din2-21 > div[data-dinnum="1"] {width: calc(100% - 320px);padding-right: 20px;}
.din.din2-21 > div[data-dinnum="2"] {display: block;float: right;width: 320px;padding-left: 20px;}
.din.din2-21 > div[data-dinnum="1"] > .din {width: 100%;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-21 > div[data-dinnum="1"] {float: left;width: calc(100% - 267px);padding-right: 20px;border: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-12 > div[data-dinnum="1"] {float: left;width: 240px;padding-right: 20px;border: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-12 > div[data-dinnum="2"] {float: right;width: calc(100% - 240px);padding-left: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din:first-child {padding-bottom: 41px;}
.din.din2-21 > div[data-dinnum="1"] > .din {padding-bottom: 45px;margin-bottom: 0 !important;}
.din.din2-21 > div[data-dinnum="1"] > .din:last-child {border-bottom: 0;padding-bottom: 0;}

/* 3단 1:1:1 */
.din.din3-111 {}
.din.din3-111 > div > div {margin-bottom:35px}
.din.din3-111 > div[data-dinnum] {float:left;}
.din.din3-111 > div[data-dinnum="1"], .din.din3-111 > div[data-dinnum="2"], .din.din3-111 > div[data-dinnum="3"] {width:31%;}
.din.din3-111 > div[data-dinnum="2"] {margin: 0 3.5%;}

/* 3단 1:2:1 */
.din.din3-121 {}
.din.din3-121 > div[data-dinnum] {float:left;}
.din.din3-121 > div[data-dinnum="1"] {width:25%;}
.din.din3-121 > div[data-dinnum="2"] {width:calc(50% - 40px);padding:0 20px;}
.din.din3-121 > div[data-dinnum="3"] {width:25%;}

div[data-dinnum] > div.din {width: 100%;}
/* //면편집 레이아웃 */

/* header -------------------------------------------- */
#header,
header {margin: 0 auto;position: relative;text-align: left;width: 100%;min-width: 1280px;margin-bottom:35px;border-bottom:0px solid #323b4d;background-color:#FFF;z-index: 10;}

/* logo */
#logo_wrap {width: 100%;position:relative;}
#logo_wrap > .inner {position:relative;margin:0px auto;width:1280px;max-width: 100%;height:100px;display: flex;justify-content: flex-start;align-items: center;}
#logo_wrap .logo {margin-right: 30px;}
#logo_wrap .logo img {max-height: 80px;}
#logo_wrap .logo .sub {display: none;}
#header.section #logo_wrap .logo,
header.section #logo_wrap .logo {top: 10px;}
#header.section #logo_wrap .logo .sub,
header.section #logo_wrap .logo .sub {display: block;margin-left: 27px;}
#header.section #logo_wrap .logo span.sub,
header.section #logo_wrap .logo span.sub {margin-left: 26px;line-height: 0.8;font-size: 29px;font-weight: 600;letter-spacing: -1px;color: #ffffff;}
#logo_wrap > .inner .banner {max-width: 380px;}

/* share */
.share {position: absolute;right: 0;top: 42px;display: flex;}
.share .icon {display: flex;justify-content: center;align-items: center;width: 34px;height: 34px;background-color: #bfbfbf;border-radius: 50%;margin-right: 5px;}
.share .icon:last-child {margin-right: 0;}

/* gnb */
#nav_wrap {position:relative;margin:0 auto;width:100%;box-shadow: 3.1px 3.9px 10px 0 rgba(230, 237, 248, 0.75);border-bottom: 1px solid #cccccc;}
#nav_wrap > .inner {position:relative;margin:0 auto;width:1280px;max-width: 100%;height: 65px;padding-bottom: 10px;display: flex;flex-direction: row;justify-content: flex-start;align-items: center;}
#nav_wrap > .inner:after {clear: both;content: "";display: block;}

/* #nav */
#nav {position: relative;float: left;width:100%;height: 100%;border-left:0px solid #ddd;}
#nav li {float: left;display: block;background: none;position:relative; z-index: 999;text-align:center;height: 100%;}
#nav .active a {color: #113576;}
#nav li a {display: block;font-size:22px;font-weight:600;line-height: 1;text-decoration: none;color: #414141;padding: 0 11px;letter-spacing: -0.5px;margin-top: 14px;}
#nav li a.font_academy {letter-spacing: 1.5px;font-size: 25px;color: #7bb134;font-family: 'ArchitectsDaughter','Noto Sans KR','Apple SD Gothic Neo','Apple Gothic','AppleGothic','sans-serif','dotum';}
#nav li a img {vertical-align: middle;padding-bottom: 3px;}
#nav li a.bars {font-size: 20px;padding-left: 8px;}
#nav li a.bars img {vertical-align: middle;padding-bottom: 5px;}
#nav li a:hover, #nav li a.hov, #nav li a.hovx {color: #0b4abb;background-color:#ffffff;}
#nav li a.hot { color: #414141;background-color:#ffffff;}
#nav ul {position: absolute; left: 0;top: 65px;display: none;padding-bottom: 3px;background-color: #ffffff;border: solid 1px #cccccc;padding: 10px;}
#nav ul li {min-width:148px;float: left;text-align: left;white-space:nowrap;padding-bottom: 10px;}
#nav ul li a {display: block;border:none; line-height: 1.6; padding: 0px 5px 0 13px;margin:2px 0;color: #414141;font-size:18px;font-weight: 500;letter-spacing: -0.5px;}
#nav ul li ul {position: relative;display: block;float: left;top: 0;border: none;padding: 0 10px;}
#nav ul li ul li {padding-bottom: 0;}
#nav ul li ul li a {font-size:14px;}
#nav ul li a:hover, #nav ul li a.hov, #nav ul li a.hovx {color: #0b4abb;padding: 0px 5px 0 13px;background-color:#FFF;border:none;}
#nav ul li a.hot {background-color: #FFF; color: #444;}

/* nav v2 */
nav {position: relative;width:100%;border-left:0px solid #ddd;display: flex;flex-direction: row;justify-content: flex-start;align-items: center;height: 50px;}
nav .active a {color: #113576;}
nav > ul {display: flex;flex-direction: row;justify-content: flex-start;align-items: center;height: 100%;position: relative;}
nav > ul > li {background: none;position:relative;height: 100%;display: flex;justify-content: center;align-items: center;z-index: 9999;}
nav > ul li a {display: block;font-size:20px;font-weight:600;line-height: 1;text-decoration: none;color: #414141;padding: 0 7px;letter-spacing: -0.5px;}
nav > ul li a.font_academy {letter-spacing: 1.5px;font-size: 23px;color: #7bb134;font-family: 'ArchitectsDaughter','Noto Sans KR','Apple SD Gothic Neo','Apple Gothic','AppleGothic','sans-serif','dotum';}
nav > ul li a img {vertical-align: middle;}
/* nav > ul li a {display: block;font-size:22px;font-weight:600;line-height: 1;text-decoration: none;color: #414141;padding: 0 11px;letter-spacing: -0.5px;} */
/* nav > ul li a.font_academy {letter-spacing: 1.5px;font-size: 25px;color: #7bb134;font-family: 'ArchitectsDaughter','Noto Sans KR','Apple SD Gothic Neo','Apple Gothic','AppleGothic','sans-serif','dotum';} */
/* nav > ul li a img {vertical-align: middle;padding-bottom: 3px;} */
nav > ul li a.bars {font-size: 20px;padding-left: 8px;}
nav > ul li a.bars img {vertical-align: middle;padding-bottom: 5px;}
nav ul li a:hover, nav ul li a.hov, nav ul li a.hovx {color: #0b4abb;background-color:#ffffff;}
nav > ul li a.hot { color: #414141;background-color:#ffffff;}
nav > ul ul {position: absolute; left: 0;top: 40px;display: none;padding-bottom: 3px;background-color: #ffffff;border: solid 1px #cccccc;padding: 10px;}
nav > ul ul li {min-width:148px;float: left;text-align: left;white-space:nowrap;padding-bottom: 10px;}
nav > ul ul li a {display: block;border:none; line-height: 1.6;color: #414141;font-size:18px;font-weight: 500;letter-spacing: -0.5px;}
nav > ul ul li ul {position: relative;display: block;float: left;top: 0;border: none;padding: 0 10px;}
nav > ul ul li ul li {padding-bottom: 0;}
nav > ul ul li ul li a {font-size:14px;}
nav > ul ul li a:hover, nav ul li a.hov, nav ul li a.hovx {color: #0b4abb;background-color:#FFF;border:none;}
nav > ul ul li a.hot {background-color: #FFF; color: #444;}

#login_wrap {position: absolute;top: 15px;right: 270px;z-index: 999;}
#login_wrap a {font-size: 14px;font-weight: 500;}
#login_wrap a::after {content: "|";color: #aaa;margin: 0 3px 0 5px;}
#login_wrap a:last-child:after {content: none;}

#search_wrap {position: absolute;width:246px;height:99%;right:0px;top:0px;z-index:999;background-color:#fff;border:0px solid #DDD;}
.search {float: right;overflow: hidden;position: relative;z-index: 2;width:100%;margin-top: 10px;}
.search form {position: relative;float:left;background: none repeat scroll 0 0 #fff;display: block;height: 40px;width:100%;}
.search .keyword {background: none repeat scroll 0 0 #fff;border: 1px solid #b2bed3;background-color: #f2f4f8;color: #444;float: left;font-size: 13px;width: 212px;height: 33px;line-height: 31px;border-radius:3px 0 0 3px;padding-left: 5px;}
.search .sbtn {float: right;right: 2px;top:0px;padding: 0 3px;position: absolute;overflow: hidden;width:33px;height:33px;font-size: 20px;cursor: pointer;background-color: #113576;border-radius: 3px 3px 3px 3px;}
.search .sbtn img {vertical-align: middle;}
/* //header -------------------------------------------- */

/* container */
#container {clear: both;display: block;padding: 0 0px;position: relative;text-align: left;width: 100%;min-width: 1280px;}

/* service_wrap */
.service_wrap {clear: both;width: 100%;background-color: #e9ecf4;}
.service_wrap .service {position: relative;margin: 0px auto;width: 1280px;max-width: 100%;height: 90px;display: flex;justify-content: space-between;align-items: center;}
.service_wrap .service .newsletter {display: flex;}
.service_wrap .service .newsletter .title {font-size: 27px;font-weight: 600;line-height: 1;margin-right: 10px;}
.service_wrap .service .newsletter ul {display: flex;}
.service_wrap .service .newsletter ul .memo {color: #666;font-size: 14px;font-weight: 400;line-height: 1;margin-right: 10px;}
.service_wrap .service .newsletter ul .memo .light {color: #aaa;font-size: 11px;font-weight: 400;line-height: 1;}
.service_wrap .service .newsletter ul .form {}
.service_wrap .service .newsletter ul .form input {width: 121px;height: 31px;border-radius: 3px;border: solid 1px #b2bed3;background-color: #f2f4f8;margin-right: 8px;padding: 0 5px;}
.service_wrap .service .newsletter ul .form input[name="email"] {width: 195px;}
.service_wrap .service .newsletter ul .form button {width: 89px;height: 33px;border-radius: 3px;background-color: #113576;color: #fff;cursor: pointer;}
.service_wrap .service .link {}
.service_wrap .service .link li {position: relative;margin-right: 20px;float: left;}
.service_wrap .service .link li a {color: #aaa;font-size: 14px;font-weight: 400;line-height: 1.8;}
.service_wrap .service .link li::after {color: #aaa;content: "|";font-size: 10px;position: absolute;top: 3px;right: -10px;}
.service_wrap .service .link li:last-child {margin-right: 0;}
.service_wrap .service .link li:last-child::after {content: none;}

/* footer -------------------------------------------- */
#footer_wrap {clear: both;width: 100%;}
#footer {position: relative;margin: 0px auto;width: 1280px;max-width: 100%;overflow: hidden;display: block;padding:40px 0px;}
#footer .link {position:relative;float: left;width: auto;}
#footer .link .copyright {font-size: 14px;font-weight: 600;}
#footer .link ul {width: 400px;}
#footer .link li {display: inline-block;color: #aaaaaa;}
#footer .link li:before {content: url("/image/pipe.png");margin: 0 10px;}
#footer .link li.first:before {content: none;}
#footer .link li a {color: #aaaaaa;font-size: 14px;}
#footer .link li.strong a {color: #666666;}
#footer .info {position:relative;float: right;width: auto;text-align: right;}
#footer .info ul {width: auto;}
#footer .info li {display: inline-block;color: #aaaaaa;letter-spacing: 0;}
#footer .info li span {margin-left: 10px;}
#footer .info li:after {content: url("/image/pipe.png");margin: 0 10px;}
#footer .info div li:last-child:after {content: none;}
#footer .info li a {color: #aaaaaa;font-size: 15px;}
#footer .info li.strong a {color: #666666;}
#footer .share {top: 130px;}

/* footer v2 */
footer {clear: both;width: 100%;min-width: 1280px;background-color: #e9ecf4;margin-top: 50px;}
footer .inner {position: relative;margin: 0px auto;width: 1280px;max-width: 100%;overflow: hidden;display: block;padding:40px 0px;}
footer .link {position:relative;float: left;width: auto;}
footer .link .copyright {font-size: 14px;font-weight: 600;}
footer .link ul {width: 400px;}
footer .link li {display: inline-block;color: #aaaaaa;}
footer .link li:before {content: url("/image/pipe.png");margin: 0 10px;}
footer .link li.first:before {content: none;}
footer .link li a {color: #aaaaaa;font-size: 14px;}
footer .link li.strong a {color: #666666;}
footer .info {position:relative;float: right;width: auto;text-align: right;}
footer .info ul {width: auto;}
footer .info li {display: inline-block;color: #aaaaaa;letter-spacing: 0;}
footer .info li span {margin-left: 10px;}
footer .info li:after {content: url("/image/pipe.png");margin: 0 10px;}
footer .info div li:last-child:after {content: none;}
footer .info li a {color: #aaaaaa;font-size: 15px;}
footer .info li.strong a {color: #666666;}
footer .share {top: 130px;}
/* //footer -------------------------------------------- */

/* popup */
.popup {min-width: 250px;}
.popup.layer {position: fixed;z-index: 10;border: 1px solid #000000;background-color: #ffffff;}
.popup button {background-color: #000000;color: #ffffff;float: right;height: 30px;padding: 3px;cursor: pointer;}
.popup .popup_footer {height: 30px;line-height: 30px;}

/* main_headline_area */
.din.din2-21.main_headline_area {width: 100%;margin-bottom: 0;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] {width: calc(((100% - 1280px) / 2) + 960px);padding-top: 0;padding-right: 0px;padding-bottom: 35px;height: 100%;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din {width: 960px;padding-right: 20px;float: right;padding: 25px 20px 25px 0px;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din:first-child {padding-top: 0;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din:last-child {padding-bottom: 0;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din.review_area {background-color: #0b4abb;width: 100%;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din.review_area > div {width: 940px !important;float: right;}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din.review_area > div > div.box .box_title .link:after {content: url('/image/more_plus_white.png');}
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din.review_area > div > div.box .name,
.din.din2-21.main_headline_area > div[data-dinnum="1"] > div.din.review_area > div > div.box .title {color: #ffffff !important;}
.din.din2-21.main_headline_area > div[data-dinnum="2"] {width: calc(((100% - 1280px) / 2) + 320px);padding-top: 0;padding-left: 20px;padding-bottom: 35px;height: 100%;}
.din.din2-21.main_headline_area > div[data-dinnum="2"] > div.box {width: 300px !important;}

/* main_headline_area_v2 */
.din.din2-21.main_headline_area_v2 {}
.din.din2-21.main_headline_area_v2 > div[data-dinnum="1"] {width: calc(100% - 300px);border-right: 1px solid #d2d2d2;}
.din.din2-21.main_headline_area_v2 > div[data-dinnum="2"] {width: 300px;}

/* main_newslist_area */
.main_newslist_area {border-top: 1px solid #d2d2d2;padding-top: 25px;}
.din.din2-21.main_newslist_area > div[data-dinnum="1"] {padding-right: 0;}

/* section - tech */
#wrap_index.section.tech #header,
#wrap_index.section.tech header {margin-bottom: 0;}
#wrap_index.section.tech .section_bg_color {background-color: #000000 !important;}
.din.din2-12.tech_headline_area {width: 100%;height: 636px;margin-bottom: 0;}
.din.din2-12.tech_headline_area > div[data-dinnum="1"] {width: calc(((100% - 1280px) / 2) + 325px);padding-top: 35px;padding-right: 35px;padding-bottom: 35px;height: 100%;}
.din.din2-12.tech_headline_area > div[data-dinnum="2"] {width: calc(((100% - 1280px) / 2) + 955px);padding-top: 35px;padding-left: 35px;padding-bottom: 35px;height: 100%;background-color: #000000 !important;}

/* section - review */
#wrap_index.section.review #header,
#wrap_index.section.review header {margin-bottom: 0;}
#wrap_index.section.review .din {margin-top: 0 !important;margin-bottom: 0 !important;padding-top: 35px !important;padding-bottom: 35px !important;}
#wrap_index.section.review .din:first-child {padding-top: 0 !important;}
#wrap_index.section.review .section_bg_color {background-color: #686868 !important;}

/* .culture_headline_area */
#wrap_index.section.culture #header,
#wrap_index.section.culture header {margin-bottom: 0;}
.din.din2-12.culture_headline_area {width: 100%;height: 636px;margin-bottom: 0;}
.din.din2-12.culture_headline_area > div[data-dinnum="1"] {width: calc(((100% - 1280px) / 2) + 325px);padding-right: 35px;padding-bottom: 35px;height: 100%;}
.din.din2-12.culture_headline_area > div[data-dinnum="2"] {width: calc(((100% - 1280px) / 2) + 920px);padding-left: 35px;padding-bottom: 35px;height: 100%;}
/* .section.culture */
#wrap_index.section.culture .din {margin-top: 0 !important;margin-bottom: 0 !important;padding-top: 35px !important;padding-bottom: 35px !important;}
#wrap_index.section.culture .font_color_white .name,
#wrap_index.section.culture .font_color_white .title {color: #ffffff;font-weight: 400;}
#wrap_index.section.culture .font_color_white .line {border-top-color: #ffffff;}

/* section - blotertv */
#wrap_index.section.blotertv .section_bg_color {padding: 35px 0;}

/* section - academy */
#wrap_index.section.academy #header,
#wrap_index.section.academy header {margin-bottom: 0;}