@charset "utf-8";

@font-face { /* 나눔스퀘어 */
font-family: NanumSquareWeb;
src: local(NanumSquareR),
    local(NanumSquare),
    url(../webfonts/NanumSquareR.eot) format('embedded-opentype'),
    url(../webfonts/NanumSquareR.woff) format('woff'),
    url(../webfonts/NanumSquareR.ttf) format('truetype');
font-style: normal;
font-weight: normal;
unicode-range: U+0-10FFFF;
}

@font-face { /* 나눔스퀘어볼드 */
font-family: NanumSquareWeb;
src: local(NanumSquareB),
    url(../webfonts/NanumSquareB.woff) format('woff'),
    url(../webfonts/NanumSquareB.ttf) format('truetype');
font-weight: 700;
}

@font-face { /* 나눔고딕 */
font-family: NanumGothicWeb;
src: local(NanumGothic),
    local(NanumGothic),
    url(../webfonts/NanumGothic.eot) format('embedded-opentype'),
    url(../webfonts/NanumGothic.woff) format('woff'),
    url(../webfonts/NanumGothic.ttf) format('truetype');
font-style: normal;
font-weight: normal;
unicode-range: U+0-10FFFF;
}

@font-face { /* 나눔고딕볼드 */
font-family: NanumGothicWeb;
src: local(NanumGothicBold),
    url(../webfonts/NanumGothicBold.woff) format('woff'),
    url(../webfonts/NanumGothicBold.ttf) format('truetype');
font-weight: 700;
}

html {overflow-y: scroll;}

html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, a, em, img, q, strong, sub, sup, b, u, i, center, dl, dt, dd, ol, ul, li,
form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, footer, header, menu, nav, section {
margin: 0;
padding: 0;
}

article, footer, header, menu, nav, section {display: block;}

body, table, th, td, button, select, input, textarea {
font-family: NanumGothicWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 15px;
color: #303030;
-webkit-text-size-adjust: none;
}

body {
line-height: 1;
background-color: #fff;
}

h1, h2, h3, h4, h5, h6 {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-weight: 700;
letter-spacing: 0;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
color: inherit;
text-decoration: none;
}
		
ol, ul {list-style: none;}

img {
border: 0;
vertical-align: middle;
}

table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
box-sizing: border-box;
}
			
button {
margin: 0px;
padding: 0px;
cursor: pointer;
border: 0px;
background: none;
text-transform: none;
line-height: normal;
}
						
em, var {
font-style: normal;
font-weight: normal;
}
						
a {
color: #303030;
text-decoration: none;
outline: none;
}
a:active, a:hover, a:focus {text-decoration: none;}
a:hover {color: #4a9fff;}

.clearfix {*zoom: 1;}

.clearfix:after {
clear: both; 
display: block; 
content: "";
}

*, *:before, *:after {box-sizing: inherit;}

/* Basic */
ul.dot-1 {display: inline-block;}

ul.dot-1 li {
background: url("../images/dot_01.png") no-repeat 0 10px;
padding-left: 15px;
}

ul.dot-1L li {
background: url("../images/dot_01.png") no-repeat 0 10px;
padding-left: 15px;
margin-bottom: 5px;
background-color: #f1ffbb;
}

ul.dot-1M li {
background: url("../images/dot_01.png") no-repeat 0 10px;
padding-left: 15px;
margin: 15px 0;
}

ul.dot-2 li {
background: url("../images/dot_03.png") no-repeat 0 10px;
padding-left: 15px;
}

.margin-top100 {margin-top: 100px;}
.margin-top70 {margin-top: 70px;}
.margin-top60 {margin-top: 60px;}
.margin-top50 {margin-top: 50px;}
.margin-top40 {margin-top: 40px;}
.margin-top30 {margin-top: 30px;}
.margin-top25 {margin-top: 25px;}
.margin-top20 {margin-top: 20px;}
.margin-top10 {margin-top: 10px;}

@media all and (max-width:800px) {
	.margin-top70 {margin-top: 50px;}
}

@media all and (max-width:480px) {
	ul.dot-1 li {background: url("../images/dot_02.png") no-repeat 0 9px; padding-left: 13px;}
	
	.margin-top30 {margin-top: 20px;}
}

@media all and (max-width:350px) {
	.margin-top70 {margin-top: 40px;}
	.margin-top30 {margin-top: 15px;}
}

/* Text & Highlight */
.font-sbS1 {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 40px;
font-weight: 700;
}

.font-sbS2 {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 25px;
font-weight: 700;
}

.font-sbB {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 22px;
font-weight: 700;
}

.font-sbM {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 17px;
font-weight: 700;
}

.font-sbH {
font-family: NanumSquareWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 17px;
font-weight: 700;
}

.font-sbR {
font-family: NanumGothicWeb,"돋움", Dotum, Arial, sans-serif;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 5px;
opacity: 0.7;
}

.font-color1 {color: #fff;}
.font-color2 {color: #131c32;}
.font-color3 {color: #00549e;}
.font-color4 {color: #678dc9;}
.font-color5 {color: #8c734a;}
.font-color6 {color: #c52a03;}

.highlight-1 {background: #f8f8f8;}
.highlight-2 {background: #fef5ed;}
.highlight-3 {background: #f2fedf;}
.highlight-4 {background: #f1ffbb;}

.text-alignR {text-align: right;}
.text-alignC {text-align: center;}

@media all and (max-width:800px) {
	.font-sbS1 {font-size: 35px;}
}

@media all and (max-width:480px) {
	.font-sbS1 {font-size: 30px;}
	.font-sbS2 {font-size: 22px;}
	.font-sbB {font-size: 18px;}
	.font-sbH {font-family: NanumGothicWeb,"돋움", Dotum, Arial, sans-serif; font-size: 14px; line-height: 2;}
}

@media all and (max-width:350px) {
	.font-sbS1 {font-size: 27px;}
	.font-sbS2 {font-size: 18px;}
	.font-sbB {font-size: 16px;}
	.font-sbH {font-size: 13px;}
}

/* Border */
.border-rw1 {border-right: 1px solid rgba(255, 255, 255, 0.15);}
.border-rw1:last-child {border: 0;}

.border-rg1 {border-right: 1px solid #e5e5e5;}
.border-rg1:last-child {border: 0;}

/* Box */
.box-area-b1 {background-color: #00549e;}
.box-area-g1 {background-color: #f5f5f5;}
.box-area-w1 {background-color: #fff;}
.box-area-s1 {border: 1px solid rgba(255, 255, 255, 0.15);}
.box-area-s2 {border: 1px solid #e5e5e5;}

/* Table */
.table-type1 {
border-top: 2px solid #678dc9;
border-bottom: 1px solid #e5e5e5;
word-break: keep-all;
}

.table-type1 table th {
width: 30%;
padding: 15px 20px; 
background: #f8f8f8; 
border-bottom: 1px solid #e5e5e5;
}

.table-type1 table td {
width: 70%;
padding: 15px 50px; 
border-bottom: 1px solid #e5e5e5; 
}

@media all and (max-width:800px) {
	.table-type1 table th {width:100%; padding:10px 20px; display:block;}
	.table-type1 table td {width:100%; padding:10px 20px; font-size:14px; text-align: center; display:block;}
}

@media all and (max-width:480px) {
	.table-type1 table th {font-size: 13px;}
	.table-type1 table td {padding:10px 0; font-size:13px;}
}

@media all and (max-width:350px) {
	.table-type1 table th {padding:7px 10px;}
	.table-type1 table td {padding:7px 0; font-size:12px;}
}

/* Row */
.row {
display: flex;
flex-wrap: wrap;
align-items: stretch;
box-sizing: border-box;
}

.row-column1 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

.row > * {box-sizing: border-box;}

.row.aln-left {justify-content: flex-start;}
.row.aln-center {justify-content: center;}
.row.aln-right {justify-content: flex-end;}
.row.aln-top {align-items: flex-start;}
.row.aln-middle {align-items: center;}
.row.aln-bottom {align-items: flex-end;}

.row > .col-1 {width: 100%;}
.row > .col-2 {width: 50%;}
.row > .col-3 {width: 33.33333%;}

/* Icon */
.bigdata-ml {
display: block;
background: url("../images/icon_bigdata-ml.png") no-repeat 50% 50%;
content: '';
}

.system-ig {
display: block;
background: url("../images/icon_system-ig.png") no-repeat 50% 50%;
content: '';
}

.it-os {
display: block;
background: url("../images/icon_it-os.png") no-repeat 50% 50%;
content: '';
}

.system-ct {
display: block;
background: url("../images/icon_system-ct.png") no-repeat 50% 50%;
content: '';
}

/* Button */
input[type="button"], button, .button {
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
-ms-appearance: none;
appearance: none;
position: relative;
display: inline-block;
text-decoration: none;
outline: 0;
cursor: pointer;
overflow: hidden;
}

input[type="button"]:hover, button:hover, .button:hover {
background-color: #00549e;
color: #fff;
}

input[type="button"]:active, button:active, .button:active {background-color: #00549e;}

.button-rw {
display: inline-block;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.5);
border-radius: 100px;
padding: 12px 35px;
}

.button-rw:hover {color: #fff;}

.button-rw2 {
display: inline-block;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.5);
border-radius: 100px;
padding: 12px 35px;
}

.button-rw2:hover, .button-rw2:active {
background-color: rgba(255, 255, 255, 0.1); 
color: #fff;
}