@CHARSET "UTF-8";
		.dy-page-section{
			padding: 6rem 0;
		}
	
		.dy-portfolio{
			padding-top: 1rem;
			padding-bottom: 4.5rem;
		}
		
				
		
		.dy-container{ 
			width: 100%; 
			padding-right: 1.5rem; 
			padding-left: 1.5rem; 
			margin-right: auto; 
			margin-left: auto; 
		}
		
		.dy-mt2, .dy-my2{ margin-top : 0.5rem; }
		.dy-mt3, .dy-my3{ margin-top : 1rem; }
		.dy-mt4, .dy-my4{ margin-top : 1.5rem; }
		.dy-mt5, .dy-my5{ margin-top : 3rem; }
		.dy-mb2 { margin-bottom : 0.5rem; }
		.dy-mb3 { margin-bottom : 1rem; }
		.dy-mb4 { margin-bottom : 1.5rem; }
		.dy-mb5 { margin-bottom : 3rem; }
		
		
		
		.dy-text-center { text-align: center }
		
		/* 행 */
		.dy-row{
			display: flex;
			flex-wrap: wrap;
			margin-right: -1.5rem;
			margin-left: -1.5rem;
		}
		/*열에 공통으로 들어가는 설정*/
		.dy-col {
			position: relative;
			width: 100%;
			padding-right: 1.5rem;
			padding-left: 1.5rem;
		}
		
		
		/*미디어쿼리에 따라... */
		
		@media (min-width: 256px){
			.dy-media { max-width: 250px; /* border: 1px solid #f00; */ }
			/*4개의 열이 위치 */
			.dy-col-lg-4{ 	flex: 0 0 100%; 	max-width: 100%; }
		}
		
		@media (min-width: 556px){
			.dy-media { max-width: 530px; /* border: 1px solid #f00; */ }
			/*4개의 열이 위치 */
			.dy-col-lg-4{ 	flex: 0 0 50%; 	max-width: 50%; }
		}
		
		
		@media (min-width: 768px){
			.dy-media { max-width: 720px; /* border: 1px solid #f00; */ }
			/*4개의 열이 위치 */
			.dy-col-lg-4{ 	flex: 0 0 33%; 	max-width: 33%; }
		}
		
		@media (min-width: 992px){
			.dy-media { max-width: 960px; /* border: 1px solid #f00; */ }
			/*4개의 열이 위치 */
			.dy-col-lg-4{ 	flex: 0 0 25%; 	max-width: 25%; }
		}
		
		/*
		@media (min-width: 1200px){
		}
		*/
		
		
		
		
		
		/* 포트폴리오 아이템 외부박스 START*/
		.dy-portfolio-item{
			cursor: pointer;
			position: relative;
			display: block;
			max-width: 25rem;
			overflow: hidden;
			/* border: 1px dashed #00f; */
		}
		.dy-shadow-lg {
			box-shadow: 0 1rem 3rem rgba(0,0,0,0.175);
		}
		.dy-bg-body{
		 	background-color: #fff;
		} 
		.dy-rounded{
			border-radius: 0.5rem;
		}
		/* 포트폴리오 아이템 외부박스 END*/
		/* 포트폴리오 아이템 내부 아이콘박스 START */
		.dy-d-flex{	display: flex; }
		.dy-justify-content-center{ justify-content : center; }
		.dy-portfolio-caption{ 	border-top: 1px solid #1195db; cursor: default;	  }
		.dy-portfolio-caption-heading { font-weight: bold; font-size: 1.1rem;}
		.dy-portfolio-caption-subheading { font-size: 1rem;}
		.dy-text-muted{ color: #6c757d; }
		.dy-portfolio-link { position:absolute; top:40%; right: 5px; cursor: default;}
		
		
		/*포트폴리오 아이콘 START*/
			.dy-connect {
				positon: relative;
				width: 8rem;
				height: 8rem;
				background-color: #002c65;
				border-radius: 50%;
				
				text-decoration: none;
			}
			.dy-connect:hover { background-color: #ffc107; }
			.dy-icon {
				cursor: pointer;
				position:absolute;
				left:50%;
				top:50%;
				transform: translate(-4rem, -6rem);
				width:8rem; 
				height:8rem;
				/* overflow: visible; */
				
			}
		
		/*포트폴리오 아이콘 END*/
		
		/* 포트폴리오 아이템 내부 아이콘박스 END */
		
		
		
		
		
		
/* 치안파트너스 START */
#beforeUserAuth {
    display: block;
}
.userAuthBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    /* border: 1px solid #ddd;
    border-radius: 6px; 
    box-sizing: border-box; */
}

.userAuthTitle {
    flex-shrink: 0;
}

.userAuthAction {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.warningText {
    color: #ad0000;
    font-size: 1rem;
}
.authBtn {
    padding: 0.4rem 0.75rem;
    border: 1px solid #666;
    border-radius: 4px;
    text-decoration: none;
    font-size: 1rem;
    color: #fff; background-color: #004fa8;
}



.replyWrapper {
    padding: 2rem;
}

.replyInputForm {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.replyInputFormLeft {
    width: 20%;
    min-width: 90px;
    font-style: italic;
}

.replyInputFormRight {
    width: 80%;
}

.replyInputFormLabel {
    font-weight: bold;
}
.replyUserName {
    font-weight: bold;
    font-size: 1rem;
}

.replyTextarea {
    width: 100%;
    box-sizing: border-box;
    padding:0.5rem; 
}
.replyPassword {
    width: 250px;
    margin-right:0.5rem;
    padding:0.3rem; 
    border:1px solid #ccc; 
    border-radius:4px; 
    font-size:1rem; 
    box-sizing:border-box; 
    resize:vertical;
}

.replyHint {
    display: inline-block;
    margin-left: 0.5rem;
    font-size: 0.85rem;
    color: #555;
}

.replyBtnArea{
	margin-top: 0.7rem;
}
.replyBtnArea a {
    margin-right: 0.7rem;
    
}

.sendReplyBtn, .sendReplyDeleteBtn, .closeReplyBtn {
	text-decoration:none; padding: 0.7rem; color: #fff; background-color: #004fa8; border-radius:4px;
}

.closeReplyBtn {
	margin-left:3px;margin-right:3px; text-decoration:none; padding: 0.7rem; background-color: #fcebeb; color: #222; border-radius:4px;
}
.authBtn:hover, .sendReplyBtn:hover, .sendReplyDeleteBtn:hover, .closeReplyBtn:hover, .closeReplyBtn:hover {
	text-decoration:none;
}

/* .replyInputForm{ 	display:flex; justify-content:space-between; align-items:center; width:100%; margin-top:1rem; } */
/*
.replyInputFormLeft20{ flex-shrink:0; width:20%; }
.replyInputFormRight80{ flex-shrink:0; white-space:nowrap; width:80%; }
.replyInputFormRight{ flex-shrink:0; white-space:nowrap; }
.replyInputFormLabel{	font-weight:bold; font-size:1.2rem; }
.replyTextarea { 	width:100%; padding:0.6rem; border:1px solid #ccc; border-radius:4px; font-family:inherit; font-size:1.2rem; box-sizing:border-box; resize:vertical; min-height:100px; }
.replyPassword{ 	margin-right:0.5rem; width:30%; padding:0.3rem; border:1px solid #ccc; border-radius:4px; font-family:inherit; font-size:1.2rem; box-sizing:border-box; resize:vertical; }
*/

.replyDeleteBtn{
	cursor:pointer; font-size: 1rem; border: 1px solid gray; text-decoration:none; padding: 0.4rem; color: #222;  border-radius:10px;
}
.replyDeleteBtn:hover {
	color: #fff; background-color: #f67b02;
}
.sendReplyDeleteBtn{
	margin-right:0.5rem; cursor:pointer; font-size: 1rem; border: 1px solid gray; padding: 0.4rem; border-radius:10px; text-decoration:none; color: #fff; background-color: #f67b02; 
}
.replyDeleteProgress button {
	cursor:pointer; font-size: 1rem; border: 1px solid gray; padding: 0.4rem;  border-radius:10px;	
}
ul.replyListBox{
	margin-top: 3rem; width:100%; border-bottom: 1px solid gray;
}




/* 반응형 */
@media (max-width: 768px) {
    .userAuthBox {
        flex-direction: column;
        align-items: flex-start;
    }

    .userAuthAction {
        flex-direction: column;
        align-items: flex-start;
        white-space: normal;
    }

    .authBtn {
        width: 100%;
        text-align: center;
        margin-top: 0.25rem;
    }
    
    
     .replyWrapper {
        padding: 1rem;
    }

    .replyInputForm {
        flex-direction: column;
    }

    .replyInputFormLeft,
    .replyInputFormRight {
        width: 100%;
    }

    .replyInputFormLeft {
        margin-bottom: 0.3rem;
    }

    .replyPassword {
        width: 100%;
    }

    .replyHint {
        display: block;
        margin: 0.25rem 0 0;
    }

    .replyBtnArea {
        display: flex;
        gap: 0.5rem;
    }
    
}
