@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@font-face {
    font-family: 'ChosunSm';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@1.1/ChosunSm.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
html, body, input, button, img:hover, img:hover, input:hover, .moreless_fold span, .moreless_top span, a, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), progress !important;}
body,
textarea,
input {
    font: 9pt ChosunSm, sans-serif;
    line-height: 1.0;
}
*{
        box-sizing: border-box;
}

html{
				//background-color:black;
        background: url("images/1.jpg") no-repeat center center fixed; 
        background-size: cover;
		
	-ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

html::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
#container {
	//padding: 20px;
	//background-color: rgba( 255, 255, 255, 0.5);
}

a:link {
    color: #000;
    text-decoration: none;
}
a:visited {
    color: #000;
    text-decoration: none;
}
a:hover {
    color: #000;
    text-decoration: none;
}
a:active {
    color: #000;
    text-decoration: none;
}
#container {
    margin: 100px auto;
    width: 870px;
}
#header {
    padding: 20px 20px 0 10px;
    margin-bottom: 10px;
    font-size: 24pt;
    position: relative;
}
#content {
    width: 680px;
		height: 542px; 
    float: right;
    background-color: #fff;
}
#sidebar {
    /*
        background-image: url("images/sidebar.jpg");
        background-repeat: no-repeat;
        background-size: cover;
    */
    width: 180px;
    height: auto;
    float: left;
    background-color: #fff;
    padding: 10px;
    position: relative;
}
.mobile_open {
    display: none;
    cursor: pointer;
}
.wrap {
	margin: 10px
}
.wrap img {
        border-radius: 90px;
        display: block;
        width: 130px;
        margin: 5px auto;
}
.sidebarMenu {
    display: inline;
    position: absolute;
    right: 0;
    bottom: 0;
}
.sidebarMenu a {
    transition: color 500ms;
    font-size: 13px;
    padding-right: 5px;
}
.sidebarMenu a:hover {
    color: #6F6DE8;
}
.profile {
	padding-top: 30px;
    padding-bottom: 20px;
}
.profile span {
		line-height:2.5;
}

/* 카테고리 */
.tt_category {
        margin-top: 20px;
}
.category ul {
    list-style-type: none;
    padding: 0;
}

.category > ul > li > a { 
        display:none; 
} 

.category a {
    width: 100%;
    transition: background-color 500ms, color 500ms;
    height: 25px;
    display: block;
    line-height: 30px;
}
.category a:hover {
    background-color: rgba(1, 1, 1, 0.5);
    color: #fff;
}
.category ul li {
    width: 150px;
}
.category ul li ul li ul li {
    padding-left: 10px;
		 padding-right: 10px;
}
.category ul li ul li ul li a:before {
    content: "\f105";
    font-family: fontawesome;
}
.category a:last-child {
		margin-bottom: 20px;
}
/* 검색 */
.search {
    margin-bottom: 10px;
    height: 75px;
}
.search input {
    width: 75%;
    border-width: 0 0 1px 0;
    border-color: #000;
    outline: none;
}
.search input:focus {
}
.search a.submit {
    width: 20%;
    cursor: pointer;
}
/*커버*/
.featured img{
    max-width: 100%;
    display: block;
}
.featured {
    padding: 10px;
    font-size: 8pt;
}
.gal{
        overflow: hidden;
        width: auto;
}
.cover_gal {
    width: 20%;
    float: left;
    position: relative;
    left: 0;
    right: 0;
}
.cover_gal:after {
    content: "";
    display: block;
    padding-bottom: 100%;
}
.cover_gal .thumb {
    position: absolute;
    width: 90%;
    height: 90%;
    margin-left: auto;
    margin-right: auto;
        top: 5%;
    left: 0;
    right: 0;
    cursor: pointer;
    overflow: hidden;
    z-index: 0;
        border: 1px solid #000;
        background-color: #fff;
}
.cover_gal img {
    width: 100%;
    height: 100%;
        position:absolute;
}
.cover_gal .title_wrap {
    position: absolute;
        width: 100%;
        height: 100%;
    cursor: pointer;  
}
.cover_gal .title {
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    line-height: 1;
    height: 3;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    top: 50%;
        left:0;
        right:0;
    transform: translate(0, -50%);
}
/* 태그 클라우드 */
.taglog {
    padding: 10px;
}
.taglog ul {
    padding: 0;
    margin: 0;
}
.taglog ul a:before {
    content: "#";
}
a.cloud1 {
    font-size: 28px;
    background-color: #000;
    color: #fff;
}
a.cloud2 {
    font-size: 24px;
    color: #6F6DE8;
}
a.cloud3 {
    font-size: 1q8px;
    color: #6F6DE8;
}
a.cloud5 {
    font-size: 13px;
    color: gray;
}
.taglog ul li {
    display: inline;
}
/* 방명록, 댓글 */
input.name,
input.password,
input.homepage {
    background-color: #fff;
    border: 1px solid #000;
    width: 33.333%;
    float: left;
    outline: none;
}
.guestWrite,
.commentWrite {
    padding: 10px;
    border-bottom: 1px solid #000;
}
textarea {
    width: 100%;
    border: 1px solid #000;
    resize: none;
    outline: none;
}
.secretWrap {
    display: block;
}
input.submit {
    background-color: #fff;
    border: 1px solid #000;
}
.guestList p,
.commentList p {
    margin: 0;
}
.guestList span,
.commentList span {
    color: gray;
}
.guestList span a,
.commentList span a {
    color: gray;
}
.guestList ol,
.commentList ol {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.guestList li,
.commentList li {
    list-style-type: none;
}
.guestList ol > li,
.commentList ol > li {
    border-bottom: 1px solid #000;
    padding: 10px;
}
span.name {
    color: #000;
}
span.name a {
    color: #6F6DE8;
}
.search_list {
    padding: 17px;
    border-bottom: 1px solid lightgray;
    clear: both;
}
.search_list span {
	color: gray;
	font-size: 6px;
}
/* 갤러리형 */
#list_wrap{
	margin: 15px 0px;
	width: 100%;
}
.list_content_gal {
    width: 33.333%;
    float: left;
    display: block;
    position: relative;
	margin-bottom: 10px;
}
.list_content_gal:after {
    content: "";
    display: block;
    padding-bottom: 100%;
}
.list_content_gal .thumb {
    position: absolute;
    width: 92%;
    height: 92%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 5%;
    cursor: pointer;
    overflow: hidden;				
		border-radius: 50%;
    background-color: #fff;
}


.thumb img {
    width: 100%;
    height: 100%;
        position: absolute;
        left: 0;
        z-index: 1;
        transition: all ease 500ms;
}
.thumb img:hover{
        opacity: 0.5;
}
.list_content_gal .title_wrap {
        width: 100%;
        height: 100%;
}
.list_content_gal .title {
        position: absolute;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
	  padding: 20px;
    line-height: 1;
    height: 3;
        z-index: 0;
        top: 50%;
        left: 0;
        right: 0;
        transform: translate(0, -50%);
}
.list_content_gal {
    text-align: center;
}
.list_content_gal .title_date {
    display: none;
}
/* 일반 목록형 */
.list_content_list {
    transition: background-color 500ms ease, color 500ms;
}
.list_content_list .title_wrap {
    width: 100%;
    height: 50px;
    margin: auto;
    display: flex;
    align-items: center;
    overflow: hidden;
    cursor: pointer;
    padding: 10px;
}
.list_content_list:hover {
    background-color: rgba(0, 0, 0, 0.5);
        color: #fff;
}
.list_content_list .thumb img {
    display: none;
}
.list_content_list .thumb img {
    width: 50px;
}
.list_content_list .title {
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    line-height: 1;
    height: 2;
}
.list_content_list .title hover {
    color: #fff;
}
.list_content_list .title:hover a {
    color: #fff;
}
.list_content_list .title_date {
    display: inline-block;
}
/* 본문 */
.article_permalink {
	height: 496.2px;
	overflow: auto;
	
	-ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}
.article_permalink::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
.area_view {
    padding: 10px;
	
}
.area_view img{
        max-width: 100%;
        height: auto;
}
.article_title {
    padding: 10px;
    text-align: center;
    font-size: 9pt;
		font-weight: bold;
		line-height: 1.5
}
.article_title p {
    margin: 0;
}
.article_title a {
    font-size: 7pt;
		color: gray;
		font-weight: normal;
}
.rep_date {
    font-size: 8pt;
		color: gray;
		font-weight: normal;
}
.tagTrail a {
    font-size: 10pt;
    color: #808080;
}
.tagTrail a:before {
    content: "#";
    color: #808080;
}
blockquote {
    color: #333;
    margin: 15px 0;
    padding: 5px 5px 10px 20px;
    border-left: solid 4px #000;
    background-color: #f0f0f0;
}
.moreless_fold:before {
    content: "\f107";
    font-family: "FontAwesome";
}
.moreless_bottom {
    display: none;
}
.moreless_top:before {
    content: "\f106";
    font-family: "FontAwesome";
}
.moreless_content {
    color: #333;
    margin: 15px 0;
    padding: 5px 5px 10px 20px;
}
/*#content span img {
    border: 1px solid #000;
}
#content a.tx-link {
    border-bottom: 2px solid #000;
}*/
.commentToggle {
    padding: 10px;
}
.container_postbtn {
	padding-bottom: 10px !important;
}
.container_postbtn .postbtn_like  {
    float: center !important;
	  font-size: 0 !important;
		color: #bebebe;
}
div.another_category {
    border-color: #000 !important;
}
div.another_category h4{
    border: 0!important;
    color: #000!important;
}
div.another_category h4 a, div.another_category a{
    color: #000!important;
}

#paging {
    padding: 20px 10px 11px 10px;
    text-align: center;
    display: block;
    clear: both;
}
#paging span{
	color: white;
}
#paging .fas {
	color : white;
}
#paging span.selected {
    color: #ffc83d;
}
#paging .no-more-prev .fas, #paging .no-more-next .fas{ 
    color: #505050 !important;
}

#footer {
    width: 100%;
    clear: both;
    text-align: center
}
@media(max-width: 830px) {
    .mobile_open {
        display: block;
			
    }
    #container {
        width: auto;
			margin-top: 0px;
			padding-top : 0px;
    }
    #sidebar {
        float: none;
        width: 100%;
        display: block;
        height: auto;
        border-bottom: 0;
    }
    .wrap {
        display: none;
        padding-top: 10px;
    }
        .wrap img {
                margin: 10px;
}
    .search input {
        width: 40%;
    }
    .title {}
    #content {
        width: 100%;
			height: auto;
        display: block;
    }
	#list_wrap{
		font-size: 8pt;
	}
}
@media(max-width: 740px) {
    #header {
        font-size: 24px;
    }
    body,
    input,
    textarea,
    blockquote,
    .tagTrail {
        font-size: 9pt;
    }
    .title {}
    .list_content {
        width: 33.33%;
    }
    .search input {
        width: 75%;
    }
    .paging {
        font-size: 8pt;
    }
}