@charset "utf-8";

#page{}

#page .main_slide{height:820px;background-image:url(../img/ko/slide_bg.jpg);background-size:cover;background-repeat:no-repeat;background-position:center center;}
#page .main_slide .inner{position:relative;height:100%;}
#page .main_slide .text_box{position:absolute;width:100%;box-sizing:border-box;top:50%;left:7%;transform:translateY(-50%);z-index:1;}
#page .main_slide .text_box .text{max-width:474px;width:100%;background-image:url(../img/ko/slide_text.png);background-size:auto 100%;background-repeat:no-repeat;background-position:left center;}
#page .main_slide .text_box .text:before{content:"";display:block;padding-bottom:46.835%;}
#page .main_slide .text_box .button_area{margin-top:85px;}
#page .main_slide .text_box .button_area .button{background-color:#f94b06;display:inline-block;line-height:58px;color:#ffffff;font-size:18px;font-weight:400;padding:0 70px;border-radius:5px;text-decoration:none;transition:background-color ease 0.3s;}
#page .main_slide .text_box .button_area .button:hover{background-color:#da4003;}
#page .main_slide .slides{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0;}
#page .main_slide .slides .slide{height:100%;position:relative;}
#page .main_slide .slides .slide img{max-width:100%;position:absolute;top:50%;transform:translateY(-50%);right:10%;}
#page .main_slide .slides .slick-list{height:100% !important;width:50%;float:right;margin-right:7%;}
#page .main_slide .slides .slick-list .slick-track{height:100%;}
#page .main_slide .slick-dotted.slick-slider{margin-top:0;}
#page .main_slide .slick-dots{bottom:40px;left:0;}
#page .main_slide .slick-dots li{width:auto;height:auto;margin:0;}
#page .main_slide .slick-dots li:nth-child(n+2){margin-left:10px;}
#page .main_slide .slick-dots li button{width:18px;height:18px;min-width:0;min-height:0;border:2px solid #383838;border-radius:50%;box-sizing:border-box;}
#page .main_slide .slick-dots li button:before{content:"";}
#page .main_slide .slick-dots li.slick-active button{background-color:#f74904;border-color:transparent;}

@media screen and (max-width:900px){
	#page .main_slide{position:relative;height:auto;}
	#page .main_slide:before{content:"";display:block;padding-bottom:92%;}
	#page .main_slide .inner{position:absolute;left:0;top:0;width:100%;}
	#page .main_slide .text_box{top:13%;transform:translateY(0);}
	#page .main_slide .text_box .text{width:58%;}
	#page .main_slide .text_box .button_area{margin-top:9%;}
	#page .main_slide .text_box .button_area .button{line-height:6.2vw;font-size:1.9vw;padding:0 7.5vw;border-radius:0.5vw;}
	#page .main_slide .slides .slide img{width:63%;top:auto;bottom:6%;transform:translateY(0);}
	#page .main_slide .slick-dots{bottom:4.5%;width:93%;}
	#page .main_slide .slick-dots li button{width:2vw;height:2vw;}
}



#page .section_title{height:40px;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;margin-bottom:40px;}

@media screen and (max-width:900px){
	#page .section_title{height:35px;margin-bottom:35px;}
}

@media screen and (max-width:700px){
	#page .section_title{height:28px;margin-bottom:28px;}
}

@media screen and (max-width:500px){
	#page .section_title{height:21px;margin-bottom:21px;}
}


#page .main_section{padding:75px 0;background-size:cover;background-repeat:no-repeat;background-position:center center;}
#page .main_section1{background-image:url(../img/ko/bg_section1.png);}
#page .main_section2{background-image:url(../img/ko/bg_section2.png);}
#page .main_section3{background-image:url(../img/ko/bg_section3.png);padding:120px 0 75px;}

@media screen and (max-width:900px){
	#page .main_section{padding:65px 0;}
	#page .main_section3{padding:110px 0 70px;}
}

@media screen and (max-width:700px){
	#page .main_section{padding:55px 0;}
	#page .main_section3{padding:100px 0 65px;}
}

@media screen and (max-width:500px){
	#page .main_section{padding:45px 0;}
	#page .main_section3{padding:90px 0 60px;}
}


#page .promotion_list{}
#page .promotion_list .title_service_video{background-image:url(../img/ko/title_promotion_service_video.png);}
#page .promotion_list .title_catalog{background-image:url(../img/ko/title_promotion_catalog.png);}
#page .promotion_list ul{margin:0;padding:0;list-style:none;position:relative;}
#page .promotion_list ul:after{content:"";display:block;clear:both;}
#page .promotion_list ul li{float:left;position:relative;}
#page .promotion_list ul li:nth-child(even){width:410px;}
#page .promotion_list ul li:nth-child(odd){width:calc(100% - 435px);margin-right:25px;}
#page .promotion_list ul li a{text-decoration:none;display:block;color:#ffffff;background-color:#efefef;height:500px;position:relative;overflow:hidden;cursor:pointer;}
#page .promotion_list ul li a:before{content:"";background-size:cover;background-repeat:no-repeat;background-position:center center;display:block;position:absolute;left:0;top:0;width:100%;height:100%;transition:transform ease 1s;}
#page .promotion_list ul li a:hover:before{transform:scale(1.15);}
#page .promotion_list ul li .title_box{position:absolute;left:0;top:50%;width:100%;transform:translateY(-50%);}
#page .promotion_list .service_video{}
#page .promotion_list .service_video:before{background-image:url(../img/ko/promotion_service_video_bg.png);}
#page .promotion_list .service_video .title{background-image:url(../img/ko/promotion_service_video_title.png);background-size:auto 100%;background-repeat:no-repeat;background-position:center center;}
#page .promotion_list .service_video .title:before{content:"";display:block;padding-bottom:78px;}
#page .promotion_list .service_video .button_area{margin-top:45px;text-align:center;}
#page .promotion_list .service_video .button_area .button{display:inline-block;width:120px;border-radius:50%;background-color:rgba(249,75,6,0.48);transition:background-color ease 0.3s;position:relative;}
#page .promotion_list .service_video .button_area .button:before{content:"";display:block;padding-bottom:100%;}
#page .promotion_list .service_video .button_area .button:after{content:"";display:block;background-color:#f94b06;border-radius:50%;width:75%;height:75%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-image:url(../img/ko/promotion_catalog_button_arrow.png);background-size:25%;background-position:center center;background-repeat:no-repeat;}
#page .promotion_list .service_video .button_area .button:hover{background-color:rgba(249,75,6,1);}
#page .promotion_list .catalog{}
#page .promotion_list .catalog:before{background-image:url(../img/ko/promotion_catalogue.png);}
#page .promotion_list .catalog .title{background-image:url(../img/ko/promotion_catalog_title.png);background-size:auto 100%;background-repeat:no-repeat;background-position:center center;}
#page .promotion_list .catalog .title:before{content:"";display:block;padding-bottom:30px;}
#page .promotion_list .catalog .text{font-size:16px;font-weight:400;color:#ffffff;line-height:1.75;margin-top:40px;text-align:center;}

@media screen and (max-width:900px){
	#page .promotion_list ul li:nth-child(odd){width:calc(50% - 7.5px);margin-right:15px;}
	#page .promotion_list ul li:nth-child(even){width:calc(50% - 7.5px);}
	#page .promotion_list ul li a{height:auto;}
	#page .promotion_list ul li a:after{content:"";display:block;padding-bottom:66%;}
	
	#page .promotion_list .service_video .title:before{padding-bottom:12%;}
	#page .promotion_list .service_video .button_area{margin-top:7%;}
	#page .promotion_list .service_video .button_area .button{width:18%;}
	#page .promotion_list .catalog .title:before{padding-bottom:4.7%;}
	#page .promotion_list .catalog .text{margin-top:7%;font-size:1.2vw;}
}

@media screen and (max-width:700px){
	#page .promotion_list ul li:nth-child(odd){float:none;width:auto;margin-right:0;}
	#page .promotion_list ul li:nth-child(even){float:none;width:auto;margin-top:40px;}
	#page .promotion_list .catalog .text{font-size:2.4vw;}
}

@media screen and (max-width:500px){
	#page .promotion_list ul li:nth-child(even){margin-top:30px;}
}


#page .product_list{}
#page .product_list .title_product{background-image:url(../img/ko/title_product.png);}
#page .product_list ul{margin:0;padding:0;list-style:none;position:relative;}
#page .product_list ul:after{content:"";display:block;clear:both;}
#page .product_list ul li{float:left;width:calc(33.33% - 10px);margin-right:15px;background-color:#efefef;position:relative;}
#page .product_list ul li:nth-child(3n){margin-right:0;}
#page .product_list ul li a{display:block;color:#ffffff;background-color:#efefef;position:relative;overflow:hidden;}
#page .product_list ul li a:before{content:"";background-size:auto 100%;background-repeat:no-repeat;background-position:center center;display:block;position:absolute;z-index:0;left:0;top:0;width:100%;height:100%;transition:transform ease 1s;}
#page .product_list ul li a:hover:before{transform:scale(1.15);}
#page .product_list ul li a:after{content:"";display:block;padding-bottom:111.538%;background-color:rgba(0,0,0,0.48);transition:background-color ease 1s;position:relative;z-index:1;}
#page .product_list ul li a:hover:after{background-color:rgba(0,0,0,0.8);}
#page .product_list ul li .title{position:absolute;left:0;top:50%;width:100%;height:12%;background-size:auto 100%;background-repeat:no-repeat;z-index:2;background-position:center center;transform:translateY(-50%);}
#page .product_list .product1{}
#page .product_list .product1:before{background-image:url(../img/ko/product1_bg.png);background-color:#ededed;}
#page .product_list .product1 .title{background-image:url(../img/ko/product1_title.png);}
#page .product_list .product2{}
#page .product_list .product2:before{background-image:url(../img/ko/product2_bg.png);background-color:#ffffff;}
#page .product_list .product2 .title{background-image:url(../img/ko/product2_title.png);}
#page .product_list .product3{}
#page .product_list .product3:before{background-image:url(../img/ko/product3_bg.png);background-size:cover;}
#page .product_list .product3 .title{background-image:url(../img/ko/product3_title.png);}

@media screen and (max-width:700px){
	#page .product_list ul li{float:left;width:calc(50% - 7.5px);margin-right:15px;}
	#page .product_list ul li:nth-child(2n){margin-right:0;}
	#page .product_list ul li:nth-child(3){width:100%;margin-top:15px;}
	#page .product_list ul li a:after{padding-bottom:81%;}
	#page .product_list ul li .title{height:22%;}
	#page .product_list ul li:nth-child(3) a:after{padding-bottom:40%;}
}

@media screen and (max-width:500px){
	#page .product_list ul li{float:none;width:auto;margin-right:0;}
	#page .product_list ul li:nth-child(n+2){margin-top:15px;}
	#page .product_list ul li a:after{padding-bottom:40%;}
	#page .product_list ul li .title{height:22%;}
}



#page .slogun_box{}
#page .slogun_box .title{background-image:url(../img/ko/slogun_title.png);background-size:auto 100%;background-repeat:no-repeat;background-position:center center;}
#page .slogun_box .title:before{content:"";display:block;padding-bottom:104px;}
#page .slogun_box .company{margin-top:55px;background-image:url(../img/ko/slogun_company.png);background-size:auto 100%;background-repeat:no-repeat;background-position:center center;}
#page .slogun_box .company:before{content:"";display:block;padding-bottom:61px;}
#page .slogun_box .button_area{text-align:center;margin-top:65px;}
#page .slogun_box .button_area .button{background-color:#f94b06;display:inline-block;line-height:68px;color:#ffffff;font-size:20px;font-weight:400;padding:0 45px;border-radius:5px;text-decoration:none;transition:background-color ease 0.3s;}
#page .slogun_box .button_area .button:hover{background-color:#da4003;}

@media screen and (max-width:900px){
	#page .slogun_box .title:before{padding-bottom:12%;}
	#page .slogun_box .company{margin-top:6.5%;}
	#page .slogun_box .company:before{padding-bottom:7.5%;}
	#page .slogun_box .button_area{margin-top:8.5%;}
	#page .slogun_box .button_area .button{line-height:7.4vw;font-size:2.1vw;padding:0 4.5vw;border-radius:0.5vw;}
}

@media screen and (max-width:500px){
	#page .slogun_box .title{background-image:url(../img/ko/slogun_title_mobile.png);}
	#page .slogun_box .title:before{padding-bottom:22.5%;}
}



#page .keyword_list{}
#page .keyword_list ul{margin:0;padding:0;list-style:none;position:relative;}
#page .keyword_list ul:after{content:"";display:block;clear:both;}
#page .keyword_list ul li{float:left;width:calc(25% - 11.25px);margin-right:15px;position:relative;}
#page .keyword_list ul li a{display:block;color:#ffffff;background-color:#efefef;position:relative;overflow:hidden;}
#page .keyword_list ul li a:before{content:"";background-size:cover;background-repeat:no-repeat;background-position:center center;display:block;position:absolute;z-index:0;left:0;top:0;width:100%;height:100%;transition:transform ease 1s;}
#page .keyword_list ul li a:hover:before{transform:scale(1.15);}
#page .keyword_list ul li a:after{content:"";display:block;padding-bottom:86%;background-color:rgba(0,0,0,0.48);transition:background-color ease 1s;position:relative;z-index:1;}
#page .keyword_list ul li a:hover:after{background-color:rgba(0,0,0,0.8);}
#page .keyword_list ul li .title{position:absolute;z-index:2;left:0;top:50%;width:100%;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;transform:translateY(-50%);}
#page .keyword_list ul li .title:before{content:"";display:block;padding-bottom:20%;}
#page .keyword_list ul li .description{position:absolute;left:0;bottom:12%;width:100%;text-align:center;font-size:17px;font-weight:400;color:#ffffff;line-height:1.5;z-index: 2}
#page .keyword_list ul li:nth-child(4n){margin-right:0;}
#page .keyword_list ul li:nth-child(n+5){margin-top:15px;}
#page .keyword_list ul li:nth-child(4){}
#page .keyword_list ul li:nth-child(4) a{position:absolute;right:0;top:0;width:100%;}
#page .keyword_list ul li:nth-child(4) a:after{padding-bottom:calc(172% + 15px);}
#page .keyword_list .keyword1{}
#page .keyword_list .keyword1:before{background-image:url(../img/ko/keyword1_bg.png);}
#page .keyword_list .keyword1 .title{background-image:url(../img/ko/keyword1_title.png);}
#page .keyword_list .keyword2{}
#page .keyword_list .keyword2:before{background-image:url(../img/ko/keyword2_bg.png);}
#page .keyword_list .keyword2:after{opacity:0;}
#page .keyword_list .keyword2 .title{background-image:url(../img/ko/keyword2_title.png);}
#page .keyword_list .keyword3{}
#page .keyword_list .keyword3:before{background-image:url(../img/ko/keyword3_bg.png);}
#page .keyword_list .keyword3 .title{background-image:url(../img/ko/keyword3_title.png);}
#page .keyword_list .keyword4{}
#page .keyword_list .keyword4:before{background-image:url(../img/ko/keyword4_bg.png);}
#page .keyword_list .keyword4 .title{background-image:url(../img/ko/keyword4_title.png);top:40%;}
#page .keyword_list .keyword4 .title:before{padding-bottom:68%;}
#page .keyword_list .keyword5{}
#page .keyword_list .keyword5:before{background-image:url(../img/ko/keyword5_bg.png);}
#page .keyword_list .keyword5 .title{background-image:url(../img/ko/keyword5_title.png);}
#page .keyword_list .keyword6{}
#page .keyword_list .keyword6:before{background-image:url(../img/ko/keyword6_bg.png);}
#page .keyword_list .keyword6 .title{background-image:url(../img/ko/keyword6_title.png);}
#page .keyword_list .keyword7{}
#page .keyword_list .keyword7:before{background-image:url(../img/ko/keyword7_bg.png);}
#page .keyword_list .keyword7:after{opacity:0;}
#page .keyword_list .keyword7 .title{background-image:url(../img/ko/keyword7_title.png);}

@media screen and (max-width:1200px){
	#page .keyword_list ul li .description{font-size:1.4vw;}
}

@media screen and (max-width:700px){
	#page .keyword_list ul li{float:left;width:calc(50% - 5px);margin-right:10px;}
	#page .keyword_list ul li:nth-child(2n){margin-right:0;}
	#page .keyword_list ul li:nth-child(n+3){margin-top:10px;}
	#page .keyword_list ul li:nth-child(4) a:after{padding-bottom:calc(172% + 10px);}
	#page .keyword_list ul li:nth-child(6){position:absolute;right:0;bottom:0;}
	#page .keyword_list ul li .description{font-size:2.7vw;}
}


#video_box{background-color:rgba(0,0,0,0.7);position:fixed;top:0;left:0;z-index:-99999;width:100%;height:100%;opacity:0;transition:all ease 1s;}
#video_box.active{z-index:99999;opacity:1;}
#video_box .video{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);width:1024px;max-width:calc(100% - 40px);}
#video_box .video:before{content:"";display:block;padding-bottom:56.265%;}
#video_box .video .close{position:absolute;width:30px;height:30px;display:inline-block;right:0;top:-35px;background-image:url(../img/ko/btn_close.png);background-repeat:no-repeat;background-size:cover;cursor:pointer;}
#video_box .video iframe{position:absolute;left:0;top:0;width:100%;height:100%;border:0;}