@charset"utf-8";

/* Font */
@import url(font.css);

/* Guide
----------------------------------------------------------------------------------------------------------------------------------------------------------
	▶사이즈
	pc : 1160px
	tablet : 980px ~
	mobile : 768px ~ 320px

	▶미디어쿼리는 (주석으로 구분 되어있는)파트마다 각각 작성함.

*/
/* Reset
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, select, td, textarea, textarea, th, ul{margin:0;padding:0}
body, button, input, select, td, textarea, th{font-family:'NotoSansKR',sans-serif;letter-spacing:-1px;font-weight:300;font-size:16px;color:#555}
dl, li, menu, ol, ul{list-style:none}
*, *:after, *:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
:focus{outline:0 !important}
iframe{border:none;width:100%}
a{color:inherit;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;transition:all .2s ease-out}
a:active, a:focus, a:hover{text-decoration:none;color:#01b5e2}
img{max-width:100%}
textarea{max-width:100%;resize:none}
@media only screen and (max-width: 768px){
    body, button, input, select, td, textarea, th{font-size:14px}
}
@media only screen and (min-width: 320px){
    body{overflow-x:hidden}
}
.hidden{font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
::selection{background-color:#bceeff}

/* Parallax
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.parallax{background-position:0 0;background-repeat:no-repeat;background-size:100% auto;width:100%;background-size:cover;background-attachment:fixed}

/* Preloader
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.animationload{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;z-index:999999}
.loader{width:200px;height:200px;font-size:24px;text-align:center;position:absolute;left:50%;top:50%;background-image:url("/images/basic_resp/img/preloader.gif");background-repeat:no-repeat;background-position:center;margin:-100px 0 0 -100px}

/* Back to top (탑 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.back-to-top{width:40px;height:40px;position:fixed;bottom:10px;right:20px;display:none;text-align:center;z-index:10000;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:#01b5e2}
.back-to-top i{color:#fff;font-size:15px;display:block;line-height:33px}

/* Layoyt (레이아웃)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#wrapper{position:relative;width:100%;min-width:320px;height:100%}

/* Header
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#header{position:absolute;width:100%;height:100px;background:transparent;z-index:16}
#header #L_SITE_LOGO{position:relative;z-index:2}
#header h1{float:left;padding-left:30px;line-height:0;font-size:0}
#header h1 a{display:block;line-height:100px;vertical-align:middle}
.nav-btn{z-index:999;position:absolute;top:35px;right:32px;width:35px;height:29px;cursor:pointer}
.nav-btn span{position:absolute;left:50%;display:inline-block;margin-left:-17.5px;width:35px;height:3px;background:#fff;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out}
.nav-btn span:nth-child(1){top:0}
.nav-btn span:nth-child(2){top:8px}
.nav-btn span:nth-child(3){top:16px}
.nav-btn small{position:absolute;left:50%;display:inline-block;margin-left:-17.5px;width:35px;height:20px;line-height:20px;color:#fff;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out;font-size:20px;bottom:-17px}
.nav-btn small._off{opacity:0}
.nav-btn small._on{opacity:1}
.nav-btn.nav-close span:nth-child(1){top:50%;transform:rotate(45deg)}
.nav-btn.nav-close span:nth-child(2){margin-left:0;width:0}
.nav-btn.nav-close span:nth-child(3){top:50%;transform:rotate(-45deg)}
.nav-close small._on{opacity:0}

@media only screen and (min-width: 981px){
    #header{height:100px}
    #header .header_in{position:relative;max-width:1440px;width:100%;margin:0 auto}
    .nav-bg{z-index:1;display:none;position:absolute;top:0;width:100%;height:232px;background:rgba(11,45,133,.9)}
    .nav-bg:after{content:'';position:absolute;top:100px;width:100%;height:1px;background-color:#081c50;}
	/*.nav-bg:after{content:'';background:rgba(11,45,133,.9);position:absolute;top:-100px;left:0;width:100%;height:100px;border-bottom:1px solid #081c50}*/
    #nav{z-index:888;float:right;margin-right:99px}
    .login-menu{position:relative;z-index:999;float:right;font-size:0;line-height:0}
    .login-menu li{display:inline-block;margin-left:20px;line-height:99px}
    .navigation{float:right;margin-top:37px}
    .navigation > li{position:relative;float:left;width:130px;text-align:center;z-index:999}
    .navigation .main-menu{display:block;margin-bottom:38px;width:100%;font-weight:400;font-size:18px;color:#fff}
    .navigation .main-menu:hover{color:#01b5e2}
    .navigation > li:hover .main-menu{color:#01b5e2}
    .navigation .sub-menu{z-index:888;display:none;position:absolute;top:63px;left:50%;margin-left:-65px;padding:20px 0;width:100%;text-align:center}
    .navigation .sub-menu a{line-height:30px;font-size:16px;color:#fff}
    .navigation .sub-menu a:hover{text-decoration:underline;color:#01b5e2}
}

@media only screen and (min-width: 981px) and (max-width: 1200px){
    #header h1{padding-left:20px}
    .nav-btn{right:20px}
    #nav{margin-right:75px}
    .login-menu li:first-child{margin-left:0}
    .navigation > li{width:120px}
    .navigation .sub-menu{margin-left:-60px}
}

@media only screen and (max-width: 980px){
    #header{height:65px}
    #header h1{padding-left:20px}
    #header h1 a{line-height:65px}
    .nav-btn{top:23px;right:20px;height:20px}
    .nav-btn.nav-close{position:fixed}
    .nav-bg{z-index:777;display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8)}
    #nav{z-index:888;position:fixed;right:-260px;padding-top:75px;width:260px;height:100%;background:#0b2d85}
    .login-menu{margin-bottom:40px;padding:0 20px;text-align:center;line-height:0;font-size:0}
    .login-menu li{display:inline-block}
    .login-menu li:first-child{margin-right:25px}
    .navigation .main-menu{display:block;margin-top:20px;text-align:center;padding:0 20px;width:100%;font-weight:400;font-size:18px;color:#fff}
    .navigation > li:first-child .main-menu{margin-top:0}
    .navigation .active .main-menu{font-weight:400;text-decoration:underline;color:#01b5e2}
    .navigation .sub-menu{display:none;padding:10px 0}
    .navigation .sub-menu a{display:block;text-align:center;line-height:30px;font-size:16px;color:#fff}
    .nav-btn small._on{opacity:0}
    .nav-btn.nav-close span{background:#fff}
}

@media only screen and (max-width: 768px){
    #header h1{padding-left:10px}
    #header h1 img{width:200px}
    .nav-btn{top:23px;right:10px;width:30px;height:20px}
    .nav-btn span{margin-left:-15px;width:30px;height:3px}
    .nav-btn span:nth-child(1){top:0}
    .nav-btn span:nth-child(2){top:8px}
    .nav-btn span:nth-child(3){top:16px}
    .nav-btn small._off{opacity:0}
}

/* Button (공통 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.btn{text-transform:uppercase;border-radius:0;line-height:24px}
.btn:active,
.btn:focus{outline:none;color:#fff}
.btn-custom{border-radius:3px;padding:0.8em 1.8em;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;transition:all .2s ease-out;text-transform:uppercase;background-color:#e65b43;border-color:#e65b43;color:#fff}
.btn-custom:focus,
.btn-custom:hover{background-color:#00208e;border-color:#00208e;color:#fff}
.btn-custom-outline{border-radius:3px;padding:0.8em 1.8em;color:#fff;-webkit-transition:all .2s ease-out;transition:all .2s ease-out;text-transform:uppercase;background-color:transparent;border-color:#fff}
.btn-custom-outline:focus,
.btn-custom-outline:hover{color:#fff;background-color:rgba(255,255,255,.5)}
.btn-bar a{margin-right:10px}
.form-control{box-shadow:none;-webkit-box-shadow:none;border-radius:3px;height:38px}
.form-control:focus{outline:none;box-shadow:none;-webkit-box-shadow:none;border-color:#01b5e2}

@media only screen and (max-width: 980px){}

/* Footer (하단메시지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#footer{padding:50px 20px;width:100%;box-sizing:border-box;text-align:center;background:#2d3134;color:#848484;clear:both;}
.foot_logo{margin-bottom:40px}
.footer-menu{margin-bottom:15px;font-size:0;line-height:0}
.footer-menu li{display:inline-block;margin-left:10px;padding-left:10px;line-height:8px;border-left:1px solid #4e4e4e;color:#8e8e91}
.footer-menu li:first-child{margin-left:0;padding-left:0;border-left:0}
.footer-menu li a{line-height:8px;letter-spacing:0;font-weight:400;font-size:14px;color:#8e8e91}
.footer-info{margin:0 auto;width:980px;letter-spacing:0;font-size:14px;color:#848484}
.footer-info span{color:#6b6b6b}
.footer-info > p{margin-top:20px}
.footer-info span{color:#4e4e4e}
.footer-info strong{color:#fff;margin-right:5px;font-size:20px;font-weight:500}
.footer-info a{color:#01b5e2;font-weight:500}
.footer-info a.link_b{font-size:20px}
.footer-info p a{color:inherit}

@media only screen and (max-width:980px){
    .footer-info{width:100%}
}

@media only screen and (max-width:768px){
    #footer{padding:35px 10px}
    .foot_logo{margin-bottom:30px}
    .foot_logo img{width:200px}
    .footer-info strong{font-size:14px}
    .footer-info a.link_b{font-size:14px}
}

@media only screen and (max-width:480px){
    .footer-menu li{margin-left:6px;padding-left:6px}
    .footer-menu li a{font-size:13px}
    .footer-info{font-size:13px;letter-spacing:-1px}
}

/* Main Visual (메인이미지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.main-visual{position:relative;width:100%}
.main-visual .carousel-inner > .item{height:1080px}
.main-visual .carousel-inner > .main-img{background-repeat:no-repeat;background-position:center center;background-size:cover}
.main-visual .carousel-inner > .main-img01{background-image:url("/images/kor08r-18-0408/main/main_visual1.jpg")}
.main-visual .carousel-inner > .main-img02{background-image:url("/images/kor08r-18-0408/main/main_visual2.jpg")}
.main-visual .carousel-inner .carousel-caption{top:40%;bottom:auto;right:10%;left:10%;text-shadow:none}
.main-visual p{line-height:1.2;color:#fff;word-break:keep-all;}
.main-visual p strong{color:#12afd5;}
.main-visual span{font-size:30px;font-weight:400; color:#fee68e;}
.main-visual .intro-copy{font-size:60px;font-weight:400}
.main-visual .main-copy{margin-bottom:20px;font-size:60px;font-weight:500}
.main-visual .main-copy strong{font-weight:600}
.main-visual .sub-copy{font-size:22px}
.main-visual .sub-copy strong{font-weight:500}
.main-visual .carousel-control.left{background:url("/images/kor08r-18-0408/main/visual_btn_prev.png") no-repeat center center}
.main-visual .carousel-control.right{background:url("/images/kor08r-18-0408/main/visual_btn_next.png") no-repeat center center}
.main-visual .carousel-control{background:none;text-shadow:none;width:10%;text-indent:-9999em;overflow:hidden}
.main-visual .carousel-control,
.main-visual .carousel-control:focus,
.main-visual .carousel-control:hover{opacity:1}
.main-visual .carousel-indicators{bottom:5%}
.main-visual .carousel-indicators li{position:relative;width:15px;height:15px;margin:0 0 0 30px;border-width:2px}
.main-visual .carousel-indicators li.active{width:15px;height:15px;margin-left:30px}
.main-visual .carousel-indicators li:after{position:absolute;right:13px;top:5px;content:'';width:32px;height:1px;background-color:#fff}
.main-visual .carousel-indicators li:first-child{margin-left:0}
.main-visual .carousel-indicators li:first-child:after{display:none}

@media only screen and (max-width:1200px){
    .main-visual .main-copy{font-size:50px}
}

@media only screen and (max-width:980px){
    .main-visual .intro-copy{font-size:25px}
    .main-visual .main-copy{margin-bottom:10px;font-size:42px}
    .main-visual .sub-copy{font-size:19px}
    .main-visual .slogan span{font-size:25px}
    .main-visual .carousel-inner > .item{height:880px}
}

@media only screen and (max-width:768px){
    .main-visual .intro-copy{font-size:23px}
    .main-visual .main-copy{margin-bottom:10px;font-size:35px}
    .main-visual .sub-copy{font-size:16px}
    .main-visual .slogan span{font-size:20px}
    .main-visual p br{display:none}
    .main-visual .carousel-inner .carousel-caption{top:35%}
    .main-visual .carousel-inner > .item{height:668px}
    .main-visual .carousel-control{display:none;}
	.main-visual .carousel-inner > .main-img{background-position:70% center;}
}

@media only screen and (max-width:480px){
    .main-visual p{text-align:center}
    .main-visual .intro-copy{font-size:20px}
    .main-visual .main-copy{margin-bottom:5px;font-size:30px}
    .main-visual .slogan span{font-size:20px}
    .main-visual .sub-copy{font-size:13px}
    .main-visual .carousel-inner .carousel-caption{top:30%}
    .main-visual .carousel-inner > .item{height:455px}
}

/* Main Contents (메인 컨텐츠)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.main-contents{background:#f3f3f3}

/* 메인 슬로건 */
.main-slogan{position:relative;display:table;width:100%;min-height:240px;text-align:center;padding:0 20px}
.main-slogan span{display:table-cell;vertical-align:middle;font-size:35px;line-height:45px;color:#31414e}

/* 메인 퀵배너 */
.main-quick-banner{position:relative;display:block;width:100%}
.main-quick-banner .quick-box{min-height:564px;overflow:hidden;padding:0}
.main-quick-banner .quick-box ._in{min-height:564px;background-position:center;background-size:cover;background-repeat:no-repeat}
.main-quick-banner .quick-box.quick-img ._in{-webkit-transition:.3s;-moz-transition:.3s;-ms-transition:.3s;-o-transition:.3s;transition:.3s}
.main-quick-banner .quick-box.quick-img ._in:hover{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}
.main-quick-banner .quick-box.quick-img._bg-1 ._in{background-image:url("/images/kor08r-18-0408/main/main_banner1.jpg"); background-position:right center !important}
.main-quick-banner .quick-box.quick-img._bg-2 ._in{background-image:url("/images/kor08r-18-0408/main/main_banner2.jpg")}
.main-quick-banner .quick-box.quick-img._bg-3 ._in{background-image:url("/images/kor08r-18-0408/main/main_banner3.jpg")}
.main-quick-banner .quick-box.quick-img._bg-4 ._in{background-image:url("/images/kor08r-18-0408/main/main_banner4.jpg")}
.main-quick-banner .quick-box.quick-text{display:table;text-align:center}
.main-quick-banner .quick-box.quick-text._bg-1 ._in{background-image:url("/images/kor08r-18-0408/main/main_quick_bg_1.jpg")}
.main-quick-banner .quick-box.quick-text._bg-2 ._in{background-image:url("/images/kor08r-18-0408/main/main_quick_bg_2.jpg")}
.main-quick-banner .quick-box.quick-text._bg-3 ._in{background-image:url("/images/kor08r-18-0408/main/main_quick_bg_3.jpg")}
.main-quick-banner .quick-box.quick-text._bg-4 ._in{background-image:url("/images/kor08r-18-0408/main/main_quick_bg_4.jpg")}
.main-quick-banner .quick-box.quick-text._bg-4 ._in a{color:#f3c906;border:none;font-size:30px;line-height:1;margin-bottom:30px;padding:0}
.main-quick-banner .quick-box.quick-text._bg-4 ._in a:hover{background:transparent;color:#f3c906}
.main-quick-banner .quick-box.quick-text div._in{display:table-cell;width:100%;line-height:100%;vertical-align:middle;padding:20px 60px}
.main-quick-banner .quick-box.quick-text div._in h3{position:relative;font-size:50px;color:#fff;margin-bottom:30px}
.main-quick-banner .quick-box.quick-text div._in span{position:relative;display:block;font-size:20px;line-height:30px;color:#fff;margin-bottom:45px}
.main-quick-banner .quick-box.quick-text div._in a{position:relative;display:inline-block;font-size:16px;font-weight:500;color:#fff;padding:12px 63px;border:1px solid #fff}
.main-quick-banner .quick-box.quick-text div._in a:hover{background-color:#fff;color:#0d50a4}
.main-quick-banner .quick-box.quick-text div._in a.contact_number{font-size:20px;line-height:30px;color:#fff;border:none}

/* 퀵배너 3개 */
.quick-banner{position:relative;margin:0 auto;width:1200px;line-height:0;font-size:0}
.quick-banner ul{margin:0 -7.5px}
.quick-banner li{position:relative;display:inline-block;margin:0 7.5px;padding-bottom:calc(33.33% - 15px);width:calc(33.33% - 15px);overflow:hidden;text-align:center;background:#fff}
.quick-banner li:nth-child(1){background:#fff url("/images/kor08r-18-0408/main/main_icon01.gif") no-repeat center 20%}
.quick-banner li:nth-child(2){background:#fff url("/images/kor08r-18-0408/main/main_icon02.gif") no-repeat center 20%}
.quick-banner li:nth-child(3){background:#fff url("/images/kor08r-18-0408/main/main_icon03.gif") no-repeat center 20%}
.quick-banner li > div{position:absolute;top:60%;left:0;width:100%;height:40%}
.quick-banner .go-link{position:absolute;top:0;left:0;display:block;width:100%;height:100%;text-indent:-9999em;overflow:hidden}
.quick-banner .go-link:before{position:absolute;top:0;left:0;content:"";display:block;width:0;height:0;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out}
.quick-banner .go-link:after{position:absolute;bottom:0;right:0;content:"";display:block;width:0;height:0;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out}
.quick-banner .go-link:hover:before{width:100%;height:100%;border-left:5px solid #d50050;border-top:5px solid #d50050}
.quick-banner .go-link:hover:after{width:100%;height:100%;border-right:5px solid #d50050;border-bottom:5px solid #d50050}
.quick-banner h3{margin-bottom:20px;font-weight:400;font-size:25px;line-height:1;color:#000}
.quick-banner p{font-size:17px;line-height:1.4;color:#777}

@media only screen and (max-width:1200px){
    .quick-banner{width:calc(100% - 40px)}
    .quick-banner li:nth-child(1),
    .quick-banner li:nth-child(2),
    .quick-banner li:nth-child(3){background-size:45%}
}

@media only screen and (max-width:980px){
    .quick-banner h3{margin-bottom:15px;font-size:20px}
    .quick-banner p{font-size:15px}
}

@media only screen and (max-width:768px){
    .main-slogan{min-height:100px}
    .main-slogan span{font-size:18px;line-height:28px}
    .main-quick-banner .quick-box{min-height:320px;margin-bottom:20px}
    .main-quick-banner .quick-box.quick-text div._in{padding:30px 20px}
    .main-quick-banner .quick-box.quick-text div._in h3{font-size:30px;margin-bottom:20px}
    .main-quick-banner .quick-box.quick-text div._in span{font-size:17px;line-height:27px;margin-bottom:20px}
    .main-quick-banner .quick-box.quick-img{display:none}
    .main-quick-banner .quick-box.quick-img ._in:hover{-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
    .quick-banner{top:-30px;width:calc(100% - 20px)}
    .quick-banner ul{margin:0 -5px}
    .quick-banner li{margin:0 5px;padding-bottom:calc(33.33% - 10px);width:calc(33.33% - 10px)}
    .quick-banner h3{margin-bottom:10px;font-size:18px}
    .quick-banner p{font-size:13px}
}

@media only screen and (max-width:512px){
    .quick-banner{top:0}
    .quick-banner ul{margin:0;padding:5px 0}
    .quick-banner li{margin:5px 0;padding-bottom:100%;width:100%}
    .quick-banner h3{margin-bottom:20px;font-size:25px}
    .quick-banner p{font-size:17px}
}

/* Contact Us */
.contact-us{display:inline-block;height:526px;padding:60px 0;width:100%;background:url("/images/kor08r-18-0408/main/cs_bg.jpg") no-repeat center center/cover}
.contact-us h2{text-align:center;font-weight:400;line-height:1;font-size:40px;color:#fff}
.contact-us h2 + p{margin:10px 0 50px;text-align:center;font-size:17px;color:#d5d4d6}

@media only screen and (min-width:1200px){
    .contact-us > div{margin:0 auto;width:1200px}
}

@media only screen and (max-width:768px){
    .contact-us{padding:40px 30px; background-position:30% center;}
    .contact-us h2{font-size:30px}
    .contact-us h2 + p{margin:5px 0 30px;font-size:14px}
}