@charset "utf-8";

.kv_img {background:url(../img/about/kv_img.jpg) center top no-repeat; background-size:cover;}

.contents_about .sec1 {padding:200px 0 220px 0;}
.contents_about .sec1 .tit {width:960px; color:#191a1b; font-family:'Montserrat-Medium'; font-size:60px; margin:0 auto;}

.contents_about .sec1 .txt_since {line-height:150px; margin-top:100px;}

/* 모션있을때 백업 */
/* .contents_about .sec1 .txt_since .txt {overflow:hidden; opacity:0.08; position:relative; height:90px; color:#191a1b; font-family:'Montserrat-SemiBold'; font-size:180px; text-align:center; transition:all 1.5s ease-in-out;}
.contents_about .sec1 .txt_since .txt span {position:absolute; left:50%; top:0; width:1010px; margin-left:-500px;}
.contents_about .sec1 .txt_since .txt1 {transform: translate(-100%, 0);}
.contents_about .sec1 .txt_since .txt1 span {margin-left:-450px}
.contents_about .sec1 .txt_since .txt2 {height:70px; border-top:1px solid #191a1b; transform: translate(100%, 0);}
.contents_about .sec1 .txt_since .txt2 span {top:-70px} */

.contents_about .sec1 .txt_since .txt {overflow:hidden; opacity:0.08; position:relative; color:#191a1b; font-family:'Montserrat-SemiBold'; font-size:180px; text-align:center; transition:all 1.5s ease-in-out;}

.contents_about .sec1 .txt_since.on .txt1 {transform: translate(0, 0);}
.contents_about .sec1 .txt_since.on .txt2 {transform: translate(0, 0);}

.contents_about .sec1 .info {width:960px; color:#8d8c8c; font-family:'NotoSansR'; font-size:18px; line-height:36px; margin:100px auto 0;}

.contents_about .sec2 .business {position:relative; width:100%;}
.contents_about .sec2 .business .business_nav {position:absolute; left:0; top:0; width:640px; height:640px; padding:150px 0 0 193px; background:#191a1b}
.contents_about .sec2 .business .business_nav .tit {color:#fff; font-family:'Montserrat-Medium'; font-size:60px;}
.contents_about .sec2 .business .business_nav .menu {margin-top:80px;}
.contents_about .sec2 .business .business_nav .menu li {margin-bottom:50px;}
.contents_about .sec2 .business .business_nav .menu li a {color:#8d8c8c; font-family:'Montserrat-Regular'; font-size:20px;}
.contents_about .sec2 .business .business_nav .menu li a.on {color:#fff}
.contents_about .sec2 .business .business_slide {overflow:hidden; margin-left:640px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper {overflow:hidden; width:1000%;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide {float:left; width:640px; height:640px; vertical-align:middle; padding:30px 0 0 70px; border-right:1px solid #e8e8e8;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide:last-child,
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide:nth-child(3) {border-right:0;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide .num {color:#191a1b; font-family:'Montserrat-Medium'; font-size:25px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide .img {text-align:center}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide .img img {width:100%;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide .img video {width:100%; max-width:570px}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl {padding-right:70px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dt {min-height:150px; color:#191a1b; font-family:'NotoSansR'; font-size:18px; line-height:36px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dt span {display:block; font-family:'NotoSansM'; font-size:30px; padding-bottom:20px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dd {color:#8d8c8c; font-family:'NotoSansR'; font-size:18px; line-height:36px;}
.contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide:nth-child(3) dl dd {line-height:26px}
.contents_about .sec2 .business .business_slide .swiper-paginatio {display:none;}

.contents_about .sec3 {padding:220px 0;}
.contents_about .sec3 .tit {width:960px; color:#191a1b; font-family:'Montserrat-Medium'; font-size:60px; margin:0 auto;}
.contents_about .sec3 .info {width:960px; color:#8d8c8c; font-family:'NotoSansR'; font-size:18px; line-height:36px; margin:40px auto 0;}
.contents_about .sec3 .img {position:relative; width:100%; text-align:center; margin-top:160px}
.contents_about .sec3 .img:before {content:''; display:block; position:absolute; left:0; top:50%; width:100%; height:1px; background:#e8e8e8}
.contents_about .sec3 .img img {z-index:10; position:relative; margin:0 auto;}

.contents_about .sec4 {padding:210px 0 200px 0; background:#191a1b;}
.contents_about .sec4 .tit {width:960px; color:#fff; font-family:'Montserrat-Medium'; font-size:60px; margin:0 auto;}
.contents_about .sec4 .awards_area {max-width:1080px; width:100%; font-size:0; padding:0 20px; margin:150px auto 0;}
.contents_about .sec4 .awards_area ul li {display:inline-block; max-width:240px; width:23.1%; margin:0 0.92% 20px 0.92%;}
.contents_about .sec4 .awards_area ul li img {width:100%}
/* .contents_about .sec4 .awards_area ul li .inner { width:200px; height:270px; padding-left:20px; border:1px solid #323232} */
.contents_about .sec4 .awards_area ul li .mark {height:160px; padding-top:40px;}
.contents_about .sec4 .awards_area ul li .name {color:#fff; font-family:'Montserrat-Medium'; font-size:12px;}
.contents_about .sec4 .awards_area ul li .txt {color:#8d8c8c; font-family:'Montserrat-Regular'; font-size:10px; line-height:20px; margin-top:20px;}

.contents_about .sec4 .awards_area ul li:first-child {margin-left:25%;}
.contents_about .sec4 .awards_area ul li:nth-child(3) {margin-right:25%}
.contents_about .sec4 .awards_area ul li:nth-child(6) {margin-left:25%;}
.contents_about .sec4 .awards_area ul li:nth-child(7) {display:block; margin-left:49%;}

.contents_about .sec5 {padding:210px 0 200px 0;}
.contents_about .sec5 .tit {width:960px; color:#191a1b; font-family:'Montserrat-Medium'; font-size:60px; margin:0 auto;}
.contents_about .sec5 .img {text-align:center; margin-top:120px}
.contents_about .sec5 .img img {max-width:100%; margin:0 auto}





/* tablet */
@media all and (max-width:1200px) {
    .contents_about .sec1 .info {width:100%;}
    .contents_about .sec2 .business {overflow:hidden;}
    .contents_about .sec2 .business .business_nav {position:relative; float:left; width:50%; padding:10% 0 0 10%}
    .contents_about .sec2 .business .business_slide {float:left; width:50%; margin-left:0;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide:last-child {display:none;}

    .contents_about .sec3 {}
    .contents_about .sec3 .tit {width:100%;}
    .contents_about .sec3 .info {width:100%;}
    .contents_about .sec3 .img img {width:84.91%;}
}

/* mobile */
@media all and (max-width:720px) {
    .contents_about .sec1 {padding:50px 30px; margin:0;}
    .contents_about .sec1 .tit {width:auto; font-size:35px}
    .contents_about .sec1 .txt_since {line-height:50px; margin:50px -30px 0}
    .contents_about .sec1 .txt_since .txt {font-size:55px;}
    .contents_about .sec1 .txt_since .txt span {left:0; width:100%; margin:0;}
    .contents_about .sec1 .txt_since .txt2 span {top:-20px}
    .contents_about .sec1 .info {width:100%; font-size:13px; line-height:21px; margin-top:50px;}

    .contents_about .sec2 {padding-bottom:60px}
    .contents_about .sec2 .business .business_nav {float:none; width:100%; height:auto; padding:50px 0 50px 30px}
    .contents_about .sec2 .business .business_slide {float:none; width:100%;}
    .contents_about .sec2 .business .business_nav .tit {font-size:35px;}
    .contents_about .sec2 .business .business_nav .menu {margin-top:25px;}
    .contents_about .sec2 .business .business_nav .menu li {margin-bottom:20px;}
    .contents_about .sec2 .business .business_nav .menu li a {font-size:13px;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper {overflow:initial; display:flex; width:100%;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide {float:none; flex-shrink:0; width:100%; height:auto; padding:35px 30px; border:0;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dt {min-height:auto; line-height:21px;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dt span {font-size:20px; padding-bottom:15px;}
    .contents_about .sec2 .business .business_slide .swiper-wrapper .swiper-slide dl dd {font-size:13px; line-height:21px; margin-top:20px;}

    .contents_about .sec2 .business .business_slide .swiper-pagination {display:block; padding-left:30px;}
    .contents_about .sec2 .business .business_slide .swiper-pagination span {display:inline-block; width:6px; height:6px; border-radius:6px; vertical-align:middle; margin-right:10px; background:#ccc}
    .contents_about .sec2 .business .business_slide .swiper-pagination span.swiper-pagination-bullet-active {width:10px; height:10px; border-radius:10px; background:#191a1b}

    .contents_about .sec3 {padding:0 30px 60px}
    .contents_about .sec3 .tit {width:100%; font-size:35px;}
    .contents_about .sec3 .info {width:100%; font-size:13px; line-height:21px; margin-top:25px;}
    .contents_about .sec3 .img {margin-top:50px}
    .contents_about .sec3 .img:before {left:-50%; width:200%;}

    .contents_about .sec4 {padding:50px 20px}
    .contents_about .sec4 .tit {font-size:35px}
    .contents_about .sec4 .awards_area {width:100%; margin:50px 0 0 0;}
    .contents_about .sec4 .awards_area ul li {width:50%; padding:0 10px 20px; margin:0 !important;}
    .contents_about .sec4 .awards_area ul li .inner {width:100%; height:auto;}
    .contents_about .sec4 .awards_area ul li .inner .mark {padding-top:20px;}
    .contents_about .sec4 .awards_area ul li .inner .mark img {width:auto}
    .contents_about .sec4 .awards_area ul li .name {font-size:15px;}
    .contents_about .sec4 .awards_area ul li .txt {font-size:13px;}

    .contents_about .sec5 {padding:50px 30px}
    .contents_about .sec5 .tit {font-size:35px}
    .contents_about .sec5 .img {margin-top:70px}
}