@charset "utf-8";

/* reset */
html{font-size:16px}
body{font-family: "Noto Sans KR",sans-serif;letter-spacing:-.025em; word-break:keep-all;word-wrap:break-word;color:#000}
a,button,input,textarea{transition:border-color .4s,background .4s,color .4s,opacity .4s,transform .4s}
a{text-decoration: none !important; color:inherit}
a:hover,a:focus,a:active{color:inherit}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,label{margin:0;padding:0}
li{list-style:none}
address,i{margin:0;font-style:normal}
label,button,[role=button]{cursor:pointer;outline:0 !important}
table{width:100%}
img{max-width:100%}
hr{border-top-color: #e5e5e5}

.privacy_table_img{max-width : 1104px;}

:root{
    --white1: #FFFFFF;
    --white3: #F5F5F5;
}

/* Icon */
[class^=icon-],[class^=mark-] i{display: inline-block;overflow: hidden;margin: 0;padding: 0;border: 0;background-color: transparent;background-position: 50% 50%;background-repeat: no-repeat;font-size: 0;line-height: 0;text-decoration: none;vertical-align:middle;text-indent: -1000em;background-size: 100% auto}
.white-icon{filter:brightness(10)}
.white-icon-blk{filter:invert(1)}
.icon-link{width:20px;height:20px; margin:-4px 0 0; background-image:url(../img/icon-link.svg)}
.icon-srch{width:20px;height:20px; margin:-4px 0 0; background-image:url(../img/icon-srch.png)}
.icon-download{width:20px;height:20px;margin:-4px 0 0;background-image:url(../img/icon-download.png)}
.icon-heart{width:20px;height:20px;margin:-4px 0 0;background-image:url(../img/icon-heart.png)}
.icon-location-small{width:20px;height:20px;;margin:-4px 0 0;background-image:url(../img/icon-location-small.png) !important}
.icon-location-small-wh{width:20px;height:20px;;margin:-4px 0 0;background-image:url(../img/icon-location-small-wh.png) !important}
.icon-heart.active{background-image:url(../img/icon-heart-active.png)}
.icon-faq{width:36px;height:36px;background-image:url(../img/icon-faq.png)}
.icon-contact{width:36px;height:36px;background-image:url(../img/icon-contact.png) !important}
.icon-phone{width:36px;height:36px;background-image:url(../img/icon-phone.png)}
.icon-location{width:36px;height:36px;background-image:url(../img/icon-location.png) !important}
.icon-catalogue{width:36px;height:36px;background-image:url(../img/icon-catalogue.png)}
.icon-prod{width:36px;height:36px;background-image:url(../img/icon-prod.png)}
.icon-gas{width:36px;height:36px;background-image:url(../img/icon-gas.png)}
.icon-wifi{width:36px;height:36px;background-image:url(../img/icon-wifi.png)}
.icon-lightning{width:36px;height:36px;background-image:url(../img/icon-lightning.png)}
.icon-verticaltop{width:36px;height:36px;background-image:url(../img/icon-verticaltop.png)}
.icon-tractor{width:36px;height:36px;background-image:url(../img/icon-view-quick.png)}
.icon-repair{width:36px;height:36px;background-image:url(../img/icon-repair.png)}
.icon-checked{width:36px;height:36px;background-image:url(../img/icon-checked.png)}
.icon-check-x{width:36px;height:36px;background-image:url(../img/icon-check-x.png)}
.icon-problem{width:36px;height:36px;background-image:url(../img/icon-problem.png)}
.icon-height{width:36px;height:36px;background-image:url(../img/icon-height.png)}
.icon-problem-wh{width:36px;height:36px;background-image:url(../img/icon-problem-wh.png)}
.icon-height-wh{width:36px;height:36px;background-image:url(../img/icon-height-wh.png)}
.icon-lightning-wh{width:36px;height:36px;background-image:url(../img/icon-lightning-wh.png)}
.icon-agent2-wh{background-image: url(../img/icon-agent2-wh.png) !important}
.icon-passion{width:36px;height:36px;background-image:url(../img/icon-passion.png)}
.icon-work{width:36px;height:36px;background-image:url(../img/icon-work.png)}
.icon-address{width:36px;height:36px;background-image:url(../img/icon-address.png)}
.icon-building{width:36px;height:36px;background-image: url(../img/icon-agent3.png)}
.icon-vertical_align_top{width:36px;height:36px;background-image: url(../img/icon-vertical_align_top_black.png)}

.icon-vertical_align2{width:36px;height:36px;background-image: url(../img/icon-vertical_align2.png)}
.icon-align3{width:36px;height:36px;background-image: url(../img/icon-align3.png)}
.icon-align4{width:36px;height:36px;background-image: url(../img/icon-align4.png)}
.icon-align5{width:36px;height:36px;background-image: url(../img/icon-align5.png)}
.icon-align6{width:36px;height:36px;background-image: url(../img/icon-align6.png)}
.icon-align7{width:36px;height:36px;background-image: url(../img/icon-align7.png)}
.icon-align8{width:36px;height:36px;background-image: url(../img/icon-align8.png)}
.icon-align9{width:36px;height:36px;background-image: url(../img/icon-align9.png)}
.icon-align10{width:36px;height:36px;background-image: url(../img/icon-align10.png)}
.icon-align11{width:36px;height:36px;background-image: url(../img/icon-align11.png)}
.icon-align12{width:36px;height:36px;background-image: url(../img/icon-align12.png)}
.icon-align13{width:36px;height:36px;background-image: url(../img/icon-align13.png)}
.icon-align14{width:36px;height:36px;background-image: url(../img/icon-align14.png)}
.icon-align15{width:36px;height:36px;background-image: url(../img/icon-align15.png)}
.icon-align16{width:36px;height:36px;background-image: url(../img/icon-align16.png)}
.icon-align17{width:36px;height:36px;background-image: url(../img/icon-align17.png)}
.icon-align18{width:36px;height:36px;background-image: url(../img/icon-align18.png)}
.icon-align19{width:36px;height:36px;background-image: url(../img/icon-align19.png)}
.icon-align20{width:36px;height:36px;background-image: url(../img/icon-align20.png)}
.icon-align21{width:36px;height:36px;background-image: url(../img/icon-align21.png)}
.icon-align22{width:36px;height:36px;background-image: url(../img/icon-align22.png)}
.icon-align23{width:36px;height:36px;background-image: url(../img/icon-align23.png)}
.icon-align24{width:36px;height:36px;background-image: url(../img/icon-align24.png)}
.icon-align25{width:36px;height:36px;background-image: url(../img/icon-align25.png)}
.icon-align26{width:36px;height:36px;background-image: url(../img/icon-align26.png)}
.icon-align27{width:36px;height:36px;background-image: url(../img/icon-align27.png)}
.icon-align28{width:36px;height:36px;background-image: url(../img/icon-align28.png)}
.icon-align29{width:36px;height:36px;background-image: url(../img/icon-engine.png)}
.icon-align30{width:36px;height:36px;background-image: url(../img/icon-align30.png)}
.icon-align31{width:36px;height:36px;background-image: url(../img/icon-align31.png)}
.icon-align32{width:36px;height:36px;background-image: url(../img/icon-align32.png)}
.icon-align33{width:36px;height:36px;background-image: url(../img/icon-align33.png)}
.icon-align34{width:36px;height:36px;background-image: url(../img/icon-align34.png)}
.icon-align35{width:36px;height:36px;background-image: url(../img/icon-align35.png)}
.icon-align36{width:36px;height:36px;background-image: url(../img/icon-align36.png)}
.icon-align37{width:36px;height:36px;background-image: url(../img/icon-align37.png)}
.icon-align38{width:36px;height:36px;background-image: url(../img/icon-align38.png)}

.icon-digital{width:36px;height:36px;background-image: url(../img/icon-digital.svg)}
.icon-head{width:36px;height:36px;background-image: url(../img/icon-head.svg)}
[class^=icon-].invert{filter:invert(1);}

.icon-biz{width:80px;height:80px;background-image: url(../img/icon-biz.svg);}
.icon-progress{width:80px;height:80px;background-image: url(../img/icon-progress.svg);}
.icon-work2{width:80px;height:80px;background-image: url(../img/icon-work.svg);}
.icon-store{width:36px;height:36px;background-image: url(../img/icon-store.svg)}
.icon-horizontal{width:36px;height:36px;background-image: url(../img/icon-horizontal.png)}

.daedong-mark{display: inline-block; border:1px solid #E6E6E6; border-radius: 50%; width:104px;height: 104px;
    background:#F5F5F5 url(../img/mark.png) no-repeat center center ;background-size: 40px 40px; }

/* helper classs */
.d-flex-space{display: flex;align-items: center;justify-content: space-between}
.rounded{border-radius: .556rem !important}

/* grid */
.container{max-width: 1246px;}

/* typo */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{font-weight:700;line-height:inherit;letter-spacing: -.05em}
h2, .h2{font-size:3rem} /* 48px */
h3, .h3{font-size:2.5rem} /* 40px */
h4, .h4{font-size:2rem} /* 32px */
h5, .h5{font-size:1.5rem} /* 24px */
.h2-group{margin:0 1em 2.5em; text-align: center}
.h2-group small{display: block;margin-bottom: .5em; font-weight:700; font-size:.5em;letter-spacing:-.02em}
.txt-line{display: -webkit-box;overflow: hidden;max-height:3em;line-height: 1.5;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;word-break: break-all;white-space: normal}
.fw400{font-weight: 400;}
.fw300{font-weight: 300;}
.strong{font-weight: 700;}
.fs-small{font-size: 14px;}
.fs-big{font-size: 56px;}

/* theme */
.text-primary,.text-primary:hover,.required{color:#EF4023 !important}
.text-secondary{color:#231F20 !important}
.text-silver{color:#F5F5F5 !important}
.text-grey{color:#9D9F9E !important}
.text-grey2{color:#585858 !important}
.text-grey3{color:#E6E6E6 !important}
.text-gold{color:#927249 !important}
.text-green{color:#01677D !important}
.text-purple{color:#7A252C !important}
.text-black{color:#000 !important}
.bg-primary2{background-color:#fff !important;color:#EF4023 !important}
.bg-primary{background-color:#EF4023 !important;color:#fff !important}
.bg-secondary{background-color:#231F20 !important;color:#fff !important}
.bg-gold{background-color:#927249 !important;color:#fff !important}
.bg-green{background-color:#01677D !important;color:#fff !important}
.bg-purple{background-color:#7A252C !important;color:#fff !important}
.bg-grey{background-color:#9D9F9E !important;color:#fff !important}
.bg-grey2{background-color:#585858 !important;color:#fff !important}
.bg-lightgrey{background: #F5F5F5;}

/* list */
[class*=lst-type-]>li{position:relative;padding-left:.8em;line-height: 1.75}
[class*=lst-type-]>li:before{position:absolute;left:0}
.lst-type-dot>li:before{content: "·";}
.list-dash li{position: relative;display: flex;;line-height: 1.75}
.list-dash li::before{content:"-";display: inline-block;margin-right:0.5em}
.list-group-flush{border-top: 1px solid #e5e5e5}
.list-group-flush .list-group-item{position: relative;padding: 1.667rem 0;border-bottom: 1px solid #e5e5e5 !important}
.no-data{padding:2em;font-size:1.2em;text-align: center}

/* box */
/* 0810 수정 */
.link-video{position: relative;display: block;overflow: hidden;width: 100%;height: 0;padding-top: 56.25%;background-repeat: no-repeat;	background-position: center center;	background-size: cover;}
.link-video img{width: 100%;}
.link-video::before{content:"";position: absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.3);}
.link-video:after{ content: "";position: absolute;top:50%;left:50%;width: 80px;height: 80px;background: url("../img/icon-play.png");background-size: cover;transform: translate(-50%,-50%)}
.link-video:hover:after{ background-image:url("../img/icon-play-active.png")}
.bx-news{align-items: center;background: #F5F5F5}
.bx-news>*:last-child{padding:2em}
.bx-news p{margin:1.25em 0 2.25em;}
.bn-icon-tx{ display: block; padding:2em; background:#F5F5F5;text-align: center}
.bn-icon-tx i{margin-bottom:1rem}
.bn-icon-tx h4 i, .bn-icon-tx .h5 i{margin-bottom:0}
.bn-icon-tx+.bn-icon-tx{margin-top:2em}

/* button */
.no-style{border:0;background: none}
.btn{ position: relative;padding:.938em 2em; border-color: transparent;border-radius:9em;  background: #000;font-weight:700; color:#fff !important}
.btn:hover,.btn:focus{background: #585858}
.btn:active{background:#EF4023;box-shadow:none !important;}
.btn[disabled],.disabled{background:#E6E6E6 !important}
.btn-lg{padding:1.2em 3.6em}
.btn-outline{background:none !important; border-color:#231F20;color:#231F20 !important}
.btn-outline:hover:before,.btn-outline:focus:before{content: "";position: absolute;top:-1px;bottom:-1px;left:-1px;right:-1px; border:2px solid #231F20;border-radius:9em;pointer-events:none}
.btn-outline:active{background:#231F20 !important;color:#fff !important}
.btn-outline-light{background:none !important; border-color:#E6E6E6 !important;color:#231F20 !important}
.btn-outline-light:hover{border-color: #231F20 !important;}
.btn-square{border-radius:0 !important}
.btn-full{background:#231F20;padding:1.5rem 0}
.btn-full .btn{padding:1.5em;background:#231F20;}
.btn-full .btn:not(:last-child){border-right:1px solid #555}

.btn-top{display: flex; align-items: center; justify-content: center;flex-direction: column;position:absolute;bottom:100%;right:20px;z-index:99; width: 48px;height: 48px;margin-bottom: 20px; border:0; background: #fff;box-shadow: 0px 6px 10px rgba(0,0,0,.1);border-radius:50%;font-weight:700; color:#9D9F9E}
.btn-top:before{content: ""; border:5px solid;border-color:transparent transparent #9D9F9E;}
[class^=btn-round]{display: flex; align-items: center; justify-content: center;flex-direction: column;width: 60px;height: 60px;margin-bottom: 194px;border:0;background-color: #231F20;color:#fff; border-radius:50%;font-size: 20px;}


/* form */
.form-control{height:48px;border:1px solid #E6E6E6;border-radius:0;box-shadow:none !important}
input::placeholder {color:#9D9F9E !important}
.form-control:hover,.form-control:focus{border-color:#231F20}
.form-control:hover::placeholder,.form-control:focus::placeholder{color:#231F20}
.form-control[disabled]{border-color:#F5F5F5;background:#F5F5F5}
.is-invalid{border-color:#EF4023 !important}
.checkbox input{position: absolute;width: 1px;height:1px;opacity:0}
.checkbox span:before{ content: ""; display:inline-block;width: 24px; height: 24px;margin:-4px 8px -4px 0; border:1px solid #231F20;vertical-align: middle;background: #fff;}
.checkbox input:checked+span:before{ background:#231F20 url("../img/check@2x.png") no-repeat 50% 50% / 17px auto;}
.form-srch,.input-number{position: relative}
.form-srch input,.input-number input{position: relative;width: 100%; height:56px;padding:16px 72px 16px 24px;border:2px solid #231F20;border-radius:9em; outline:0}
.form-srch button,.input-number button{position: absolute;top:0;right:0;z-index:1; width: 56px;height:100%;border:0;background:none; font-size:1.5rem;}
.input-number input{padding:0 72px;font-weight:700; font-size:24px; text-align: center}
.input-number button:first-child{right: auto;left:0;}
.form-group{margin-bottom:2.5em}
.col-form-label{font-weight:700;}
.agree-bx{overflow: auto;max-height:184px;margin:2em 0 1em; padding: 2em;background: #fff; color:#585858}
.frm-ft{margin:60px 0; text-align: center}
.custom-file-label{line-height:2;color:#9D9F9E}
.custom-file-label::after{content: "찾아보기";background-color: #231F20;height: 100%;color:#fff; line-height:2;width: 176px;text-align: center; border-radius: 2px;margin-left: 2rem;}

/* table */
.tb-fixed{table-layout: fixed}
.tb{border-top:2px solid;border-bottom:2px solid}
.tb.btm0{border-bottom:0 !important}
.tb tr>*{padding:1em 2em;border:1px solid #E6E6E6;border-top: 0;}
.tb th{white-space:inherit;background:#F5F5F5;font-weight:400; text-align: center}
.tb th.strong{font-weight: 700;}
.tb tr>*:first-child{border-left:0;}
.tb tr>*:last-child{border-right:0;}
.tb thead th{border-bottom: 2px solid}
.tb .br{border-right:1px solid #E6E6E6;}
.tb td{vertical-align:top}
.tr-bt{border-top:2px solid}

/* Alert */


/* Badge */
.badge{display: inline-block;min-width:80px;padding: .5em .8em; background:rgba(0,0,0,.1);border-radius:9em;font-weight:400;font-size:12px;vertical-align: middle;}
.badge-sm{font-size: .5rem}
.badge-sm2{min-width:60px;}
.badge.shadow{background: #fff;box-shadow: 0px 6px 10px #0000001C;}

/* Pagination */
.pn{display: flex;justify-content: center;align-items: center;margin-top: 3.333em}
.pn li{margin:0 10px;font-weight:700;}
.pn .active a{color:#EF4023}
[class^=icon-pn]{width:15px;height:15px;margin-top: -3px; background-image:url("../img/pn-first.png");background-size: auto 100%; opacity:.5}
.icon-pn-prev,.icon-pn-next{background-image:url("../img/pn.png")}
.icon-pn-next,.icon-pn-last{transform: scale(-1,1)}
[class^=icon-pn][href]{opacity:1}

/* progress */

/* navs */
.nav{border-bottom: 0}
.nav-pills{margin: 0 -4px 3rem;justify-content: center;}
.nav-pills .nav-item{padding:0 4px;margin-bottom: 10px; white-space: nowrap}
.nav-pills .nav-link{width: 166px; padding:.938em 0;border-radius:9em;border:1px solid transparent;background: #fff; font-weight:700;text-align: center}
.nav-pills .nav-link:hover{border-color:#231F20}
.nav-pills .nav-link.active{background:#231F20 !important;color:#fff !important}
.nav-pills.type2 .nav-link{background:#F5F5F5}
.nav-tabs .nav-item{margin:0}
.nav-tabs .nav-link{padding:calc(1.594em - 3px);border: 0;border-bottom:2px solid transparent;background: none !important;font-weight:700}
.nav-tabs .nav-link.active{border-bottom-color:#231F20;color:#000}
.lnb{z-index:90; border-bottom: 2px solid #E6E6E6;background: #fff}
.lnb>.container{margin-bottom: -2px}
.lnb-scroll .lnb{position: fixed;top:112px;left:0;right:0;}
.lnb-scroll .lnb+*{margin-top: 71px}

/* toggle */
.dropdown-toggle[aria-expanded=true]{border-color:#231F20}
a.dropdown-toggle{display: flex;align-items: center;}
.dropdown-toggle{position: relative;padding:0 4.5em 0 1em; text-align: left}
.dropdown-toggle::after,.accordion-btn::after{ content: "";position: absolute;top:50%;right:1em; border:0; font:1.5em xeicon;transform: translate(0,-50%)}
.dropdown-toggle[aria-expanded=true]::after{transform: translate(0,-50%) scale(1,-1)}
.dropdown-menu{width: 100%;margin:-1px 0 0;padding:0;border-color:#231F20;border-radius: 0;}  /* border-top:0; */
.dropdown-menu li>a{display: block;padding:.75em 1em}
.dropdown-menu .active>a{background: #F5F5F5}
.dropdown-toggle.type2{display: block;width: 100%; padding:1.5em 4.5em 1.5em 40px; border:0 !important; background: #F5F5F5}
.dropdown-toggle.type2[aria-expanded=true],.accordion-btn.active{background:#231F20;color:#fff}
/* accordion */
.accordion-btn{display: block;position: relative;width: 100%;margin:.5em 0; padding:1.5em 40px;border:1px solid #E6E6E6}
.accordion-btn .badge{margin-right: 1em; background: #000;color:#fff}
.accordion-btn.active .badge{background:#fff;color:#000}
.accordion-btn.active::after{ transform: translate(0,-50%) scale(1,-1)}
.accordion-cnt{display: none;padding:40px; box-shadow: 0 3px 6px rgba(0,0,0,.1)}

/* Modal */
.modal-close{position: absolute;top:0;right:0;width: 80px;height: 80px;border:0; background: #000;font-size:1.5em; color:#fff}
.modal-ft{margin-top: 40px; text-align: center}
.modal-nobg .modal-content{border:0;border-radius:0;box-shadow:none;background:none;}
.modal-nobg .swiper-container{width: 100%}
.modal-nobg .space-swiper-pn{border:0}
.modal-nobg .space-swiper-pn-num{color:#fff}
.modal-nobg .swiper-button-prev{left:-4rem}
.modal-nobg .swiper-button-next{right:-4rem}
.modal-full{background-color: #fff;padding-left:17px; }
.modal-full .modal-dialog{width:100%;max-width: 100%;margin:0 auto;min-height: 100%;}
.modal-full .modal-content{border:0;background: transparent;}
.modal-full .modal-close{position: fixed; z-index: 1060;}
#cardnews .modal-dialog{max-width:640px}
#introduction .modal-dialog{max-width:1216px}

.modal-head{position: relative;display: flex;justify-content: space-between;padding:1rem 1.5rem;border-bottom:1px solid #E6E6E6;font-weight: 700; }
.modal-head .close{float: none;opacity: 1;}
.modal.modal-static .modal-dialog { -webkit-transform: none !important; transform: none !important;  }

/* Step */
.step{max-width:800px; margin:50px auto}
.step li{-ms-flex-preferred-size:0;flex-basis:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;position:relative;padding:0 5px;font-weight:700; text-align:center;}
/* .step li:before,.step li:after{content:'';position:absolute;top:50%;left:50%;width:100%;margin:-3px;border-top:6px solid #F5F5F5}
.step li:after{width: 50%;} */
.step li:before,.step li:after{content: "";position:absolute;top:50%;left:50%;width:100%;margin:-3px;width:100%;height:6px;background: #F5F5F5;}
.step li:after{width: 50%;border-radius: 6px;}
@keyframes line-ani{
    0% {width:0}
    100% {width:50%}
}
@keyframes line-ani2{
    0% {width:0}
    100% {width:110%}
}
.step li:last-child:before{display:none}
.step b{display:flex;align-items:center;justify-content:center;position:relative;z-index: 1; width:2.667em;height:2.667em;margin:0 auto;border-radius:50%;background:#F5F5F5;font-size:1.5em;}
.step p{position: absolute;top:110%;left:0;right:0;color:#9D9F9E}
.step .active p{color:#231F20}
/* .step .active:after{border-color:#231F20;border-radius:9em;} */
.step .active:after{background: #231F20;animation:line-ani .5s both}
.step .active b{background:#231F20;color:#fff}
.step.org .active b{background:#EF4023;}
.step .active+.active:after{left:-10%;width:110%;animation:line-ani2 .5s both}
.step li:last-child:after{width:0%}
.step li.active:last-child:after{width: 50%;animation:line-ani .5s both}
.step .active-blk b{background:#231F20;color: #fff}
.step .active-blk p{color:#231F20}
.step .active-red b{background:#EF4023;color: #fff}
.step .active-red p{color:#EF4023}

/* Slide */

.swiper-button-next, .swiper-button-prev{background-size: auto 36px}
.swiper-button-next{right:3rem}
.swiper-button-prev{left:3rem}
/* 0812 -프로그래싱바 */
.space-swiper-pn{position: relative;max-width:600px; margin:50px auto 0;text-align: center; }
.space-swiper-pn i {position: relative;display: block; width:100%;overflow: hidden; height:2px; background:#fff;border-radius: 2px;}
.space-swiper-pn i b{position: relative;display: block;width: 100%; height:2px;background:#EF4023;
    /* transform: translateX(-100%); */
}
/* .space-swiper-pn i.progressing b{transform: translateX(0%); transition: 8s linear;  } */

.sect-main-visual .space-swiper-pn > i b{
    display: block;
    width: 0;
    transition-property: width;
    transition-timing-function: linear;
    transition-duration: 0s;
}

.sect-main-visual .space-swiper-pn > i b.is_progressing{
    width: 100%;
}
/* --- 0812 -프로그래싱바 */
@keyframes ani-width{
    0%{width:0}
    100%{width:100%}
}
.space-swiper-pn .stop{width: 0;transition-duration:1s}
.space-swiper-pn-num{margin-bottom:1.5em; color:#9D9F9E}

/* Animate */
.ani-stop{visibility:hidden;animation-name:none !important}
.ani-delay01{animation-delay:.15s}
.ani-delay015{animation-delay:.15s}
.ani-delay025{animation-delay:.25s}
.ani-delay02{animation-delay:.2s !important}
.ani-delay03{animation-delay:.3s !important}
.ani-delay04{animation-delay:.4s !important}
.ani-delay05{animation-delay:.5s !important}
.ani-delay06{animation-delay:.6s !important}
.ani-delay07{animation-delay:.7s !important}
.ani-delay075{animation-delay:.75s !important}
.ani-delay08{animation-delay:.8s !important}
.ani-delay09{animation-delay:.9s !important}
.ani-delay10{animation-delay:1s !important}
.ani-delay11{animation-delay:1.1s !important}
.ani-delay12{animation-delay:1.2s !important}
.ani-delay125{animation-delay:1.25s !important}
.ani-delay13{animation-delay:1.3s !important}
.ani-delay14{animation-delay:1.4s !important}
.ani-delay15{animation-delay:1.5s !important}
.ani-delay175{animation-delay:1.75s !important}
.ani-delay18{animation-delay:1.8s !important}
.ani-delay20{animation-delay:2s !important}
.ani-delay22{animation-delay:2.2s !important}
.ani-delay30{animation-delay:3s !important}
.ani-delay40{animation-delay:4s !important}
.ani-duration03{animation-duration:.3s !important}
.ani-duration04{animation-duration:.4s !important}
.ani-duration05{animation-duration:.5s !important}
.ani-duration{animation-duration:1s !important}
.ani-duration15{animation-duration:1.5s !important}
.ani-duration2{animation-duration:2s !important}
.ani-duration3{animation-duration:3s !important}
@keyframes ani-{
    0%{transform:scale(.9,1.1) translate(0,-100vh); filter: blur(3px)}
    25%,100%{transform:none}
    50%{transform:scale(1.2,.8);filter:none}
}
.ani-{animation:1s .2s both ani-;transform-origin: bottom}



/*========== Layout ==========*/
#hd{position:fixed;top:0;left:0;right:0;z-index:100;height:112px; padding:0; transition: background .3s}
.is-scroll-fix #hd,
.is-scroll #hd{background: #231F20;}
#top{height: 40px;padding:10px 40px; background:#000;font-size:12px; text-align: right}
#top a{margin:0 1rem; color:#9D9F9E !important}
#top .dropdown-toggle{padding:0 3.5em 0 0em}
#top .dropdown-menu {width:auto}
.hd-social{display: inline-block;}
.hd-social a{margin:0 6px !important}
.icon-facebook{width:20px;height:20px;background-image: url(../img/icon-facebook.svg);}
.icon-youtube{width:20px;height:20px;background-image: url(../img/icon-youtube.svg);}
.icon-insta{width:20px;height:20px;background-image: url(../img/icon-insta.svg);}
.icon-blog{width:20px;height:20px;background-image: url(../img/icon-blog.svg);}
.icon-arrow{width:30px;height:12px;background-image: url(../img/icon-arrow.svg);}
.gnb .hd-social{display: block;margin-top:40px}
.gnb .hd-social a{display: inline-block !important;width:32px;height:32px;margin:0 !important}
.gnb .hd-social a+a{margin-left:20px !important}
.drop-lang{display: inline-block;}
.drop-lang .dropdown-menu{min-width: 0;font-size:1em;margin-left: -16px;background: #000;border:none;top:13px !important}
.drop-lang li a{display: block;padding:1em 15px;width:111px;margin:0 !important;color:#fff}
.drop-lang li a:hover{background: #fff !important}
#hd a{color: #fff}
h1{position: absolute;top:60px;left:36px;}
h1 a{display: block;font-size:0}
#gnb .active>a{color:#EF4023 !important}
#gnb li{position: relative}
#gnb ul ul{/*padding:.5em 0;*/text-align: left}
#gnb ul ul a{display: block;padding:.5em 0;font-size:14px;color:#9D9F9E}
#acc{position: absolute;top:64px;right:56px;}
#acc .icon-srch{margin-right:5px; vertical-align:bottom}
.btn-mn{position: relative;width:50px;height:50px;background: none;border: 0;font-size: 0;line-height: 0;text-indent :-999em;color: inherit;outline: 0 !important}
.btn-mn>span, .btn-mn:after, .btn-mn:before{content:"";position: absolute;left:calc((100% - 22px) / 2);top: 50%;width:22px;height:2px;border-radius: 2px;background: #fff;margin-top: -2px;transition: transform .3s, opacity .3s;z-index: 100}
.btn-mn:before{margin-top: -10px;transform-origin:top right}
.btn-mn:after{margin-top: 6px;transform-origin:bottom right}
.gnb-open .btn-mn{z-index: 120}
.gnb-open .btn-mn:before{transform: rotate(-45deg);margin:-10px 0 0 -4px}
.gnb-open .btn-mn>span{opacity:0}
.gnb-open .btn-mn:after{transform: rotate(45deg);margin:5px 0 0 -4px}
.gnb-open #gnb{transform:none !important}
/* ft */
#ft{position: relative;padding:50px 100px;background: #000;font-size:.875em;color:#9D9F9E;}
#ft h2{font-size:0;}
#ft h2+button{margin-left: auto;}
#ft dl{margin: 50px 0;font-weight:300}
#ft dt{margin:20px 0; font-weight:300;color:#fff}
.ft-mn{margin:0 0 15px;white-space: nowrap}
.ft-mn li{display: inline-block;position: relative;margin-right:20px;}
.ft-mn li+li:before{content: "";position: absolute;top:.3em;left:-11px;height:.8em;border-left:1px solid #ccc}
.ft-mn a{color:#fff}
.sitemap h4{margin-bottom:1.25em;font-weight:400; font-size:1rem;}
.sitemap h4 a{ color:#fff}
.sitemap li{margin-bottom: .75em;}
#ft .tel{display: block;margin:50px 0 100px; font-weight:400; font-size:1.25em;color:#fff;}
#ft address{margin-top:60px}

/* body-transparent - 기본이 투명이라고 하는데 아닌거 같음.
.body-transparent:not(.is-scroll) #hd{background:none;box-shadow:none}
.body-transparent #hd{position:absolute;top:0} */

/*================== Sub ==================*/
.page-container{overflow: hidden;position: relative;min-height:calc(100vh - 120px); padding:0 0 120px;}
.page-container>.container{position: relative}
.page-hd{position: relative;display: flex;flex-direction: column;justify-content: center; /* 헤더가 모두 투명해짐 - 롤백할지 모르니 calc로 처리. 112px씩 상단으로 */ height:calc(320px + 112px);padding-top: 112px; padding-bottom: 1rem;background-color:#000; background-position: 50% 50%;background-size: cover;text-align: center;color:#fff;}
.page-hd .h2-group{margin-bottom: 0;}
.page-hd .h2-group small{margin-bottom: 0;}
.page-hd .location{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;position: absolute;bottom:1rem;left:50%;transform: translateX(-50%);font-size:0.75rem;color:#fff;text-align: left}
.page-hd .location li+li::before{ content: "|";margin:0 1rem; opacity: 0.5}
.page-hd-bg{background-color: transparent;}

.sub-title{padding-top:5rem;}
.sect-mt3{margin-top: 12.5rem;} /* 200px */
.sect-mt2{margin-top: 10rem;} /* 160px */
.sect-mt1{margin-top: 7.5rem;} /* 120px */
.sect-mb3{margin-bottom: 12.5rem;} /* 200px */
.sect-mb2{margin-bottom: 10rem;} /* 160px */
.sect-mb1{margin-bottom: 7.5rem;} /* 120px */
.sect-pt3{padding-top: 12.5rem;} /* 200px */
.sect-pt2{padding-top: 10rem;} /* 160px */
.sect-pt1{padding-top: 7.5rem;} /* 120px */
.sect-pb3{padding-bottom: 12.5rem;} /* 200px */
.sect-pb2{padding-bottom: 10rem;} /* 160px */
.sect-pb1{padding-bottom: 7.5rem;} /* 120px */
.mt-10{margin-top: 2.5rem !important;}/* 40px */
.mt-20{margin-top: 5rem !important;}/* 80px */
.mt-120{margin-top: 7.5rem !important;} /*120px*/

.pb-120{padding-bottom: 7.5rem !important;} /* 120px */

.sub-title p {
    margin-bottom:24px;
}

/* 0810 수정 */
.full-box{display: flex;flex-direction: column;justify-content: center;  min-height: 320px;background-position: center center; background-size: cover;display:-ms-flexbox;-ms-flex-wrap:wrap;}
.full-box.v2{display: block;min-height: auto;padding: 7.5rem 0;background:#F5F5F5;}
.row-desc>div[class^=col-]:last-child{padding-left:8% ;}
/* 0810 추가 */
[class*=sect-bg-].full-box{padding:100px 0;min-height: 0;}
/* 이미지 뒤 박스 */
.back-box-style{position: relative;margin-bottom: 5rem;}
.back-box-style::after{content: ""; position: absolute;top:5rem;left:0%; width: 41.25vw;height:100%;background: #F5F5F5;z-index: 0}
.back-box-style>div{position: relative;z-index: 1}
.back-box-style.v2::after{left:auto;right: 0}

/*---- list ----*/
/* normal */
.list li+li{border-top:1px solid #E6E6E6}
.list a{display: flex;align-items: center;padding:2em 0}
.list h4{display: flex;justify-content: space-between; align-items: center; width: 100%;padding:0 3em;}
.list .icon-download{}
.list .vote{padding-left: 3em;white-space: nowrap;color:#585858}
/* news */
.list-news:not(.swiper-wrapper){column-count:3;column-gap:0;margin:-1em 0 7.5em}
.list-news li{padding:1em}
.list-news a{display: block;position: relative;;color:#fff}
.list-news a:before{content: "";height:50%;position: absolute;bottom:0;left:0;right:0;background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5))}
.list-news .cnt{position: absolute;bottom:0;left:0;right:0;padding:2em}
.list-news h4{margin-top: 5px;}
/* iso */
.list-iso li{ margin-bottom:80px;}
.list-iso .row{align-items: center;}
.list-iso h4{margin-bottom: .75em;}
.list-iso p{color:#585858}
.lst-cert{display: flex; align-items: center}
.lst-cert a{width: 50%;padding:10px;text-align: center}
.lst-cert p{margin-bottom:5px;}
.lst-cert a+a{ border-left:1px solid #E6E6E6}
/* product */
.item{display: block;position: relative;font-size:.875em;transition:none}
.item img{display: block;margin:0 auto .75em;transform: scale(0.8)}
.item .cnt{padding:0 2em 2em;}
.item h4{text-align: center}
.item small{font-size:.6em;display: block;font-weight: 700;}
.item p{text-align: center;color:#585858}
.item .spec{margin-top:44px;opacity:0}
.item .spec .spec-wrp{display: flex;flex-wrap: wrap; padding:13px 20px;border-top:1px solid #393637;border-bottom:1px solid #393637}
.item .spec dl{display: flex;}
.item .spec dl:nth-child(odd){width: 50%;}
.item .spec dl:nth-child(even){width: 50%;}
.item .spec dt{font-weight: 400;width: 4.5em;width: 45%;}
.item .spec dd{color:#9D9F9E; width: 65%;}
.item .spec .badge-wrp{width: 100%;}
.ribbon{overflow: hidden; position: absolute;top:0;left:0;width:88px;height: 88px;}
.ribbon>*{position: absolute;top:0;left:-25%;right:-25%;height:100%;padding-top:60%; background:#EF4023;text-align: center; color: #fff;transform: rotate(-45deg) translate(0%,-50%)}
.ribbon.bk>*{ background:#231F20; }
.ribbon.bk>* b{display: block;font-weight: 400; transform: rotate(45deg) }
.item.v2 h4,.item.v2 p{text-align: left}
.item.v2 .cnt{padding:0}
.item.v2 img{border:1px solid rgba(0,0,0,.1)}
.item.v2 p.img{border:1px solid rgba(0,0,0,.1);padding: 2rem;margin-bottom: 1rem;}
.item.v2 p.img>img{border:0}
.item.v2 .spec{opacity:1}
.more-item{padding-top: 100%; border:1px solid rgba(0,0,0,.1)}
.more-item>div{position: absolute;top:0;left:0;right:0;padding-top:30%;text-align: center}
.more-item i{font-size:4em;color:#9D9F9E}
.badge-wrp{margin:20px -2px 0;}
.badge-wrp>*{padding:2px}
.swiper-slide .badge{width: 100%;background: rgba(255,255,255,.1)}
.swiper-slide .list-badge .badge{background: rgba(0,0,0,.1)}
.list-badge{margin:.875em 0}
.list-badge li{display:inline-block;margin-right: 3px;}
.level-badge li {display:block !important;}
/* product - slide */
.slide-item{position:relative;padding:0;;}
.slide-item .space-swiper{position:relative;;width: 1430px;margin: 0 auto;}
.slide-item:before{content: "";height:640px;position: absolute;top:0;left:0;right:0;bottom:170px; background: #F5F5F5}
.slide-item [class^=swiper-button]{top:35%}
.slide-item .swiper-slide{padding:0 3%;}
.slide-item .item .img{display: flex;flex-direction: column;justify-content: center;height: 500px;}
.space-swiper .swiper-slide-active .item{background:#231F20;}
.space-swiper .swiper-slide-active .item,
.space-swiper .swiper-slide-active .item p{color:#fff}
.space-swiper .swiper-slide-active .item img{transform: scale(1.2)}
.space-swiper .swiper-slide-active .item .spec{opacity:1}
/*----- view ----*/
.view-hd small{margin:1em;}
.view-hd{padding:3em 0; border-top:1px solid; text-align: center}
.view-hd .meta{margin-top:1.25em;color:#585858}
.view-hd h3{margin-top: .2em}
.attached{display: flex;margin-top:2em; border: 1px solid #E6E6E6}
.attached dt{display: flex;align-items:center;justify-content:center;flex-direction:column; background:#F5F5F5;}
.attached small{display: block;color:#585858}
.attached dd{width: 100%; text-align: left}
.attached>*{padding:1.5em 3em}
.attached li{padding:.2em 0;}
.attached.v2 dd{padding:1.5em 0}
.list-attaced .icon-download{float: right;margin-top: .25em}
.view-body{padding:80px}
.view-control{padding:80px 0;border-bottom: 1px solid #E6E6E6; text-align: center}
.view-control .btn{width: 176px;margin:0 1em}
.view-related{padding:40px 0}
.view-related h4{margin-bottom:2.5em; text-align: center}
.view-related img{display: block;margin: auto}
/* .view-related .swiper-container{overflow: visible} */
.view-related .swiper-button-prev,
.view-related .swiper-button-next{ display: none}
.prev-next{ display: flex; justify-content:space-between; margin:40px 0; border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; }
.prev-next>*{width: 50%;}
.prev-next>*:last-child{text-align: right}
.prev-next a{display: block;padding:2em;}
.prev-next p{margin-top:.5em;}
.ft-btn{margin:80px 0; text-align: center}
#modal-share .modal-body{padding:60px;}
.share-link{margin-bottom:2em}
.share-input button{padding:0 1em; background: #F5F5F5;font-size:1.1em}
[class^=icon-share]{width:64px; height:64px;margin:0 .8rem;background-image: url(../img/icon-share.svg);border-radius: 50%;background-size:50%;background-color:#ffea00;}
.icon-share-fb{background-image: url(../img/icon-share-fb.svg);background-color:#315096;}
.icon-share-tw{background-image: url(../img/icon-share-tw.svg);background-color:#31a6df;}
.icon-share-blog{background-image: url(../img/icon-share-blog.svg);background-color:#00c73c;}

.view-quick{padding:80px 0; background:#F5F5F5}
.view-quick a{display: block;margin-bottom:15px; padding: 40px 0; background: #fff;text-align: center;}
.view-quick [class^=icon-],
[class^=icon-view-quick]{width: 36px; height:36px;margin-bottom: 1rem; }
.icon-view-quick1{background: url(../img/icon-view-quick.png) no-repeat 50% 0 / auto 100%;}
.icon-view-quick2{background: url(../img/icon-view-quick2.png) no-repeat 50% 0 / auto 100%;}
.icon-view-quick3{background: url(../img/icon-view-quick3.png) no-repeat 50% 0 / auto 100%;}
.icon-view-quick4{background: url(../img/icon-view-quick4.png) no-repeat 50% 0 / auto 100%;}
.view-quick.v2{ background:#fff}
.view-quick.v2 a{ background: #F5F5F5; }


/* index */
[class^=sect-main]:not(.sect-main-visual){padding:100px 0;}
[class^=sect-main]:last-child{padding-bottom: 200px}
/* 0812 - 스와이퍼 */
.sect-main-visual{margin-bottom: 100px;color:#fff}
.sect-main-visual li{position: relative; height:100vh;overflow: hidden; }
.sect-main-visual li .cover{ position: absolute; width:200%;height: 100%;z-index: 11;background-color: #000;transform:translateX(-20%) skew(-39deg);transition: 0.5s  cubic-bezier(0.3, 0, 0.75, 0);transition-delay: 0.5s;}
.sect-main-visual li.swiper-slide-active .cover{transform:translateX(100%) skew(-39deg);}
.sect-main-visual .bg{ position: absolute;top:0;bottom:0;left:0;right:0; background:no-repeat 50% 50% / cover}
.sect-main-visual .cnt{position: absolute;bottom: 30%;right:calc(50% - 600px); padding:0 20px 0 0;text-align: right;}
.sect-main-visual .swiper-slide-active .cnt>*{animation-name: fadeInUp; animation-delay: 1s; animation-duration: 1s;}
.sect-main-visual .swiper-slide-active .cnt small{animation-delay:1.3s}
.sect-main-visual small{font-weight:400; font-size:1.5em}
.sect-main-visual h3{margin-top:.3em; font-size:3em}
.sect-main-visual .cnt h4{display: none;}
.sect-main-visual .link-desc{position: absolute; bottom:0;right:calc(50% -  600px); width:50%; max-width:600px; padding:0 20px 0 5%;z-index:1}
.sect-main-visual .link-desc a{display: block;min-height:200px;padding:3em 10% 4em;background:#231F20}
.sect-main-visual h4{margin-bottom: .5em; font-weight:400; font-size:2em}
.sect-main-visual .more{letter-spacing:.05em;}
/* -- 0812 - 스와이퍼 */
.swiper-control{position: absolute;bottom:4em;right:50%;z-index:1; width:48%; max-width:600px;}
.swiper-control .swiper-pagination{position: static;text-align:left;}
.swiper-control .swiper-pagination-bullet{width: auto;height: auto;background: none;font-weight:700; letter-spacing:.05em;opacity:1}
.swiper-control .swiper-pagination-bullet-active{color:#EF4023}
.swiper-control .space-swiper-pn{border-bottom-color: rgba(255,255,255,.8)}
.btn-autoplay{position: relative;z-index:1; float: right;width: 12px; height: 14px;margin-right:-6px; border:7px solid;border-color:transparent transparent transparent #fff; background:none;transition: none}
.btn-autoplay.active{margin: 0; border-width:0 3px;border-color:#fff}
.swiper-control a{margin-right:1.5em}

.desc-block {padding: 0;}
.desc-block li{margin: 0;}
.desc-block li+li{margin-top: 100px} /* sect-main-business */
.desc-block li>*{display: flex;flex-direction: column;justify-content: center;}
.desc-block li>*.jtf_start{justify-content: flex-start;}
.desc-block li>*:last-child{padding:0 8%}
.desc-block li>*.p{padding:0 8%}

.desc-block .h3,
.desc-block .h5{margin-bottom:.5em}
.desc-block p{color:#585858}

/* 02.제품소개 product */
.category-web{text-align: center;}
.category-web th{border-right: 2px solid #000;}
.category-web td{color:#585858;border-bottom: 1px solid #E6E6E6;}
[class^=category-] label{display: block;}
[class^=category-] label span{display: block;padding: 12px 0;}
[class^=category-] label input{opacity: 0;pointer-events: none;position: absolute;}
[class^=category-] label input:checked+span{background-color: #F5F5F5;}
.category-web tr:last-child td{border-bottom: 0;}
.prod-list .item{ margin-bottom:2.5rem}
.prod-list .item>img{}
.sect-srch h3:nth-child(n+2){margin-top: 2.5rem;}
/* 나에게 맞는 제품 pop */
#modal-find-prod{padding-left: 0;}
#modal-find-prod .find-section{display: none;}
#modal-find-prod .find-section:first-child{display: block;}
.find-section {padding-bottom:100px;}
.find-steps{position: absolute;width: 100%; top:0; opacity: 0;pointer-events: none; }
.find-steps.active{position: relative;opacity: 1;pointer-events: all;transition: 0.3s;}
.find-steps .full-box.v2{padding:5rem 0;margin: 1.8rem 0 5rem 0;}
.find-steps .input-number {position:relative;width: 384px; margin : 2.5rem auto 0;}
.find-steps .input-number aside{position: absolute;font-size: 14px;top:calc(100% + 1.5rem) ;left:0;width: 100%;text-align: center;}

.icon-find-prod1-1{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-1.png)}
.icon-find-prod1-2{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-2.png)}
.icon-find-prod1-3{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-3.png)}
.icon-find-prod1-4{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-4.png)}
.icon-find-prod1-5{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-5.png)}
.icon-find-prod1-6{width:36px;height:36px;background-image:url(../img/icon-find-prod-step1-6.png)}
.icon-find-prod2-1{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-1.png)}
.icon-find-prod2-2{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-2.png)}
.icon-find-prod2-3{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-3.png)}
.icon-find-prod2-4{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-4.png)}
.icon-find-prod2-5{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-5.png)}
.icon-find-prod2-6{width:36px;height:36px;background-image:url(../img/icon-find-prod-step2-6.png)}
.icon-find-prod3-1{width:36px;height:36px;background-image:url(../img/icon-find-prod-step3-1.png)}
.icon-find-prod3-2{width:36px;height:36px;background-image:url(../img/icon-find-prod-step3-2.png)}

.step-choice {margin :5rem 0;}
.step-choice label div{display: flex;flex-direction: column;justify-content:center;align-items: center;height: 176px; border:1px solid #0000001A ; }
.step-choice label div:hover{border-color: #000;}
.step-choice label input{position: absolute;opacity: 0;pointer-events: none;}
.step-choice label input:checked+div{border:3px solid #000}
.step-choice label p{font-size:1.5rem;margin-top:1em;font-weight: 700;}
/* .step-choice label input:checked+div i{filter:invert(1);}  */
.step4-exp{align-items: center;justify-content: center;}

.find-seletion{background: #F5F5F5;padding: 60px 0;margin:60px 0 80px}
.find-seletion ul{display: flex;flex-wrap: wrap;text-align: left;}
.find-seletion ul li{width: 20%;border-right:1px solid rgba(0,0,0,.1);padding: 0 2rem ;}
.find-seletion ul li .badge{min-width: auto;}
.find-seletion ul li:last-child{border : 0;}
.agent-card{display: flex;justify-content:center; border:1px solid #0000001A;margin:80px auto;padding:70px 0}

/* 상세 */
.text-prod-header{color: #FFF;}
.sec_form.hide ~ .page-container .page-hd-prod{
    margin-top : 38px;
    padding-top: 74px;
    
}
.sec_form ~ .page-container .page-hd-prod{
    margin-top: 0;
}
.page-hd-prod{display: block; height:680px; margin-top:38px; padding-top: 112px; padding-bottom: 1rem;
    transition: padding-top .2s ease, margin-top .2s ease;
}
.page-hd-prod>.container{padding-top: 6rem;}
.prod-hd-link{display: flex; background-color: #231F20;margin-top: 2rem; }
.prod-hd-link>p{width: 25%;padding: 10px 0;text-align: center; cursor: pointer;}
.prod-hd-link>p:not(:last-child) a{display: block;color: #fff;border-right: 1px solid #656363;}
.prod-lnb{position: absolute;width: 100%; height: 72px;bottom: 0;left: 0; background:rgba(35,31,32,.5);transition: 0.3s;}
.prod-lnb .row{height: 72px;align-items: center;}
.prod-lnb.fixed{position: fixed;top:112px;left: 0;background:rgba(35,31,32,.9);z-index:98;}
.prod-line small{display: inline-block; margin:7px 10px 0 ;color: #fff;opacity: 0.3;font-size: 60%;vertical-align: text-top; }
.prod-link{display: flex;}
.prod-link li{margin-left: 48px;}

.prod-link .nav-link{padding:0 0 0.625em 0;}
.prod-link .nav-link.active{border-bottom: 1px solid;}
#prod-sec1 .full-box.specs{padding: 2.5rem 0;}
#prod-sec1 .specs .icon-box{text-align: center;}
#prod-sec1 .specs .icon-box>div:not(:last-child){border-right: 1px solid #e5e5e5;}
#prod-sec1 .specs .icon-box dl dt{font-size:1.5rem;margin-top: 1.2rem;}
#prod-sec1 .specs .icon-box dl dd{font-size: 14px;color:#585858;margin-top: 0.5rem;}
#prod-sec1 .specs .icon-box dl dd p{opacity: 0.5;}
#prod-sec1 h3{padding: 7.5rem 0 6.5rem;}
#prod-sec1 .desc-block .h4{margin-bottom: 1rem;}
#prod-sec4 .accordion-btn{text-align: center;}
#prod-sec4 .accordion-btn:not(.active) {background-color: #231F20; color:#FFF;}
#prod-sec4 .accordion-btn::after{display: none;}
#prod-sec4 .accordion-cnt a{display: block;text-align: center;padding:1em 0}
.prod-smart .cont{display:flex;justify-content: flex-end;align-items: center; height: 472px;}
.prod-smart .cont.left{justify-content: flex-start;}
#prod-sec4 .accordion-btn.active .icon-download{filter:invert(1)}
.prod-smart .cont>dl{background: #fff;padding: 3.25rem;width: 384px;}
.prod-smart .badge{min-width: 40px;}
.prod-smart ol{margin-top: 1.5rem;}
.prod-smart li{position: relative;}
.prod-smart li *{vertical-align: middle; }
.prod-smart li>div .h5{display : inline-flex; align-items: center; margin-top: 0.5rem; gap: 0.5rem}
@media all and (max-width: 575px){
    .prod-smart li>div .h5{display : inline;}
    .prod-smart li>div .h5 > span{display : inline-block; margin-left: 44px;}
}
.prod-smart li p{color:#585858;margin-top: 0.5rem;font-size: 14px;}
.prod-smart li p.info{color : #808080;margin-top : 0.5rem;font-size : 12px;}
.prod-smart li .btn{min-width:100px; margin-top:1rem;}

.prod-point-main{position: relative;display:flex; justify-content: center; width:100%;margin:0 auto; clear:both;}
.prod-point-main.on {display: table;}
.prod-point-main .point-block{position: relative; width: 800px;max-width: 100%;}
.prod-point-main.on .point-block{float:left;}
.prod-point-main.on .point-detail{float:left;}
.prod-point-main .btn-round{position: absolute; background-color: rgba(255,255,255,.7);color:#000 ;}
.prod-point-main .btn-round:hover{background-color: rgba(255,255,255,1); }
.modal-open .prod-point-main .btn-round.on.active{background-color: #EF4023;}
.modal-open .prod-point-main .btn-round.on.active i{transform: rotate(45deg);color:#fff}

.prod-point-main .point-detail{display: none;background-color: #fff;}

.prod-compare .compare{display: flex;flex-direction: column;border:1px solid  #0000001A;height: 580px; padding: 10%; justify-content: center;}
.prod-compare .loaded dl{height: 100%; }
.prod-compare .loaded dt{height:61%;display: flex;flex-direction: column;justify-content: center;}
.prod-compare p.ico{background:#9D9F9E ;color:#fff;width: 56px;height: 56px;border-radius: 50%;line-height:56px;text-align: center;font-size: 30px ;margin: 0 auto;}
.btn-compare .btn {width:240px; padding: 1.2em  }

.compare-swiper{position: relative;width:1430px;margin:0 auto}
.compare-swiper .swiper-container{width: 1216px;}
.compare-swiper .swiper-button-prev{left:1rem}
.compare-swiper .swiper-button-next{right:1rem}
.compare-swiper [class*=swiper-button]{top:42%}
.compare-swiper a.item img{margin: 0;}
.compare-swiper a.item p.img{position: relative;  margin: 0 auto .75em;}
.compare-swiper a.item.selected p.img{border:2px solid #EF4023 }
.compare-swiper a.item p.img .btn-round{position: absolute;top:50%;left:50%;transform: translate(-50% , -50%);background: rgba(255,255,255,.7); transition: 0.3s;}
.compare-swiper a.item p.img .btn-round i{color:#000}
.compare-swiper a.item.selected p.img .btn-round{background: #EF4023;}
.compare-swiper a.item.selected p.img .btn-round i{color:#fff;transform: rotate(45deg);}
#modal-compare .modal-content{min-height: 870px;padding:1rem 0}

.prd_banner{
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    width : calc(100% - 40px);
    max-width: 1216px;
    margin: 120px auto 0;
    padding: 48px 54px;
}
.prd_banner .mark{
    width : 61px;
    margin-bottom: 16px;
    background-color: transparent;
}
.prd_banner .bg{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index : -1;
    width : 100%;
    height: 100%;
    object-fit: cover;
}
.prd_banner .m_show{display: none !important}
.prd_banner .m_hide{display: block !important}
.prd_banner h2{
    padding: 0;
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 6px;
}
.prd_banner h3{
    margin-bottom: 16px;
    padding: 0 !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 130%;
}
.prd_banner p{
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.mt_0{margin-top: 0 !important;}
.pt_0{padding-top: 0 !important}
.pb_0{padding-bottom: 0 !important}
@media all and (max-width: 1024px){
    .prd_banner{
        margin: 60px auto 0;
        padding: 36px 20px;
    }
    .prd_banner h2{font-size: 14px;}
    .prd_banner h3{font-size: 26px;}
    .prd_banner p{font-size: 14px;}
}
@media all and (max-width: 768px){
    .prd_banner{
        height: 500px;
        justify-content: flex-start;
    }
    .prd_banner .m_show{display: block !important}
    .prd_banner .m_hide{display: none !important}
    .prd_banner{padding: 30px 20px 152px;}
    .prd_banner .mark{margin-bottom: 10px; width: 41px;}
    .prd_banner h2{
        font-size: 12px;
        margin-bottom: 6px;
    }
    .prd_banner h3{
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 20px;
    }
    .prd_banner p{
        font-size: 12px;
        line-height: 18px;
    }
    .prd_banner .bg{
        object-position: bottom;
    }
}
@media all and (max-width: 500px){
    .prd_banner{
        height: 111.1111vw;
    }
}

.awards_banner{
    position: relative;
    width : 100%;
    height: 21.2500vw;
    margin-top: 200px;
    background: url("/img/product/awards_banner_bg.png") no-repeat center / cover;
}
@media all and (max-width: 1920px){
    .awards_banner{
        height: 408px;
    }
}
.awards_banner .m_show{display: none !important}
.awards_banner .m_hide{display: block !important}
.awards_banner h3{
    padding: 0 !important;
}
.awards_banner ul{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 32px;
    width : calc(100% - 40px);
    max-width: 1216px;
    margin: 0 auto;
    padding: 60px 0
}
.awards_banner li:nth-child(1){
    grid-column: 5/-1;
}
.awards_banner li:nth-child(2){
    grid-column: 5/9;
}
.awards_banner li:nth-child(3){
    grid-column: 9/-1;
}
.awards_banner li > div{
    display: flex;
    align-items :center;
    gap:20px;
    margin-bottom: 20px;
}
.awards_banner h2{
    font-size: 32px;
    font-weight: 600;
    line-height: 130%;
    background: linear-gradient(91deg, #F9F295 8.03%, #E0AA3E 36.78%, #FAF398 66.78%, #B88A44 91.36%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 40px;
}
.awards_banner h3{
    font-size: 16px;
    font-weight: 700;
    line-height: 130%;
    background: linear-gradient(91deg, #F9F295 8.03%, #E0AA3E 36.78%, #FAF398 66.78%, #B88A44 91.36%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.awards_banner p{
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    color: #fff;
}
@media all and (max-width: 1024px){
    .awards_banner li > div{gap: 10px; margin-bottom: 12px;}
    .awards_banner h3{font-size: 14px;}
    .awards_banner li:nth-child(2) img{width : 100px;}
    .awards_banner li:nth-child(3) img{width : 80px;}
    .awards_banner p{font-size: 12px;}
}
@media all and (max-width: 768px){
    #prod-sec1 .specs .icon-box dl dt{
        font-size: 16px;
    }
    #prod-sec1 .specs .icon-box dl dd{
        font-size: 12px;
    }
    .awards_banner{
        width : calc(100% - 40px);
        max-width: 320px;
        height: 604px;
        margin: 60px auto 0;
        background: url(/img/product/awards_banner_bg_m.png) no-repeat center / cover;
    }
    .awards_banner ul{
        display: block;
        width : 100%;
        padding: 223px 20px 60px;
    }
    .awards_banner h2{
        font-size: 20px;
        text-align: center;
    }
    .awards_banner li > div{gap:20px; margin-bottom: 10px;}
    .awards_banner li:nth-child(2){
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid rgba(255,255,255,0.2);
    }
    .awards_banner li:nth-child(2) img{
        width : 93px;
    }
    .awards_banner li:nth-child(3) img{
        width : 69px;
    }
}

/* 03. 100년대동 - company */
.history100 {}
.history100 li{display: flex;}
.history100 li:not(:last-child){margin-bottom:2.5rem;}
.history100 li>span{font-size: 1.5rem;color:#9D9F9E;margin-right: 3.25rem;}
.history100 li>p{padding-top: 5px;}
.history100 [class^=col-]:first-child{border-right: 1px solid #E6E6E6 }
.history100 [class^=col-]:last-child{padding-left:7.5rem ;}
.history .page-container{padding-bottom: 0;}
.history .full-box{color:#fff;position:relative;z-index: 3;}
.history .full-box h3{font-size: 3.5rem;line-height: 1.14; border-left: 4px solid #EF4023; padding-left:1.5rem;}
.history .full-box p{font-size: 1.5rem;padding-top: 1rem;padding-left: 1.5rem;margin-left: 4px;}
.history-list .row>div{position: relative;}
.history-list .row>div:first-child{padding-top: 5rem;}
.history-list .row [class*=img-ani]{max-width:80%;display: inline-block;}
/* .history-list .row>div:first-child img{border:1px solid #E6E6E6;} */
.history-list .row>div:last-child{align-self: center;padding:0 5rem;}
.history-list .row>div:last-child::before{content: "";position: absolute; top:1rem;width: 1rem;height: 1rem;border-radius: 50%;background: #EF4023;border:12px solid #fff;box-sizing: content-box;z-index:9;}

.dd-img{max-width: 43%}
.summary {margin-left: 4.5rem;align-self: center;}
.summary dt{font-weight: 400; color:#585858}
.summary dt small{color:#000;opacity: 0.5 }
.summary>dl{border-bottom: 1px solid #E6E6E6;margin-left: 2rem;margin-bottom: 2.5rem;padding-bottom: 1.5rem;width:calc(50% - 2rem) }
.summary>dl:nth-last-child(-n+2){border-bottom: 0;margin-bottom: 0;}
.summary dd span{font-size: 3rem}

.company .nav{margin-bottom: 0;}

.ci-tabs .tab-pane:not(:first-child){padding-bottom: 120px;}
.ci-mark>div:not(:first-child){margin-top: 5rem;}
.ci-mark h4+*{margin-top: 2.5rem;}
.ci-mark p.st{margin-top: 2.5rem;margin-bottom: 1rem;font-weight: 700;}

.ci-color-red{background: #EF4023;}
.ci-color-black{background:#231F20;}
.ci-color-silver{background:#8A8D8F;}
.ci-color-gold{background:#927249;}
.ci-color-gray{background:#D2D2CD;}
.ci-color-lightgray{background:#EFEEE9;}
.ci-color-mediumgray{background:#9D9F9E;}
.ci-color-darkgray{background:#585858;}
.ci-color-greenlight{background:#69C7C6;}
.ci-color-green{background:#01677D;}
.ci-color-burgundy{background:#7A252C;}
[class^=ci-color-]{position: relative;width: 100%;font-size: 0.75rem;}
[class^=ci-color-]::after{content: "";display: block;padding-bottom: 40.473%;}
.sub [class^=ci-color-]::after{content: "";display: block;padding-bottom: 20.912%;}
[class^=ci-color-]>*{display: flex;flex-direction: column;justify-content: space-between;position: absolute;top: 0;left: 0;padding: 1rem; width: 100%;height: 100%;}
/* [class^=ci-color-] span{opacity: 0.7} */
@media all and (max-width: 992px){
    .sub [class^=ci-color-]::after{
        padding-bottom: 28%;
    }
}
@media all and (max-width: 575px){
    [class^=ci-color-]::after{
        padding-bottom: 58.688%;
    }
    .sub [class^=ci-color-]::after{
        padding-bottom: 50%;
    }
}
@media all and (max-width: 360px){
    [class^=ci-color-]::after{
        padding-bottom: 100%;
    }
    .sub [class^=ci-color-]::after{
        padding-bottom: 67.55%;
    }
}

.kioti-visual{background:#000 url() no-repeat center center/cover;height: 680px}
.kioti-st1{padding-top:100%;}
.kioti-st2{padding-top:100%;}
.kioti-st3{padding-top:200%;}

.vision-visual{background:#000 url() no-repeat center center/cover;height: 680px}
.sect-mission .vision-cont{margin-bottom:7.5em;}
.vision-cont *{font-weight: 300;}
.vision-cont .manage{display: flex;flex-direction: column;justify-content: center;height: 420px;background:#fff;text-align: center; padding: 0 15%;}

.ethical-bg1{background-repeat: no-repeat;}
/* 임시 -> [class*=ethical-bg]{background-size: 100% 550px} */
.ethical .container-box{padding:6.25rem 6.5rem;background:#fff;border-bottom:1px solid #E6E6E6;}
.ethical .container-box.v2{padding:2.5rem ;}
[class*=ethical-bg] .full-box{background: transparent !important;}
[class*=ethical-bg] .badge{min-width: auto;margin-right: 1rem;}
.ethical2.full-box{padding: 7.5rem 0;}
.ethical2 div[class^=col-]{margin-bottom: 2rem;}
.ethical2 div[class^=col-]:last-child{margin-bottom: 0;}
.ethical2 dl{display: flex; background: #fff;padding: 2.25rem;height: 100%}
.ethical2 dt{align-self: center;padding-left: 2rem;}
.ethical2 dd{display: flex ;flex-direction: column; justify-content: center; border-left: 1px solid #E6E6E6;min-height: 100px;padding-left: 2rem}
.ethical2 dd strong{display: block;margin-bottom: 1rem;}
.ethical2 dd ul{font-size: 0.875em}
.ethical-charter{background-repeat: no-repeat ; background-size: cover;padding: 7.5rem 0;}
.full-box .accordion-cnt{background-color: #FFF;}
.full-box .ethical-rules .accordion-btn:not(.active) {background-color: #FFF; color:#000;}
.full-box .accordion-btn:not(.active) .icon-download {filter: invert(1);}
.ethical-rules li{margin-top: 0.5rem;}
.ethical-report .frm-ft .btn{width: 240px;}
.ethical-report2 {border-top:1px solid #000;padding-top:5rem;padding-bottom: 5rem;}
.ethical-report2 .row .row{justify-content: center ; align-items: center;}
.ethical-report2 i{display: inline-block; font-size: 32px;color:#9D9F9E;vertical-align: middle;margin-right: 1.5rem;}
.report-result{max-width: 590px;margin: 0 auto;}
.report-result .col-form-label{width: 104px;}

.ir-summary>.row {align-items: flex-end;}
.ir-summary .stock{background: #F5F5F5; padding: 24px 40px;}
.ir-summary .stock h5{display: flex;justify-content: space-between;align-items: flex-end;}
.ir-summary .stock h5 small{ float:right;font-size: 12px ;}
.ir-summary .cont{justify-content:space-between;align-items: center; margin-top: 0.5rem;}
.ir-summary .price{font-size:3rem;}
.ir-summary .price i{font-size:2.2rem}
.ir-list h4 , h4.ir{display: flex;align-items: center;}
.ir-list h4 small , h4.ir small{font-size: 12px;margin-left: auto;letter-spacing: 0 }
.ir-list .tb tr>*{padding-left: 0 ; padding-right: 0;}
.ir-list th{background: #fff;font-weight: 700;}
.ir-list td{color: #9D9F9E;}
.ir-list td.bg-b{background: rgba(1, 103, 125, 0.1)}
.ir-list td.bg-b.st , td.color-b{color:#01677D}
.ir-list td.bg-p{background:rgba(239, 64, 35, 0.1)}
.ir-list td.bg-p.st , td.color-p{color:#EF4023}
.ir-list i[class^=xi]{font-size: 0.9em;}
.ir-list .bg-lightgrey td{color: #000;}
.ir-graph{position: relative; background: #F5F5F5;margin-top: 1.5rem;padding:2rem}
.ir-graph .nums{display: flex; font-size: 12px;}
.ir-graph .g-y>p{height: 3rem;}
.ir-graph .g-y>p:first-child{margin-top: 0;}
.ir-graph .g-x>div{position: relative; height: 3rem;text-align: center;}
.ir-graph .g-x>div::after{content: "";position: absolute;width:100%;top:0;left:0;border-top:1px solid #E6E6E6;z-index: 0;;}
.ir-graph .g-x>div:first-child{margin-top: 0.5rem;}
.ir-graph .g-x>div:last-child{height: 1.5rem;}
.ir-graph div.bars{display: flex;justify-content: center; }
.ir-graph div.bars>*{position:relative; width: 22%;}
.ir-graph .bar{position: absolute;bottom: 0;left:50%; max-width:80%; width:45px;transform: translateX(-50%); z-index: 1; }
.ir-graph .bar>*{display: block;}
.ir-graph .bar>strong{position: absolute;width:100%;margin-top: -1.5rem}
.ir-graph .bar>span{background: #9D9F9E;height: 100%;}
.ir-graph div.last{display: flex;justify-content: center;height: 1.5rem;}
.ir-graph div .bd-top{border-top:2px solid #000;}
.ir-graph div.last>*{width: 22%;}
.ir-report div>a{display: block;border:1px solid #E6E6E6;padding: 3.5rem ;text-align: center;margin-bottom: 2rem;}
.ir-report div>a p.fs{margin-top: 1rem;margin-bottom: 2.5rem;font-size: 0.9rem;}

.head-office{padding: 2.5rem 3rem;}
.head-office h4{margin-top: 0.5rem;margin-bottom: 1rem;}
.office-info{margin-top: 0.5rem;}
.office-info>p{display: none;}
.office-info.active>a{display: none;}
.office-info.active>p{display:block;}
.office-swiper .space-swiper-pn{margin-top: 0;}
.office-swiper [class^=swiper-button]{ background:none;font-size: 28px;color:#fff; }
.office-swiper .swiper-button-prev{left: 2rem;}
.office-swiper .swiper-button-next{right: 2rem;}
.factory-output{margin-top: 3rem;text-align: center;}
.factory-output .col{border-right:1px solid rgba(0, 0, 0, 0.1)}
.factory-output .col,
.head-office-detail .desc {font-size: 0.9em;}
.factory-output .col span{font-weight: 400;}
.head-office-detail{display:flex;	 background: #F5F5F5;margin-top: 4rem;}
.head-office-detail .map-area{height: 506px;background: #ccc;}
.head-office-detail .desc{align-self:center;}
.head-office-detail .desc>div{width: calc(1216px / 2);float:right}
.head-office-detail .desc dt{border-left:2px solid #EF4023;padding-left: 1rem;}
.office-list>div{margin-top: 5rem;padding-top: 5rem;border-top:1px solid #E6E6E6;}
.office-list>div:first-child{border-top: 0 }
.office-list .head-office{padding-bottom: 0;}

.family-office{padding:0 3rem;align-self: center;}
.family-office h4{margin-top: 0.5rem;margin-bottom: 1rem;}
.family{align-items: center;}
.family-info{border-top:1px solid #E6E6E6 ; border-bottom:1px solid #E6E6E6 ;padding: 30px 0;margin-top: 2.5rem;}
.family-info [class^=col]{margin:10px 0;display:flex;align-items: center;}
.family-info [class^=col] span{flex:1}



/* 6. 대동스토리 */
.sect-story{padding-top:80px;padding-bottom:60px;}
.sect-story-2{margin: 80px 0}
.sect-story-2>.h4{margin-bottom: 1em}
.slide-video{text-align: center}
.list-img h4{margin: 1em 0 .5em}
.list-img.row>*{padding-bottom:40px}
.list-img>.col-12+.col-12{border-top:1px solid #E6E6E6}
.sect-catalog+.sect-catalog{margin-top: 60px}
.list-agent li{align-items: center; padding:50px 0;border-bottom: 1px solid #E6E6E6}
.list-agent h4{font-weight:400;font-size:1.5em}
.list-agent h4 b{display: block;font-weight:400; font-size:2em}
.list-agent p{font-size:.875em;color: #585858}
.agent-mark{display: flex;align-items: center;justify-content: center; flex-direction: column; width: 11em;height:11em; margin: 0 auto; padding:1.4em 0; border-radius:50%; background:#01587D url(../img/agent-mark.svg) no-repeat 50% 50% / 60% 60%;text-align: center; white-space: nowrap; color:#fff;border:10px solid #1F769B}
.agent-mark b{display: block;width: 100%;margin-bottom: .1em; border-bottom: 1px solid rgba(255,255,255,.3); font-size: 3em;}
.list-agent-open{margin-top:40px;margin-bottom: 60px}
.list-agent-open .cnt{height:100%; padding:3em 2em; border:1px solid #E6E6E6}
[class^=icon-agent]{width:100%; height:36px;background-image: url(../img/icon-agent.png);background-size: auto 100%;}
.icon-agent2{background-image: url(../img/icon-agent2.png)}
.icon-agent3{background-image: url(../img/icon-agent3.png)}
.list-agent-open h5{ margin:.5em 0; font-weight:400; font-size:2em; text-align: center;}
.list-agent-open .list-dash,.list-agent-open p{font-size:.875em;color: #585858}
.list-step{display: flex; width: 100%;}
.list-step li{display: flex;position: relative;width: 100%;padding:1em}
.list-step li:before{content: "";width: 1px;margin-left: -1px; padding-top:100%}
.list-step li+li:after{content: "";position: absolute;top:50%;left:-5px;;border:8px solid; border-width:20px 15px;border-color:transparent transparent transparent #9D9F9E; transform: translate(0,-50%)}
.list-step div{display: flex;flex-direction: column; width:100%;padding:2.8em 1em 0; border-radius:50%; background:#F5F5F5;text-align: center}
.list-step p,.list-support p{margin-top: .5em; font-size:.875em; color:#585858}
.list-step.v2 div{flex-direction: row; justify-content: center; align-items: center; height: 100%;  padding: 0;}
.list-step .badge{min-width: 40px;}
.list-step .badge+*{display: block; margin-top: 0.5rem; font-weight: 500; font-size: 2rem;}
.list-step .badge+*+*{position: absolute; left: 50%; transform: translateX(-50%); font-size:.875rem; font-weight:500; color:#585858;}

.list-support li{ display: flex; align-items: center;padding-bottom: 30px}
.list-support .cnt{padding:0 2em}
.agent-contact{ background: #F5F5F5}
.list-dot>li{position: relative; padding-left: .8em}
.list-dot>li:before{ content: "\2022";position: absolute;left:0;top: -.05em}
div[id^="modal-img"] .zoom-content{overflow-x:auto;}
div[id^="modal-img"] img{max-width: 165%;width: 165%;}

/* 대동 무비 페이지 css 추가 */
.slide-video{position: relative;}
.slide-video [class^="swiper-button-"]{top:40%;}
.slide-video .swiper-button-prev{left:-6rem}
.slide-video .swiper-button-next{right:-6rem}
/* 검색 */
#search{padding:60px 0;background: #F5F5F5;text-align: center}
.form-srch{max-width:560px;margin:0 auto 20px}
.srch-hash li{display:inline-block;margin:.5em 1em .5em 0;font-size:.875em}
.srch-hash a:before{content: "#"}
.srch-recent{display: flex;}
.srch-recent dd{width: 100%; padding:0 20px; text-align: left}
.srch-recent dt{white-space: nowrap; font-size:.875em;}
.srch-recent li{display: inline-block;}
.srch-recent li>div{padding:4px 10px; border-radius:9em; background: #fff; font-size:.875em}
.btn-all-delete{ float: right; font-size:.875em;}
.srch-popular li{ border-bottom: 1px solid #E6E6E6}
.srch-popular h4{ display: flex; align-items: center;margin: 0; padding:.75em 0}
.srch-popular strong{ width: 100%;padding: 0 1em;}
.srch-popular i{color:#585858;}
#search-page #search{padding-top:200px}
#search-page .form-srch,.srch-recent{max-width: 800px;margin:0 auto 20px}
.srch-title{margin:80px 0 -40px; font-weight:400; color:#9D9F9E}
.sect-srch+.sect-srch{ border-top:1px solid}
.sect-srch .h4,.sect-story-2>.h5{margin-bottom: 1em}
.sect-srch .frm-ft{margin-bottom: 0}
.sect-srch .frm-ft .btn , .frm-ft .btn.fix-size{width: 176px}

/*-------------- 반응형 --------------*/
@media screen and (min-width: 576px){
    .history-list .row:nth-child(odd)>div:first-child{border-right:1px solid #ebebeb ;}
    .history-list .row:nth-child(odd)>div:last-child::before{left:calc(-0.5rem - 13px);}
    .history-list .row:nth-child(even) {flex-direction: row-reverse;}
    .history-list .row:nth-child(even)>div:first-child{border-left:1px solid #ebebeb ;text-align: right;}
    .history-list .row:nth-child(even)>div:last-child::before{right: calc(-0.5rem - 13px);}
    .history-list .row:nth-child(even)>div:last-child{text-align: right;}
    .history-list .row:last-child>div{padding-bottom: 10rem;}
    
    .list-step.v2 div{background:#fff; border:1px solid #E6E6E6;}
}
@media screen and (max-width: 1499px){
    #ft{position: relative;padding:50px 20px;}
    .prod-lnb{padding: 0 20px;}
    .compare-swiper {width: 100%;}
    .compare-swiper .swiper-container ,
    .slide-item .space-swiper{width: 85%;margin: 0 auto;}
    .item .cnt{padding:0 1rem 2rem}
}
@media screen and (max-width: 1200px){
    .sect-main-visual .cnt , .sect-main-visual .link-desc{right: 0;}
}
@media all and (max-width :768px){
    .md_mh48{
        min-height: 48px;
    }
}

/* 개발 임시 */
#html-guide>section{margin-bottom: 60px;padding-bottom: 60px; border-bottom: 1px solid #ccc;}
#html-guide>section>h3{margin-bottom: 1em}

.only-m{display: none;}





/*게시물*/

.view-body > figure.image {
    display: table;
    clear: both;
    text-align: center;
    margin: 1em auto;
}

.image > figcaption {
    display: table-caption;
    caption-side: bottom;
    word-break: break-word;
    color: #333;
    background-color: #f7f7f7;
    padding: .6em;
    font-size: .95rem;
    outline-offset: -1px;
}

.view.container table {
    border: 1px solid #dee2e6;
}


.view.container td, .view.container th {
    border: 1px solid #dee2e6;
}



/* 사파리 호환성 */

#top [type=button] {
    -webkit-appearance: button-bevel;
}


/* 플로팅 버튼 */

.float_btn [class^=btn-round]{box-shadow:0px 6px 10px #00000040; margin-bottom: 0}
.float_btn ul [class^=btn-round]{margin-bottom: 16px;}
.float_btn { position: static;bottom:165px;right:20px;width: 60px;z-index: 99;}
.float_btn.abs{position: absolute;bottom:auto;bottom:0px}
.float-nav{display: none;opacity: 0;pointer-events: none;transition: 0.5s;}
.float-nav li{position: relative;}
.float_btn.active .float-nav{display: block;opacity: 1;pointer-events: all;}
.float-nav .badge{position: absolute;top:10px;right:100%;margin-right: 1rem;width:100px;}

.icon-float-share{width:15px;height:15px;background-image: url(../img/float-share.svg);}
.icon-float-phone{width:15px;height:15px;background-image: url(../img/float-phone.svg);}
.icon-float-msg{width:15px;height:15px;background-image: url(../img/float-msg.svg);}
.icon-float-store{width:15px;height:15px;background-image: url(../img/float-store.svg);}

/* .btn-float-open{background-color: #EF4023;} */
.btn-float-open{background-color: #231F20;}
.active .btn-float-open{background-color: #9D9F9E;}
.active .btn-float-open i{transform: rotate(45deg);transition: 0.3s;}

.floating_scr_top{
    position:fixed;
    bottom: 4.438rem;
    right: 1.875rem;
    z-index : 100;
    width : 4.375rem;
    height: 4.375rem;
    background: url("../images/2025/02/scr_top_arrow.svg") no-repeat center / cover;
    border-radius: 50%;
}
.floating_scr_top a{
    display : block;
    width : 100%;
    height: 100%;
}
.floating_scr_top p{
    position: absolute;
    top: -4.25rem;
    right : 2.188rem;
    width : max-content;
    padding: 0.625rem 1rem;
    border-radius: 0.625rem 0.625rem 0 0.625rem;
    background-color : #F0F0F0;
    font-size: 0.75rem;
    font-weight: 400;
    text-align: center;
}
@media all and (max-width: 768px){
    .floating_scr_top{
        bottom: 140px;
        right: 10px;
        width : 44px;
        height: 44px;
    }
    .floating_scr_top p{
        top: -48px;
        right: 22px;
        font-size:10px;
        padding: 7px 12px;
        border-radius: 10px 10px 0 10px;
    }
}
.floating_btn{
    display : flex;
    flex-direction: column;
    gap: 20px;
    position: fixed;
    right : 20px;
    bottom: 34px;
    z-index : 100;
}
.floating_btn a{
    display : flex;
    justify-content: center;
    align-items: center;
    width : 70px;
    height : 70px;
    border-radius: 50%;
    background-color: #EF4023;
    border: none;
    filter: drop-shadow(0px 8px 16px rgba(0, 0, 0, 0.25));
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 120%;
    color: #fff !important;
    cursor: pointer;
}
.floating_btn a.m_show{
    display : none !important;
}
.floating_btn a.m_hide{
    display : flex !important;
}
.floating_btn a.black{
    background-color: #231F20;
}
@media all and (max-width: 768px){
    .floating_btn a.m_hide{display : none !important;}
    .floating_btn a.m_show{display : flex !important;}
}
.floating_btn .msg_wrap{position: relative}
.floating_btn .msg_wrap label{
    position:absolute;
    right: calc(100% + 20px);
    top: 20%;
    z-index : 10;
    font-size:14px;
    color: #0a0a0a;
    font-weight: 500;
}
.floating_btn .msg_wrap input:checked ~ label,
.floating_btn .msg_wrap input:checked ~ span{display : none;}
.floating_btn .msg_wrap span{
    display: flex;
    align-items: center;
    position: absolute;
    top:50%;
    right:calc(100% + 10px);
    transform: translateY(-50%);
    width: 200px;
    height: 48px;
    border: 1px solid #E6E6E6;
    border-radius:10px;
    background-color: #fff;
    text-align: left;
    color: #0a0a0a;
    font-size: 12px;
    font-weight: 400;
    padding: 0 16px;
}
.floating_btn.st2.t2::before{
    content: "대동 제품에 관심이 있으신가요? \00000a 구매 상담을 받아보세요!";
}
.floating_btn.st2{
    right : 20px;
    bottom: 34px;
}
.floating_btn.st2 a{
    width : 60px;
    height: 60px;
    /* background: #231F20 url("../img/icon-float.svg") no-repeat center / 20px 20px; */
    background-color: #EF4023;
    /* box-shadow: 0px 6px 10px #00000040; */
    font-size: 14px;
}
.floating_btn.st2 a.black{
    background-color: #231F20;
}
.floating_btn.st2 .msg_wrap span{
    width : 220px;
}
/* 플로팅 버튼 END */


.aitothefield_txt_img {
    display: block;
    width: 21.25rem;
    aspect-ratio: 340 / 38;
    mask: url("../img/future-agriculture/aitothefield_txt.svg") center center / cover no-repeat;
    background: rgb(239, 64, 35);
}
.prd_benefit_wrap{
    background-color: #222;
    padding: 3.75rem 0;
}
.prd_benefit_wrap .inner{
    width: calc(100% - 40px);
    max-width: 1216px;
    margin: 0 auto;
    color: #fff;
}
.prd_benefit_wrap .tit{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:1.25rem;
}
.prd_benefit_wrap .tit .benefit_txt{
    padding: 4px 1rem;
    border-radius: 5rem;
    background-color:#EF4023;
    font-size:1.125rem;
    font-weight: 600;
    line-height: 160%;
    width: max-content;
}
.prd_benefit_wrap .tit h2{
    font-size: 2.25rem;
    font-weight:600;
    line-height: 120%;
}
.prd_benefit_wrap img{
    margin:2.5rem 0;
}
.prd_benefit_wrap a{
    display:block;
    width: max-content;
    margin: 0 auto;
    padding: 0.625rem 4.625rem;
    font-size:1.5rem;
    font-weight: 600;
    border-radius:5rem;
    background-color:#EF4023;
    cursor:pointer;
}
@media all and (max-width: 1024px){
    .floating_btn .msg_wrap label,
    .floating_btn .msg_wrap span{
        display : none;
    }
}
@media all and (max-width: 768px){
    .floating_btn a{
        width : 70px;
        height: 70px;
        font-size: 14px;
    }
    .float-btn{bottom:145px;}
    .floating_btn.st2{
    }
    
    .m_hide{
        display : none !important;
    }
    
    .aitothefield_txt_img { display: block; width: 134px; }
    
    .prd_benefit_wrap{
        padding: 40px 0;
    }
    .prd_benefit_wrap .tit{
        flex-direction: column;
        gap: 10px;
    }
    .prd_benefit_wrap .tit .benefit_txt{
        padding: 2px 16px;
        font-size:14px;
    }
    .prd_benefit_wrap .tit h2{
        font-size: 20px;
        text-align: center;
    }
    .prd_benefit_wrap .tit h2{
        font-size: 20px;
        text-align: center;
    }
    .prd_benefit_wrap img{
        margin: 30px auto;
        max-width: 340px;
        width: 100%;
    }
    .prd_benefit_wrap a{
        padding: 12px 36px;
        font-size: 16px;
        font-weight: 600;
    }
}


