@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{font-family: 'ntk','Malgun Gothic', sans-serif}
body, p, ul, li {padding:0;margin:0;font-family:'noto sans CJK KR';}
*{box-sizing: border-box;}
li {list-style: none}
a {text-decoration:none}  
.intro_wrap {overflow: hidden;position: relative;min-height:100vh;padding: 0 0 240px;background:#295cb0;}
.intro_wrap:before {content:'';background:url('/images/intro/bg.png') no-repeat;position:absolute;left: 50%;top: 115px;width: 1472px;height: 448px;z-index: 2;transform: translateX(-50%);}
.intro_wrap:after {content:'';width:100%;height:100%;background:#fff;position:absolute;top: 400px;left: 0;z-index: 5;}
.intro_wrap .intro_top {margin: 75px auto 65px;text-align:center;position:relative;z-index: 2;width: 1200px;}
.intro_wrap .intro_top:before {content:'';position:absolute;top: 120px;background:url('/images/intro/bg_left.png') no-repeat;left: 55px;width:234px;height:345px;z-index: 3;}
.intro_wrap .intro_top:after {content:'';position:absolute;top: 120px;background:url('/images/intro/bg_right.png') no-repeat;right: 90px;width:184px;height: 352px;}
.intro_wrap .intro_top .logo {margin:0 0 45px 0;}
.intro_wrap .intro_top p {color:#fff; margin:20px 0 0 0; font-size:27px; font-weight:bold;}
.intro_wrap .intro_content {margin: 0 auto;position: relative;min-height: 300px;}
.intro_wrap .intro_content.col4 {width: 1200px;}
.intro_wrap .intro_content.col2 {width:600px}
.intro_wrap .intro_content ul {position:absolute;left:0;top:0;width: 100%;z-index: 7;height: 100%;}
.intro_wrap .intro_content ul:after {content:''; display:block; overflow:hidden; clear:both;}
.intro_wrap .intro_content ul li {float:left;padding: 45px 0;margin: 0 30px 0 0;text-align: center;color: #fff;border-radius: 20px;transition:0.4s;}
.intro_wrap .intro_content.col4 ul li {width: calc(25% - 23px);}
.intro_wrap .intro_content.col2 ul li {width: 100%;}
.intro_wrap .intro_content ul li:hover {transform: translate(-10px,-10px);-webkit-transform: translate(-10px,-10px);}
.intro_wrap .intro_content ul li:last-child{margin:0;}
.intro_wrap .intro_content ul li.support {background:#e04599;}
.intro_wrap .intro_content ul li.corona {background:#64970a;}
.intro_wrap .intro_content ul li.home {background:#008ded;}
.intro_wrap .intro_content ul li.support:hover {background:#e759a7;}
.intro_wrap .intro_content ul li.corona:hover {background:#7bb11b;}
.intro_wrap .intro_content ul li.home:hover {background:#229aec;}
.intro_wrap .intro_content ul li .icon {background:url('/images/intro/icon_ir.png') no-repeat;width:118px;height:118px;display: inline-block; background-color:#fff;border-radius:50%;}
.intro_wrap .intro_content ul li .icon:after {content:''; position:absolute; left:0; top:0; background:#fff;}
.intro_wrap .intro_content ul li .icon02 {background-position:-115px 0;}
.intro_wrap .intro_content ul li .icon03 {background-position:-237px 0;}
.intro_wrap .intro_content ul li p {color:#fff;font-size: 22px;line-height: 28px;letter-spacing: -0.025em;margin: 18px;}
.intro_wrap .intro_content ul li a {color:#fff;font-family:'noto sans CJK KR';font-size:16px;line-height:1;padding: 14px 40px;border-radius: 22px;margin-top: 10px;display: inline-block;}
.intro_wrap .intro_content ul li.support a {background:#c41a76;}
.intro_wrap .intro_content ul li.corona a {background:#4e7a00;}
.intro_wrap .intro_content ul li.home a {background:#016eca;}
.footer{background: #323232;padding: 40px 0;text-align: center;position:absolute;left:0;bottom:0;width:100%;z-index: 6;font-size:15px;}
.footer p{margin:0;color:#fff;}
.footer span {color:#909090;}


@media (max-width:1200px){
    .intro_wrap .intro_top {width:100%;}
    .intro_wrap{padding: 0 20px 240px;}
    .intro_wrap .intro_top {margin: 25px 0;padding-bottom: 168px;}
    .intro_wrap .intro_top .logo {margin: 0 0 25px 0;}
    .intro_wrap .intro_top p {margin:15px 0 0 0;}
    .intro_wrap .intro_content {width:100%;}
    .intro_wrap .intro_content ul {position:relative;}
    .intro_wrap .intro_top:before {width:150px;background-size:cover;height: 200px;top: 250px;}
    .intro_wrap .intro_top:after {width: 117px;background-size:cover;height: 200px;top: 250px;}
    .intro_wrap:before {top: 5px;}
}
@media (max-width:1132px){
    .intro_wrap .intro_content ul li {min-height:390px;}
}
@media (max-width:800px){
        .intro_wrap .intro_content ul li {float:none; width:100%;}
    .intro_wrap .intro_content ul li {padding:20px 0; margin-bottom:20px; min-height:auto;}
    .intro_wrap .intro_content ul li p {margin:10px;font-size: 24px;font-weight: bold;}
    .intro_wrap .intro_content ul li p br {display:none;}
    .intro_wrap .intro_content ul li .icon {display:none;}
    .intro_wrap .intro_content ul li a {font-size:18px;}
    .intro_wrap .intro_top {padding-bottom: 120px;}
    .intro_wrap .intro_top p {font-size:18px;}
    .intro_wrap:after {top: 360px;}
    .intro_wrap .intro_top:after {top: 230px;right: 0;}
    .intro_wrap .intro_top:before {top: 230px;left: 0;}
    .intro_wrap .intro_content {padding-top: 25px;}
    .intro_wrap .intro_content ul li a {padding:10px 40px; margin-top:0;}
    .intro_wrap .intro_content.col2, .intro_wrap .intro_content.col4 {width:100%;}
    .intro_wrap .intro_content.col2 ul li, 
    .intro_wrap .intro_content.col4 ul li {width:100%;}
}


