@charset "utf-8";








/* searchWrap */
.searchWrap {display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; padding:25px 30px; border-radius:10px; background:#f7f7f7}
.searchWrap.end {justify-content:flex-end}
.searchWrap.none {margin-bottom:5px; padding:0; border-radius:0; background:none}
.searchInfo {display:flex; font-size:1.7rem; color:#555}
.searchInfo li:first-child:after {content:""; display:inline-block; width:1px; height:12px; margin:0 10px; background:#cfd1d8}
.searchInfo li:first-child:nth-last-child(1):after {content:none}
.searchInfo li span {color:#7f8fdb; font-weight:600}
.searchForm {display:flex; justify-content:center; align-items:center}
.searchForm li {display:flex; align-items:center; margin-left:10px}
.searchForm li:first-child {margin-left:0}
.searchForm li span {display:flex; align-items:center; margin-left:5px}
.searchForm li span label {margin:0 10px 0 20px; font-size:1.7rem}
.searchForm li:first-child span:first-child label {margin:0 10px 0 0}
.searchForm li span label + input, .searchForm li span label + select {flex:1}
.cnt {justify-content:center}



/* common column */
.column {align-items:stretch}
.column .searchForm {display:flex; justify-content:space-between}
.column .searchForm li {display:flex; flex-wrap:wrap; width:100%; margin:0}
.column .searchForm li span label {min-width:90px; margin:0 10px 0 20px !important; text-align:right}
.column p {min-width:100px; max-width:100px}
.column p span button {width:100%; height:100%}

/* column4 */
.column.column4 .searchForm li span {min-width:calc(25% - 15px); max-width:calc(25% - 15px)}
.column.column4 .searchForm li span:nth-child(4n+1) {margin-left:0}
.column.column4 .searchForm li span:nth-child(4n+1) label {margin-left:0 !important}
.column.column4 .searchForm li span:nth-child(n+5) {margin-top:10px}

/* column3 */
.column.column3 .searchForm li span {min-width:calc(33.333% - 20px); max-width:calc(33.333% - 20px)}
.column.column3 .searchForm li span:nth-child(3n+1) {margin-left:0}
.column.column3 .searchForm li span:nth-child(3n+1) label {margin-left:0 !important}
.column.column3 .searchForm li span:nth-child(n+4) {margin-top:10px}

/* column2 */
.column.column2 .searchForm li span {min-width:calc(50% - 25px); max-width:calc(50% - 25px)}
.column.column2 .searchForm li span:nth-child(2n+1) {margin-left:0}
.column.column2 .searchForm li span:nth-child(2n+1) label {margin-left:0 !important}
.column.column2 .searchForm li span:nth-child(n+3) {margin-top:10px}



/* pagination */
.pagination {display:flex; justify-content:center; align-items:center; margin-top:30px}
.pagination a {display:flex; justify-content:center; align-items:center; box-sizing:border-box; width:40px; height:40px; margin:0 5px; border-radius:50%; border:1px solid #e1e3ea; font-size:1.5rem; color:#757575; text-decoration:none}
.pageLink {display:flex}
.pageLink a:hover, .pageLink a:focus {border:1px solid #555}
.pageLink a.active {border:1px solid #555; background:#555; color:#fff}
.pageNav {display:flex; justify-content:center; align-items:center}
.pageNav:before {content:""; background-repeat:no-repeat}
.start:before {width:14px; height:17px; background:url("../images/ico_start.png")}
.prev:before {width:10px; height:17px; background:url("../images/ico_prev.png")}
.next:before {width:10px; height:17px; background:url("../images/ico_next.png")}
.end:before {width:14px; height:17px; background:url("../images/ico_end.png")}



/* bbsView */
.bbsView {position:relative; width:100%; font-size:1.7rem}
.bbsTitle h4 {display:flex; justify-content:center; align-items:center; padding:15px 20px; border-top:2px solid #4050a7; border-bottom:1px solid #e1e3ea; background:#fafafa; font-size:2.4rem; color:#333; font-weight:600}
.bbsTitle > div {display:flex; justify-content:flex-start; align-items:center; padding:10px 20px; border-bottom:1px solid #e1e3ea; font-size:1.7rem; color:#555}
.bbsTitle div p {display:flex; align-items:center; width:33.333%}
.bbsTitle div p strong {display:flex; align-items:center; position:relative; width:100px; font-weight:600}
.bbsTitle div p strong:after {content:""; position:absolute; right:-1px; width:1px; height:12px; margin-right:20px; background:#e1e3ea}
.bbsTitle div p span {width:calc(100% - 120px)}
.addFileWrap > p {width:100px !important}
.addFileWrap > p strong:after {content:none}
.fileWrap li {display:flex; align-items:center; margin-top:5px}
.fileWrap li:first-child {margin-top:0}
.fileWrap a {margin-right:20px; color:inherit}
.fileWrap a:hover, .fileWrap a:focus {text-decoration:underline}
.bbsContent {padding:30px 20px; border-bottom:1px solid #e1e3ea; font-size:inherit; color:#757575}

.bbsContent * {font-size:1.7rem !important; color:#757575}
.bbsContent table {table-layout:fixed; position:relative; width:100%; border-collapse:separate; border-top:2px solid #4050a7; background:#fff}
.bbsContent table sup, .bbsContent table sub {font-size:1.7rem; color:#4050a7}
.bbsContent table th, .bbsContent table td {padding:10px; border-left:1px solid #e1e3ea; border-bottom:1px solid #e1e3ea; font-size:1.7rem; color:#757575; text-align:left}
.bbsContent table th {padding:10px; background:#f2f2f2; color:#555; text-align:center}
.bbsContent table th:first-child, .bbsContent table td:first-child {border-left:none}
.bbsContent table td a {display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:keep-all; vertical-align:middle; max-width:95%; color:#757575}
.bbsContent table td a:hover, .bbsContent table td a:focus {color:#7f8fdb; text-decoration:underline}
.bbsContent table td p ~ p {margin-top:20px}

/* .bbsContent p {margin-bottom:30px} */
.bbsContent textarea {min-height:300px; color:inherit}



/* 댓글 */
.num {margin-left:5px; color:#92a3f3}
.cmntWrap {margin-top:80px; font-size:1.7rem; color:#555}
.cmntWrap button {margin:0 0 0 5px !important}
.cmntWrap .tit {display:flex; align-items:center; position:relative; margin-top:80px; padding-bottom:5px; border-bottom:2px solid #4050a7}
.cmntWrap .tit strong {margin-left:20px; font-weight:600}
.cmntWrap .tit strong:before {content:""; position:absolute; top:5px; left:0; width:16px; height:16px; background:url("../images/ico_comment.svg") no-repeat; background-size:contain}
.cmntBox {border-bottom:1px solid #e1e3ea}
.cmntBox .btnBox {margin-top:0}
.cmntBox .cmntCnt .cmntHead {display:flex; justify-content:space-between; align-items:center; padding:15px 15px 0}
.cmntBox .cmntCnt .cmntHead p {font-size:1.7rem; color:#7f8fdb}
.cmntBox .cmntCnt .cmnt {padding:10px 15px}
.cmntBox .cmntCnt .cmntFoot {padding:0 15px 15px}
.cmntBox .cmntCnt .cmntFoot button {margin-left:5px}
.cmntBox .cmntCnt .reply {padding-left:30px; border-top:1px solid #e1e3ea}

.cmntWBox {display:none; padding:15px 15px 15px 45px; background:#fafafa}
.cmntWBox .btnBox {margin-top:10px}
.cmntWBox .cmntW {padding:15px; border-radius:10px; border:1px solid #e1e3ea; background:#fff; font-size:1.5rem; color:#aaa}
.cmntWBox .cmntW .head {display:flex; justify-content:space-between; align-items:center; margin-bottom:10px}
.cmntWBox .cmntW .head p {color:#7f8fdb}
.cmntWBox .cmntW [contenteditable="true"]:empty:before {content: attr(data-placeholder)}
.cmntWBox .cmntW .write {outline:none; color:#555}
.cmntWBox.cmntWBoxB {display:block !important; padding:15px; border-bottom:1px solid #999; background:#fff}



/* faq */
.faq {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; border-top:2px solid #4050a7}
.faq li {width:100%; border-bottom:1px solid #e1e3ea; font-size:1.7rem; color:#757575}
.faq li > a {display:flex; justify-content:space-between; align-items:flex-start; padding:15px; word-break:break-word; text-decoration:none}
.faq li > a.on {color:#7f8fdb}
.faq li > a > strong {display:flex; justify-content:center; align-items:center; margin-right:5px; padding:0 10px; border:1px solid #cfd1d8; font-size:1.5rem; color:#555; font-weight:400}
.faq li .ans_title {display:flex; justify-content:center; align-items:center; width:24px; height:24px; margin-right:10px; border-radius:50%; background:#999; color:#fff; font-weight:600}
.faq li > a.on .ans_title {background:#4050a7; color:#fff; font-weight:600}
.faq li > a > span {flex:1}
.faq li .ans {display:none}
.faq li .ans .ans_inner {display:flex; justify-content:center; padding:15px; background:#fafafa}
.faq li .ans .ans_title {background:#555}
.faq li .ans .ans_cont {flex:1}
.faq li > a > i {display:flex; justify-content:center; align-items:center; position:relative; margin-left:30px}
.faq li > a > i:after {content:""; display:flex; justify-content:center; align-items:center; position:absolute; right:3px; top:1px; width:12px; height:12px; border-top:1px solid #555; border-right:1px solid #555; transform:rotate(135deg); transition:0.3s}
.faq li > a.on > i:after {top:calc(50% + 10px); transform:rotate(-45deg)}

.ans_cont * {font-size:1.7rem !important; color:#757575}
.ans_cont table {table-layout:fixed; position:relative; width:100%; border-collapse:separate; border-top:2px solid #4050a7; background:#fff}
.ans_cont table sup, .ans_cont table sub {font-size:1.7rem; color:#4050a7}
.ans_cont table th, .ans_cont table td {padding:10px; border-left:1px solid #e1e3ea; border-bottom:1px solid #e1e3ea; font-size:1.7rem; color:#757575; text-align:left}
.ans_cont table th {padding:10px; background:#f2f2f2; color:#555; text-align:center}
.ans_cont table th:first-child, .ans_cont table td:first-child {border-left:none}
.ans_cont table td a {display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:keep-all; vertical-align:middle; max-width:95%; color:#757575}
.ans_cont table td a:hover, .ans_cont table td a:focus {color:#7f8fdb; text-decoration:underline}
.ans_cont table td p ~ p {margin-top:20px}


/* 파일선택 */
.fileForm {margin-left:-20px; padding-left:20px; border-left:1px solid #e1e3ea}
.fileInputs .fileInput {display:flex; align-items:center; position:relative; min-width:500px; max-width:600px; margin-top:5px}
.fileInputs .fileInput > span {display:flex; align-items:center; position:relative}
.fileInputs .fileInput > span:first-child {flex:1}
.fileInputs .fileInput > span input[type=file]:focus + button {outline:2px dotted #8b6cfd}
.fileInputs .fileInput > span input[type=text] {padding-right:25px}
.fileInputs .fileInput > span .removeTxt {display:flex; align-items:center; position:absolute; right:10px; width:15px; height:15px; background:url("../images/btn_x.png") center center no-repeat}
.fileInputs .fileInput input[type=file] {cursor:pointer; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0}
.fileInputs .fileInput input[type=file]::-webkit-file-upload-button {cursor:pointer}
.fileInput button {margin-left:1px}
.fileInput .removeFile {margin-left:5px}
.fileForm2 {margin-left:0; padding-left:0;border-left:none}
.fileForm2 .fileInputs .fileInput input[type=file] {width:100%}
.fileForm2 .fileInputs > li {margin-top:10px}
.fileForm2 .fileInputs > li:first-child {margin-top:0}

.fileInputs label.alert {cursor:pointer; display:inline-flex; justify-content:center; align-items:center}
.fileInputs [type=file]:focus + label.alert {outline:2px dotted #8b6cfd}
.fileInputs .fileList {display:flex; flex-direction:column; margin-top:5px}
.fileInputs .fileBox {display:flex; align-items:center}
.fileInputs .fileBox p {width:auto}
.fileInputs .fileBox .btn_x {display:inline-flex; justify-content:center; align-items:center; width:15px; height:15px; margin-left:5px; background:url("../images/btn_x.png") center 4px no-repeat}



/* bbsPageLink */
.bbsPageLink {margin-top:80px}
.bbsPageLink li {display:flex; align-items:center; border-bottom:1px solid #e1e3ea; font-size:1.7rem}
.bbsPageLink li:first-child {border-top:1px solid #e1e3ea}
.bbsPageLink li span {display:flex; justify-content:center; align-items:center; width:100px; margin-right:20px; padding:10px 0; border-right:1px solid #e1e3ea; background:#fafafa; font-weight:600}
.bbsPageLink li a:hover {color:#7f8fdb}



/* imgBoard */
.imgBoard {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; border-top:2px solid #4050a7}
.imgBoard > li {width:100%; padding:20px; border-bottom:1px solid #e1e3ea; color:#757575}
.imgBoard > li a {display:flex; justify-content:space-between; align-items:flex-start}
.imgBoard > li a:hover, .imgBoard > li a:focus {text-decoration:none}
.imgBoard > li a .img {margin-right:20px; padding:4px; border:1px solid #e1e3ea}
.imgBoard > li a .img p {display:flex; justify-content:center; align-items:center; position:relative; overflow:hidden; width:160px; height:110px}
.imgBoard > li a .img p img {overflow:hidden; width:100%; height:100%; transition:0.3s}
.imgBoard > li a:hover .img p img {transform:scale(1.1)}
.imgBoard > li a > ul.postWrap {flex:1}
.imgBoard > li a h4 {font-size:1.9rem; color:#333; font-weight:600}
.postWrap p {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; width:100%; margin:5px 0 10px}

.imgBoard > li a:hover h4, .imgBoard > li a:focus h4, .imgBoard > li > a:hover .postWrap p, .imgBoard > li > a:focus .postWrap p {text-decoration:underline}
.dtlInfo {display:flex; align-items:center; font-size:1.5rem; color:#555}
.dtlInfo span {display:flex; align-items:center}
.dtlInfo span:nth-child(n+2):before {content:""; display:inline-block; width:1px; height:12px; margin:0 10px; background:#e1e3ea}
.dtlInfo strong {margin-right:8px; font-weight:600}
.dtlInfo em {color:#757575}
.imgBox {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; margin-top:60px}
.imgBox em{margin-top:10px}



/* quesAssentBox */
.quesAssentBox {width:100%; margin:80px 0 15px; padding:15px; border-radius:15px; background:#f7f7f7; font-size:1.7rem}



/* 인증신청 */
.rqnWrap {display:none; margin-top:30px}
.rqnWrap.on {display:block}
.textareaBox {position:relative}
.textareaBox p {margin-bottom:5px; font-size:1.5rem}
.textareaBox textarea {min-height:200px}

.rqnTit {display:flex; justify-content:center; align-items:center; width:100%}
.rqnTit h5 {flex:1; padding:15px 10px; font-size:3.0rem; color:#333; font-weight:600}
.rqnTit .suspense {display:flex; flex-direction:column; justify-content:space-between; align-items:center; position:absolute; right:0; border-left:1px solid #e1e3ea}
.rqnTit .suspense li{min-width:100px; padding:5px 10px; border-top:1px solid #e1e3ea; font-weight:400}
.rqnTit .suspense li:first-child {border-top:none}

.signWrap {display:flex; flex-direction:column; justify-content:center; align-items:center; margin:30px 0}
.signWrap input {margin:0 5px; text-align:right}
.signWrap ul {display:flex; justify-content:center; align-items:center; margin:30px 0}
.signWrap ul li {display:flex; align-items:center; margin-left:10px}
.signWrap ul li input {width:50px}
.signWrap > p {display:flex; justify-content:flex-end; align-items:center; width:100%}
.signWrap > p input {width:100px; text-align:left}
.signWrap h5 {margin-top:30px; font-size:2.4rem; color:#333; font-weight:600}



/* 산정평가 지원 신청 */
.mixTitle {display:flex; justify-content:space-between; align-items:center; margin-bottom:10px}
.mixTitle h4 {margin-bottom:-20px}
.mixTitle .searchInfo.bottom {margin-bottom:-20px}
.mixTitle .flex p ~ p {margin-left:20px; font-size:1.7rem}
.mixTitle .flex p ~ span {margin-left:5px}
.mixTitle .flex p ~ p span {color:#7f8fdb; font-weight:600}
.mixTitle .align {font-size:1.5rem}
.mixTitle .align span {color:#7f8fdb; font-weight:600}
.mixTitle.gap {margin-top:30px; margin-bottom:0}
.mixTitle.gap .h4 {margin-bottom:5px}
.mixTitle.gap .txt {font-size:1.7rem; color:#757575}
.selectArea {display:flex; justify-content:space-between; align-items:center}
.selectArea label {margin-right:5px; font-size:1.7rem}



/* 인증현황 */
.statusWrap li {display:flex; align-items:center; height:35px}
.statusWrap li:not(:first-child) {margin-top:10px}
.statusWrap li .checkbox {min-width:170px}
.confirmLayer {display:none}
.confirmLayer.on {display:flex; align-items:center}
.confirmLayer .date {display:flex; align-items:center}
.confirmLayer .date label {margin:0 10px 0 20px}
.date input {width:150px; background:url("../images/ico_calendar.svg") right 7px center no-repeat #fff; background-size:20px auto}
.confirmLayer .fileInput {min-width:400px; margin-top:0; margin-left:5px}
.confirmLayer .fileInputs > li:first-child {margin-left:0}



/* 탄소감축량 계산기 */
.calTable + .calTable {margin-top:15px}
.calTable .flex em {margin-left:10px}
.calTable table th, .calTable table td {color:#333}
.calTable01 table {border-top:1px solid #9cd9a2}
.calTable01 table th, .calTable01 table td {border-left:1px solid #9cd9a2; border-bottom:1px solid #9cd9a2}
.calTable01 table th:first-child, .calTable01 table td:first-child {border-left:none}
.calTable01 table th {background:#f1f9f2}

.calTable02 table {border-top:1px solid #89d5f1}
.calTable02 table th, .calTable02 table td {border-left:1px solid #89d5f1; border-bottom:1px solid #89d5f1}
.calTable02 table th:first-child, .calTable02 table td:first-child {border-left:none}
.calTable02 table th {background:#ebf9fe}

.calTable03 table {border-top:1px solid #ffcf4b}
.calTable03 table th, .calTable03 table td {border-left:1px solid #ffcf4b; border-bottom:1px solid #ffcf4b}
.calTable03 table th:first-child, .calTable03 table td:first-child {border-left:none}
.calTable03 table th {background:#fff7e0}

.calTable04 table {border-top:1px solid #ffb183}
.calTable04 table th, .calTable04 table td {border-left:1px solid #ffb183; border-bottom:1px solid #ffb183}
.calTable04 table th:first-child, .calTable04 table td:first-child {border-left:none}
.calTable04 table th {background:#fdf1ea}

.resultBox {margin-top:30px; padding-top:30px; border-top:1px solid #e1e3ea}
.resultTable table {border:3px dashed #cfd1d8}
.resultTable table th, .resultTable table td{border-left:1px solid #e1e3ea; border-bottom:1px solid #e1e3ea}
.resultTable table th:first-child, .resultTable table td:first-child {border-left:none}
.resultTable table tr.cal01 td {background:#f1f9f2}
.resultTable table tr.cal02 td {background:#ebf9fe}
.resultTable table tr.cal03 td {background:#fff7e0}
.resultTable table tr.cal04 td {background:#fdf1ea}




/* 추진배경 */
.videoWrap {display:flex; max-width:1250px; max-height:450px; margin-bottom:40px}
.videoWrap > li:first-child {width:65%}
.videoWrap > li video {width:100%}
.videoWrap > li:last-child {width:35%; margin-left:20px}
.subtitles {overflow-y:auto; height:100%; padding:20px; border:1px solid #e1e3ea; background:#fcfcfc; font-size:1.7rem; letter-spacing:-0.03em}
.subtitles li:not(:first-child) {margin-top:30px}
.subtitles li p {color:#7f8fdb}

/* 조직도 */
.orgWrap {display:flex; flex-direction:column; position:relative; width:100%}
.orgWrap div {display:flex; flex-direction:column; justify-content:center; align-items:center; font-size:1.7rem}
.orgWrap div div {position:relative}
.orgWrap div div:before {content:""; display:flex; justify-content:center; width:1px; height:30px; background:#e1e3ea}
.orgWrap div.no1 div {border-radius:5px; padding:20px; background:#2d3c92; font-size:1.9rem; color:#fff}
.orgWrap div.no1 div:before, .orgWrap div.no4 div:before {content:none}
.orgWrap div.no1:after {content:""; display:flex; justify-content:center; width:1px; height:110px; background:#e1e3ea}
.orgWrap div.no2 {position:absolute; left:150px; top:75px}
.orgWrap div.no2:after {content:""; position:absolute; left:0; top:50px; width:calc(50vw - 330px); height:1px; background:#e1e3ea}
.orgWrap div.no3 div:after {content:""; position:absolute; left:0; top:0; width:calc(100% + 60px); height:1px; background:#e1e3ea}
.orgWrap div.no3 div:first-child:after {left:50%}
.orgWrap div.no3 div:last-child:after {left:auto; right:50%}
.orgWrap div.no4 {position:absolute; left:150px; top:335px}
.orgWrap div.no4:after {content:""; position:absolute; left:200px; top:25px; width:2.1vw; height:1px; background:#e1e3ea}
.orgWrap div.no4 div {border-radius:5px; height:50px; background:#2d3c92; color:#fff; font-weight:600}
.orgWrap div.no5 div:before {height:110px}
.orgWrap div p, .orgWrap div span, .orgWrap div.no5 div, .orgWrap div.no4 div {display:flex; justify-content:center; align-items:center; width:200px}
.orgWrap div p {height:50px; border-radius:5px 5px 0 0; background:#4050a7; color:#fff; font-weight:600}
.orgWrap div.no2 p, .orgWrap div.no4 div {background:#7f8fdb}
.orgWrap div span {padding:10px; border-radius:0 0 5px 5px; background:#f2f4fb; color:#555}
.orgWrap div.no3, .orgWrap div.no5 {flex-direction:row; align-items:stretch}
.orgWrap div:where(div.no3 > div:not(:first-child), div.no5 > div:not(:first-child)) {margin-left:60px}
.orgWrap div.no5 div ul {padding:15px; border-radius:5px; background:#f7f7f7; width:100%; height:calc(100% - 110px)}
.orgWrap div.no5 div ul li {display:flex; align-items:center}
.orgWrap div.no5 div ul li:before {content:""; display:flex; align-items:center; width:4px; height:4px; margin-right:5px; border-radius:50%; background:#555}

@media (max-width: 1919px) {
    .orgWrap div {justify-content:flex-start}
    .orgWrap div.no4 {z-index:1; left:0}
    .orgWrap div.no4:after {content:none}
}


/* 인증기준 */
.txtTitle {font-size:2.4rem; color:#222; font-weight:600}
.txtTitle + h4 {margin-top:40px}
.txtTitle ~ .txtTitle {margin-top:60px}
.txtContent {font-size:1.7rem}
.txtContent .h4 ~ .h4 {margin-top:40px}
.txtContent > p {margin-left:20px; font-weight:600}
.txtContent strong {color:#7f8fdb}
.txtContent > ul > li {display:flex; align-items:center; margin-left:20px}
.txtContent > ul > li strong {margin:0 5px}
.txtContent > ul > li:before {content:""; display:flex; width:5px; height:1px; margin-right:3px; background:#555}
.txtContent .bullet > li:not(:has(p, .fileDownWrap, .fileDownWrap)):before {content:""; display:flex; width:4px; height:4px; border-radius:50%; margin-right:3px; background:#555}
.txtContent .bullet > li:has(p) {margin-left:25px}
.txtContent .bullet > li:has(p, .fileDownWrap, .fileDownWrap, .table):before {content:none}
.division {position:relative}
.division li {margin:5px 0}
.division li:last-child:before {content:""; position:absolute; left:50%; top:50%; width:350px; transform:translate(-50%, 0); height:1px; background:#757575}
.fileDownWrap {width:100%; margin:20px 0 40px; padding:20px; border-radius:10px; background:#fafafa}
.mark {max-height:100px}



/* 인증절차 */
.processWrap {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch; margin-bottom:40px}
.processWrap > div {display:flex; flex-direction:column; align-items:center; position:relative; width:calc(25% - 60px); padding:30px; border-radius:10px; border:1px solid #e1e3ea; background:#fafafa; font-size:1.9rem; font-weight:600}
.processWrap > div:nth-child(n+5) {margin-top:60px}
.processWrap > div:after {content:""; position:absolute; right:-55px; top:50%; transform:translate(0, -50%); width:33px; height:50px; background:url("../images/ico_arrow.png") no-repeat}
.processWrap > div:nth-child(4):after {right:auto; top:auto; transform:translate(calc(50% - 17px), 255px) rotate(90deg)}
.processWrap > div:nth-child(5) {order:8}
.processWrap > div:nth-child(6) {order:7}
.processWrap > div:nth-child(7) {order:6}
.processWrap > div:nth-child(8) {order:5}
.processWrap > div:nth-child(n+5):after {transform:translate(0, -50%) rotate(180deg)}
.processWrap > div:nth-child(5):after {content:none}
.processWrap > div p {display:flex; flex-direction:column; justify-content:center; align-items:center; font-size:2.4rem; color:#303f95; text-align:center; line-height:1.2; letter-spacing:-0.03em}
.processWrap > div p:before {content:""; display:flex; justify-content:center; align-items:center; width:100px; height:100px; margin-bottom:30px; border-radius:50%; background-color:#999 !important; background-position:center center !important; background-repeat:no-repeat !important; background-size:auto 50px !important}
.processWrap > div span {margin-top:5px; text-align:center}
.processWrap .process01 p:before {background:url("../images/ico_process01.svg")}
.processWrap .process02 p:before {background:url("../images/ico_process02.svg")}
.processWrap .process03 p:before {background:url("../images/ico_process03.svg")}
.processWrap .process04 p:before {background:url("../images/ico_process04.svg")}
.processWrap .process05 p:before {background:url("../images/ico_process05.svg")}
.processWrap .process06 p:before {background:url("../images/ico_process06.svg")}
.processWrap .process07 p:before {background:url("../images/ico_process07.svg")}
.processWrap .process08 p:before {background:url("../images/ico_process08.svg")}



/* 인증표시 연계방안 */
.screenBox {display:flex; align-items:center}
.screenBox li:not(:first-child) {margin-left:30px}
.screenBox li:before {content:none !important}



/* 인증농장 현황 */
.mapWrap {display:flex; justify-content:center; align-items:center; position:relative; width:480px; height:684px; margin:40px auto 60px; background:url("../images/map.svg") no-repeat; background-size:480px auto}
.mapWrap p {position:absolute; font-size:1.7rem; color:#333; font-weight:600}
.mapWrap p em {display:flex; justify-content:center; align-items:center; width:30px; height:30px; border-radius:50%; background:#4050a7; font-size:1.5rem; color:#fff}
.mapWrap .seoul {left:107px; top:140px}
.mapWrap .gyeonggi {left:150px; top:120px}
.mapWrap .incheon {left:75px; top:150px}
.mapWrap .busan {right:107px; bottom:160px}
.mapWrap .daegu {left:290px; top:375px}
.mapWrap .gwangju {left:90px; bottom:160px}
.mapWrap .ulsan {right:95px; bottom:220px}
.mapWrap .daejeon {left:155px; top:310px}
.mapWrap .sejong {left:140px; top:250px}
.mapWrap .gangwon {right:200px; top:90px}
.mapWrap .chungbuk {left:200px; top:210px}
.mapWrap .chungnam {left:90px; top:260px}
.mapWrap .jeonbuk {left:120px; top:375px}
.mapWrap .jeonnam {left:135px; bottom:160px}
.mapWrap .kyeongbuk {right:130px; top:240px}
.mapWrap .kyeongnam {left:230px; bottom:200px}
.mapWrap .jeju {left:105px; bottom:-10px}

.chartWrap {display:flex; margin:40px 0}
.chartWrap > li:first-child {width:850px}
.chartWrap > li:last-child {width:400px; margin-left:60px}
.chartWrap > li div:last-child {margin-top:30px}
.chartWrpa canvas {width:100%}

@media (max-width: 1650px) {
    .chartWrap > li:first-child {width:750px}
    .chartWrap > li:last-child {width:350px}
}