.view-collection {
	width: 100%;
	position: relative;
}
.view-collection .media {
	padding: 10px 10px;
	border-bottom: 1px dotted #e1e1e1;
}
.img-thumbnail {
	width: 120px;
	height: 120px;
	vertical-align: middle;
}
.media h5 {
	font-size: 16px;
}
.media div {
	font-size: 13px;
	line-height: 1.5em;
	/* padding: 2px 0; */
}
.tree-wrap {
	min-height: inherit;
}
.page-sub-title {
	padding: 10px 0;
}
/* .page-view .rowbox, .rowbox, .page-view .bottom-box {
} */
.article-view .page-info, .more-view .page-info {
	padding: 10px 0;
}
.pageCtrl {
	padding: 20px 10px;
}
.page-view .tree-list {
	height: 90%;
}

.srched-box {
	padding: 10px 0;
	width: 100%;
}
.con-info ul, .con-info .writer-list {
	padding: 10px 0 0;
}
.con-info ul li, .con-info .writer-list {
	font-size: 15px;
}
.con-txt {
	margin: 10px 0 0;
}

@media (min-width :320px) {
	.service-nav {
		display: inline-table;
		position: absolute;
		top: 0;
		right: 70px;
		padding: 0;
		text-align: right;
		top: 7px;
	}
	.view-collection {
		display: block;
		width: 100%;
	}
	.title-srch {
		padding: 15px;
	}
	.page-wrap {
		padding: 10px 0;
	}
	.pagination {
		width: 100%;
	}
	.page-view .view-collection {
		max-width: 100%;
	}
	.filter-wrap, .tree-list {
		box-sizing: border-box;
		overflow: auto;
	}
	.filter-wrap {
		padding: 10px 10px 100px;
	}
	.tree-list {
		padding: 0;
		max-height: 100%;
	}
	.basic-info {
		max-width: 100%;
		padding: 10px;
	}
	.page-view .page-info {
		width: 100%;
	}
	.info-toggle {
		display: none;
		top: 10px;
	}

	.page-title h3 {
		font-size: 18px;
	}
	.page-view .thumb {
		width: 200px;
		margin: 0 auto 20px;
	}
	.page-view .thumb img {
		width: 100%;
	}
	.infoBox {
		padding-left: 15px;
		padding-right: 15px;
	}
	.rowbox .subdiv label {
		font-size: 16px;
		padding: 0 20px 0 0;
		font-weight: 500;
	}
	.page-info .subdiv label {
		font-size: 14px;
		padding: 0 0 15px;
	}
	.page-info .subdiv span {
		font-size: 14px;
	}
	.writer-list li, .rowbox p {
		font-size: 14px;
	}

	/* 검색결과 engine list */
	.srched .view-collection {
		width: auto;
		padding: 10px 0;
	}
	.srched-box {
		padding: 10px 0;
	}
	.con-info ul li {
		font-size: 14px;
		padding: 0 5px 0 0;
		border-right: 1px solid #ccc;
		line-height: 10px;
	}
	.con-txt {
		font-size: 14px;
	}

	.srched-page.article-view .page-view {
		width: 100%;
	}
	.writer-info {
		display: block;
		width: 100%;
	}
	.writer-info li {
		font-size: 14px;
	}
	.writer-info li span {
		min-width: 70px;
	}
	.con-info ul.writer-list {
		max-width: 575px;
	}
	.tree-wrap {
		border-left: 0px solid #e1e1e1;
		border-right: 0px solid #e1e1e1;
		min-height: 1280px;
		width: 0px;
		display: table-cell;
	}
}

@media (min-width: 576px) {
	.service-nav {
		display: inline-table;
		position: absolute;
		top: 0;
		right: 70px;
		padding: 0;
		text-align: right;
		top: 7px;
	}
	.info-toggle {
		display: none;
	}
	.srched-box {
		padding: 10px 0;
	}
	.page-view .view-collection {
		max-width: 100%;
	}
	.filter-wrap, .tree-list {
		box-sizing: border-box;
		overflow: auto;
	}
	.filter-wrap {
		padding: 10px 10px 100px 0px;
	}
	/*     .tree-list {padding:0; max-height:100%;} */
	.page-title {
		height: auto;
		padding-top: .625rem;
		padding-bottom: .625rem;
	}
	.page-title h3 {
		font-size: 20px;
	}
	.page-view .thumb {
		width: 200px;
		margin: 0 auto 20px;
	}
	.page-view .thumb img {
		width: 100%;
	}
	.page-view .page-info {
		display: block;
		width: 100%;
		padding: 10px 0;
	}
	.page-info .subdiv label, .page-info .subdiv span {
		font-size: 15px;
	}
	.con-info ul li {
		font-size: 14px;
		padding: 0 5px 0 0;
		border-right: 1px solid #ccc;
		line-height: 10px;
	}
	.page-view .view-tree {
		display: none;
	}
	.infoBox {
		padding-left: 15px;
		padding-right: 15px;
	}

	.tree-wrap {
		border-left: 0px solid #e1e1e1;
		border-right: 0px solid #e1e1e1;
		min-height: 1280px;
		width: 0px;
		display: table-cell;
	}
}

@media (min-width : 768px) {
	.view-tree.main-category {
		position: relative; /* display:table-cell!important; */
	}
	.page-view .view-tree {
		width: 220px;
		max-width: 100%;
	}
	.search-wrap {
		position: absolute;
		left: 50%;
		margin-left: -140px;
		top: -7px;
	}
	.service-nav {
		display: block;
		position: absolute;
		right: 0;
		padding: 0;
		text-align: right;
		top: 7px;
	}
	.view-tree.main-category {
		visibility: visible;
		box-shadow: none;
	}
	.view-collection {
		/* border-right:1px solid #e1e1e1; border-left: 1px solid #e1e1e1; */
		/* overflow: hidden; */
		padding: 0;
		width: auto;
	}
	.navbar-light .navbar-toggler-icon {
		display: none;
	}

	.page-view .view-tree {
		position: relative;
		visibility: visible;
		display: table-cell;
		padding: 0 0 25px;
		box-shadow: none;
	}

	.page-view .tree-list { /*height:93%;*/
		height: auto;
	}

	.page-view .tree-list a {
		padding: 10px;
	}
	.page-view .view-collection {
		display: table-cell;
		width: 100%;
		border-right: 1px solid #e5e5e5;
	}
	.tree-wrap {
		min-height: 1280px;
		width: 280px;
		display: table-cell;
	}
	.info-toggle {
		left: 30px;
		top: 15px;
	}
	.srched .view-collection {
		padding: 15px;
	}
	.page-view .view-collection {
		max-width: 100%;
	}
	.page-title {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}
	.page-title h3 {
		font-size: 20px;
	}
	.page-view .subdiv label, .page-view .subdiv span {
		padding: 0 0 10px;
	}
	.page-info .subdiv label, .page-info .subdiv span {
		font-size: 14px;
	}
	.rowbox .subdiv label {
		font-size: 16px;
		padding: 0 20px 0 0;
		font-weight: 500;
	}
	.basic-info {
		padding: 15px 10px;
	}
	.page-info {
		width: 55%;
		padding: 10px 0;
	}
	.writer-list li, .rowbox p {
		font-size: 14px;
	}
}

@media (min-width: 992px) {
	.service-nav {
		display: block;
		position: absolute;
		right: 0;
		padding: 0;
		text-align: right;
		top: 7px;
	}
	.view-collection {
		width: auto;
		padding: 20px;
/* 		overflow: hidden; border-right:1px solid #e1e1e1; */
	}
	.view-tree.main-category,
	.page-view .view-tree {
		position: relative;
		display: table-cell !important;
		box-shadow: none;
	}
	.page-view .view-tree {
		visibility: visible;
	}
	.page-view .tree-list { /*height:88%;*/
		height: auto;
	}

	.page-title h3 {
		font-size: 22px;
	}
	.page-view .subdiv label, .page-view .subdiv span {
		padding: 0 0 10px;
	}
	.page-info .subdiv label, .page-info .subdiv span {
		font-size: 14px;
	}
	.rowbox .subdiv label {
		font-size: 16px;
		padding: 10px;
		font-weight: 500;
	}
	.page-info {
		width: 60%;
		padding: 10px 0;
	}
	.basic-info {
		padding: 20px 15px;
	}
	.rowbox {
		padding: 20px 15px;
	}
	.rowbox .subdiv label {
		padding: 0 20px 0 0;
	}
	.info-toggle {
		left: 40px;
		top: 20px;
	}
	.srched-box, .result-info {
		padding: 10px 0;
	}
	.search-wrap {
		position: absolute;
		left: 50%;
		margin-left: -140px;
		top: -7px;
	}
	.tree-wrap {
		min-height: 1280px;
		width: 280px;
		display: table-cell;
	}
}

@media (min-width: 1200px) {
	.search-wrap {
		position: absolute;
		left: 50%;
		margin-left: -140px;
		top: -7px;
	}
	.service-nav {
		display: block;
		position: absolute;
		right: 0;
		padding: 0;
		text-align: right;
		top: 7px;
	}
	/* .service-nav {top:5px;}
	.service-nav li {display:inline-block;}
	.service-nav li a {font-size:18px; position:absolute; right:0; top:50%; margin-top:-9px;} */
	.tree-wrap {
		min-height: 1280px;
		width: 280px;
		display: table-cell;
	}

	/* .tree-list { min-height: 1050px;}*/
	.view-tree {
		overflow: hidden;
	}
	.view-tree.main-category {
		position: relative;
		/* display:table-cell!important; width:100%; */
		box-shadow: none;
	}

	.view-collection {
		width: auto;
		box-sizing: border-box;
		/* overflow: hidden; */
		/* border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1; */
	}

	.view-tree.main-category,
	.page-view .view-tree {
		position: relative;
		display: table-cell !important;
		box-shadow: none;
	}
	.page-view .tree-list {
		height: auto;
	}
	.page-view .tree-list a {
		padding: 15px;
	}
	.page-view .view-collection {
		display: table-cell;
		width: 100%;
		border-right: 1px solid #e5e5e5;
		position: relative;
	}
	/* .page-view .view-collection {width:auto; position:relative;} */
	.view-collection .media {
		padding: 30px;
		min-height: 263px;
	}
	.img-thumbnail {
		width: 150px;
		height: 180px;
	}
	.media h5 {
		font-size: 18px;
	}
	.media div {
		font-size: 15px;
		/* padding: 5px 0; */
	}
	.pagination {
		width: auto;
		padding: 0;
	}
	.info-toggle {
		top: 20px;
		left: 20px;
	}

	.page-title h3 {
		font-size: 26px;
	}
	.page-view .thumb {
		width: 250px;
		margin: 0 auto;
	}
	.page-view .thumb img {
		width: 100%;
		height: auto;
	}
	.page-view .thumb-wrap {
		width: 330px;
		height: auto;
	}
	.page-view .page-info {
		width: 520px;
	}
	.basic-info {
		padding: 40px 0;
	}
	.filter-wrap {
		padding: 10px;
	}
	.rowbox .subdiv label {
		font-size: 20px;
		padding: 0 50px 0 0;
	}
	.page-info .subdiv label {
		font-size: 16px;
		padding: 0 0 20px;
	}
	.writer-list li, .rowbox p {
		font-size: 16px;
	}
/* 	.page-view .rowbox, .rowbox { */
/* 		padding: 40px 50px; */
/* 	} */
	.page-view .bottom-box {
		padding: 20px 50px;
	}
	.article-view .page-info, .more-view .page-info {
		display: block;
		padding: 20px 0;
		width: 100%;
	}

	/* 검색화면 engine */
	.view-box.srched {
		max-width: 1200px;
		padding: 0;
	}
	.srched .view-collection {
		width: auto;
		padding: 20px;
	}
	.srched-box {
		padding: 20px 0;
	}
	.con-info ul li {
		font-size: 15px;
		padding: 0 10px;
	}
	.con-txt {
		font-size: 15px;
	}
	.writer-info {
		display: inline-block;
		width: 80%;
	}
	.writer-info li {
		font-size: 16px;
	}
	.writer-info li span {
		min-width: 90px;
	}

	.view-tree.main-category,
	.page-view .view-tree {
		position: relative;
		display: table-cell !important;
		box-shadow: none;
	}
}

@media (max-width: 768px){
	img {
		max-width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
	}

	#thumbBox {
		position: relative;
		top: 46px;
	}
}

/* article 사이드메뉴 */
@media ( min-width : 992px) {
	#side {
		height: 100vh;
		position: sticky;
		top: 0;
	}
}


/* article 사이드메뉴 */
@media ( min-width : 1200px) {
	#side {
		width: 350px;
	}
}
