@charset "utf-8";
/* 공통 */
.subbox { margin-bottom: 110px; }
.subbox.mg { margin-bottom: 0; }
.sub-pd { padding: 150px 0;}
.sub-pd.first { padding-bottom: 150px; padding-top: 0;}
.sub-pd.last { padding-bottom: 0; padding-top: 150px;}
.subtit { font-size: 32px; margin-bottom: 30px; font-weight: 600; color: var(--color-secondary); line-height: 1.2em; }

/* CEO 인사말 */
.gt { display: flex; align-items: center;}
.gt .img { width: 46%; }
.gt .img img { border-radius: 24px; }
.gt .info { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 80px; }
.gt .info .ctr { display: inline-block; border-radius: 4px; background: var(--color-primary); color: #fff; padding: 7px 8px 5px; font-size: 15px; font-weight: 500; line-height: 1em; }
.gt .info .subtit { font-weight: 300; margin: 30px 0 40px;}
.gt .info .subtit strong { font-weight: 700; }
.gt .info p { margin-bottom: 25px; }
.gt .info p:last-child { margin-bottom: 0; }
.gt .info .ceo { margin-top: 40px; font-size: 24px; font-weight: 700; color: var(--color-secondary); line-height: 1.3em; }

/* 연혁 */
.hst { position: relative; }
.hst::before { content: ""; position: absolute; left: 0; right: 0; top: 10px; width: 1px; height: 100%; background: #cecece; margin: auto; }
.hst .group { display: flex; padding-bottom: 80px; }
.hst .group .year { position: relative; width: 50%; text-align: right; padding-right: 40px; font-size: 34px; font-weight: 700; color: var(--color-primary);}
.hst .group .year::after { content: ""; position: absolute; width: 11px; height: 11px; right: -5px; top: 5px; background: var(--color-primary); border-radius: 100%; }
.hst .group ul { padding-left: 40px; }
.hst .group ul li { margin-bottom: 80px; }
.hst .group ul li:last-child { margin-bottom: 0; }
.hst .group ul li .txt { padding-top: 1px; line-height: 1.556em; }
.hst .group:nth-of-type(odd) { flex-direction: row-reverse;}
.hst .group:nth-of-type(odd) .year { text-align: left; padding-right: 0; padding-left: 40px; }
.hst .group:nth-of-type(odd) .year::after {right: auto; left: -6px; }
.hst .group:nth-of-type(odd) ul { padding-left: 0; padding-right: 40px; }
.hst .group:nth-of-type(odd) ul li { flex-direction: row-reverse; text-align: right; }
.hst-logo { text-align: center; background: #fff; z-index: 1; position: relative; }
.mission .group { display: flex; align-items: center; margin-bottom: 60px; padding: 45px 60px; border-radius: 32px; background: #f8f8f8;}
.mission .group:last-child { margin-bottom: 0; }
.mission .group .info { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 60px; }
.values { text-align: center; }
.values ul { display: flex; gap: 50px 85px; justify-content: center; flex-wrap: wrap;}
.values ul li { width: auto;}
.values ul li .num { line-height: 1em; font-size: 60px; font-weight: 800; color: #dadada; margin-bottom: 3px; }
.values ul li .subtit { color: #fff; line-height: 1em; padding: 15px 20px; border-radius: 12px; background: linear-gradient(to top, #0f2a48, #376aa3); margin-bottom: 23px; display: inline-block; }
.values ul li .txt { font-size: 18px; font-weight: 600; line-height: 1.5em; }

/* 계열사/협력사 */
.pt-list { gap: 35px 48px; display: flex; flex-wrap: wrap; padding: 0 70px; }
.pt-list li { width: calc(100%/4 - 36px); text-align: center; }
.pt-list li .img { position: relative; border-radius: 16px; margin-bottom: 18px; }
.pt-list li .img::before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; border-radius: 16px; }
.pt-list li .tit { line-height: 1em; font-size: 18px; font-weight: 400; }
.pt .group { display: flex; align-items: center; margin-bottom: 60px; }
.pt .group:last-child { margin-bottom: 0; }
.pt .group:nth-of-type(even) { flex-direction: row-reverse;}
.pt .group .img { width: 50%; border-radius: 24px; overflow: hidden;}
.pt .group .img img { width: 100%; }
.pt .group .info { width: 50%; padding-left: 70px; display: flex; align-items: flex-start;}
.pt .group .info .num { width: 35px; height: 35px; border-radius: 35px; background: var(--color-primary); display: flex; align-items: center; justify-content: center; margin-right: 15px; color: #fff; line-height: 1em; font-size: 28px; font-weight: 500; }
.pt .group .info .txtbox { flex: 1 1 auto; min-width: 0; width: 1%;}
.pt .group .info p { font-size: 20px; line-height: 1.5em; }

/* 오시는길 */
.mapbox {border-radius: 24px; overflow: hidden; margin-bottom: 50px; border: 1px solid #ddd;}
.lct-tit { line-height: 1em; color: #242424; font-size: 20px; font-weight: 700; line-height: 1.5em; margin-bottom: 35px; }
.lct li { display: flex; margin-bottom: 24px;  align-items: center;}
.lct li:last-child { margin-bottom: 0; }
.lct li .tit { display: flex; align-items: center; width: 230px; gap: 10px; }
.lct li .tit strong { font-size: 18px; font-weight: 600; color: #454545; flex: 1 1 auto; min-width: 0; width: 1%;}
.lct li .txt { flex: 1 1 auto; min-width: 0; width: 1%; }

/* sub2 공통 */
.sub2-fx { display: flex; align-items: center; margin-bottom: 100px; }
.sub2-fx.mg { margin-bottom: 0; }
.sub2-fx.rv { flex-direction: row-reverse; }
.sub2-fx .info { width: 50%; padding-left: 80px; }
.sub2-fx .info p { margin-bottom: 20px; }
.sub2-fx .info p:last-child { margin-bottom: 0; }
.sub2-fx .img { width: 50%; border-radius: 24px; overflow: hidden;}
.sub2-fx .img img { width: 100%; }
.sub2-pc { border-radius: 24px; overflow: hidden; text-align: center; }
.sub2-pc .subtit { text-align: center; background: #0f2a48; color: #fff; line-height: 1em; margin-bottom: 0; padding: 25px 10px;}
.sub2-pc-cnt { padding: 42px 95px; background: #f6f6f6; }
.sub2-pc-cnt.white { background: transparent; padding: 0 95px; }
.sub2-pc-cnt ul { display: flex; justify-content: center; position: relative; justify-content: space-between;}
.sub2-pc-cnt ul::before { content: ""; position: absolute; width: 83%; left: 0; right: 0; margin: auto; top: 16px; height: 1px; border: 1px dashed #ddd;}
.sub2-pc-cnt ul li { width: auto; text-align: center; }
.sub2-pc-cnt ul li .num { width: 35px; height: 35px; border-radius: 35px; background: var(--color-primary); display: flex; align-items: center; justify-content: center; color: #fff; line-height: 1em; font-size: 28px; font-weight: 500; margin: auto; position: relative; z-index: 1; }
.sub2-pc-cnt ul li .icon { width: 170px; height: 170px; border-radius: 100%; background: #fff; display: flex; align-items: center; justify-content: center; margin: 35px auto 20px; border: 1px solid #ddd;}
.sub2-pc-cnt ul li .tit { font-size: 22px; font-weight: 600; line-height: 1.3em; margin-bottom: 15px; color: #242424; }
.sub2-pc-cnt ul li .txt { line-height: 1.2em; }
.sub2-pc-cnt.white .tit { color: #fff; }
.sub2-pc-cnt.pd { padding: 0; }
.sub2-pc-cnt.pd ul::before { width: 86%;}
.sub2-pc-cnt.bd ul::before { display: none; }
.sub2-pc-cnt.bd ul li .icon { margin-top: 0; }
.sub2-promise { border-radius: 24px; background: #f6f6f6; padding: 64px; }
.sub2-promise .top { display: flex; align-items: center; }
.sub2-promise .top .info { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 60px; }
.sub2-promise .top .info h4 { margin-bottom: 10px; font-size: 22px; font-weight: 600; }
.sub2-promise .top .info p { line-height: 1.5em; font-size: 18px; margin-bottom: 20px; }
.sub2-promise .top .info p:last-child { margin-bottom: 0; }
.sub2-promise .btm { padding-top: 60px; border-top: 1px solid #ddd; margin-top: 60px; }
.sub2-promise .btm p { font-size: 18px; line-height: 1.5em; margin-top: 35px; }
.sub2-promise .btm ul li { display: flex; margin-bottom: 20px; }
.sub2-promise .btm ul li:last-child { margin-bottom: 0; }
.sub2-promise .btm ul li .tit { display: inline-block; background: #0f2a48; color: #fff; border-radius: 6px; padding: 6px 10px; line-height: 1.2em; font-size: 22px; font-weight: 600; margin-right: 20px; }
.sub2-promise .btm ul li .txt { font-size: 20px; font-weight: 500; line-height: 1.4em; flex: 1 1 auto; min-width: 0; width: 1%; padding-top: 6px; }
.sub2-tit { border-bottom: 1px solid #ddd; margin-bottom: 60px; line-height: 1.2em; padding-bottom: 25px; font-size: 32px; position: relative; color: var(--color-secondary); padding-left: 22px; }
.sub2-tit::before { content: ""; position: absolute; width: 6px; height: 32px; background: #0f2a48; left: 0; top: 2px; }
.sub2-iconlist { display: grid; grid-template-columns: 1fr 1fr; gap: 80px 30px; margin: 100px auto 0; max-width: 900px; width: 100%;}
.sub2-iconlist li {text-align: center; width: 100%;}
.sub2-iconlist li .icon { width: 200px; height: 200px; border-radius: 32px; background: #fff; display: flex; align-items: center; justify-content: center; margin: auto; border:2px solid #ddd;}
.sub2-iconlist li .tit { font-size: 28px; font-weight: 600; line-height: 1.3em; margin: 33px 0 20px; color: #242424; }
.sub2-iconlist.flex { max-width: 100%; gap: 80px 100px; display: flex; flex-wrap: wrap; justify-content: center;}
.sub2-iconlist.flex li { width: auto;}
.sub2-bg { padding: 100px 0 160px; color: #fff; background-repeat: no-repeat; background-position: center; background-size: cover;}
.sub2-bg.bg1 { background-image: url(../images/sub/sub2-4-bg.jpg);}
.sub2-bg.bg2 { background-image: url(../images/sub/sub2-6-bg.jpg);}
.sub2-bg.bg3 { background-image: url(../images/sub/sub2-7-bg.jpg);}
.sub2-bg.bg4 { background-image: url(../images/sub/sub2-8-bg.jpg);}
.sub2-bg .sub2-tit { color: #fff; border: none; }
.sub2-bg .sub2-tit::before { background: #fff; }
.sub2-good { display: flex; flex-wrap: wrap; padding: 0 25px; gap: 24px; }
.sub2-good li { width: calc(100%/4 - 18px); text-align: center; border: 1px solid #ddd; border-radius: 24px; overflow: hidden;}
.sub2-good li img { width: 100%; }
.sub2-good li .txtbox { padding: 40px 10px;} 
.sub2-good li .tit { display: flex; justify-content: center; align-items: center; gap: 10px; margin-bottom: 20px; }
.sub2-good li .tit .num { width: 24px; height: 24px; border-radius: 100%; display: flex; align-items: center; justify-content: center; background: var(--color-primary); color: #fff; line-height: 1em; font-size: 20px; font-weight: 600; }
.sub2-good li .tit strong { display: inline-block; font-weight: 600; font-size: 22px; color: #242424; }
.sub2-good li .txt { line-height: 1.2em; }

/* 화재 · 재난 복구 */
.fire { margin-top: 60px; display: flex; flex-wrap: wrap;}
.fire li { width: calc(100%/3); color: #fff; position: relative; text-align: center;}
.fire li img { width: 100%; }
.fire li .abbox { position: absolute; left: 0; right: 0; margin: auto; padding: 15px; top: 50%; transform: translateY(-50%);}
.fire li .abbox .tit { font-size: 22px; font-weight: 600; line-height: 1.2em; margin-bottom: 15px; }
.fire li .abbox .txt { line-height: 1.2em; }

/* 저수장·저수조 청소 */
.clean { display: flex; flex-wrap: wrap; gap: 100px 30px; }
.clean .col { width: calc(100%/2 - 15px); }
.clean .col .img { border-radius: 24px; overflow: hidden;}
.clean .col .img img { width: 100%; }
.clean .col .tit { font-size: 28px; font-weight: 600; line-height: 1.2em; color: var(--color-secondary); text-align: center; margin: 45px 0;}
.clean .col .txtbox { display: flex; justify-content: center; }
.clean .col .txtbox p { margin-bottom: 20px; position: relative; padding-left: 35px; font-size: 20px; line-height: 1.4em; font-weight: 500; }
.clean .col .txtbox p::before { content: ""; position: absolute; left: 0; width: 24px; height: 24px; top: 0; bottom: 0;margin: auto;background: url(../images/sub/clean-chk.png) center no-repeat; background-size: contain;}
.clean .col .txtbox p:last-child { margin-bottom: 0; }
.clean .col .txtbox p strong { display: inline-block; margin-right: 8px; }
.clean-tbl-wrap { overflow: auto;}
.clean-tbl { width: 100%; border-collapse: collapse; border-top: 2px solid var(--color-primary);}
.clean-tbl tr { border-bottom: 1px solid #ddd;}
.clean-tbl tr.bd { border: none; }
.clean-tbl tr th { background: #fff9ed; font-size: 18px; font-weight: 600; color: var(--color-secondary); line-height: 1.2em; padding: 20px 10px; border-right: 1px solid #ddd;}
.clean-tbl tr th:last-child { border-right: none; }
.clean-tbl tr td { text-align: center; padding: 40px 10px; border-right: 1px solid #ddd; font-size: 16px; line-height: 1.556em; }
.clean-tbl tr td.fw { font-weight: 600; }
.clean-tbl tr td.left { text-align: left; padding-left: 80px; }
.clean-tbl tr td.left .txt { margin-bottom: 30px; }
.clean-tbl tr td.left .txt:last-child { margin-bottom: 0; }
.clean-tbl tr td.left ul { padding-left: 10px; }
.clean-tbl tr td.left ul li { position: relative; padding-left: 10px; }
.clean-tbl tr td.left ul li::before { content: ""; position: absolute; left: 0; top: 9px; width: 3px; height: 3px; border-radius: 4px; background: #454545;} 

/* 시설 경비·관리 */
.security-bg { background: url(../images/sub/sub2-4-ban.jpg) center no-repeat; background-size: cover; color: #fff; padding: 100px 0; text-align: center; }
.security-bg .subtit { text-align: center; color: #fff; }
.security-bg p { margin-bottom: 35px; font-size: 20px; line-height: 1.5em; }
.security-bg p:last-child { margin-bottom: 0; }
.security-list { display: flex; max-width: 900px; flex-wrap: wrap; gap: 30px; width: 100%; margin: 100px auto 0; }
.security-list li { width: calc(100%/2 - 15px); text-align: center; color: #fff; background: #353535; padding: 40px 10px; border-radius: 24px; }
.security-list li .tit { font-size: 28px; font-weight: 600; line-height: 1.2em; margin-bottom: 15px; }
.security-list li .txt { font-size: 20px; font-weight: 500; line-height: 1.3em; color: rgba(255,255,255,0.7);}

/* 관공서 시설관리 */
.operate-gray { background: #f6f6f6; padding: 100px 0; text-align: center; border-radius: 24px; }
.operate-gray .subtit { text-align: center; color: #0f2a48;}
.operate-gray p { font-size: 20px; line-height: 1.5em; margin-bottom: 25px; }
.operate-gray p:last-child { margin-bottom: 0; }