@charset "utf-8";


#main{padding:0px 20px 40px;}
#main .main-slide{margin:0 -20px;position: relative;}
#main .main-slide .slick-slide{}
#main .main-slide .slick-slide img{display: block;width:100%;}
#main .main-slide .slick-dots{position: absolute;bottom:40px;left:0;width:100%;text-align: center;font-size:0;}
#main .main-slide .slick-dots li{display: inline-block;width:27px;height:6px;}
#main .main-slide .slick-dots li + li{margin-left:9px;}
#main .main-slide .slick-dots li button{display: block;width:100%;height:100%;background: #fff;opacity:0.5;font-size:0; }
#main .main-slide .slick-dots li.slick-active button{opacity: 1;}
#main .main-title{font-family:"SEOULMILK";display:inline-block;position: relative;font-size: 14px;font-weight: normal;letter-spacing: -0.72px;color: #393939;}
#main .main-title:before{content: "";display: inline-block;width:100%;height:2px;background: #222;}
#main .main-txt{font-family:"SEOULMILK";margin-top:58px;position: relative;font-size:25px;font-weight: normal;line-height: 1.41;letter-spacing: -1.22px;color:#393939;word-break: keep-all;}
#main .main-txt span{display: block;margin-top: 10px;font-size: 16px;font-family: "SEOULMILK";font-weight: 300;color: #a0a0a0;}
#main .main-txt .video-box{position: relative;margin-top:20px;padding:0 20px 70px 0;}
#main .main-txt .video-box i{position: absolute;width: 100px;right: 0;bottom: 0;}
#main .progress-bar {position:absolute; right:20px; bottom:20px;}
#main .main-video {position:relative;overflow: hidden;margin:0 -20px;}
#main .main-video video {width:100%;}
#main .main-video .controller {position:absolute; right:100px; bottom:50px;}
#main .state_bar {position:relative; display:inline-block; width:300px; height: 2px; background-color: #c8c8c8;vertical-align: middle;}	
#main .state_bar .now {position:absolute; left:0; top:0;width: 0%; height: 2px; background-color: #000;}
#main .start_stop {display:inline-block;position:absolute; left: 9px; top: 8px; width:50px; height:50px; background-size:100% 100%; font-size:0; background-repeat:no-repeat; background-image:url('../images/icon/stop.png');vertical-align: middle;}
#main .start_stop.stop { background-image:url('../images/icon/play.png');}

#main .video-wrap {margin:  100px auto; width: 1599px;}
#main .video-wrap .video_area{display:inline-block; position: relative;vertical-align: top;}
#main .video-wrap .video_area video {width: 100%; height: auto;}
#main .video-wrap .video_area .sticker {position: absolute ;right: -67px; bottom: -172px;transform:translate(0px, -30px);}
#main .video-wrap .v_box {width: 730px;height: 410px;border-radius:18px; overflow:hidden;}
#main .video-wrap .txt_area {display:inline-block; margin-left:180px; vertical-align:top;}
#main .video-wrap .big_txt{font-size:44px;font-family:"SEOULMILK"; line-height:60px; color:#393939;}
#main .video-wrap .txt {margin-top:30px; font-size:24px;font-family:"SEOULMILK"; font-weight:300; line-height:40px; color:#a0a0a0;}
#main .video-wrap .more_btn {margin-top:54px; text-align:right;}
#main .video-wrap .more_btn a{display:inline-block; padding-right:20px; font-size:16px;font-family:"SEOULMILK"; border-bottom:2px solid #222222; background:url('../images/contents/icon_plus.png') no-repeat; background-position:right 4px; color:#222222;}


#main .main-about{margin-top:45px;}
#main .main-about h4{font-family:"SEOULMILK";margin-top:20px;font-size:25px;font-weight: normal;line-height: 1.36;letter-spacing: -1.76px;color: #222;}
#main .main-about p{font-family:"SEOULMILK";margin-top:10px;font-size: 16px;font-weight: 300;line-height: 1.67;letter-spacing: -0.96px;color: #a0a0a0;}
#main .main-about .slide-wrap{margin-top:25px;position: relative}
#main .main-about .about-slider{height:auto;}
#main .main-about .about-slider .slick-slide{height:auto;}
#main .main-about .about-slider .slick-slide p{font-weight: 400;text-align: center;font-size:16px;}
#main .main-about .about-slider .slick-slide:hover p{color:#222;}
#main .main-about .about-slider .slick-arrow{position: absolute;bottom:-40px;width:20px;height:20px;font-size:0;}
#main .main-about .about-slider .slick-prev{background: url(../images/main/slick_arrow1.png) no-repeat;background-size: cover;left: 50%;transform: translateX(-50%);margin-left: -45px;}
#main .main-about .about-slider .slick-next{background: url(../images/main/slick_arrow2.png) no-repeat;background-size: cover;left: 50%;transform: translateX(-50%);margin-left: 45px;}
#main .main-about .pagingInfo{margin-top:20px;font-size: 14px;font-weight: normal;letter-spacing: -0.64px;color: #b7b7b7;font-family:"SEOULMILK";display: flex;align-items: center;justify-content: center;}
#main .main-about .pagingInfo em{color:#222;font-family:"SEOULMILK";}
#main .main-about .pagingInfo i{display: inline-block;margin:0 10px;width:1px;height:15px;background: #b7b7b7;}
#main .main-product{margin-top:50px;}
#main .main-product .hgroup{}
#main .main-product .hgroup h3{font-family:"SEOULMILK";margin-top:20px;font-size:25px;font-weight: normal;line-height: 1.36;letter-spacing: -1.76px;color: #222;}
#main .main-product .hgroup .txt{font-family:"SEOULMILK";margin-top:10px;font-size: 16px;font-weight: 300;line-height: 1.67;letter-spacing: -0.96px;color: #a0a0a0;}
#main .main-product .product-slide{margin-top:20px;height:auto;}
#main .main-product .product-slide .slick-slide{height:auto;}
#main .main-product .product-slide .slick-dots{margin-top:10px;display: flex;justify-content: center;}
#main .main-product .product-slide .slick-dots li{display: inline-block;width:10px;height:10px;}
#main .main-product .product-slide .slick-dots li + li{margin-left:3px;}
#main .main-product .product-slide .slick-dots li button{display: block;width:100%;height:100%;border-radius: 100%;border:1px solid #000;background: #fff;font-size:0;}
#main .main-product .product-slide .slick-dots li.slick-active button{background: #000;}
#main .main-product .product-slide .slick-arrow{position: absolute;bottom:-40px;width:20px;height:20px;font-size:0;}
#main .main-product .product-slide .slick-prev{background: url(../images/main/slick_arrow1.png) no-repeat;background-size: cover;left: 50%;transform: translateX(-50%);margin-left: -45px;}
#main .main-product .product-slide .slick-next{background: url(../images/main/slick_arrow2.png) no-repeat;background-size: cover;left: 50%;transform: translateX(-50%);margin-left: 45px;}
#main .main-product .slick-slide {height:auto;}
#main .main-product .slick-slide h4{margin-top:10px;font-weight: 400;    font-family: "SEOULMILK";text-align: center;font-size: 16px; line-height: 1.67;letter-spacing: -0.96px;color: #a0a0a0;}
#main .main-product .pagingInfo{margin-top:20px;font-size: 14px;font-weight: normal;letter-spacing: -0.64px;color: #b7b7b7;font-family:"SEOULMILK";display: flex;align-items: center;justify-content: center;}
#main .main-product .pagingInfo em{color:#222;font-family:"SEOULMILK";}
#main .main-product .pagingInfo i{display: inline-block;margin:0 10px;width:1px;height:15px;background: #b7b7b7;}

#main .main-esg{margin-top:50px;}
#main .main-esg .hgroup{}
#main .main-esg .hgroup h3{font-family:"SEOULMILK";margin-top:20px;font-size: 25px;font-weight: normal;letter-spacing: -1.76px;color: #393939;word-break: keep-all;}
#main .main-esg .hgroup .txt{font-family:"SEOULMILK";margin-top:10px;font-size: 16px;font-weight: 300;letter-spacing: -0.96px;color: #a0a0a0;word-break: keep-all;}
#main .main-esg figure{margin-top:20px;}
#main .main-esg figure img{display: block;width:100%;}
#main .main-esg ul{margin:50px -2% 0;font-size:0;}
#main .main-esg ul li{display: inline-block;width:46%;margin:2%;}
#main .main-esg ul li a{display: block;}
#main .main-esg ul li a img{display: block;width:100%;}
#main .main-news{margin-top:50px;}
#main .main-news .hgroup h3{font-family:"SEOULMILK";margin-top:20px;font-size: 25px;font-weight: normal;letter-spacing: -1.76px;color: #393939;}
#main .main-news .hgroup .txt{font-family:"SEOULMILK";margin-top:10px;font-size: 16px;font-weight: 300;letter-spacing: -0.96px;color: #a0a0a0;}
#main .main-news ul{margin:40px -2% 0;display: flex;flex-wrap: wrap;}
#main .main-news ul li{position:relative;display: inline-block;width:46%;margin:2%;}
#main .main-news ul li a{position:relative;display: block;}
#main .main-news ul li i{position: absolute;width:30px;top:10px;right:10px;}
#main .main-news ul li figure{}
#main .main-news ul li figure img{display: block;width:100%;}
#main .main-news ul li .mask{position: absolute;top:0;left:0;width:100%;height:100%;background: rgba(0,0,0,0.3);opacity:0;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
#main .main-news ul li .mask p{position:absolute;font-family:"SEOULMILK";top:50%;transform: translateY(-50%);left:0;width:100%;text-align: center;font-size: 26px;font-weight: normal;line-height: 1.38;letter-spacing: -1.04px;color: #fff;}
#main .main-news ul li:hover .mask{opacity: 1;}
#main .main-news ul li .box{position: absolute;top:50%;transform: translateY(-50%);left:0;width:100%;text-align: center;}
#main .main-news ul li .box p{font-family:"SEOULMILK";font-size: 24px;font-weight: 300;letter-spacing: -0.96px;color: #a0a0a0;}
#main .main-news ul li .box .sns-list{font-size: 0;margin-top:20px;}
#main .main-news ul li .box .sns-list a{display: inline-block;}
#main .main-news ul li .box .sns-list a img{display:block;}
#main .main-news ul li .box .sns-list a + a{margin-left:20px;}