@charset "utf-8";

* {line-height:1.2;}
body:before {content:"";display:block;position:absolute;top:0;left:0;right:0;height: 800px;/* max-height:50%; */z-index:-1;}

#intro_wrap {position:relative;width: 100%;height: 90%;padding: 60px 0;box-sizing:border-box;text-align:center;background: url('/images/main/bg01.png') center bottom no-repeat #d8eefc;}
#intro_wrap .top_section {position: relative; padding:0 0 100px;width: 1200px;margin:0 auto;}
#intro_wrap .top_section .logo {margin-bottom:30px;}
#copyright { width:100%; text-align: center; font-size:16px;color: #575756;margin-bottom:0;padding: 40px 0;letter-spacing: 0;}

.link-quick {margin: 0;}
.link-quick:after {content:""; display:block; clear:both;}
.link-quick li{display:block;width: calc(33.3333333% - 2%);float:left;margin: 1%;box-sizing:border-box;}
.link-quick .item {display:block;position:relative;border-radius: 20px;background:#fff;overflow:hidden;transition:.3s all;-webkit-transition:.3s all;-webkit-box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.10);;-moz-box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.10);;box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.10);}
.link-quick .item:hover {transform:translateY(-20px); -webkit-transform:translateY(-20px);}
.link-quick .item .desc {display:block;position:relative;padding: 30px 10px 0;height: 220px;box-sizing:border-box; letter-spacing:-1px;}
.link-quick .item .desc > * {display:block; position:relative; word-break:keep-all;}
.link-quick .item .desc span {font-size:16px; padding:5px;}
.link-quick .item .desc strong {font-size: 24px;font-weight: 700;letter-spacing: -0.8pt;}
.link-quick .item.link1 .desc strong{color:#185ec8;}
.link-quick .item.link2 .desc strong{color:#03a59e;}
.link-quick .item.link3 .desc strong{color:#1282c1;}
.link-quick .item .desc p{font-size:18px; color:#333; margin-top:10px;}

.link-quick .item .ani-area {display:block; position:relative; background:#ccc; overflow:hidden;}
.link-quick .item .ani-area:before {content:"";display:block;position:relative;padding-top: 60%;z-index:-1;}
.link-quick .item .ani {position:absolute; top:0; left:0; right:0; bottom:0; z-index:0;}

.link-quick .item .desc a{display:block;position:absolute;bottom: 25px;left:50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);width:50%;line-height: 50px;text-align:center;text-indent: -50px;color:#fff;border-radius: 50px;font-size: 18px;font-weight: 500;background:url('/images/main/ico_btn_arrow.png') no-repeat;}
.link-quick .item .desc a:after{position:absolute;content:'';right: 30px;top:20px;background:url('/images/main/ico_btn_arrow.png') no-repeat center;width:41px;height:8px;}
.link-quick .item .desc a:hover{font-weight:bold;}
.link-quick .item.link1 .desc a{background:#185ec8;}
.link-quick .item.link2 .desc a{background:#03a59e;}
.link-quick .item.link3 .desc a{background:#1282c1;}

.ani-area .ani {background:no-repeat 50% 50%;background-size:100% auto;}
.link1 .ani{background: #d7e7ff url('/images/main/img_ani_obj1.png') no-repeat center center;}
.link2 .ani{background:#d9fffe url('/images/main/img_ani_obj2.png') no-repeat center bottom;}
.link3 .ani{background: #bde4ff url('/images/main/img_ani_obj3.png') no-repeat center bottom;}

@media all and (max-width:1200px) {
    #intro_wrap .top_section {width:100%;}
}

@media all and (max-width:1000px) {
.link-quick .item .desc {zoom:.9;}
.link-quick .item .desc a {width:70%; font-size: 16px;}
.ani-area .ani {background-size:90%;}

}
@media all and (max-width:800px) {
	#intro_wrap {height:auto; background-size:150%}
	.link-quick li{width: calc(50% - 2%);}

}
@media all and (max-width:500px) {
	#intro_wrap .top_section {width:70%;}
	.link-quick li{width: 100%; margin:20px 0; float:none;}

}

/*레이어 팝업*/
.layerWrap  {position: absolute; top: 180px; left: 50%;width: 860px; margin-left: -430px; z-index:999;}

#lay_popup1 {position:absolute;left: 0px;top:0px;}
#lay_popup1 .close {position:absolute; top:20px; right:20px;}

#lay_popup2 {position:absolute;left:41%;top:0px; z-index:999;}
#lay_popup2 .close {position:absolute; top:20px; right:20px;}

#lay_popup3 {position:absolute;left: 16%;top:0px;z-index:999;transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0);}
#lay_popup3 .close {position:absolute; top:20px; right:20px;}

@media all and (max-width:900px) {
    .layerWrap {width:100%; left:0; margin-left:0px;}

    #lay_popup2,
    #lay_popup3 {width:48%; margin:0 1%;}

    #lay_popup2 img,
    #lay_popup3 img {width:100%;}
    #lay_popup2 {left:26%; top:420px;}
    #lay_popup3 {left:50%;}
}

@media all and (max-width:640px) {
    #lay_popup2,
    #lay_popup3 {width:70%; left:50%; transform:translate(-50%,0);}
}

@media all and (max-width:375px) {
    #lay_popup2,
    #lay_popup3 {width:100%; }
}