@charset "utf-8";
.desc p:not(:last-child) {margin-bottom: 1.88em;}
.pb100-40 {padding-bottom: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.pt100-40 {padding-top: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.border-box {position: relative;}
.border-box:before {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}
.dot-list li {position: relative; padding-left: 20px;}
.dot-list li:before {position: absolute; content: '·'; left: 0;}
.dot-list li:not(:last-child) {margin-bottom: 2px;}

.greetings {gap:clamp(20px, calc( 55 / var(--inner) * 100vw ), 55px);}
.greetings .img {width: 47.5%; height: fit-content; border-radius: clamp(20px, calc( 100 / var(--inner) * 100vw ), 100px) 0; overflow: hidden;}
.greetings h2 {margin-bottom: 20px;}
.greetings .desc {font-size: clamp(15px, calc( 17 / var(--inner) * 100vw ), 17px);}
.greetings .sign {display: flex; justify-content: flex-end; gap: 20px; margin-top: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px);}
.greetings .sign strong {font-weight: 600; font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px);}

.layout-wrap {display: flex; gap:clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}
.layout-wrap .img {width: 49.16667%; height: fit-content; border-radius: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); overflow: hidden;}
.layout-wrap .txt {border-top: 2px solid var(--primary-color);}
.layout-item {display: flex; padding: clamp(8px, calc( 22 / var(--inner) * 100vw ), 22px) clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); border-bottom: 1px solid #ddd;}
.layout-tit {position: relative; min-width: 150px; height: fit-content; padding-left: 22px; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; color: var(--dark-color);}
.layout-tit:before {position: absolute; content: ''; top: 50%; left: 0; margin-top: -6px; width: 12px; height: 12px; border-radius: 100%; border: 3px solid var(--primary-color);}

.history-photo {position: relative; margin-bottom: clamp(30px, calc( 75 / var(--inner) * 100vw ), 75px);}
.history-photo .txt {position: absolute; top: 50%; left: clamp(15px, calc( 70 / var(--inner) * 100vw ), 70px); transform: translateY(-50%); padding: clamp(12px, calc( 25 / var(--inner) * 100vw ), 25px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); border-radius: clamp(12px, calc( 40 / var(--inner) * 100vw ), 40px) 0; background: var(--primary-color); color: #fff;}
.history-photo .txt p {padding-left: 40px;}
.history-items {position: relative; padding-left: clamp(0px, calc( 70 / var(--inner) * 100vw ), 70px);}
.history-items:before {position: absolute; content: ''; top: 10px; bottom: 0; left: calc(clamp(0px, calc( 70 / var(--inner) * 100vw ), 70px) + clamp(45px, calc( 64 / var(--inner) * 100vw ), 64px) + var(--history-indent)); width: 1px; background: #060709; opacity: .1;}
.history-item {display: flex;}
.history-year {position: relative; min-width: clamp(45px, calc( 64 / var(--inner) * 100vw ), 64px);height: fit-content; margin-right: var(--history-indent); font-size: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 700; color: var(--dark-color); font-family: "Roboto", sans-serif;}
.history-year:before {position: absolute; content: ''; top: 50%; right: calc(var(--history-indent) * -1); transform: translate(50%, -50%); width: 13px; height: 13px; border: 4px solid var(--primary-color); background: #fff; border-radius: 100%;}
.history-cnt {position: relative; flex: 1; padding-left: var(--history-indent); padding-bottom: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-size: clamp(15px, calc( 17 / var(--inner) * 100vw ), 17px); line-height: 1.76em;}
.history-cnt li {display: flex;}
.history-cnt li:not(:last-child) {margin-bottom: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);}

.cert-list ul {display: flex; flex-wrap: wrap; margin: calc(clamp(12px, calc( 17 / var(--inner) * 100vw ), 17px) * -1) calc(clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px) * -1); text-align: center;}
.cert-list li {width: 25%; padding: clamp(12px, calc( 17 / var(--inner) * 100vw ), 17px) clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px);}
.cert-list .thumb {border: 1px solid #ddd; margin-bottom: clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px);}

.tab-menu ul {display: flex; justify-content: center; gap: 10px; margin-bottom: clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px);}
.tab-menu a {display: flex; justify-content: center; align-items:center; width: 200px; height: 54px; border-radius: 27px; border: 1px solid #ddd; letter-spacing: 0; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 500;}
.tab-menu .active a {background: var(--primary-color); color: #fff;}
.directions {display: flex; gap: 10px; margin-top: 13px;}
.direction-box {flex: 1; padding: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px) 15px clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); background: #f8f8f8; text-align: center;}
.direction-box:first-child {flex: 2;}
.directions .icon {margin-bottom: clamp(10px, calc( 22 / var(--inner) * 100vw ), 22px);}
.root_daum_roughmap .wrap_map, .root_daum_roughmap {width: 100% !important;}
.facility-gallery {flex-wrap: wrap; gap: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px); text-align: center;}
.facility-gallery .full-img {width: 100%;}
.facility-photo {width: calc((100% - clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px)) / 2);;flex: 1 1 auto;}
.facility-photo .tit {margin-top: clamp(12px, calc( 15 / var(--inner) * 100vw ), 15px);}
.non-ferrous-boxes {gap:clamp(10px, calc( 21 / var(--inner) * 100vw ), 21px); margin-top: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px);}
.non-ferrous-box {flex:1; padding: clamp(20px, calc( 37 / var(--inner) * 100vw ), 37px) 15px; background: #f8f8f8;}

.waste-gallery ul {display: flex; flex-wrap: wrap; justify-content: center; margin: calc(clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px) * -1);}
.waste-gallery li {width: 33.3335%; padding:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px);}
.waste-gallery .tit {background: #454545; color: #fff; text-align: center; padding: 11px 15px;}

.business-txt {padding: clamp(20px, calc( 43 / var(--inner) * 100vw ), 43px) clamp(15px, calc( 37 / var(--inner) * 100vw ), 37px); border: 1px solid #ddd;}
.business-txt h2 {position: relative; padding-left: 30px;}
.business-txt h2:before {position: absolute; content: '';left: 0; top: 50%; margin-top: -10px; width: 21px; height: 21px; background: url('/images/sub/tit-deco.png') no-repeat center center; background-size: contain;}
