@charset "utf-8";
/* 회사소개 */
.about { position: relative; width: 100%; background: #fafafa; padding-bottom: 120px;} 
.about-bg { width: 100%; background: url(../images/sub/sub1_1.jpg) 50% 50% no-repeat; background-size: cover; height: 420px;}
.about>img { width: 100%; object-fit: cover; display: block;}  
.about>h3 { font-size: 30px; line-height: 1.25em; text-align: center; margin-top: 100px; font-weight: 400;color: #333; letter-spacing: -1px;}
.about>h3>span { font-weight: 600;}
.ab-clr1 { color: #2b456a;}
.ab-clr2 { color: #21709f;}
.about-list { display: flex; justify-content: space-between; max-width: 1200px; margin: 60px auto 0; flex-wrap:wrap; width: 100%;}
.about-list>li { text-align: center; width: calc(100%/4 - 50px); padding: 0 25px;}
.about-list>li:first-child { padding-left: 0;}
.about-list>li:last-child { padding-right: 0;}
.about-img { width: 200px; height: 200px; border-radius: 100%; background-color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; box-shadow: 0px 0px 24px rgba(0,0,0,0.09); margin: auto;}
.about-list>li>p { font-size: 18px; font-weight: 300; color: #555; margin-top: 15px;}
.about-list>li>h4 { font-size: 22px; font-weight: 500; color: #333; margin-top: 15px; line-height: 1.6em;}

/* 제품소개(공통) */
.pd-tab { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; width: 100%; margin: auto; gap: 12px; margin-top: -20px; color: #333; margin-bottom: 50px; text-align: center;}
.pd-tab>li { width: calc(100%/5 - 10px); font-size: 18px; font-weight: 300; cursor: pointer; border-radius: 30px; border: 1px solid #ddd; display: table; }
.pd-tab>li a {display: table-cell; padding: 15px 15px; border-radius: 30px; box-sizing: border-box; height: 100%; vertical-align: middle; line-height: 1.56em; word-break: break-all;}
.tab-on { color: #fff; background: #21709f; box-sizing: border-box; border: 1px solid #21709f;}

.pd-kind { background: #f8f8f8; border: 1px solid #ddd; display: flex; align-items: center; padding: 25px 10px; margin-bottom: 60px;  color: #555; flex-wrap: wrap; }
.pd-kind li {padding: 0 20px;}
.pd-kind li a{ font-size: 18px; font-weight: 300; line-height: 1.6em; display: block; position: relative; padding-left: 10px;}
.pd-kind li a::before {  content: ""; position: absolute; left: 0; top: 12px; margin: auto; width: 4px; height: 4px; border-radius: 4px; background: #21709f;}
.kind-on { color: #21709f;}
.pd-kind li a:hover { text-decoration: underline;}

.img-tc { text-align: center;}

.sub4-img { overflow: auto;}
.sub4-wrap { overflow: auto; width: 1024px;}
.sub4-wrap img { width: 100%; }
