@charset "UTF-8";

.sub-vis {position:relative; width:100%; height:689px; z-index:1;overflow:hidden;}
.sub-vis .content {position:absolute; top:50%; transform: translateY(-50%); text-align:center; color:#fff; left:0; width:100%; padding:0 30px; z-index:10}
.sub-vis .content .location-nav {margin-bottom: 10px; }
.sub-vis .content .location-nav ul {display:inline-flex; align-items: center; height:36px; border-radius: 36px; background:rgba(0,0,0,.60); padding-right:10px;}
.sub-vis .content .location-nav ul li {padding:0 16px; position: relative; font-size:18px; line-height:1.4em; color:#fff;}
.sub-vis .content .location-nav ul li:after {content:""; position: absolute; top:50%; left:0; width:1px; height:14px; background:#fff; margin-top:-7px;}
.sub-vis .content .location-nav ul li:first-child:after {display:none;}
.sub-vis .content .location-nav ul li.home {width:60px; height:inherit; background:url('../img/common/ico_home.png') 50% 50% no-repeat; padding:0;}
.sub-vis .content h2 {font-size:80px; line-height:1.3em; font-weight: 700; margin-bottom:10px;}
.sub-vis .content .cnt {font-size:24px; line-height:1.5em; font-weight: 600;}
.sub-vis .background {position:absolute; top:0; left:0; width:100%; height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; transform:scale(1.09); -ms-transform:scale(1.09); -moz-transform:scale(1.09); -webkit-transform:scale(1.09); -o-transform:scale(1.09); transition: all 2s ease-out 0s; transition-delay: 0.1s; z-index:0;}
.sub-vis.load .background {transform:scale(1); -ms-transform:scale(1); -moz-transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1);}



#lnb {margin-bottom:140px; background:#fff; border-bottom: 1px solid #c9c9c9; position: relative; z-index:10;}
.lnb {max-width:1440px; margin:0 auto; padding:0 20px; text-align:center;}
.lnb ul {display:flex;}
.lnb ul li {width:auto; flex:1; text-align:center;}
.lnb ul li a {position: relative; display:flex; align-items:center; justify-content: center; height:70px; color:#444; font-size:20px; line-height:1.4em; }
.lnb ul li a:after {content:""; position: absolute; bottom:0; left:0; width:100%; height:3px; background:#1d2088; opacity:0;}
.lnb ul li.active a {color:#1d2088; font-weight: 700;}
.lnb ul li.active a:after {opacity:1;}



/* content */
#contArea {position:relative; max-width:1440px; width:100%; padding:0 20px; margin:0 auto;}
#contArea.wide {max-width:100%; padding:0;}

.real-cont {padding-bottom:150px;}
.real-cont.none {padding-bottom:0;}

.corporate-inner {margin-bottom:45px;}
.corporate-inner .head {font-size:40px; line-height:1.4em; margin-bottom:20px; color:#333;} 
.corporate-inner .info {padding-left: 115px;}
.corporate-inner .info .tit {margin-bottom:45px; color:#333; font-size:50px; line-height:1.4em; font-weight: 700;}
.corporate-inner .info .tit span {display:inline-block; position: relative;}
.corporate-inner .info .tit span:after {content: ''; position:absolute; bottom:0; left:0; width:0; height:30px; background:#e8e8f3; z-index:-1; transition: width 1s ease-out;}
.corporate-inner .info .tit span.animate:after {width:100%;}
.corporate-inner .info .cnt {margin-bottom:20px; font-size:20px; line-height:1.5em; color:#222;}
.corporate-inner .info .cnt.bold {font-weight: 700;}
.corporate-inner .info .cnt.name {font-weight: 700; font-size:1.8rem}
.corporate-inner .info .cnt:last-child {margin-bottom:0;}
.corporate-image ul {display:flex; margin:0 -20px;}
.corporate-image ul li {padding: 0 20px; margin-top:80px;}
.corporate-image ul li .pic {border-radius:26px; overflow: hidden;}
.corporate-image ul li .pic img {width:100%;}
.corporate-image ul li:nth-child(even) {margin-top:0;}




.history {position: relative; z-index:2; padding-bottom:690px;}
.history .inner {display:flex;}
.history .title {width:50%; color:#333; padding-right:50px;}
.history .title p {font-size:30px; line-height:1.2em;  margin-bottom:30px;}
.history .title .tit {font-size:40px; line-height:1.3em; font-weight: 700;}
.history .his-info {width:50%;}
.history .his-info ul {padding-bottom: 54px; position:relative;}
.history .his-info ul:last-child {padding-bottom:0;}
.history .his-info ul:after {content:""; position:absolute; top:13px; left:152px; width:1px; height: 100%; background:#1d2088; opacity:.50; z-index:0;}
.history .his-info ul:last-child:after {display:none;}
.history .his-info ul li {  display:flex; color:#222;}
.history .his-info ul li .year {width:142px; font-size:36px; line-height:1.4em; font-weight: 700;}
.history .his-info ul li .info {position:relative; padding-left: 45px; padding-top:10px; flex:1 1 auto; min-width:0; width:1%;}
.history .his-info ul li .info:before {content:""; position:absolute; top:13px; left:0; width:20px; height: 20px; border-radius:100%; background:#fff; border:3px solid #1d2088; z-index:2;}
.history .his-info ul li .info dl dd {position:relative; padding-left:18px; font-size:18px; line-height:1.4em; color:#222; margin-bottom:10px;}
.history .his-info ul li .info dl dd:before {content:""; position:absolute; top:8px; left:0; width:6px; height: 6px; border-radius:100%; background:#959595; z-index:2;}
.history .his-info ul li .info dl dd:last-child {margin-bottom:0;}
.history-bg {position:absolute; bottom:0; left:0; width:100%; height:1100px; background:url('../img/sub/history_bg.jpg') 50% 100% no-repeat; background-size:cover; z-index:-1;}

.vision-head {margin-bottom: 110px; color:#222;}
.vision-head .inner {display:flex;}
.vision-head .title {width:50%; font-size:36px; line-height:1.3em;font-weight: 700;  padding-right:30px;}
.vision-head .info {width:50%; font-size:24px; line-height:1.25em;}

.vision-image {background:url('../img/sub/vision_bg.jpg') 50% 50% no-repeat; background-size:cover; text-align: center; height:710px; display:flex; align-items: center; justify-content: center;}
.vision-image .tit {font-size:60px; line-height:1.4em; font-weight: 700; color:#fff;}

.org-inner {background: linear-gradient(0deg,rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 0) 100%); padding-bottom:80px;}
.org-inner .inner {display:flex; position: relative; padding-top:50px;}
.org-inner .simbol {position:absolute; top:0; left:0; width:100%; height:100%; background:url('../img/sub/org_simbol.png') 50% 0 no-repeat; z-index:0;}
.org-inner .org-col {width:50%; text-align:center; z-index:2; position: relative;}
.org-inner .org-col:nth-child(1) {padding-right:50px;}
.org-inner .org-col:nth-child(2) {padding-left:50px;}

.org-ani {position:relative; color:#fff; margin-top:100px;text-align:right; height:1em; font-size:8rem; line-height:1em; font-weight:700; overflow:hidden;}
.org-ani ul {position:absolute; top:0; left:0; display:flex; width:4400px}
.org-ani ul li {padding:0 20px;animation: aniText 15s linear infinite; white-space: nowrap; opacity:.50;}
@keyframes aniText {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

.product-inner {position: relative;}
.prod-photo {width:780px; position:absolute; top:0; left:0; will-change: transform; transition: transform 0.6s ease-out, opacity 0.3s ease-out;}
.prod-photo:after {content:""; position:absolute; top:-140px; left:-560px; width:1100px; height: 820px; border-radius: 0 0 26px 0; background:#f5f5f5; z-index:-1}
.prod-photo .photoSlider {margin-right: 80px;}
.prod-photo .photoSlider .thumb {position:relative; padding-bottom:82.4%; border-radius: 26px; overflow:hidden;}
.prod-photo .photoSlider .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.prod-photo .slick-dots {margin-top: 20px; position: static; display:flex; align-items: center; justify-content: center;}
.prod-photo .slick-dots li {margin: 0 8px; width:auto; height: auto;}
.prod-photo .slick-dots li button {border:0; width:14px; height: 14px; border-radius: 100%; background:#b6b6b6;}
.prod-photo .slick-dots li.slick-active button {background:#252525}
.prod-photo .slick-arrow {position:absolute; top:50%; width:48px; height: 48px; z-index:10;border-radius: 100%; background-color:#fff; background-repeat:no-repeat; background-position: 50% 50%; background-size:contain; border:1px solid #747474;}
.prod-photo .slick-arrow:before {display:none;}
.prod-photo .slick-arrow.slick-prev {background-image:url('../img/sub/slide_bt_prev.png'); left:-24px;}
.prod-photo .slick-arrow.slick-next {background-image:url('../img/sub/slide_bt_next.png'); right:-24px;}

@media (max-width: 1920px) {
	
    .prod-photo:after {left:-260px; width:780px;}
}

.prod-info {margin-left: auto; width: calc(100% - 780px); will-change: transform;}
.prod-info h3 {font-size:48px; line-height:1.4em; color:#333; font-weight: 700; margin-bottom: 40px;}
.prod-info .group {margin-bottom: 45px;}
.prod-info .group:last-child {margin-bottom:0;}
.prod-info .group h4 {display:inline-flex; align-items: center;  color:#fff;padding:0 25px; background:#1d2088; height: 46px; border-radius: 46px; font-size:20px; line-height:1.4em; font-weight: 700; margin-bottom:25px;}
.prod-info .group .content {font-size:18px; line-height:1.67em; color:#222; padding-left:22px;}
.prod-info .group .content strong {font-weight: 600;}
.prod-info .group .content .cnt {margin-bottom: 30px;}
.prod-info .group .content .cnt:last-child {margin-bottom:0;}
.prod-info .group .content ul li {position: relative; padding-left:16px; }
.prod-info .group .content ul li:before {content:""; position:absolute; top:11px; left:0; width:6px; height: 6px; border-radius:100%; background:#959595; z-index:2;}
.prod-info .group .content dl dd {position: relative; padding-left: 32px; font-weight: 600; margin-bottom:10px;}
.prod-info .group .content dl dd:last-child {margin-bottom:0;}
.prod-info .group .content dl dd:before {content:""; position:absolute; top:5px; left:0; width:21px; height: 21px; background-repeat:no-repeat; background-position: 50% 50%; background-size:contain;}
.prod-info .group .content dl dd.mail:before {background-image:url('../img/sub/ico_mail.png');}
.prod-info .group .content dl dd.tel:before {background-image:url('../img/sub/ico_tel.png');}
.prod-info .group .contact-box {font-size:18px; line-height:1.4em; font-weight: 700; background:url('../img/sub/contact_bg.jpg') 50% 50% no-repeat; margin-top:30px; background-size:cover; border-radius: 14px; overflow:hidden; padding: 50px 58px 30px; color:#fff;}
.prod-info .group .contact-box p {color:#fff; margin-bottom:20px;}
.prod-info .group .contact-box .links {display:inline-flex; align-items: center; height:46px; border-radius: 46px; background:rgba(0,0,0,.60); border:1px solid rgba(255,255,255,.60); color:#fff; padding:0 30px;}
.prod-info .group .contact-box .links:after {content:""; display:inline-flex; align-items: center; width:63px; height:100%; background:url('../img/sub/more.png') 50% 60% no-repeat; background-size:contain; margin-left:20px;}
.prod-info .group .contact-box .links:hover {background:rgba(0,0,0,1); border:1px solid rgba(255,255,255,1);}
.prod-info .btns a {display:inline-flex; align-items:center; height:40px; padding:0 25px; border-radius: 40px; font-size:18px; line-height:1.4em; font-weight: 600; border:1px solid #b7b7b7;}
.prod-info .btns a:after {content:""; display:inline-flex; align-items: center; width:12px; height: 12px; background:url('../img/sub/ico_link_more.png') 50% 50% no-repeat; background-size:contain; margin-left:12px;}

.location .group {margin-bottom: 100px;}
.location .group:last-child {margin-bottom:0;}
.location h3 {font-size:40px; line-height:1.4em; color:#333;font-weight: 700; margin-bottom: 26px;}
.location ul {display:flex; margin:0 -24px;}
.location ul li {padding:0 24px; display: flex; align-items: center; font-size:18px; line-height:1.4em; color:#222;}
.location ul li .ico {width:65px; height: 65px; border-radius:100%; overflow:hidden; margin-right: 10px; background:#e3e3f2;}
.location ul li .info {flex:1 1 auto; min-width:0; width:1%;}
.location ul li .info dl dt {color:#1d2088; font-weight: 700; margin-bottom:2px;}
.location .map-inner {margin-top:26px;}
.location .map-inner iframe {width:100% !important; height:400px !important;}

 /* contact us */
 .required {color:#f15922; padding-right:4px;}


.mailform-tit {font-size:30px; line-height:1.4em; font-weight: 500; color:#222; margin-bottom: 20px;}

.mailform {border-top: 1px solid #747474; padding:25px 0; border-bottom: 1px solid #c3c3c3;}
.mailform .input {height:56px; width:100%; border:1px solid #d6d6d6; background-color:#fff; color:#222; font-size:18px; border-radius:6px; padding:5px 15px;}
.mailform textarea.input {height:200px; padding:20px 20px; background-color:#fff; border:1px solid #d6d6d6; border-radius: 6px;}
.mailform .form-group {display:flex; align-items:center; margin:0 -20px 30px; }
.mailform .form-group:last-child {margin-bottom:0;}
.mailform .form-group .form-col {position:relative; width:50%; padding:0 20px;}
.mailform .form-group .tit {color:#222; font-size:18px; line-height:1.4em; margin-bottom:10px; font-weight: 600;}
.mailform .form-group.wide {display:block;}
.mailform .form-group.wide .form-col {width:100%;}
.mailform .form-group.code .form-col {width:50%;}
.mailform .required {vertical-align:middle;}
.mailform .privacy_box--fc {margin-bottom:10px; border:1px solid #d6d6d6; border-radius:4px; font-size:18px; line-height:1.4em; display:flex; color:rgba(0,0,0,.80); min-height:100px; padding:30px 40px; background:#fff;}
.mailform .privacy_box--fc pre {font-family: "Pretendard", sans-serif !important;}
.mailform input[type="checkbox"] + label {font-size:18px; padding-left:32px; line-height:1.4em; padding-top:1px; color:#222; font-weight: 500;}
.mailform input[type="checkbox"] + label:before {content:""; top:0; background-color:#fff; width:26px; height:26px; border-radius:4px; border:1px solid #d6d6d6; background-position:50% 50%; background-repeat: no-repeat;}
.mailform input[type="checkbox"]:checked  + label:before {background-color:#1d2088;background-image:url('../img/bbs/checkbox_on.png'); border-color:#1d2088;}
.mailform .captcha_box--fc {display:flex; align-items: center;}
.mailform .captcha_box--fc a {border:0; margin: 0 10px;}
.mailform .captcha_box--fc input { width:100%; height:56px; border:1px solid #d6d6d6; border-radius: 6px;  color:#222; font-size:18px; padding-left:20px;}

.filebox {position:relative; display:flex;}
.filebox label {width:160px; margin-right:10px; height:100%; background: #707070; color:#fff; text-align:center; font-size:1.2rem; line-height:56px; border-radius: 6px; transition: .3s;}
.filebox label:hover {background:#1d2088;}
.filebox .upload-name {height:56px; background:#fff; border:1px solid #d6d6d6; border-radius: 6px;  width:100%; padding:0 20px 0; font-size:18px; line-height:1.4em;}
.mailform + .buttons {margin-top:60px;}

.buttons {margin:30px 0;}
.buttons:after {content:" "; display:block; clear:both;}
.buttons .cen {text-align:center;}
.buttons .cen .btn-pack {margin:0 2px;}
.buttons .fr {float:right;}
.buttons .fl {float:left;}
.buttons a {text-decoration:none;}
.buttons a,.buttons input {vertical-align:top;}
.buttons + .paginate {margin-top:20px;}

.btn-pack {display:inline-block !important; text-align:center !important; position:relative;margin:0;padding:0 10px;background:#f2f2f2;color:#151515;border:1px solid #151515;text-decoration:none !important;vertical-align:top;white-space:nowrap;cursor:pointer;box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
.btn-pack.form-submit {width:200px; height:60px; border-radius:60px; border:0; background:#1d2088; font-size:18px; line-height:60px; color:#fff;font-weight:600; padding:0 30px;}