@charset "utf-8";

/* 공통 */
.c-white {color:#fff !important;}
.c-main {color:var(--c-main) !important;}
.c-2 {color:var(--c-2) !important;}
.c-dark {color:var(--c-dark) !important;}

.fz18 {font-size:var(--font18-15);}

.font-mont {font-family:var(--font-mont) !important;}
.font-outfit {font-family:var(--font-outfit) !important;}
.font-play {font-family:var(--font-play) !important;}

.doc-tit {position:relative; margin-bottom:1.67em; padding-left:0.67em; font-size:var(--font36-20); font-weight:700; line-height:1.2; letter-spacing:-0.03em; color:#242424;}
.doc-tit:before {content:''; position:absolute; width:var(--size5-2); height:1em; left:0; top:0.08em; background: linear-gradient(to bottom, #17469e 35%, #242424 65%);}

.doc-cnt {margin-bottom:var(--size140-40);}
.doc-cnt:last-child {margin-bottom:0;}

.sub-cont {padding:var(--size80-40) 0;}
.bg-gray {position:relative;}
.bg-gray:before {content:''; position:absolute; width:100vw; height:100%; top:0; left:50%; transform:translateX(-50%); z-index:-1; background:#f8f8f8;}

.page-menu {margin-bottom:var(--size50-20);}
.page-menu ul {display:flex;}
.page-menu ul li {position:relative; margin-left:-1px; width:auto; flex:1; border:1px solid #ddd;}
.page-menu ul li:first-child {margin-left:0;}
.page-menu ul li a {display:flex; align-items:center; justify-content:center; height:var(--size60-40); font-size:var(--font18-14); font-weight:500; line-height:1; letter-spacing:-0.03em; color:#454545;}
.page-menu ul li.active a  {color:#fff;}
.page-menu ul li.active {background:var(--c-main); border-color:var(--c-main);}

/* 인사말 */
.greeting {display:flex;}
.greeting .txt-wrap {flex:1 1 auto; min-width:0; width:1%; padding-right:var(--size20-0);}
.greeting .txt-wrap .tit {margin-bottom:1em; font-size:var(--font30-20); font-weight:600; line-height:1.47; letter-spacing:-0.03em; color:#242424;}
.greeting .txt-wrap .txt {margin-bottom:0.7em; font-size:var(--font18-14); line-height:1.67; font-weight:400; letter-spacing:-0.03em; color:#454545;}
.greeting .txt-wrap .txt strong {font-weight:500;}
.greeting .txt-wrap .sign {margin-top:2.78em; font-size:var(--font18-15); line-height:1; font-weight:600; letter-spacing:-0.03em; color:#454545;}

/* 회사개요 */
.company .dc1 .txt {margin-bottom:1em; font-size:var(--font28-18); line-height:1.4; font-weight:600; letter-spacing:-0.03em; color:#242424;}
.company .dc1 .wrap {position:relative; display:flex; flex-wrap:wrap; border-top:2px solid #242424;}
.company .dc1 .wrap:before {content:''; position:absolute; width:50%; max-width:325px; height:42px; top:-84px; right:0; background:url('/images/sub/company-bg.png') no-repeat right bottom/contain;}
.company .dc1 .wrap dl {display:flex; height:100px; align-items:center; border-bottom:1px solid #ddd; font-size:var(--font18-14); font-weight:500; line-height:1.5; letter-spacing:-0.03em; color:#242424;}
.company .dc1 .wrap dl:nth-child(odd) {width:57%;}
.company .dc1 .wrap dl:nth-child(even) {width:43%;}
.company .dc1 .wrap dt {width:180px; text-align:center; font-weight:600; color:#909090;}
.company .dc1 .wrap dd span {display:inline-block; margin-right:1.3em;}

.company .dc2 .wrap {position:relative; display:flex; margin-bottom:var(--size50-20); border:1px solid #ddd; border-top:3px solid #242424;}
.company .dc2 .wrap > div {width:50%;}
.company .dc2 .wrap .cnt {padding:var(--size80-20) var(--size70-20);}
.company .dc2 .wrap .cnt .txt {margin-top:2.22em; font-size:var(--font18-14); font-weight:400; letter-spacing:-0.03em; color:#454545; line-height:1.6;}
.company .dc2 .wrap .ci {position:relative; display:flex; align-items:center; justify-content:center; background:url('/images/sub/ci-bg.png') 50% 50%/cover;}
.company .dc2 .wrap .ci:before {content:''; position:absolute; width:100%; height:100%; left:0; top:0; border-left:1px solid #ddd;}
.company .dc2 .color-info {display:flex;}
.company .dc2 .color-info .left {width:500px;}
.company .dc2 .color-info .left .tit {font-size:var(--font36-20); font-weight:700; line-height:1; letter-spacing:-0.03em; color:#242424;}
.company .dc2 .color-info .left .txt {margin-top:1.22em; color:#686868; letter-spacing:-0.03em; font-weight:400;}
.company .dc2 .color-info .right {display:flex; flex:1 1 auto; min-width:0; width:1%;}
.company .dc2 .color-info .right > dl {width:50%; padding:var(--font40-20); font-size:var(--font16-14); color:#fff; font-weight:500; line-height:1.8; letter-spacing:-0.03em;}
.company .dc2 .color-info .right > dl:nth-child(1) {background:#003894;}
.company .dc2 .color-info .right > dl:nth-child(2) {background:#e72410;}
.company .dc2 .color-info .right dt {margin-bottom:0.75em; font-size:1.5em; font-weight:700;}

/* 회사연혁 */
.history .group {display:flex; margin-bottom:var(--size80-40);}
.history .group:last-child {margin-bottom:0;}
.history .group .year {width:235px; font-size:var(--font40-20); font-weight:700; line-height:1; letter-spacing:-0.04em; color:#003894;}
.history .group .cnt {flex:1 1 auto; min-width:0; width:1%;}
.history .group .col {display:flex; align-items:flex-start;}
.history .group .col .month {position:relative; width:140px; padding:0.44em 0 1.1em; font-size:var(--font18-14); font-weight:600; line-height:1.4; letter-spacing:-0.04em; color:#2c2c2c; border-bottom:1px solid #dfdfdf;}
.history .group .col .month:before {content:''; position:absolute; width:57%; height:2px; background:#003894; left:0; bottom:0;}
.history .group .col>ul {flex:1 1 auto; min-width:0; width:1%;}
.history .group .col>ul>li {padding:0.44em 0 1.1em; margin-bottom:0.6em; font-size:var(--font18-14); font-weight:400; line-height:1.4; letter-spacing:-0.04em; color:#454545; border-bottom:1px solid #dfdfdf;}
.history .group .col>ul>li strong {font-weight:600;}
.history .group .col:last-child>ul>li:last-child {margin-bottom:0;}

/* 사업영역 */
.business .top-cont {text-align:center; margin-bottom:var(--size30-20);}
.business .top-cont .txt {font-size:var(--font26-15); line-height:1.46; font-weight:400; letter-spacing:-0.03em; color:#242424;}
.business .wrap {padding:var(--size50-20); background:#f8f8f8; border-radius:100vh;}
.business .wrap ul {display:flex; justify-content:space-between; margin:calc(0px - var(--size17-5));}
.business .wrap ul li {width:33.333%; padding:var(--size17-5);}
.business .wrap ul li .in {position:relative; padding-bottom:100%; overflow:hidden; border-radius:100%; text-align:center;}
.business .wrap ul li:nth-child(1) .in {background:linear-gradient(135deg, #002d76, #5e3b5a);}
.business .wrap ul li:nth-child(2) .in {background:linear-gradient(135deg, #163073, #b1251e);}
.business .wrap ul li:nth-child(3) .in {background:linear-gradient(135deg, #713a50, #b91d0d);}
.business .wrap ul li .circle {position:absolute; display:flex; padding:10px; width:80%; height:80%; align-items:center; justify-content:center; flex-direction:column; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:100%;}
.business .wrap ul li .tit {font-size:var(--font22-15); font-weight:700; line-height:1.2; letter-spacing:-0.03em; color:#242424;}
.business .wrap ul li .txt {margin-top:0.44em; font-size:var(--font18-14); font-weight:700; line-height:1.2; letter-spacing:-0.03em; color:#878787;}

/* 경영이념 */
.philosophy .dc1 ul {display:flex; margin:calc(0px - var(--size25-5));}
.philosophy .dc1 ul li {width:33.333%; padding:var(--size25-5);}
.philosophy .dc1 ul li .in {height:100%; padding:var(--size30-20); border:1px solid #ddd; border-top:2px solid #003894; text-align:center;}
.philosophy .dc1 ul li .tit {margin:1.3em 0 0.5em;font-size:var(--font20-16); font-weight:700; line-height:1.2; letter-spacing:-0.03em;}
.philosophy .dc1 ul li .txt {font-size:var(--font22-14); font-weight:700; line-height:1em; letter-spacing:-0.03em; color:#242424;}

.philosophy .dc2 ul li {display:flex; padding:var(--size20-10) 0; align-items:center; font-size:var(--font18-14); font-weight:500; line-height:1.4; letter-spacing:-0.03em; color:#454545; border-bottom:1px solid #ddd;}
.philosophy .dc2 ul li .num {display:block; margin-right:var(--size20-10); text-align:center; line-height:var(--size50-40); width:var(--size50-40); height:var(--size50-40); background:#003894; font-family:var(--font-play); color:#fff; font-size:var(--font24-14); font-weight:700; letter-spacing:-0.03em; font-style:italic;}

.philosophy .dc3 .top-txt {margin-bottom:1.75em; font-size:var(--font20-16); font-weight:500; line-height:1.2; letter-spacing:-0.03em; color:#242424;}
.philosophy .dc3 .group {margin-bottom:var(--size20-10); padding:var(--size40-20) var(--size40-20) var(--size40-20) var(--size60-20); background:#f8f8f8; border-radius:7px;}
.philosophy .dc3 .group:last-child {margin-bottom:0;}
.philosophy .dc3 .group .tit {position:relative; margin-left:calc(0px - 1em); font-size:var(--font18-15); font-weight:600; line-height:1.4; letter-spacing:-0.03em; color:#242424;}
.philosophy .dc3 .group .txt {line-height:2em; font-weight:400; letter-spacing:-0.03em; color:#454545;}
.philosophy .dc3 .group .txt strong {font-weight:600;}
.philosophy .dc3 .group .col {margin-bottom:var(--size10-5);}
.philosophy .dc3 .group .col:last-child {margin-bottom:0;}

/* 오시는 길 */
.root_daum_roughmap {width:100% !important;}
.directions {display:flex; margin-top:var(--size60-20);}
.directions .address-info {width:56%;}
.directions .address-info .comp {color:#17479e; font-weight:500; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:23px; font-weight:600; line-height:1.33em; letter-spacing:-.03em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {flex:1 1 auto; min-width:0; width:1%; line-height:1.5em;}
.directions .contact-info dl {display:flex; margin-bottom:var(--size25-5); letter-spacing:-0.03em;}
.directions .contact-info dt {width:120px; color:#242424; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:#a1b5ca;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

@media (max-width: 1024px) {
	.root_daum_roughmap .wrap_map {height:300px !important;}
	.directions .address-info .addr {font-size:20px;}
	.directions .contact-info dl {padding:20px 0;}
	.directions .contact-info dt {width:140px;}
}

@media (max-width: 640px) {
	.root_daum_roughmap .wrap_map {height:250px !important;}	
	.directions .address-info .addr {font-size:18px;}
	.directions .address-info {margin-bottom:20px;}
	.directions .contact-info dl {padding:0;}
	.directions .contact-info dt {width:80px;}
	.directions .contact-info dt svg {margin-right:10px;}
}

/* 우수조달물품제도소개 */
.procurement {margin-bottom:var(--size60-40); border-top:2px solid #024244;}
.procurement:last-child {margin-bottom:0;}
.procurement .group {display:flex; padding:var(--size25-10) 0; border-bottom:1px solid #ddd; letter-spacing:-0.03em; color:#454545;}
.procurement .group .txt strong {font-weight:600;}
.procurement .group .tit {position:relative; width:310px; padding-left:1.35em; font-size:var(--font20-18); line-height:1.5em; font-weight:700; letter-spacing:-0.03em; color:#242424;}
.procurement .group .tit:before {content:''; position:absolute; left:0; top:0.3em; width:0.9em; height:0.9em; border-radius:100%; border:0.25em solid #003894; background:#fff;}
.procurement .group .in {flex:1 1 auto; min-width:0; width:1%;}
.procurement .list01>li {position:relative; padding-left:0.63em; margin-bottom:0.63em;}
.procurement .list01>li:last-child {margin-bottom:0;}
.procurement .list01>li:before {content:''; position:absolute; left:0; top:0.74em; width:0.31em; height:1px; background:#454545;}
.procurement .num-list>li {position:relative; padding-left:1.13em; margin-top:0.63em;}
.procurement .num-list>li>.num {position:absolute; left:0;}
.procurement .dot-list>li {position:relative; margin-bottom:0.5em; padding-left:0.88em;}
.procurement .dot-list>li>strong {color:#242424; font-weight:600;}
.procurement .dot-list>li:last-child {margin-bottom:0;}
.procurement .dot-list>li:before {content:''; position:absolute; left:0; top:0.69em; width:0.31em; height:0.31em; border-radius:100%; background:#c5c5c5;}
.procurement .img-wrap {margin-top:var(--size25-10);}
.procurement .img-wrap ul {display:flex;}
.procurement .img-wrap ul li {margin-right:var(--size60-20);}
.procurement .img-wrap ul li .tt {position:relative; margin-bottom:0.5em; padding-left:0.88em;}
.procurement .img-wrap ul li .tt:before {content:''; position:absolute; left:0; top:0.69em; width:0.31em; height:0.31em; border-radius:100%; background:#e72410;}
.procurement .img-wrap ul li .tx {margin-top:0.88em; max-width:272px; padding:0.8em; line-height:1.6; letter-spacing:-0.03em; background:#e72410; color:#fff; text-align:center;}

.supplier-tit {margin-bottom:1.17em; font-size:var(--font24-18); font-weight:700; line-height:1.2; letter-spacing:-0.03em; color:#242424;}

/* as및 제품문의 */
.as .txt {margin-bottom:1.89em; font-size:var(--font18-15); text-align:center; font-weight:400; line-height:1.4; letter-spacing:-0.03em; color:#242424;}
.as .txt strong {font-weight:600;}
.as .top-cont {margin-bottom:var(--size100-40);}
.as .top-cont ul {display:flex; margin:0 calc(0px - var(--size25-10));}
.as .top-cont ul li {width:33.333%; padding:0 var(--size25-10); text-align:center;}
.as .top-cont ul li .in {height:100%; padding:var(--size50-20) var(--size15-10); border-radius:10px; background:#f2f5fa;}
.as .top-cont ul li:nth-child(even) .in {background:#f8f8f8;}
.as .top-cont ul li .tit {margin:0.6em 0 1em; font-size:var(--font20-16); font-weight:600; line-height:1; letter-spacing:-0.03em; color:#242424;}
.as .top-cont ul li .tx {display:inline-flex; align-items:center; min-height:3em; font-size:var(--font18-14); font-weight:600; line-height:1.56; letter-spacing:-0.03em; color:#454545;}

.as .dc2 .txt {margin-bottom:2.78em;}
.as .dc2 ul {display:flex; margin:-10px;}
.as .dc2 ul li {width:25%; padding:10px; text-align:center;}
.as .dc2 ul li .icon {position:relative; display:flex; align-items:center; justify-content:center; width:var(--size180-80); height:var(--size180-80); margin:0 auto var(--size30-15); background:#003894; border-radius:100vh;}
.as .dc2 ul li .icon:before {content:''; position:absolute; width:calc(100% + var(--size20-10)); height:calc(100% + var(--size20-10)); left:calc(0px - var(--size20-10)/2); top:calc(0px - var(--size20-10)/2); border:1px solid #dfdfdf; border-radius:100%;}
.as .dc2 ul li:nth-child(even) .icon {background:#747474;}
.as .dc2 ul li .tit {margin:1.8em 0 0.5em; font-size:var(--font20-16); font-weight:600; line-height:1.2; letter-spacing:-0.02em; color:#242424;}
.as .dc2 ul li .tx {font-weight:400; line-height:1.6em; letter-spacing:-0.03em; color:#454545;}