@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,400&display=swap');

html {
    background-color: #f1f1f1;
overflow: auto;
}


header {
	background-color: #f1f1f1;
background-image: url("./images/head1.jpg");
    margin: auto;
	  margin-top: -5px;
    width: 600px;
    padding: 0px 5px 5px;
    border: solid;
	   border-color: #545454;
    border-width: 3px;
    padding: 10px;
	
}

.sns {
    float: right;
    margin-top: -30px;
    font-weight: 700;
    letter-spacing: 2px;
    background: #fff;
    padding: 5px;
    border: solid;
    border-width: 1.2px;
    border-color: #e0e0e0;
    border-top-style: dashed;
    border-top-width: 2px;
}
.sns a:hover {
    transition:0.5s;
	color:#6a91a7;
}
/*프로필*/
.logo-text {
    position: relative;
    top: -100px;
    color: #fff;
    letter-spacing: 2px;
	font-weight: 700;
}

.logo img:hover {

  -webkit-filter: grayscale(100%);

  -webkit-transition: .5s ease-in-out;

  -moz-filter: grayscale(100%);

  -moz-transition: .5s ease-in-out;

  -o-filter: grayscale(100%);

  -o-transition: .5s ease-in-out;

} 



.logo img {

  -webkit-filter: grayscale(0%);

  -webkit-transition: .5s ease-in-out;

  -moz-filter: grayscale(0%); 

  -moz-transition: .5s ease-in-out;

  -o-filter: grayscale(0%); 

  -o-transition: .5s ease-in-out;

}
.logo img {
    width: 400px;
    border: solid;
    border-radius: 10px;
    box-shadow: 5px 5px 0px #6f6f6f;
	position: relative;
    top: 30px;
}



body {
    padding: 10px;
    font-family: 'Noto Sans KR', sans-serif;
	line-height: 20px;
}

/*홈*/
.title {
    padding: 2px;
    border-color:  #545454;
    background: #fff;
    border-style: ridge;
    cursor: pointer;
    width: 617px;
    margin: 2px auto;
}
span.title-text:hover{
	letter-spacing:2px;
	transition:0.5s;
	color: #545454;
}
.title a {
    color: #76767a;
    padding: 4px;
    font-weight: 600;
    font-size: 12px;
    position: relative;
    bottom: -1px;
}


.icon {
    float: right;
	margin-top: -1.2px;
}
.fas.fa-exclamation-circle {
		background:#f1f1f1;
	padding:5px;
	border-radius:100px;
}
.far.fa-envelope{
	background:#f1f1f1;
	padding:5px;
	border-radius:100px;

}
.far.fa-envelope:hover{
	background:#e0e0e0;
	padding:5px;
	border-radius:100px;
	transition:0.5s;

}
.far.fa-kiss-wink-heart{
		background:#f1f1f1;
	padding:5px;
	border-radius:100px;

}
.far.fa-kiss-wink-heart:hover{
	background:#e0e0e0;
	padding:5px;
	border-radius:100px;
	transition:0.5s;

}
.xi-home{
	background:#f1f1f1;
	padding:5px;
	border-radius:100px;

}
.xi-home:hover{
	background:#e0e0e0;
	padding:5px;
	border-radius:100px;
	transition:0.5s;

}
.heart {
    font-size: 15px;
    letter-spacing: 5px;
    font-weight: bold;
    color: #346825;
    text-shadow: none;
    font-weight: bold;
    text-shadow: 3px 0px 0px #efda8c;
}

/*카테고리*/
.accordion {
    background: #ffe207;
    color: #545454;
    cursor: pointer;
    width: 80%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    font-size: 10px;
    font-weight: 600;
    border-radius: 10px;
    padding: 15px;
    text-align: center;
    box-shadow: 0px 3px 0px inset;
    border: solid;
    font-size: 13px;
    letter-spacing: 1.1px;
    position: relative;
    z-index: 3;
	display: grid;
	margin:2%;
	position: relative;
    top: -80px;
}
.active, .accordion:hover {
  background-color: #ccc;
}

.accordion:after {
  content: '\002B';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}
.cate-text {
    border-bottom-style: dashed;
    border-bottom-width: 1.5px;
}
.catebox {
 padding: 0 10px;
    background-color: white;
    max-height: 0;
    transition: max-height 0.5s ease-out;
    width: 100px;
   overflow: scroll;
	overflow-x: auto;
	position: relative;
    top: -80px;
	  box-shadow: 3px 3px 0px #000;

}
.catebox li {
    margin-right: -6px;
    border: solid;
    border-radius: 10px;
    background: #f1f1f1;
	margin: 2%;
}
.catebox li:hover {
	transition:0.5s;
	background-color: #ccc;
}

.category {
    width: 30%;
    color: #595959;
    letter-spacing: 1.2;
    font-size: 10px;
    font-weight: 600;
	
	
}

/*검색*/
.search {
    width: 100px;
    display: unset;
    position: relative;
    top: -2px;
}

button.search.submit {
    width: 22px;
    border: none;
    background: #f6d881;
    color: #fff;
    font-size: 10px;
    padding: 4px;
    display: table-row-group;
    border: solid;
    border-width: 1.3px;
    border-color: #efd795;
}


input[type="text"] {
    background: #eee;
    border-style: inset;
    font-size: 10px;
    border: none;
    padding: 3px;
    font-weight: 600;
    border: solid;
    border-width: 1.3px;
    border-color: #e0e0e0;
    width: 100px;
}

.article-control {
    display: -webkit-inline-box;
}

/*본문타이틀*/
.titleWrap {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 2px;
    text-align: left;
    margin: 10px auto;
    padding: 6px;
    background-color: #333;
    border: solid;
    border-width: 1.3px;
    border-color: #f1f1f1;
    margin-top: -10px;
}

.titleWrap a {
    color: #fcfcfc;

}

.admin {
    float: right;

}

.fas.fa-times {
    position: relative;
    top: -2px;
    background: #fff;
    padding: 4px;
    width: 10px;
    border: solid;
    border-width: 1.3px;
    border-color: #e0e0e0;
    color: #969696;
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
    content: "\f00d";
    position: relative;
    left: 1px;
}

.fas.fa-minus {
    position: relative;
    top: -2px;
    background: #fff;
    padding: 4px;
    width: 10px;
    border: solid;
    border-width: 1.3px;
    border-color: #e0e0e0;
    color: #969696;
}

.fa-minus:before {
    content: "\f068";
    position: relative;
    bottom: -6px;
    color: #969696;
}

.far.fa-window-maximize {
    position: relative;
    top: -2px;
    background: #fff;
    padding: 4px;
    width: 10px;
    border: solid;
    border-width: 1.3px;
    border-color: #e0e0e0;
    color: #969696;
}

article {
    background: #f5f5f5;
    margin: auto;
    padding: 10px;
    margin-top: -10px;
    border: solid;
    border-width: 1.3px;
    border-color: #ececec;
  
}

a.articl_title {
    padding: 0 0 0 15px;
}

.date {
    display: inline-block;
}


#container {
    width: 600px;
    margin: 10px auto;
    border-color: #888;
    overflow-x: hidden;
    overflow-y: visible;
    background: #ffffff;
    border: solid;
    border-width: 3px;
    border-color: #545454;
    padding: 10px;
}
#content {
padding: 15px 10px;
 font-size: 12px;
    font-weight: 600;
}



/*공지*/
.entryNotice {
    font-size: 10px;
    padding: 10px;
    margin: auto;
	
}

/*페이징*/
.pag {
    display: -webkit-inline-box;
}
.fas.fa-arrow-left:hover{
		background:#f1f1f1;
	padding:5px;
	border-radius:100px;
	transition:0.5s;
}
.fas.fa-redo:hover{
		background:#f1f1f1;
	padding:5px;
	border-radius:100px;
	transition:0.5s;
}
.fas.fa-arrow-right:hover{
		background:#f1f1f1;
	padding:5px;
	border-radius:100px;
	transition:0.5s;
}

.paging {
    margin: 10px;
    text-align: center;
    font-size: 10px;
    font-weight: bolder;
	padding: 15px;
}
span.NEXT {
    float: right;
}
span.PREV {
    float: left;
}
/*갤러리형*/
.list-title {
    font-weight: 700;
    font-size: 12px;
}
.list_content img {
    width: 100%;
    display: inline-block;
	 border: solid;
    box-sizing: border-box;
	border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
.list_gal {
    width: 30%;
    display: inline-block;
margin: 15px 8px 10px;

}
.list_content img:hover{
	transition:0.5s;
	opacity: 0.5;
}
.list_gal_title{
padding: 6px 10px;
    border: 1px solid #000;
    border-top: 0px;
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 10px;
    font-weight: 700;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background: #f1f1f1;
    border: solid;
    border-color: #4c4c4c;
    border-top: none;
    width: 100%;

}
span.list_date {
    display: block;
}

/*보호글*/

.entryProtected {
    font-size: 11px;
    font-weight: 700;
    	text-align: center;
}
.pass_pro input {
    width: 100px;
    border: solid;
}
input.submit_pro {
    width: 70px;
    background: #fff;
    color: #fff;
    background: #000;
    padding: 3.5px;
}
.protected {
    width: 30%;
    display: inline-block;
margin: 15px 8px 10px;
}
/*보호글 썸네일*/
.pro_titilew {
    padding: 6px 10px;
    border: 1px solid #000;
    border-top: 0px;
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 10px;
    font-weight: 700;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background: #f1f1f1;
    border: solid;
    border-color: #4c4c4c;
    border-top: none;
    width: 100%;
	padding: 16px;
}

img.gal_img {
    width: 100%;
    display: inline-block;
    border: solid;
    box-sizing: border-box;
border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
/*탑버튼*/
#top {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 15px;
    border: none;
    outline: none;
    color: white;
    cursor: pointer;
    padding: 5px;
    border: solid;
    border-width: 3px;
    border-color: #b4b4b4;
}
#top:hover {
	transition:0.5s;
  background-color: #555;
}
/*댓글*/
.rp_desc {
    border-bottom-style: solid;
    border-bottom-width: 1.2px;
    margin: 1%;
    border-top-width: 1.2px;
}
.commentList {
    font-weight: 600;
    letter-spacing: 1.2px;
    font-size: 10.5px;
    padding: 0px;

    border-color: #e0e0e0;
}
.actionTrail {
    font-size: 11px;
    font-weight: 800;
   
}
.control {
    font-size: 10px;
    letter-spacing: 2px;
    padding: 5px;
}

input#password {
    width: 80px;
    border: solid;
}
label#password {
    font-size: 12px;
    border-bottom: solid;
}
input#guest_name {
    width: 80px;
    background: #fff;
    border: solid;
}
label#name {
    font-size: 12px;
    border-bottom: solid;
}
textarea#comment-textarea {
    width: 580px;
    height: 100px;
    border: solid;
    border-width: 1.5px;
   
}
input#rp_submit {
    border: none;
    border: solid;
    font-size: 10px;
    font-weight: 800;
}
/*방명록*/

.writeinfo {
    margin: 10px;
}
input#guestname {
    width: 80px;
    background: #fff;
    border: solid;
	margin: 1%;
}
label#guest_name{
	 font-size: 12px;
    border-bottom: solid;
	
}

input#guest_pass {
	width: 80px;
    background: #fff;
    border: solid;
	margin: 1%;
}
label#guest_pass{
	 font-size: 12px;
    border-bottom: solid;
}
textarea#guest_textarea {
    width: 575px;
    border: solid;
    height: 100px;
    margin: 5px;
}
input#guestsubmitok {
    border: solid;
    font-size: 10px;
    font-weight: 700;
    padding: 2px;
    margin: 5px;
	    letter-spacing: 1.2px;
}
span.guest_desc {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
}
span.guest_rep_name {
    font-size: 12px;
    font-weight: bold;
   
}
.xi-emoticon-smiley-o {
    font-weight: 700;
}
.guest-text {
    padding: 10px;
    font-size: 12px;
    font-weight: bold;
    background: #f1f1f1;
    border-bottom: solid;
}
.guest_admin {
    margin: 2%;
    
}
span.guest_desc p {
    border-bottom-style: dashed;
}
#guestList ul {
    padding: 9px;
}
#guestList {
    border: solid;
}
#guestList ol {
    padding: 0;
    margin: 10px;
}




/*카피라이트삭제금지*/
.footer {
    margin: auto;
    font-size: 10px;
    color: #0000;
}


::-webkit-scrollbar {
display:none;
  
}