@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

#wrapper {position:relative; overflow:hidden;}

/* header */
#header {position:fixed; top:0; left:0; width:100%; height:100px; z-index:90; letter-spacing:-.04em; background:rgba(255,255,255,0.5); border-bottom:1px solid rgba(221,221,221,0.8);}
#header .contain {position:relative; max-width:1750px; margin:0 auto; z-index:20}
#header .sitelogo a {display:block; font-size:0; line-height:0; position:absolute; top:50%; left:15px; transform:translateY(-50%);}
.header-fixed #header {background:#fff;}

#gnb>ul {display:flex; justify-content:flex-end; margin-right:220px;} 
#gnb>ul>li {position:relative; text-align:center; padding:0 40px;}
/*#gnb>ul>li {position:relative; text-align:center; padding:0 35px;}*/
#gnb>ul>li>a {position:relative; display:inline-block; color:#242424; font-size:20px; line-height:100px; font-weight:700;}

#gnb>ul>li.active a {color:#d71921;}
#gnb>ul>li.active a:after {content:''; width:100%; height:1px; background:#d71921; left:50%; transform:translateX(-50%); bottom:30px; position:absolute;}

.contact {position:absolute; top:50%; transform:translateY(-50%); right:15px; background:#d71921; border-radius:10px;}
.contact a {font-size:20px; line-height:1.2em; color:#fff; font-weight:700; padding:; display:block; padding:12px; text-align:center;}

.contain {position:relative; max-width:1430px; padding-left:15px; padding-right:15px; margin:0 auto; height:inherit; letter-spacing:-.04em; z-index:1;}

/* main */
.section-common {position:relative; letter-spacing:-.03em; padding-top:100px; background-repeat:no-repeat; background-position:center center; background-size:cover;}

.section1 {height:100vh;}

.section1 .secting-img {position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; -ms-transform:scale(1.1); -webkit-transform:scale(1.1); transform:scale(1.1); -webkit-transition:all 0.9s; -ms-transition:all 0.9s; transition:all 0.9s; -webkit-transition-timing-function:ease; transition-timing-function:ease; z-index:2;}
.section1 .secting-img.visual-active {-ms-transform:scale(1) rotate(0.1deg); -webkit-transform:scale(1) rotate(0.1deg); transform:scale(1) rotate(0.1deg); -webkit-transition:all 10s; -ms-transition:all 10s; transition:all 10s; -webkit-transition-timing-function:ease; transition-timing-function:ease;}
.section1 .txt {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); padding:50px 30px; color:#000; background:rgba(248,248,248,0.5); text-align:center; letter-spacing:-.03em;}
.section1 .txt .tt1 {font-size:50px; font-weight:700; line-height:1.2em; margin-bottom:10px;} 
.section1 .txt .tt2 {margin-bottom:26px;}
.section1 .txt .tt3 {font-size:40px; line-height:1.3em;}

.section2 .wrap {display:flex; padding:100px 0;}
.section2 .wrap .box {width:50%; display:flex; align-items:center; flex-direction:column;}
.section2 .wrap .img-box {margin-bottom:36px;}
.section2 .wrap p {font-size:30px; color:#e8bf61; line-height:1.5em; text-shadow:5px 5px 5px rgba(0,0,0,0.3); font-weight:700; text-align:center;}
.section2 .wrap p span {font-size:24px; display:block;}

.section3 .wrap {padding:100px 0; text-align:center;}
.section3 .tit {margin-bottom:36px;}
.section3 .tit img {vertical-align:middle;}
.section3 .tit img.tit01 {margin-right:6px;}
.section3 .tit img.tit02 {margin-top:5px;}
.section3 .txt {font-weight:700;}
.section3 .txt h3 {font-size:38px; color:#d71921; line-height:1.3em; margin-bottom:16px;}
.section3 .txt p {font-size:24px; line-height:1.6em; color:#242424;}
.section3 .swiper-wrapper {align-items: center;}
.section3 .swiper-container {width:100%; height:100%; margin:0 auto 40px;}
.section3 .swiper-slide {width:800px;box-sizing:border-box; background:#fff;}
.section3 .swiper-slide {position:relative;}
.section3 .swiper-slide:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0;}
.section3 .item {width:800px;; position:relative;}
.section3 .item {position:relative;padding-bottom:35.715%;height:0;overflow:hidden;}
.section3 .item video {position:absolute; width:100%; height:100%; top:0; left:0; z-index:10; object-fit:cover;}
.section3 .item iframe {position:absolute; width:100%; height:100%; top:0; left:0; z-index:10; object-fit:cover;}
.section3 .button-arrow {width:59px; height:22px; position:absolute; top:50%; transform:translateY(-50%); background-size:cover; background-repeat:no-repeat; z-index:11; cursor:pointer;}
.section3 .button-prev {background-image:url('../images/bbs/button-prev.png'); left:120px;}
.section3 .button-next {background-image:url('../images/bbs/button-next.png'); right:120px;}
.section3 .button-prev:hover {background-image:url('../images/bbs/button-prev-on.png');}
.section3 .button-next:hover {background-image:url('../images/bbs/button-next-on.png');}

.section4 .wrap {padding:100px 0;}
.section4 .tit {font-size:50px; line-height:1.2em; color:#fff; margin-bottom:50px; text-align:center;}
.section4 .col {display:flex; align-items:center;}
.section4 .col .img-box {width:43%;}
.section4 .col .txt {width:57%; color:#fff;}
.section4 .col:nth-child(1) {background:#7e7d80;}
.section4 .col:nth-child(2) {background:#5d5c5e; flex-direction:row-reverse;}
.section4 .col:nth-child(3) {background:#353536;}
.section4 .col:nth-child(2) .txt {padding-left:65px;}
.section4 .col h3 {font-size:34px; line-height:1.2em; font-weight:600; padding-left:55px; position:relative; margin-bottom:20px;}
.section4 .col p {font-size:24px; line-height:1.5em; padding-left:55px;}
.section4 .col h3:before {content:''; width:42px; height:42px; position:absolute; top:0; left:0; background-repeat:no-repeat; background-size:cover;}
.section4 .col:nth-child(1) h3:before {background-image:url('/images/main/brand_num01.png');}
.section4 .col:nth-child(2) h3:before {background-image:url('/images/main/brand_num02.png');}
.section4 .col:nth-child(3) h3:before {background-image:url('/images/main/brand_num03.png');}

.section5 .wrap {padding:100px 0;}
.section5 .tit {font-size:50px; font-weight:700; line-height:1.2em; color:#242424; text-align:center; margin-bottom:40px;}
.section5 .original {margin-bottom:80px;}
.section5 .original ul {display:flex; margin-left:-20px;}
.section5 .original li {width:25%; margin-left:20px; position:relative; margin-top:40px;}
.section5 .original li .img-box img {border-radius:10px; overflow:hidden;}
.section5 .original li:hover {margin-top:0;}
.section5 .original li:hover .over {opacity:1;}
.section5 .original li .over {opacity:0; position:absolute; width:335px; height:335px; background:rgba(0,0,0,0.8); text-align:center; display:flex; top:0; left:0; border-radius:10px; flex-direction:column; justify-content:center; align-items:center;}
.section5 .original li .over h3 {font-size:30px; font-weight:700; line-height:1.2em; margin-bottom:16px; color:#d71921;}
.section5 .original li .over p {font-size:20px; font-weight:600; line-height:1.5em; color:#fff;}
.section5 .cnt h3 {font-size:45px; font-weight:700; color:#fff; line-height:1.6em; text-align:center; margin-bottom:80px;}
.section5 .cnt h3:before {content:''; width:71px; height:58px; vertical-align:middle; margin-right:15px; margin-top:-4px; background-image:url('../images/main/original_tit.png'); background-repeat:no-repeat; background-size:cover; display:inline-block;}
.section5 .cnt ul {display:flex;}
.section5 .cnt li {width:33.33333%; text-align:center;}

.section6 .tit {font-size:50px; color:#fff; line-height:1.2em; font-weight:700; text-align:center; margin-bottom:40px;}
.section6 .wrap {padding:80px 0 100px;}
.section6 .wrap ul {display:flex; flex-wrap:wrap; margin-bottom:-40px;}
.section6 .wrap li {width:25%; margin-bottom:40px;}
.section6 .wrap a {display:flex; flex-direction:column; align-items:center;}
.section6 .wrap .img-box {margin-bottom:24px;}
.section6 .wrap .tt {text-align:center; line-height:1.6em; font-weight:700;} 
.section6 .wrap .tt span {display:inline-block; font-size:20px; vertical-align:middle; color:#d71921; margin-right:6px;}
.section6 .wrap .tt span.block {display:block; margin-right:0; margin-bottom:6px;}
.section6 .wrap .tt p {display:inline-block; font-size:26px; color:#fff;}
.section6 .wrap .tt p strong.c_fcff00 {color:#fcff00; display:inline-block; margin-right:10px; font-size:24px;}
.section6 .wrap .tt p strong.bg_fff {display:inline-block; padding:5px; color:#242424;  background:#fff;}

.section7 .wrap {padding:90px 0 100px;}
.section7 .tit {font-size:50px; color:#242424; line-height:1.2em; font-weight:700; text-align:center; margin-bottom:50px;}
.section7 .cnt {display:flex;}
.section7 .box {width:50%; text-align:center;}
.section7 .exterior {padding-right:20px;}
.section7 .interior {padding-left:20px;}
.section7 h3 {font-size:28px; line-height:1.6em; color:#242424; margin-bottom:30px;}
.section7 .items {padding-bottom:43px;}
.section7 .slick-dots {position:absolute; bottom:0; left:50%; transform:translateX(-50%); display:flex; margin-left:-10px;}
.section7 .slick-dots li {margin-left:10px;}
.section7 .slick-dots li button {font-size:0; border:0; width:45px; height:3px; background:#231f20;}
.section7 .slick-dots li.slick-active button {background:#d71921;}

.section8 .wrap {padding:90px 0 100px;}
.section8 .tit {font-size:50px; line-height:1.2em; color:#fff; font-weight:700; text-align:center; margin-bottom:50px;}
.section8 ol {display:flex; flex-wrap:wrap; margin-left:-100px; margin-bottom:-100px;}
.section8 li {width:calc(33.333333% - 100px); margin-left:100px; margin-bottom:100px; background:#fff; text-align:center; display:flex; flex-direction:column; align-items:center; border-radius:10px; box-shadow:5px 5px 5px rgba(0,0,0,0.2);}
.section8 li h3 {font-size:30px; line-height:79px; border-bottom:1px solid #898989; text-align:center; width:100%;}
.section8 li h3:before {content:''; width:30px; height:30px; background-repeat:no-repeat; background-size:cover; display:inline-block; vertical-align:middle; margin-top:-5px; margin-right:8px;}
.section8 li:nth-child(1) h3:before {background-image:url('/images/main/step_num01.png');}
.section8 li:nth-child(2) h3:before {background-image:url('/images/main/step_num02.png');}
.section8 li:nth-child(3) h3:before {background-image:url('/images/main/step_num03.png');}
.section8 li:nth-child(4) h3:before {background-image:url('/images/main/step_num04.png');}
.section8 li:nth-child(5) h3:before {background-image:url('/images/main/step_num05.png');}
.section8 li:nth-child(6) h3:before {background-image:url('/images/main/step_num06.png');}
.section8 li p {font-size:22px; font-weight:600; color:#242424; line-height:1.6em; padding:50px 0;}

.section9 .wrap {padding:90px 0 100px;}
.section9 .tit {font-size:50px; line-height:1.2em; color:#242424; font-weight:700; text-align:center; margin-bottom:80px;}
.section9 .tit span {display:block; font-size:30px; line-height:1.5em; margin-top:16px;}
.section9 .cnt {display:flex;}
.section9 .table {padding-right:45px; width:50%;}
.section9 .table p {font-size:18px; font-weight:600; line-height:1.8em; color:#242424; text-align:right;}
.section9 table {width:100%; border-collapse:collapse; border-spacing:0; line-height:68px; text-align:center;}
.section9 table th {border:1px solid #ddd; background:#f8f8f8; font-size:22px; color:#242424;}
.section9 table th.bg_777777 {background:#777777; color:#fff;}
.section9 table th.bg_231f20 {background:#231f20; color:#fff;}
.section9 table th.bg_d61820 {background:#d61820; color:#fff;}
.section9 table th:first-child {border-left:0;}
.section9 table th:last-child {border-right:0;}
.section9 table td {border:1px solid #ddd; background:#fff; font-size:20px; font-weight:700;}
.section9 table td:last-child {border-right:0;}
.section9 .img-box {width:50%; padding-left:15px;}

.section10 .wrap {padding:0 0 100px;}
.section10 .tit {font-size:50px; line-height:1.2em; color:#242424; font-weight:700; text-align:center; margin-bottom:40px;}
.section10 .tit span {font-size:30px ;line-height:1.5em;}
.section10 ul {display:flex; flex-wrap:wrap; margin-bottom:-90px;}
.section10 li {width:25%; margin-bottom:90px; display:flex; flex-direction:column; align-items:center;}
.section10 li .img-box {margin-bottom:6px;}
.section10 li .txt {font-size:30px; line-height:1.2em; font-weight:700; color:#242424; text-align:center;}
.section10 li .txt span {display:block; font-size:20px; line-height:1.7em; margin-top:8px;}

.section11,
.section11 table,
.section11 input {font-family:'Noto Sans KR';}
.section11 .wrap {padding:90px 0 100px;}
.section11 .tit {font-size:50px; line-height:1.2em; color:#242424; font-weight:700; text-align:center; margin-bottom:50px;}

.detail-wrap {display:flex; max-width:1220px !important;}
.detail-img {width:68%; padding-right:20px;}
.detail-txt {background:#fff; width:32%; padding:50px 45px 0; color:#000;}
.detail-txt h3 {font-size:35px; line-height:1.2em; margin-bottom:30px; padding-bottom:20px; position:relative;}
.detail-txt h3:after {content:''; width:50px; height:3px; position:absolute; bottom:0; left:0; background:#d71921;}
.detail-txt p {font-size:20px; line-height:1.5em;}





/* footer */
#footer {background:#231f20; font-family:'Noto Sans KR'; color:#dcdcdc;}
#footer address {font-style:normal;}

.foot-group {display:flex; padding:30px 0 20px; align-items:center; justify-content:space-between;}
.foot-group ul {display:flex; margin-left:-40px;}
.foot-group ul li {margin-left:40px;}
.foot-group ul li a {display:block; padding-left:25px; position:relative;}
.foot-group ul li a:before {content:''; width:16px; height:15px; background-image:url('../images/bbs/foot-tit.png'); background-size:cover; background-repeat:no-repeat; position:absolute; top:8px; left:0;}

.foot-info {border-top:1px solid rgba(255,255,255,0.4); padding:20px 0;}
.foot-info address p {font-size:14px; line-height:1.4em;}
.foot-info address p strong {font-size:16px; font-weight:500;}
.foot-info address p span {margin:0 15px;}
.foot-info address p br {display:none;}
.foot-info address p:first-child {margin-bottom:8px;}
/* for mobile */
.only-mobile {display:none;}
.btn-m-menu {display:none; position:absolute; top:29px; right:15px; width:30px; height:22px;  text-align:center; text-indent:-9999em; z-index:220; transition:all 0.5s ease-in-out;}
.btn-m-menu span {position:absolute; right:0; top:50%; margin-top:-1px; height:2px; width:23px;background:#242424;}
.btn-m-menu span:before,
.btn-m-menu span:after {content:" "; position:absolute; right:0; width:30px; height:2px; background:#242424; transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s;}
.btn-m-menu span:before {top:-10px; transition-property:top, transform;}
.btn-m-menu span:after {bottom:-10px; transition-property:bottom, transform;}

.mobile-navigation {position:fixed; top:0; right:0; padding:80px 0; width:300px; height:100%; overflow:auto; transition:.3s ease-in-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:202;}
.mobile-navigation .nav-menu .contain {padding:0;}
.mobile-navigation .nav-menu ul li {border-bottom:1px solid #dfdfdf;}
.mobile-navigation .nav-menu ul li a {position:relative; padding:12px 15px; display:block; color:#2c2c2c; font-size:18px; font-weight:500; line-height:1.3em;}

.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:201;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0); }
html.menu-opened .mobile-overlay {display:block;}
html.menu-opened .btn-m-menu {top:20px; right:15px;}
html.menu-opened .btn-m-menu span {background:none;}
html.menu-opened .btn-m-menu span:before,
html.menu-opened .btn-m-menu span:after {transition-delay:0s, 0.3s; background:#414141;}
html.menu-opened .btn-m-menu span:before {top:0; transform:rotate(45deg);}
html.menu-opened .btn-m-menu span:after {bottom:0; transform:rotate(-45deg);}