@charset "utf-8";
/* 회사개요 */
.ot { display: flex; }
.ot-left { width: 50%; overflow: hidden;}
.ot-left img { border-radius: 24px; }
.ot-right { width: 50%; padding-left: 60px;}
.ot-right ul { border-top: 2px solid #242424;}
.ot-right ul li { display: flex; border-bottom: 1px solid #ddd; padding: 22px 0;}
.ot-right ul li .tit { width: 130px; text-align: center; font-size: var(--font-size-18); letter-spacing: -.03em; line-height: 1.3em; font-weight: 500; color: #242424; position: relative;}
.ot-right ul li .tit::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; width: 1px; height: 12px; background: #ddd;}
.ot-right ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 20px; line-height: 1.3em; font-weight: 300; letter-spacing: -.03em; color: #454545; }

/* CEO인사말 */
.gt { position: relative;}
.gt h2 { line-height: 1.5em; font-size: 34px; letter-spacing: -.03em; font-weight: 700; color: #242424;  margin-top: 55px; margin-bottom: 40px; }
.gt h2 span { color: #1b216c;}
.gt p { line-height: 1.666em; font-size: var(--font-size-18); font-weight: 300; letter-spacing: -.03em; color: #454545; margin-bottom: 35px;}
.gt .sign { display: flex; align-items: center; gap: 25px; line-height: 1.666em; font-size: var(--font-size-18); font-weight: 300; letter-spacing: -.03em; color: #454545; }
.gt-sb { position: absolute; right: 0; bottom: 0; z-index: -1;}

/* 비전 및 경영이념 */
.vs-box { width: 770px; border: 1px solid #ddd; margin: 0 auto 70px; border-radius: 55px; text-align: center; padding: 30px 5px 25px; color: #1b216c;}
.vs-box h4 { font-weight: 700; letter-spacing: -.03em; line-height: 1em; }
.vs-box h3 { font-size: var(--font-size-24); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; margin-top: 15px;}
.vs p { text-align: center; font-size: var(--font-size-24); font-weight: 500; letter-spacing: -.03em; line-height: 1.3em; color: #454545; margin-bottom: 55px;}
.vs p span { color: #dd0b16; font-weight: 700; position: relative;}
.vs p span::before { content: ""; position: absolute; top: -11px; left: 0; right: 0; margin: auto; width: 6px; height: 6px; border-radius: 100%; background: #dd0b16;}
.vs-img { text-align: center;}

/* 회사연혁 */
.hst-sec1 { padding-bottom: 100px;}
.hst-list { display: flex; gap: 10px; margin-bottom: 60px;}
.hst-list li { width: calc(100%/3);}
.hst-list li img { width: 100%; }
.hst-box { display: flex;}
.hst-left {width: 50%;}
.hst-left h4 { font-size: 18px; font-weight: 600; line-height: 1.2em; margin-bottom: 18px; color: #dd0b16;}
.hst-left h3 { line-height: 1.5em; letter-spacing: -.03em; font-weight: 700; font-size: 30px; color: #242424;}
.hst-right {width: 50%;}
.history { position: relative; }
.history-box{ position: relative; }
.history-box::after { content: ""; position: absolute; left: 85px; top: 0; height: 98%; width: 1px; background: #ddd; z-index: -1; bottom: 0; margin: auto;}
.history .group { position: relative; margin-bottom: 40px; display: flex; gap: 0 60px; width: 100%;}
.history .group:last-child { margin-bottom: 0;}
.history .group .group-ttl {font-size:24px; line-height:1em; color: #1b216c; font-weight: 700; position: relative; letter-spacing: -.03em; width: 63px;}
.history .group .group-ttl::after { content:''; position:absolute; width:15px; height:15px; border-radius: 100%; top: 4px; z-index: 1; right: -30px; background: #fff; border: 3px solid #dd0b16;}
.history .group .groupbox { position: relative; padding-top: 2px;}
.history .group ul {position: relative; }
.history .group ul li {position: relative; display: flex; margin-bottom: 10px;}
.history .group ul li:last-child {margin-bottom: 0;}
.history .group ul li .month { color: #242424; font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; width: 35px;}
.history .group ul li .txt { color: #454545; font-weight: 300; letter-spacing: -.03em; line-height: 1.2em;  flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 10px;}
.history .group ul li:last-child { margin-bottom: 0;}
.history .group2 ul li .txt { padding-left: 0;}
.hst-sec2 { padding: 100px 0; background: #f8f8f8; text-align: center;}
.hst-sec2 h2 { font-size: 35px; font-weight: 600; line-height: 1em; color: #242424; position: relative; letter-spacing: -.03em; margin-bottom: 60px;}
.hst-sec2 h2::after { content: ""; display: block; width: 50px; height: 3px; margin: 18px auto 0; background: url(../images/sub/tit-af.jpg) center no-repeat; background-size: contain;} 
.certi-list { display: flex; flex-wrap: wrap; gap: 60px 20px;}
.certi-list li { width: calc(100%/5 - 16px); text-align: center; }
.certi-list li .thumb {position:relative; padding-bottom:140%; margin-bottom:26px; overflow:hidden;}
.certi-list li .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.certi-list li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.certi-list li .txt { font-weight: 400; letter-spacing: -.03em; line-height: 1.5em; color: #454545;}

/* 찾아오시는 길 */
.lct { display: flex; align-items: center; padding-bottom: 90px; border-bottom: 1px dashed #ddd;}
.lct.bd { padding-bottom: 0; padding-top: 90px; border: none;}
.lct-left { width: 50%; border-radius: 30px; overflow: hidden;}
.lct-right { padding-left: 80px;}
.lct-right h2 { line-height: 1em; font-size: 26px; font-weight: 500; letter-spacing: -.03em; color: #242424;}
.lct-list { margin: 40px 0 50px;}
.lct-list li { display: flex; margin-bottom: 30px;}
.lct-list li:last-child { margin-bottom: 0; }
.lct-list li .tit { width: 85px; display: flex; align-items: center; position: relative; font-size: var(--font-size-18); font-weight: 500; line-height: 1em; letter-spacing: -.03em; color: #242424; gap: 10px;}
.lct-list li .tit::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; width: 1px; background: #ddd; height: 12px;}
.lct-list li .txt { font-weight: 400; letter-spacing: -.03em; color: #454545; line-height: 1.3em; flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 15px;}
.lct-right a { display: flex; align-items: center; justify-content: center; width: 150px; height: 50px; background: #dd0b16; color: #fff; font-weight: 400; letter-spacing: -.03em; line-height: 1em;}
.lct-right a span { display: inline-block; padding-left: 25px;}

/* sub2 공통 */
.sub2-txt { text-align: center; font-size: var(--font-size-18); color: #454545; letter-spacing: -.03em; font-weight: 400; line-height: 1.5em; border: 1px solid #babcd3; border-radius: 16px; padding: 35px 5px; margin-bottom: 60px;}
.sub2-tab { display: flex; border: 1px solid #ddd; margin-bottom: 60px;}
.sub2-tab li { flex: 1; border-right: 1px solid #ddd;}
.sub2-tab li:last-child { border-right: none;}
.sub2-tab li a { display: flex; align-items: center; justify-content: center; height: 60px; text-align: center; line-height: 1em; font-size: var(--font-size-18); font-weight: 600; letter-spacing: -.03em; color: #454545; position: relative;}
.sub2-tab li.active a { color: #dd0b16;}
.sub2-tab li.active a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #dd0b16;}
.sub2-big { margin-bottom: 60px;}
.sub2-fx { display: flex; justify-content: flex-start; margin-bottom: 60px;}
.sub2-fx.mg { margin-bottom: 0;}
.sub2-left { width: 45%; padding-right: 60px;}
.sub2-right { width: 55%;}
.sub2-tbl { width: 100%; border-collapse: collapse; border-top: 2px solid #242424;}
.sub2-tbl tr { border-bottom: 1px solid #ddd;}
.sub2-tbl tr th { text-align: center; border-right: 1px solid #ddd; font-size: var(--font-size-18); font-weight: 500; letter-spacing: -.03em; line-height: 1em; color: #242424; padding: 24px 5px; background: #f8f8f8;}
.sub2-tbl tr td { text-align: left; font-weight: 300; letter-spacing: -.03em; line-height: 1.4em; padding-left: 18px; color: #454545;}
.sub2-tbl tr td.fw { font-size: 18px; font-weight: 600; color: #1b216c;}
.sub2-link { margin-top: 100px; display: flex; justify-content: center ; gap: 20px;}
.sub2-link a { display: inline-block; color: #fff; padding: 21px 25px; text-align: center; font-size: 17px; font-weight: 500; letter-spacing: -.03em; line-height: 1.3em; }
.sub2-link a span { display: inline-block; padding-left: 20px;}
.sub2-link a.clr1 { background: #1b216c;}
.sub2-link a.clr3 { background: #1b216c; padding: 21px 50px;}
.sub2-link a.clr2 { background: #dd0b16; padding: 21px 50px;}

/* 산업기자재공급 */
.is-list { display: flex; flex-wrap: wrap; gap: 65px 30px;}
.is-list li { width: calc(100%/2 - 15px); text-align: center; }
.is-list li .tit { font-size: var(--font-size-18); font-weight: 600; letter-spacing: -.03em; line-height: 1.5em; color: #242424; margin-top: 20px;}
.is-list li .txt { font-weight: 300; letter-spacing: -.03em; line-height: 1.556em; color: #686868;margin-top: 5px;}

/* 자료실 */
.rf-box { margin-bottom: 100px;}
.rf-list { display: flex; gap: 30px; flex-wrap: wrap;}
.rf-list li { width: calc(100%/2 - 15px); border-top: 2px solid #1b216c; border-bottom: 1px solid #ddd; transition: .2s;}
.rf-list li a { display: block; padding: 45px 50px; position: relative; }
.rf-list li .tit { color: #242424; font-size: 28px; letter-spacing: -.03em; line-height: 1em; font-weight: 700; margin-bottom: 20px;}
.rf-list li .txt { line-height: 1.6em; font-size: 17px; font-weight: 300; letter-spacing: -.03em; color: #686868; }
.rf-list li .view { width: 30px; height: 30px; border-radius: 100%; border: 1px solid #ddd; margin-top: 30px; transition: .2s; color: #686868; font-size: 30px; text-align: center; line-height: 1em; display: flex; align-items: center; justify-content: center;}
.rf-list li .iconbox { width: 80px; height: 80px; position: absolute; right: 50px; bottom: 45px; background-repeat: no-repeat; background-position: center; background-size: contain; transition: .2s;}
.rf-list li:first-child .iconbox { background-image: url(../images/main/sec3-icon1-c.png);}
.rf-list li:last-child .iconbox { background-image: url(../images/main/sec3-icon2-c.png);}