#mainVisual {
    width:100%;
    height:700px;
    position:relative;
    z-index:9;
}

.main-visual-slide, .main-visual-slide .slick-list, .main-visual-slide .slick-track, .main-visual-item {
    height:100%;
}
.main-visual-img {
    position:absolute;
    width:100%;
    height:100%;
}

.visual-txt-area 
{max-width:1500px; margin:0 auto; height:100%; position:relative; z-index:99;}
.visual-txt-con h2 
{font-size:5rem; color:#fff; font-weight:200; line-height:1.3; text-shadow:3px 3px 12px #00000017;}


.main-visual-controls 
{position:absolute; bottom:12rem; width:100%; z-index:9999;}
.main-visual-controls .visual-controls-wrap 
{max-width:1500px; margin:0 auto; display:flex;}

.main-visual-controls .paging-controls 
{display:flex; align-items: center;}
.main-visual-controls .paging-controls .cur 
{font-size:1.8rem; color:#fff; font-weight:700;}
.main-visual-controls .paging-controls .total
{font-size:1.8rem; color:#fff; font-weight:700;}
.main-visual-controls .paging-controls .progress-bar-con 
{margin:0 2rem; line-height:0;}
.main-visual-controls .paging-controls .progress-bar 
{width:30rem; height:3px; display:inline-block; position:relative}
.main-visual-controls .paging-controls .progress-bar .total-bar 
{position:absolute; width:100%; height:100%; background:rgba(255,255,255,0.3);}
.main-visual-controls .paging-controls .progress-bar .ing-bar 
{position:absolute; left:0; top:0; background:#fff; width:0%; height:100%;}

.main-visual-controls .visual-arrow-con 
{margin-left:4rem;}
.main-visual-controls .visual-arrow-con .prev-next-btn 
{width:6rem; height:6rem; display:inline-block; border:2px solid #fff; border-radius:50%; background-position:center; background-repeat:no-repeat; margin:0 1rem;}
.main-visual-controls .visual-arrow-con .prev-btn 
{background-image:url('../img/main_prev_arrow.png');}
.main-visual-controls .visual-arrow-con .next-btn 
{background-image:url('../img/main_next_arrow.png');}


.main-visual-controls .progress-bar.active .ing-bar {
  width: 100%;
  transition: all 2.8s ease-in-out;
}


.main-title-con 
{text-align:center; margin-bottom:3rem;}
.main-title-con h4 
{font-size:2.2rem; color:var(--main-color); font-weight:700;}
.main-title-con h2
{font-size:5.0rem; color:#fff; font-weight:700;}

.main-quick
{padding:5rem 0;}
.main-quick .main-quick-list 
{display:flex; flex-wrap:wrap;}
.main-quick .main-quick-list .quick-item 
{flex-grow:1; width:24%;}
.main-quick .main-quick-list .quick-item  a 
{display:flex; align-items: center;;}
.main-quick .main-quick-list .quick-item .icon 
{width:9rem; height:9rem; border-radius:50%; background:#f4f4f4; background-repeat:no-repeat; background-position:center center; transition: all 0.3s ease;}
.main-quick .main-quick-list .quick-item .txt-con 
{padding-left:2rem; width:calc(100% - 9rem);}
.main-quick .main-quick-list .quick-item .txt-con h4 
{font-size:2.0rem; color:#1e1e1e; font-weight:800; margin-bottom:1rem; transition: all 0.3s ease;}
.main-quick .main-quick-list .quick-item .txt-con p 
{font-size:1.6rem; color:#4b4949}
.main-quick .main-quick-list .quick-item:hover .icon 
{background-color:#ddd;}
.main-quick .main-quick-list .quick-item:hover .txt-con h4
{color:var(--main-color)}


.main-product 
{background-image:url('../img/main_product_bg.jpg'); background-repeat:no-repeat; padding:7rem 0 13rem; position:relative; overflow:hidden;}

.main-product-list 
{}
.main-product-list .slick-list 
{width:105%; margin-left:20rem;}
.main-product-list .product-item 
{margin:0 1rem;}
.main-product-list .prd-img 
{width:100%; height:32rem; background:#fff; border-radius:10px; display:flex; justify-content: center; align-items: center; position:relative;}
.main-product-list .prd-img .overlay 
{position:absolute; width:100%; height:100%; background:rgba(0,0,0,0.7); display:block; border-radius:10px; display:flex; align-items: center; justify-content: center; opacity:0; visibility:hidden; transition: all 0.3s ease;}
.main-product-list .prd-img .overlay span 
{color:#fff; font-size:2.4rem;}
.main-product-list .prd-txt h4 
{font-size:2.0rem; color:#fff; font-weight:600; padding:2rem 0;}
.main-product-list .product-item:hover .prd-img .overlay 
{opacity:1; visibility:visible;}

.main-prd-controls
{position:absolute; bottom:7rem; width:100%;}
.main-prd-controls .prd-controls-wrap 
{ max-width:1500px; margin:0 auto; display:flex; justify-content: space-between; align-items:center;;}


.main-prd-controls .prd-controls-wrap .controls-con 
{display:flex;}
.main-prd-controls .arrow-btn .next-prev-btn 
{background-image:url('../img/prd-slide-prev.png'); display:inline-block; width:50px; height:50px; background-position:center; background-repeat:no-repeat; border:2px solid #fff; border-radius:50px;}
.main-prd-controls .arrow-btn .next-btn 
{transform:rotate(180deg); margin-left:2rem;}

.main-prd-controls .paging-controls 
{display:flex; align-items:center; margin:0 3rem;}
.main-prd-controls .paging-controls .cur,
.main-prd-controls .paging-controls .total
{font-size:1.8rem; color:#fff;}
.main-prd-controls .paging-controls .progress-bar-con 
{display:inline-block; line-height:0; margin:0 1rem;}
.main-prd-controls .paging-controls .progress-bar 
{position:relative; display:inline-block; width:15rem; height:2px; }
.main-prd-controls .paging-controls .progress-bar .total-bar 
{position:absolute; width:100%; height:100%; background:rgba(255,255,255,0.3);}
.main-prd-controls .paging-controls .progress-bar .ing-bar 
{position:absolute; width:00%; height:100%; background:#fff; left:0;}


.main-prd-controls .paging-controls .progress-bar.active .ing-bar {
  width: 100%;
  transition: all 2.8s ease-in-out;
}


.more-view-con a 
{display:flex; align-items: center;;}
.more-view-con span 
{font-size:2.0rem; color:#fff; font-weight:500; margin-right:2rem; transition: all 0.3s ease;}
.more-view-con .view-more 
{display:inline-block; width:4rem; height:4rem; border-radius:50%; background-color:#fff; display:inline-flex; align-items:center; background-image:url('../img/main_arrow_btn.png'); background-position:center; background-repeat:no-repeat; transition: all 0.3s ease;}
.more-view-con a:hover span 
{margin-right:1rem;}
.more-view-con a:hover .view-more 
{background-color:#ddd;}


.main-contact 
{background-image:url('../img/main_contact_bg.jpg'); width:100%; padding:7rem 0;}
.main-contact-con 
{display:flex; justify-content:space-between; align-items:end;}
.main-contact-con .txt-con h4 
{font-size:2.2rem; color:var(--main-color); font-weight:700; margin-bottom:2rem;}
.main-contact-con .txt-con h2 
{font-size:4.4rem; color:#fff; font-weight:700;}

/* 푸터 */
#footer 
{padding:4rem 0; background:#171e22;}
#footer .footer-con 
{display:flex; justify-content: space-between; align-items:center;;}
#footer .police-con a 
{font-size:1.7rem; color:#fff; font-weight:500; margin-right:2rem; transition: all 0.3s ease;}
#footer .police-con a:hover 
{text-decoration:underline}
#footer .detail-info-con
{margin-top:2rem;}
#footer .detail-info-con p
{color:#959595; font-size:1.6rem; line-height:1.5; font-weight:300;}
#footer .detail-info-con p span 
{margin-right:2rem; padding-right:2rem; position:relative;}
#footer .detail-info-con p span:after 
{content:''; width:2px; height:80%; right:0; top:10%;  position:absolute; background:#dddddd;}

#footer .f-logo 
{ display:inline-block; width:125px; height:23px; background-repeat:no-repeat; background-position:center;}




@media screen and (max-width:1500px) {
  .visual-txt-con h2
  {padding: 0 2rem;}
  .main-visual-controls
  {padding: 0 2rem;}
  .main-product-list .slick-list
  {width: 160%; margin-left: 2rem;}
  .main-prd-controls .prd-controls-wrap
  {padding: 0 2rem;}

}


@media screen and (max-width:1280px) {

    .slick-dots
  {display: none !important;}
    #footer .detail-info-con p span:after
{display: none;}
}

@media screen and (max-width:1024px) {
  #mainVisual
  {height: 560px;}
  .main-visual-img
  {background-size: cover;}
  .visual-txt-con h2
  {font-size: 4rem;}
  .main-visual-controls .visual-arrow-con .prev-next-btn
  {width: 5rem; height: 5rem;}
  .main-title-con h2
  {font-size: 4rem;}
  .main-contact-con .txt-con h2
  {font-size: 4rem;}
  .main-quick .main-quick-list
  {gap: 2rem 1rem;}
  .main-quick .main-quick-list .quick-item
  {width: 48%;}

}


@media screen and (max-width:820px) {
#footer .footer-con
{flex-wrap: wrap; margin-top: 2rem;}
#footer .detail-info-con p span
{margin-right: 1rem; padding-right: 1rem;}
.left-txt-con
{width: 100%;}
.right-con
{width: 100%;}
#footer .f-logo
{margin-top: 1rem;}
}

@media screen and (max-width:767px) {
.pc-br{display: none;}
  #mainVisual
  {height: 360px;}
.visual-txt-con h2
{font-size: 2.6rem;}
.visual-txt-con
{word-break: keep-all;}
.main-visual-controls
{bottom: 8rem;}
.main-visual-controls .paging-controls .progress-bar
{width: 10rem;}
.main-visual-controls .visual-arrow-con
{margin-left: 2rem;}
.main-visual-controls .visual-arrow-con .prev-next-btn
{width: 4rem; height: 4rem;}
.main-visual-controls .visual-arrow-con .prev-btn
{background-size: 2rem 1.2rem;}
.main-visual-controls .visual-arrow-con .next-btn
{background-size: 2rem 1.2rem;}
.main-title-con h2
{font-size: 2.6rem;}
.main-contact-con .txt-con h2
{font-size: 2.6rem;}
.main-quick .main-quick-list .quick-item a
{flex-wrap: wrap;}
.main-quick .main-quick-list .quick-item .icon
{margin: 0 auto;}
.main-quick .main-quick-list .quick-item .txt-con
{padding-left: 0; width: calc(100% - 2rem); text-align: center; margin: 2rem auto;}
.main-contact
{background-size: cover;}
.main-product
{padding: 7rem 0 12rem; background-size: cover;}
.main-product-list .slick-list
{width: 92%;}
.main-prd-controls .arrow-btn .next-prev-btn
{width: 40px; height: 40px;}
.main-prd-controls .prd-controls-wrap
{flex-wrap: wrap;}
.controls-con .arrow-btn{width: 100%;}
.more-view-con a
{padding-top: 1rem;}
.main-contact-con
{flex-wrap: wrap;}
#footer .footer-con
{flex-direction: column-reverse;}
#footer .f-logo
{margin-bottom: 2rem;}
html[lang="en"] .visual-txt-area{height: 90%;}
html[lang="en"] .main-visual-controls{bottom: 6rem;}

}

@media screen and (max-width:440px){
  
.visual-txt-con
{height: 80%;}
  .visual-txt-con h2
{font-size: 2.2rem;}
  .slick-slide img
  {width: 100%;}
  .main-visual-controls .visual-arrow-con
  {width: 100%; margin-left: 0; margin-top: 1rem;}
  
.main-prd-controls .paging-controls
{display: none;}
.main-product-list .slick-list
{width: 100%; margin: 0 auto;}
.main-visual-controls .visual-controls-wrap
{flex-wrap: wrap;}

}