@charset "utf-8";

@font-face {
	font-family: 'Pretendard-Regular';
	src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}

* {
	padding: 0;
	margin: 0;
	font-family: 'Pretendard-Regular';
	font-size: 11px;
	color: #111;
	list-style: none;
	text-decoration: none;
	box-sizing: border-box;
	word-break: break-all;
	cursor: default;
	line-height: 15px;
	letter-spacing: 0;
}

input,
textarea,
::placeholder {
	border-radius: 0;
	border: 0;
	background: none;
	outline: none;
	-webkit-appearance: none;
	color: #111;
}

img {
	vertical-align: bottom;
}

a,
a:link,
a:visited,
a:active {
	color: #111;
	text-decoration: none;
}

::-webkit-scrollbar {
	width: 0;
	height: 0;
	background: #00000000;
}

::-webkit-scrollbar-thumb {
	width: 0;
}

html {
	overflow-x: hidden;
}

.clear {
	clear: both;
}

.bold {
	font-weight: bold;
}



/*========== layout ==========*/
#container {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	width: 600px;
	margin: 210px auto 0;
}

#side {
	/*position: fixed;*/
	width: 150px;
	margin-right: 20px;
}

#content {
	width: calc(100% - (150px + 20px));
	margin-bottom: 210px;
}

.profile {
	margin-bottom: 10px;
}

.profile img {
	width: 100%;
}

.came {
	background: #fff;
	text-align: center;
}

.camett {
	width: 100%;
	padding: 10px 0;
}

.cate .link_tit {
	display: none;
}

.cate .home {
	display: inline-block;
	margin-bottom: 10px;
}

.cate {
	display: none;
}

.category_list{
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
}

.category_list > li:first-child{
	padding-top:5px;
}

.category_list>li>a {
	display: inline-block;
	width: 100%;
	padding:5px 10px;
}

.sub_category_list {
	display: none;
	width: 100%;
	padding: 5px 10px;
	background: #eeeeee66;
}

.sub_category_list>li {
	padding: 5px;
}

.menutt {
	padding:5px 10px 10px;
}

.mmcon {
	display: none;
	padding: 5px 0;
	background: #eeeeee66;
}

.mmcon a {
	display: inline-block;
	width: 100%;
	padding: 5px 10px;
}

.mmcon .search input {
	display: inline-block;
	width: 50px;
	margin: 0 auto;
	text-align: center;
}

.paging {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	margin-top: 10px;
	font-size: 0;
	background: #fff;
}

.paging .ptxt {
	padding: 10px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.paging .plink {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	width:70px;
	font-size: 0;
}

.paging a {
	display: flex;
	justify-content: center;
	align-items: center;
	width:50%;
	aspect-ratio: 1;
	font-size: 11px;
}

.paging a>i {
	line-height: 15px;
}





/*========== list ==========*/
#list_n .list_c {
	width: 100%;
	padding: 15px 10px;
	background: #fff;
}

#list_n .list_c .thumb_i {
	display: none;
}

#list_n .list_c .list_t .in{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap:10px;
	width:100%;
}

#list_n .list_c .list_t .title {
	width: calc(100% - 40px);
	overflow:hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

#list_n .list_c .list_t .date {
	width:40px;
	text-align: center;
}

#list_g .inner{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap:10px;
}

#list_g .list_c {
	position: relative;
	width:calc((100% - 20px) / 3);
	padding: 10px;
	background: #fff;
}

#list_g .list_c .thumb_i img {
	width: 100%;
}

#list_g .list_t {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	margin: 10px;
	background: #ffffffaa;
	text-align: center;
}

#list_g .list_t .in {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
}

#list_g .list_t .date {
	display: none;
}





/*========== article ==========*/
.entry .article .title_wrap .title {
	display: inline-block;
	padding: 10px;
	border-bottom: 0 !important;
	font-weight: bold;
	background: #fff;
}

.entry .article .ny {
	padding: 10px;
	background: #fff;
}

.entry .article .detail {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	border-top: 0 !important;
	background: #fff;
}

.entry .article .detail .etc_left{
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.entry .article .detail .etc_left  .date {
	padding: 10px;
}

.entry .article .detail .etc_left .tag_trail {
	padding: 10px;
}

.entry .article .detail .etc_left .tag_trail a:before {
	content: '#';
}

.entry .article .detail .etc_right {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.entry .article .detail .etc_right .admin{
	display:flex;
	flex-direction: row;
}

.entry .article .detail .etc_right .admin a,
.entry .article .detail .etc_right .action_trail a{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 35px;
	aspect-ratio: 1;
}





/*imageblock*/

figure.imageblock.alignCenter{
  margin: 0 auto !important;
} /*image, 1*/

figure.imagegridblock, #tt-body-page figure.imagegridblock{
  margin: 0 auto !important;
} /*image, more than 1 */

figure.imagegridblock .image-container > span{
  margin-top:0 !important;
}/*image, more than 1, margin zero*/





/*blockquote*/
.article blockquote{
  font-size: 11px;
  line-height:15px;
  color:#111;
  letter-spacing: 0.5px;
}

blockquote[data-ke-style='style1']{
  text-align: center;
  margin:10px 0;
}

blockquote[data-ke-style='style1']:before{
  content:'\f10d';
  font-size: 18px;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  font-style: italic;
  display:block;
  margin-bottom:10px;
}

blockquote[data-ke-style='style2']{
  padding:10px;
  margin:10px 0;
}

blockquote[data-ke-style='style3']{
  padding:10px;
  margin:10px 0;
}





/*list style*/

ul[data-ke-list-type='disc'],
ul[data-ke-list-type='circle'],
ol[data-ke-list-type='decimal']{
  padding-left:15px;
}





/*image slide*/

figure.imageslideblock.alignCenter{
  margin:0 auto 10px;
}

figure.imageslideblock div.image-container{
  position: relative;
  padding-bottom: 100%;
  min-width: unset;
  max-width: unset;
  min-height: unset;
  max-height: unset;
	width:unset !important;
	height:unset !important;
  align-items: unset;
}

figure.imageslideblock div.image-container span.image-wrap{
  position:absolute;
  width:100%;
  height:100%;
}

figure.imageslideblock div.image-container img{
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

figure.imageslideblock figcaption{
  color:var(--font-color);
  font-size:1rem;
  padding-top:0;
  min-height: unset;
}





/*moreless*/

div[data-ke-type="moreLess"]{
  margin:10px 0;
}

div[data-ke-type='moreLess'] .btn-toggle-moreless{
  display: inline-block;
  color:#111;
  font-size: 11px;
  line-height: 15px;
  padding:5px 10px;
  background: #fff;
}

div[data-ke-type='moreLess']:not(.open) > .btn-toggle-moreless::before{
  content:'\f107';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right:3px;
}

div[data-ke-type='moreLess'].open > .btn-toggle-moreless::before{
  content:'\f106';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right:3px;
}

div[data-ke-type='moreLess'].open .moreless-content{
  padding:10px;
  margin-top:10px;
  background:#fff;
}





/*download*/
figure.fileblock{
  margin: 10px 0;
  width:200px;
  height: unset;
}

figure.fileblock a{
  position:relative;
  height: unset;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:center;
  align-items: center;
  transition:0.7s;
}


figure.fileblock .image{
  position:relative;
  background: none;
  margin:0;
  width:auto;
  height:auto;
}

figure.fileblock .image:after{
  content:"\f07b";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size:2.5rem;
  padding:15px 10px;
}

figure.fileblock .desc{
  position:relative;
  left:unset;
  right:unset;
  top:unset;
  bottom:unset;
  width:calc(100% - 50.5px);
  padding:15px 10px;
  padding-left:0;
}

figure.fileblock .filename{
  color:#111;
  font-size: 1rem;
  height:auto;
  margin:0;
}

figure.fileblock .name{
  max-width: 95%;
  height:auto;
  font-weight: bold;
}

figure.fileblock .size{
  font-size: 10px;
  color:#aaa;
  height:auto;
  margin:0;

}

figure.fileblock a::after{
  display: none;
}

figure.fileblock a > .down{
  display: block;
  width:100%;
  text-align: center;
  font-weight: bold;
  letter-spacing:1px;
  padding:10px;
  background:#fff;
}

figure.fileblock a > .down > span:after{
  content: '\f358';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size:1rem;
  margin-left:3px;
}

figure.fileblock a:hover .down{
  letter-spacing: 2px;
  transition:0.7s;
}





/*video - 16:9 Optimization*/

.article iframe{
  max-width: 100%;
}

.youtube{
  position:relative;
  width:100%;
  padding-bottom:56.25%;
}

.youtube iframe{
  position: absolute;
  width:100%;
  height:100%;
}





/*codeblock*/

pre[data-ke-type="codeblock"]{
  padding:10px;
  margin:10px 0;
  background:#fff;
}

pre[data-ke-type="codeblock"] > code{
  font-family: 'Pretendard-Regular';
}

pre[data-ke-type="codeblock"] code::-webkit-scrollbar {
  width: 3px;
  height: 3px;
  background: #fff;
}

pre[data-ke-type="codeblock"] code::-webkit-scrollbar-thumb {
  width: 3px;
  height: 3px;
  background:#aaa;
  border:0;
}







/*postbtn*/
.container_postbtn {
	display: none;
	margin-top: 15px;
}

.container_postbtn,
.container_postbtn .postbtn_ccl,
.container_postbtn .btn_post {
	height: auto !important;
	padding: 0 !important;
}

.container_postbtn .postbtn_like {
	padding: 0 !important;
	border-radius: 0 !important;
	border: 0 !important;
}

.container_postbtn .btn_post .txt_like,
.container_postbtn .wrap_btn_etc {
	display: none !important;
}

.container_postbtn .btn_post .ico_like {
	margin: 1px 0 0 !important;
}

.container_postbtn .postbtn_like .wrap_btn {
	padding-right: 5px;
}






.article p > a{
  font-weight:bold;
  color:var(--point-color);
}/*hyperlink*/

h2, h2[data-ke-size]{
  line-height:2.02rem;
}

h3, h3[data-ke-size]{
  line-height: 1.8rem;
}

h4, h4[data-ke-size]{
  line-height: 1.56rem;
}

p[data-ke-size='size18']{
  line-height: 1.4rem;
}

p[data-ke-size='size16']{
  line-height: 1.25rem;
}

p[data-ke-size='size14']{
  line-height: 1.08rem;
}






/*========== protect ==========*/
.protect .title_wrap {
	display: inline-block;
	padding: 10px;
	font-weight: bold;
	border-bottom: 0 !important;
	background: #fff;
}

.protect .article_p {
	position: relative;
	padding: 10px;
	background: #fff;
}

.protect .article_p .pimg img {
	width: 100%;
}

.protect .article_p .back {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #ffffff66;
}

.protect .article_p .back i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 25px;
}

.protect .bottom {
	border-top: 0 !important;
	font-size: 0;
	background: #fff;
}

.protect .bottom .ment {
	float: left;
	padding: 10px;
	width: 60px;
	font-size: 11px;
	text-align: center;
}

.protect .bottom .pwinput {
	float: right;
	padding: 10px;
	width: calc(100% - 60px);
	font-size: 11px;
	text-align: center;
}





/*========== taglog ==========*/
.taglog{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap:10px;
}

.taglog a {
	float: left;
	width: calc((100% - 40px) / 5);
	padding: 10px;
	text-align: center;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	background: #fff;
}


.taglog a:hover {
	font-weight: bold;
}





/*========== notice ==========*/
.n_entry {
	margin-bottom: 20px;
}

.n_entry .title_wrap {
	display: inline-block;
	padding: 10px;
	font-weight: bold;
	border-bottom: 0 !important;
	background: #fff;
}

.n_entry .article {
	text-align: justify;
	padding: 10px;
	background: #fff;
}





/*========== comment ==========*/

.tistoryProfileLayerTrigger{
	display: none !important;
}

.comment_o {
	margin-top: 15px;
}

.comment_list {
	margin-top: 20px;
}

.comment .rp_wrap {
	margin-bottom: 20px;
}

.comment .ltop {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	font-size: 0;
	background: #fff;
}

.comment .rp_top .ltop .name {
	display: flex;
	align-items: center;
	height: 35px;
	padding:0 10px;
	font-weight: bold;
	border-bottom:0 !important;
}

.comment .rp_reply .ltop .name{
	display: flex;
	align-items: center;
	height: 35px;
	padding:0 10px;
	font-weight: bold;
}

.comment .redel {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	font-size: 0;
}

.comment .redel a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 35px;
	aspect-ratio: 1;
}

.comment .desc {
	padding: 10px;
	background: #fff;
}

.comment textarea {
	width: 100%;
	height: 75px;
	padding: 10px;
	resize: none;
	background: #fff;
}

.comment .gtop {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	border-bottom: 0 !important;
	background: #fff;
}

.comment .input {
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	width:120px;
}

.comment .input input {
	width: 50%;
	padding: 10px;
	text-align: center;
}

.comment .cksd {
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: left;
	align-items: center;
	width:70px;
}

.comment .check{
	width:50%;
}

.comment .check label{
	display:flex;
	justify-content: center;
	align-items: center;
	width:100%;
	aspect-ratio: 1;
}

.comment .check input[type="checkbox"] {
	display: none;
}

.comment .check input[type="checkbox"]+label:before {
	content: "\e965";
	font-family: 'xeicon';
}

.comment .check input[type="checkbox"]:checked+label:before {
	content: "\e964";
}

.comment .submit {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50%;
	aspect-ratio: 1;
}

.comment .submit input[type="submit"] {
	font-family: 'xeicon';
	font-weight: bold;
	background: #00000000;
}





/*========== cover ==========*/
.cover_wrap .c_item {
	margin-bottom: 20px;
}

.cover_wrap .title_wrap {
	display: inline-block;
	padding: 10px;
	font-weight: bold;
	border-bottom: 0 !important;
	background: #fff;
}

.cover_wrap .inner {
	padding: 10px;
	background: #fff;
}

.cover_notice .txt {
	text-align: justify;
}

.cover_notice .n-img img {
	width: 100%;
	margin-bottom: 10px;
}

.cover_list .link {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 10px;
}

.cover_list .link:first-child {
	padding-top: 5px;
}

.cover_list .link:last-child {
	padding-bottom: 5px;
}

.cover_gallery .inner {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap:10px;
	padding:10px;
}

.cover_gallery .list_c {
	position: relative;
	width: calc((100% - 30px) / 4);
}

.cover_gallery .list_c:nth-child(4n) {
	margin-right: 0;
}

.cover_gallery .thumb_i img {
	width: 100%;
}

.cover_gallery .list_t {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #ffffff77;
}

.cover_gallery .list_t span {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90%;
	transform: translate(-50%, -50%);
	font-weight: bold;
	text-align: center;
}





/*=====copyright=====*/
.yunicorn a {
	position: fixed;
	left: 13px;
	bottom: 10px;
	font-family: 'Pretendard-Regular';
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 1px;
}
/* 수정 및 삭제 금지 */
/*=====copyright=====*/





@media (max-width:767px) {
	#container {
		flex-direction: column;
		margin: 10% auto;
		width: 80%;
	}

	#side {
		position: relative;
		margin: 0 auto;
		margin-bottom: 20px;
	}

	#content {
		width: 100%;
	}

	.taglog a {
		width: calc((100% - 30px) / 4);
	}

	.taglog a:nth-child(5n) {
		margin-right: 10px;
	}

	.taglog a:nth-child(4n) {
		margin-right: 0;
	}
}