@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Montserrat:500,600,700,800&display=swap');

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
 }

/* Element Reset */
header, footer, section, article, nav, aside, figure, figcaption, main { display:block}
video, audio, iframe, object, embed	{ max-width:100%; }
html, body	{ min-height:100%; margin:0; padding:0; }
body, table, input, select, textarea, button{ font-family:"Noto Sans KR","돋움",Dotum,"굴림",Gulim,Helvetica,AppleGothic, sans-serif !important; font-size:14px; color:#353535;}
ul			{ margin:0; padding:0}
li			{ list-style:none}
dl,dt,dd,p	{ margin:0; padding:0;}
a:link,
a:visited	{ font-size:inherit; color:#353535; text-decoration:none;}
.png24		{ tmp:expression(setPng24(this));}


/* Common Class */
.text_left					{ text-align:left}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; }
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }
.inputRadio,
.inputCheck					{ margin:0; width:13px; height:13px;}
.inputText, .zle_input		{ border:1px solid #999; border-right-color:#ccc; border-bottom-color:#ccc; font-size:12px; padding:2px 4px 0 4px; height:14px; *margin:-1px 0;}
.engtxt						{ font-family: 'Montserrat', sans-serif;}
.color_po					{ color:#3d60b1;}


/* Table */
table						{ border-spacing:0; border:0; }
table th, table td			{ padding:0}


/* All */
.blind						{ position:absolute; display:block; width:1px; height:1px; left:-1000%; overflow:hidden; }
.skip a						{ position:absolute; display:block; width:1px; height:1px; left:-1000%; overflow:hidden; }


/* Layout */
.container					{ position:relative; width:100%; min-height:100%;}
.header						{ background:#260b42; }
.header_area h1 img			{ width:220px;}
.body						{ position:relative; width:70%; top:4vh; min-height:600px; margin-left:26%; background:#fff; box-sizing:border-box;}
.footer						{ position:relative; margin-left:41%; padding-top:40px; }


/* Language */
.lang						{ position:absolute; top:1vh; right:4%; z-index:1;}
.lang ul					{ display:inline-block; margin-right:5px;}
.lang li					{ display:inline-block; margin:0 3px;}
.lang li a					{ font-size:12px; letter-spacing:1px; font-weight:300;}
.lang img					{ display:inline-block; width:1em; vertical-align:middle;}
.lang img.mobile			{ display:none;}


/* Footer */
.footer	.top_btn			{ position:absolute; top:40%; right:7%; width:35px; height:35px; line-height:35px; text-align:center; background:#145eff; border-radius:50%; z-index:10;}
.footer	.top_btn a			{ display:block;}
.footer	.top_btn img		{ width:16px;}
.footer address				{ margin-top:3%; font-style:normal; font-size:12.5px; font-weight:300; color:#555;}
.footer address	*			{ display:inline;}
.footer address	dd			{ margin:0 10px 0 0;}
.footer address div			{ display:block;}
.footer .copyright			{ padding:5px 0 3%; font-size:12px; color:#888; font-weight:300;}
.footer .link li			{ float:left; margin:5px 10px 5px 0; font-weight:500;}





/*반응형*/
/*해상도 1366px 이상*/
@media all and (min-width : 1366px) {
	.pc				{ display:block;}
	.mobile			{ display:none;}
	.mobile900		{ display:none;}

	/* header */
	.header			{ position:absolute; width:26%; height:100%;}
	.header:after	{ content:''; position:absolute; top:0; right:-50%; width:50%; height:100%; background:#260b42; z-index:0;}
	.header_area	{ float:right; width:80%; max-width:400px; text-align:right;}
	.header_area h1	{ margin:15% 10% 50px 0; line-height:0;}

	.gnb						{ margin-bottom:150px;}
	.gnb>ul>li					{ padding:10px 0; padding-right:10%;}
	.gnb>ul>li>a				{ color:#fff; font-weight:600; font-size:35px;}
	.gnb .sub					{ display:none; position:absolute; top:0; right:-50%; width:50%; height:100%; padding:0 8%; background:rgba(44,33,56,.92); box-sizing:border-box; z-index:10;}
	.gnb .sub li				{ margin:15px 0; text-align:left;}
	.gnb .sub a					{ font-family: 'Montserrat', sans-serif; font-size:17px; font-weight:300; color:rgba(255,255,255,.7); line-height:1.4; transition:all .3s;}
	.gnb .sub a:after			{ content:''; display:block; width:0; height:1px; margin-top:5px; background:rgba(255,255,255,.5); transition:all .3s;}
	.gnb .sub a:hover			{ font-weight:600; color:#fff;}
	.gnb .sub a:hover:after		{ width:100%;}
	.gnb .m1:hover .sub			{ display:block; padding-top:223px}
	.gnb .m2:hover .sub			{ display:block; padding-top:287px}
	.gnb .m3:hover .sub			{ display:block; padding-top:350px}

	.header .banner li			{ float:right; margin:0 10% 5px 0; border-radius:10px; line-height:0; overflow:hidden; clear:both;}

}



/*해상도 1366px 이하*/
@media all and (max-width : 1366px) {
	.pc				{ display:none;}
	.mobile			{ display:block;}
	.mobile900		{ display:none;}

	.lang			{ top:15px;}
	.lang li a		{ color:#fff; line-height:1;}
	.lang img.pc		{ display:none;}
	.lang img.mobile	{ display:inline-block;}

	.header_area h1 { margin:0; padding:2%; line-height:0; }
	.header_area h1 img { width:150px;}
	.gnb button		{ position:absolute; top:50px; right:4%; width:35px; height:25px; font-size:0; background:url('/img/common/icon_menu.svg') no-repeat top right; background-size:contain; border:0; cursor:pointer; outline:0;}
	.gnb .gnb_area	{ position:absolute; top:0; left:-100%; width:80%; height:100%; padding:7% 5%; background:rgba(55,60,71,1); z-index:1000; transition:all .5s; box-shadow:0 0 10px rgba(0,0,0,.8); box-sizing:border-box;}
	.gnb.mobile_on .gnb_area { position:absolute; left:0; }
	.gnb.mobile_on button { background:url('/img/common/icon_close.svg') no-repeat top right; background-size:contain;}
	.gnb .gnb_area>li>a	  { margin-bottom:5px; color:#fff; font-size:1.5em; font-weight:800; line-height:1.8; border-bottom:1px solid rgba(255,255,255,.4)}
	.gnb .gnb_area .sub	  { margin-bottom:30px;}
	.gnb .gnb_area .sub a { color:#fff; font-size:18px; line-height:1.8;}
	.gnb .gnb_area .sub br { display:none;}
	.gnb .gnb_area>li.banner { margin-top:60px;}
	.gnb .gnb_area>li.banner>a { border-bottom:0;}
	.gnb .gnb_area>li.banner img { width:49.5%;}



	.body			{ width:100%; top:0; margin-left:0;}
	.footer			{ margin:0; padding:50px;  background:#202632; }
	.footer address { margin-top:0; color:#fff}
	.footer address dt,
	.footer address dd { font-family:'Noto Sans Kr';}
	.footer address dd a {  color:#f7f7f7; }
	.footer .copyright { padding-bottom:0; font-family:'Noto Sans Kr';}
	.footer	.top_btn { position:fixed; top:auto; bottom:5%; right:5%; box-shadow:0 0 5px #002e88}
	.footer .link				{ display:block; overflow:hidden;}
	.footer .link li a { color:#fff;}
}

/*해상도 1200px 이하*/
@media all and (max-width : 1200px) {
	body, table, input, select, textarea, button{ font-size:13px;}

}

/*해상도 900px 이하*/
@media all and (max-width : 900px) {
	.pc900			{ display:none;}
	.mobile900		{ display:block;}

	.footer			{ margin:0; padding:50px;}
}

/*해상도 600px 이하*/
@media all and (max-width : 600px) {
	body, table, input, select, textarea, button{ font-size:12.5px;}

	.lang			{ top:10px; line-height:20px;}
	.lang li a		{ letter-spacing:0;}

	.header_area h1 img { width:115px;}
	.header_area h1 { padding:4% 0 3% 5%;}
	.gnb button		{ top:40px;}
	.gnb .gnb_area>li.banner img { width:100%;}
	.gnb .gnb_area .sub a	{ font-size:15px;}

	.footer			{ padding:8% 5% 10%;}
	.footer address dd { margin:0 5px 0 0; color:#f7f7f7; font-size:0.9em;}
	.footer address dl dt { font-weight:500; font-size:0.9em;}
}