/* brand page */
.brand_bn{width:100%; height:600px; background:url(../assets/img/brand_bn.jpg) no-repeat center center / cover; position:relative;}

.company{background:#000; padding:120px 0 80px 0;}
.company .company_detail{max-width:1920px; margin:auto;}
.company .company_detail img{width:100%; display:none;}
.company .company_detail .company_img_pc{display:inline-block;}
.company .company_detail .company_img_m{display:none;}

.brand_story .title{position:relative; display:inline-block; padding:15px 0; margin-bottom:30px;}
.brand_story .title::after{position:absolute; content:''; width:40%; height:3px; background:#fff; left:0; bottom:0;}
.brand_story .title h2{font-size:42px; color:#fff;}
.brand_story .sub_title{text-align:left; padding:30px 0;}
.brand_story .sub_title h3{color:#aaa; font-size:26px; font-weight:500;}

.brand_story .ci_intro{padding:50px 0; background:#0c0c0c;}
.brand_story .ci .title_text_box p{color:#eee; line-height:1.6; letter-spacing:0.4px; font-size:24px; font-weight:600; width:70%;}
.brand_story .ci_people{padding:50px 0; background:#090909;}
.brand_story .ci_people .title h2{color:#fff;}
.brand_story .ci_people .title::after{background:#fff;}
.brand_story .ci .ci_people .item_box{display:flex; padding-top:30px; justify-content:space-between; margin-bottom:50px; align-items:center;}
.brand_story .ci .ci_people .img_box{width:45%;}
.brand_story .ci .ci_people .img_box img{width:100%; height:100%;}
.brand_story .ci .ci_people .text_box{width:45%; text-align:left; padding-bottom:100px;}
.brand_story .ci .ci_people .text_box p.large{font-size:50px; font-weight:600; color:#fff;}
.brand_story .ci .ci_people .text_box p.small{font-size:22px; font-weight:500; color:#fff;}
.brand_story .ci .ci_people .item_box.odd{}
.brand_story .ci .ci_people .item_box.even{flex-flow:row-reverse;}
.brand_story .ci .ci_people .item_box.odd .img_box{}
.brand_story .ci .ci_people .item_box.odd .text_box{}
.brand_story .ci .ci_people .item_box.even .img_box{}
.brand_story .ci .ci_people .item_box.even .text_box{}

.brand_story .ci .ci_color .color_box{display:flex; justify-content:space-between;}
.brand_story .ci .ci_color .color_box .item_box{width:32%; height:500px; background:#eee; padding:50px; box-sizing:border-box; position:relative;}
.brand_story .ci .ci_color .color_box .item_box.blue{background:#002f7d;}
.brand_story .ci .ci_color .color_box .item_box.green{background:linear-gradient(to right, #4d9222 0%,#006950 100%);}
.brand_story .ci .ci_color .color_box .item_box.red{background: linear-gradient(to right, #d45200 0%,#c5000b 100%);}
.brand_story .ci .ci_color .color_box .item_box .name{color:#fff; font-size:28px;}
.brand_story .ci .ci_color .color_box .item_box ul{position:absolute; bottom:50px;}
.brand_story .ci .ci_color .color_box .item_box ul li{color:#fff; position:relative; margin-top:10px; padding-left:15px; font-size:15px;}
.brand_story .ci .ci_color .color_box .item_box ul li:before{width:5px; height:5px; content:''; border-radius:50%; position:absolute; background:#fff; top:50%; transform:translateY(-50%); left:0;}
.brand_story .ci .ci_color .color_box .item_box ul li span{padding:0 5px;}
.brand_story .ci .ci_color>.text_box{padding:35px 0; text-align:right;}
.brand_story .ci .ci_color>.text_box p{color:#eee; font-size:19px; font-weight:500; padding-bottom:5px;}

@keyframes fadeIng{
  100%{transform:translateY(0); opacity:1;}
  0%{transform:translateY(150px); opacity:0;}
}

/* 특허 및 인증 */
.patent_bn{background:url(../assets/img/patent_bn.jpg) no-repeat center center / cover;}
.patent{width:100%; padding:100px 0;}
.patent .title{position:relative; display:inline-block; padding:15px 0; margin-bottom:50px;}
.patent .title::after{position:absolute; content:''; width:40%; height:3px; background:#fff; left:0; bottom:0;}
.patent .title h2{font-size:32px; color:#fff;}
.patent .dec{color:#555; font-size:18px; line-height:1.8; font-weight:400; padding-bottom:40px;}
.patent .sub{padding-bottom:20px;}
.patent .sub .sub_title{position:relative;}
.patent .sub .sub_title h3{padding-left:15px; margin:30px 0; font-size:26px; color:#fff;}
.patent .sub .sub_title h3::after{position:absolute; content:''; width:3px; height:80%; background:#aaa; left:0; top:50%; transform:translateY(-50%);}
.patent .sub img{width:100%;}
.patent .patent_list{}
.patent .patent_list ul{padding:0 20px;}
.patent .patent_list ul li{display:flex; padding:10px 0; border-bottom:1px solid #333;}
.patent .patent_list ul li span{color:#fff; width:25%;}
.patent .patent_list ul li p{color:#fff;}
.patent .patent_list ul li .patent_number{width:35%;}
.patent .patent_list ul li .patent_name{width:40%;}

/* 사업장 소개 */
.place_bn{background:url(../assets/img/place_bn.jpg) no-repeat center center / cover;}
.place{width:100%; padding:60px 0; background:#000;}
.place .title{position:relative; display:inline-block; padding:15px 0; margin-bottom:50px;}
.place .title h2{color:#fff;}
.place .title::after{position:absolute; content:''; width:40%; height:3px; background:#fff; left:0; bottom:0;}
.place .title h2{font-size:44px;}
.place .dec{color:#fff; font-size:18px; line-height:1.8; font-weight:400; padding-bottom:40px;}
.place .sub{padding:50px 0; border-bottom:1px solid #555;}
.place .sub .sub_title{position:relative;}
.place .sub .sub_title h3{padding-left:15px; margin:30px 0; font-size:20px; color:#fff;}
.place .sub .sub_title h3::after{position:absolute; content:''; width:3px; height:80%; background:#fff; left:0; top:50%; transform:translateY(-50%);}
.place .sub .item_box{display:flex; justify-content:space-between; }
.place .sub .item_box .img_box{width:49%; position:relative;}
.place .sub .item_box .img_box img{width:100%;}
.place .sub .item_box .img_box .bg{position:absolute; left:0; top:0; background:rgba(0,0,0,.2); width:100%; height:100%;}
.place .sub .item_box .text_box{width:49%; padding-left:20px; box-sizing:border-box; position:relative;}
.place .sub .item_box .text_box .info{position:absolute; bottom:0;}
.place .sub .item_box .text_box .info div{display:flex; justify-content:space-between; align-items:center; flex-flow:wrap; width:100%; padding-top:15px;}
.place .sub .item_box .text_box .info span{width:100%; display:block; color:#aaa; font-size:20px; font-weight:500;}
.place .sub .item_box .text_box .info p{width:100%; font-size:16px; color:#fff; font-weight:400;}
.place .sub .item_box .text_box .info b{font-size:14px; font-weight:400; padding-top:2px; color:#888;}
.place .sub .item_box .text_box div p.large{font-size:40px; font-weight:600; color:#fff; line-height:54px;}

/* 연혁 */
.timeline_bn{width:100%; height:100vh; background:url(../assets/img/timeline_bn.jpg) no-repeat center center / cover; position:relative;}
.timeline_bn:hover .bg{background:rgba(0,0,0,.4);}
.timeline_bn .bg{width:100%; height:100%; background:rgba(0,0,0,.6); position:absolute; transition:all 0.4s;}
.timeline_bn .text_box{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; width:100%; z-index:2; transition:all 0.4s; overflow:hidden;}
.timeline_bn .text_box h2{font-size:44px; color:#fff; padding-bottom:25px; animation:fadeIng 1.5s ease; transition:all 0.4s;}
.timeline_bn .text_box p{font-size:24px; color:#aaa; line-height:1.8; animation:fadeIng 2s ease; transition:all 0.4s;}
.timeline{width:100%; _height:1000px; background:#000; padding:100px 0;}
.timeline .title{position:relative; display:inline-block; padding:15px 0; margin-bottom:50px;}
.timeline .title::after{position:absolute; content:''; width:40%; height:3px; background:#fff; left:0; bottom:0;}
.timeline .title h2{color:#fff; font-size:40px;}
.timeline .content_box{}
.timeline .content_box li{position:relative;}
.timeline .content_box li .item_box{display:flex; justify-content:space-between; padding-bottom:70px; overflow:hidden;}
.timeline .content_box li .item_box .img_box{width:40%;}
.timeline .content_box li .item_box .img_box img{width:100%; border-radius:50%; border:3px solid #fff; opacity:0.2; transition:all 0.4s; box-sizing:border-box;}
.timeline .content_box li .item_box .text_box{width:40%;}
.timeline .content_box li .item_box .text_box h3{color:#555; font-size:60px; padding-bottom:20px; transition:all 0.4s;}
.timeline .content_box li .item_box .text_box p{color:#555; font-size:16px; padding-bottom:5px; transition:all 0.4s;}
.timeline .content_box li .item_box .left{text-align:right; transition:all 0.6s;}
.timeline .content_box li .item_box .right{text-align:left; transition:all 0.6s;}
.timeline .content_box li.on .item_box .img_box img{opacity:1;}
.timeline .content_box li.on .item_box .text_box h3{color:#fff;}
.timeline .content_box li.on .item_box .text_box p{color:#aaa;}
.timeline .content_box li.on .item_box .left{text-align:right;}
.timeline .content_box li.on .item_box .right{text-align:left;}

.timeline .dot{position:absolute; left:calc(50% - 5px); top:100px; width:10px; height:10px; background:#555; border-radius:50%; z-index:2; transition:all 0.2s;}
.timeline .dot.active{background:#000; border:5px solid #fff; left:calc(50% - 9px);}
.timeline .middle_line{position:absolute; width:0; height:90%; box-sizing:border-box; border-right:1px dashed #555; left:50%; top:245px; z-index:0;}
.timeline .middle_line .light{position:absolute; width:0; box-sizing:border-box; border-right:1px solid #fff; left:0; top:0; z-index:1;}

.timeline_bottom{width:100%; height:500px;}
.timeline_bottom .bg{position:fixed; width:100%; height:100%; top:0; left:0; z-index:-1; background:url(../assets/img/timeline_bottom.jpg) no-repeat center center / cover;}
.timeline_bottom .text_box{position:absolute; top:50%; transform:translateY(-50%); text-align:center; width:100%;}
.timeline_bottom .text_box h3{color:#fff; font-size:38px;}