@charset "utf-8";

/* font */

@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: normal;
	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: bold;
	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');
}  

/* 공통 */ 

/*  레이아웃 */
body { font-family:"Noto Sans KR","Malgun Gothic","맑은 고딕","돋움", Dotum, Verdana, Arial, helvetica, sans-serif; font-size:15px; letter-spacing:-0.05em; background:#fff url(/_Img/intro2019/20190722/intro_bg.jpg) no-repeat center top; word-break:keep-all;word-wrap:break-word}
body * {line-height:100%;}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, input, textarea, p, blockquote, th, td, textfield, select{margin:0;padding:0;}
ol, ul, li, dd, dl, dt  {list-style:none;}
a {text-decoration:none;}
img{ border:0}

.intro-wrap {max-width:1000px;margin:70px auto 0;}


/*  header  */
#header-wrap { height:85px; text-align:center;}
#logo img{ vertical-align:middle;}
#header-wrap #logo .txt{ margin-left:15px; padding-left:15px; font-weight:500;; font-size:30px; line-height:1em; letter-spacing:-0.05em; color:#fff; border-left:1px solid #fff;vertical-align:middle;}


/*   mcontainer  */
#mcontainer-wrap{ overflow:hidden;}

.guide-wrap { float:left; width:360px; color:#fff; padding:50px 0 0; background:#37446D; }
.guide-wrap .tit { font-size:27px; font-weight:500; text-align:center; line-height:1.8em; padding-bottom:8px; border-bottom:0px solid #479a61;}
.guide-wrap .tit span { font-size:18px; font-weight:400; display:block;}
.guide-wrap .guide-cont {padding:30px 0 32px 30px;}
.guide-wrap dl { padding-bottom:25px;}
.guide-wrap dl .cont-tit { position:relative; color:#fec93f; font-size:18px; font-weight:500; padding-left:12px; margin-bottom:10px; }
.guide-wrap dl .cont-tit:before {position:absolute; content:""; display:block; width:4px; height:4px; top:50%; left:0; margin-top:-2px; background:#75b388; border-radius:50%}
.guide-wrap dl .cont { padding-left:12px; }
.guide-wrap dl .cont span { display:block;margin-bottom:10px;}
.guide-wrap dl .cont span .color { color:#2ee968; font-style:normal; margin-left:10px; }
.guide-wrap dl .cont span .color2 { color:#2ee968; font-style:normal; margin-left:0px; }

.cont-right {float:left;}
.quick-wrap{width:640px;}
.quick-wrap ul {overflow:hidden;}
.quick-wrap ul li { float:left; width:50%; height:234px; padding:50px 40px 0; text-align:center; box-sizing:border-box}
.quick-wrap ul li .tit { color:#fff; font-size:24px; font-weight:500; text-align:center; line-height:1.6em; margin-bottom:10px;letter-spacing:-1px}
.quick-wrap ul li .tit span { font-size:18px; font-weight:400; display:block;}
.quick-wrap ul li a { position:relative; width:220px; height:60px; background:rgba(0, 0, 0, 0.3); display:block; margin:0 auto;}
.quick-wrap ul li a:hover { color:#fff; text-decoration:underline}
.quick-wrap ul li a .txt { font-size:16px; color:#fff; line-height:60px; padding-left:30px; text-align:left; display:block;}
.quick-wrap ul li a:after { position:absolute; content:""; display:block; width:60px; height:60px; line-height:60px; top:0; right:0; background:#fff url(/_Img/intro2019/20190722/icon_arr.png) no-repeat center center;}
.quick-wrap ul li.quick01 {background:#6F80B8/*1C9690*/; }
.quick-wrap ul li.quick02 {background:#97BDE4/*5EBCAF*/; }

.notice-wrap { position:relative; width:640px; padding:30px 30px 20px;  background:#f9f9f9;  background:rgba(249, 249, 249, 0.8); box-sizing:border-box;}
.notice-wrap .tit { color:#333; font-size:21px; margin-bottom:3px;}
.notice-wrap .notice {overflow:hidden;margin-top:20px;}
.notice-wrap .notice li { position:relative; width:100%; margin-right:2%;  box-sizing:border-box; }
.notice-wrap .notice li:after{ position:absolute; content:""; display:block; width:8px; height:15px; top:50%; right:0; margin-top:-8px; background:url(/_Img/intro2019/20190722/icon_arr.png) no-repeat left top;}


.notice-wrap .notice li a{color:#444; font-size:16px; line-height: 1.2em; padding:5px 0 5px 0; margin-right:15px; display:block; }
.notice-wrap .notice li a:hover { color:#444; text-decoration:underline}
.notice-wrap a.more{ position:absolute; border-radius:25px 25px; overflow:hidden; width:40px; height:40px; right:15px; top:15px; text-align:center; font-weight:600; color:#5f5f5f; line-height:22px; font-size:22px; background:#fff url(../_Img/intro2019/20190722/more.png) no-repeat center center; display:block ;}
.notice-wrap a.more:hover:after { transform: rotate(360deg);-webkit-transform: rotate(360deg); transition: transform 1s;-webkit-transition: -webkit-transform 1s;}

.link-wrap {height:135px; background:rgba(255, 255, 255, 0.15); clear:both;}
.link-wrap ul {overflow:hidden;}
.link-wrap ul li {float:left; width:20%; padding:30px 0; text-align:center;}
//.link-wrap ul li:first-child .txt {color:#FEC941;}
.link-wrap ul li a { position:relative; color:#fff; font-weight:normal; text-decoration:none;border-right:1px solid #7b7d7d;  display:block; }
.link-wrap ul li span { display:block; }
.link-wrap ul li .ico {width:50px; height:50px; border-radius:50%; margin:0 auto 10px; background:rgba(0, 0, 0, 0.35 )}
.link-wrap ul li.last a {border-right:0;}
.link-wrap ul li:last-child a {border-right:0;}

.link-wrap ul li.li01 .ico { background:url(../_Img/intro2019/20190722/icon_link01.png) no-repeat center center;}
.link-wrap ul li.li02 .ico { background:url(../_Img/intro2019/20190722/icon_link02.png) no-repeat center center;}
.link-wrap ul li.li03 .ico { background:url(../_Img/intro2019/20190722/icon_link03.png) no-repeat center center;}
.link-wrap ul li.li04 .ico { background:url(../_Img/intro2019/20190722/icon_link04.png) no-repeat center center;}
.link-wrap ul li.last .ico { background:url(../_Img/intro2019/20190722/icon_link05.png) no-repeat center center;}

.link-wrap ul li:first-child .ico, .link-wrap ul li.li01 .ico { background:rgba(0, 0, 0, 0.35 ) url(../_Img/intro2019/20190722/icon_link01.png) no-repeat center center;}
.link-wrap ul li:nth-child(2) .ico, .link-wrap ul li.li02 .ico { background:rgba(0, 0, 0, 0.35 ) url(../_Img/intro2019/20190722/icon_link02.png) no-repeat center center;}
.link-wrap ul li:nth-child(3) .ico, .link-wrap ul li.li03 .ico { background:rgba(0, 0, 0, 0.35 ) url(../_Img/intro2019/20190722/icon_link03.png) no-repeat center center;}
.link-wrap ul li:nth-child(4) .ico, .link-wrap ul li.li04 .ico { background:rgba(0, 0, 0, 0.35 ) url(../_Img/intro2019/20190722/icon_link04.png) no-repeat center center;}
.link-wrap ul li:last-child .ico, .link-wrap ul li.last .ico { background:rgba(0, 0, 0, 0.35 ) url(../_Img/intro2019/20190722/icon_link05.png) no-repeat center center;}

.link-wrap ul li a:hover .txt {text-decoration:underline; color:#FEC941;}


/*  footer  */
#footer-wrap{ position:relative ; margin-top:40px; font-size:14px; color:#c0c1c0; overflow:hidden; }

#footer-wrap .num-info{ float:left; width:50%;overflow:hidden;}
#footer-wrap .num-info li{ float:left; padding-right:15px; line-height:120%; padding-left:22px; letter-spacing:0}
#footer-wrap .num-info li.nu-01{background:url(../_Img/intro/tel-icon.png) no-repeat 0 0px;}
#footer-wrap .num-info li.nu-02{background:url(../_Img/intro/fax-icon.png) no-repeat 0 0px; }

#footer-wrap .add { float:left; width:50%; }
#footer-wrap .add address { text-align:right; font-style:normal;line-height:150%}
#footer-wrap .add .copy{ color:#888; font-size:12px; letter-spacing:-0.02em; text-align:right;line-height:150%; }


@media all and (max-width:999px){
	.intro-wrap {margin-top:40px;}
	.guide-wrap {width:50%;}
	.cont-right { width:50%;}
	.quick-wrap { width:100%;}
	.quick-wrap ul li {width:100%; text-align:left; padding:29px 20px 28px 30px; height:auto; overflow:hidden}
	.quick-wrap ul li .tit { float:left; line-height:1.2em; margin-bottom:0; text-align:left;}
	.quick-wrap ul li a { float:right; width:50px; border-radius:50% }
	.quick-wrap ul li a .txt {display:none;}
	.quick-wrap ul li a:after {border-radius:50%}
	.notice-wrap { width:100%; }
	.notice-wrap .notice li { width:100%; height:auto; margin:0;}
	.notice-wrap .notice li a { padding:5px 0 ;}
	#footer-wrap { margin-top:20px; padding-bottom:25px;}
	#footer-wrap .num-info {font-size:13px;}	
}
@media all and (max-width:860px){
	body {background-size: cover;}
	.intro-wrap {margin-top:30px;}
	.guide-wrap {float:none;width:100%; padding-top:20px}
	.guide-wrap .tit { font-size:25px; line-height:1.3em;}
	.guide-wrap .guide-cont {padding-bottom:0}
	.guide-wrap dl {padding-bottom:20px;}
	.cont-right {float:none;width:100%;}
	.quick-wrap ul li .tit { font-size:25px;}
	.quick-wrap ul li { padding-bottom:25px}
	.quick-wrap ul li a { width:45px; height:45px;}
	.quick-wrap ul li a:after { width:45px; height:45px;}
	.notice-wrap { padding-bottom:20px;}
	#footer-wrap .num-info { width:39%; margin-left:1% }
	#footer-wrap .num-info li {float:none; width:100%; padding-right:0; margin-bottom:3px;}
	#footer-wrap .add { width:59%; margin-right:1%; font-size:13px}
}
@media all and (max-width:640px){
	#header-wrap #logo .txt {font-size:24px}
	.link-wrap ul li .txt {font-size:13px}
	#footer-wrap .num-info { width:45%; margin-left:1% }
	#footer-wrap .num-info li {float:none; width:100%; padding-right:0; margin-bottom:3px;}
	#footer-wrap .add { width:53%; margin-right:1%; font-size:13px}
}
@media all and (max-width:480px){
	.intro-wrap {margin-top:20px}
	#header-wrap {height:65px;}
	#header-wrap #logo img {width:30%;}
	#header-wrap #logo .txt {font-size:22px}
	.guide-wrap .guide-cont {padding-left:15px}
	.guide-wrap .tit { font-size:23px;}
	.guide-wrap .tit span {font-size:16px;}
	.quick-wrap ul li { padding:20px 15px 20px 15px}
	.quick-wrap ul li .tit {font-size:23px}
	.quick-wrap ul li .tit span {font-size:16px;}
	.link-wrap {height:auto; padding:10px 0 30px}
	.link-wrap ul li { width:33%;padding:20px 0 0}
	.link-wrap ul li .ico {display:none;}
	.notice-wrap {padding-left:15px; padding-right:15px;}
	.notice-wrap .notice li { letter-spacing:-1.5px;}
	#footer-wrap .num-info { width:98%; margin-right:1%}
	#footer-wrap .num-info li {padding-left:0}
	#footer-wrap .num-info li.nu-01, #footer-wrap .num-info li.nu-02 {width:100%; text-align:center; background:none;}
	#footer-wrap .add {width:98%; margin-left:1%; }
	#footer-wrap .add address {text-align:center;}
	#footer-wrap .add .copy {text-align:center;}
}
@media all and (max-width:375px){
	.intro-wrap {margin-top:15px}
	.notice-wrap .notice li a {font-size:14px; letter-spacing:-1.5px;}
	#header-wrap {height:65px;}
	#header-wrap #logo .txt {margin-left: 10px;  padding-left: 10px;}
	#logo img {width: 45%;}
}