@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css);

#body.container{
	padding-top: 0px;
}




#body .allSearchForm button.btn.btn-default.resetBtn{
	color: red;
}

#body #searchTypeGroup{
	margin-top: 20px;
	margin-left: 8px;
}
@media (max-width: 700px) {
	#body #searchTypeGroup{
		margin-left: 0px;
	}
}

#body #searchTypeGroup ul{
	padding: 0px;
	color: #909090;
}

#body #searchTypeGroup ul li {
    /* margin-left: 20px; */
    padding-left: 10px;
    padding-right: 10px;

	list-style: none;
	display: inline-block;
}

#body #searchTypeGroup{
	margin-top: 8px;
}

#body #searchTypeGroup ul li {
	font-weight: 500;
	font-family: 'Noto Sans KR', sans-serif !important;

	padding-top: 10px;
	padding-bottom: 7px;
	margin-right: 5px;
}


#body #searchTypeGroup ul li.typeClicked {
	color: #333333;
	border-bottom: 2px solid #333333;
}


#body #searchTypeGroup ul li:hover {
	cursor: pointer;
	color: #333333;
}


.typeButton{
	border: 1px solid #4883B6;
	/* border-radius: 15%; */
	border-radius: 80px 80px 80px 80px;
	padding: 2px 5px;
	font-size: 12px;
	margin-right: -2px;
}

.result .resultText{
	/* font-size: 12px; */
	/* color: #BCBCBC; */
}

/* a .typeButton:hover{
	text-decoration: none !important;
} */


.contentsCountAndOrder {
	display: flex;
	/* justify-content: center; */
	align-items: center;
	/* margin-left: 17px; */
}

.site_contentsCountAndOrder{
	margin-left: 17px;
	/* margin-top: 20px; */
	margin-bottom: 20px;
}

.contentsCountAndOrder .result, .site_contentsCountAndOrder .result{
	/* padding-top: 2px;
	margin-right: 20px; */
}

#body .site_contentsCountAndOrder .result{
	text-align: left;
}



.contentsCountAndOrder .result .resultText, .site_contentsCountAndOrder .result .resultText, .searchCategory_no .resultText{
	/* font-size: 15px; */
}

#body .allSearchForm {
	display: flex;

}

#body .allSearchForm button.btn.btn-default.submitBtn, #body .allSearchForm button.btn.btn-default.resetBtn{
	border: none;
	padding: 0px;
	/* margin: 0px 0px 5px 0px; */
	/* margin: 10px 0px 10px 0px; */
	width: 24px;
	height: 24px;
}

#body .allSearchForm button.btn.btn-default.submitBtn img, #body .allSearchForm button.btn.btn-default.resetBtn img{
	width: 24px;
	height: 24px;
}

#category_name {
	height: 24px;
}



/* 

#body #category_images {
	margin: 0px 0px 0px 0px;
	border-radius: 4px;
	display: flex;
	align-items: center;
}


#body #category_images .leftArrow, #body #category_images .rightArrow{
	font-size: 30px;
	color: #424248;
}

#body #category_images .leftArrow:hover, #body #category_images .rightArrow:hover{
	color: grey;
	cursor: pointer;
}


#body #category_images .leftArrow.disabled, #body #category_images .rightArrow.disabled { 
	color: #d6d6d6; 
	cursor: not-allowed;
}


#body #category_images ul {
	margin: 10px 15px 10px 15px;
	padding: 0;
	white-space: nowrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch; 
	scroll-snap-type: x mandatory;
	overflow-y: hidden;
}

#body #category_images ul li .btn {
	padding-right: 6px;
	padding-left: 6px;
}


#body #category_images ul li {
	list-style: none;
	display: inline-block;
}

#body #category_images ul li:nth-last-child(1) {
	margin-right: 10px;
}

#body #category_images ul li button {
	width: 150px;
	height: 167px;
	background-color: #fff;
	position: relative;
}

#body #category_images ul li button img {
	position: absolute;
	top : 5px;
	left: 50%;
	transform: translate(-50%);
	margin: 0 auto;
	width: 100px;
	height: 100px;
}

#body #category_images ul li button p {
	position: absolute;
	top: 105px;
	left: 50%;
	transform: translate(-50%);
	width: 110px;
	display: block;
	font-size: 87%;
	white-space: normal;
	font-weight: 500;
	font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
}

@media (max-width: 480px){
	#body #category_images ul li button p {
		font-size: 75%;
	}

}

#body #category_images ul li button p .cate_name_span{
	word-break: break-all;
}

#body #category_images ul button.selectImg {
	background-color: #CDD5EB !important;
}
#body .book_content #category_images ul button.selectImg {
	background-color: white !important;

}


#body #category_images ul button:hover {

} */











#body #categories .category, #body #topic_list_level2 .category {
	display: inline-block;
	padding: 5px 5px 10px 5px;
	margin: 0px -2px 7px;
	width: 33%;
}

#body #categories select {
	height: 160px;
}

#body #categories select option{
	margin-bottom: 5px;
}
#body #categories select option.all{
	margin-bottom: 0px;
}

#body #categories .panel, #body #topic_list_level2 .panel {
	margin-left: 0px;
	margin-bottom: 0;
}

#body #categories .panel .panel-heading, #body #topic_list_level2 .panel .panel-heading {
	padding: 0px;
}

#body #categories .panel .panel-heading a, #body #topic_list_level2 .panel .panel-heading a {
	display: inline;
	white-space: normal;
}

#body #categories .panel .collapse, #body #topic_list_level2 .panel .collapse {
	overflow-y: auto;
	margin-bottom: 10px;
	margin-top: 10px;
}

#body .twoColumn{
	display: flex;
	width: 100%;
	/* margin-top: 40px !important; */
}



#body .twoColumn #categories, #body .twoColumn #topic_list_level2{
	width: 27%;
	margin: 6px 3% 0px 0px;
	margin-bottom: 40px;
}


#hide-contentsContainer{
	width: 27%;
	margin: 6px 3% 0px 0px;
}

#body .twoColumn #categories.fixed, #body .twoColumn #topic_list_level2.fixed{
	/* width: 23%;
	margin: 0px 3% 0px 0px; */
	position: fixed;
	top: 0;
	bottom: auto;
	/* overflow-y : auto; */
	/* height: 500px !important; */
	margin-bottom: 10px;
}



#body .twoColumn .searchAndContents{
	width: 70%;
	min-height: 360px;
}


/*  ------- 카테고리 마지막 border-bottom 처리: start ------ */
.panel>.list-group:last-child .list-group-item:last-child, .panel>.panel-collapse>.list-group:last-child .list-group-item:last-child{
	border-bottom: 1px solid #ddd;
}

/* 여기 부분 때문에 밑줄 생겼음 - box-shadow 끔 */
#body .twoColumn #categories .panel, #body .twoColumn #topic_list_level2 .panel{
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}
/*  ------- 카테고리 마지막 border-bottom 처리: end ------ */

#body #order_search{
	/* padding-top: 5px; */
}

/* #body .twoColumn .content {
	width: 48%;
} */

#body #category_list, #body #topic_list_search, #body #topic_list, #body #book_list{
	/* margin-left: 5px; */
	/* margin-bottom: 30px; */
}
#body .books_container #category_list{
	margin-bottom: 30px;
}

#body #category_list_ul .btn, #body #topic_list_search_ul .btn, #body #topic_list_ul .btn, #body #book_list_ul .btn{
	padding-right: 0px;
	padding-left: 0px;
}

#body ul#category_list_ul, #body ul#topic_list_search_ul, #body ul#topic_list_ul, #body ul#book_list_ul{
	padding-inline-start: 15px;
	margin-bottom: 0px;
	list-style: disc;
}

#body #category_list_ul .categoryListOne, #body #topic_list_search_ul .topicListOne, #body #book_list_ul .categoryListOne, #body #topic_list_ul .topicListOne{
	padding-top: 3px;
	padding-bottom: 3px;
	
	/* display: inline; */
}

#body #category_list_ul .categoryListOne a, #body #topic_list_search_ul .topicListOne a, #body #book_list_ul .categoryListOne a, #body #topic_list_ul .topicListOne a{
	padding-top: 0px;
	padding-bottom: 0px;
	display: inline;
	white-space: normal;
}


.fa-lightbulb{
    color:rgb(250, 197, 28);
}


/* 콘텐츠 부분 */

#body #maincontents{
	margin-top: 0px;
}


#body #contents .content {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
    /* margin-bottom: 40px; */
}

#body #contents .content:hover{
    /* background-color: #f1faff; */
}

#body #contents .text{
    height: 200px;
}

#body #contents #toc{
    height: 198px;
}

#body div.accessed{
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
}



/* 카테고리 부분 */

#body #categories .panel .panel-heading a.allCategories, #body #topic_list_level2 .panel .panel-heading a.allTopics{
	font-size: 16px;
    font-weight: 500;
    /* color: #53b9af; */

    color: white;
    /* background: #40BAAE 0% 0% no-repeat padding-box;
	border-radius: 12px; */
	background: #455BB7 0% 0% no-repeat padding-box;
	border-radius: 23px;
    opacity: 1;
    padding: 7px 20px;
    width: 100%;
}

#body #categories .panel .panel-heading a.allCategories:hover, #body #topic_list_level2 .panel .panel-heading a.allTopics:hover{
	cursor: pointer;
	background-color: #304086;
	text-decoration:none
}


hr.categoryList_hr {
	margin-top: 0px !important;
	margin-bottom: 10px !important;

	/* margin-top: 10px !important;
	margin-bottom: 30px !important; */
}

hr.search_bookList_hr {
	margin-top: 10px !important;
	margin-bottom: 20px !important;
}

hr.search_topicList_hr {
	margin-top: 10px !important;
	margin-bottom: 30px !important;
}

#body .twoColumn #categories .panel .collapse, #body .twoColumn #topic_list_level2 .panel .collapse {
	/* max-height: 800px; */
	/* max-height: 550px; */
	/* max-height: 480px; */
}


#body .twoColumn #categories .panel, #body .twoColumn #topic_list_level2 .panel {
    border: none;
}

#body .twoColumn #categories .panel-default>.panel-heading, #body .twoColumn #topic_list_level2 .panel-default>.panel-heading{
    /* border: none; */
    background-color: white;
}

#body .twoColumn #categories .panel .panel-heading a.btn, #body .twoColumn #topic_list_level2 .panel .panel-heading a.btn{
    /* padding-top: 0px;
    padding-bottom: 0px; */
    text-align: start;
}

.twoColumn .panel-title .add_list>a:hover{
	/* color:#4883B6; */
	color: #455BB7
}

.twoColumn .panel-title .add_list>a.first_list{
	font-weight: 600;
}

.twoColumn .panel-title .add_list>a.first_list:last-child:hover{
	/* color:#4883B6; */
	color: #455BB7;
}





.twoColumn .panel-title .add_list>a.first_list:last-child{
    color: #333333;
}






/* 카테고리 디자인 변경: start - 220503 */
#body #categories .btn, #body #topic_list_level2 .btn{
    font-size: 16px;

    outline: 0 !important;
	outline-offset: 0 !important;
	/* border: none; */
	box-shadow: none;
}
#body #categories .list-group li, #body #topic_list_level2 .list-group li  {
    font-size: 16px;
}

#body #categories .panel .panel-heading, #body #topic_list_level2 .panel .panel-heading{
    padding: 0px;
}

#body #categories .panel .panel-heading a.first_list,
.panel-title .add_list>a.first_list{
	display: flex;
}

.panel-title .add_list>a.first_list::before{
    content: "\";
    font-family: "xeicon";
    margin-right: 8px;
    font-size: 15px;
}
/* .panel-title .add_list>a.first_list::before{
    content: "\f0ca";
    font-family: "Font Awesome 5 Free";
    margin-right: 8px;
    font-size: 15px;
} */

.twoColumn .panel-title .add_list:first-child>a{
    background-color: white;
    border-top: none;;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
	padding-left: 0px;
	padding-right: 0px;
}   

.twoColumn .panel-title .add_list:nth-child(2)>a{ 
    background: #F8F8FA 0% 0% no-repeat padding-box;
    padding-left: 20px;
}
.twoColumn .panel-title .add_list:nth-child(3)>a{
    background-color: white;
    padding-left: 35px;
}   
.twoColumn .panel-title .add_list:nth-child(4)>a{
    background-color: white;
    padding-left: 50px;
}   
.twoColumn .panel-title .add_list:nth-child(5)>a{
    background-color: white;
    padding-left: 65px;
}   
.twoColumn .panel-title .add_list:nth-child(6)>a{
    background-color: white;
    padding-left: 80px;
}   


.twoColumn .panel-title .add_list{
    display: flex;
	background-color: white;
    /* padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 30px; */
}

.twoColumn .panel-title .add_list>a{
	color: #333333;
	background-color: white;
    border-top: 1px solid #DBDBDB;
	opacity: 1;
	
	width: 100%;
    display: flex;
    padding-top: 8px;
    padding-bottom: 8px;
	padding-left: 30px;
	/* padding-top: 12px;
    padding-bottom: 12px; */
}

.twoColumn .panel-title .add_list:last-child>a{
    /* color: #4883B6; */
    font-weight: 600;
}


.twoColumn .panel-title .add_list>a{
    color: #333333;
    font-weight: 400;
}

/* 카테고리 디자인 변경: end - 220503 */




.twoColumn .panel-title .add_list .gt_text{
    padding-top: 3px;
}



#body .twoColumn #categories .list-group-item, #body .twoColumn #topic_list_level2 .list-group-item{
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 20px;
    font-size: 16px;
    font-weight: 400;
    background: #F8F8FA 0% 0% no-repeat padding-box;
    opacity: 1;
	line-height: 1.1;


}

#body .twoColumn #categories .list-group-item.hasIcon, #body .twoColumn #topic_list_level2 .list-group-item.hasIcon{
	display: flex;
	width: 100%;
	justify-content: space-between;
}

#body .twoColumn #categories .list-group-item .categoryNameDiv, #body .twoColumn #topic_list_level2 .list-group-item .categoryNameDiv{
	word-break: break-all;
	display: flex;
}


#body .twoColumn #categories .list-group-item.hasIcon .iconDiv, #body .twoColumn #topic_list_level2 .list-group-item.hasIcon .iconDiv {
	color: #828282 !important;
	/* width: 20px; */
	padding-right: 0px;
	padding-left: 10px;
	font-size: 12px;
}

#body .twoColumn #categories .list-group-item.hasIcon .iconDiv i, #body .twoColumn #topic_list_level2 .list-group-item.hasIcon .iconDiv i{
    transition: transform 300ms ease-in-out;
}
#body .twoColumn #categories .list-group-item.hasIcon .iconDiv.upState i, #body .twoColumn #topic_list_level2 .list-group-item.hasIcon .iconDiv.upState i{
	transform: rotate(180deg);
	color: #333333;
}


#body .twoColumn #categories .list-group-item .contentsCount, #body .twoColumn #topic_list_level2 .list-group-item .contentsCount{
	font-weight: 500;
	font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif"
}


/* 카테고리 클릭 시 카테고리 안 없어지도록 수정(220926): start */
#body .twoColumn #categories ul.cate_ul, #body .twoColumn #topic_list_level2 ul.cate_ul{
	padding-left: 0px;
}
#body .twoColumn #categories ul.cate_ul .list-group-item:last-child, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item:last-child{
	border-bottom: none;
}

/* #body .twoColumn #categories ul.cate_ul .list-group-item:not(.list_level2):not(.list_level3) .categoryNameDiv::before, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item:not(.list_level2):not(.list_level3) .categoryNameDiv::before{
	content: "↳";
	font-size: 13px;
	margin-right: 10px;
	color: #c0bcbccf;
}

#body .twoColumn #categories ul.cate_ul .list-group-item.list_level4 .categoryNameDiv::before, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item.list_level4 .categoryNameDiv::before{
	content: "↳";
	font-size: 15px;
	margin-right: 10px;
	color: #8b8585 !important;
} */

#body .twoColumn #categories .list-group-item.active, #body .twoColumn #topic_list_level2 .list-group-item.active{
	color: #455BB7;
	/* color: #333333; */
	font-weight: 600;
}

#body .twoColumn #categories .list-group-item.active.activeLast, #body .twoColumn #topic_list_level2 .list-group-item.active.activeLast{
	/* color: #455BB7; */
	color: #333333;
	/* background-color: #ddd; */
	/* background-color: #dedeed; */
}
/* 카테고리 클릭 시 카테고리 안 없어지도록 수정(220926): end */


.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover{
	border-color: #ddd;
}



#body .twoColumn #categories .list-group-item.list_level3, #body .twoColumn #topic_list_level2 .list-group-item.list_level3{
    background-color: white;
	padding-left: 35px;
}
#body .twoColumn #categories ul li.list-group-item.list_level4, #body .twoColumn #topic_list_level2 ul li.list-group-item.list_level4{
    background-color: white;
	padding-left: 50px;
}
#body .twoColumn #categories ul .list-group-item.list_level5, #body .twoColumn #topic_list_level2 ul .list-group-item.list_level5{
    background-color: white;
	padding-left: 65px;
}
#body .twoColumn #categories .list-group-item.list_level6, #body .twoColumn #topic_list_level2 .list-group-item.list_level6{
    background-color: white;
	padding-left: 80px;
}

#body .twoColumn .list-group li.list-group-item:hover{
    cursor: pointer;
    background-color: #f1faff !important;
}


#body .twoColumn #categories .panel .collapse, #body .twoColumn #topic_list_level2 .panel .collapse {
    /* max-height: 100%; */
    /* max-height: 800px; */
	/* max-height: 480px; */
	
}


.twoColumn .list-group li:hover{
    cursor: pointer;
    background-color: #f1faff;
}


#body .twoColumn #categories .panel .collapse, #body .twoColumn #topic_list_level2 .panel .collapse{
    margin-top: 0px;
    margin-bottom: 0px;
}

.contentsCount{
    /* color: #4582B8;
	font-size: 12px;
	font-weight: 500;
    padding-bottom: 2px;
    display: inline-block;
	vertical-align: middle; */
	
	display: inline-block;
    vertical-align: middle;

    color:#455BB7;
    background: #E9E9F4 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    text-align: center;
    padding: 2px 10px;
	margin-left: 5px;
	font-size: 13px;
    line-height: 1;
    word-break: normal;
}

.count_Zero{
    color: #C9C9C9;
}

input#category_name{


    /* background-color: #F9F9F9; */
    border: none;
    box-shadow: none;
}

input#category_name::placeholder{
    /* background-image: url(/dist/img/plus_image.png);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center right; */
	font-weight: 500;
    color: #606060;
}


@media (min-width: 1200px) {
	#body #categories .category, #body #topic_list_level2 .category  {
		width: 33%;
		height: 100%;
	}
}

@media (min-width: 481px) and (max-width: 768px) {
	#body #categories .category, #body #topic_list_level2 .category {
		width: 50%;
	}
}

@media (min-width: 768px) {
	#body #categories, #body #topic_list_level2 {
		/*height: 200px;*/
		height: 100%;

	}
}
/*
@media (min-width: 481px) and (max-width: 768px) {
	#body #categories .category {
		width: 50%;
	}
}

@media (min-width: 481px) {
	#body #categories {
		height: 200px;
	}
}
*/

#body .list_marginTop {
	margin-top: 10px;
}


#body #topic_list .topic_ul{
	/* margin-top: 10px; */
	display: flex;
	list-style: none;

	/* display: flex; */
    align-items: flex-start;
    /* justify-content: space-between; */
    flex-wrap: wrap;
    padding: 0px;
    width: 100%;
    /* border-top: 1px solid #b4b4b4;
    border-left: 1px solid #b4b4b4; */
	/* margin-bottom: 10px; */
	/* font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif"; */

}




#body #topic_list .topic_ul li{
	/* width: 200px; */
	padding: 5px;
	
	/* margin-top: 3px;
	margin-right: 5px;
	margin-left: 10px; */

	margin-top: 0px;
	margin-right: 0px;
	margin-left: 5px;
	
	width: 19%;
    text-align: center;

}

#body #topic_list .topic_ul li button{
	/* font-size: 14px; */
	font-family: 'Noto Sans KR', "나눔고딕코딩", "NanumGothicCoding", "Pretendard-Regular", sans-serif, Arial, "Courier New", "monospace";
	font-size: 17px;
	font-weight: 500;
	width: 100%;
	/* height: 100%; */
	padding: 5px 5px;
	display: flex;
	justify-content: center;
	align-items: center;

	/* background-color: #F4F4F4;
	border-radius: 0px; */

	/* border: 1px solid #DCDCDC; */
	/* border-radius: 50px; */
	border-radius: 10px;
	background-color: #E9E9F4;

}


#body #topic_list .topic_ul li button p.topic_name{
	margin: 0px !important;
}

/* #body #topic_list .topic_ul li button p.topic_name.ellipsis_name{
	width: 80%;
	overflow:hidden; 
	text-overflow:ellipsis; 
	white-space:nowrap;
} */


/* 임시 - 모바일만 ...처리 => 심혈관:심전도 토픽 카테고리  */
@media (max-width: 500px) {
	#body #topic_list .topic_ul li button p.topic_name.ellipsis_name{
		width: 80%;
		overflow:hidden; 
		text-overflow:ellipsis; 
		white-space:nowrap;
	}
}

/* 토픽 카테고리 2줄로 변경 시 */
/* #body #topic_list .topic_ul li button p.topic_name.ellipsis_name{
	width: 100%;
	overflow:hidden; 
	text-overflow:ellipsis; 
	white-space:nowrap;
}
#body #topic_list .topic_ul li button{
	display: block;
	padding: 7px 5px;
}
#body #topic_list .topic_ul li button p.topic_name{
	margin-bottom: 3px !important;
} */



/* #body #topic_list .topic_ul li button{
	width: 100%;
} */

#body #topic_list .topic_ul li.selected button{
	background-color:#455BB7 !important;
	color: white !important;
}

#body #topic_list .topic_ul li button:hover{
	/* background-color:#405991 !important; */
	background-color:#455BB7 !important;
	color: white !important;
}

#body #topic_list .topic_ul li button:focus{
	outline: 0px #405991 !important;
    outline-offset: 0px !important;
}

#body #topic_list .topic_ul li.allTopic button{
	/* width: 200px; */
	color: white;
	background-color: #424248;
	font-size: 11px;
	/* border-radius: 80px 80px 80px 80px; */
	font-weight: 600;
}

.topic_header, .book_header{
	display: flex;
	align-items: center;
	/* margin-top: 10px; */
}

.topic_header h4:hover, .book_header h4:hover{
	cursor: pointer;
	color: #455BB7;
}

.search_container .topic_header h4:hover, .search_container .book_header h4:hover{
	cursor: default;
	color: #333333;
}


.showAndHideBtn{
	border: none;
    cursor: pointer;
    outline: none;
    background-color: #fff;
	font-size: 20px;
	margin-left: 5px;
    height: 100%;
    transition: transform 300ms ease-in-out;
}

.showAndHideBtn:hover{
	color: #455BB7;
}

/* #category_images li:hover{
	background-color: #CDD5EB !important;
	border-radius: 4px;
} */
/* 
#body #category_images ul li:hover button{
	background-color: #CDD5EB !important;
	border-radius: 4px;
}

#category_images li:focus-visible, #category_images li:focus, #category_images li:active, #category_images li.active:focus, #category_images li.focus:focus{
	outline: 0px !important;
	outline-offset: 0px !important;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}


#category_images li .btn:focus, #category_images li .btn:active, #category_images li .btn.active:focus, #category_images li .btn.focus:focus{
	outline: 0px !important;
	outline-offset: 0px !important;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
} */



.noAnimation{
	transition: none;
}

/* .book_header .showAndHideBtn{
	margin-left: 22px;
} */

.showAndHideBtn.downState {
    transform: rotate(180deg);
}


#body .nav-tabs .active a {
	font-weight: bold;
	color: #666;
}

#body .nav-tabs  li {
	text-align: center;
}

#body .nav-tabs  li  a {
	border: 1px solid #ddd;
	color: #666;
}

#body #order_search {
	/* margin-bottom: 5px; */
	font-size: 16px;
}

#body #categories,  #body #topic_list_level2{
	margin: 10px 10px 0 7px;
}



#body #contents {
	position: relative;
	margin-left: 10px;

}

#body #contents .book{
	/* color: #999999; */
	/* font-weight: 350; */
	color: #424248;
	font-weight: 500;

	font-size: 80%;
	color: #4BADB3;
}

#body #contents #changeLabel {
	height: 20px;
}

#body #contents .content {
	position: absolute;
	/* border: solid lightgray 1px; */
	/* border-radius: 2px; */
	/* padding: 8px;
	margin-bottom: 40px; */
	word-wrap: break-word;
}

#body #contents .content a {
	color: dimgray;
}

#body #contents .content .title {
	/* color: #333333 !important;
	font-size: 120%;
	font-weight: 400 !important;
	line-height: 1.1;
	vertical-align: middle;
	word-break: break-all; */
}

#body #contents .content .imgSpan{
    display: inline;
    /* align-items: center; */
    /* vertical-align: top; */
}


#body #contents .content img.newImg {
    /* margin-left: 2px;
    margin-bottom: 2px; */
    width: 13px;
	height: 13px; 
	border: none;
    /* vertical-align: middle;
    align-items: center; */
}

#body .notice_alert .imgSpan img.newImg{
	width: 12px;
	height: 12px;
	border: none;
	margin-bottom: 3px;
	margin-left: 1px;
}

#body #contents .content img.updateImg {
    /* margin-left: 2px;
    margin-bottom: 2px; */
    width: 13px;
	height: 13px; 
	border: none;

    /* vertical-align: middle;
    align-items: center; */
}


#body #contents .content .text {
	border: 1px solid lightgray;
	border-radius: 8px;
	/* border: 0;
	border-top: 1px solid lightgray;
	border-bottom: 1px solid #fff; */

  	margin: 5px 0px 5px 0px;
	/* padding-top: 5px; */
	padding: 10px;  
}

#body #contents .content .text h3 {
 font-weight: normal;
}

#body #contents .content a:first-child:hover span.title{
	text-decoration: underline;
}

#body #contents .content .content_data a:first-child:hover{
	text-decoration: underline;
}


#body #contents .content a:hover {
	text-decoration: none;
}

#body #contents .content .text img {
	position: relative;
	margin: 0 auto;
	display: block;
}

#body #contents .content .author {
	color: #999;
	font-weight: 500;
}

#body #contents .content .author > .name {
	color: #676767;
}

#body #contents .content .author img {
	width: 32px;
}

#body #contents .content .accessed {
	float: right;
	/* color: #909090; */
	color: #C9C9C9;

	font-size: 78%;
	margin-top: 3px;
	/* width: 100%; */
	font-family: "Roboto", "Spoqa Han Sans";
}

#body #contents .content .created {
	color: #999;
}

#body #contents .content h1, #body #contents .content h2, #body #contents .content h3, 
#body #contents .content h4 , #body #contents .content h5, #body #contents .content h6 {
	line-height: 1.4;
}

#body #contents .content img {
	max-width: 200px;
	border: solid whitesmoke 1px;
	border-radius: 4px;
	text-align: center;
	margin-bottom: 0;
}

#body #contents .content table pre {
	margin: 0;
	padding: 0;
	/* border: none;
	overflow: hidden;
	background: none; */
}

#text table {
	border: 2px solid;
	border-color: black;
}

#body #contents .content ul, #body #contents .content ol {
	display: inline-block;
	padding: 0;
	width: 100%;
	margin: 0;
}

#body #contents .content li {
	display: inline-block;
	width: 100%;
}

#body #contents .content hr {
	display: none;
}

.topicList_hr{
	display: none;

}

.category option:focus, option:active, option:checked {
	background-color: #ddd;
}

.category .all {
	font-weight: bold;
}
.category .first {
    background-color: #ddd;
	font-weight: bold;
}



#pagination2 img {
	cursor: pointer;
}

#pagination2 .active {
	cursor: auto;
}

#pagination2 img:not(:first-child) {
	margin-left: 3px;
}

.check_related {
	color: cornflowerblue;
}

#body #interests > div > span {
	vertical-align: middle;
}

#body #interests > div {
	/* padding-top: 3px;
	padding-bottom: 3px;
	margin-left: 10px; */
}



#body #interests > div a.btn{
	padding: 0px;
	word-break:break-all;
	overflow: hidden;
	white-space: normal;
	text-align: left;
	/* margin : -3px 0; */
	/* margin : 0px; */
	display: inline;
}


#body #interests .bullet{
	font-size: 16px;
	font-weight: 600;
}

#body #interests > div > span:nth-child(1) {
	/* font-size: 17px; */
	/* margin-left: -8px; */
	/* margin-left: -18px; */
	margin-right: 8px;
}

#body #interests {
	/* margin-left: 15px !important; */
	/* margin-bottom: 20px; */
}

hr{
	margin-top: 5px !important;
	margin-bottom: 10px !important;
}

#body #interests div {
    /* line-height: 1.1; */
    /* text-indent: 0.2em; */
}

#body #interests div a {
	/* padding: 0px; */
}

#interestInfo {
	color: #4c4c4c;
	padding-left: 5px;
	margin-bottom: 5px;
	font-weight: 350;
}

#interestInfo b {
	color: #4582b8;
}


#body #maincontents {
	margin-top: 0px;
}

#body #contents blockquote {
	font-size: 100%;
	margin: 0;
	padding: 5px 10px;
}

/* #body #contents .content{
	margin-top: 30px;
} */

#body #contents .content .text * {
	font-size: 100%;
	margin: 0;
	/* font-family: 'Noto Sans KR';
	line-height: 1.1; */
	margin-bottom: 6px;
}




/* 240314 수정 */
/* Practical guilde 부분 g에서 아랫부분 짤림 부분 해결 */
#body #contents .content .text .toc_view #toc .gmd-block ul li a{
	line-height: 1.2;
}
/* 콘텐츠 목록 콘텐츠 toc - 이미지 있을 경우 2열일 때 목차가 이미지랑 너무 붙어보이는 부분 수정 */
#body #contents .content .text .toc_view.texthasimg #toc{
	padding-right: 4px;
}




.panel-default {
	margin-bottom: 10px !important;
}

.list-group-item {
	padding: 5px 10px;
 }
 #category_list,  #topic_list_search,  #book_list{
 /* #category_list,  #topic_list_search,  #book_list,  #topic_list { */
	 min-height: 0px;
	 max-height: 290px;
	 overflow-y: auto;
	 overflow-x: hidden;
 }
#category_list .selected, #topic_list_search .selected, #book_list .selected {
    background-color: #ddd;
}


#interests .selected{
    background-color: #ddd;
}





/* test */
/* .categoryDiv {
	width: 33%;
	display: inline-block;
    overflow-x: auto;
    white-space: nowrap;
} */

#body #categories .category, #body #topic_list_level2 .category{
	/* padding: 5px 5px 10px 5px;
	margin: 0px -2px 7px;
	width: 33%; */
    /* overflow-x: scroll;
	white-space: nowrap; */
}

.category select{
	width: 100%;
	/* overflow-x: scroll;
    white-space: nowrap; */
	height:100%;
}

select.form-control{
	overflow-x: scroll;
	overflow-y: scroll;
	white-space: nowrap;
	height:100%;
	-webkit-overflow-scrolling: auto;
	/* padding-right: 0px; */
}



.category select option {
	/* width: 50px; */
	word-break:break-all;
}

/* 스크롤바 항상보이게 하기 */
::-webkit-scrollbar { /*  스크롤 전체*/
	-webkit-appearance: none;
	width: 15px;
	height: 15px;
}
  
::-webkit-scrollbar-thumb { /*  스크롤 막대*/
	/* width: 3px;
	height: 3px;
	border-radius: 4px;
	background-color:#ddd;
	box-shadow: 0 0 1px rgba(255, 255, 255, .5); */
	
	/* background-color:#c0c0c0; */
	/* background-color:rgba(0, 0, 0, .5); */
	/* background-color: rgba(0, 0, 0, .5); */
	/* border: 1px solid #ccc; */

	background-color: #ddd;
    border: 4px solid transparent;
    border-radius: 9px;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, .5);
}



::-webkit-scrollbar-track { /*  스크롤 막대 외부*/
	/* width: 10px;
	height: 10px; */
	/* border: 1px solid #ccc; */
	background-color: #f9f9f9;;
}


#body .category_images ul li button{
	background-color: red;
}


.content_information{
	display: flex;
	/* justify-content: space-between; */
	justify-content: flex-end;

}

.content_information .bookmark_not, .content_information .bookmark_checked{
	margin-right: 5px;
	color: #F4C708;
}

/* BOOK > 콘텐츠별 - 콘텐츠 목록에 전체/회원/구독/내부(비공개) 표시: start */
.content_information .public{
	width: 35px;
	font-size: 78%;
	font-weight: 500;
	margin-right: 5px;
	color: #F4C708;
	/* margin-top: 3px; */
	margin-bottom: 5px;
	padding: 1px 0px;
	text-align: center;
}

.content_information .public.public_0{
	color: white;
	/* border: 1px solid #C9C9C9;
	background-color: #C9C9C9; */

	border: 1px solid #308a66;
	background-color: #308a66;
}
.content_information .public.public_5{
	color: white;
	border: 1px solid #C9C9C9;
	background-color: #C9C9C9;
}
.content_information .public.public_10{
	color: white;
	border: 1px solid #F4C708;
	background-color: #F4C708;
}
.content_information .public.public_15{
	color: white;
	border: 1px solid red;
	background-color: red;
}
/* BOOK > 콘텐츠별 - 콘텐츠 목록에 전체/회원/구독/내부(비공개) 표시: end */




/* BOOK > 책별 > 콘텐츠2개 이상일 경우 모달창 띄울 때 > 전체/회원/구독 표시: start */
#contentListDiv .public{
	/* font-size: 13px;
	padding: 3px 5px; */
	font-size: 12px;
	padding: 1px 5px;
	margin-right: 3px;
}

#contentListDiv .public.public_0{
	color: white;
	/* border: 1px solid #C9C9C9;
	background-color: #C9C9C9; */

	border: 1px solid #308a66;
	background-color: #308a66;
	
}
#contentListDiv .public.public_5{
	color: white;
	border: 1px solid #C9C9C9;
	background-color: #C9C9C9;
}
#contentListDiv .public.public_10{
	color: white;
	border: 1px solid #F4C708;
	background-color: #F4C708;
}
#contentListDiv .public.public_15{
	color: white;
	border: 1px solid red;
	background-color: red;
}
/* BOOK > 책별 > 콘텐츠2개 이상일 경우 모달창 띄울 때 > 전체/회원/구독 표시: end */





/* BOOK > 책별 > 카테고리에 전체/회원/구독 표시 + 콘텐츠 수 표기: start */
#body #categories .list-group-item.hasContent .public{
	font-size: 12px;
	padding: 1px 5px;
	margin-left: 5px;
}

#body #categories .list-group-item.hasContent .public.public_0{
	color: white;
	border: 1px solid #2b944c;
	background-color: #2b944c;
}
#body #categories .list-group-item.hasContent .public.public_5{
	color: white;
	border: 1px solid #9e69d3;
	background-color: #9e69d3;
}
#body #categories .list-group-item.hasContent .public.public_10{
	color: white;
	border: 1px solid #f0b000;
	background-color: #f0b000;
}
#body #categories .list-group-item.hasContent .public.public_15{
	color: white;
	border: 1px solid red;
	background-color: red;
}

#body #categories .list-group-item.hasContent .public.public_hide{
	display: none;
}


#body #categories .list-group-item.hasContent .hasContent_count{
	font-weight: 500;
	margin-left: 5px;
    padding: 1px 7px;
	color: #6C6CB7;
    background-color: #CFCFEB;
    border: none;
	border-radius: 20px;
	font-size: 87%;
}


/* BOOK > 책별 > 카테고리에 전체/회원/구독 표시 + 콘텐츠 수 표기: end */




.content_information .bookmark_not:hover, .content_information .bookmark_checked:hover{
	cursor: pointer;
}

#body .sub_nav_library, #body .sub_nav_book{
	margin-top: 8px;
}

#body .sub_nav_library ul, #body .sub_nav_book ul{
	display: flex;
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	/* margin-left: 17px; */
}

#body .sub_nav_library ul li, #body .sub_nav_book ul li {
	text-align: center;
	font-weight: 500;
	font-family: 'Noto Sans KR', sans-serif;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-right: 5px;
}

#body .sub_nav_library ul li a, #body .sub_nav_book ul li a{
	text-align: center;
	color: #333;
}

#body .sub_nav_library ul li.active, #body .sub_nav_book ul li.active {
	color: white;
	border: none;
	background-color: #455BB7;
	border-radius: 30px;
}

#body .sub_nav_library ul li.active a, #body .sub_nav_book ul li.active a{
	color: white;
}


#body .sub_nav_library ul li:hover, #body .sub_nav_library ul li:hover a, #body .sub_nav_book ul li:hover, #body .sub_nav_book ul li:hover a {
	cursor: pointer;
	color: white;
	border: none;
	background-color: #214971;
	text-decoration: none;
	/* border-radius: 80px 80px 80px 80px; */

	/* border-radius: 4px; */
	border-radius: 30px;

}

#body #bookmarkInfo, #body #interestInfo{
	margin-top: 40px;
	margin-left: 17px; 
	margin-bottom: 10px;
}
#body #bookmarkInfo h4, #body #interestInfo h4{
	font-weight: 600;
}



#body #interests{
	/* margin-left: 35px !important; */
}

#category_list, #topic_list_search{
	/* margin-left: 23px !important; */
	/* margin-bottom: 20px; */
	/* margin-top: 20px; */

	/* margin-bottom: 40px; */
}
#topic_list, #book_list{
	/* margin-left: 17px !important; */
}

.topics_container {
	margin-top: 20px;
}
.topics_container #topic_list{
	/* margin-bottom: 30px; */
}

.topics_container #topic_list_search.searched{
	/* margin-bottom: 30px; */
	margin-top: 40px;

	color: #111111;
	padding-left: 1em;
	font-size: 16px;
	line-height: 160%;
	letter-spacing: -0.02em;
	font-weight: 400;
}

.topics_container a.notice_alert{
	margin-left: 0px;
}

#category_list.searched, #topic_list_search.searched, #topic_list.searched, #book_list.searched {
	margin-bottom: 40px;
	/* margin-bottom: 20px; */
	/* margin-top: 20px; */
}



hr.interests_hr{
	margin-top: 15px !important;
	margin-bottom: 15px !important;

}

#body.container.paddingTop0_container{
	padding-top: 0px;
}


@media (max-width: 991px) {

	#body #topic_list .topic_ul li{
		width: 24%;
	}

}

@media (max-width: 880px) { 
/* @media (max-width: 600px) { */

	#body .twoColumn{
		display: block;
	}

	#body #category_names .column2{
		margin-bottom: 20px;
	}
	#body .twoColumn .searchAndContents{
		width: 100%;
		/* margin-top: 30px !important; */
	}
	#body #categories .btn, #body #topic_list_level2 .btn {
		font-size: 14px;

	}
	.twoColumn .panel-title .add_list>a{
		padding-top: 8px;
		padding-bottom: 8px;
	}
	#body .twoColumn #categories .list-group-item, #body .twoColumn #topic_list_level2 .list-group-item{
		padding-top: 8px;
		padding-bottom: 8px;
		font-size: 14px;
	}
	#category_list.searched, #topic_list_search.searched, #topic_list.searched, #book_list.searched{
		margin-bottom: 30px;
	}

	.search_container #topic_list.searched, .search_container #book_list.searched{
		margin-bottom: 5px;
	}

	.twoColumn .panel-title .add_list:first-child>a{
		padding-top: 10px;
		padding-bottom: 10px;
		font-size: 14px;
		margin-top: 5px;
	}


	#body #categories .panel .panel-heading a.allCategories, #body #topic_list_level2 .panel .panel-heading a.allTopics{
		font-size: 14px;
		padding: 5px 20px;

	}

	#body .twoColumn #categories, #body .twoColumn #topic_list_level2{
		width: 100% !important;
	}

	.searchAndContents{
		width: 100%;
		/* margin-top: 30px; */
	}

	/* 공지 알림 추가(221115) */
	.searchAndContents.book_div, .searchAndContents.topic_div{ 
		width: 100%;
		/* margin-top: 0px; */
	}

	.search_container .searchAndContents{
		width: 100%;
		/* margin-top: 0px; */
	}

	.categoryList_hr{
		display: none;
	}


	#body #categories .panel .collapse, #body #topic_list_level2 .panel .collapse{
		/* height: 190px; */
		max-height: 300px;

    }

    #body #contents{
        /* width: 100%; 
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch; 
        scroll-snap-type: x mandatory; */
    }

    #body #contents::-webkit-scrollbar{
		display: none;
	}

    /* #body .content{
        width: 180px;
    } */

    #body #contents .content{
		width: 300px;
        /* width: 100%; */
		/* margin-right: 20px; */
		margin-bottom: 0px;
    }

	#body #contents .content .topicAndBook_icon{
		width: 280px;
	}

    #body #contents .content .title {
        font-size: 16px !important;
    }

    p.header_margin1{
        font-size: 12px;
		width: 300px;
    }
    #body #maincontents:not(.isListView) p.header_margin3{
        height: 48px;
        width: 280px;
    }

    /* #body div.accessed {
        width: 300px;
    } */
    #body #contents .content .accessed{
        float: left;
    }

    #body #contents #toc{
        /* height: 178px; */
        height: 218px;
    }


    #body #contents .text{
        /* height: 200px; */
        height: 240px;
        /* width: 160px; */
        width: 280px;
    }
    #toc-container{
        /* height: 180px; */
        /* height: 220px !important; */
    }

    /* #body #contents .content .text #toc-container.texthasimg{
        height: 220px;
    }

    #body #contents .content .text .textimghasimg{
        height: 220px;
    } */

    #pagination{
		margin-top: 5px;
		font-size: 10px;
    }
    .pagination{
        margin: 5px 0px;
	}
	.pagination>li>a, .pagination>li>span{
		padding: 6px 8px;
	}
    .zeroList{
        height: 0px;
    }
    #body #categories .panel .collapse.zeroList, #body #topic_list_level2 .panel .collapse.zeroList{
        height: 0px;
	}
	
	#body #maincontents:not(.isListView) p.header_margin3 {
		height: 48px !important;
		width: 280px;
	}

	#body #category_images ul li button p{
		/* width: 100%; */
	}

	#body #category_images ul::-webkit-scrollbar{
		/* display: none; */
	}
	#body .content_information{
		width: 280px;
	}
}

@media (max-width: 650px) {

	#body .sub_nav_library, #body .sub_nav_book{
		margin-top: 0px;
		margin-left: -13px;
		/* margin-left: -13px !important; */
	}

	#body .sub_nav_library, #body .sub_nav_book{
		margin-top: 8px;
	}
	
	#body .sub_nav_library ul, #body .sub_nav_book ul{
		display: flex;
		list-style: none;
		padding-left: 10px;
		margin-bottom: 0px;
		/* margin-left: 17px; */
	}
	
	#body .sub_nav_library ul li, #body .sub_nav_book ul li {
		text-align: center;
		font-weight: 500;
		font-family: 'Noto Sans KR', sans-serif;
		padding-top: 7px;
		padding-bottom: 7px;
		margin-right: 5px;
	}
	
	#body .sub_nav_library ul li a, #body .sub_nav_book ul li a{
		text-align: center;
		color: #333;
	}
	
	#body .sub_nav_library ul li.active, #body .sub_nav_book ul li.active {
		color: white;
		/* border-bottom: 2px solid #4883B6; */
		border: none;
		background-color: #455BB7;
		border-radius: 30px;
	}
	
	#body .sub_nav_library ul li.active a, #body .sub_nav_book ul li.active a{
		color: white;
	}
	
	
	#body .sub_nav_library ul li:hover, #body .sub_nav_library ul li:hover a, #body .sub_nav_book ul li:hover, #body .sub_nav_book ul li:hover a {
		cursor: pointer;
		color: white;
		border: none;
		background-color: #214971;
		text-decoration: none;

		/* background-color: #455BB7; */
		border-radius: 30px;
	
	}
}


@media (max-width: 600px) {
	#body #category_names {
		margin-top: 0px;
		display: block;
		/* justify-content: space-between; */
		/* border-bottom: 1px solid #ddd; */
	}


	#body #category_names input {
		/* width: 100%; */
		margin-top: 10px;
	}
	#body .allSearchForm button.btn.btn-default.submitBtn, #body .allSearchForm button.btn.btn-default.resetBtn{
		margin-top: 10px;
	}



}

@media (max-width: 730px) {

	#body #topic_list .topic_ul li{
		width: 32%;
	}

}


@media (max-width: 510px) {
	#body #topic_list .topic_ul li{
		width: 31%;
	}

	#body #searchTypeGroup{
		margin-top: 0px;
		margin-left: -5px;
	}

	#body #searchTypeGroup ul{
		width: 100%;
		display: flex;
		align-items: flex-start;
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch; 
		scroll-snap-type: x mandatory;
	}

	#searchTypeGroup ul::-webkit-scrollbar{
		display: none;
	}

	#body #searchTypeGroup ul li{
		margin-right: 10px;
		/* width: 150px; */
		white-space:nowrap;
		/* display:inline-block; */
	}


}





@media (max-width: 480px) {
	/* .searchAndContents{
		margin-top: 20px;
	} */

	#body #category_names {
		margin-top: 0px;
		display: block;
		/* justify-content: space-between; */
		/* border-bottom: 1px solid #ddd; */
	}

	#body #category_names .column2{
		width: 100%;
		border-bottom: 1px solid #ddd;
	}

	.contentsCountAndOrder{
		margin-left: 7px;
	}



	#body .allSearchForm {
		justify-content: space-between;
		width: 100%;
	}



	#body {
		padding-top: 10px;
	}

	#pagination, #pagination2 {
		margin-top: 20px;
	}

	#body #contents{
		display: block;
		margin: 0px;
		position: relative;
	}

	#body .content_margin{
		display: none;
	}

	#body #category_images {
		margin-top: 0px;
	}

	#body .allSearchForm button.btn.btn-default.submitBtn, #body .allSearchForm button.btn.btn-default.resetBtn{
		margin-bottom: 0px;
	}


	
	#body #category_images ul {
		text-align: center;
		width: 100%;
		/* margin: 5px 0 10px 0; */
	}

	/* #body #category_images ul li {
		width: 33%;
		margin-right: 5px;
	} */
	#body #category_images ul li {
		/* width: 33%;
		margin-right: 0.33%; */
	}

    #body #category_images ul li button {
        /* width: 100%;
        padding: 5px 5px 0 5px;
		height:125px; */
    }

    #body #category_images ul li button img {
        /* height: 70px;
        width:70px; */
    }


	/* #body #topic_list .topic_ul li button{
		font-size: 85%;
	}
	.topicAndCateCount{
		font-size: 85%;
		padding-top: 2px;
		padding-bottom: 2px;
	} */

	#body #category_images ul li button p {
		/* font-size: 85%; */
		/* width: 100%; */
		width: calc(100% - 16px);
		/* padding-right: 5px; */
		/* padding-left: 5px; */

		/* white-space: normal; */
		/* word-wrap: break-word; */
		word-break: break-all;
	}

	#body #categories .category, #body #topic_list_level2 .category {
		width: 100%;
	}

	#body .nav-tabs:not(#subscriptionTabs):not(.mgmt_sub_cate_ul)  li {
		width: 100%;
		text-align: center;
	}

	#body #bookmarkInfo, #body #interestInfo{
		margin-top: 20px;
		margin-left: 7px; 
		margin-bottom: 10px;
	}

	#category_list, #topic_list_search, #topic_list, #book_list {
		/* margin-left: 15px !important; */

		/* margin-bottom: 20px; */
		/* margin-top: 20px; */
	}
	
	/* #category_list.searched {
		margin-bottom: 20px;
		margin-top: 20px;
	} */

	#body #interests {
		/* margin-left: 20px !important; */
		margin-top: 20px;
		margin-bottom: 32px;
	}

	#body #interests .btn {
		padding: 0;
	}

	#body #interests div a {
		/* margin: -5px 0; */
	}



	
	#body #contents .content {
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
		margin-bottom: 0px;
	}

	/* #body #contents .content .text {
		margin: 5px 0px 0px 0px;
		max-height: 120px;
		display: flex;
		justify-content: space-between;
	} */

	/* 208 230  250 138 120 96*/

	#body #contents .content .text #toc-container{
		overflow-y: auto;
		width: 100%;
	}

	#body #contents .content .text #toc-container.texthasimg{
		float: left;
		width: 60%;	
		/* margin-right: 10px; */
		/* height: 110px; */
	}

	#body #contents .content .text #toc-container #toc{
		margin-bottom: 0px;
	}

	#body #contents .content .text #toc-container #toc .gmd-toc{
		margin-bottom: 0px;
	}

	#body #contents .content .text #toc-container #toc .gmd-toc ul{
		margin-bottom: 0px;
	}


	#body #contents .content .text .textimghasimg{
		float: right;
		width: 40%;	
		height: 110px;
	}


	#body #contents .content .text p {
		margin: 0;
	}

	#body #contents .content .text p img {
		width: 500px;
	}

	#body #contents .content .text p {
		max-height: 110px;
		overflow: hidden;
	}

	#body #contents .content .text img {
		width: 100%;
		max-width: 100%;
	}
	#body #interests div {
		/* margin: 0.6em; */
		/* line-height: 1; */

		/* margin-top: 0px; */
		/* line-height: 1.42857143; */
		/* line-height: 1.8; */
	}

	#body #categories, #body #topic_list_level2 {
		margin: 0px;
	}

	#body #category_names input{
		margin-bottom: 0px;
	}
	#body #category_images ul {
		margin-bottom: 0px;
	}

	#body #category_images ul li button {
		/* margin-bottom: 0px; */
	}

	#body #category_images ul li button p {
		margin-bottom: 0px;
	}

	#body #category_images ul li button p {
		position: absolute;
		top: 75px;
		left: 50%;
		transform: translate(-50%);
	}

	#body #text .table-container table{
		max-width: 600px !important;
	}
	#body #text .table-container table tbody{
		max-width: 600px !important;
	}
	#body #text .table-container table tbody tr{
		max-width: 600px !important;
	}
	#body #text .table-container table tbody tr td{
		max-width: 600px !important;
	}

	#body #text .table-container table table{
		max-width: 585px !important;
	}
	#body #text .table-container table tbody table tbody{
		max-width: 585px !important;
	}
	#body #text .table-container table tbody tr table tbody tr{
		max-width: 585px !important;
	}
	#body #text .table-container table tbody tr td table tbody tr td{
		max-width: 585px !important;
	}






	#body .twoColumn{
		display: block;
	}
	#body .twoColumn .searchAndContents{
		width: 100%;
	}

	#body .twoColumn #categories, #body .twoColumn #topic_list_level2{
		width: 100% !important;
	}

	.searchAndContents{
		width: 100%;
		/* margin-top: 30px !important; */
	}


	#body #categories .panel .collapse, #body #topic_list_level2 .panel .collapse{
		/* height: 190px; */
		max-height: 250px;
    }

    #body #contents{
        /* width: 100%; 
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
		-webkit-overflow-scrolling: touch; 
        scroll-snap-type: x mandatory; */
    }

    #body #contents::-webkit-scrollbar{
		display: none;
	}

    /* #body .content{
        width: 180px;
    } */

    #body #contents .content{
		width: 300px;
        /* width: 100%; */
		/* margin-right: 20px; */
    }


    #body #contents .content .title {
        font-size: 16px !important;
    }

    p.header_margin1{
        font-size: 12px;
		width: 300px;
    }
    #body #maincontents:not(.isListView) p.header_margin3{
        height: 48px;
        width: 280px;
    }

    /* #body div.accessed {
        width: 300px;
    } */

    #body #contents .content .accessed{
        float: left;
    }

    #body #contents #toc{
        /* height: 178px; */
        height: 218px;
    }


    #body #contents .text{
        /* height: 200px; */
        height: 240px;
        /* width: 160px; */
        width: 280px;
    }
    #toc-container{
        /* height: 180px; */
        /* height: 220px !important; */
    }

    /* #body #contents .content .text #toc-container.texthasimg{
        height: 220px;
    }

    #body #contents .content .text .textimghasimg{
        height: 220px;
    } */

    #pagination{
		margin-top: 5px;
		font-size: 10px;
    }
    .pagination{
        margin: 5px 0px;
	}
	.pagination>li>a, .pagination>li>span{
		padding: 6px 8px;
	}
    .zeroList{
        height: 0px;
    }
    #body #categories .panel .collapse.zeroList, #body #topic_list_level2 .panel .collapse.zeroList{
        height: 0px;
	}
	
	#body #maincontents:not(.isListView) p.header_margin3 {
		height: 48px !important;
		width: 280px;
	}

	#body #category_images ul li button p{
		/* width: 100%; */
	}

	#body #category_images ul::-webkit-scrollbar{
		/* display: none; */
	}


	#body #category_images .leftArrow, #body #category_images .rightArrow{
		font-size: 20px;
	}

	/* #body #category_images .leftArrow:hover, #body #category_images .rightArrow:hover{
		color: #424248;
		cursor: pointer;
	} */
	#body #category_images ul {
		/* margin-right: 10px;
		margin-left: 10px; */
	}
	#category_list, #topic_list_search, #book_list{
	/* #category_list, #topic_list_search, #topic_list, #book_list{ */
		max-height: 265px;
	}

	input#category_name.form-control{
		height: 25px;
	}

	#body .allSearchForm button.btn.btn-default.submitBtn, #body .allSearchForm button.btn.btn-default.resetBtn{
		width: 25px;
		height: 25px;
	}
	
	#body .allSearchForm button.btn.btn-default.submitBtn img, #body .allSearchForm button.btn.btn-default.resetBtn img{
		width: 25px;
		height: 25px;
	}


	
	#body #contents .content_information{
		width: 280px;
	}

}

@media (max-width: 450px) {
    #body #category_images ul li button {
        /* width: 100%; */
        /* padding: 5px 5px 0 5px; */
        /* margin-bottom: 5px; */
		/* height:110px; */
		/* height:140px; */
    }
}

.content div.header_margin1 {
	/* display: flex; */
}

.content div.header_margin1 .bookTooltip {
	/* margin-right: 5px; */
}
.content div.header_margin1 .topicTooltip {
	/* margin-right: 5px; */
	margin-top: 3px;
}

.tooltip2 {
	/* position: relative;
	display: inline-block; */
	/* color: #424248;
	font-weight: 500; */

	/* position: relative;
	display: inline-block; */
	/* margin: auto; */
}

.wrap_tooltop{
	width: 100%;
	/* height: 100%; */
	display: flex;
	justify-content: flex-start;
}

.tooltip2 .tooltip-content2 {
	visibility: hidden; 
	/* width: 200px;  */
	width: 93%;
	background-color: #337ab7; 
	color: white; 
	font-weight: 500;
	/* font-size: 12px; */
	font-size: 80%;
	/* text-align: center;  */
	border-radius: 10px; 
	padding: 7px 5px; 
	position: absolute; 
	/* bottom: 79%; */
	/* bottom: 82%; */
	/* top: 30px; */
	bottom: 338px;
	z-index: 99;

	/* bottom: 180%; */

	/* top: 200%; 
	left: 50%; 
	margin-left: -105px; */


	/* visibility: hidden;
	width: 300px;
	background-color: orange;
	padding: 0;
	margin-top: 10px;
	color: white;
	text-align: center;
	position: absolute;
	z-index: 1; */

	/* visibility: hidden;
	width: 220px;
	background-color: orange;
	padding: 0;
	color: white;
	text-align: center;
	position: absolute;
	z-index: 1;
	bottom: 180%;
	left: 50%;
	margin-left: -110px; */
}

.tooltip2 .tooltip-content2.topicIconTooltip {
	position: absolute; 
	/* bottom: 77%; */
	/* top: 48px; */
	bottom: 320px;
}




.tooltip2 .tooltip-content2 li{
	padding-left: 10px;
}

.tooltip2 .tooltip-content2.showTooltip.bookIconTooltip {
	background-color: #4BADB3;
}

.tooltip2 .tooltip-content2.showTooltip.topicIconTooltip {
	background-color: #91C496;
}



.tooltip2 .tooltip-content2 p{
	margin-bottom: 0px !important;
}

.tooltip2 .tooltip-content2.showTooltip::after {
	content: ""; 
	position: absolute; 
	/* bottom: 87%;  */
	/* top: -15px; */
	bottom: -15px;
	left: 8%; 
	margin-left: -10px; 
	border-width: 10px; 
	border-style: solid; 
	border-color: transparent transparent Indigo transparent;

	/* content: " ";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: orange transparent transparent transparent; */

	/* content: " ";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: orange transparent transparent transparent; */
}

.tooltip2 .tooltip-content2.showTooltip.bookIconTooltip::after {
	/* 위 세모 */
	/* border-color: transparent transparent #4BADB3 transparent;  */
	/* 아래 세모 */
	border-color: #4BADB3 transparent transparent  transparent;
}

.tooltip2 .tooltip-content2.showTooltip.topicIconTooltip::after {
	/* border-color: transparent transparent #91C496 transparent; */
	border-color: #91C496 transparent transparent  transparent;
}

.tooltip2:hover .tooltip-content2.showTooltip:not(.hideTooltip) { visibility: visible; }


@media (max-width: 880px) {
	.tooltip2 .tooltip-content2 {
		position: absolute; 
		top: 30px;
		bottom: unset;
		/* bottom: 400px; */
	}
	.tooltip2 .tooltip-content2.topicIconTooltip {
		position: absolute; 
		top: 48px;
		bottom: unset;
		/* bottom: 310px; */
	}
	.tooltip2 .tooltip-content2.showTooltip::after {
		position: absolute; 
		top: -15px;
		bottom: unset;
		/* bottom: -15px; */
	}

	.tooltip2 .tooltip-content2.showTooltip.bookIconTooltip::after {
		/* 위 세모 */
		border-color: transparent transparent #4BADB3 transparent; 
		/* 아래 세모 */
		/* border-color: #4BADB3 transparent transparent  transparent; */
	}
	
	.tooltip2 .tooltip-content2.showTooltip.topicIconTooltip::after {
		border-color: transparent transparent #91C496 transparent;
		/* border-color: #91C496 transparent transparent  transparent; */
	}
}

@media (max-width: 480px) {
	.tooltip2 .tooltip-content2 {
		position: absolute; 
		top: 40px;
		bottom: unset;
		/* bottom: 400px; */
	}
	.tooltip2 .tooltip-content2.topicIconTooltip {
		position: absolute; 
		top: 58px;
		bottom: unset;
		/* bottom: 310px; */
	}
	.tooltip2 .tooltip-content2.showTooltip::after {
		position: absolute; 
		top: -15px;
		bottom: unset;
		/* bottom: -15px; */
	}
}


.topicAndCateCount{
	/* font-weight: 500;
	margin-left: 5px;
	padding: 1px 7px;
	text-align: center;
	color: #6C6CB7;
	background-color: #CFCFEB;
	border: none;
	border-radius: 20px;
	line-height: 1.2;
	word-break: normal; */
}

.topicAndCateCount.topicAndCateZero{
	/* color: #C9C9C9; */
}

.topic_ul li:hover .topicAndCateCount{
	/* color: white; */
	/* color: #F4C708; */
}

.topic_ul li:hover .topicAndCateZero{
	/* color: #C9C9C9; */
}

@media (max-width: 480px) {
	#body #topic_list .topic_ul li button{
		font-size: 90%;
	}
	.topicAndCateCount{
		font-size: 90%;
		padding-top: 2px;
		padding-bottom: 2px;
	}
}

.topicAndBookIcon {
	padding: 1px 5px;
	font-weight: 500;
	font-size: 11px;
	/* font-size: 80%; */
	width: 40px;
	text-align: center;
	/* width: 100%; */
	/* height: 100%; */

	
	line-height: 1;
}

.wrap_tooltop .cate_name{
	font-size: 80%;
	margin-left: 5px;
	width: calc(100%-45px);
	font-weight: 500;
	color: #4BADB3;
}
.topicTooltip .wrap_tooltop .cate_name{
	color: #91C496;
}

.bookIcon {
	border: 1px solid #4BADB3;
	color: #4BADB3;
}

.topicIcon {
	border: 1px solid #91C496;
	color: #91C496;
}

.tooltip2:hover .wrap_tooltop:not(.hoverNo) .bookIcon, .tooltip2.hover .wrap_tooltop:not(.hoverNo) .bookIcon {
	/* border: 1px solid #4BADB3;
	color: white;
	background-color: #4BADB3 ; */
}


.tooltip2:hover .wrap_tooltop:not(.hoverNo) .topicIcon, .tooltip2.hover .wrap_tooltop:not(.hoverNo) .topicIcon {
	/* border: 1px solid #91C496;
	color: white;
	background-color: #91C496 ; */
}

/* .wrap_tooltop .clickedTooltip.bookIcon{
	border: 1px solid #4BADB3;
	color: white;
	background-color: #4BADB3 ;
}

.wrap_tooltop .clickedTooltip.topicIcon{
	border: 1px solid #91C496;
	color: white;
	background-color: #91C496 ;
} */

/* @media (hover: hover) and (pointer: fine) {
	.tooltip2:hover .bookIcon, .tooltip2.hover .bookIcon {
		border: 1px solid #4BADB3;
		color: white;
		background-color: #4BADB3 ;
	}
	
	
	.tooltip2:hover .topicIcon, .tooltip2.hover .topicIcon {
		border: 1px solid #91C496;
		color: white;
		background-color: #91C496 ;
	}
} */

/* p.header_margin3{
	margin-top: 2px !important;
} */

/* @media (max-width: 992px) {
	#header .container, #body.container {
		width: 100% !important;
		padding: 0px !important;
		padding-right: 2% !important;
		padding-left: 2% !important;

	}
} */

.gs-title{
	color: red !important;
	font-size: 18px;
	font-family: "Roboto", "Noto Sans KR";
}

.gs-bidi-start-align.gs-snippet{
	color: #333333;
	font-size: 15px;
	font-family: "Roboto", "Noto Sans KR";
	font-weight: 400;
}

.gsc-adBlock{
	display: none !important;

}


ul#gs_results{
	padding-left: 0px;
}

li.gs_result{
	margin-top: 10px;
	list-style: none;
	font-size: 15px;
	font-family: "Roboto", "Noto Sans KR";
	color: #333333;
}

.gs_result .gs_title{
	font-size: 18px;
	font-weight: 400;
}

.gs_result .gs_link{
	color: blue;
}

.gs_result .gs_snippet{
	color: grey;
}

.gs_result .gs_snippet .snippet_date{

}

.gs_result .gs_snippet .snippet_content{

}


.search_container{
	margin-top: 40px;
}

.searchHighlighted{
	/* background-color: yellow; */
    font-weight: 700;
}

hr.categoryList_hr {
	/* border-top: none; */
}
hr.search_bookList_hr{
	border-top: none;
}
hr.search_topicList_hr{
	border-top: none;
}

.categoryListOne a, .topicListOne a{
	/* color: #333333; */
	/* color: #337ab7; */
}

.categoryListOne a:hover, .topicListOne a:hover{
	/* color: #337ab7; */
	color: #333333;
}

.typeButton{
	color: #4883B6;
}



.notice_alert_div, .bookAll_notice{
    margin-top: 20px;
}
a.notice_alert{
	margin-left: 17px;
    color: #828282;
	font-weight: 500;
	display: block;
}
ul.notice_alert_div, .bookAll_notice{
	padding-left: 0px;
	list-style: none;
}
#interestInfo a.notice_alert{
	margin-left: 0px !important;
}

.categoryAndContents ul.notice_alert_div, .bookAll_notice, .topics_container ul.notice_alert_div {
	padding-left: 0px;
	list-style: none;
}


@media (max-width: 480px) {
	a.notice_alert{
		margin-left: 7px;
	}
}

a.notice_alert:hover{
	color: #333333;
	text-decoration: none;
}

a.notice_alert span.notice_type{
	color: #455BB7;
	margin-right: 5px;
}


/* 수정(이벤트/공지 너비 동일하도록) */

.notice_alert_div li.notice a.notice_alert{
	display: flex;
	justify-content: flex-start;
}

.notice_alert_div li.notice a.notice_alert .notice_type:not(.type_event) .textOne_first{
	margin-right: 13px;
}

.notice_alert_div li.notice a.notice_alert .notice_type{
	width: 48px;
}

.notice_alert_div li.notice a.notice_alert .notice_title{
	width: calc(100% - 48px);
}








#interests .created{
	margin-left: 5px;
	color: #C9C9C9;
}


.selected_cate_button{
	margin-left: 17px;
	margin-bottom: 10px;
}
@media (max-width: 880px){
	.selected_cate_button{
		margin-bottom: -20px;
	}
}
@media (max-width: 480px){
	.selected_cate_button{
		margin-left: 7px;
	}
}

.selected_cate_button .selected_cate_name{
	font-weight: 500;
	margin-right: 10px;
	vertical-align: middle;
	font-size: 16px;
}
.selected_cate_button button{
	color: white;
	border: 1px solid #4BADB3;
	background-color: #4BADB3;
	border-radius: 10px;
	font-size: 12px;
	font-weight: 500;
	padding: 2px 10px;
}
.selected_cate_button .go_contents{

}
.selected_cate_button .go_book{
	color: white;
	border: 1px solid #91C496;
	background-color: #91C496;
	margin-left: 3px;

}






/* -- new tooltip: start -- */

.content div.header_margin1 .bookTooltip, .content div.header_margin1 .topicTooltip{
	position: relative;
}

.topicAndBookIcon{
	height: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0px;
}
.wrap_tooltop .cate_name{
	line-height: 18px;
	height: 18px;
}
.tooltip2 .tooltip-content2, .tooltip2 .tooltip-content2.topicIconTooltip {
	visibility: hidden; 
	background-color: #337ab7; 
	color: white; 
	font-weight: 500;
	font-size: 80%;
	position: absolute; 

	width: calc(100% - 40px - 5px);
	left: 45px;
	top: 0px;
	bottom: unset;
	padding: 0px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 0px;

	z-index: 99;
}

#body #maincontents.isListView .tooltip2 .tooltip-content2 {
	width: calc((100% - 40px - 5px)/2);
}

@media (max-width: 600px) {
	#body #maincontents.isListView .tooltip2 .tooltip-content2 {
		width: calc(100% - 40px - 5px);
	}
}

.tooltip2 .tooltip-content2 li{
	padding-left: 0px;
}


.tooltip2 .tooltip-content2.topicIconTooltip {
	position: absolute; 
	bottom: unset;
}


.tooltip2 .tooltip-content2.showTooltip.bookIconTooltip {
	background-color: white;
	border: 1px solid #4BADB3;
	color: #4BADB3;
}

.tooltip2 .tooltip-content2.showTooltip.topicIconTooltip {
	background-color: white;
	border: 1px solid #91C496;
	color: #91C496;
}

#maincontents .tooltip2 .tooltip-content2.showTooltip::after {
	display: none;
}

/* -- new tooltip: end -- */


.book_header h4, .topic_header h4{
	/* width: 43px; */

	width: 100%;
    font-family: var(--font-family);
    color: #111;
    text-align: left;
    font-size: 20px;
    line-height: 140%;
    letter-spacing: -.02em;
    font-weight: 500;
    position: relative;
    margin-top: 0px;
    margin-bottom: 20px;
	/* font-family: "Roboto", "Spoqa Han Sans", "Noto Sans KR" !important; */
}

h4.panel-title{
	/* font-family: "Roboto", "Spoqa Han Sans", "Noto Sans KR" !important; */
}

.book_header:hover, .topic_header:hover{
	cursor: pointer;
}
.topic_header h4:hover, .book_header h4:hover {
    color: #333333;
}
.showAndHideBtn:hover {
    color: #333333;
}
#body #topic_list_level2 .panel .panel-heading a.first_list{
    display: flex;
    align-items: flex-start;
}
/* #body #category_list, #body #topic_list_search, #body #topic_list, #body #book_list {
    margin-left: 5px;
} */
#category_list, #topic_list_search{
	/* margin-left: 5px !important; */
}


#category_list.bookmarks_cate_search .categoryListOne a{
	/* color: #337ab7; */
}


#category_list.bookmarks_cate_search .categoryListOne a:hover{
	color: #333333;
}




/* TOC - 핵심포인트 길 경우 ... 처리: start */
#toc>.gmd-toc.gmd-block a{
	/* .tab-content #toc-container #toc .gmd-toc.gmd-block a{ */
	/* #toc.practicalBook .gmd-toc.gmd-block a{ */
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		word-break: break-all; 
	}
	
	
	
	
	/* TOC - 핵심포인트 길 경우 ... 처리: end */









/* -- 콘텐츠 관리 > 책이미지 목록(가로스크롤) 너비 고정 -- */
#category_images{
	width: 100%;
}

#category_images ul{
	/* width: calc(100% - 60px); */
	/* height: 182px; */
}
@media (max-width: 480px) {
	#category_images ul{
		/* width: calc(100% - 40px); */
		/* height: 140px; */
	}

}














/* 여백 제거 테스트(240905)*/
/* #body #contents .content {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 40px;
}

@media (max-width: 880px){
	#body #contents .content {
        width: 340px;
        margin-bottom: 0;
    }
	#body #contents .content .topicAndBook_icon, p.header_margin3, #body .content_information, #body #contents .text{
		width: 300px;
	}
} */





#body #interestInfo{
	padding-left: 0px;
	margin-left: 0px;

}












/* =========== new 디자인 (250103) ============== */

#body #contents, #body .sk_loading_contents{
	gap: 24px;
	row-gap: 48px;
}

#body .isListView #contents, #body .isListView .sk_loading_contents{
	row-gap: 24px;
}


#body #contents .content, #body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content, #body #contents .content, #body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
	background: #ffffff;
	border-radius: 24px;
	/* height: 385px; */
	position: relative;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.10);
	padding: 0px;
	/* margin-bottom: calc(48px - 24px); */
	width: calc((100% - 24px - 24px) / 3);
}

#body #maincontents.contents_column2.contents_column2:not(.isListView) #contents .content, #body #maincontents.contents_column2.contents_column2:not(.isListView) .sk_loading_contents .content{
	width: calc((100% - 24px) / 2);
}

.content .content_info{
	background: #f6f7fa;
	padding: 24px 24px 10px 24px;
	position: relative;
	border-radius: 24px 24px 0px 0px;
}


.content_info .imgSpan {
    position: absolute;
    top: 12px; /* 상단에 배치 */
    right: 12px; /* 우측에 배치 */
    z-index: 10; /* 필요한 경우 다른 요소 위로 배치 */
}
#body #contents .content .content_info .imgSpan .iconText {
	background: #ee730f;
	border-radius: 50%;
	width: 26px;
	height: 26px;

	/* padding: 3px 7px; */
	padding: 0px;

	display: flex; /* Flexbox 활성화 */
    justify-content: center; /* 가로 가운데 정렬 */
    align-items: center; /* 세로 가운데 정렬 */

	color: #ffffff;
	text-align: center;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.025em;
	font-weight: 500;
	position: relative;
}

#body #contents .content .content_info .imgSpan .iconText.UIcon {
	background: #ff069b;
}

.topicAndBook_icon{
	/* padding: 26px 24px 10.5px 24px; */
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: flex-start;
	justify-content: flex-start;
	flex-shrink: 0;
	/* width: 235px; */

	margin-bottom: 10px;
}

.topicAndBookIcon{
	all: unset;
	background: #50adb2;
	border-radius: 20px;
	padding: 2px 9px 2px 9px;
	color: #ffffff;
	text-align: left;
	font-size: 12px;
	line-height: 140%;
	letter-spacing: -0.025em;
	font-weight: 500;

	position: relative;
	border: none;

	height: 20px;
}

.bookIcon {
}
.topicIcon{
	background: #76ba7e;
}

.content div.header_margin1 .bookTooltip, .content div.header_margin1 .topicTooltip{
	width: 100%;
}
.wrap_tooltop{
	gap: 6px;
}
.wrap_tooltop .cate_name{
	all: unset;
	width: calc(100% - 44px - 6px);

	color: #50adb2;
	text-align: left;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 400;
	position: relative;
}
.topicTooltip .wrap_tooltop .cate_name{
	color: #76ba7e;
}

.isListView .wrap_tooltop .cate_name{
	width: calc(100% - 44px - 6px - 26px - 10px);
	display: block;                 /* 요소를 블록으로 설정 */
	overflow: hidden;               /* 넘치는 텍스트를 숨김 */
	text-overflow: ellipsis;        /* 넘치는 텍스트를 '...'로 표시 */
	white-space: nowrap;            /* 텍스트를 한 줄로 표시 */
}

.typeButton {
    padding: 2.5px 5px;
	margin-right: 3px;
}
#body #contents .content .header_margin3{
	height: 50px;
	margin-bottom: 6px;
}
#body #contents .content .title{
	color: #111111;
	text-align: left;
	font-size: 18px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;

	/* 멀티라인 클램프 설정 */
	display: -webkit-box;
	display: box; /* 표준 속성 */
	-webkit-line-clamp: 2; /* 최대 줄 수 설정 (벤더 프리픽스) */
	line-clamp: 2; /* 표준 속성 */
	-webkit-box-orient: vertical; /* 세로 방향으로 클램핑 */
	box-orient: vertical; /* 표준 속성 */
	overflow: hidden;
	text-overflow: ellipsis;
}

#body #contents .content .accessed{
	font-family: var(--font-family);
	color: #767676;
	text-align: left;
	font-size: 12px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 400;
}


.content_information{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	gap: 10px;
}

.content_information .publicAndBookmark{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 4px;
}


.content_information .bookmark_checked, .content_information .bookmark_not{
	margin-right: 0px;
	width: 25px;
	height: 25px;
    color: transparent;
}
.content_information .bookmark .bookmark_svg{
	flex-shrink: 0;
	width: 25px;
	height: 25px;
	position: relative;
	overflow: visible;
}



.content_information .public, .book-content-item .public{
	all: unset;

	border-radius: 20px;
	padding: 2px 8px 2px 8px;
	display: flex;
	flex-direction: row;
	gap: 10px;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;

	color: #ffffff;
	text-align: left;
	font-size: 12px;
	line-height: 140%;
	letter-spacing: -0.025em;
	font-weight: 500;
}

.content_information .public.public_0, .book-content-item .public.public_0{
    color: #fff;
    border: 1px solid var(--public0-color);
    background-color: var(--public0-color);
}
.content_information .public.public_5, .book-content-item .public.public_5{
	color: #fff;
    border: 1px solid var(--public5-color);
    background-color: var(--public5-color);
}
.content_information .public.public_10, .book-content-item .public.public_10{
    color: #fff;
    border: 1px solid var(--public10-color);
    background-color: var(--public10-color);
}
.content_information .public.public_15, .book-content-item .public.public_15{
    color: #fff;
    border: 1px solid var(--public15-color);
    background-color: var(--public15-color);
}



/* toc 부분 */
#body #maincontents:not(.isListView) .content .content_data{
	padding: 18px 24px 18px 24px;
	height: 214px;
}

#body #contents .content .text{
	all: unset;
	display: block;
	overflow: hidden;
	width: 100%;
	border: none;
	padding: 0px;
	margin: 0px;
}

#body #contents #toc{
	height: 178px;
	width: 100%;
}
#body #contents .content .text .textimg{
	height: 178px;
}
.texthasimg {
	width: 60% !important;
}

#body #contents .content .text .toc_view.texthasimg #toc{
	/* width: 206px; */
	scrollbar-width: none; 
    -ms-overflow-style: none; 
	padding-right: 10px;
}
#body #contents .content .text .textimg.textimghasimg, #body .sk_loading_contents .content .text .textimg.textimghasimg{
	width: 40% !important;
	/* width: 110px; */
	scrollbar-width: none; /* Firefox용 */
    -ms-overflow-style: none; /* IE/Edge용 */
}
#toc::-webkit-scrollbar, .textimg::-webkit-scrollbar {
    display: none; /* Chrome, Safari용 */
}

#body #contents .content .text *{
	font-family: var(--font-family);

	margin-bottom: 0px;

	color: #111111;
	text-align: left;
	font-size: 14px;
	/* line-height: 160%; */
	/* letter-spacing: -0.02em;1 */
	font-weight: 400;
	position: relative;
}
#body #contents .content .text .toc_view #toc .gmd-block ul li a, #body #contents .content .text .toc_view #toc .gmd-block *{
	font-size: 14px;
	/* letter-spacing: -0.02em; */
	line-height: 22px;
}
#body #contents .content .text li{
	/* margin-bottom: 5px; */
}















/* ============ 콘텐츠 리스트 방식 new (250107) ========= */


#body #maincontents.isListView .contentDiv_text{
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
}

#body #maincontents.isListView  #contents .content .contentDiv_hasImg .contentDiv_img  span.imgCount{
	background: rgba(0,0,0,.4);
    border-radius: 19px;
    color: #fff;
    display: block;
    font-size: 11px;
    font-weight: 500;
    height: 19px;
    letter-spacing: -.3px;
	line-height: 19px;
	min-width: 24px;
    padding: 0 5px;
    position: absolute;
    right: 6px;
    text-align: center;
    top: 6px;
}



@media (max-width: 880px) {
	/* 콘텐츠별 880이하에서도 가르스크롤 뺌 */
	#body #maincontents:not(.isListView) #contents {
		display: block;
		overflow-x: none;

		width: 100%; 
		display: block;
		flex-wrap: none;
		overflow-x: none;
		-webkit-overflow-scrolling: none; 
		scroll-snap-type: x none;
	}

	#body #maincontents:not(.isListView) #contents .content .topicAndBook_icon{
		width: 100%;
	}
	#body #maincontents:not(.isListView) p.header_margin3{
		width: 100%;
	}
	#body #maincontents:not(.isListView) .content_information{
		width: 100%;
	}
	#body #maincontents:not(.isListView) #contents .text{
		width: 100%;
	}


	#body #maincontents:not(.isListView) .text{
		height: 220px;
	}
	#body #maincontents:not(.isListView) #toc-container{
		height: 220px;
	}
	#body #maincontents:not(.isListView) #contents #toc{
		height: 220px;
	}
	#body #maincontents:not(.isListView) #contents .content .text .textimghasimg{
		height: 220px;
	}

	#body #maincontents.isListView #contents {
		/* display: block;
		overflow-x: visible; */
	}


	#body #maincontents.isListView #contents .content{
		/* margin-bottom: 24px; */
	}
	#body #maincontents.isListView #contents .content .topicAndBook_icon{
		width: 100%;
	}
	#maincontents.isListView p.header_margin3{
		width: 100%;
	}
	#body #maincontents.isListView #contents .text{
		width: 100%;
	}
	#body #maincontents.isListView .content_information{
		width: 100%;
	}
}


@media (max-width: 660px){
	#body #maincontents:not(.isListView) #contents .content, #body #maincontents.contents_column2.contents_column2:not(.isListView) #contents .content{
		width: 100%;
		margin-right: 0px;
	}
/* 

	#body #maincontents:not(.isListView) .text{
		height: 150px;
	}


	#body #maincontents:not(.isListView) #toc-container{
		height: 150px;
	}
	#body #maincontents:not(.isListView) #contents #toc{
		height: 150px;
	}
	#body #maincontents:not(.isListView) #contents .content .text .textimghasimg{
		height: 150px;
	} */

}


#body #maincontents.isListView .tooltip2 .tooltip-content2 {
	width: calc((100% - 40px - 5px)/2);
}

@media (max-width: 600px) {
	#body #maincontents.isListView .tooltip2 .tooltip-content2 {
		width: calc(100% - 40px - 5px);
	}
}










#body #maincontents.isListView div#contents .content{
	display: block;
    width: 100%;
    margin-right: 0;
}
#body #maincontents.isListView div#contents .content .content_info{
	padding: 24px 24px 12px 24px
}
#body #maincontents.isListView div#contents .content .content_info .topicAndBook_icon{
	margin-bottom: 0px;
}
#body #maincontents.isListView div#contents .content .content_data{
	height: auto;
	padding: 12px 24px 24px 24px;

	box-sizing: border-box;
	overflow: visible; /* 넘치는 콘텐츠 보이기 */


}


#body #maincontents.isListView  .contentDiv_hasImg{
	display: flex;
	justify-content: space-between;
	gap: 40px;
}
#body #maincontents.isListView  .contentDiv_hasImg .contentDiv_img{
	width: 110px;
	position: relative;
}

#body #maincontents.isListView  #contents .content .contentDiv_hasImg .contentDiv_img img{
	width: 110px;
	height: 110px;
	border: none;
	border-radius: 10px;
}
#body #maincontents.isListView div#contents p.header_margin3{
	height: auto;
	margin-bottom: 6px;
}
#body #maincontents.isListView div#contents p.header_margin3 .title{
	color: #111;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -0.36px;
}

#body #maincontents.isListView .content_information{
	margin-bottom: 10px;
}
#body #maincontents .content_information div.accessed{
	/* width: calc(100% - 39px - 25px - 4px - 10px); */
	width: calc(100% - 67.15px - 10px);
	color: #767676;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	letter-spacing: -0.24px;
}

#body #maincontents.isListView div#contents .content .content_data .text #toc-container{
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; 
	line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap:break-word; 

	color: #111;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 160%; 
	letter-spacing: -0.28px;
}

#body #maincontents.isListView  .content_info .imgSpan {
    position: absolute;
    top: 24px;
    right: 24px; 
    z-index: 10;
}

































/* 스캘레톤 new (250106) */
#body #maincontents #contents{
	margin-top: 24px; /* 스캘레톤 처음 삽입 시 시작 위치 맞추기 위해 추가*/
}
#body #maincontents .sk_loading_contents{
	margin-top: 24px; /* 스캘레톤 중간 삽입 시 gap 24px 맞추기 위해 추가*/
}


#body #maincontents:not(.isListView) .sk_loading_contents{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.sk_loading_contents{
	display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	margin-left: 0;
    margin-right: 0;
	gap: 24px;
}



#body #maincontents.isListView .sk_loading_contents{
	width: 100%; 
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
}

.sk_loading_contents .skeleton_content{
	/* margin-bottom: calc(48px - 24px); */
}

.sk_loading_contents .skeleton_content .content_info{

}

.content_information .skeleton_loading .skeleton_text:nth-child(1){

}



.skeleton_img {
    width: 100%;
	height: 100%;
}
 
.skeleton_text {
	height: 1rem;
	height: 14px;
	background: #e5e5e5 !important;
}

.skeleton_loading *:not(.bookmark, .bookmark_svg) {
    background: linear-gradient(120deg, #e5e5e5 30%, #f0f0f0 38%, #f0f0f0 40%, #e5e5e5 48%);
    border-radius: 1rem;
    background-size: 200% 100%;
    background-position: 100% 0;
    animation: load 2s infinite;
}

.wrap_tooltop.skeleton_loading{
	align-items: center;
}


.topicAndBookIcon.skeleton_text{
	width: 26px;
	height: 16.8px;
}

.cate_name.skeleton_text{
	width: 200px;
	height: 18px;
}

.content_information .info_accessed .skeleton_text{
	width: 200px;
	height: 16px;
}

.public.skeleton_text{
	width: 22px;
	height: 18px;
}

.content .header_margin3{
	height: 50px;
	margin-bottom: 6px;
}


.title.skeleton_text{
	display: block;
	width: 285px;
	height: 25px;
}
.publicAndBookmark.skeleton_loading .bookmark{
	height: 25px;
}

#body #maincontents.isListView .sk_loading_contents{
	width: 100%; 
	/* display: block; */
}


.toc_view #toc .gmd-block.skeleton_loading .skeleton_text{
	height: 16px;
	margin-bottom: 8px;
}

.toc_view #toc .gmd-block.skeleton_loading .skeleton_text.level1{
	width: 150px;
}
.toc_view #toc .gmd-block.skeleton_loading .skeleton_text.level2{
	width: calc(100% - 20px);
	margin-left: 20px;
}

.skeleton_img{
	/* width: 110px; */
	height: 75px;
	margin-bottom: 6px;
}













/* 스켈레톤 list 방식 new (250107) */

#body #maincontents.isListView .sk_loading_contents .content{
	background: #ffffff;
	border-radius: 24px;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.10);

	padding: 0px;
	/* margin-bottom: calc(48px - 24px); */
}

#body #maincontents.isListView .sk_loading_contents .content .content_info{
	padding: 24px 24px 12px 24px;
}
#body #maincontents.isListView .sk_loading_contents .content .content_info .topicAndBook_icon{
	margin-bottom: 0px;
}


#body #maincontents.isListView .sk_loading_contents .content_data{
	height: auto;
	padding: 12px 24px 24px 24px;

	box-sizing: border-box;
	overflow: visible; /* 넘치는 콘텐츠 보이기 */
}



#body #maincontents.isListView .sk_loading_contents .content .header_margin3{
	height: auto;
}

#body #maincontents.isListView .sk_loading_contents .skeleton_img{
	width: 110px;
	height: 110px;
	border-radius: 10px;
	margin-bottom: 0px;
}

#body #maincontents.isListView .sk_loading_contents .content .content_data_inList .skeleton_loading .skeleton_text{
	width: 100%;
}



#body #maincontents.isListView .sk_loading_contents .content_data_inList2{
	width: 100%;
}
#body #maincontents.isListView .sk_loading_contents .content_data_inList2 .list_view{
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 8px;
}
#body #maincontents.isListView .sk_loading_contents .content_data_inList2 .list_view .description.skeleton_text{
	height: 16px;
}














/* 스캘레톤 원본 (250106) */
/* #body #maincontents:not(.isListView) .sk_loading_contents{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.sk_loading_contents{
	display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	margin-left: 0;
    margin-right: 0;
	gap: 24px;
}

#body #maincontents.isListView .sk_loading_contents{
	width: 100%; 
	display: block;
}

.sk_loading_contents .skeleton_content{
	margin-bottom: calc(48px - 24px);
}

.sk_loading_contents .skeleton_content .content_info{

}

.content_information .skeleton_loading .skeleton_text:nth-child(1){

}












#body #maincontents.isListView .sk_loading_contents{
	width: 100%; 
	display: block;
}







#body #maincontents.isListView .sk_loading_contents .content{
	display: block;
	width: 100%;
	margin-right: 0px;
	border: 1px solid #DBDBDB;
	border-radius: 10px;
	padding: 20px;
	margin-bottom: 40px;
}


#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg{
	height: 200px;
	display: flex;
	border: 1px solid #DBDBDB;
	border-radius: 10px;

	padding: 10px;
	margin: 5px 0px 8px 0px !important;

}




#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text{
	width: calc(100% - 90px - 16px);
	margin-right: 13px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text{
	width: 70%;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(1){
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(2){
	margin-left: 20px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(3){
	margin-left: 20px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(4){
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(5){
	margin-left: 20px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(6){
	margin-left: 20px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(7){

}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(8){
	margin-left: 20px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(9){
	margin-left: 20px;
}

#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_img{
	width: 90px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .contentDiv_hasImg .contentDiv_img .skeleton_img{
	width: 90px;
	height: 90px;
}
#body #maincontents:not(.isListView) .sk_loading_contents .contentDiv_hasImg .contentDiv_img .skeleton_img:nth-child(1){
	margin-bottom: 3px;
}


#body #maincontents.isListView .sk_loading_contents .contentDiv_hasImg{
	display: flex;
}


#body #maincontents.isListView .sk_loading_contents  .contentDiv_hasImg .contentDiv_text{
	width: calc(100% - 90px - 16px);
	height: 90px;
}


#body #maincontents.isListView .sk_loading_contents .contentDiv_hasImg .contentDiv_img{
	width: 90px;
	margin-right: 13px;
	position: relative;
}

#body #maincontents.isListView .sk_loading_contents .content .contentDiv_hasImg .contentDiv_img .skeleton_img{
	width: 90px;
	height: 90px;
}



#body #maincontents.isListView .sk_loading_contents .topicAndBook_icon{
	display: block;
	width: 100%;
}

.topicAndBook_icon .skeleton_loading{
	display: flex;
	justify-content: flex-start;
}

#body #maincontents .content div.header_margin1.topicAndBook_icon{

}


#body #maincontents .topicAndBook_icon .skeleton_loading:nth-child(2){
	margin-bottom: 6px;
}


#body #maincontents:not(.isListView) .topicAndBook_icon .skeleton_loading:nth-child(3){
	height: 50px;
}
#body #maincontents:not(.isListView) .topicAndBook_icon .skeleton_loading:nth-child(3) {
	display: block;
	width: 100%;
	height: 50px;
}





.topicAndBook_icon .skeleton_loading:nth-child(3) .skeleton_text{
	height: 23.8px;
	width: 80%;
}

.topicAndBook_icon .skeleton_loading:not(.skeleton_title) .skeleton_text:nth-child(1) {
	width: 40px;
	margin-right: 10px;
	border-radius: 0px;
}
.topicAndBook_icon .skeleton_loading .skeleton_text:nth-child(2) {
	width: 150px;
}

.topicAndBook_icon .skeleton_title{
	height: 50px;
}



#maincontents.isListView .contentDiv_text>.skeleton_loading:nth-child(1) .skeleton_text{
	height: 22px;
	width: 60%;
}

#maincontents.isListView .contentDiv_text .content_data .skeleton_loading:nth-child(1) .skeleton_text{
	height: 16px;
}

.sk_loading_contents .content_information{
	height: 24px;
}
.content_information .skeleton_loading{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}
.content_information .skeleton_loading .skeleton_text:nth-child(1){
	width: 40%;
	margin-bottom: 0px;
	margin-right: 5px;
}
.content_information .skeleton_loading .skeleton_text:nth-child(2){
	width: 35px;
	margin-bottom: 0px;
	margin-right: 5px;
	border-radius: 0px;
}
.content_information .skeleton_star{
	background: none;
	color: #e5e5e5;
}

.resultAndSortSkeleton.skeleton_loading{
	display: flex;
	align-items: center;
}

.resultAndSortSkeleton.skeleton_loading .skeleton_text:nth-child(1){
	width: 100px;
	margin-right: 20px;
	margin-bottom: 0px;
}



.skeleton_loading {

}

.skeleton_img {
    width: 100%;
	height: 100%;
}
 
.skeleton_text {
    margin-bottom: 0.5rem;
	height: 1rem;
	height: 14px;
	background: #e5e5e5;
}

.skeleton_loading * {
    background: linear-gradient(120deg, #e5e5e5 30%, #f0f0f0 38%, #f0f0f0 40%, #e5e5e5 48%);
    border-radius: 1rem;
    background-size: 200% 100%;
    background-position: 100% 0;
    animation: load 2s infinite;
}






@media (max-width: 1199px){
	#body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		padding-left: 13px;
		padding-right: 13px;

		margin-bottom: 20px;
	}
}

@media (max-width: 950px){
	#body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		position: relative !important;
		display: inline-block;
		vertical-align: top;
		width: 50%;
		margin-right: 0px;

		padding-left: 20px;
		padding-right: 20px;
		margin-bottom: 0px;
	}
}
@media (max-width: 480px){
	#body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		padding-left: 10px;
		padding-right: 10px;
	}
}




@media (max-width: 880px){
	#body #maincontents:not(.isListView) .topicAndBook_icon .skeleton_loading:nth-child(3){
		height: 48px;
	}

	#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg{
		height: 220px;
	}
	#body #maincontents:not(.isListView) .text, #body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text{
		height: 220px;
	}
	#body #maincontents:not(.isListView) #toc-container, #body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_img{
		height: 220px;
	}

	
	#body #maincontents.isListView #contents .content, #body #maincontents.isListView .sk_loading_contents .content{
		margin-bottom: 20px;
	}
}
@media (max-width: 660px){
	#body #maincontents:not(.isListView) .topicAndBook_icon .skeleton_loading:nth-child(3){
		height: 23.8px;
	}

	#body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content, #body #maincontents.contents_column2.contents_column2:not(.isListView) #contents .content, #body #maincontents.contents_column2.contents_column2:not(.isListView) .sk_loading_contents .content{
		width: 100%;
		margin-right: 0px;
	}

	#body #maincontents:not(.isListView) .sk_loading_contents .topicAndBook_icon br{
		display: none;
	}

	#body #maincontents:not(.isListView) .text, #body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg{
		height: 150px;
	}
	#body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(8), #body #maincontents:not(.isListView) .sk_loading_contents .content .contentDiv.contentDiv_hasImg .contentDiv_text .skeleton_text:nth-child(9){
		display: none;
	}
	#body #maincontents:not(.isListView) .sk_loading_contents .contentDiv_hasImg .contentDiv_img .skeleton_loading:nth-child(2){
		display: none;
	}

	.topicAndBook_icon .skeleton_loading:nth-child(3) {
		display: block;
		width: 100%;
		height: 24px;
	}
}


 */




















 /* ============== 검색창 =============== */

 #body #category_names {
	margin-top: 5px;
	text-align: center;
}

#body #category_names .column2{
	display: inline-block;
	border-bottom: 1px solid #ddd;
}

#body #category_names input, #body .search input {
	margin: 0px;
	width: 400px;
}
#category_name, #body .search input{
    height: 24px;
}

 #body .topics_container #category_names, #body #category_names.inBookmark, #body .search{
	display: flex;
	justify-content: flex-end;
	align-items: center;
 }

 #body .topics_container #category_names, #body #category_names.inSite{
	margin-bottom: 40px;
 }

 #body .topics_container #category_names .column2, #body #category_names.inBookmark .column2, #body .search .column2 {
	width: 100%;
	border-bottom: none;

	border-radius: 12px;
	border-style: solid;
	border-color: #d9d9d9;
	border-width: 1px;

	width: 460px;
	height: 56px;
	position: relative;
	padding: 16px 30px;
 }

 #body .topics_container .allSearchForm, #body #category_names.inBookmark .allSearchForm, #body .search .allSearchForm{
	display: flex;
	justify-content: space-between;
	align-items: center;
 }

 #body .topics_container #category_names input,  #body #category_names.inBookmark input, #body .search input{
	width: calc(100% - 34px);
 }

 #body .topics_container #category_names input.form-control,  #body #category_names.inBookmark input.form-control, #body .search input.form-control{
	padding: 0px;
	border: none;
	box-shadow: none;
 }
 #body .topics_container #category_names input.form-control::placeholder, #body #category_names.inBookmark input.form-control::placeholder, #body .search input.form-control::placeholder{
	color: #999999;
	text-align: left;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.025em;
	font-weight: 400;
	position: relative;
	padding: 0px;
 }
 #body #category_names .resetBtn .xi-close,  #body #category_names.inBookmark .resetBtn .xi-close,  #body .search .resetBtn .xi-close{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
 }





 /* 접기/펼치기 */
 #settingBtnDiv.inBookmark{
	height: 24px;
	margin-top: 23px;
	margin-bottom: 40px;
 }
 #settingBtnDiv.inBookmark .settingBtn{
	display: flex;
	justify-self: flex-end;
	align-items: center;

	color: #999999;
	text-align: left;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;

	height: 24px;
 }

 button.settingBtn_fold svg{
    transition: transform 300ms ease-in-out;
}

 button.settingBtn_fold.open svg{
	transform: rotate(-180deg);
}























/*  ================ 토픽 ==================== */

.topic_header h4{
	width: 100%;
	font-family: var(--font-family);
	color: #111111;
	text-align: left;
	font-size: 20px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;

	margin-top: 0px;
	margin-bottom: 20px;
}






/* --- 토픽 이미지 ----- */
.home #topic_list{
    margin-top: 100px;
    width: 100%;
}

#topic_list ul.topic_ul{
    padding: 0px;
    gap: 23px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}


#body #topic_list ul.topic_ul li{
    all: unset;
    padding-right: 0px;
}

/* .topic-item-container: 책 항목 전체를 감싸는 컨테이너 */
.topic-item-container,
.topic-item-container * {
    box-sizing: border-box;
}

/* .topic-item-container: 항목을 감싸는 전체 div */
#body #topic_list ul li.topic-item-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    justify-content: flex-start;
    width: 130px;
    position: relative;
}

/* 7번째, 8번째 사이 gap은 22px로 되어있어서, -1해줘야함.. */
#body #topic_list ul.topic_ul li:nth-child(8n) {
/* #body #topic_list ul.topic_ul li:nth-child(8n):not(:last-child) { */
    margin-right: -1px; 
	/* 마지막 간격을 1px 줄임 */
}


#body #topic_list ul li.topic-item-container:hover{
    cursor: pointer;
}

/* .topic-item-content: 이미지 및 내용을 감싸는 div */
.topic-item-content {
    background: #f1f1f5;
    border-radius: 24px;
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    width: 130px;
    height: 130px;
    padding: 30px;
    position: relative;
}


.topic-img-group {
    flex-shrink: 0;
    width: 70px; 
    height: 70px; 
    position: relative; 
    display: flex;
    justify-content: center; 
    align-items: center;
}

img.topic-img {
    max-width: 100%; 
    max-height: 70px;
    height: auto; 
    width: auto;
    object-fit: contain; 
}
#body #topic_list ul li.topic-item-container:hover .topic-item-content{
    background: #ced5e9;
}
#body #topic_list ul li.topic-item-container:hover img.topic-img {
    filter: invert(32%) sepia(65%) saturate(1342%) hue-rotate(207deg) brightness(86%) contrast(82%);
}



.topicCount{
    background: #00c346;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    position: absolute;
    bottom: 14px;
    right: 14px;

    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: -0.025em;
    font-weight: 500;
    padding: 6px;
}


/* .topic-info-container: 책 정보 부분을 감싸는 div */
.topic-info-container {
    width: 100%;
}


/* .topic-name: 책 이름 */
.topic-name {
    width: 100%;
    color: #111111;
    text-align: center;
    font-size: 16px;
    line-height: 140%;
    letter-spacing: -0.02em;
    font-weight: 400;
    position: relative;


    word-wrap: break-word; /* 긴 단어를 강제로 다음 줄로 넘김 */
    word-break: break-word; /* 텍스트가 박스 너비를 초과하면 줄 바꿈 */
    white-space: normal; /* 줄 바꿈을 허용 */
}




.searchAndContents.topic_div{
	/* margin-top: 60px; */
}

#body .twoColumn .searchAndContents.topic_div{
	/* margin-top: 0px; */
}

.contentsCountAndOrder .result, .site_contentsCountAndOrder .result{
	color: #111111;
	text-align: left;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;
}


#body #order_search{
	color: #cdcdcd;
	text-align: left;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;

	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 6px;
}

#body #order_search button.active{
	color: #767676;
}


#body .contentsCountAndOrder{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#body .contentsCountAndOrder .sort{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
}

#order_search .orderBtn{
	text-align: left;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 500;
	position: relative;
}
.divider_span{
	color: var(--grey-text-color-search);
}

#changeViewBtnDiv{
	width: 24px;
	height: 24px;
}
.changeViewBtn{
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	position: relative;
}

.changeViewBtn svg{
	width: 24px;
	height: 24px;
}
































/* 관심콘텐츠 new (250120) */

.categoryAndContents{
	/* margin-top: 40px; */
}

#interestInfo{
	color: #111111;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 400;
}

#interestInfo #userName{
	color: #111111;
	font-weight: 600;
}

#interests{
	margin-top: 20px;

	padding: 24px;
	border-radius: 24px;
	border-style: solid;
	border-color: #d9d9d9;
	border-width: 1px;

	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 12px;

	color: #111111;
	text-align: left;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 400;

	list-style: disc;
	padding-left: 45px;

	margin-bottom: 40px;

}

#interests .btn{
	color: #337ab7;
    text-decoration: none;
	text-align: left;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: -0.02em;
	font-weight: 400;
	padding: 2px 0px;
}
#interests .btn:hover{
	color: #111111;
}
#interests .created{
	color: #767676;
	text-align: left;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -.02em;
	font-weight: 400;
}

#interests .dil{
	margin-left: 3px;
	margin-right: 3px;
}


.selected_cate_button{
	margin-top: 0px;
	margin-left: 0px;
}
.selected_cate_button .selected_cate_name{
	font-weight: 600;
}

















/* 북마크 new (250120) */
.searchAndContents.inBookmark{
	/* margin-top: 40px; */
}

#topic_list{
	margin-bottom: 40px;
}










.book_images .arrow {
    width: 40px;
    position: absolute;
    top: 180px;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 10;
    background-color: none;
}
.book_images .leftArrow {
    left: -20px; /* 화살표 위치 조정 */
}

.book_images .rightArrow {
    right: -20px; /* 화살표 위치 조정 */
}
.leftArrow, .rightArrow{
    background-color: none;
}
.leftArrow svg, .rightArrow svg{
    background-color: none;
    fill: #FFF;
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.25));
}







.categoryGroup.inBookmark, .tabSection .second_tabs, .tabSection #subscriptionTabs.second_tabs, .tabSection #myWrites.second_tabs{
	margin-top: 40px;
	margin-bottom: 40px;
}


.tabSection .second_tabs ul.tabGroup_ul{
	min-height: auto;
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: center;
    position: relative;
}

.categoryGroup.inBookmark .category_type{
	gap: 8px !important;
}


#body .categoryGroup.inBookmark ul.category_type li, .tabSection .second_tabs ul.tabGroup_ul li{
	box-sizing: border-box;

	border-radius: 50px;
	padding: 10px 12px 10px 12px;
	width: 120px;
	height: 40px;

	padding: 10px 0px;
	background: #ffffff;
	border-style: solid;
	border-color: #999999;
	border-width: 1px;
	flex-shrink: 0;

	color: #999999;
	text-align: center;
	font-size: 14px;
	line-height: 140%;
	letter-spacing: -0.025em;
	font-weight: 500;

	margin-right: 0px;
}




.tabSection .second_tabs ul.tabGroup_ul li.tabGroup_li.active{
	border-color: #455bb7;
}
#body .categoryGroup.inBookmark ul.category_type li.typeClicked, .second_tabs .tabGroup_ul li.tabGroup_li.active a{
	border-color: #455bb7;
	color: #455bb7;
}


#body .categoryGroup.inBookmark ul.category_type li:hover, .second_tabs .tabGroup_ul li.tabGroup_li:hover{
	color: #111111;
	border: 1px solid #111111;
	cursor: pointer;
}





.tabSection .second_tabs ul.tabGroup_ul li a{
	padding: 0px;
	width: 100%;
	height: 100%;
}

.tabGroup_ul li a, .tabGroup_ul li a:hover {
    text-decoration: none;
}

.tabSection .second_tabs ul.tabGroup_ul li:hover, .tabSection .second_tabs ul.tabGroup_ul li.tabGroup_li.active:hover{
	border: 1px solid #111;
	border-color: #111;
}
.tabSection .second_tabs ul.tabGroup_ul li:hover a, .second_tabs .tabGroup_ul li.tabGroup_li.active:hover a{
	color: #111;
}

#settingBtnDiv.inBookmark{
	width: 100%;
}














/* 통합 검색 */
.search_container #book_list{
	margin-bottom: 40px;
}

.search_container .resultText{
	color: #111;
    text-align: left;
    font-size: 16px;
    line-height: 140%;
    letter-spacing: -.02em;
    font-weight: 500;
}






#interests li{
	word-wrap: break-word;
	white-space: normal;
}
#interests li a {
	display: inline-block;
	word-wrap: break-word;
	white-space: normal;
  }






/* 모바일 반응형 (250123) */
#body #contents #toc, #body #maincontents:not(.isListView) #contents #toc, .sk_loading_contents #toc{
	padding-right: 10px;
}
#body #maincontents div#contents .content{
	box-sizing: border-box;
	overflow: visible;
}



@media (min-width: 1280px) {
	#body #topic_list ul li.topic-item-container{
		width: calc((100% - (7 * 23px)) / 8);
	}
}
@media (max-width: 1280px) {
	#body #topic_list ul li.topic-item-container{
		width: calc((100% - (6 * 23px)) / 7);
	}
}

@media (max-width: 1200px) {


	.content .content_info{
		padding: 20px 20px 10px 20px;
	}
	
	#body #contents, #body #maincontents:not(.isListView) .sk_loading_contents{
		/* gap: 24px;
		row-gap: 48px; */
	}
	#body #contents, #body .sk_loading_contents{
		gap: 24px;
		row-gap: 48px;
	}
	#body .isListView #contents, #body .isListView .sk_loading_contents{
		row-gap: 24px;
	}
	

	#body #contents .content, #body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		/* margin-bottom: 0px; */
		/* width: calc((100% - 48px) / 2); */
		/* width: calc((100% - 24px - 10px) / 2); */
		width: calc((100% - 24px) / 2);

	}
	#body #maincontents.isListView #contents .content{
		/* margin-bottom: 24px; */
	}

	#maincontents .twoBanner{
		margin-bottom: 0px;
	}


	#body #maincontents:not(.isListView) .content .content_data{
		height: 240px;
	}
	#body #maincontents:not(.isListView) .text{
		height: 200px;
	}
	#body #contents #toc{
		height: 200px;
	}
	#body #contents .content .text .textimg{
		height: 200px;;
	}





	#body #topic_list ul li.topic-item-container{
		width: calc((100% - (6 * 23px)) / 7);
	}
}


@media (max-width: 1050px) {
    #body #topic_list ul li.topic-item-container{
        width: calc((100% - (5 * 23px)) / 6);
    }
}


@media (max-width: 992px) {
    #body #topic_list ul li.topic-item-container{
        width: calc((100% - (5 * 23px)) / 6);
    }
}


@media (max-width: 880px) {

	
	#body #contents, #body #maincontents:not(.isListView) .sk_loading_contents{
		/* gap: 24px; */
	}
	#maincontents #contents, #body #maincontents:not(.isListView) #contents {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		margin-left: 0;
		margin-right: 0;
		/* gap: 24px; */
	}
	#body #contents, #body .sk_loading_contents{
		gap: 24px;
		row-gap: 48px;
	}
	#body .isListView #contents, #body .isListView .sk_loading_contents{
		row-gap: 24px;
	}
	
	#body #contents .content, #body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		/* margin-bottom: 24px; */
		width: calc((100% - 24px) / 2);
	}
	#body #maincontents:not(.isListView) .text{
		height: 190px;
	}
	#body #contents #toc, #body #maincontents:not(.isListView) #contents #toc, .sk_loading_contents #toc{
		height: 190px;
		padding-right: 10px;
	}
	#body #contents .content .text .textimg, #body #maincontents:not(.isListView) #contents .content .text .textimghasimg{
		height: 190px;;
	}






    #body #topic_list ul li.topic-item-container{
        width: calc((100% - (4 * 23px)) / 5);
    }
}



@media (max-width: 768px) {

	#body #contents, #body .sk_loading_contents{
		gap: 24px;
		row-gap: 48px;
	}
	#body .isListView #contents, #body .isListView .sk_loading_contents{
		row-gap: 24px;
	}
    #body #topic_list ul li.topic-item-container{
        all: unset;
        padding-right: 0;
        width: calc((100% - (3 * 23px)) / 4);
    }
    #body #topic_list ul li.topic-item-container{
        background: #f1f1f5;
        border-radius: 8px;
        padding: 10px 0px;
        position: relative;
        
    }
    .topic-item-content{
        display: none;
    }

    #topic_list ul .book-name{
        padding: 0px 8px;
        color: #111111;
        text-align: center;
        font-size: 13px;
        line-height: 140%;
        letter-spacing: -0.025em;
        font-weight: 400;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;

    }
    .topicCount{
        position: absolute;
        top: -10px; 
        right: 8px;

        width: 20px;
        height: 20px;

        padding: 0px;

        display: flex;
        justify-content: center;
        align-items: center;

        color: #ffffff;
        text-align: center;
        font-size: 12px;
        line-height: 140%;
        letter-spacing: -0.025em;
        font-weight: 500;
    }

}



@media (max-width: 660px) {
	#body #contents, #body .sk_loading_contents{
		gap: 24px;
		row-gap: 24px;
	}
	#body #contents .content, #body #maincontents:not(.isListView) #contents .content, #body #maincontents:not(.isListView) .sk_loading_contents .content{
		/* margin-bottom: 0px; */
		width: calc(100%);
	}
	#body #maincontents:not(.isListView) .text{
		height: 204px;
	}
	#body #maincontents:not(.isListView) #toc-container{
		height: 204px;
	}
	#body #contents #toc, #body #maincontents:not(.isListView) #contents #toc{
		height: 204px;
	}
	#body #contents .content .text .textimg, #body #maincontents:not(.isListView) #contents .content .text .textimghasimg{
		height: 204px;;
	}
}



@media (max-width: 560px) {

    #body #topic_list ul{
        gap: 7px;
        row-gap: 12px; 
    }
    #body #topic_list ul li.topic-item-container{
        width: calc((100% - (2 * 7px)) / 3);
    }
}



@media (max-width: 520px){

	#body #maincontents.isListView .contentDiv_hasImg{
		gap: 20px;
	}
	#body #maincontents.isListView .sk_loading_contents .contentDiv_text{
		width: calc(100% - 110px - 20px);
	}
	.sk_loading_contents .title.skeleton_text{
		/* width: 285px; */
		width: 100%;
	}
	.sk_loading_contents .content_information .info_accessed{
		text-align: left;
		/* width: calc(100% - 38px - 25px - 4px - 20px); */
		width: 100%;
	}
	.sk_loading_contents .content_information .info_accessed .skeleton_text{
		/* width: 200px; */
		text-align: left;
		width: 70%;
	}

	#body #maincontents.isListView div#contents .content .content_data{
		width: 100%;
		max-width: 100%;
		overflow: hidden;
	}
	#body #maincontents.isListView .contentDiv_hasImg{
		width: 100%;
	}
	#body #maincontents.isListView .contentDiv_hasImg .contentDiv_text{
		width: calc(100% - 110px - 20px);
	}
	.content_data_inList{
		width: 100%;
	}
}


@media (max-width: 510px) {
	#body .categoryGroup, #body .groups_buttons{
		margin-top: 0px;
		margin-left: -5px;
	}

	#body .categoryGroup.inBookmark{
		margin-top: 20px;
	}
	#body .categoryGroup.inBookmark ul{
		justify-content: center;
	}
	.categoryGroup.inBookmark, .tabSection #myWrites.second_tabs, .tabSection #subscriptionTabs.second_tabs, .tabSection .second_tabs{
		margin-top: 20px;
	}
}



@media (max-width: 480px){
	#body #contents, #body .sk_loading_contents{
		gap: 24px;
		row-gap: 24px;
	}
	/* #body #maincontents.isListView #contents .content .contentDiv_hasImg .contentDiv_img img{
		width: 80px;
		height: 80px;
	} */


	#body #maincontents.isListView .contentDiv_hasImg{
		gap: 20px;
	}
	.contentDiv_hasImg .content_information{
		flex-direction: column;
		gap: 5px;
	}
	#body #maincontents .contentDiv_hasImg .content_information div.accessed{
		width: 100%;
		text-align: left;
	}
	#body #maincontents.isListView #contents .content .topicAndBook_icon{
		width: 100%;
	}
	.contentDiv_hasImg .content_information .publicAndBookmark{
		width: 100%;
		justify-content: flex-end;
	}
	#body #maincontents.isListView #contents .content, #body #maincontents.isListView .sk_loading_contents .content{
		margin-bottom: 0px;
	}






	
	

	.topics_container .topic_header{
		display: none;
	}

	#body #category_names{
		width: 100%;
	}
}



@media (max-width: 480px) {
	#body .categoryGroup ul, #body .groups_buttons ul, .tabSection .second_tabs ul.tabGroup_ul{
		gap: 24px;
	}
	#body #subscriptionTabs.second_tabs ul.tabGroup_ul{
		gap: 8px;
	}
	#body .categoryGroup.inBookmark ul.category_type li, .tabSection .second_tabs ul.tabGroup_ul li{
		width: calc((100% - 24px - 24px)/3);
		height: auto;
		padding: 10px 12px;
	}


	#body #maincontents.isListView .contentDiv_hasImg{
		gap: 20px;
	}
	#body #maincontents.isListView .contentDiv_hasImg .contentDiv_text{
		width: calc(100% - 90px - 20px);
	}
	#body #maincontents.isListView .contentDiv_hasImg .contentDiv_img{
		width: 90px;
	}

	#body #maincontents.isListView #contents .content .contentDiv_hasImg .contentDiv_img img{
		width: 90px;
		height: 90px;
	}
	#body #maincontents.isListView .sk_loading_contents .skeleton_img{
		width: 90px;
		height: 90px;
	}
}












.topicAndBook_icon .fullYear{
	/* color: red; */
}

.dil3{
/* .topicAndBook_icon .dil3, .categoryListOne .dil3, #interests .dil3{ */
	margin-right: 3px;
	margin-left: 3px;
}


.book-tag-container{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 8px;
	/* gap: 20px; */
	/* row-gap: 10px;    */
	margin-bottom: 30px;
	padding-bottom: 2px;
}

.book-tag-btn {
  /* width: 183px;
  min-height: 70px;
  padding: 15px;
  border: 1px solid #767676;
  border-radius: 15px;
  color: #767676;
  font-size: 14px;
  font-family: var(--font-family);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box; */

	/* outline: 0 !important;
	outline-offset: 0 !important;
	border: none;
	box-shadow: none;
	padding: 10px 12px 10px 12px;
    color: #999;
    text-align: left;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: -.025em;
    font-weight: 500;
    position: relative; */

	color: #999;
    text-align: left;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: -.025em;
    font-weight: 500;
    position: relative;
    background: #fff;
    border-radius: 12px;
    border-style: solid;
    border-color: #999;
    border-width: 1px;
    padding: 10px 12px 10px 12px;
    display: flex
;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.book-tag-btn .btn-text {
  /* display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  line-height: 1.4;
  text-align: center; */
}

button.book-tag-btn.active {
    /* background-color: #E8ECF8; */
    /* color: #455BB7; */
	color: var(--main-color);
	border-color: var(--main-color);
    /* border-color: #455BB7; */
}


@media (max-width: 660px) {
	.book-tag-container{
		width: 100%;
        display: flex;
        align-items: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;

		scrollbar-width: none; /* Firefox */
    	-ms-overflow-style: none;  /* IE and Edge */
	}

	.book-tag-btn {
		white-space: nowrap;
	}
	.book-tag-btn .btn-text {
		white-space: nowrap;
	}

	.book-tag-container::-webkit-scrollbar{
		display: none;
	}

}



/* 
@media (max-width: 1200px) {
	.book-tag-container button.book-tag-btn{
		width: calc((100% - 20px * 4) / 5); 
	}
}

@media (max-width: 992px) {
	.book-tag-container{
		gap: 20px;
		row-gap: 10px;
	}
	.book-tag-container button.book-tag-btn{
		width: calc((100% - 20px * 3) / 4); 
	}
}

@media (max-width: 660px) {
	.book-tag-container button.book-tag-btn{
		width: calc((100% - 20px * 2) / 3); 
	}
}

@media (max-width: 500px) {
	.book-tag-container{
		gap: 10px;
	}
	.book-tag-container button.book-tag-btn{
		width: calc((100% - 10px * 2) / 3); 
	}
}

@media (max-width: 430px) {
	.book-tag-container button.book-tag-btn{
		width: calc((100% - 10px * 1) / 2); 
	}
} */

















/* 토픽 2열 디자인 변경(250613) */
#body #categories .panel .panel-heading a.allCategories, #body #topic_list_level2 .panel .panel-heading a.allTopics{
	display: inline-block;
	width: auto !important; /* ← 꼭 추가 */
	font-size: 14px;
    font-weight: 500;
    color: #fff;
    background: #455bb7 0 0 no-repeat padding-box;
    border-radius: 8px;
    opacity: 1;
    padding: 10px 12px;
	margin-bottom: 10px;
}
.twoColumn .panel-title{
	padding: 10px 0px;
}
.twoColumn .panel-title .add_list:first-child>a{
	padding: 0px;
	margin-top: 0px;
}
.panel-title .add_list>a.first_list::before{
	margin-right: 4px;
}


#body .twoColumn #categories .list-group-item, #body .twoColumn #topic_list_level2 .list-group-item{
	background: #F6F7FA;
	padding: 16px 20px;
}


.panel .categoryNameDiv>div{
	line-height: 1.4;
}
.contentsCount{
	border: 1px solid #455BB7;
	color: #455BB7;
	border-radius: 50px;
	padding: 3px 8px;
	font-size: 12px;
	background-color: transparent;;
}

#body .twoColumn #categories .list-group-item.hasIcon .iconDiv, #body .twoColumn #topic_list_level2 .list-group-item.hasIcon .iconDiv{
	display: flex;
	align-items: center;
	color: #111111 !important;
}

/* 

#body .twoColumn #categories ul.cate_ul .list-group-item:not(.list_level2):not(.list_level3) .categoryNameDiv::before, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item:not(.list_level2):not(.list_level3) .categoryNameDiv::before{
	content: "↳";
	font-size: 13px;
	margin-right: 10px;
	color: #c0bcbccf;
}

#body .twoColumn #categories ul.cate_ul .list-group-item.list_level4 .categoryNameDiv::before, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item.list_level4 .categoryNameDiv::before{
	content: "↳";
	font-size: 15px;
	margin-right: 10px;
	color: #8b8585 !important;
} */



#body .twoColumn #categories .list-group-item.active, #body .twoColumn #topic_list_level2 .list-group-item.active{
	color: #111111;
	background-color: transparent;
	border-bottom: 1px solid #111111;
}


#body .twoColumn #categories ul.cate_ul .list-group-item.active:last-child, #body .twoColumn #topic_list_level2 ul.cate_ul .list-group-item.active:last-child{
	border-bottom: 1px solid #111111;
}


#body .twoColumn #categories .list-group-item.list_level2.active, #body .twoColumn #topic_list_level2 .list-group-item.list_level2.active{
	background-color: #E5E9F4;
	border-bottom: none;
}


#body .twoColumn .panel-heading{
	border-bottom: 1px solid #D9D9D9;
}
#body .twoColumn .list-group-item{
	border: none;
}

#body .twoColumn #categories .list-group-item.active, #body .twoColumn #topic_list_level2 .list-group-item.active{
	color: #111111;
}






.nameWithFlagFlex {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  flex-wrap: wrap;
}
.nameAndCount{
  flex: 1;
  word-break: break-word;
}
.flag {
  white-space: nowrap;
  flex-shrink: 0;
  color: #555;
}

.nameText {
  flex: 1;
  word-break: break-word;
}

.contentsCount {
  white-space: nowrap;
}