/* 컨텐츠 CSS */
.contents {font-size:1rem; line-height:150%; width:100%;}

.contents  h1 {font-size:1.4rem; font-weight:600; margin-top:2rem; margin-bottom:0.5rem;}
.contents  h1:first-child {margin-top:0;}

.contents  h2 {font-size:1.3rem; font-weight:600; margin-top:2rem; margin-bottom:0.5rem;}
.contents  h2:first-child {margin-top:0;}

.contents  h3 {font-size:1.2rem; font-weight:600; margin-top:2rem; margin-bottom:0.5rem;}
.contents  h3:first-child {margin-top:0;}

.contents  h4 {font-size:1.1rem; font-weight:600; margin-top:2rem; margin-bottom:0.5rem;}
.contents  h4:first-child {margin-top:0;}

p.indent0 {text-indent: -1em; margin-left:1em;}
p.indent1 {text-indent: -1.25em; margin-left:1.25em;}
p.indent2 {text-indent: -1em; margin-left:2.25em;}

p.bul {padding-left:1em; position:relative; margin-top:0.5rem; margin-bottom:0.5rem; line-height:130%;}
p.bul:before {content:''; position:absolute; left: 0.2em; top: 0.6em; width: 0.3em; height: 0.3em; border-radius: 100%; background-color: #ef8203; }

p.bul2 {padding-left:1.3em; position:relative; line-height:150%;}
p.bul2:before {content:'\f138'; position:absolute; left: 0; top: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:1em; color:#ef8203; }

p.asterisk {padding-left:1em; position:relative; margin-top:0.5rem; margin-bottom:0.5rem; line-height:130%;}
p.asterisk:before {content:'※'; position:absolute; left: 0; top: 0; }

p.lline {padding-left:0.8em; position:relative;}
p.lline:before {content:'-'; position:absolute; left: 0; top: 0em; }

p.lline-in {padding-left:2em; position:relative;}
p.lline-in:before {content:'-'; position:absolute; margin-left: -0.8em; top: 0em; }

ul.bul > li {padding-left:1em; position:relative; text-align:left;}
ul.bul > li:before {content:''; position:absolute; left: 0.2em; top: 0.6em; width: 0.3em; height: 0.3em; border-radius: 100%; background-color: #ef8203; }

ul.bul2 > li {padding-left:1.3em; position:relative; line-height:150%;}
ul.bul2 > li:before {content:'\f138'; position:absolute; left: 0; top: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:1em; color:#ef8203; }

ul.lline > li {padding-left:0.8em; position:relative; text-align:left;}
ul.lline > li:before {content:'-'; position:absolute; left: 0; top: 0em; }


/* 절차박스 공통 */
.stepBox { display: flex; flex-wrap: wrap;  gap: 1rem; margin-top:1.5rem; padding: 0;}
.stepBox.nomargin {margin-top:1rem;}
.stepBox > li {  flex: 1 1 calc((100% / 4) - 1rem); background:linear-gradient(180deg, #fff 20%,#eee 80%);  padding: 1.5rem 1rem 1rem 1rem; box-sizing: border-box; position:relative; border-radius:0.5rem;  vertical-align: middle; text-align:center;  border:1px solid #ddd; margin-top:1rem; }
//.stepBox > li {  flex: 1 1 calc((100% / 4) - 1rem); background:#eee;  padding: 1.5rem 1rem 1rem 1rem; box-sizing: border-box; position:relative; border-radius:0.5rem;  vertical-align: middle; text-align:center;  border:1px solid #ddd; margin-top:1rem; }
.stepBox.nomargin > li {margin-top:0rem;}
.stepBox > li > span { left:50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position:absolute; top:-1rem; display:inline-block; font-size:1rem; color:#fff; text-align:center; background:#ef8203; border-radius:0.5rem; padding:1px 10px; border:3px solid #fff; }
.stepBox > li > i { font-size:2rem; background:#fff; border-radius:100%; text-align:center; width:6rem; height:6rem; line-height:6rem; color:#cc6633;  border:1px solid #ddd;}
.stepBox > li > strong { width:100%; font-size:1.2rem; margin-top:1rem;  font-weight:600;  color:#cc6633; display:inline-block;}
.stepBox > li > strong:after {content:''; border-bottom:2px dotted #ddd; display:inline-block; width:100%; margin-top:0.5rem;}
.stepBox > li > div { width:100%; font-size:1rem;  padding-top:0.5rem;}
.stepBox > li > div > p {text-align:left; padding-left:0.8em; position:relative;}
.stepBox > li > div > p:before {content:''; position:absolute; left: 0.2em; top: 0.6em; width: 0.3em; height: 0.3em; border-radius: 100%; background-color: #ef8203; }
.stepBox > li:hover i { animation:flipx 1s 1; }


/* 온라인상담 */
.consult > .stepBox > li { flex: 1 1 calc((100% / 3) - 1rem);}
.consult > .stepBox > li div span {color:#ef8203;}
.consult > .stepBox > li .image {border-radius:0.5rem; padding:0.5rem; background:#e2e2e2; margin-top:0.5rem;}
.consult > .stepBox > li img {max-height:130px; max-width:100%;}


/* 후원안내 */
.support > .stepBox > li {flex: 1 1 calc((100% / 3) - 1rem);}


/* 인사말 */
.greet {width:100%; font-size:1rem; line-height:150%;}
.greet > .greetbox {width:100%; text-align:center; padding:2rem 0; margin-bottom:2rem; border-bottom:2px dotted #ddd;}

.greet > .greetbox > .greetimg {margin-bottom:2rem;}
.greet > .greetbox > p {font-weight:700; font-size:2em; font-family: "OTEnjoystoriesBA"; color:#ef8203; position:relative; display:inline; }
.greet  p {font-size:1.2rem; font-weight:700;}
.greet  strong {font-weight:700; font-size:2rem; font-family: "OTEnjoystoriesBA";  color:#ef8203;}
.greet  span {font-weight:700;}

.greet .box {position:relative; display:flex; flex-wrap:no-wrap;gap:4%;}
.greet .box .box1 { width:25%; position:relative; flex: 1 1 25%; }
.greet .box .box1 div {width:100%; height:100%; display:inline-block; border:1px solid #ddd; border-radius:1rem; background-image:url(/images/contents/greet_img02.jpg); background-size: cover;  padding:2rem; text-align:center; }
.greet .box .box1 div p {color:#fff; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); vertical-align: middle;display: table-cell;}
.greet .box .box2 {width:70%; position:relative;flex: 1 1 72%;}
.greet .box3 {width:100%; height:10rem; display:inline-block; background-image:url('/images/contents/greet_img11.jpg'); background-position:bottom center; background-size: cover;   border-radius:0.5rem; display:none;}


/* 기관현황 */
.info {width:100%; font-size:1rem; line-height:150%;}

.infobox {border-radius:0.5rem; position:relative; display:inline-block;  background-color:#F5F5F5; width:100%; padding:1rem;}
.infobox > .group {position:relative; font-size:1.2rem; width:1000px; margin-left:auto; margin-right:auto; max-width:100%;}

.infobox > .group > .photo {display:flex; position:absolute; left:0; top:0; width:28%; height:100%; border-radius: 0.5rem; text-align: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;  background:; padding:2rem;}
.infobox > .group > .photo img {max-width:100%;}
.infobox > .group > .cont {margin-left: 30%; padding:1rem 0; display:block;}

.info .cont p {width:100%; display:inline-block; position:relative; line-height:180%;}
.info .cont.bul p {padding-left:1.2rem; }
.info .cont.bul p:before {content:''; position:absolute; left: 0.4rem; top: 0.75rem; width: 0.4rem; height: 0.4rem; border-radius: 100%; background-color: #ef8203; }
.info .cont p span {font-weight:600;}

.info > .contents {margin:2rem 0;}
.infovision {position: relative; width:100%; margin-top:3rem;}
.infovision > .item {margin-bottom:1rem; border-radius:0.5rem; border:1px solid #ddd; position:relative;}
.infovision > .item > .group {margin:1rem; position:relative;}
.infovision > .item > .group > .subject {display:flex; position:absolute; left:0; top:0; width:20%; height:100%;  line-height:130%; border-radius: 0.5rem; font-size: 1.1rem; font-weight: 500; color: #fff; text-align: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;  background:linear-gradient(180deg, #FAA61B 0%, #F36A22 100%);}
.infovision > .item > .group > .cont {  display:block;  margin-left:22%;  padding:1rem 0; }
.infovision > .item > .group > .cont > .moto {color:#ef8203; font-size:2rem; font-family: "OTEnjoystoriesBA";}


/* 조직현황 */
.organize {width:100%; font-size:1rem;}

.organize .group {position:relative; width:100%; max-width:1000px; margin-left:auto; margin-right:auto;  margin-bottom:1.5rem;}
.organize p {border: 1px solid #ddd; padding:1rem 0; text-align: center; color:#555; background:#F5F5F5; border-radius:0.3rem; line-height:100%;}

.organize .rank01 {position:relative; height:calc(3rem + 2px); width:100%;text-align:center;}
.organize .rank01 .box1{width:250px; top:0;position:absolute;left:50%; text-align:left; transform:translateX(-50%); }
.organize  .box1 p {border: 1px solid #ddd;  text-align: center; background:#ef8203; color:#fff; min-height:3rem;}
.organize .rank01:before{content:'';position:absolute;display:block;width:1px;left:calc(50% - 1px); top:calc(3rem + 2px); height:calc(6rem + 114px);background:#ddd;}

.organize .rank03{position:relative;margin-top:40px; height:calc(3rem + 2px);}
.organize .rank03:before{content:'';position:absolute;display:block;width:50%;left:25%;top:50%;height:1px;background:#ddd;}
.organize .rank03 .box1{width:50%;top:0;position:absolute;text-align:left;}
.organize .rank03 .box2{width:50%;top:0;position:absolute;text-align:right; right:0;}
.organize .rank03 p {display:inline-block;width:50%; background:#5a5655; color:#fff;  min-height:50px;}

.organize .rank04{position:relative;height:calc(3rem + 2px);margin-top:40px;}

.organize .rank04 .box2{width:250px;top:0;position:absolute;left:50%; text-align:left; transform:translateX(-50%);}

.organize .rank04 p {display:inline-block; min-height:50px; width:100%;  background:#46a9be; color:#fff;}

.organize .rank05{position:relative;margin-top:60px; display:inline-block; width:100%;}
.organize .rank05:before{content:'';position:absolute;display:block;width:calc(100% - 142px);top:-30px;height:1px;background:#ddd; left:50%; transform:translateX(-50%);}

.organize .rank05 .box{width:calc((100% - 70px) / 7); text-align:left; float:left; margin:0 5px; }
.organize .rank05 p {display:inline-block;width:100%; position:relative;  line-height:1.5rem; min-height:6.5rem;   display: grid; align-items: center;}
.organize .rank05 p:after{content:'';position:absolute;display:block;width:1px;left:50%; top:-30px;height:30px;background:#ddd;}
.organize .rank05 div:first-child p:before {content:'';position:absolute;display:block;width:120px;top:-31px;height:1px;background:#ddd; left:50%;}
.organize .rank05 div:last-child p:before {content:'';position:absolute;display:block;width:120px;top:-31px;height:1px;background:#ddd; right:calc(50% - 1px);}


/* 연혁 */
.history {position:relative; padding-left:15rem;}
.history .heading {position:absolute;left:0;top:0;width:15rem; font-weight:600; font-size:2rem; letter-spacing: -2px; line-height: 120%; text-align:center;}
.history .heading .color{ color:#ef8203; }

.history .list {position:relative;padding-left:2rem;overflow:hidden;  margin-left:2rem;}
.history .list:before {content:'';display:block;position:absolute;left:0.5rem;top:0.5rem;width:1px;height:100%;background-color:#e7e7e7;}

.history .list li {position:relative; }
.history .list > li > strong {position:relative;display:block;margin:0 0 10px;font-size:1.6em;font-weight:600; color:#ef8203;}
.history .list > li > strong:before {content:''; position:absolute; margin-left:-2rem; top:0.45rem; width:1rem; height:1rem; background:#fff; border:4px solid #ef8203; border-radius:100%;}
.history .list > li > strong span {position:absolute;text-indent:-9999px;}
.history .list > li + li {padding:2rem 0 0;}
.history .list > li ul li {padding-left:6.5rem; margin-top:0.7rem; line-height:130%;}
.history .list > li ul li div { font-weight:600; margin-left:-6.5rem; position:absolute;}


/* 전국현황 */
.pure {width:100%; font-size:1em;}
.pure > .tablebox > .tableline td.text-left {text-align:left;}
.pure > .tablebox > .tableline > tbody > tr >  td > a > i {color:#ef8203;}
.pure > .tablebox > .tableline > tbody > tr.cb >  td {background:#f5d0a6; font-weight:600;}


/* 찾아오시는길 */
.map { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 1rem; border: 1px solid #DEDEDE; border-top: 0 none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; word-break: keep-all; width:100%; }
.map ul { width: 100%; }
.map ul li { display: inline; margin-right:2rem; }
.map ul li:first-child { display: block; margin: 0 0 0.5rem; }
.map ul strong { color: #3E3E3E; }
.map ul strong::before { display: inline-block; overflow: hidden; width: 2rem; height: 2rem; text-align: center; line-height: 2rem; vertical-align: middle; display: inline-block; margin-right: 0.5rem; border-radius: 100%; background-color: #EBEBEB; font-family: "Font Awesome 5 Free"; vertical-align: middle; }
.map ul strong.icon1::before { content: "\f279"; }
.map ul strong.icon2::before { font-weight:900; content: "\f095"; }
.map ul strong.icon3::before { font-weight:900; content: "\f1ac"; }
.map ul span { display: inline-block;  position: relative;  vertical-align: middle;  padding-left:1rem; line-height:150%;}
.map ul span::before { content:""; left:0.4rem; top:0.2rem; width:1px; height:1rem; background:#ddd; position:absolute; }
.map ul li:hover strong::before {animation:wind 1s 1;}

.travel {width:100%; position:relative;}
.travel > .item {width:calc(100% - 1rem); position:relative; margin-top:2rem; margin-left:1rem; border-top:1px dotted #ddd; padding-top:1rem;}
.travel > .item:first-child {border-top:0; padding-top:0;}
.travel > .item > .photo {font-size:2rem; position:absolute; width:6rem; text-align:center; margin-top:0.5rem;}
.travel > .item > .photo > i {border:2px dotted #ddd; padding:1rem; border-radius:100%;}
.travel > .item > .cont {margin-left:8rem; display:block; line-height:180%;}
.travel > .item > .cont > p {font-size:1.2rem; font-weight:600;}
.travel > .item:hover .photo {animation:wind 1s 1;}


/* 정의 */
.abuseimg {width:100%; display:inline-block; background:url('/images/contents/abuse_img01.jpg');background-size: cover; background-position: center; height:15rem; margin-top:1.5rem; border-radius:0.5rem;}


/* 유형 */
.pattern {padding-top:2rem; position:relative;}

.pattern_box {display:flex; position:relative; width:100%; padding:2rem 2rem 2rem 2.5rem;  border-radius:0.5rem; background-color:#F5F5F5; word-break:break-all; font-size:1.2rem;}
.pattern_box > i { text-align:center; font-size:1.5rem; color:#ef8203;}
.pattern_box > .cont {margin-left:1.5rem; }

.pattern_group {display:inline-block; position:relative; width:100%;}
.pattern_group > .item {position:relative; margin:1.5rem 0 1rem 0; border-radius:0.5rem; border:1px solid #ddd; display:inline-block; width:100%; padding:1.5rem;}
.pattern_group > .item > span { left:-1px; position:absolute; top:-1em; display:inline-block; font-size:1em; color:#fff; text-align:center; background:#ef8203; border-radius:0px 20px 20px 0px; padding:5px 30px;}
.pattern_group > .item > .img {float:left; width:15rem; margin-right:2rem; text-align:center;}
.pattern_group > .item > .img > img {max-width:100%;}
.pattern_group > .item > .text {float:left; width:calc(100% - 17rem);}
.pattern_group > .item > .text > .head {font-weight:600; margin-bottom:0.5rem; margin-top:1.5rem; border-bottom:2px dotted #ddd; padding:0 0 0.5rem 0;}
.pattern_group > .item > .text > .head:first-child {margin-top:0;}


/* 신고방법 */
.methodLayer { display:flex; flex-wrap:wrap; gap:2rem; margin-top:2rem; }
.methodLayer > li { flex: 1 1 calc((100% / 2) - 2rem); border:1px solid #ddd; position:relative; border-radius:0.5rem; overflow:hidden;}
.methodLayer > li > div { padding:0.7rem 1rem; position:relative; }
.methodLayer > li > .subject { background:#ef8203; color:#fff; text-align:center; }
.methodLayer > li > .cont { text-align:left; position:relative; display:inline-block;}
.methodLayer > li > .cont2 { text-align:center;  position:relative; display:inline-block; width:100%; padding:1.5rem 1rem;}

.methodLayer .cont2 > .head {padding:1rem 2rem; background:#fbe9ca; margin:1rem auto; display:inline-block; position:relative; border-radius:0.5rem;-webkit-box-shadow:2px 2px 3px 0px rgba(0, 0, 0, 0.3); box-shadow:2px 2px 3px 0px rgba(0, 0, 0, 0.3);}
.methodLayer .cont2 > .head:before {content:''; width:0.5rem; height:0.5rem; top:0.5rem; left:0.5rem; position:absolute; background:#ea9b3f;  border-radius:100%;}
.methodLayer .cont2 > .head:after {content:''; width:0.5rem; height:0.5rem; top:0.5rem; right:0.5rem; position:absolute; background:#ea9b3f;  border-radius:100%;}
.methodLayer .cont2 > .head i:before {content:''; width:0.5rem; height:0.5rem; bottom:0.5rem; left:0.5rem; position:absolute; background:#ea9b3f;  border-radius:100%;}
.methodLayer .cont2 > .head i:after {content:''; width:0.5rem; height:0.5rem; bottom:0.5rem; right:0.5rem; position:absolute; background:#ea9b3f;  border-radius:100%;}

.methodLayer .cont2 > .head > span {font-size:1.2rem; font-weight:600;}
.methodLayer .cont2 > .head > p {margin-top:0.5rem; color:#ef8203;}
.methodLayer .cont2 > .head > p > strong {font-size:2rem; font-weight:600;}
.methodLayer .cont2 > span {padding:2rem; margin-left:auto; margin-right:auto;}
.methodLayer .cont2 > ul {position:relative; display:inline-block; width:100%; margin:1rem auto;}
.methodLayer .cont2 > ul > li {float:left; }
.methodLayer .cont2 > ul > li:first-child {width:25%;}
.methodLayer .cont2 > ul > li:nth-child(2) {width:40%;}
.methodLayer .cont2 > ul > li:last-child {width:35%;}
.methodLayer .cont2 > ul > li > p {padding-left:1.3em; position:relative; text-align:left;}
.methodLayer .cont2 > ul > li > p:before {content: "\f0fe";  position:absolute; left: 0; top: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:1em; color:#ef8203; }

.methodLayer .box {position:relative; display:flex; flex-wrap:no-wrap;gap:4%;}
.methodLayer .box .box1 { width:25%; position:relative; flex: 1 1 25%; }
.methodLayer .box .box1 div {width:100%; height:100%; display:inline-block; border:2px solid #ddd; border-radius:0.5rem; background:url('/images/contents/nabisaegim.jpg'); background-size: cover; }
.methodLayer .box .box1 div:before {content:''; width:10px; height:10px; top:5px; left:50%; position:absolute; background:#ddd;  -webkit-transform: translateX(-50%); transform: translateX(-50%); border-radius:10px;}
.methodLayer .box .box1 div:after {content:''; width:2px; height:30px; top:30px; right:-2px; position:absolute; background:#ddd;}
.methodLayer .box .box2 {width:70%; position:relative;flex: 1 1 72%;}
.methodLayer .box .box2 p {font-size:1.1rem; margin-bottom:1rem; text-align:left; }
.methodLayer .box .box2 p span {color:#ef8203; font-weight:600;}
.methodLayer .box .box2 .box3 {border-radius:0.5rem; background:#fbe9ca; padding:0.5rem 1rem;}
.methodLayer .box .box2 .box3 img {max-width:100%;}

.methodBox {border:1px solid #ddd; position:relative; border-radius:0.5rem;  overflow:hidden; margin-top:2rem;}
.methodBox > div {padding:0.7rem 1rem;}
.methodBox > .head {background:#007cbb; font-weight:600; color:#fff;}
.methodBox > .head i {padding-right:0.5rem;}


/* 법적근거 */
.law p { text-indent: -1em; margin-left:1em; position:relative;}
.law .deep2 { margin-left:2em;}

.law > .tablebox > .tableline td.text-left {text-align:left;}
.law > .lawtitle {text-align:left; font-weight:600; font-size:1.2rem; margin-bottom:0.5rem;}


/* 사업안내 공통 */
.work_box {position:relative; border-radius:0.5rem; width:100%; display:inline-block; overflow:hidden; height:15rem; background:#F5F5F5; padding:1rem;}
.work_box > .img {width:22rem; float:left;  height:100%; border-radius:0.3rem;}
.work_box > .text {width:calc(100% - 22rem); float:left; padding:2rem 1rem 2rem 2rem; position:relative; height:100%; }
.work_box > .text > div { position:relative;  -webkit-transform: translateY(-50%); transform: translateY(-50%); vertical-align: middle; top:50%; font-size:1.2rem; line-height:150%;}
.work_box > .text > div > p {font-weight:600; font-size:1.5rem; color:#ef8203; margin-bottom:1rem;}
.work_box > .text > div > span {color:#ef8203; font-weight:600;}
.work_box > .text:before {content: "\f10d";  left:2rem; top: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:2rem; color:#f7b263; position:absolute; }
.work_box > .text:after {content: "\f10e";  right:0; bottom:0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:2rem; color:#f7b263;  position:absolute; }
.work_box:before {content: "\f004";  left:50%; bottom: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:15rem; color:#f7b263; position:absolute; opacity: 0.2;}

.advice > .work_box > .img {background:url('/images/contents/advice_img.jpg'); background-size: cover; background-position: center;}
.edu > .work_box > .img {background:url('/images/contents/edu_img.jpg'); background-size: cover; background-position: center;}
.hrights > .work_box > .img {background:url('/images/contents/hrights_img.jpg'); background-size: cover; background-position: center;}
.network > .work_box > .img {background:url('/images/contents/network_img.jpg'); background-size: cover; background-position: center;}
.promote > .work_box > .img {background:url('/images/contents/promote_img.jpg'); background-size: cover; background-position: center;}
.rest > .work_box > .img {background:url('/images/contents/rest_img.jpg'); background-size: cover; background-position: center;}


/* 노인인권교육사업 */
.hrights  .tablebox  .tableline td.cont {text-align:left;}
.hrights  .tablebox  .tableline td .mtime {display:none; border-top:2px dotted #ddd; margin-top:0.5rem; padding-top:0.5rem;}


/* 홍보사업 */
.promoteList {display:flex; flex-wrap:wrap; gap: 1rem; margin-top:1rem;}
.promoteList li {flex: 1 1 calc((100% / 4) - 1rem); max-height:20rem;}
.promoteList  .photo {display:block; overflow:hidden; position:relative; border:1px solid #ddd; border-radius:0.5rem;}
.promoteList  .image {padding-top:70%; height:0; display:block;}
.promoteList li:hover .image{animation:zoom 1s 1;}
.promoteList .image img {top:50%; left:50%; position:absolute; -webkit-transform:translate(-50%, -50%);  transform:translate(-50%, -50%); width:100%; min-height:100%; object-fit:cover; transition:all 0.2s; }
.promoteList .title {display:block; overflow:hidden; max-width:100%; font-size:1rem; text-overflow:ellipsis; white-space:nowrap; word-break:keep-all; text-align:center; margin-top:0.5rem;}


/* 학대피해노인전용쉼터 */
.restBox { margin:3em 0 2em; border-radius:0.5em; position:relative; padding:1.2em 1em; background: #F5F5F5; line-height:150%; }
.restBox span { left:0; position:absolute; top:-1em; display:inline-block; font-size:1.2em; color:#fff; text-align:center; background:#ef8203; border-radius:0px 20px 20px 0px; padding:5px 30px; }

.restStep {padding:1.5em; border-radius:0.5em; border:1px solid #ddd; margin-top:1rem;}
.restStep > ul {}
.restStep > ul > li {padding-left:2em; position:relative; margin-bottom:0.3em;}
.restStep > ul > li > span {font-weight:600;}
.restStep > ul > li:before {content:''; position:absolute; left:0.2em; top: 0.1em; width: 1.4em; height: 1.4em; border-radius: 100%; background-color: #ef8203;  text-align:center; color:#fff; font-size:1em;}
.restStep > ul > li:nth-child(1):before {content:'1';}
.restStep > ul > li:nth-child(2):before {content:'2';}
.restStep > ul > li:nth-child(3):before {content:'3';}
.restStep > ul > li:nth-child(4):before {content:'4';}
.restStep > ul > li:nth-child(5):before {content:'5';}
.restStep > ul > li:nth-child(6):before {content:'6';}
.restStep > ul > li:nth-child(7):before {content:'7';}
.restStep > ul > li:nth-child(8):before {content:'8';}


/* 예방교육 */
.requestTable             {border-top:1px solid #000; border-collapse:collapse; position:relative; width:100%; font-size:1rem; text-align:center;}
.requestTable th          {border-left:1px solid #000; border-right:1px solid #000; border-bottom:1px solid #000; background-color:#F5F5F5; padding:1.2rem 0;}
.requestTable td          {border-left:1px solid #000; border-right:1px solid #000; border-bottom:1px solid #000; padding:1.2rem 0.5rem; text-align:left; line-height:130%;}

.pollTable             {border-top:2px solid #ef8203; border-collapse:collapse; position:relative; width:100%; font-size:1rem; text-align:center;}
.pollTable th          {border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; background-color:#F5F5F5; padding:1.2rem 0;}
.pollTable td          {border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:1.2rem 0.5rem; }


/* 예방교육신청 */
.requestForm {border-top:2px solid #ef8203; position:relative; }
.requestForm li {padding:1rem 0; border-bottom:1px dotted #ddd; position:relative; overflow:hidden; display:flex; width:100%;}
.requestForm li .title {float:left; display:flex; position:relative; width:10rem; padding:0 0.5rem; font-weight:600; text-align:center; justify-content:center; align-items:center;}

.requestForm li .title i:before {content:"*"; color:#ef8203; font-size:1em; margin-top:-1em; font-style:normal; position:absolute;}

.requestForm li .cont {float:left; width:calc(100% - 10rem); vertical-align:middle;}
.requestForm li .cont2 {float:left; width:calc(50% - 10rem); vertical-align:middle;} // 50%칸

.requestForm li .cont input[type='text'] {max-width:100%;}
.requestForm li textarea {width:calc(100% - 0.1rem);}
.requestForm li .cont p {line-height:130%; margin-top:0.2rem;}

.requestForm li .cont.content {line-height:1rem;}

.requestForm li .cont .vhak1 {display:block; margin-bottom:0.2rem;}
.requestForm li .cont .vhak2 {display:block;}

.requestForm li .cont .vemail1 input {width:200px;}
.requestForm li .cont .vemail2 input {width:200px;}
.requestForm li .cont .vemail3 select {width:200px;}


/* 예방교육 리스트 */
.requestList             {border-top:3px solid #ef8203; border-collapse:collapse; background:#FFFFFF; position:relative; width:calc(100% + 1px); font-size:1rem; margin-left:-1px; text-align:center; table-layout:fixed;}
.requestList th          {border-bottom:1px solid #ddd; background-color:#F5F5F5; padding:1.2rem 0.5rem;}
.requestList td          {border-bottom:1px solid #ddd; padding:1.2rem 0.5rem; font-size:1rem;}
.request .requestList td.company, .consult .requestList td.subject{text-align:left;}
.requestList td.subject span {margin-left:0.5rem;}
.requestList tr:hover {background:#fbecd1;}
.requestListHead {position:relative; padding:1rem; text-align:center; width:100%; background:#F5F5F5; border:2px solid #ef8203;  margin-bottom:1rem;}

.consult .requestList td.subject i {margin-left:0.5rem; color:#ef8203; font-size:0.8rem;}


/* 예방교육 상세보기 */
.requestView {border-top:2px solid #ef8203; position:relative; }
.requestView li {border-bottom:1px solid #ddd; position:relative; overflow:hidden; display:flex; width:100%;}
.requestView li .title {float:left; display:flex; position:relative; width:10rem; padding:0 0.5rem; font-weight:500; text-align:center; justify-content:center; align-items:center;}
.requestView li .cont {float:left; width:calc(100% - 10rem); vertical-align:middle; line-height:130%; padding:1rem 0; min-height:3rem; padding-left:1rem; position:relative;}
.requestView li .title:after {content:'|'; position:absolute;  right:0; color:#ddd; font-weight:100;}
.requestView li .title2:before {content:'|'; position:absolute;  left:0; color:#ddd; font-weight:100;}
.requestView li .cont2 {float:left; width:calc(50% - 10rem); vertical-align:middle; line-height:130%; padding:1rem 0; min-height:3rem; padding-left:1rem; position:relative; display:inline-block;} // 50%칸
.requestView li .cont input[type='text'] {max-width:100%;}
.requestView li textarea {width:calc(100% - 0.1rem);}
.requestView li .cont p {line-height:130%; margin-top:0.2rem;}
.requestView li .cont.content {line-height:130%;}


/* 비번 */
.passForm {margin-left:auto; margin-right:auto; padding:1rem; text-align:center; width:20rem; border:1px solid #ddd; border-radius:0.5rem;}
.passForm div {width:100%; margin:0.5rem 0;}
.passForm .cont input {width:100%;}
.passForm .btnline  input {width:100%;}


/* 후원안내 */
.supportBox {text-align:center; width:100%; border-radius:0.5rem; font-size:1rem; padding:5rem 2rem; background:url(/images/contents/support_bg.jpg);background-size: cover; background-position: center; border:0.1rem solid #f9dfde;}
.supportBox .cont1 {font-size:1.1em; font-weight:500;}
.supportBox .cont2 {font-size:1.8em; margin-top:0.2em; font-weight:600;}
.supportBox .cont2 span {color:#ef8203;}
.supportBox .cont3 {font-size:1em; margin-top:1em;}
.supportBox .cont4 {font-size:1em;}


/* 자원봉사 */
.helper > .tablebox > .tableline > tbody > tr > td:nth-child(1) {background:#F5F5F5;}
.helper > .tablebox > .tableline > tbody > tr > td:nth-child(2) {text-align:left; line-height:150%;}

/* 게시판 리스트 */
.boardList             {border-top:3px solid #ef8203; border-collapse:collapse; background:#FFFFFF; position:relative; width:100%; font-size:1rem; text-align:center; table-layout:fixed;}
.boardList th          {border-bottom:1px solid #ddd; background-color:#F5F5F5; padding:1rem 0.5rem;}
.boardList td          {border-bottom:1px solid #ddd; padding:1rem 0.5rem;}
.boardList td.subject{text-align:left;}
.boardList td.subject span {margin-left:0.5rem;}
.boardList td a {display:block;}
.boardList tr:hover {background:#fbecd1;}

.boardSearch {margin-top:1.5rem; text-align:center; line-height:2rem; border:1px solid #ddd; border-radius:0.5rem; padding:1rem 0.5rem;}
.boardSearch.top {margin-bottom:1.5rem;}
.boardSearch span {margin-right:1rem;}
.boardSearch .write {float:right; margin-right:1rem;}
.boardSearch .write .btnR {border-radius:0.2rem;}


/* 게시판 상세보기 */
.boardView {border-top:3px solid #ef8203; width:100%; position:relative; border-bottom:1px solid #ddd;}
.boardView .boardHead {border-bottom:1px solid #ddd; width:100%; padding:1.5rem 0.5rem; text-align:center; background:#F5F5F5;}
.boardView .boardHead .subject {text-align:center; font-size:1.2rem; margin-bottom:1rem; line-height:130%; font-weight:600;}
.boardView .boardHead ul {}
.boardView .boardHead li {display:inline; margin:0 2rem;}
.boardView .boardHead li strong {font-weight:600; margin-right:1rem; position:relative;}
.boardView .boardBody {padding:1rem 0.5rem;}
.boardView .boardBody img {max-width:100%;}

//.boardBtn {margin:2rem 0 0 0; text-align:center;}
//.boardBtn .btnP {margin-bottom:0.2em;}

.boardPhoto {width:100%; position:relative; text-align:center; padding:0.5rem; border-bottom:1px solid #ddd;}
.boardPhoto img {max-width:100%;}

.boardFile {display:flex; padding:1rem 2rem; border:0; background:#F5F5F5; position:relative; border-top:1px solid #ddd;}
.boardFile .title {display:flex; width:6rem; -webkit-box-align:center; -ms-flex-align:center; align-items:center; font-weight:600; text-align:center;}
.boardFile ul {-webkit-box-flex:1; -ms-flex-position:1; flex-grow:1; display:inline-block; width:calc(100% - 6rem);}
.boardFile li {overflow:hidden; position:relative; margin:0.5rem 0;}
.boardFile li i {margin-left:0.5rem;}


/* 게시판쓰기폼 */
.boardForm {border-top:2px solid #ef8203; position:relative; }
.boardForm li {padding:1rem 0; border-bottom:1px solid #ddd; position:relative; overflow:hidden; display:flex; width:100%;}
.boardForm li.content {display:inline-block; padding:0; border-bottom:0;}
.boardForm li .title {float:left; display:flex; position:relative; width:8rem; padding:0.5rem; font-weight:500; text-align:center; justify-content:center; align-items:center;}
.boardForm li .cont {float:left; width:calc(100% - 8rem);}
.boardForm li .cont input[type='text'] {width:100%;}
.boardForm li textarea {width:calc(100% - 0.1rem);}

.boardForm li .cont .thumb {}
.boardForm li .cont .thumb img {height:5rem; width:5rem;}


/* 사진게시판 리스트 */
.photoList {border-top:2px solid #ef8203; border-bottom:1px solid #ddd;}
.photoList ul {display:flex; flex-wrap:wrap; overflow:hidden; width:calc(100% + 1rem);}
.photoList li {width:calc(100% / 3); padding:1rem 1rem 1rem 0;}
.photoList  .photo {display:block; overflow:hidden; position:relative; border:1px solid #ddd; border-radius:0.5rem; margin-bottom:0.5rem;}
.photoList  .image {padding-top:62%; height:0; display:block;}
.photoList li:hover .image{animation:zoom 1s 1;}
.photoList .image img {top:50%; left:50%; position:absolute; -webkit-transform:translate(-50%, -50%);  transform:translate(-50%, -50%); width:100%; min-height:100%; object-fit:cover; transition:all 0.2s; }
.photoList .title {display:block; overflow:hidden; max-width:100%; font-size:1rem; text-overflow:ellipsis; white-space:nowrap; word-break:keep-all; text-align:center;}


/* 페이징라인 */
.boardPage  {text-align:center; margin-top:1.5rem; vertical-align: top;  font-size:1rem; line-height:0;}
.boardPage ul {display:inline-block;}
.boardPage li     {border:1px solid #ddd;  display:inline-block; overflow:hidden; line-height:150%; margin-left:4px;  min-width:2.5rem;}
.boardPage li > i {line-height:1.5rem;}
.boardPage li > a {background:#fff; display:block;padding:0.8rem 0.8rem; line-height:1;}
.boardPage li > a.on {background:#ef8203; color:#fff; display:block;}


/* 이용안내 */
.guideBox {width:100%; border-radius:0.5rem; border:1px solid #ddd; padding:1.5rem 1rem 1rem; margin-top:3rem; position:relative;}
.guideBox  li {padding-left:1.3em; position:relative; line-height:130%; margin-top:0.2rem;margin-bottom:0.5rem;}
.guideBox  li:before {content:'\f138'; position:absolute; left: 0; top: 0; font-family: "Font Awesome 5 Free"; font-weight:600; font-size:1em; color:#ef8203; }
.guideBox.top {margin-top:0; margin-bottom:2rem; padding:1rem;}
.guideBox > span { left:-1px; position:absolute; top:-1em; display:inline-block; font-size:1em; color:#fff; text-align:center; background:#ef8203; border-radius:0px 20px 20px 0px; padding:0.3rem 1.5rem 0.3rem 1rem;}


@media (max-width: 1700px) {
}


@media (max-width: 1400px) {
  /* 연혁 */
  .history {padding-left:10rem;}
  .history .heading {width:10rem;font-size:1.8rem; }

  /* 법적근거 */
  .law > .tablebox > .tableline td br {display:none;}
}


@media (max-width: 1200px) {
  /* 신고방법 */
  .methodLayer:first-child { gap:1rem; margin-top:1rem; }
  .methodLayer:first-child > li { flex: 100%;}
  .methodLayer .cont2 > div {width:100%;}

  .methodLayer .cont2 > ul > li:first-child {width:25%;}
  .methodLayer .cont2 > ul > li:nth-child(2) {width:30%;}
  .methodLayer .cont2 > ul > li:last-child {width:45%;}

  .methodLayer .cont2 > .head {margin:0 auto;}
  .methodLayer .cont2 > ul {margin-bottom:0;}
}


@media (max-width: 1024px) {
  /* 신청서 쓰기폼 */
  .requestForm li {display:inline-block;}
  .requestForm li {padding:0.3rem 0 0.5rem 0;}
  .requestForm li .title {float:left; display:block; position:relative; width:auto; padding:0 0 0.5rem 0; text-align:left; font-size:1.1rem;}
  .requestForm li .title br {display:none;}
  .requestForm li .cont {width:100%; display:inline-block;}
  .requestForm li .cont2 {width:100%; display:inline-block; border-bottom:1px dotted #ddd; margin-bottom:0.5rem; padding-bottom:0.5rem;}
  .requestForm li .cont2:last-child {border-bottom:0; padding-bottom:0; margin-bottom:0;}
  .requestForm li .cont .vhak3 {display:block; margin-top:0.2rem;}
  .request .btn {min-width:5em;}

  /* 신청서 리스트 */
  .requestList {width:100%; margin-left:0; border-spacing:0;}
  .requestList colgroup, .requestList thead {display:none;}
  .requestList {text-align:left; font-size:1rem;}
  .requestList tr {display:block; overflow:hidden; position:relative; padding:0.5rem 0 1rem 0;border-bottom:1px solid #ddd; font-size:0;}
  .requestList td {display:inline-block; padding:0; border-bottom:0; color:#666; margin:0.5rem 0 0 0;}
  .requestList td:before {display:inline-block; position:relative;  margin:0 0.5rem 0 0; color:#000; font-weight:600;}
  .requestList td.num {display:none;}

  /* 예방교육 리스트 */
  .request .requestList td.company {width:100%; font-size:1.1rem;}
  .request .requestList td.company a {color:#000; font-weight:600;}
  .request .requestList td.edate {width:20%;}
  .request .requestList td.mchk {width:20%;}
  .request .requestList td.teacher {width:20%;}
  .request .requestList td.poll {width:20%;}
  .request .requestList td.stat {width:auto;}

  .request .requestList td.edate:before { content:"신청일"; }
  .request .requestList td.mchk:before { content:"처리상태";}
  .request .requestList td.teacher:before { content:"강사";}
  .request .requestList td.poll:before { content:"만족도";}
  .request .requestList td.stat:before { content:"교육확인서";}

  /* 온라인상담 리스트 */
  .consult .requestList td.subject {width:100%; font-size:1.1rem;}
  .consult .requestList td.subject a {color:#000; font-weight:600;}
  .consult .requestList td.name {width:33%;}
  .consult .requestList td.wdate {width:33%;}
  .consult .requestList td.mchk {width:auto;}

  .consult .requestList td.name:before { content:"작성자";}
  .consult .requestList td.wdate:before { content:"작성일";}
  .consult .requestList td.mchk:before { content:"답변";}

  /* 후원안내 리스트 */
  .support .requestList td.company {width:33%;}
  .support .requestList td.hp {width:33%;}
  .support .requestList td.sptchk {width:33%;}
  .support .requestList td.sptpay {width:33%;}
  .support .requestList td.wdate {width:auto;}

  .support .requestList td.company:before { content:"작성자";}
  .support .requestList td.hp:before { content:"휴대전화";}
  .support .requestList td.sptchk:before { content:"후원종류";}
  .support .requestList td.sptpay:before { content:"후원금액";}
  .support .requestList td.wdate:before { content:"작성일";}

  /* 자원봉사 리스트 */
  .helper .requestList td.name {width:32%;}
  .helper .requestList td.hp {width:36%;}
  .helper .requestList td.sosok {width:32%;}
  .helper .requestList td.bschk {width:32%;}
  .helper .requestList td.wdate {width:auto;}

  .helper .requestList td.name:before { content:"작성자";}
  .helper .requestList td.hp:before { content:"휴대전화";}
  .helper .requestList td.sosok:before { content:"소속";}
  .helper .requestList td.bschk:before { content:"활동희망";}
  .helper .requestList td.wdate:before { content:"작성일";}


  /* 신청서 상세보기 */
  .requestView li {display:inline-block;}
  .requestView li .title {float:left; display:block; position:relative; width:auto; padding:0.75rem 0 0.5rem 0; text-align:left;  font-size:1.1rem; font-weight:500; border-bottom:1px dotted #ef8203; }
  .requestView li .title br {display:none;}
  .requestView li .title:after {content:"";}
  .requestView li .title2:before{content:"";}
  .requestView li .cont {width:100%; display:inline-block; padding:0.5rem 0 0.75rem 0; min-height:2.5rem;}
  .requestView li .cont2 {width:100%; display:inline-block; border-bottom:1px dotted #ddd; padding:0.5rem 0 0.75rem 0; min-height:2.5rem;}
  .requestView li .cont2:last-child {border-bottom:0; padding-bottom:0; margin-bottom:0;}

  /* 게시판 리스트 */
  .boardList colgroup, .boardList thead {display:none;}
  .boardList {text-align:left; font-size:1rem;}
  .boardList tr {display:block; overflow:hidden; position:relative; padding:1rem 0.5rem;border-bottom:1px solid #ddd;}
  .boardList td {display:inline; padding:0; border-bottom:0; margin-right:1rem; color:#999;}
  .boardList td.num {display:none;}
  .boardList td.subject {display:block; font-size:1.1rem; padding:0 0 0.5rem 0; margin-right:0;}
  .boardList td.subject a {color:#000;}

  .boardList td.wdate:before { content:"작성일"; display:inline-block; position:relative;  margin:0 0.5rem 0 0; color:#555; font-weight:600;}
  .boardList td.hit:before { content:"조회"; display:inline-block; position:relative;  margin:0 0.5rem 0 0; color:#555; font-weight:600;}

  .boardSearch .write {margin-right:0;}
  .boardSearch .write .btnR {  padding-left:1em; padding-right:1em;}
  .boardList tr:hover {background:none;}
}


@media (max-width: 768px) {

  /* stepBox */
  .stepBox > li {flex: 1 1 calc((100% / 2) - 1rem); padding-left:0.5rem; padding-right:0.5rem;}
  .stepBox > li > span {font-size:1rem; padding:3px 10px; top:-1.3rem;}
  .stepBox > li > i { font-size:2.2rem;  width:5rem; height:5rem; line-height:5rem;}
  .consult > .stepBox > li { flex: 1 1 calc((100% / 2) - 1rem);}
  .support > .stepBox > li {flex: 1 1 calc((100% / 2) - 1rem);}


  /* 인사말 */
  .greet > .greetbox > .greetimg img {width:80px;}
  .greet > .greetbox > p {font-size:1.8rem;  letter-spacing:-1;}

  .greet .box {width:100%; display:inline-block;}
  .greet .box .box1 {display:none;}
  .greet .box .box2 {width:100%; display:inline-block; flex:100%;}
  .greet .box3 {display:block; margin-top:1.5rem;}

  /* 기관현황 */
  .infobox {padding:0.5rem;}
  .infobox > .group {font-size:1rem;}
  .infobox > .group > .photo {display:inline-block; width:100%; position:relative; height:auto; background:#fff; padding:1rem; border-radius:0.5rem;}
  .infobox > .group > .photo img {max-width:150px;}
  .infobox > .group > .cont {margin-left: 0; padding-bottom:0;}
  .info .cont p {letter-spacing:-1;}


  .infovision > .item > .group {margin:0.5rem;}
  .infovision > .item > .group > .subject {width:100%; position:relative; display:inline-block; height:auto; padding:1rem 0;}
  .infovision > .item > .group > .subject > br {display:none;}
  .infovision > .item > .group > .cont {margin-left:0; }

  /* 조직현황 */
  .organize  .box1 p {min-height:45px;}
  .organize .rank01 {height:45px;}
  .organize .rank01 .box1{width:70%;}
  .organize .rank01:before{top:45px; height:170px;background:#ddd;}

  .organize .rank03{margin-top:25px; height:45px;}
  .organize .rank03 p {width:90%; min-height:45px;}

  .organize .rank04{height:45px; margin-top:25px;}

  .organize .rank04 .box2{width:70%;}
  .organize .rank04 p {width:100%; min-height:45px; }

  .organize .rank05 .box {width:100%;}
  .organize .rank05 .box p {min-height:auto; margin-bottom:0.5rem; margin-left:20px; width:calc(100% - 20px); padding:0.7rem 0;}
  .organize .rank05 .box p br {display:none; }
  .organize .rank05 p:after{content:'';position:absolute;display:block;width:20px;left:-20px; top:50%;height:1px;background:#ddd;}
  .organize .rank05:before{content:'';position:absolute;display:block;width:calc((100% - 10px) / 2);top:-30px;height:1px;background:#ddd; left:5px; transform:translateX(0%);}
  .organize .rank05 div:first-child p:before {content:'';position:absolute;display:block;width:1px;top:-31px;height:calc(24rem + 14px);background:#ddd; left:-21px;}
  .organize .rank05 div:last-child p:before {content:'';display:none;width:0px;;height:0px;}

  /* 연혁 */
  .history {padding-left:0px;}
  .history .heading {display:none;}
  .history .list {margin-left:0px; padding-left:1.5rem;}
  .history .list > li > strong {font-size:1.5rem;}
  .history .list > li > strong:before {margin-left:-1.5rem; top:0.35rem;}
  .history .list > li ul li {padding-left:0px;}
  .history .list > li ul li div {margin-left:0px; position:relative; margin-top:0.5rem; margin-bottom:0.2rem;}

  /* 전국현황 */
  .pure > .tablebox > .tableline {border-top:0px; margin-left:0; width:100%;}
  .pure > .tablebox > .tableline th {display:none;}
  .pure > .tablebox > .tableline tr {border-bottom:0px solid #ddd; margin-bottom:0.8em;}
  .pure > .tablebox > .tableline tr:first-child {border-bottom:0px;}
  .pure > .tablebox > .tableline td {display:inline-block; width:100%; border-left:0; border-bottom:0; text-align:left;  padding:0.5em;}
  .pure > .tablebox > .tableline td:first-child {font-size:1.2em;  border-radius:0.5em; border:1px solid #ddd; font-weight:700; text-align:center; border-top:2px solid #ef8203;}
  .pure > .tablebox > .tableline td:last-child {margin-bottom:0.8em;}
  .pure > .tablebox > .tableline td i:after {content:'홈페이지';margin-left:5px; z-index:-1; font-size:1em; font-weight:500;}

  .pure > .tablebox > .tableline > tbody > tr.cb > td:first-child {background:#fff;}

  .pure > .tablebox > .tableline td:nth-child(2) {font-size:1.1rem;}

  .pure > .tablebox > .tableline td:nth-child(4) {padding-left:3rem; position:relative;}
  .pure > .tablebox > .tableline td:nth-child(4):before {content:'전화 :'; left:0.5rem; top:0.5rem; width:2.3rem; height:1rem; font-size:1rem; font-weight:500;position:absolute;}

  .pure > .tablebox > .tableline td:nth-child(5) {padding-left:3rem; position:relative;}
  .pure > .tablebox > .tableline td:nth-child(5):before {content:'팩스 :'; left:0.5rem; top:0.5rem; width:2.3rem; height:1rem; font-size:1rem; font-weight:500;position:absolute;}


  /* 찾아오시는길 */
  .map {display:block; position:relative;}
  .map ul li {padding-left:4rem; display:inline-block; width:100%; position:relative;   margin: 0 0 0.8rem;}
  .map ul li:first-child {  margin: 0 0 0.8rem;}
  .map ul li:last-child {  margin: 0 0 0;}
  .map ul strong {position:absolute; left:0; top:0;   margin-right: 0.1rem; }
  .map ul strong::before { width: 1.5rem; height: 1.5rem; font-size:1rem; line-height: 1.5rem; }
  .map ul span { padding-left:1rem; line-height:130%; }


  .travel > .item {margin-left:0;}
  .travel > .item > .photo {font-size:3rem; width:3rem; position:relative; width:100%; margin-bottom:1rem;}
  .travel > .item > .cont {margin-left:0; width:100%; }
  .travel > .item > .cont > p {text-align:center;}


  /* 정의 */
  .abuseimg {height:8rem;}

  /* 유형 */
  .pattern_box {padding:1rem 1rem 1rem 1.5rem; font-size:1.2rem;}
  .pattern_box > i { font-size:1.5rem;}
  .pattern_box > .cont {margin-left:1.2rem; }

  .pattern_group > .item > .img {float:left; width:100%; margin-right:0; margin:0.5rem 0;}
  .pattern_group > .item > .img > img {height:150px;}
  .pattern_group > .item > .text {float:left; width:100%;}

  /* 신고방법 */
  .methodLayer { gap:1rem; margin-top:1rem; }
  .methodLayer > li { flex: 100%;}

  .methodBox {margin-top:1rem;}
  .methodLayer .box .box1 div:before {content:''; width:5px; height:5px; top:5px; border-radius:5px;}
  .methodLayer .box .box1 div:after {content:''; width:2px; height:20px; top:20px; right:-2px; }

  .methodLayer .cont2 > ul {position:relative; display:inline-block; width:auto; margin-left:auto; margin-right:auto;}
  .methodLayer .cont2 > ul > li {float:none; }
  .methodLayer .cont2 > ul > li:first-child {width:auto;}
  .methodLayer .cont2 > ul > li:nth-child(2) {width:auto;}
  .methodLayer .cont2 > ul > li:last-child {width:auto;}

  .methodLayer .box .box1 {width:26%;}
  .methodLayer .box .box2 {width:70%;}

  .methodLayer .box .box1 div {border:2px solid #ddd; }
  .methodLayer .box .box2 p {font-size:1rem;}

  /* 법적근거 */
  .law > .tablebox > .tableline th,   .law > .tablebox > .tableline td { min-width:15%;}
  .law > .tablebox > .tableline .chk {display:none;}

  /* 사업안내 공통 */
  .work_box {height:auto; padding:0;}
  .work_box > .img {width:100%; height:120px; float:none; }
  .work_box > .text {width:100%; height:auto;  float:none; position:relative; padding:1rem;}
  .work_box > .text:before {content: "";}
  .work_box > .text:after {content: "";}
  .work_box > .text > div {width:100%;padding:1rem;   -webkit-transform: translateY(0%); transform: translateY(0%); top:0; padding:0; font-size:1.1rem;}
  .work_box > .text > div > p {font-size:1.2rem; margin-bottom:0.5rem;}

  /* 노인인권교육사업 */
  .hrights  .tablebox  .tableline td.time {display:none;}
  .hrights  .tablebox  .tableline colgroup {display:none;}
  .hrights  .tablebox  .tableline td .mtime {display:block;}
  .hrights  .tablebox  .tableline td.chk {width:60px;}
  .hrights  .tablebox  .tableline td.gubun {width:120px;}

  /* 홍보사업 리스트 */
  .promoteList > li {flex: 1 1 calc((100% / 2) - 1rem); }

  /* 신청서 쓰기폼 */
  .requestForm li .cont .vemail3 {display:block; margin-top:0.5rem;}

  /* 예방교육 리스트 */
  .request  .requestList td.edate {width:50%;}
  .request  .requestList td.mchk {width:50%;}
  .request  .requestList td.teacher {width:50%;}
  .request  .requestList td.poll {width:50%;}
  .request  .requestList td.stat {width:auto;}

  /* 온라인상담 리스트 */
  .consult .requestList td.name {width:50%;}
  .consult .requestList td.wdate {width:50%;}
  .consult .requestList td.mchk {width:100%;}

  /* 후원안내 리스트 */
  .support .requestList td.company {width:40%;}
  .support .requestList td.hp {width:58%;}
  .support .requestList td.sptchk {width:40%;}
  .support .requestList td.sptpay {width:58%;}
  .support .requestList td.wdate {width:auto;}

  /* 자원봉사 리스트 */
  .helper .requestList td.name {width:45%;}
  .helper .requestList td.hp {width:55%;}
  .helper .requestList td.sosok {width:45%;}
  .helper .requestList td.bschk {width:55%;}
  .helper .requestList td.wdate {width:auto;}

  /* 후원안내 */
  .supportBox { padding:2.5rem 1rem;}
  .supportBox .cont3 {letter-spacing:-1;}
  .supportBox .cont4 {letter-spacing:-1;}

  /* 자원봉사 */
  .helper > .tablebox > .tableline > tbody > tr > td:nth-child(1) {background:#fff;}
  .helper .tableline {width:100%; margin-left:0; border-spacing:0; text-align:left; font-size:1rem;}
  .helper .tableline colgroup,   .helper .tableline thead {display:none;}
  .helper .tableline tr {display:block; overflow:hidden; position:relative; padding:0.5rem 0 1rem 0;border-bottom:1px solid #ddd; font-size:0;}
  .helper .tableline td {display:inline-block; padding:0; border-bottom:0; color:#666; margin:0.5rem 0 0 0;width:100%; position:relative; font-size:1rem; border-left:0;}
  .helper .tableline td ul {width:100%; display:inline-block;}
  .helper .tableline td:before {display:inline-block; position:relative;  margin:0 0.5rem 0 0; color:#000; font-weight:600;}

  /* 자원봉사 - 활동분야 */
  .helper .tableline td:nth-child(1):before { content:"분야"; }
  .helper .tableline td:nth-child(2):before { content:"활동내용"; }
  .helper .tableline td:nth-child(3):before { content:"시간"; }

  /* 게시판 검색폼 */
  .boardSearch input[type=text] {width:70%;}
  .boardSearch span {display:block; margin-bottom:0.5rem;}

  /* 게시판 상세보기 */
  .boardView .boardHead {padding:1rem 0.5rem;}
  .boardView .boardHead ul {display:inline-block;}
  .boardView .boardHead li {display:block; margin:0; text-align:left;}

  .boardBtn {margin:1.5rem 0;}

  .boardFile {display:block; padding:1rem 0.5rem;}
  .boardFile ul {width:100%; text-align:left;  word-break:break-all; word-wrap:break-word;}
  .boardFile li {height:auto; }
//  .boardFile li a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block;}

  /* 게시판 쓰기폼 */
  .boardForm li {display:inline-block;}
  .boardForm li {padding:0.5rem 0;}
  .boardForm li .title {float:left; display:block; position:relative; width:auto; padding:0 0 0.5rem 0; text-align:left;}
  .boardForm li .cont {width:100%; display:inline-block;}

  /* 사진게시판 리스트 */
  .photoList li {width:calc(100% / 2); padding:1rem 1rem 1rem 0;}

  /* 페이징라인 */
  .boardPage li     {min-width:2.2rem; margin-left:-1px; }
  .boardPage li > a {background:#fff; display:block;padding:0.8rem 0.5rem; line-height:1;}
}


@media (max-width: 480px) {
  /* stepBox */
  .stepBox > li {flex:100%; }
  .stepBox > li > i { font-size:2rem; }

  /* 신청서 쓰기폼 */
  .requestForm li .cont .vemail1 input {width:40%;}
  .requestForm li .cont .vemail2 input {width:50%;}

  /* 사진게시판 리스트 */
  .photoList li {width:100%; padding:1rem 1rem 1rem 0;}

}