 @charset "utf-8"; /* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:420px !important;} 
.root_daum_roughmap .wrap_map {height:420px !important;} 
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;} 
.roughmap_lebel_text:after {content:"경기도 화성시 정남면 만년로 765-7"; font-size:12px; line-height:15px;} 

.doc-tit {margin: var(--margin-160-60) 0 var(--margin-40-20 ); text-align:center;} 
.doc-tit h2 {font-family: 'GmarketSans'; font-weight: 700; font-size: var(--font-size-30-20); color: #000; line-height: 1.2em; letter-spacing: 0; margin-bottom:10px;} 
.doc-tit .en {font-family: 'GmarketSans'; font-weight:500; font-size: var(--font-size-12-10); letter-spacing: 1em; color: #555; line-height:2.333em;} 
.doc-tit .t2 {margin-top: 5px; margin-bottom: var(--margin-15-10);} 

.doc-cnt {margin-bottom:var(--margin-80-40);} 
.doc-cnt:last-child {margin-bottom:0;} 
.doc-cnt.bg-grey {background-color: #f4f4f4;} 

.doc-sub-cnt {padding:var(--padding-80-40) 0;} 
.doc-sub-cnt:last-child {padding-bottom:0;} 

.doc-sub-tit {margin-bottom:var(--margin-90-30); text-align:center;} 
.doc-sub-tit h2 {margin-bottom:var(--margin-30-16); font-weight:800; font-size: var(--font-size-24-20); letter-spacing: -0.025em; color: #333333; font-weight:800; line-height: 1.5em;} 
.doc-sub-tit p {} 
.doc-sub-tit .en {display:block; margin-bottom:var(--margin-20-10); font-size: var(--font-size-12-10); letter-spacing: 1em; color: #555;} 

.mt120 {margin-top:var(--margin-120-40);} 
 
.mb150 {margin-bottom:var(--margin-150-70);} 
.mb20 {margin-bottom:var(--margin-20-10);} 
.mb80 {margin-bottom:var(--margin-80-40);} 
.mb0 {margin-bottom:0 !important;} 
.mb60 {margin-bottom:var(--margin-60-30) !important;} 

.pt0 {padding-top:0 !important;} 
.pb0 {padding-bottom:0 !important;} 
.pb100 {padding-bottom:var(--padding-100-60) !important;} 

.txt-grey {color: #888888 !important;} 
.txt-orange {color: var(--color-primary) !important;} 
.txt-navy {color: #002a5d !important;} 

.bg-grey {background-color: #f9f9f9;} 

.flex-wrap {display:flex;} 

.sub-head {width:100%; background-position: center; background-repeat: no-repeat; background-size: cover; border-top-left-radius: var( --border-radius-40-20); border-bottom-right-radius: var(--border-radius-40-20);} 
.history .sub-head {height:250px; padding:var(--padding-30-16) var(--padding-110-20); background-image: url(/images/sub/bg-history.jpg);} 
.org .sub-head {display:flex; justify-content: center; align-items: center; flex-direction: column; height:400px; background-image: url(/images/sub/bg-org.jpg); text-align:center; padding:var(--padding-90-20) 0;} 
.sub-head p {color: #fff;} 
.sub-head .t1 {margin-bottom:10px; font-weight:600; font-size: var(--font-size-24-20); line-height:1.5em; letter-spacing: -0.025em;} 
.sub-head .t2 {letter-spacing: -0.025em;} 
.sub-head .en {font-weight:600; font-size: var(--font-size-12-10); letter-spacing: 1.5em;} 
 
/* greeting */
 .greeting {position:relative; padding-bottom:var(--padding-160-60);} 
 .greeting .group-txt {padding:var(--padding-120-20) var(--padding-100-16) var(--padding-80-16); border-radius: var(--border-radius-30-16); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);} 
 .greeting .txt-area p {font-size: var(--font-size-17-15); line-height: 1.647em; margin-bottom:var(--margin-30-10);} 
 .greeting .txt-area p:last-child {margin-bottom:0 !important;} 
 .greeting .txt-area p strong {color: #000; font-weight: 800;} 
 .greeting .txt-area p.t2 {font-size: var(--font-size-26-18); line-height:1.076em;} 
 .greeting .txt-area .name {display:flex; align-items: center;} 
 .greeting .txt-area .name .logo {display:inline-block; height:16px; margin-right:var(--margin-30-10);} 
 .greeting .txt-area .name strong {font-size: var(--font-size-20-18); line-height:1.4em;} 
 .greeting > .img {position: absolute; right:100px; bottom:0;} 

 /* 연혁 */
 .history-wrap ol {display:flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;} 
 .history-wrap ol li .year {position:relative; width:150px; height:150px; display:flex; justify-content: center; align-items: center; background-color: var(--color-primary); color: #000; font-weight:800; font-size: var(--font-size-36-26); line-height:1em; letter-spacing: -0.025em; border-radius: 100%; margin: 50px auto;} 
 .history-wrap ol li .year::before {content: ""; position: absolute; top: -50px; left:50%; transform: translateX(-50%); width:2px; height:250px; background-color: #ddd; z-index:-1;} 
 .history-wrap ol li .desc-list {background-color: #fff; padding: var(--padding-20-10) 0;} 
 .history-wrap ol li .desc-list li {line-height:2.117em;} 

 /* 조직구성 */
 .org .sub-head .t1,
 .org .sub-head .en {margin-bottom:var(--margin-20-10);} 

 /* value */
.img-list {display: flex; justify-content: center; margin:0 -20px;} 
.img-list > li {text-align: center; width:25%; padding:0 20px;} 
.img-list > li .img {border-radius: 100%;} 
.img-list > li > h3 {line-height:3em; font-weight:800; font-size: var(--font-size-20-18); color: var(--color-primary);} 
.img-list.type2 {margin:0 -45px;} 
.img-list.type2 > li {width:auto; padding:0 45px;} 
.img-list.type2 > li > h3 {font-weight:800; color: #333333; line-height:1em; margin:var(--margin-30-10) 0 var(--margin-20-10);} 
.img-list.type3 {margin:0 -35px;} 
.img-list.type3 > li {width:auto; padding:0 35px;} 
.img-list.type3 > li > h3 {font-weight:800; font-size: var(--font-size-24-20); color: #333; line-height:1em; margin:var(--margin-30-10) 0 var(--margin-20-10);} 

/* 사업영역 */
.biz-area {display:flex; justify-content: center; align-items: center; padding:var(--padding-60-16) 0;} 
.biz-area .txt-wrap {padding-left:var(--padding-50-20); padding-right:var(--padding-20-10);} 
.biz-area .txt-wrap li {padding:var(--padding-40-20) 0;} 
.biz-area .tit {margin-bottom:5px; font-weight:800; font-size: var(--font-size-20-18); line-height: 1.4em; color: var(--color-primary); letter-spacing: -0.025em;} 
.biz-area .desc {line-height:1.529em; letter-spacing: -0.025em;} 

/* 제품 */
.menu-wrap {position:relative;} 
.menu {margin:0 auto; max-width:1400px;} 
.menu ul {display:flex; flex-wrap: wrap; border-left: 1px solid #ddd; border-top: 1px solid #ddd;} 
.menu ul li {width: 16.6666%; text-align:center; border: 1px solid #ddd; border-top: 0; border-left: 0;} 
.menu ul li a {display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:var(--height-60-40); padding:0 var(--padding-15-10); font-size:var(--font-size-16-14); line-height:1.875em;} 
.menu ul li.active {background:var(--color-primary); border:0;} 
.menu ul li.active a {color:#fff;} 

.product-head h2 {margin-bottom:var(--margin-30-10); text-align:center; font-weight:800; font-size: var(--font-size-36-26); line-height:1em; color: #000;} 

.img-wrap {padding:var( --padding-45-15) var(--padding-80-20) 0; border-top:2px solid #777;} 
.img-wrap ul {display:flex; flex-wrap:wrap; margin:0 -25px;} 
.img-wrap ul li {width:50%; padding:0 25px; margin-bottom:var(--margin-50-20); text-align:center;} 
.img-wrap ul li .img {position:relative; padding:var(--padding-40-10);}
.img-wrap ul li .img:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08);}
.img-wrap ul li.none {width:100%; padding:70px 0; margin:0; text-align:center; color:#767676;} 
.img-wrap ul li .thumb {position:relative; padding-bottom:80%; overflow:hidden;} 
.img-wrap ul 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:cover;} 
/*  .img-wrap ul li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08);}  */

.table-wrap {margin-bottom:var(--margin-25-15);} 
.table-wrap:last-child {margin-bottom:0;} 
.table-wrap .tit {margin-bottom:5px; font-weight:600; font-size: var(--font-size-18-16); letter-spacing: -0.025em; color: #242424; line-height:2em;} 

.table-style table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:1px solid #1f1f1f; line-height:1.5em;} 
.table-style table th {padding:13px; border:1px solid #ddd; border-top:0; font-weight:600; background:#fafafa;} 
.table-style table td {padding:13px; text-align:center; border:1px solid #ddd; border-top:0; color: #454545; font-size: var(--font-size-16-14);} 
.table-style tr th:first-child,
.table-style tr td:first-child {border-left:0;} 
.table-style tr th:last-child,
.table-style tr td:last-child {border-right:0;} 
.table-style span {display:inline-block;} 
.table-style .normal {font-weight:400;} 

.img.box-shadow img {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25); border-radius: var(--border-radius-30-16);} 

 /* 영상 운영 */
.operation-list ol {display:flex; flex-wrap: wrap; margin:-20px;} 
.operation-list ol li {width:calc(50% - 40px); margin:20px; border: 1px solid #ddd; padding:var(--padding-30-16) var(--padding-40-20);} 
.operation-list ol li .tit-wrap {display:flex; margin-bottom:var(--margin-15-10); font-weight:800; font-size: var(--font-size-24-20); line-height:1.166em; color: #333; letter-spacing: -0.03em;} 
.operation-list .num {display:inline-block; color: var(--color-primary); margin-right:var(--margin-15-10);} 
.operation-list .ico {width: 100px;} 
.operation-list .desc {flex: 1 1 auto; width:1%; min-width:0; font-size: var(--font-size-17-15); line-height:1.647em;} 

/* One Step Solution */
.solution-list {margin-top:var(--margin-120-40);} 
.solution-list ul {display:flex; justify-content: center; align-items: center; margin:0 -50px;} 
.solution-list ul li {margin:0 50px;}
.solution-list ul li .one {position:relative; display:flex; flex-direction: column; justify-content: center; align-items: center; width:320px; height:320px; border-radius: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; color: #fff;} 
.solution-list ul li .one::before {content: ""; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:360px; height:360px; border: 1px solid var(--color-primary); border-radius: 100%; border-radius: 100%;} 
.solution-list ul li:nth-child(1) .one {background-image: url(/images/sub/solution-01.jpg);} 
.solution-list ul li:nth-child(2) .one {background-image: url(/images/sub/solution-02.jpg);} 
.solution-list ul li:nth-child(3) .one {background-image: url(/images/sub/solution-03.jpg);} 
.solution-list .en {font-weight:500; font-size: var(--font-size-15-13); line-height:1.866em;} 
.solution-list .tit {font-weight:800; font-size: var(--font-size-24-20); line-height:1.166em;} 

/* .performance-wrap */
.performance-wrap {border-top:1px solid #ddd;} 
.performance-wrap .row {display: flex; border-bottom: 1px solid #ddd;} 
.performance-wrap .row .year {position: relative; width: 20%; padding-left:var(--padding-70-20); font-family: 'GmarketSans'; font-size: var(--font-size-40-20); font-weight: 700; color: #e57e38; line-height:1em; margin-top: 40px;} 
.performance-wrap .row .year::after {content: ''; width: 17px; height: 17px; border-radius: 50%; background-color: #eb6204; border: 4px solid #fff; position: absolute; top: 7px; z-index: 10; right: -9px;} 
.performance-wrap .row .year.bin {padding-right: 57px;} 
.performance-wrap .row .info {position: relative; padding:var(--padding-40-20) var(--padding-55-25); border-left: 1px solid #ddd;} 
.performance-wrap .row .info .wrap {display: flex;} 

.dash-list > li {position:relative; padding-left:13px; line-height:2.117em; letter-spacing: 0;} 
.dash-list > li:before {content:"-"; position:absolute; top:-2px; left:0;} 
.dash-list > li strong {font-weight:600;} 

/* Client */
.client-list ul {display:flex; flex-wrap: wrap; margin:-12px;} 
.client-list ul li { position:relative; width:calc(20% - 24px); margin:12px;} 
.client-list ul li::after {content: ""; position: absolute; top:0;left:0;right:0;bottom:0;width:100%; height:100%; border: 1px solid #ddd; }