@charset"utf-8";

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

/* Guide
----------------------------------------------------------------------------------------------------------------------------------------------------------

▶사이즈
pc : 1280px
tablet : 980px ~
mobile : 767px ~ 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; font-family:'ntkr',sans-serif;}
dl, li, menu, ol, ul{list-style:none;color:#666}
body{font-family:'ntkr',sans-serif; font-size:14px;letter-spacing:-0.5px;font-weight:normal;color:#666; font-weight:400;}
*, *: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 {font-family:'ntkr',sans-serif;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 !important;color:#25428e}
img{max-width:100%}
textarea{max-width:100%;resize:none}
.hidden{font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}

@media only screen and (min-width: 320px){
    body{overflow-x:hidden}
}

/* 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:40px;right:20px;display:none;text-align:center;z-index:10000;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:#ea2828;box-shadow:0 8px 13px rgba(0,0,0,.4)}
.back-to-top i{color:#fff;font-size:15px;display:block;line-height:33px; font-family:'FontAwesome' !important;}

/* Layoyt (레이아웃)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#wrapper{min-width:1600px}
#header{z-index:1000;width:100%;background:#fff}
#header > .header_in{position:relative;padding:0;margin:0 auto;width:1600px;box-sizing:border-box;height:80px;}
#L_SITE_LOGO{float:left; height:80px}
#L_SITE_LOGO h1{font-size:0;line-height:80px}
#L_SITE_LOGO img{vertical-align:middle}

@media only screen and (max-width: 1600px){
    #wrapper{min-width:1280px}
	#header > .header_in{width:100%; padding:0 40px;}
	.navigation {padding-right:0px;}
}

@media only screen and (max-width: 1280px){
    #wrapper{min-width:320px}
    #header > div{width:100%}
	#header > .header_in{padding:0 20px;}
}

@media only screen and (max-width: 980px){
    #header > div{height:68px}
    #header > .header_in{height:68px}
    #header > .header_in h1{line-height:68px}
    #L_SITE_LOGO {text-align:left;margin-top:0;height:68px;}
    #L_SITE_LOGO a{display:inline-block;line-height:68px}
}

@media only screen and (max-width: 767px){
	#header > .header_in{padding:0 10px;}
	#L_SITE_LOGO img {height:50px !important;}
}

/* Navigation (상단 메뉴)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#gnb {z-index:999; text-align:right;}
.gnb-bg, .m-menu-close, .m-menu-open{display:none}
.sub-menu{display:none}
.navigation .menu-item > a {display:block;font-weight:400;color:#333; letter-spacing:0;}
.navigation .menu-item {position:relative; display:inline-block; margin-left:80px}
.navigation .menu-item:first-child{margin-left:0}

@media only screen and (max-width: 1280px){
    #gnb .login-menu{display:none}
    .sub-menu ul{margin:0 auto;width:100%}
}
@media only screen and (max-width: 1120px){
	.navigation .menu-item {margin-left:60px}
    .sub-menu{margin-left:-80px;min-width:160px;}
    .sub-menu li a{padding:10px 12px; font-size:15px;}
}

@media only screen and (min-width: 980px){
    #gnb .login-menu{display:none}
    .navigation {line-height:80px;}
    .navigation .menu-item > a{line-height:80px; font-size:19px}
    .sub-menu{z-index:999;position:absolute;top:80px;left:50%;margin-left:-100px;min-width:200px;border:1px solid #f1f1f1; border-top:4px solid #25428e}
    .sub-menu li{text-align:center;}
    .sub-menu li + li {border-top:1px solid #e2e2e2;}
    .sub-menu li:first-child{border-top:0}
    .sub-menu li a{position:relative; display:block; padding:12px 10px; font-weight:300; width:100%; box-sizing:border-box; text-align:center; line-height:130%;font-size:16px; color:#666; background:#fff;}
    .sub-menu li a:active,
    .sub-menu li a:hover{color:#25428e;background:#fbfbfb}
}

@media only screen and (max-width: 980px){
    #gnb{display:none;position:fixed;top:0;right:0;padding:48px 48px 0;width:100%;height:100%;box-sizing:border-box;background:#25428e}
    .m-menu-open{display:block;position:absolute;top:10px;right:0;padding:15px 10px;width:48px;height:48px;cursor:pointer}
    .m-menu-open span{display:block;margin-top:6px;width:100%;height:2px;background:#25428e;}
    .m-menu-open span:first-child{margin-top:0}
    .m-menu-close{z-index:1000;display:block;position:absolute;top:0;right:0;width:48px;height:48px;cursor:pointer;padding:15px 11px}
    .m-menu-close span{position:relative;top:7px;left:0;display:block;width:25px;height:2px;background:#fff;transform:rotate(45deg)}
    .m-menu-close span:first-child{transform:rotate(-45deg);top:9px}
    .navigation{border-top:1px solid #25428e;}
    .navigation .menu-item{position:relative;display:block;margin-left:0;text-align:left}
    .navigation .menu-item > a{padding:0;width:100%;line-height:50px;font-size:17px;transition:none;border-bottom:1px solid #4463b6;color:#fff}
    .navigation .menu-item.on > a{}
    .sub-menu {width:100%;background:#4463b6; margin:0; min-width:auto;}
    .sub-menu li {border-bottom:1px solid #25428e}
    .sub-menu li a{display:block;padding:0 20px;line-height:40px;font-size:14px;color:#fff}
    .sub-menu li a:before{display:inline-block;content:"";position:relative;top:-4px;margin-right:7px;width:5px;height:1px;background:#fff}
    .gnb-bg{z-index:888;display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5)}
}

/* Button (공통 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.btn{font-family:'ntkr',sans-serif;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:#3d427c;border-color:#3d427c;color:#fff}
.btn-custom:focus, .btn-custom:hover{background-color:#36384e;border-color:#36384e;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:#25428e}

/* Footer (하단메시지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#footer{width:100%; background-color:#333; padding:40px 0;}
.footer-area {position:relative; margin:0 auto;width:1600px;box-sizing:border-box; margin:0 auto; overflow:hidden;}
.footer-area h1 {float:left; width:100px; transition: .4s;}
.footer-area .desc {float:left; transition: .4s;}

.footer-menu {height:40px; padding:5px 0 0;}
.footer-menu li {font-size:15px; display:inline-block; margin-left:10px; padding-left:10px; line-height:10px; border-left:1px solid #c4c4c4;}
.footer-menu li:first-child {margin-left:0;padding-left:0;border-left:0; }
.footer-menu li a {line-height:10px; font-size:15px;color:#c4c4c4;}
.footer-menu li:first-child a {color:#fff;}

.footer-info {padding:0; line-height:180%; font-size:15px;color:#c4c4c4; word-break:keep-all;}
.footer-info span {color:#c4c4c4; font-size:0; display:inline-block; padding:0 6px;}
.footer-area .sns {position:absolute; top:0; right:0; transition: .4s;}
.footer-area .sns li {display:inline-block; padding:0 5px;}

@media only screen and (max-width:1600px){
    .footer-area{width:100%; padding:0 20px;}
	.footer-area .sns {right:20px;}
}

@media only screen and (max-width:980px){
	.footer-area h1 {float:none; width:100%; text-align:center; margin:0 0 20px;}
    .footer-area{box-sizing:border-box}
	.footer-area .desc {float:none; width:100%;}
    .footer-menu{text-align:center}
    .footer-info{text-align:center}
    .footer-info + p{text-align:center}
	.footer-info span.br {clear:both; display:block; font-size:0; padding:0;}
	.footer-area .sns {position:relative; width:100%; top:auto; right:auto; text-align:center; margin:0 0 20px;}
}

@media only screen and (max-width:767px){
	#footer{padding:30px 0;}
    .footer-area{padding:0 15px;}
	.footer-area h1 {float:none; width:100%; text-align:center; margin:0 0 15px;}
    .footer-menu li{margin-left:5px;padding-left:5px;  line-height:6px;}
    .footer-menu li a{font-size:13px}
    .footer-info {font-size:13px !important;}
	.footer-area .sns {margin:0 0 15px;}
}
@media only screen and (max-width:440px){
	#footer{padding:24px 0;}
    .footer-menu li a{font-size:12px}
    .footer-info {font-size:12px !important;}
}

/* Main Visual (메인이미지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.carousel-inner > .item {height:740px}
.carousel-inner > .item.main-img01 {background:url("/images/kor09r-22-0461/main/main_visual1.jpg") no-repeat center center/cover;}
.carousel-inner > .item.main-img02 {background:url("/images/kor09r-22-0461/main/main_visual2.jpg") no-repeat center center/cover;}
.carousel-inner > .item.main-img03 {background:url("/images/kor09r-22-0461/main/main_visual3.jpg") no-repeat center center/cover;}

.main-visual .carousel-caption {top:45%;bottom:auto;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);text-align:left;text-shadow:none; transition: .4s;}
.main-visual .carousel-caption p {font-family: 'S-CoreDream-5Medium', sans-serif; display:block; color:#000; font-size:34px; letter-spacing:-1.5px; line-height:120%; word-break:keep-all;}
.main-visual .carousel-caption p:last-child {display:block;  font-family: 'S-CoreDream-6Bold'; font-size:50px; color:#25428e; display:block; margin:20px 0 0;}

.carousel-indicators {bottom:-110px; height:86px; width:100%; text-align:center; margin:0; left:0;}
.carousel-indicators li {padding:0; display:inline-block; margin:0 5px !important; font-size:18px; color:#333333; width:140px !important; height:86px !important; padding:10px 0 0; border:0; border-top:4px solid #cbcbcb; text-align:center; border-radius:0px;text-indent:0; font-weight:400;}
.carousel-indicators .active {border-top:4px solid #de4e58; background:none; color:#de4e58;}

@media screen and (max-width:1280px){
    .carousel-inner > .item{height:680px}
	.main-visual .carousel-caption {left:0; width:100%; padding:0 20px; margin:0;}
	.main-visual .carousel-caption p {font-size:28px;}
	.main-visual .carousel-caption p:last-child {font-size:40px;margin:15px 0 0;}
}

@media screen and (max-width:980px){
    .carousel-inner > .item{height:600px}
	.carousel-indicators {height:100px;} 
	.carousel-indicators li {height:100px !important;}
}

@media screen and (max-width:767px){
	.carousel-inner > .item.main-img01 {background-position:68% center;}
    .carousel-inner > .item{height:450px}
	.main-visual .carousel-caption p {font-size:24px;}
	.main-visual .carousel-caption p:last-child {font-size:36px;margin:10px 0 0;}
	.main-visual .carousel-caption p strong {display:block;}
	
	.carousel-indicators {bottom:-100px; height:86px;}
	.carousel-indicators li {font-size:16px; margin:0 3px !important; width:120px !important; height:86px !important; padding:5px 0 0;}
}

@media screen and (max-width:480px){
    .main-visual .carousel-caption p {font-size:22px}
    .main-visual .carousel-caption p:last-child {font-size:38px;}
    .main-visual .carousel-caption p span:after {display:none;}

	.carousel-indicators {bottom:-80px; height:66px;}
	.carousel-indicators li {font-size:14px; margin:0 3px !important; width:94px !important; height:66px !important; padding:5px 0 0;}
}

@media screen and (max-width:340px){
	.carousel-indicators {display:none;}
}

/* Main Contents (메인 컨텐츠)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.main-contents {background:#fff; padding:20px 0 120px; transition: .4s;}
.main-contents .inc {width:1200px; margin:0 auto; overflow:hidden;}
.main-contents h2 {font-size:40px; color:#25428e; margin:0 0 40px; line-height:100%; letter-spacing:-2px; font-weight:700; word-break:keep-all; transition: .4s;}
.main-contents h2 span {display:block; letter-spacing:10px; font-weight:300; color:#999; font-size:13.5px;}

.main-contents .button {text-align:center; transition: .4s;}
.main-contents .button a {display:inline-block; padding:12px 60px; color:#fff; border:2px solid #25428e; background:#25428e; font-size:20px; font-weight:500; -moz-border-radius:50px; -webkit-border-radius:50px; border-radius:50px;}
.main-contents .button a:hover {background:#fff; color:#25428e;}

.gallery {position:relative; padding:130px 0; transition: .4s;}
.gallery .list {overflow:hidden;}

.story {position:relative; width:100%; height:360px; background:url(/images/kor09r-22-0461/main/main_banner.jpg) no-repeat center center/cover; transition: .4s;}
.story .box {position:absolute; top:50%; left:0; width:100%; -webkit-transform:translateY(-50%); -ms-transformY:translate(-50%); transform:translateY(-50%); text-align:center;}
.story .box .desc {}
.story .box .desc strong {font-size:32px; color:#25428e; font-family: 'GmarketSansBold'; display:block;}
.story .box .desc p {font-size:22px; color:#333333; line-height:180%; word-break:keep-all; margin:0 0 10px; }

.special {position:relative; padding:130px 0; transition: .4s;}
.special .list {overflow:hidden;}
.special .list li {float:left; width:32%; word-break:keep-all; text-align:center; font-weight:400; transition: .4s;}
.special .list li + li {margin-left:2%;}
.special .list li .img {position:relative; margin:0 0 20px; width:100%;}
.special .list li .img img {width:100%;}
.special .list li strong {display:block; margin:0 0 4px; font-size:24px; font-weight:500; color:#333;}
.special .list li p {font-size:17px; color:#666;}

.banner {position:relative; padding:110px 0; width:100%; background:url(/images/kor09r-22-0461/main/main_cs.jpg) no-repeat center center/cover; transition: .4s;}
.banner .box {float:left; height:280px; padding:35px 30px; text-align:center;}
.banner .box h3 {color:#fff; font-size:26px; font-weight:500; text-align:left; word-break:keep-all; margin:0 0 26px;}
.banner .box1 {width:438px;  background:rgba(0,0,0,0.38);}
.banner .box1 h3 a {float:right; font-size:30px; font-weight:100; line-height:1;}
.banner .box1 h3 a:hover {color:#fff;}
.banner .box1 ul {}
.banner .box1 ul li {position:relative; text-align:left; word-break:keep-all; line-height:120%; padding:0 0 0 14px; color:#fff; word-break:keep-all;}
.banner .box1 ul li:before {content:'·'; position:absolute; left:0; top:0; font-size:20px; font-weight:600;}
.banner .box1 ul li + li {margin-top:18px;}
.banner .box1 ul li a {color:#fff; font-size:17px;}
.banner .box2 {width:438px; margin-left:32px; background:rgba(0,0,0,0.38); text-align:left;}
.banner .box2 p.tel {font-weight:600; display:block; margin:0 0 10px;}
.banner .box2 p.tel a {font-size:35px; color:#00d8ff;}
.banner .box2 p {line-height:180%; font-size:17px; color:#fff; word-break:keep-all;}
.banner .box2 p a {color:#fff;}
.banner .box3 {width:260px; margin-left:32px; background:#fff;}
.banner .box3 h3 {color:#000; text-align:center;}
.banner .box3 a {max-width:200px; height:32px; line-height:32px; color:#fff; background:#25428e; border-radius:20px; display:block; margin:0 auto; font-size:16px;}

.patent {position:relative; padding:130px 0 0; transition: .4s;}
.patent .list {overflow:hidden;}


@media screen and (max-width:1200px){
	.main-contents {padding:20px 0 60px;}
	.main-contents .inc {width:100%;}
	.main-contents h2 {font-size:30px; margin:0 0 30px;}

	.gallery {padding:100px 20px;}

	.special {padding:100px 20px;}
	.special .list li strong {font-size:22px;}
	.special .list li p {font-size:16px;}

	.banner {padding:90px 20px;}
	.banner .box {padding:20px;}
	.banner .box h3 {font-size:24px;}
	.banner .box1 {width:36%;}
	.banner .box1 ul li a {font-size:15px;}
	.banner .box1 ul li:before {font-size:18px;}
	.banner .box2 {width:36%; margin-left:2%;}
	.banner .box2 p.tel a {font-size:30px;}
	.banner .box2 p {font-size:15px;}
	.banner .box3 {width:24%; margin-left:2%;}

	.patent {padding:100px 20px 0;}
}

@media screen and (max-width:980px){
	.main-contents {padding:20px 0 60px}
}

@media screen and (max-width:767px){
	.main-contents{padding:20px 0;}
	.main-contents h2 {font-size:24px; margin:0 0 30px; letter-spacing:0;}
	.main-contents h2 span {font-size:12px;}
	.main-contents .button a {padding:10px 40px; font-size:18px;}

	.gallery {padding:80px 15px;}

	.story {height:300px;}
	.story .box .desc {padding:0 20px;}
	.story .box .desc strong {font-size:24px;}
	.story .box .desc p {font-size:17px;}

	.banner {padding:80px 15px;}
	.banner .box {height:240px;}
	.banner .box h3 {font-size:24px;}
	.banner .box p {font-size:16px;}
	.banner .box1 {width:48.5%; margin:0 0 20px;}
	.banner .box2 {width:48.5%; margin:0 0 20px 3%;}
	.banner .box3 {float:none; clear:both; width:100%; height:auto; margin-left:0;}

	.special {padding:80px 15px;}
	.special .list li .img img {width:auto;}
	.special .list li strong {font-size:18px;}
	.special .list li p {font-size:15px;}

	.patent {padding:80px 15px 60px;}
}

@media screen and (max-width:560px){
	.special .list li {float:none; width:100%;}
	.special .list li + li {margin:40px 0 0;}
}

@media screen and (max-width:540px){
	.story .box h3 {font-size:36px;}
}

@media screen and (max-width:460px){
	.main-contents {padding:0}

	.banner .box h3 {text-align:center;}
	.banner .box p  {text-align:center;}
	.banner .box1 {float:none; width:100%; margin:0 0 20px;}
	.banner .box2 {float:none; width:100%; margin:0 0 20px;}

	.special .list li .img {margin:0 0 15px;}
	.special .list li + li {margin:30px 0 0;}

	.story {height:260px;}
	.story .box .desc strong {font-size:20px;}
	.story .box .desc p {font-size:16px;}
}