/* 로딩 */
.loading{text-align:center;}
.loading > p.txt{font-size:30px; font-weight:bold; color:#555; word-break:keep-all; }
.loading > p.txt > span{display:block; margin:20px 0; font-size:16px; font-weight:normal; color:#777; line-height:22px;}

.loader{
  margin: 0 0 2em;
  height: 100px;
  text-align: center;
  padding: 1em;
  margin: 0 auto 1em;
  display: inline-block;
  vertical-align: top;
}

svg path,
svg rect{
  fill: #a0dd66;
}


@media all and (min-width:1024px){
	.page{padding: 0px 60px 50px;}
}


@media all and (min-width:768px){
	.pc{display:block !important;}
	.notPc{display:none !important;}
}
@media all and (max-width:767px){
	.pc{display:none !important;}
	.notPc{display:block !important;}
	.table > tbody > tr > th {
		width:20%;
	}
}


/* 테이블(모바일용) 추가 */
.tb-mobile{width:100%;}
.tb-mobile > div{position:relative; width:100%; margin-bottom:10px; padding:12px 20px 7px; border-radius:4px; border:1px solid #c2c3c4; box-sizing:border-box}
.tb-mobile > div > h4{font-size:16px;padding:0 0 10px; border-bottom:1px solid #e9e9e9; word-break:keep-all; line-height:1.3;}
.tb-mobile > div > h4 > small{color:#191919; font-size:85%}
.tb-mobile > div > ul{padding: 5px;}
.tb-mobile > div > ul:after{content:''; display:block; clear:both;}
.tb-mobile > div > ul > li{width:100%; margin-bottom:2px;}
.tb-mobile > div > ul > li:after{content:''; display:block; clear:both;}
.tb-mobile > div > ul > li.name{font-size:16px; font-weight:700}
.tb-mobile > div > ul > li > span{padding:0 3px;}
.tb-mobile > div > ul > li > .tit{position:relative; float:left; display:inline-block; width:25%; max-width:70px; margin-right:10px; padding-left:0; padding-right:8px; text-align:justify !important; box-sizing:border-box;}
.tb-mobile > div > ul > li > .tit:after{content:''; position:absolute; right:0; top:5px; display:block; width:1px; height:12px; background:#ccc}
.tb-mobile > div > ul > li > .cont{float:left; display:inline-block; width:calc(100% - 80px); margin-bottom:0;}



.nav-justified > li > a {
	border-radius: 0;
	border: 1px #e6e6e6 solid;
	margin-left: 3px;
	margin-right: 3px;
}

.table > thead > tr > td.warning, .table > thead > tr > th.warning, .table > thead > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr > td.warning, .table > tbody > tr > th.warning, .table > tbody > tr.warning > td, .table > tbody > tr.warning > th, .table > tfoot > tr > td.warning, .table > tfoot > tr > th.warning, .table > tfoot > tr.warning > td, .table > tfoot > tr.warning > th {
	background-color: #ffeae3;
}

.page {
	font-size: 15px !important;
}

@media all and (max-width: 767px) {
	.input-md {
		padding: 13px 12px 2px;
	}
	.form-control {
		font-size: 1.1em;
	}

}

@media all and (min-width: 766px){
	.input-md {
		padding: 5px 12px ;
	}

	.form-control {
		font-size: 1.0em;
	}

} 

.navbar-form {
	margin-left: 0px !important ;
	margin-right: 0px !important;
}




p, .p, .list {margin-top: 0px; margin-bottom:0;}
.page strong{font-weight:600 !important}
label{margin:1px 0 0 3px; vertical-align:middle;}












.page{padding:0 60px 60px;}

@media all and (max-width: 1024px) {
	.page{padding:0 30px;}
}

@media all and (max-width: 767px) {
	.page{padding:0 15px;}
}



/* 상담심리사 찾기 */
.counseling-list > ul{display: flex; flex-wrap: wrap; margin-top:10px;}
.counseling-list > ul > li {display: flex; flex-wrap: wrap; align-content: space-between; flex: 0 0 20%; padding:3px}
.counseling-list > ul > li > div {position:relative; width: 100%; height:100%; padding: 35px; border:1px solid #dbdbdb; border-radius:3px;}
.counseling-list > ul > li > div:hover{border:1px solid #434345;}
.counseling-list > ul > li > div > h4{position:relative; margin-bottom:10px; padding:0 5px; font-size: 20px; font-family: 'S-CoreDream-6Bold'; color:#434345;line-height:120%;} /* display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;-webkit-line-clamp: 2; word-break:keep-all; */
.counseling-list > ul > li > div > h4 > span{position:absolute; right:5px; top:50%; transform:translateY(-50%); display:inline-block; padding:3px 10px; font-size:13px; font-family: 'S-CoreDream-4Regular'; border-radius:50px; color:#fff; }
.counseling-list > ul > li > div > h4 > span.n1{background:#00407f;}
.counseling-list > ul > li > div > h4 > span.n2{background:#658db5;}
.counseling-list .counsel-info{padding:20px 5px 0; border-top:3px solid #f3f3f3}
.counseling-list .counsel-info li{display: flex; flex-wrap: wrap; align-content: space-between; padding:3px 0;}
.counseling-list .counsel-info span.tit{flex: 0 0 30%; display:inline-block; padding-top:2px; color:#00407f; font-size:14px; font-family: 'S-CoreDream-4Regular'; }
.counseling-list .counsel-info p.txt{flex: 0 0 70%; margin-bottom:0; padding-left:10px; word-wrap:break-word; word-break:break-word; font-family: 'S-CoreDream-4Regular'; color:#434345}

.btn-sep-view {width:100%; padding: 8px 10px; background: #fff; border: 1px solid #212121; color: #212121; text-align: center; font-size: 14px; line-height: 1.3;}
.counseling-list > ul > li > div:hover .btn-sep-view, .btn-sep-view:hover{background:#434345; color:#fff; transition:all .1s ease;}



@media all and (min-width: 541px) {
	.counseling-list .counsel-info{padding-bottom:65px;}
	.counseling-list .counsel-info li.btn-wrap{position:absolute; left:50%;transform:translateX(-50%); right:0; bottom:25px; width:calc(100% - 70px);}
}

@media all and (max-width: 1280px) {
    .counseling-list > ul > li {flex: 0 0 25%;}
	.counseling-list > ul > li > div{padding:25px}
}

@media all and (max-width: 1199px) {
    .counseling-list > ul > li {flex: 0 0 33%;}
}

@media all and (max-width: 991px) {
    .counseling-list > ul > li {flex: 0 0 50%;}
    .counseling-list > ul > li > div {padding: 20px;}
}

@media all and (max-width: 767px) {
    .counseling-list > ul > li {flex: 0 0 50%;}
}

@media all and (max-width: 540px) {
	.counseling-list .counsel-info{padding-bottom:0;}
	.counseling-list .counsel-info li.btn-wrap{margin-top:25px}
    .counseling-list > ul > li {flex: 0 0 100%;}
}



/* 상담심리사찾기 - 뷰페이지 */
.counsel-view-wrap{width:100%; height:100%; padding:20px; background:#fafafa}
.counsel-view-wrap > div{display: flex; flex-wrap: wrap; margin:0 0 15px;}
.counsel-view-wrap > div > div {display: flex; flex-wrap: wrap; align-content: space-between; padding:0 7.5px}
.counseling-view{width:100%; height:100%; border:1px solid #f1f1f1; border-radius:10px; background:#fff;}
.counseling-view > h3{padding:20px 30px 10px; border-bottom:1px solid #e3e3e3; font-size:18px; font-family: 'S-CoreDream-5Medium';}
.counseling-view > h3 > small{color:#999}
.counseling-view .info{padding:20px; text-align:center;}
.counseling-view .info .username{padding-top:10px; font-weight:600; font-size:18px;}
.counseling-view .dsblist li{padding:10px 30px; border-bottom:1px solid #f3f3f3;}
.counseling-view .dsblist li:last-child{padding-bottom:20px; border-bottom:0}
.counseling-view .dsblist label{margin-right:12px;}
.counseling-view .dsblist label > input{margin-right:3px}
.counseling-view .dsblist div.txt dd{margin-bottom:3px;}

@media all and (max-width: 767px) {
	.counsel-view-wrap > div > div.order1{order:1}
	.counsel-view-wrap > div > div.order2{order:2}
	.counseling-view > h3{padding:15px 15px 10px;}
	.counseling-view .dsblist li{padding:10px 15px;}
	.counseling-view .dsblist span.tit{display:block; width:100%; margin-bottom:5px;}
	.counseling-view .dsblist div.txt{width:100%; padding-left:0;}

}

@media all and (max-width: 540px) {
	.counsel-view-wrap{padding:20px 5px}
}






/* 심리상담센터 찾기 */
.search-wrap{margin-bottom:20px; padding:10px; border:5px solid #eee}
.map-list{width:100%; margin-top:12px; overflow:hidden; font-size:14px}
.map-list > ul > li > a:before{content:''; position:absolute; left:0; top:55%; transform:translateY(-50%); display:inline-block; width:43px; height:43px; background: url('/new/image/main/ic_center.png') no-repeat; background-size:contain;}
.map-list > ul > li > a{position:relative; display:block; padding:15px 15px 10px 50px; border-bottom:1px dashed #e3e3e3;}
.map-list > ul > li > a > strong{display:block; margin-bottom:4px; font-size:15px; font-weight:bold; color:#333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}
.map-list > ul > li > a > span{display:block; font-size:13.5px; color:#555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}







/* 리스트 */
.list-horizontal li{display: flex; flex-wrap: wrap; align-content: space-between;}
.list-horizontal span.tit{display:inline-block; padding-top:2px; padding-right:10px; color:#00407f; font-size:14px; font-family: 'S-CoreDream-4Regular'; }
.list-horizontal div.txt{display:block; word-wrap:break-word; word-break:break-word; font-family: 'S-CoreDream-4Regular'; color:#434345; line-height:1.5}
.list-horizontal.w10 span.tit{flex: 0 0 10%;}
.list-horizontal.w10 p.txt{flex: 0 0 90%;}
.list-horizontal.w20 span.tit{flex: 0 0 20%;}
.list-horizontal.w20 p.txt{flex: 0 0 80%;}
.list-horizontal.w30 span.tit{flex: 0 0 30%;}
.list-horizontal.w30 p.txt{flex: 0 0 70%;}
.list-horizontal.w40 span.tit{flex: 0 0 40%;}
.list-horizontal.w40 p.txt{flex: 0 0 60%;}
.list-horizontal.w50 span.tit{flex: 0 0 50%;}
.list-horizontal.w50 p.txt{flex: 0 0 50%;}

@media all and (max-width: 767px) {
	.list-horizontal span.tit{flex:0 0 100% !important; }
	.list-horizontal div.txt{flex:0 0 100%;}
}