@charset "utf-8";

/***************************************
	커뮤니티 > 안전전세 프로젝트
***************************************/


/* 공통 : 섹션 */
.sectionProject {display:block; font-size:2rem; border-radius:1.5em; padding:2em; background:#fff; box-shadow:var(--shadow-box-shadow); overflow:hidden;}
@media all and (min-width:1025px) {
	.fs4 .sectionProject {font-size:1.8rem;}	
	.fs5 .sectionProject {font-size:1.6rem;}
}
@media all and (max-width:1024px) {
	.sectionProject {font-size:1.5rem;}
}
 

/* 공통 : 타이틀 */
.sectionProject .sectionTitle {display:block; position:relative; margin:-2em -2em 2em; padding:2.5em 2.5em; color:#fff; background:url(../img/project/bak_project_title.jpg) no-repeat 100% 50% / cover; z-index:0; overflow:hidden;}
.sectionProject .sectionTitle em,
.sectionProject .sectionTitle i {display:block; flex-shrink:0; background:url(../img/project/spr_project_text.svg) no-repeat 0 0 / auto 27.5em; text-indent:-999px; overflow:hidden;}
.sectionProject .sectionTitle em {width:19.65em; height:3.15em;}
.sectionProject .sectionTitle strong,
.sectionProject .sectionTitle span:not(.obj) {display:flex; flex-wrap:wrap; align-items:center;}
.sectionProject .sectionTitle strong {margin-top:.75em; gap:.5em 1em; margin-right:22em;}
.sectionProject .sectionTitle strong i {height:3.5em; background-position-y:-7em;}
.sectionProject .sectionTitle span:not(.obj) {margin-top:.5em; gap:.3em .6em;}
.sectionProject .sectionTitle span:not(.obj) i {width:15.65em; height:2.1em; background-position:-21.5em 0;}
.sectionProject .sectionTitle span:not(.obj) i + i {width:15.1em; background-position-x:-37.75em;}

.sectionProject .sectionTitle em[data-txt="경기도3만공인중개사의"] {background-position-y:0;}
.sectionProject .sectionTitle em[data-txt="개업공인중개사대상"] {background-position-y:-3.5em;}

.sectionProject .sectionTitle i[data-txt="경기"] {background-position-x:0; width:7em;}
.sectionProject .sectionTitle i[data-txt="안전전세"] {background-position-x:-8em; width:14.05em;}
.sectionProject .sectionTitle i[data-txt="프로젝트"] {background-position-x:-22.95em; width:14.05em;}
.sectionProject .sectionTitle i[data-txt="사업소개"] {background-position:-38.1em -15em; width:13.7em;}
.sectionProject .sectionTitle i[data-txt="실천과제"] {background-position:-38.1em -19em; width:13.7em;}
.sectionProject .sectionTitle i[data-txt="길목지킴운동"] {background-position-x:-23em; background-position-y:-11em; width:23.05em;}
.sectionProject .sectionTitle i[data-txt="동참"] {background-position:-23.1em -11em; width:7em;}
.sectionProject .sectionTitle i[data-txt="참여절차"] {background-position:-31.15em -11em; width:15em;}
.sectionProject .sectionTitle i[data-txt="담당자"] {background-position:-23.15em -23em; width:10.45em;}
.sectionProject .sectionTitle i[data-txt="현황"] {background-position:-34.65em -23em; width:6.95em;}

.sectionProject .sectionTitle .obj {display:block; position:absolute; width:35.6em; height:16em; z-index:-1; bottom:-1em; right:0;}
.sectionProject .sectionTitle .obj > * {display:block; position:absolute; background:url(../img/project/spr_project_title.png) no-repeat 0 0 / auto 22.5em;}
.sectionProject .sectionTitle .obj .human {width:18.5em; height:13.9em; background-position:0 0; bottom:0; left:1.8em;}
.sectionProject .sectionTitle .obj .house {width:8.75em; height:8.1em; background-position:0 -14em; top:2.6em; right:7.15em;}
.sectionProject .sectionTitle .obj .cloude {width:10.5em; height:8.1em; background-position:-18.5em 0; left:0; top:0;}
.sectionProject .sectionTitle .obj .cloude2 {width:12.8em; height:9.9em; background-position:-29em 0; top:8em; right:0;}

.sectionProject .sectionTitle .obj .house,
.sectionProject .sectionTitle .obj .cloude,
.sectionProject .sectionTitle .obj .cloude2 {-webkit-animation:floating 4s ease-in-out infinite; animation:floating 4s ease-in-out infinite;}
.sectionProject .sectionTitle .obj .house {-webkit-animation-duration:4.5s; animation-duration:4.5s;}
.sectionProject .sectionTitle .obj .cloude {-webkit-animation-delay:-1.5s; animation-delay:-1.5s;}
.sectionProject .sectionTitle .obj .cloude2 {-webkit-animation-duration:5s; animation-duration:5s; -webkit-animation-delay:-3s; animation-delay:-3s;}

@-webkit-keyframes floating {
	0%, 100% {-webkit-transform:translateY(0); transform:translateY(0);}
	50% {-webkit-transform:translateY(20%); transform:translateY(20%);}
}
@keyframes floating {
	0%, 100% {-webkit-transform:translateY(0); transform:translateY(0);}
	50% {-webkit-transform:translateY(20%); transform:translateY(20%);}
}

@media all and (max-width:1460px) {
	.sectionProject .sectionTitle .obj {right:-10em;}
	.sectionProject .sectionTitle strong {margin-right:12em;}
}
@media all and (max-width:1070px) {
	.sectionProject .sectionTitle > * {font-size:.8em;}
}
@media all and (max-width:460px) {
	.sectionProject .sectionTitle {padding-bottom:11em;}
	.sectionProject .sectionTitle .obj {left:50%; right:auto; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
	.sectionProject .sectionTitle strong {margin-right:0;}
	.sectionProject .sectionTitle em {margin-left:auto; margin-right:auto;}
	.sectionProject .sectionTitle strong,
	.sectionProject .sectionTitle span {justify-content:center;}
}

.sectionProject h4 {padding:1em 1.5em; margin:1em 0; font-size:1em; border-radius:1rem; color:#fff; background:var(--point2_color);}
.sectionProject h4 > * {display:inline-block; vertical-align:middle;}
.sectionProject h4 strong {font-size:1.4em; margin-right:1rem;}
.sectionProject h4 span {font-size:1.2em; font-weight:400;}

.sectionProject h5 {font-size:1.5em; padding-left:1.833em; margin-bottom:1rem;}
.sectionProject h5:before {top:.75em; margin-top:-2rem;}
.sectionProject h5 + * {margin-top:0;}

@media all and (max-width:1024px) {
	.sectionProject h5 {padding-left:2.3em;}	
}

.sectionProject i[class*="ico-project-"] {display:inline-block; width:5em; height:5em; border-radius:1.5em; text-indent:-999px; overflow:hidden; background:#EEF5FA no-repeat 50% 50% / contain;}
.sectionProject i.ico-project-01 {background-image:url(../img/project/ico_pro_01.svg);}
.sectionProject i.ico-project-02 {background-image:url(../img/project/ico_pro_02.svg);}
.sectionProject i.ico-project-03 {background-image:url(../img/project/ico_pro_03.svg);}
.sectionProject i.ico-project-04 {background-image:url(../img/project/ico_pro_04.svg);}
.sectionProject i.ico-project-05 {background-image:url(../img/project/ico_pro_05.svg);}
.sectionProject i.ico-project-06 {background-image:url(../img/project/ico_pro_06.svg);}
.sectionProject i.ico-project-07 {background-image:url(../img/project/ico_pro_07.svg);}
.sectionProject i.ico-project-08 {background-image:url(../img/project/ico_pro_08.svg);}
.sectionProject i.ico-project-09 {background-image:url(../img/project/ico_pro_09.svg);}
.sectionProject i.ico-project-10 {background-image:url(../img/project/ico_pro_10.svg);}
.sectionProject i.ico-project-11 {background-image:url(../img/project/ico_pro_11.svg);}

.sectionProject p {font-size:1.3em; letter-spacing:-.02em; word-break:keep-all;}
.sectionProject p em {color:var(--point_color); font-weight:600;}

.sectionProject .tip {line-height:1.5em;}
.sectionProject .tip:before,
.sectionProject .tip:before {top:.8em; transform:translateY(-50%); -webkit-transform:translateY(-50%);}

.sectionProject .list-ul,
.sectionProject .list-ol {font-size:1.3em;}
.sectionProject .list-ol li {padding-left:1.4em;}
.sectionProject .list-ol .num {font-size:.8846em; line-height:1.75;}
.sectionProject .list-ul .tip,
.sectionProject .list-ol .tip {font-size:.769em;}
.sectionProject .list-ol .tip:before,
.sectionProject .list-ol .tip:before {top:.7em;}

/***************************************
	커뮤니티 > 안전전세 프로젝트 > 사업소개
***************************************/

/* 사업 개요 */

.con-overview ul {display:flex; margin-top:1em; gap:1em;}
.con-overview ul li {display:block; position:relative; width:40%; flex-grow:1; border-radius:1em; border:1px solid #DCE5EA; padding:1em 2em 1em 8.5em;}
.con-overview ul li i[class*="ico-project-"] {display:block; position:absolute; top:50%; margin-top:-2.5em; left:2em; margin-right:1.5em;}
.con-overview ul em {display:inline-block; border-radius:9em; font-size:1.2em; padding:0 .83em; height:2em; line-height:2em; background:var(--point_color); color:#fff; margin-bottom:.5em;}
.con-overview ul strong {display:block; font-size:1.3em; word-break:keep-all; color:var(--point_color); font-weight:700; margin-bottom:.2em;}
.con-overview ul span {display:block; font-size:1.3em; line-height:1.5; word-break:keep-all;}

@media all and (max-width:740px) {
	.con-overview ul {flex-wrap:wrap;}
	.con-overview ul li {width:60%;}	
}
@media all and (max-width:480px) {
	.con-overview ul li {padding-left:2em;}
	.con-overview ul li i[class*="ico-project-"] {display:none;}
}

/* 사회적 운동 */

.con-socialMovement {display:block; position:relative; border-radius:1em; border:1px solid #DCE5EA; padding:1.5em;}
.con-socialMovement p {margin-bottom:.76em;}
.con-socialMovement h5 {font-size:1.5em; color:var(--point_color); padding-left:0;}
.con-socialMovement h5:before {display:none;}
.con-socialMovement dl {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; border-radius:1.5em; background:#EEF5FA; padding:1.5em 2em; gap:1.5em;}
.con-socialMovement dt {display:block; width:19em; flex-shrink:0; position:relative;}
.con-socialMovement dt strong {display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:18.5em; text-indent:-999px; overflow:hidden; background:url(../img/project/img_mark.png) no-repeat 50% 50% / contain;}
.con-socialMovement dt:before,
.con-socialMovement dt strong:before {content:""; display:block; position:relative; padding-top:100%;}
.con-socialMovement dd {display:flex; width:calc(100% - 21em); min-width:30em; flex-grow:1; flex-wrap:wrap; gap:1.5em;}
.con-socialMovement dd > div {display:flex; position:relative; width:18%; min-width:12em; flex-grow:1; flex-direction:column; padding:6.8em .9em 1.25em; background:#fff; border-radius:1.5em; border:2px solid #0077B3; justify-content:center; text-align:center;}
.con-socialMovement dd > div i {position:absolute; left:50%; top:1.25em; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.con-socialMovement dd > div span {display:block; word-break:keep-all; font-size:1.2em;}

@media all and (max-width:1024px) {
	.con-socialMovement dt {max-width:100%;}
	.con-socialMovement dt strong {width:auto; top:-2em; left:-2em; right:-2em; transform:none; -webkit-transform:none;}
	.con-socialMovement dd {width:auto; min-width:0;}
}

/* 관리 시스템 */

.con-manageSystem {display:flex; position:relative; gap:1.5em;}
.con-manageSystem * ~ h5 {margin-top:.667em;}
.con-manageSystem > * {display:flex; flex-direction:column; width:40.7%;}
.con-manageSystem > * + * {flex-grow:1;}
.con-manageSystem dl {border-radius:1em; border:1px solid #DCE5EA; padding:1.5em 2em;}
.con-manageSystem dl + dl {margin-top:1em;}
.con-manageSystem dt {font-size:1.5em; font-weight:700; color:var(--point_color); margin-bottom:.5rem;}

.con-manageSystem .box-orgChart {border-radius:1em; border:1px solid #DCE5EA; padding:2.2em 2em;}
.con-manageSystem .box-orgChart ul {display:block; position:relative; width:36.3em; margin:0 auto; max-width:100%; background:url(../img/project/img_oriz.png) no-repeat 50% 50% / contain;}
.con-manageSystem .box-orgChart ul:before {content:""; display:block; padding-top:calc(416 / 726 * 100%);}
.con-manageSystem .box-orgChart ul > * {position:absolute; top:0; left:0; text-indent:-999px; overflow:hidden; opacity:0;}

.con-manageSystem .box-flowChart {display:flex; align-items:center; border-radius:1em; background:#EEF5FA; padding:1em; min-height:30.5em;}
.con-manageSystem .box-flowChart ol {display:flex; flex-wrap:wrap; justify-content:center; gap:1em 1.5em;}
.con-manageSystem .box-flowChart ol > li {display:flex; flex-direction:column; align-items:center; justify-content:center; }
.con-manageSystem .box-flowChart ol > li:not(.arr) {width:12.2em; background:#fff; border-radius:.5em; padding:1em; border:2px solid #fff;}
.con-manageSystem .box-flowChart ol > li.arr {width:1.7em;}
.con-manageSystem .box-flowChart ol > li.arr:before {content:""; display:block; width:100%; padding-top:100%; border-radius:100%; background:#9FAEBD url(../img/project/ico_progress_arr.svg) no-repeat 50% 50% / contain;}
.con-manageSystem .box-flowChart ol > li.arr.on:before {background-color:var(--point2_color);}
.con-manageSystem .box-flowChart ol > li.on {border-color:var(--point2_color);}
.con-manageSystem .box-flowChart ol strong {display:block; font-size:1.4em; color:#333; font-weight:700;}
.con-manageSystem .box-flowChart ol span {display:block; font-size:1.3em; color:#333;}
.con-manageSystem .box-flowChart ol i {display:block; width:2em; height:2em; border-radius:.75em; background:rgba(0, 119, 179, 0.1) no-repeat 50% 50% / contain; margin-bottom:.5em;}
.con-manageSystem .box-flowChart ol i.ico-pro-01 {background-image:url(../img/project/ico_p_01.svg);}
.con-manageSystem .box-flowChart ol i.ico-pro-02 {background-image:url(../img/project/ico_p_02.svg);}
.con-manageSystem .box-flowChart ol i.ico-pro-03 {background-image:url(../img/project/ico_p_03.svg);}
.con-manageSystem .box-flowChart ol i.ico-pro-04 {background-image:url(../img/project/ico_p_04.svg);}
.con-manageSystem .box-flowChart ol i.ico-pro-05 {background-image:url(../img/project/ico_p_05.svg);}

@media all and (max-width:1230px) {
	.con-manageSystem {display:block;}
	.con-manageSystem > * {width:auto;}
	.con-manageSystem > * + * {margin-top:1em;}
}


/***************************************
	커뮤니티 > 안전전세 프로젝트 > 실천과제
***************************************/

.con-practiceTask {display:flex; flex-wrap:wrap; gap:1.5em;}
.con-practiceTask > dl {display:flex; flex-direction:column; width:40%; flex-grow:1; border-radius:1em; border:1px solid #C9D6DD; overflow:hidden;}
.con-practiceTask > dl > * {position:relative; padding:1.25em 1.5em;}
.con-practiceTask > dl dt {flex-shrink:0;}
.con-practiceTask > dl dt button {display:none;}
.con-practiceTask > dl dt strong {display:block; position:relative; padding-left:calc((35 / 26) * 1em); font-size:1.3em; font-weight:700; color:var(--point2_color); word-break:keep-all;}
.con-practiceTask > dl dt strong .num {display:block; position:absolute; left:0; top:calc((6 / 16) * 1em); font-size:calc((16 / 26) * 1em); width:calc((24 / 16) * 1em); height:calc((24 / 16) * 1em); border-radius:100%; line-height:calc((24 / 16) * 1em); color:#fff; background:var(--point2_color); text-align:center; margin-right:.2em;}
.con-practiceTask > dl dd {flex-grow:1; background:#F7F9FB; border-top:1px solid #C9D6DD;}
.con-practiceTask > dl dd .tip {font-size:1em;}
.con-practiceTask > dl dd li {word-break:keep-all;}

.con-practiceTask .check {display:block; position:relative; font-size:1.3em; border-radius:calc((10 / 26) * 1em); border:1px solid var(--warn_line); background:var(--warn_bak); padding:calc((15 / 26) * 1em) calc((20 / 26) * 1em) calc((15 / 26) * 1em) calc((52 / 26) * 1em); color:#222;}
.con-practiceTask .check:before {content:""; display:block; position:absolute; font-size:calc((20 / 26) * 1em); width:1.1em; height:1.1em; background:url(../img/project/bul_check.svg) no-repeat 50% 50% / contain; left:1em; top:1.175em;}
.con-practiceTask .check ~ * {margin-top:.7rem;}

@media all and (max-width:1024px) {
	.con-practiceTask {display:block;}
	.con-practiceTask dl {display:block; width:auto;}
	.con-practiceTask dl + dl {margin-top:1.5em;}
	.con-practiceTask dl dd {display:none;}
	.con-practiceTask dl dt {padding-right:4.5em;}
	.con-practiceTask dl dt button {display:block; position:absolute; z-index:1; top:0; left:0; right:0; bottom:0; width:100%; height:100%; text-indent:-999px; overflow:hidden; transform:none !important; -webkit-transform:none !important;}
	.con-practiceTask dl dt button:after {content:""; display:block; position:absolute; width:1.2em; height:1.2em; right:2em; top:50%; margin-top:-.6em; background:url(../img/project/btn_down.svg) no-repeat 50% 50% / contain; transition:.3s all; -webkit-transition:.3s all;}
	.con-practiceTask dl.open dd {display:block;}
	.con-practiceTask dl.open dt button:after {transform:rotate(180deg); -webkit-transform:rotate(180deg);}	
}


/***************************************
	커뮤니티 > 안전전세 프로젝트 > 동참 참여 절차
***************************************/

.con-joinStep {display:flex; flex-wrap:wrap; gap:1em;}
.con-joinStep > * {display:block; flex-grow:1; width:100%;}
.con-joinStep > * > h4:first-child {margin-top:0;}

@media all and (min-width:1401px) {
	.con-joinStep > * {width:40%;}
	.con-joinStep > *.step1 {width:45%;}
	.con-joinStep > *.step2 {width:50%;}
	.con-joinStep > *.full {width:100%;}	
}

.con-preEdu ul {display:flex; margin-top:1em; gap:1em;}
.con-preEdu li {display:flex; flex-direction:column; width:40%; flex-grow:1; align-items:center; justify-content:center; border:1px solid #DCE5EA; border-radius:1em; padding:1em; text-align:center;}
.con-preEdu li strong {display:block; text-align:center; word-break:keep-all; font-size:1.2em; color:var(--point_color); font-weight:700; line-height:1.3em; margin:calc((20 / 24) * 1em) 0;}

@media all and (max-width:430px) {
	.con-preEdu ul {flex-direction:column;}
	.con-preEdu li {width:100%;}
	.con-preEdu .btn {width:100%;}
}

.con-joinApply dl {display:block; position:relative; border:1px solid #DCE5EA; border-radius:1em; padding:1em 1.5em;}
.con-joinApply dl + dl {margin-top:1em;}
.con-joinApply dt {font-size:1.5em; color:var(--point_color); font-weight:700; margin-bottom:.5em;}
.con-joinApply dd {display:flex; flex-wrap:Wrap; position:relative; color:#333; gap:.5em 0; justify-content:space-between;}
.con-joinApply dd > div {display:block; margin-right:1em;}
.con-joinApply dd strong {display:block; font-size:1.2em; font-weight:700; line-height:1.3; word-break:keep-all;}
.con-joinApply dd span {display:block; line-height:1.5; word-break:keep-all;}
.con-joinApply dd .btn {flex-shrink:0;}

@media all and (max-width:640px) {
	.con-joinApply dl .btn {width:100%;}
}

.con-markGuide {display:flex; gap:1em;}
.con-markGuide ul {display:flex; width:45%; flex-grow:1; gap:1em;}
.con-markGuide ul + ul {width:50%; flex-direction:column;}
.con-markGuide li {border:1px solid #DCE5EA; border-radius:1em; padding:1em 1.5em; flex-grow:1;}

@media all and (max-width:890px) {
	.con-markGuide {flex-direction:column;}
	.con-markGuide ul {width:100% !important;}
}

.con-markGuide .mark li {display:flex; flex-direction:column; align-items:center; justify-content:center; width:40%; padding:1em;}
.con-markGuide .mark *[class*="img-"] {display:block; margin:0 auto .75em; background:no-repeat 50% 50% / contain;}
.con-markGuide .mark .img-markIssue {width:7.1em; height:7.05em; background-image:url(../img/project/img_mark_small.png);}
.con-markGuide .mark .img-markAttach {width:8.4em; height:7.05em; background-image:url(../img/project/img_mark_attach.png);;}
.con-markGuide .mark strong {display:block; text-align:center; font-size:1.5em; color:var(--point_color); word-break:keep-all;}
.con-markGuide .mark span {display:block; text-align:center; font-size:1.2em; color:#333; margin-top:calc((20 / 24) * 1em); word-break:keep-all;}

@media all and (max-width:390px) {
	.con-markGuide .mark *[class*="img-"] {font-size:.8em;}	
}

.con-markGuide .file li {display:flex; align-items:center; justify-content:space-between; gap:.5em 1em;}
.con-markGuide .file .btn {flex-shrink:0;}
.con-markGuide .file strong {display:block; word-break:keep-all; flex-grow:1; font-size:1.5em; color:var(--point_color);}

@media all and (max-width:470px) {
	.con-markGuide .file li {flex-wrap:wrap;}
	.con-markGuide .file strong {width:100%; text-align:center;}
	.con-markGuide .file .btn {width:100%;}
}

.con-practiceManual ul {display:flex; flex-wrap:wrap; gap:1.25em 1em;}
.con-practiceManual li {display:block; position:relative; border-radius:.5em; padding:1.85em 2em 7.5em; width:calc((100% - 2em) / 3); background:#E6F2F8; border:1px solid #DCE5EA; --manual_main_color:#0077B3; --manual_sub_color:#A6CFE4;}
.con-practiceManual li.green {background:#e9f9f2; border-color:rgba(28,188,118,.3); --manual_main_color:#118352; --manual_sub_color:#95CCB4;}
.con-practiceManual li:before {content:attr(data-step); display:block; position:absolute; top:0; right:0; font-size:1.2em; width:calc((80 / 24) * 1em); height:calc((80 / 24) * 1em); line-height:calc((80 / 24) * 1em); text-align:center; color:var(--manual_sub_color); font-weight:800;}
.con-practiceManual li:after {content:""; display:block; position:absolute; width:5em; height:5em; right:1.25em; bottom:.85em; background:no-repeat 50% 50% / contain;}
.con-practiceManual li[data-step="1"]:after {background-image:url(../img/project/ico_manual_01.svg);}
.con-practiceManual li[data-step="2"]:after {background-image:url(../img/project/ico_manual_02.svg);}
.con-practiceManual li[data-step="3"]:after {background-image:url(../img/project/ico_manual_03.svg);}
.con-practiceManual li[data-step="4"]:after {background-image:url(../img/project/ico_manual_04.svg);}
.con-practiceManual li[data-step="5"]:after {background-image:url(../img/project/ico_manual_05.svg);}
.con-practiceManual li[data-step="6"]:after {background-image:url(../img/project/ico_manual_06.svg);}
.con-practiceManual li[data-step="7"]:after {background-image:url(../img/project/ico_manual_07.svg);}
.con-practiceManual li[data-step="8"]:after {background-image:url(../img/project/ico_manual_08.svg);}
.con-practiceManual li[data-step="9"]:after {background-image:url(../img/project/ico_manual_09.svg);}
.con-practiceManual li[data-step="10"]:after {background-image:url(../img/project/ico_manual_10.svg);}
.con-practiceManual li strong {display:block; font-size:1.5em; color:var(--manual_main_color); line-height:1.3m; margin-bottom:calc((20 / 30) * 1em); word-break:keep-all;}
.con-practiceManual li p {font-size:1.2em;}
.con-practiceManual li p > * {display:block; font-weight:500; line-height:1.3; word-break:keep-all;}
.con-practiceManual li p strong {color:#333; font-size:1em; margin:0;}
.con-practiceManual li p span {color:#555; font-weight:400;}
.con-practiceManual li em {display:flex; position:absolute; bottom:calc((20 / 25) * 1em); left:calc((40 / 25) * 1em); align-items:center; justify-content:center; font-size:1.25em; color:#fff; background:var(--manual_main_color); border-radius:100%; width:calc((100 / 25) * 1em); height:calc((100 / 25) * 1em); word-break:keep-all; font-weight:800; text-align:center; line-height:1.3;}
.con-practiceManual li [class*="img-"] {display:block; position:absolute; left:2em; bottom:1em; background:no-repeat 50% 50% / contain;}
.con-practiceManual li .img-qrIrts {width:5em; height:5em; background-image:url(../img/project/img_manual_07.png);}
.con-practiceManual li[data-step="8"] {padding-bottom:9.5em;}
.con-practiceManual li .img-character {width:7.55em; height:7.85em; background-image:url(../img/project/img_manual_08.png);}
.con-practiceManual li.last {display:flex; align-items:center; padding:1.85em 2em; justify-content:space-between; width:50%; flex-grow:1; gap:1em;}
.con-practiceManual li.last p {margin-bottom:calc((20 / 24) * 1em);}
.con-practiceManual li.last .img-qrGseek {position:relative; left:auto; bottom:auto; width:12.5em; height:12.5em; background-image:url(../img/project/img_manual_11.png);}
.con-practiceManual li.last .link-estate {display:inline-flex; position:relative; align-items:center; min-height:3.1em; padding:0 5em 0 1.2em; border:2px solid #0077B3; border-radius:.65em; background:#fff; color:#12304A; font-size:1.2em; font-weight:700; line-height:1.3; overflow:hidden;}
.con-practiceManual li.last .link-estate:after {content:""; display:block; position:absolute; top:0; right:0; width:3.1em; height:100%; background:#0077B3 url(/_guide/img/button/white/search.svg) no-repeat 50% 50% / 1.2em auto;}

@media all and (max-width:1200px) {
	.con-practiceManual li {width:calc((100% - 1em) / 2);}
	.con-practiceManual li.last {width:100%;}
}
@media all and (max-width:540px) {
	.con-practiceManual li {width:100%; padding-top:3em !important;}
	.con-practiceManual li br {display:none !important;}
}
@media all and (max-width:500px) {
	.con-practiceManual li.last {flex-direction:column; text-align:center;}
	.con-practiceManual li.last .img-qrGseek {font-size:.8em;}	
}


/***************************************
	커뮤니티 > 안전전세 프로젝트 > 담당자 현황
***************************************/

.con-contactList .tbl th,
.con-contactList .tbl td {height:2.27em; padding:.55em; font-size:1.1em;}

@media all and (min-width:1401px) {
	.con-contactList {display:flex;}
	.con-contactList > * {width:50%; flex-grow:1;}
	.con-contactList > * + * .tbl th {border-left-width:0px !important;}	 
}
@media all and (max-width:1400px) {
	.con-contactList > * + * .tbl thead {display:none;}
}