/* 언어 설정 */
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

:lang(ko)
{
	font-family: "Nanum Gothic", sans-serif;
}



/* 부트스트랩 추가 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
p
{
	margin-top: 0;
	margin-bottom: 0.1rem;
}

.border-success-light
{
	border-color: #CAEADB !important;
}

/* fieldset안의 플로팅 레이블 재처리
	이유는 알수 없는데 fieldset안에서 부트스트랩 값이 재대로 
*/
fieldset div.form-floating label
{
	padding-left: 25px;
}

.display-7
{
	font-size: calc(1.275rem + 0.9vw);
	font-weight: 300;
	line-height: 1.2;
}

.display-8
{
	font-size: calc(1.175rem + 0.3vw);
	font-weight: 300;
	line-height: 1.2;
}

.display-9
{
	font-size: calc(1.075rem - 0.1vw);
	font-weight: 300;
	line-height: 1.2;
}

.display-10
{
	font-size: calc(0.675rem - 0.1vw);
	font-weight: 300;
	line-height: 1.2;
}

.link-info
{
	color: #0dcaf0 !important;
}

.btn-ssm
{
	padding: 0.25rem 0.5rem;
	font-size: .575rem;
	border-radius: 0.2rem;
}

/* 블로그 전체에 같이 사용될 스타일 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */

/* 링크 커스텀
-------------------------------------------------- */
a:link:not(.btn), a:visited:not(.btn)
{
	color: #5a5a5a;
	text-decoration: none;
	/*cursor: auto;*/
	cursor: pointer;
}

a:hover
{
	color: #0d6efd;
	text-decoration: underline;
	cursor: pointer;
}

body
{
	background: #568BF1 url("images/bg003.webp") repeat left top;
}

a:link:not(.btn), a:visited:not(.btn), a:hover:not(.btn), a:active
{
	color: #000000;
}

img
{
	border: 0;
	max-width: 100%;
}

/* 글자 줄임 스타일 */
.EllipsisCell > a
{
	display: table;
	table-layout: fixed;
	width: 100%;
	white-space: nowrap;
}

	.EllipsisCell > a > div
	{
		display: table-cell;
		overflow: hidden;
		text-overflow: ellipsis;
	}

.mCSB_inside > .mCSB_container
{
	margin-right: 0px;
}


.lable-background-color-1
{
	background-color: rgba(255, 255, 255, 0.15);
}

.lable-background-color-black-1
{
	background-color: rgba(0, 0, 0, 0.15);
}

/* iframe 기본값
어느날부터 티스토리에서 iframe을 쓰면 가로크기가 날아가는 현상이 있다.
기본으로 100%로 하여 보정한다.*/
iframe
{
	width: 100%;
}

/* 코드 영역*/
pre 
{
	tab-size: 4;

	padding: 0.5rem 0;
}

/* 티스토리 자체기능 수정 □□□□□□□□□□□□*/

/* 티스토리 글 내용 툴바에 의한 빈공간 제거  */
div.contents_style
{
	display: inline-block;
	width: 100%;
}

div.container_postbtn
{
	float: right;
	clear: none;
	margin-right: 25px;
}

	div.container_postbtn:after
	{
		clear: none;
	}


/* 바디 전체 */
#divBody
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	/*overflow: hidden;*/
}

/* 컨텐츠 영역 */
#divAllContent
{
	/*max-width:1024px;*/
	max-width: 1254px;
	min-width: 280px;
}

@media (min-width: 992px)
{
}

@media (max-width: 992px)
{
	#divAllContent
	{
		margin-left: auto;
		margin-right: auto;
		padding-left: 5px;
		padding-right: 5px;
	}
}


/* 인풋박스 공통 스타일 */
.input-group-addon_Custom
{
	width: 100px;
}

/* 전체 레이아웃 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */

#divNavContainer
{
	/* 59 + 60*/
	/*min-height:119px;*/
	margin-bottom: 5px;
	background-color: #C2E3FF;
	border-radius: 5px;
}

#divSidebarContainer
{
	width: 250px;
	margin-left: 5px;
	padding: 5px;
	z-index: 10;
	overflow-x: hidden;
	background-color: #89c2f1;
	border-radius: 5px;
}


#divContentContainer
{
	margin-bottom: 10px;
}

#divContentContainer
{
	/*padding: 5px;*/
	/*background-color: #E8D9FF;*/
	background-color: #FFF;
	border-radius: 5px;
}

	#divContentContainer .divPage
	{
		position: relative;
		z-index: 100;
		display: inline-block;
		padding: 5px;
		margin-left: 5px;
		margin-right: 5px;
		/*background-color: rgba(255,255,255, 0.1);*/
		border-radius: 5px;
		width: calc(100% - 10px);
		height: 100%;
		min-height: 2rem;
	}

#divPaging
{
	padding: 5px;
	/*background-color: #E8D9FF;*/
	background-color: #FFF;
	border-radius: 5px;
}

/* 푸터 */
#divFooter
{
	height: 35px;
	line-height: 35px;
}

	#divFooter.divFooter
	{
	}

	#divFooter > div > label, #divFooter > div > a
	{
		margin: 0 10px;
	}
	/* 구글 하단 광고 영역 확보용 빈칸*/
	#divFooter > div.divFooterBlank
	{
		height: 80px;
	}

@media (min-width: 992px)
{ /* 992px 이상 */
	#divSidebarContainer
	{
		float: right;
		margin-left: 5px;
	}

	#divContentContainer
	{
		margin-right: 255px;
	}

	.Sidebar_Active
	{
	}

	.Sidebar_Deactive
	{
	}

	#divFooter.divFooter
	{
		margin-right: 255px;
	}
}

@media (max-width: 992px)
{ /* 992px 이하 */
	#divSidebarContainer
	{
		/*position:absolute;*/
		position: fixed;
		right: 10px;
		overflow: hidden;
		top: 65px;
		bottom: 45px;
	}

	#divContentContainer
	{
	}

	.Sidebar_Active
	{
	}

	.Sidebar_Deactive
	{
		display: none;
	}

	#divPaging #divPaginFootSpace
	{
		height: 10px;
	}

	#divFooter.divFooter
	{
	}
}

@media (max-width: 600px)
{ /* 600px 이하 */
	#divPaging #divPaginFootSpace
	{
		height: 70px;
	}
}



/* 네비 바 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
/* 타이틀 바 */
.MainNavbar
{
	min-height: 40px;
	padding-bottom: 0;
	padding-top: 0;
	background-color: rgba(136, 191, 232, 0.50);
}

/* 메인 이미지 */
#divMainImage
{
	position: relative;
	/*bottom:60px;
	margin-bottom: -60px;*/
	min-height: 60px;
	background-image: url("images/Title_ImageTop.webp");
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

#MainImage_AutoWidth
{
	width: 100%;
	min-height: 59px;
}

.MainImage_Bottom
{
	width: 100%;
	background-image: url("images/Title_ImageBottom.webp");
	background-position: left bottom;
	background-repeat: no-repeat;
}


#btnSidebarToggle
{
	display: none;
}

@media (max-width: 992px)
{
	/* 992px 이하 */
	#btnSidebarToggle
	{
		position: fixed;
		top: 0;
		right: 0;
		z-index: 1200;
		display: block;
	}
}



#divMainImage_Name
{
	right: 5px;
	width: 259px;
	height: 59px;
	background-image: url("images/Title_Name.webp");
	background-repeat: no-repeat;
	z-index: 1100;
}

@media (max-width: 992px)
{
	/* 992px 이하 */
	.MainImage_Name_Active
	{
		position: fixed !important;
		top: 1px;
	}
}

@media (min-width: 400px)
{
	/* 400px 이상 */
	#divMainImage_Name
	{
		position: absolute;
		bottom: 0;
	}
}

@media (max-width: 400px)
{
	/* 400px 이하 */
	#divMainImage_Name
	{
		position: fixed;
		top: 1px;
	}
}

/* 3. 사이드 바 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
#divSidebarContainer
{
	z-index: 1000;
}

#divSidebar > div
{
	margin-bottom: 5px;
}


/* 사이드바 타이틀 */
.Sidebar_Item_Title
{
}
/* 사이드바 아이템 바디 */
.Sidebar_Item_Body
{
	padding: 0;
}

.ReplyBody
{
	line-height: 15px;
}

.Sidebar_Item_Body .ReplyContent
{
}

.Sidebar_Item_Body .ReplyInfo
{
	text-align: right;
}

/* 최근글 */
#panRecentPost li
{
	padding-left: 0.5rem;
}

#panRecentPost img
{
	float: left;
	margin-right: 0.3rem;
}

#panRecentPost a.Related_Row
{
	display: inline-block;
	width: 100%;
}

#panRecentPost .RelatedContent_Title
{
	font-size: 0.8rem;
	margin-bottom: 0.2rem;
}

#panRecentPost .RelatedContent_Date
{
	font-size: 0.5rem;
	margin-bottom: 0.0rem;
}

/* 공지 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
#divNoticeCarouselWrap
{
	width: 150px;
}

/* 검색 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
#divSidebar_Search
{
	height: 42px;
}

/* 태그 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ 
	css에서 content를 넣으면 divTagBoxLoop에서 크기가 틀어질수 있다.
*/

#divTagBoxLoop > .item-wrap > .item a
{
	width: auto;
	padding: 5px 8px;
	font-weight: bold;
}

#liTagBoxList
{
	display: inline-block;
}

	#liTagBoxList > a
	{
		float: left;
		margin-right: 10px;
	}

	#liTagBoxList .cloud1
	{
		font-size: 3.0rem;
	}

	#liTagBoxList .cloud2
	{
		font-size: 2.2rem;
	}

	#liTagBoxList .cloud3
	{
		font-size: 1.7rem;
	}

	#liTagBoxList .cloud4
	{
		font-size: 1.2rem;
	}

	#liTagBoxList .cloud5
	{
		font-size: 0.8rem;
	}

/* 카테고리 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
/* 카테고리 컨테이너 */
#divCategory_Container
{
	padding-right: 0;
}

	#divCategory_Container ul
	{
		list-style: none;
	}

	#divCategory_Container a:hover
	{
		background-color: #ffc107;
		border-radius: 0.25rem;
		text-decoration: none;
	}

	#divCategory_Container a.Selected
	{
		background-color: #ffde84;
    border-radius: 0.25rem;
    text-decoration: none;
	}

	#divCategory_Container ul a
	{
		padding: 5px;
	}
	/* 마지막 카테고리 숨기기 - 관리자 전용 카테고리 */
	#divCategory_Container > ul > li:last-child
	{
		display: none;
	}

	#divCategory_Container .CategoryLink
	{
		height: 5px;
	}

	#divCategory_Container ul.sub_category_list
	{
		padding-left: 0rem;
	}

		#divCategory_Container ul.sub_category_list li
		{
			position: relative;
			display: block;
			padding-left: 20px;
		}

			#divCategory_Container ul.sub_category_list li:before
			{
				background: #425668;
				bottom: auto;
				content: "";
				height: 8px;
				left: 10px;
				margin-top: 14px;
				position: absolute;
				right: auto;
				width: 8px;
				z-index: 1;
				border-radius: 50%;
			}



			#divCategory_Container ul.sub_category_list li:after
			{
				border-left: 1px solid #425668;
				bottom: 0;
				content: "";
				left: 14px;
				position: absolute;
				top: 0;
			}



			#divCategory_Container ul.sub_category_list li:last-child::after
			{
				bottom: 50%;
			}

.link_tit .c_cnt
{
	background-color: #337ab7;
}

.link_item .c_cnt
{
	background-color: #5bc0de;
}

.link_sub_item .c_cnt
{
	background-color: #5cb85c;
}



/* 최근 글 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
/* 최근 글 = 카테고리 전체 */
#CategoryMore
{
	float: right;
}

/* 최근 댓글 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
#divReply .Sidebar_Item_Body > div
{
	position: relative;
	display: block;
	padding: 5px 15px;
	margin-bottom: -1px;
	border: 1px solid #ddd;
}

/* 
	페이지 공통 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ 
	(css 이름을 같이쓴다뿐이지 html은 각자 가지고 있어야 한다.)
*/
.PageHeader
{
	border-radius: 5px 5px 50% 50%/5px 5px 3vw 3vw;
	background-image: url("images/Title_ImageTop.webp");
	display: flex;
	flex-direction: column;
	position: relative;
	width: 100%;
	background-color: #a6c8f1;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	filter: blur(3px); /* 파이어폭스 */
	-webkit-filter: blur(3px); /* 크롬,사파리,오페라 */
	-ms-filter: blur(3px); /*익스*/
}

	.PageHeader.OverLapping .ContentOver:after
	{
		content: "";
		display: block;
		height: 12.5vw;
		width: 100%;
	}

	/* 익스플로러용 꼼수 */
	.PageHeader.blur
	{
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0.5);
	}

		.PageHeader.blur:before
		{
			transform: scale(0.5);
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			content: '';
			background-image: inherit;
			background-repeat: inherit;
			background-size: cover;
		}

.PageTitle.OverLapping
{
	position: relative;
	z-index: 99;
	margin-top: calc(-12.5vw - 0rem);
}

/* 홈 커버 페이지 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
#divCoverPopularArticles
{
	height: 400px;
}

#divCover_CarouselWrap > div.carousel-item
{
	height: 400px;
}

	#divCover_CarouselWrap > div.carousel-item > div
	{
		background: #ffffff66;
	}


/* 검색 페이지 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
#divSearchPage.PageHeader
{
	background-color: #25476a;
}

/* 검색 리스트 아이템 
	카테고리를 클릭해도 이곳으로 오게된다.
*/
#divSearchListPage
{
	padding: 24px 0 26px 0;
	/*border-bottom: 1px solid #efefef;*/
	height: 190px;
}

	#divSearchListPage > div:first-child .pPostText, #divSearchListPage > div:first-child .strIndexPostTitle
	{
		background-color: rgba(255,255,255,0.5);
	}

.divSearchListItem
{
	padding: 19px 15px 15px 15px;
	border-radius: 5px;
}

	.divSearchListItem:hover
	{
		background-color: rgba(221,221,221,0.5);
	}

	.divSearchListItem:after
	{
		content: '';
		clear: both;
		display: block;
	}


	.divSearchListItem .aSearchListItemThumbnail
	{
		float: left;
		width: 150px;
		height: 150px;
		margin: 6px 15px 5px 0;
	}

		.divSearchListItem .aSearchListItemThumbnail img
		{
			width: 100%;
			height: 100%;
			/*background-image: url("./image/no-image-icon-23492.webp");*/
			background-image: url("https://tistory1.daumcdn.net/tistory/840796/skin/images/no-image-icon-23492.webp");
			background-size: cover;
		}

	.divSearchListItem .aPostLink .pPostText
	{
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		word-wrap: break-word;
		line-height: 1.2em;
		height: 6.0em;
	}

	.divSearchListItem .aPostLink .pPostText
	{
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		word-wrap: break-word;
		line-height: 1.2em;
		height: 6.0em;
	}

	.divSearchListItem .strIndexPostTitle
	{
		display: block;
		font-weight: normal;
		font-size: 24px;
		line-height: 34px;
		text-overflow: ellipsis;
		white-space: nowrap;
		word-wrap: normal;
		overflow: hidden;
	}

.strIndexPostTitle > img
{
	padding-left: 0px !important;
}

.divSearchListItem #pIndexPostText
{
	display: -webkit-box;
	display: -ms-flexbox;
	display: box;
	overflow: hidden;
	margin-top: 4px;
	font-size: 13px;
	line-height: 23px;
	color: #5c5c5c;
	vertical-align: top;
	word-break: break-all;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

.divSearchListItem .spanIndexTextBar
{
	margin: 0 7px;
}

.divSearchListItem .divSearchListItemDetailInfo
{
	margin-top: 11px;
	font-size: 12px;
	color: #aaa
}

	.divSearchListItem .divSearchListItemDetailInfo .link_cate
	{
		font-size: 13px;
		text-decoration: none;
		color: #6bacce;
	}


@media (max-width: 738px)
{ /* 738px 이하 */
	.divSearchListItem
	{
		padding: 9px 5px 5px 5px;
		height: auto;
	}

		.divSearchListItem .aSearchListItemThumbnail
		{
			margin-top: 1px;
			margin-left: 14px;
		}

			.divSearchListItem .aSearchListItemThumbnail,
			.divSearchListItem .aSearchListItemThumbnail img
			{
				width: 80px;
				height: 80px;
			}

				.divSearchListItem .aSearchListItemThumbnail img
				{
				}

		.divSearchListItem .strIndexPostTitle
		{
			font-weight: bold;
			font-size: 17px;
			line-height: 21px;
			color: #222;
			font-family: applesdgothicneo-light;
			text-overflow: ellipsis;
			white-space: nowrap;
			word-wrap: normal;
			overflow: hidden;
		}

		.divSearchListItem #pIndexPostText
		{
			font-size: 14px;
			line-height: 19px;
			font-family: applesdgothicneo-ultralight;
			-webkit-line-clamp: 2;
		}

		.divSearchListItem .divSearchListItemDetailInfo
		{
			color: #a7a7a7;
			font-family: applesdgothicneo-ultralight;
			margin-top: 4px;
		}

			.divSearchListItem .divSearchListItemDetailInfo .spanIndexTextBar
			{
				margin: 0 2px;
			}

			.divSearchListItem .divSearchListItemDetailInfo .spanIndexTextDate
			{
				font-size: 13px;
			}
}

#divListAd
{
	min-height: 200px;
}

/* 태그 클라우드 페이지 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
.cloud1, .cloud1:before
{
	color: #d24b40 !important;
}

.cloud2, .cloud2:before
{
	color: #6687ed !important;
}

.cloud3, .cloud3:before
{
	color: #f4c5ad !important;
}

.cloud4, .cloud4:before
{
	color: #90b2fe !important;
}

.cloud5, .cloud5:before
{
	color: #f49a7b !important;
}

#divTag
{
	background-color: rgba(255, 255, 255, 0.15) !important;
	display: inline-block;
}

	#divTag > div
	{
		margin: 5px;
		float: left;
	}

		#divTag > div > a:before
		{
			content: "#";
		}

	#divTag .cloud1
	{
		font-size: 5rem;
	}

	#divTag .cloud2
	{
		font-size: 4rem;
	}

	#divTag .cloud3
	{
		font-size: 3rem;
	}

	#divTag .cloud4
	{
		font-size: 2rem;
	}

	#divTag .cloud5
	{
		font-size: 1rem;
	}


/* 2. 콘텐츠 ◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇◇ */
/* 페이지 타이틀 */
.PageTitle
{
	font-size: 20px;
	text-align: center;
	font-weight: bold;
	padding: 10px 0;
}

	.PageTitle > .Titles
	{
		position: relative;
		display: inline-block;
		max-width: 70%;
		padding: 0.5em;
	}

		.PageTitle > .Titles > .Category
		{
			font-size: 12px;
			text-align: left;
		}

			.PageTitle > .Titles > .Category > a
			{
				background-color: rgba(255, 255, 255, 0.50);
				padding: 0 3px;
			}

		.PageTitle > .Titles > .Title
		{
			min-width: 200px;
			font-size: 20px;
			background-color: rgba(255, 255, 255, 0.60);
			padding: 10px;
		}

/* 페이지 정보 레이블 */
.PageInfoWrap
{
	display: inline-block;
}

.PageInfo
{
	float: left;
	font-size: 12px;
	text-align: left;
	color: #000;
	background-color: rgba(255, 255, 255, 0.40);
}

/* 타이틀 < 검색 개수 */
#divSearchCount
{
	font-size: 1.2rem;
	text-align: left;
}


/* 타이틀 < 태그 */
#divPostTag
{
	float: right;
	text-align: right;
}

/* 포스트 본문 □□□□□□□□□□□□□□□□□□□□□□□□ */
#divPost
{
	background-color: #fff;
	border-radius: 5px;
}

/* 포스트본문 css */
#divPostContent div p a,
#divPostContent.MarkdownPost div a
{
	position: relative;
	color: #000;
	text-decoration: none;
}

	#divPostContent div p a,
	#divPostContent.MarkdownPost div a
	{
		box-shadow: inset 0 -8px 0 rgba(0, 255, 0, 0.3);
	}

	#divPostContent div p a:hover,
	#divPostContent.MarkdownPost div a:hover
	{
		box-shadow: inset 0 -14px 0 rgba(0, 255, 0, 0.4);
	}

#divPostContent	blockquote[data-ke-style=style2]
{
	border-color: #d0d0d0;
    border-width: 0 0 0 4px;
		border: 2px dashed #ccc;
		border-left: 6px solid #ccc;
    padding: 1px 0 0 12px;
    color: #666;
    line-height: 1.75;
    font-size: 1em;
    text-align: left;
}


.InsertHtml
{
	background: rgba(245, 245, 245, 0.2);
	border-color: #cfcfcf;
	border-width: 1px;
	border-radius: 0.25rem;
	padding: 1rem 1rem;
	border-style: solid;
}

#divPostContent div .MyArticleLink
{
	background: rgba(245, 245, 245, 0.5);
	border-color: #e3e3e3;
	border-width: 1px;
	border-radius: 0.25rem;
	padding: 1rem 2rem;
	border-style: dashed;
	margin-bottom: 0rem;
}

#divPostContent div .MyArticleLink li a
{
	box-shadow: inset 0 -8px 0 rgba(250, 255, 0, 0.2);
}
#divPostContent div .MyArticleLink li a:hover
{
	box-shadow: inset 0 -14px 0 rgba(250, 255, 0, 0.3);
}
#divPostContent > div
{
	background-color: rgba(255,255,255,0.50);
	border-radius: 5px;
}

/* 콘텐츠 안에 이미지 블록 */
#divPostContent .imageblock img
{
	margin-top: 0.8rem;
}

/* 콘텐츠 안에 이미지 */
.tt_article_useless_p_margin img
{
	display: inline-block;
	max-width: 100%;
	height: auto;
	padding: 0px;
	line-height: 1.42857143;
	background-color: #fff;
	box-shadow: 0 0 3pt 2pt #ddd;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}

.ui-tabs .ui-tabs-panel
{
	padding: 10px;
}


/* 관리자 기능 */
#divAdmin div a, #divAdmin div button
{
	font-size: 10px;
}

/* 포스트 내용 */
#divPostContent
{
	display: inline-block;
	width: 100%;
	padding: 10px 5px 0 5px;
}

/* 포스트의 내용만 감싼 스타일 */
.tt_article_useless_p_margin
{
	margin-bottom: 30px;
}

/* 댓글 */
#aMoveOldUrl
{
	padding: 0.3rem;
}

/* 포스트 본문 - 마크 다운용 css □□□□□□□□□□□□□□□□□□□□□□□□ */
#divPostContent.MarkdownPost > div > h1,
#divPostContent.MarkdownPost > div > h2,
#divPostContent.MarkdownPost > div > h3,
#divPostContent.MarkdownPost > div > h4,
#divPostContent.MarkdownPost > div > h5
{
	margin-top: 24px;
	margin-bottom: 16px;
	font-weight: 600;
	line-height: 1.25;
}

#divPostContent.MarkdownPost > div > h1
{
	padding-bottom: 0.3em;
  font-size: 2em;
  border-bottom: 1px solid hsla(210,18%,87%,1);
}
#divPostContent.MarkdownPost > div > h2
{
	padding-bottom: 0.3em;
  font-size: 1.5em;
  border-bottom: 1px solid hsla(210,18%,87%,1);
}
#divPostContent.MarkdownPost > div > h3
{
	font-size: 1.25em;
}
#divPostContent.MarkdownPost > div > h4
{
	font-size: 1em;
}
#divPostContent.MarkdownPost > div > h5
{
	font-size: 0.75em;
}

/*#divPostContent.MarkdownPost table:not('.hljs-ln')*/
#divPostContent.MarkdownPost table:not(.hljs-ln)
{
	width: max-content;
	max-width: 100%;
	overflow: auto;

	margin-top: 0;
	margin-bottom: 16px;

	border-spacing: 0;
	border-collapse: collapse;
}

#divPostContent.MarkdownPost table:not(.hljs-ln) tr
{
	background-color: #ffffffff;
  border-top: 1px solid hsla(210,18%,87%,1);
}
#divPostContent.MarkdownPost table:not(.hljs-ln) tr:nth-child(2n)
{
	background-color: #f6f8fa;
}

#divPostContent.MarkdownPost table:not(.hljs-ln) th,
#divPostContent.MarkdownPost table:not(.hljs-ln) td
{
	padding: 6px 13px;
	border: 1px solid #d0d7de;
}


#divPostContent.MarkdownPost ul li
{
	margin-top: 1.0rem;
}

#divPostContent.MarkdownPost ol li
{
	margin-top: 1.0rem;
}


/* 콘텐츠 서브 타이틀 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
/* 기존 스킨의 호환성 유지를 위한 코드 */
.SubTableRed
{
	width: 100%;
	border-left: 4px solid #FF0000;
	background-color: #fff;
	margin: 10px 0px 5px 0px;
	padding: 10px 0px;
}

.SubTableYellow
{
	width: 100%;
	border-left: 4px solid #FFFF00;
	background-color: #fff;
	margin: 10px 0px 5px 0px;
	padding: 10px 0px;
}

.SubTableGreen
{
	width: 100%;
	border-left: 4px solid #00CC00;
	background-color: #fff;
	margin: 10px 0px 5px 0px;
	padding: 10px 0px;
}

.SubTableBlue
{
	width: 100%;
	border-left: 4px solid #0000FF;
	background-color: #fff;
	margin: 10px 0px 5px 0px;
	padding: 10px 0px;
}

.SubTableTd1
{
	margin-left: 10px;
}

/* 새로운 서브 타이틀  */
.SubTitle, #divEdition .SubTitle
{
	width: 100%;
	margin: 10px 0px 5px 0px;
	padding: 10px 0px;
}

	.SubTitle > div, #divEdition .SubTitle > div
	{
		border-style: solid;
		border-width: 0 0 1px 4px;
		padding: 10px;
		/*margin: 0 15px 0 5px;*/
		background-color: #fff;
	}

	.SubTitle div h5, #divEdition .SubTitle div h5
	{
		font-size: 18px;
		font-weight: bold;
		margin: 0;
	}

	.SubTitle .Red > div
	{
		border-color: #FF0000;
	}

	.SubTitle.Red > div
	{
		border-color: #FF0000;
	}

	.SubTitle.Yellow > div, #divEdition .SubTitle.Yellow > div
	{
		border-color: #FFFF00;
	}

	.SubTitle.Green > div
	{
		border-color: #00CC00;
	}

	.SubTitle.Blue > div
	{
		border-color: #0000FF;
	}

/* 구글 애드센스 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
.Adsense_Container
{
	width: 100%;
	text-align: center;
	margin: 2rem 0 1rem 0;
	/*background-color: rgb(255, 0, 0, 0.05);*/
	background-color: rgb(255, 0, 0, 0.00);
	min-height: 200px;
	/*padding-right:5px;*/
}

.Adsense_HotPost_Container
{
	width: 100%;
	/*min-height: 500px;*/
	max-height: 420px;
}

#divAd1.Adsense_Container
{
	min-height: 400px;
}

/* 유튜브 크기 조정 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
.youtubeWrap
{
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
}

	.youtubeWrap iframe
	{
		position: absolute;
		width: 100%;
		height: 100%;
	}

/* 하단 추가 컨탠츠 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
/* 좋아요 버튼 모음 */
#divLike
{
	width: 100%;
	display: inline-block;
	margin: 10px 5px;
}

	#divLike > div
	{
		float: right;
	}


#ulRelated, .ulHotPost
{
	list-style-type: none;
	margin-bottom: 3px;
}

.ulHotPost
{
	padding: 0;
}

#ulRelated li
{
	padding: 5px;
	height: 100%;
	min-height: 80px;
}

.ulHotPost li
{
	width: 9rem;
	height: 195px;
	padding: 5px;
	min-height: 80px;
	border: 0;
}

	#ulRelated li:hover, .ulHotPost li:hover
	{
		background: #eee;
		cursor: pointer;
	}

/* 현재글 */
#ulRelated #liRelated_Now
{
	background-color: #97cfff;
}

#ulRelated img, .ulHotPost img
{
	background-image: url("https://tistory1.daumcdn.net/tistory/840796/skin/images/no-image-icon-23492.webp");
	background-size: cover;
}

#ulRelated > li > a > img
{
	float: left;
	margin: 0 10px 0 0;
	width: 70px;
	height: 70px;
}

.ulHotPost > li > a > img
{
	margin: 0 1rem;
	width: 100px;
	height: 100px;
}

#ulRelated li p, .ulHotPost li p
{
	margin-bottom: 0;
}

	#ulRelated li p.RelatedContent_Date, .ulHotPost li p.RelatedContent_Date
	{
		position: absolute;
		float: right;
		bottom: 0px;
		right: 5px;
		background-color: rgba(255, 255, 255, 0.70);
		font-size: 0.7rem;
	}

/* 하단 더보기 컨탠츠  */
#divContentMore .panel .panel-body
{
	padding: 5px;
}


/* 페이징 ◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎◎ */
.pagination
{
	display: inline-block;
	padding-left: 0;
	margin: 20px 0;
	border-radius: 4px;
}

	.pagination > li
	{
		display: inline;
	}

		.pagination > li:first-child > a, .pagination > li:first-child > span
		{
			margin-left: 0;
			border-top-left-radius: 4px;
			border-bottom-left-radius: 4px;
		}

		.pagination > li > a, .pagination > li > span
		{
			position: relative;
			float: left;
			padding: 6px 12px;
			margin-left: -1px;
			line-height: 1.42857143;
			color: #337ab7;
			text-decoration: none;
			background-color: #fff;
			border: 1px solid #ddd;
		}
			.pagination > li > a > span
			{
				color: #337ab7;
			}
			.pagination > li > a:hover
			{
				background-color: #a4f4ff;
			}

			.pagination > li > a:not([href])
			{
				cursor: default;
			}

			.pagination > li > a > .selected
			{
				font-weight: bold;
				color: black;
			}


/* 아래/위 버튼 */
#ulNavTopBottom
{
	position: fixed;
	margin: 0;
	padding: 0;
	right: 0;
	bottom: 0;
	list-style-type: none;
	border-bottom: none;
	border-right: none;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-top-left-radius: 5px;
	background-color: #88BFE8;
	opacity: 0.7;
	z-index: 90005;
}

	#ulNavTopBottom li
	{
		float: left;
		font-size: 0.9rem;
		width: 40px;
		height: 40px;
	}

		#ulNavTopBottom li a
		{
			color: white;
			font-size: 1.8rem;
			line-height: 42px;
			text-align: center;
			width: 40px;
			height: 40px;
			display: inline-block;
		}

	#ulNavTopBottom #goBottomBtn
	{
		border-left: 2px dashed #ccc;
	}
/* 외부 기능 수정 □□□□□□□□□□□□*/

/* 스크롤 바 플러그인 */
.ps-scrollbar-y-rail
{
	z-index: 50;
}


/* 루프 박스 플러그인 공통 */
.promo-carousel
{
	border-bottom: 1px solid #eee;
	padding-bottom: 0;
	overflow: hidden;
}

	.promo-carousel .item-wrap
	{
		transform: translateX(0px);
		/*width: 400%;*/
		position: relative;
		white-space: nowrap;
		display: flex;
	}

	.promo-carousel > .item-wrap > .item
	{
		border-right: 1px solid #eee;
		text-align: center;
		display: flex;
		flex: 1;
		justify-content: center;
		align-items: center;
	}

		.promo-carousel > .item-wrap > .item a
		{
			text-decoration: none;
			display: flex;
			flex: 1;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			line-height: 1.4;
			height: 100%;
			padding: 8px 8px;
		}

/* highlight.js 11 */
/*
 * Visual Studio 2015 dark style
 * Author: Nicolas LLOBERA <nllobera@gmail.com>
 */

.hljs
{
	background: #1E1E1E;
	color: #DCDCDC;
	border-radius: 0.25rem!important;
}

.hljs-keyword,
.hljs-literal,
.hljs-symbol,
.hljs-name
{
	color: #569CD6;
}

.hljs-link
{
	color: #569CD6;
	text-decoration: underline;
}

.hljs-built_in,
.hljs-type
{
	color: #4EC9B0;
}

.hljs-number,
.hljs-class
{
	color: #B8D7A3;
}

.hljs-string,
.hljs-meta .hljs-string
{
	color: #D69D85;
}

.hljs-regexp,
.hljs-template-tag
{
	color: #9A5334;
}

.hljs-subst,
.hljs-function,
.hljs-title,
.hljs-params,
.hljs-formula
{
	color: #DCDCDC;
}

.hljs-comment,
.hljs-quote
{
	color: #57A64A;
	font-style: italic;
}

.hljs-doctag
{
	color: #608B4E;
}

.hljs-meta,
.hljs-meta .hljs-keyword,
.hljs-tag
{
	color: #9B9B9B;
}

.hljs-variable,
.hljs-template-variable
{
	color: #BD63C5;
}

.hljs-attr,
.hljs-attribute
{
	color: #9CDCFE;
}

.hljs-section
{
	color: gold;
}

.hljs-emphasis
{
	font-style: italic;
}

.hljs-strong
{
	font-weight: bold;
}

/*.hljs-code {
  font-family:'Monospace';
}*/

.hljs-bullet,
.hljs-selector-tag,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo
{
	color: #D7BA7D;
}

.hljs-addition
{
	background-color: #144212;
	display: inline-block;
	width: 100%;
}

.hljs-deletion
{
	background-color: #600;
	display: inline-block;
	width: 100%;
}

/* Line Number CSS */
.hljs-ln-numbers
{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	text-align: center;
	color: #ccc;
	border-right: 1px solid #CCC;
	vertical-align: top;
	padding-right: 5px !important;
	padding-left: 5px !important;
}

/* for block of code */
.hljs-ln-code
{
	padding-left: 10px !important;
}