.article-head {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}
.article-head-left {
	display: flex;
	align-items: center;
	padding-right: 15px;
}
.article-head-date {
	padding-right: 20px;
}
.article-head-tags {
	display: flex;
	flex-wrap: wrap;
}
.article-head-tags .tl-tag{
	margin: 3px 10px 3px;
}
.article-head-tags a {
	display: flex;
	white-space: nowrap;
	border: 1px solid #E8E8E8;
	border-radius: 100px;
	padding: 10px 20px;
	font-size: 18.28px;
	font-weight: 400;
	line-height: 19.5px;
	color: #797979;
	text-decoration: none;
}
.article-head-share {
}
.article-head-share-pc {
}
.article-head-share-mob {
	display: none;
}
.article-heading {
	margin-top: 26px;
	display: flex;
	justify-content: space-between;
}
.article-heading-left {
	width: 50%;
	max-width: 768px;
	display: flex;
	flex-grow: 0;
  flex-shrink: 0;
  align-items: flex-start;
}
.article-heading-left img {
	max-width: 768px;
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
}
.article-heading-right {
	padding: 0 0 0 30px;
}
.article-heading-right p {
	padding: 0;
	margin: 0 0 20px;
	font-size: 15px;
	line-height: 24px;
	color: #424242;
}
.toc-wrapper {
}
.toc-title {
	font-size: 22px;
	color: #000;
	font-weight: bold;
	padding: 0 0 5px;
}
.toc-wrapper li {
	font-size: 22px;
	color: #000;
	padding-top: 5px;
}
.toc-wrapper li a {
	font-size: 22px;
	color: #000;
}
.aticle-buttons {
	display: flex;
	justify-content: center;
	padding: 30px 0 15px;
}
.article-content {
	padding-top: 40px;
}
.article-content h1, 
.article-content h2, 
.article-content h3, 
.article-content h4, 
.article-content h5, 
.article-content h6 {
	text-align: center;
}
.article-content blockquote {
	font-size: 18px;
	padding: 0 0 0 75px;
	position: relative;
	margin-bottom: 80px;
}
.article-content blockquote::before {
  content: '';
	position: absolute;
	left: 0;
	top: 5px;
	width: 24px;
	height: 24px;
	overflow: hidden;
	background: url("data:image/svg+xml,%3Csvg width='24' height='23' viewBox='0 0 24 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3_408)'%3E%3Cpath d='M1.33333 0.14624C0.596952 0.14624 0 0.743194 0 1.47957V18.8785C0 20.0664 1.43619 20.6613 2.27614 19.8213L10.5851 11.5124C10.8351 11.2623 10.9756 10.9232 10.9756 10.5696V1.47957C10.9756 0.743193 10.3787 0.14624 9.64228 0.14624H1.33333Z' fill='%23FB8B25'/%3E%3Cpath d='M12.8789 18.8788V1.47982C12.8789 0.743438 13.4759 0.146484 14.2122 0.146484H22.5212C23.2576 0.146484 23.8545 0.743437 23.8545 1.47982V10.5698C23.8545 10.9234 23.714 11.2626 23.464 11.5126L15.155 19.8216C14.3151 20.6615 12.8789 20.0666 12.8789 18.8788Z' fill='%23FB8B25'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3_408'%3E%3Crect width='24' height='22.0976' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat left top;
}
.article-content blockquote b, .article-content blockquote strong {
	font-weight: 400;
	color: #FB8B25;
}
.article-content p img {
	padding: 7px 30px 15px 0;
	width: 100%;
	max-width: 434px;
	height: auto;
}

.article-content ol li, .article-content ul li {
	padding-top: 5px;
	padding-bottom: 5px;
}
.article-content table {
	width: 100%;
	margin-top: 20px;
}
.article-content table td, .article-content table th {
	border: 1px solid #D2E8E3;

}
.article-content table thead td, .article-content table thead th {
	background: #C6E132;
	color: #fff;
	padding: 22px 20px;
	font-size: 16px;
}
.article-content table tbody td, .article-content table tbody th {
	color: #000;
	padding: 19px 16px 12px 17px;
	font-size: 15px;
}
.article-content table ~ p {
	font-size: 12px;
	color: #797979;
	line-height: 21px;
	padding: 15px 0 0;
	margin: 0;
}
.article-video {
	width: 100%;
	position: relative;
	padding-top: 56.25%;
	margin: 58px 0 30px;
}
.article-video iframe {
	border: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.article-content .table {
	width: 100%;
	overflow: scroll;
}
@media (max-width: 768px) {
	.article-heading {
		flex-direction: column;
	}
	.article-heading-left {
		width: 100%;
	}
	.article-heading-right {
		padding: 30px 0 0 0;
	}
}
.articles-tags {
	display: flex;
	flex-wrap: wrap;
}
.hidden-tag {
	display: none !important;
}
.articles-tags a {
	margin: 10px 10px 0 0;
	display: flex;
	white-space: nowrap;
	border: 1px solid #E8E8E8;
	border-radius: 100px;
	padding: 10px 20px;
	font-size: 18.28px;
	font-weight: 400;
	line-height: 19.5px;
	color: #797979;
	text-decoration: none;
}
.articles-tags a.show-hide-btn {
	margin: 10px 10px 0 0;
	display: flex;
	white-space: nowrap;
	border: 0;
	font-size: 18.28px;
	font-weight: 400;
	line-height: 19.5px;
	color: #000;
	text-decoration: underline;
	align-items: center;
}
.articles-tags a.show-hide-btn svg {
	margin-left: 7px;
}
.articles-tags a.show-hide-btn:hover svg path {
	stroke: #fff;
}
.articles-tags a.active, .articles-tags a:hover {
	border-color: #FB8B25;
	background: #FB8B25;
	color: #fff;
}
.articles-list {
	display: flex;
	flex-wrap: wrap;
	padding: 10px 0 40px;
}
.articles-list .post {
	display: flex;
	flex-direction: column;
	width: 100%;
	width: calc((100% - 60px) / 3);
	margin-left: 30px;
	margin-top: 30px;
}
.articles-list .post:nth-child(3n+1) {
	margin-left: 0;
}
.articles-list .post .post-pic {
	width: 100%;
}
.articles-list .post .post-pic img {
	width: 100%;
	height: auto;
	display: block;
}
.articles-list .post .post-date {
	color: #797979;
	font-size: 14px;
	line-height: 32px;
	padding: 8px 0 0;
}
.articles-list .post .post-title {
	color: #000;
	font-size: 21px;
	line-height: 32px;
	padding: 8px 0 0;
}
.articles-list .post .post-title a {
	color: #000;
	font-size: 21px;
	line-height: 32px;
	text-decoration: none;
}
.articles-list .post .post-title a:hover {
	color: #fb8b25;
	text-decoration: none;
}
.articles-list .post .post-anons {
	color: #424242;
	font-size: 17px;
	padding: 10px 0 0;
}
.articles-list .post .post-more {
	color: #000;
	font-size: 17px;
	line-height: 32px;
	padding: 8px 0 0;
}
.articles-list .post .post-more a {
	color: #000;
	font-size: 17px;
	line-height: 32px;
	text-decoration: none;
	padding-right: 36px;
	position: relative;
}
.articles-list .post .post-more a:hover {
	color: #fb8b25;
	text-decoration: none;
}
.articles-list .post .post-more a::before {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	width: 36px;
	height: 19px;
	background: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.40002 2L13 7.2L7.40002 12.4' stroke='black' stroke-opacity='0.8' stroke-width='2' stroke-linecap='square' stroke-linejoin='bevel'/%3E%3Cpath d='M1 6.98571H12.2' stroke='black' stroke-opacity='0.8' stroke-width='2' stroke-linecap='square' stroke-linejoin='bevel'/%3E%3C/svg%3E%0A") no-repeat center center;
}
.articles-list .post .post-more a:hover::before {
	background: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.40002 2L13 7.2L7.40002 12.4' stroke='%23FB8B25' stroke-width='2' stroke-linecap='square' stroke-linejoin='bevel'/%3E%3Cpath d='M1 6.98571H12.2' stroke='%23FB8B25' stroke-width='2' stroke-linecap='square' stroke-linejoin='bevel'/%3E%3C/svg%3E%0A") no-repeat center center;
}
.articles-paging {
	padding: 30px 0 80px;	
}
.articles-paging ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	justify-content: center;
}
.articles-paging ul li {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	justify-content: center;
	width: 42px;
	height: 42px;
}
.articles-paging ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 42px;
	height: 42px;
	color: #000;
	font-size: 18px;
	text-decoration: none;
}
.articles-paging ul li.control a {
	background: #f7e1cc;
}
.articles-paging ul li a.active, .articles-paging ul li a:hover {
	background: #FB8B25;
	color: #fff;
	text-decoration: none;	
}
.articles-paging ul li a:hover svg path{
  stroke: #fff;
}

@media (max-width:991px) {
	.articles-list .post {
		width: calc((100% - 30px) / 2);
		margin-left: 30px;
	}
	.articles-list .post:nth-child(3n+1) {
		margin-left: 30px;
	}
	.articles-list .post:nth-child(2n+1) {
		margin-left: 0;
	}
	.articles-tags a {
		margin: 5px 5px 0 0;
		border-radius: 100px;
		padding: 4px 10px;
		font-size: 13px;
		line-height: 14px;
	}
	.articles-tags a.show-hide-btn {
		margin: 5px 5px 0 0;
		border-radius: 100px;
		padding: 4px 10px;
		font-size: 13px;
		line-height: 14px;
	}
	.articles-list .post .post-date {
		font-size: 13px;
		line-height: 27px;
		padding: 6px 0 0;
	}
	.articles-list .post .post-title {
		font-size: 15px;
		line-height: 21px;
		padding: 6px 0 0;
	}
	.articles-list .post .post-title a {
		font-size: 15px;
		line-height: 21px;
	}
	.articles-list .post .post-anons {
		font-size: 13px;
		padding: 8px 0 0;
	}
	.articles-list .post .post-more {
		font-size: 15px;
		line-height: 21px;
		padding: 6px 0 0;
	}
	.articles-list .post .post-more a {
		font-size: 15px;
		line-height: 21px;
	}
	.articles-paging ul li {
		width: 36px;
		height: 36px;
	}
	.articles-paging ul li a {
		width: 36px;
		height: 36px;
		font-size: 15px;
	}
	.article-head-share-pc {
		display: none;
	}
	.article-head-share-mob {
		display: block;
	}
	.article-head-tags .tl-tag{
		margin-left: 5px;
	}
	.article-head-tags a {
		margin: 3px 6px 3px 0;
		border-radius: 100px;
		padding: 4px 10px;
		font-size: 13px;
		line-height: 14px;
	}
	.article-head-date {
		font-size: 13px;
		line-height: 14px;
	}
	.article-heading-right p {
		margin: 0 0 20px;
		font-size: 14px;
		line-height: 21px;
	}
	.toc-title {
		font-size: 18px;
	}
	.toc-wrapper li {
		font-size: 16px;
		padding-top: 5px;
	}
	.toc-wrapper li a {
		font-size: 16px;
	}
	.article-content blockquote {
		font-size: 16px;
	}
	.aticle-buttons {
		padding: 15px 0 15px;
	}
}
@media (max-width:575px) {
	.articles-list .post {
		width: 100%;
		margin-left: 0;
	}
	.articles-list .post:nth-child(3n+1) {
		margin-left: 0;
	}
	.articles-list .post:nth-child(2n+1) {
		margin-left: 0;
	}
}
.article-heading{
	position: relative;
}
.article-heading::before{
  content: '';
  display: block;
  width: 100vw;
  height: 100%;
  min-height: 635px;
	background: url('/assets/images/article-background.png') no-repeat left top;
	position: absolute;
	left: 0;
	top: 0;
	margin-left: calc(-1 * (100vw - 100%) / 2);
	z-index: -1;
}