@charset "utf-8";

@-webkit-keyframes objAC1 { 0%,50%,100% {transform:translateY(0);-webkit-transform:translateY(0);}25% {transform:translateY(6px);-webkit-transform:translateY(6px);}75% {transform:translateY(6px);-webkit-transform:translateY(6px);}}
@keyframes objAC1 { 0%,50%,100% {transform:translateY(0);-webkit-transform:translateY(0);}25% {transform:translateY(6px);-webkit-transform:translateY(6px);}75% {transform:translateY(6px);-webkit-transform:translateY(6px);}}

@keyframes twinkle-1 {50% {transform: scale(0.6);-webkit-transform: scale(0.6);}}
@-webkit-keyframes twinkle-1 {50% {transform: scale(0.6);-webkit-transform: scale(0.6);}}

a:focus,
button:focus,
input:focus {outline:1px dashed #000;}
.intro_wrap {overflow: hidden;position: relative;min-height:100vh;padding: 0 0 240px;background:#eff6f9;}
.intro_wrap .intro_box {position: relative;padding:100px 0 0;text-align:center;}
.intro_wrap .intro_box .logo {display: block;width: 125px;height: 42px;margin: 0 auto 35px;background-image: url(/images/kor/common/logo.png);background-image: url(/images/kor/common/logo.svg);background-size: 100% auto;background-repeat: no-repeat;vertical-align: top;font-size: 0;}
.intro_wrap .intro_box .slogan {}
.intro_wrap .intro_box .slogan p {font-size:20px;font-family: 'GmarketSans';color: #4d4d4e;}
.intro_wrap .intro_box ul {display: block;position: relative;z-index: 10;width:auto;max-width: 1300px;margin: 40px auto 0;}
.intro_wrap .intro_box ul li {float:left;position:relative;width:calc(24% - 20px);height: 295px;margin:0 12px;padding: 40px 25px 0;border-radius:10px;text-align:left;box-shadow: 0 0 15px rgba(0,0,0,.15);}
.intro_wrap .intro_box ul li.n1 {background: #0a4595 url(/images/intro/bg1_20211110.png)no-repeat right bottom;}
.intro_wrap .intro_box ul li.n1 .btnbox a {widtH:100%; background:#0a4595;}
.intro_wrap .intro_box ul li.n2 {background:#058762 url(/images/intro/bg2.png)no-repeat right bottom;}
.intro_wrap .intro_box ul li.n3 {background:#1A74BB;}
/* .intro_wrap .intro_box ul li.n3:after {display:block;position:absolute;right: -75px;top: 25px;content:'';width:174px;height:235px;background:url(/images/intro/obj1.png)no-repeat;animation: objAC1 4s both infinite;-webkit-animation: objAC1 4s both infinite;} */
.intro_wrap .intro_box ul li.n4:after {display:block;position:absolute;right: -75px;top: 25px;content:'';width:174px;height:235px;background:url(/images/intro/obj1.png)no-repeat;animation: objAC1 4s both infinite;-webkit-animation: objAC1 4s both infinite;}
/* .intro_wrap .intro_box ul li.n4 {background:#0a4595 url(/images/intro/bg3.png)no-repeat right bottom;} */
.intro_wrap .intro_box ul li.n4 {background: #002e6d;}
.intro_wrap .intro_box ul li strong {display:block;line-height:1.3;margin: 0 0 20px;font-size:26px;color:#fff;}
.intro_wrap .intro_box ul li strong span {display:block;}
.intro_wrap .intro_box ul li .cgo_btn{display: inline-block;position: relative;width: 30px;left: 10px;top: -20px;height: 30px;margin: 5px 5px 0 0;border: 2px solid #fff;border-radius: 100%;color: #fff;font-size: 0;line-height: 0;text-indent: -9990px;}
.intro_wrap .intro_box ul li .cgo_btn > em{display: block;position: absolute;right: 10px;top: 10px;width: 7px;height: 7px;border-radius: 2px;border: solid #fff;border-width: 2px 2px 0 0;-webkit-transform: rotate(45deg);}

.intro_wrap .intro_box ul li p {line-height:1.5;letter-spacing: -0.08em;font-size:15px;color:#fff;}
.intro_wrap .intro_box ul li.n1 p {text-shadow: -1px -1px 0 #0e76bc, 1px -1px 0 #0e76bc, -1px 1px 0 #0e76bc, 1px 1px 0 #0e76bc;}
.intro_wrap .intro_box ul li.n2 p {text-shadow: -1px -1px 0 #058762, 1px -1px 0 #058762, -1px 1px 0 #058762, 1px 1px 0 #058762;}
.intro_wrap .intro_box ul li.n3 p {text-shadow: -1px -1px 0 #1A74BB, 1px -1px 0 #1A74BB, -1px 1px 0 #1A74BB, 1px 1px 0 #1A74BB;}
.intro_wrap .intro_box ul li.n4 p {text-shadow: -1px -1px 0 #0a4595, 1px -1px 0 #0a4595, -1px 1px 0 #0a4595, 1px 1px 0 #0a4595;}
.intro_wrap .intro_box ul li p span {display:block;}
.intro_wrap .intro_box ul li .btnbox {position:absolute;left:0;bottom: 18px;width:100%;padding:0 35px;}
.intro_wrap .intro_box ul li .btnbox a {display:inline-block;position:relative;width:127px;height:40px;line-height:36px;margin: 5px 5px 0 0;padding: 0 20px;border:2px solid #fff;border-radius:30px;color:#fff;font-size: 15px;}
.intro_wrap .intro_box ul li.n3 .btnbox a {display:block; width:100%; margin:10px 0 0;}
.intro_wrap .intro_box ul li .btnbox a span {display:block;position:absolute;right: 15px;top: 16px;width: 7px;height: 7px;border-radius: 2px;border:solid #fff;border-width:2px 2px 0 0;transform:rotate(45deg);-webkit-transform:rotate(45deg);}
.intro_wrap .intro_box .star {position:absolute;z-index: 1;width:17px;height:18px;background:url(/images/intro/star.png)no-repeat;background-size:100% auto;animation: twinkle-1 2s ease infinite;-webkit-animation: twinkle-1 2s ease infinite;}
.intro_wrap .intro_box .star1 {left: -145px;bottom: 190px;width:11px;animation-delay:0.5s;-webkit-animation-delay:0.5s;}
.intro_wrap .intro_box .star2 {left: -110px;bottom: 70px;animation-delay:1s;-webkit-animation-delay:1s;}
.intro_wrap .intro_box .star3 {left: -10px;bottom: 15px;width:11px;}
.intro_wrap .intro_box .star4 {right: -50px;bottom: 60px;animation-delay:1s;-webkit-animation-delay:1s;}
.intro_wrap .intro_box .star5 {right: -30px;bottom:0;width:11px;}
.intro_wrap .footer {position:absolute;left:0;bottom:0;width:100%;height: 75px;padding: 20px 0 30px;background:#394049;text-align: center;}
.intro_wrap .footer:before,
.intro_wrap .footer:after {display:block;position:absolute;content:'';z-index: 3;}
.intro_wrap .footer:before {left:0;top: -352px;width:623px;height:352px;background:url(/images/intro/obj_left.png)no-repeat;}
.intro_wrap .footer:after {right:0;top: -403px;width:552px;height:461px;background: url(/images/intro/obj_right.png)no-repeat right bottom;}
.intro_wrap .footer span {display:inline-block;position: relative;z-index: 5;opacity:0.5;margin:0 20px;font-size:14px;color:#fff;}
.intro_wrap .footer strong {display:inline-block;position: relative;z-index: 5;margin:0 20px;font-size:14px;font-weight: normal;color:#fff;}
.intro_wrap .footer strong a {display:inline-block;font-size:14px; color:#fff;}


/*220207 추가*/
.intro_wrap .intro_box ul li.n1 .btnbox a.two-line {height: 50px;line-height: 1.1;padding-top: 6px;}
.intro_wrap .intro_box ul li.n1 .btnbox a.two-line em {font-size: 14px;}


@media(max-width:1499px){
    .intro_wrap .intro_box {}
    .intro_wrap .intro_box .star1 {left:15px;}
    .intro_wrap .intro_box .star2 {left:80px;}
    .intro_wrap .intro_box .star3 {left:100px;}
    .intro_wrap .intro_box .star5 {right: 20px;}

    .intro_wrap .footer {height: auto;}
    .intro_wrap .footer span,
    .intro_wrap .footer strong {display:block;}
}

@media(max-width:1379px){
    .intro_wrap .intro_box ul li {width:calc(50% - 20px); margin:0 10px 20px;}
    .intro_wrap .intro_box ul li.n3 .btnbox a {display:inline-block; max-width:127px;}
	.intro_wrap .intro_box ul li.n1 .btnbox a {display:inline-block; max-width:220px;}
    .intro_wrap .intro_box ul li.n3:after {right:-50px;}
}

@media(max-width:767px){
    .intro_wrap .intro_box ul li {width:calc(100% - 20px);height: auto;padding: 40px 35px;}
    .intro_wrap .intro_box ul li strong span {display:inline-block; margin:0 5px 0 0;}
    .intro_wrap .intro_box ul li p span {display:inline-block;}
    .intro_wrap .intro_box ul li .btnbox {position:static;padding: 0;margin: 30px 0 0;}
}
 

@media(max-width:580px){
    .intro_wrap .intro_box ul li {padding:35px 30px;}
    .intro_wrap .intro_box ul li strong span {display:block; margin:0 5px 0 0;}
    .intro_wrap .intro_box ul li p span {display:block;}
}

@media(max-width:450px){
    .intro_wrap .intro_box ul li.n1 {background-size:140px auto;}
    .intro_wrap .intro_box ul li.n2 {background-size:140px auto;}
    .intro_wrap .intro_box ul li.n3:after {right:-30px;width:140px;height: 188px;background-size:140px auto;} 
    .intro_wrap .intro_box ul li.n4 {background-size:140px auto;}
}

@media(max-width:380px){
    .intro_wrap .intro_box ul li.n3 .btnbox a {display:block;}   
    .intro_wrap .intro_box ul li.n3:after {top:125px; right:-50px}
}