@charset "utf-8";
/* 웹폰트 */
@font-face {
    font-family: 'NotoSans-DemiLight';
    src: url('/webfont/NotoSans-DemiLight.eot');
    src: url('/webfont/NotoSans-DemiLight.eot?iefix') format('eot'),
         url('/webfont/NotoSans-DemiLight.woff') format('woff')
}

@font-face {
    font-family: 'NotoSans-Regular';
    src: url('/webfont/NotoSans-Regular.eot');
    src: url('/webfont/NotoSans-Regular.eot?iefix') format('eot'),
         url('/webfont/NotoSans-Regular.woff') format('woff')
}

@font-face {
    font-family: 'NanumGothic';
    src: url('/webfont/NanumGothic.eot');
    src: url('/webfont/NanumGothic.eot?iefix') format('eot'),
         url('/webfont/NanumGothic.woff') format('woff')
}

@font-face {
    font-family: 'NanumGothicBold';
    src: url('/webfont/NanumGothicBold.eot');
    src: url('/webfont/NanumGothicBold.eot?iefix') format('eot'),
         url('/webfont/NanumGothicBold.woff') format('woff')
}

@font-face {
    font-family: 'NanumSquareL';
    src: url('/webfont/NanumSquareL.eot');
    src: url('/webfont/NanumSquareL.eot?iefix') format('eot'),
         url('/webfont/NanumSquareL.woff') format('woff')
}

@font-face {
    font-family: 'NanumSquareR';
    src: url('/webfont/NanumSquareR.eot');
    src: url('/webfont/NanumSquareR.eot?iefix') format('eot'),
         url('/webfont/NanumSquareR.woff') format('woff')
}

@font-face {
    font-family: 'NanumSquareB';
    src: url('/webfont/NanumSquareB.eot');
    src: url('/webfont/NanumSquareB.eot?iefix') format('eot'),
         url('/webfont/NanumSquareB.woff') format('woff')
}

@font-face {
    font-family: 'NanumBarunGothic';
    src: url('/webfont/NanumBarunGothic.eot');
    src: url('/webfont/NanumBarunGothic.eot?iefix') format('eot'),
         url('/webfont/NanumBarunGothic.woff') format('woff')
}

@font-face {
    font-family: 'NanumBarunGothicBold';
    src: url('/webfont/NanumBarunGothicBold.eot');
    src: url('/webfont/NanumBarunGothicBold.eot?iefix') format('eot'),
         url('/webfont/NanumBarunGothicBold.woff') format('woff')
}

@font-face {
    font-family: 'NanumMyeongjoExtraBold';
    src: url('/webfont/NanumMyeongjoExtraBold.eot');
    src: url('/webfont/NanumMyeongjoExtraBold.eot?iefix') format('eot'),
         url('/webfont/NanumMyeongjoExtraBold.woff') format('woff')
}


*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

article, aside, figcaption, figure, footer, header, hgroup, nav, section {display: block;}
mark {background: #FF0; color: #000}

body{font-family: 'NotoSans-Regular', sans-serif;}
body, input, textarea, select, button, table, h1, h2, h3, h4, h5{font-size:14px; line-height:1.286em;font-family: 'NotoSans-Regular', sans-serif;}

/* reset */
* { margin:0; padding:0;}
h1, h2, h3, h4, h5, h6 { font-weight:Normal; font-family: 'NotoSans-Regular', sans-serif; }
ol, ul { list-style:none; }
hr {display:none;}
a {color:inherit;}
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; }
table { border-collapse:collapse; border-spacing:0; width:100%; }
th { font-weight:Normal; font-family: 'NotoSans-Regular', sans-serif; }
button { margin:0; padding:0; border:0; font:inherit; color:inherit; background:transparent; overflow:visible; cursor:pointer; line-height:1; }
button::-moz-focus-inner { margin: -1px; padding: 0; }
a:link, a:visited, a:hover, a:active, a:focus { text-decoration:none; color:inherit; cursor:pointer; }
em, i, address {font-style:normal; font-weight:normal;}
.hid, .blind, legend, hr, caption { overflow:hidden; position:absolute; left:-999em; width:0; height:0; font-size:0; line-height:0}
p {line-height:1em;font-family: 'NotoSans-Regular', sans-serif;}
.blind {visibility:hidden; overflow:hidden; width:0; height:0; line-height:0; text-indent:-9999em; position:absolute; left:-999px}
textarea { resize:vertical; font:inherit; overflow-y:auto; }
input, select { color:inherit; font:inherit; line-height:100%; }
img, fieldset,input[type="image"] {border:0;}
img, select, input, button { vertical-align:middle; }
figcaption { display:none; }
input { margin:0; padding:0; font-family:Dotum; font-size:inherit; color:#333; line-height:19px; vertical-align:middle; -webkit-border-radius:0; }
input[type="text"], input[type="password"] { height:19px; line-height:19px; padding:3px 0 0 7px; border:1px solid #dfdfdf; border-left-color:#bcbcbc; border-top-color:#bcbcbc; -webkit-appearance:none; }
input.tR { padding-left:0 !important; padding-right:7px !important; }
input[type="password"] { height:21px; padding-top:0px; line-height:21px; }
input[type="radio"] { width:13px; height:13px; vertical-align:-1px; *vertical-align:middle;}
input[type="checkbox"] { width:13px; height:13px; vertical-align:-2px; *vertical-align:middle;}
input:checked[type="checkbox"]{ background-color:#fff; -webkit-appearance:checkbox; }
input[readOnly="readOnly"],input.readOnly,input[readOnly] { background-color:#e2e2e2 !important; }
select { padding:1px 1px 1px 0; height:23px; *height:23px; font-size:1em; color:#333; line-height:23px; *line-height:23px; vertical-align:middle; font-family:Dotum;*margin-top:1px; }
input, select, button{vertical-align:middle;}
a:link, a:visited, a:hover, a:active, a:focus {color:inherit;font-family: 'NotoSans-Regular', sans-serif;}
strong {font-family: 'NotoSans-Regular', sans-serif;}

.fL {float:left;}
.fR {float:right;}
.cboth {display:block; content:""; clear:both;}
.tR {text-align:right !important;}
.tL {text-align:left !important;}
.tC {text-align:center !important;}
.colblue {color:#0054a6 !important;}
.colred {color:#e60013 !important;}
.colorange {color:#f26522 !important;}
.colgreen {color:#f26522 !important;}
.underline {text-decoration:underline;}
.inblk {display:inline-block;}

body{ background:#f7f9fc}



#intro_wrap{ text-align:center; font-family: 'NotoSans-Regular', sans-serif;min-width:1020px; }

#intro_wrap .top{ position:relative;  background:#008499; width:100%; clear:both; z-index:9}
#intro_wrap .content{ position:relative; width:100%; clear:both; background:url("/img/cont_bg.png") no-repeat 50% 0; margin-top:-30px; z-index:99; padding:90px 0;}
#intro_wrap .bottom{ position:relative; width:100%; clear:both; background:url("/img/bot_bg.png") repeat-y 50% 0; z-index:999; padding:70px 0 100px}

#intro_wrap .top p{ background:url("/images/template/00007/intro/ci.png") no-repeat 50% -25px; padding:75px 0 90px; color:#fff; font-size:24px; line-height:1.5; letter-spacing:-0.5px; width:90%; margin:0 auto;}
#intro_wrap .top p strong{font-family: 'NotoSans-Regular', sans-serif;}
#intro_wrap .top p strong.col_01{ color:#c2ff6a; }
#intro_wrap .top p strong.col_02{ color:#00ffff; }

#intro_wrap .content .intro_link{ width:960px; margin:0 auto; overflow:hidden;}
#intro_wrap .content .intro_link ul{ width:100%;display:block;text-align:justify;}
#intro_wrap .content .intro_link ul:after{ content:""; width:100%; display:inline-block;}
#intro_wrap .content .intro_link li{ width:30%; display:inline-block; text-align:center;}
#intro_wrap .content .intro_link li h2{ padding:165px 0 20px; font-size:17px; background-position:50% 0; background-repeat:no-repeat;}
#intro_wrap .content .intro_link li.link01 h2{ background-image:url("/img/link01.png");}
#intro_wrap .content .intro_link li.link02 h2{ background-image:url("/img/link02.png");}
#intro_wrap .content .intro_link li.link03 h2{ background-image:url("/img/link03.png");}
#intro_wrap .content .intro_link li.link04 h2{ background-image:url("/img/link04.png");}
#intro_wrap .content .intro_link li.link05 h2{ background-image:url("/img/link05.png");}
#intro_wrap .content .intro_link li span.btn_go{ background-color:#999ea7; padding:3px 30px; border-radius:7px; display:inline-block; color:#fff; font-size:12px; -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);}
#intro_wrap .content .intro_link li a:hover span.btn_go{ background-color:#008499;}

#intro_wrap .bottom a.btn_go_hp{ display:inline-block; background-color:#007cc9; padding:17px 120px; border-radius:10px; color:#fff; font-size:18px; -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); margin:0 auto;}
#intro_wrap .bottom a.btn_go_hp:hover{ text-decoration:underline;}
#intro_wrap .bottom p.copy{ margin:30px auto 0; width:90%; font-size:13px; line-height:1.3;}

@media screen and (max-width:800px) {
	#intro_wrap{ min-width:300px; width:100% }
	#intro_wrap .content{ padding:70px 0 30px;}
	#intro_wrap .content .intro_link{ width:100%;}

	#intro_wrap .content .intro_link li{ width:30%; float:none; display:inline-table; margin-bottom:40px; }
}

@media screen and (max-width:690px) {
	#intro_wrap .bottom{ padding:40px 0; }
	#intro_wrap .top p{  padding:60px 0 90px; font-size:20px;}
	#intro_wrap .bottom a.btn_go_hp{ display:block; padding:17px 0; width:90%; }
	#intro_wrap .content .intro_link li h2{ padding:135px 0 10px; background-size:120px 121px;}
}

@media screen and (max-width:480px) {
	#intro_wrap .content{ padding:50px 0 10px;}
	#intro_wrap .top p { font-size:17px;}
	#intro_wrap .top p br{ display:none; }
	#intro_wrap .content .intro_link li{ width:45%;}
}

#intro_wrap2{text-align: center;font-family:'NanumGothic';min-width: 1020px;background: url(/img/cont_bg2.jpg) no-repeat;width: 100%;height: 100vh;background-size: cover;}
#intro_wrap2 .top{ position:relative;  width:100%; clear:both; z-index:9}
#intro_wrap2 .content{position: relative;width: 100%;clear: both;background: url(/img/icon_bg.png) no-repeat 50% 0;/* margin-top: 20px; */z-index: 99;padding: 20px 0;}
#intro_wrap2 .bottom{ position:relative; width:100%; clear:both; /*background:url("/img/bot_bg.png") repeat-y 50% 0;*/ z-index:999; padding:50px 0;}
#intro_wrap2 .bottom .btn_wrap {margin-top:30px;}
#intro_wrap2 .bottom .btn_wrap .btn {background:rgb(40,111,113,0.8); color:#fff; padding:5px 20px; border-radius:20px;}

#intro_wrap2 .top img { margin-top: 3%;}
#intro_wrap2 .top p{  color:#fff; font-size:22px; font-weight: 500;  line-height: 30px;}
#intro_wrap2 .top p strong{ font-family:'500';}
#intro_wrap2 .top p strong.col_01{ color:#ffc747; }

#intro_wrap2 .content .intro_link{width:1300px;margin:0 auto;position: relative;}
#intro_wrap2 .content .intro_link ul{ width:100%;display:block;padding-top:10px}
#intro_wrap2 .content .intro_link ul:after{ content:""; width:100%; display:inline-block;}
#intro_wrap2 .content .intro_link li {background:#fff;border:5px solid #fff;width:17%;height:17vw;max-height:221px;border-radius:100%;text-align:center;font-size:12px;color:#000;vertical-align:middle;line-height:100px;display:inline-block;margin:10px 10px 0px;position:relative;}
#intro_wrap2 .content .intro_link li .more {display:block;position:absolute;top: -17px;right: -11px;background:#ffc747;border-radius:50%;color:#fff;line-height: 19px;padding: 19px 15px;font-size: 14px;width: 75px;height: 75px;font-weight: 700;text-align: center;}
#intro_wrap2 .content .intro_link li img {}
#intro_wrap2 .content .intro_link li h2{  font-weight: 600; font-size: 20px; line-height: 30px; letter-spacing: -3px}
#intro_wrap2 .content .intro_link li:hover { border: 5px solid #ffc747;}

/* 수정 */
#intro_wrap2 .content .intro_link li > a {display:flex;width:100%;height:100%;align-items:center;justify-content:center}
#intro_wrap2 .content .intro_link li h2 span {color:#e8180c}
#intro_wrap2 .content .intro_link li p {padding:10px 20px 0;font-size:1.167em;line-height:1.5;word-break:keep-all}
#intro_wrap2 .content .intro_link li.special {width:20%;height:20vw;max-height:260px;background:#ffc747;color:#333}
#intro_wrap2 .content .intro_link li.special h2 {font-size:2.167em;line-height:1.3;color:#203f7d}



#intro_wrap2 .bottom a.btn_go_hp{ display: inline-block; background-color: rgba( 255, 255, 255, 0.2 ); padding: 17px 100px;  border-radius: 40px; color: #fff;  font-weight: 600; font-size: 20px; margin:0 auto;}
#intro_wrap2 .bottom a.btn_go_hp:hover {color: #06434a; font-weight: 600; background-color: #ffffff;}
#intro_wrap2 .bottom p.copy{ margin:30px auto 0; width:90%; font-size:13px; line-height:1.3; color: #fff;}
#intro_wrap2 .top_mobile {display:none;}

.pop_open{background: #fff;padding: 10px 20px;font-size: 20px;font-weight: 500;margin: 20px 10px;display: inline-block;border-radius: 20px;border: 5px solid #fff;}
.pop_open:hover{border:5px solid #ffc747;color: #000;}
#popup{top: -25px;right: calc(50% - 325px);width: 100%;max-width: 650px;}
#popup .close{background:#fff;padding:2px 6px;}

.pop_open_m{background: #fff;padding: 10px 20px;font-size: 16px;font-weight: 500;margin: 20px auto;display: inline-block;border-radius: 20px;border: 5px solid #fff;}
.pop_open_m:hover{border:5px solid #ffc747;color: #000;}
#popup_m{top: 90px;right: calc(50% - 325px);width: 100%;max-width: 650px;}
#popup_m .close_m{background:#fff;padding:2px 6px;}

.site_open{background: #fff;padding: 10px 20px;font-size: 20px;font-weight: 500;margin: 20px 10px;display: inline-block;border-radius: 20px;border: 5px solid #fff;}
.site_open:hover{border:5px solid #ffc747;color: #000;}


@media screen and (max-width:1300px) {
	#intro_wrap2{height:auto;}
	#intro_wrap2 .content .intro_link {width: 100%;}
	#intro_wrap2 .content .intro_link ul {width: 100%; margin: 0 auto;}
}

@media screen and (max-width:1000px) {
	#intro_wrap2 {min-width: 0;}
	#intro_wrap2 .content {background-size:100% 100%;}
	#intro_wrap2 .content .intro_link ul {width: 100%;}
	#intro_wrap2 .content .intro_link li, #intro_wrap2 .content .intro_link li.special {width:25%;height:25vw;max-height:none;margin:20px}
	#intro_wrap2 .content .intro_link li p {padding:10px 15px 0}
}

@media screen and (max-width:800px) {
	#intro_wrap2 .bottom a.btn_go_hp{background-color: rgb(40,111,113,0.8);}
    #intro_wrap2 .content .intro_link li {width:38%;max-width:240px;height:38vw;max-height:240px;margin:20px 10px}
	#intro_wrap2 .content .intro_link li.special {width:48%;max-width:240px;height:48vw;max-height:240px;margin:10px 25%}

	#popup_m{right:5%;width:90%;}
}

@media screen and (max-width:500px) {
	#intro_wrap2 .top img { width: 100%;}
	#intro_wrap2 .top {display:none;}

	#intro_wrap2 .top_mobile {display:block; position:relative;  width:100%; clear:both; z-index:9;}
	#intro_wrap2 .top_mobile img { margin-top: 3%; width:100%;}
	#intro_wrap2 .top_mobile p{ color:#fff; font-size:19px; font-weight: 500;  line-height: 30px; padding:20px;}
	#intro_wrap2 .top_mobile p strong{ font-family:'500';}
	#intro_wrap2 .top_mobile p strong.col_01{ color:#ffc747; }
	#intro_wrap2 .bottom a.btn_go_hp {font-size:17px; padding:17px 80px;}
	#intro_wrap2 .bottom a.btn_go_hp{background-color: rgb(40,111,113,0.8);}

	#intro_wrap2 .content .intro_link li > a {padding-bottom:20px}
	#intro_wrap2 .content .intro_link li img {width:60px;height:auto}
	#intro_wrap2 .content .intro_link li p {font-size:1em}
    #intro_wrap2 .content .intro_link li:not(.special) h2 {margin-top:-15px;font-size:1.333em;line-height:1.5}
	#intro_wrap2 .content .intro_link li.special h2 {font-size:1.833em}
}