/*------------------------------------------------------------------------------------------------------
메인비주얼
---------------------------------------------------------------------------------------------------------*/

/*.visual_img {top: 130px!important;}
	@media (max-width: 768px) {
		.visual_img {top: 120px!important;}
	}
	@media all and (min-width: 769px) and (max-width: 1462px) {
		.visual_img {top: 100px!important;}
	}*/

/*.visual_img .carousel-item {min-width: 100%; height: 470px;}
	@media screen and (max-width: 768px) {
		.visual_img .carousel-item {max-height: 250px;}
	}
	@media screen and (min-width: 576px) and (max-width: 991px) {
		.visual_img .carousel-item {height: 350px;}
	}
	@media screen and (min-width: 992px) {
		.visual_img .carousel-item {height: 710px;}
	}*/
.visual_img .carousel-item img {height:300px; object-fit: cover; object-position: center;}
	@media screen and (min-width: 992px) {
		.visual_img .carousel-item img {
			width: 100%; height: auto;/* max-width: 1200px; max-height: 470px;
			vertical-align: middle; object-fit: cover;*/
		}
	}

	/*-----------------------
	메인카피
	-----------------------
/*------------------------------------------------------------------------------------------------------
메인비주얼
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
visit
---------------------------------------------------------------------------------------------------------*/
/*@media (max-width: 767px) {
	.visit_wrap > .col-md-4 {width: 100%;}
	.visit_wrap > .col-md-8 {width: 100%;}
}*/
@media (min-width: 768px) {
	.visit_wrap > .col-md-4 {width: 42.2%;}
	.visit_wrap > .col-md-8 {width: 57.8%;}
}

	/*-------------------------------------------
	미니리스트
	-------------------------------------------*/
.minilist_wrap ul {border-top: 3px solid #282828; border-bottom: 3px solid #282828;}
.tab li {
	width: calc(100% / 3); /*padding-left: 3rem; padding-right: 3em;*/
	font-size: 1.125rem; cursor: pointer;
}
.tab li a {transform:translateY(-50%); right: 0.8rem;}

	/*-------------------------------------------
	관람정보
	-------------------------------------------*/
.visitinfo_wrap {padding-left: 55px;}
	@media (max-width: 768px) {
		.visitinfo_wrap {padding-left: 0;}
	}
	@media all and (min-width: 769px) and (max-width: 1200px) {
		.visitinfo_wrap {padding-left: 55px;}
	}
.culture_text {letter-spacing: -0.5px;}
.culture_wrap a {width: 30px; height: 30px;}

/*-------------------------------------------
순서 변경
-------------------------------------------*/
@media all and (min-width: 320px) and (max-width: 1259px) {
	.minilist_container {order:1; margin-bottom:15px;}/*미니리스트*/
	.minilist_wrap > section.bnr_box:nth-child(2) {order:2;}/*재가노인지원서비스*/
	.minilist_wrap > section.bnr_box:nth-child(4) {order:3;}/*자원활동*/
}

/*------------------------------------------------------------------------------------------------------
program-교육행사
---------------------------------------------------------------------------------------------------------*/
	/*-------------------------------------------
	탭
	-------------------------------------------*/
.tab2 li {
	font-size: 1.375rem; color: #ababab; cursor: pointer;
}
.mprogram_tabbtn a {
	width: 32px; height: 32px; line-height: 32px; background-color: #ababab; border-radius: 50%;
	color: #efefef;
}
	/*-------------------------------------------
	출력
	-------------------------------------------*/
	@media (max-width: 768px) {
		.mpro-state, .mpro-img {text-align: center;}
	}

.mpro-cate {
	display:inline-block; margin-right: 0.5rem; padding: 0.25rem 0.5rem 0.25rem 0.5rem; background-color: #1e3050; text-align: center;
	color: #fff;
}
	@media (max-width: 768px) {
		.mpro-cate {
			display: block; margin-right: 0; padding: 0; background: none; text-align: left;
			font-size: .9rem; color: #949494; font-weight: normal;
		}
		.mpro-cate::before {
			content: "●";
			margin-right: 0.5rem;
		}
	}
.mprogram_duration {
	text-align: right;
	color: #ababab;
}
	@media (max-width: 768px) {
		.mprogram_duration {margin-top: 0; text-align: left;}
	}

/*------------------------------------------------------------------------------------------------------
collection-고미술소장품
---------------------------------------------------------------------------------------------------------*/
.mcoll_wrap .card {border: none;}
/*.mcoll_wrap .slide {color: inherit;}*/

/*------------------------------------------------------------------------------------------------------
전시
---------------------------------------------------------------------------------------------------------*/
.mexh_wrap {height: 430px;}
.mexh_wrap img.img-thumbnail {border: none;}
.display_title {height: 60px;}

@media (max-width: 768px) {
	.mexh_wrap {height: auto;}
	.display_title {height: auto;}
}
@media all and (min-width: 769px) and (max-width: 860px) {
	.mexh_wrap {height: 250px;}
	.display_title {height: auto;}
}
@media all and (min-width: 861px) and (max-width: 941px) {
	.mexh_wrap {height: 280px;}
	.display_title {height: auto;}
}
@media all and (min-width: 942px) and (max-width: 1140px) {
	.mexh_wrap {height: 350px;}
	.display_title {height: auto;}
}
@media all and (min-width: 1141px) and (max-width: 1217px) {
	.mexh_wrap {height: 370px;}
	.display_title {height: auto;}
}
@media all and (min-width: 1218px) and (max-width: 1320px) {
	.mexh_wrap {height: 410px;}
	.display_title {height: auto;}
}

/*------------------------------------------------------------------------------------------------------
전시
---------------------------------------------------------------------------------------------------------*/
/* 썸네일 박스의 기본 높이를 500px로 고정하여 갤러리 카드 높이를 통일시킵니다. */
.thumb-box {
    height: 400px;
}

/* 이미지 태그가 부모 요소(.thumb-box)를 벗어나지 않도록 최대 가로 폭을 100%로 제한합니다. */
.thumb-img {
    max-width: 100% !important;
}

/* 이미지 태그가 부모 요소를 벗어나지 않도록 최대 세로 폭을 100%로 제한합니다. */
.thumb-img {
    max-height: 100% !important;
}

/* 원본 이미지가 박스보다 작을 때는 커지지 않고 원본 크기를 유지하며, 클 때만 비율을 유지한 채로 박스 안에 온전히 다 보이도록 맞춥니다. */
.thumb-img {
    object-fit: scale-down !important;
    object-position: top center !important;
}

/* 썸네일 border 제거 */
.img-thumbnail {
	border: none !important;
}

/* 전시 타이틀 스타일: 자간과 행간을 넉넉하게 조정합니다. */
.display_title {
    height: unset !important;
    min-height: 0 !important;
    letter-spacing: 0.05em; /* 자간(글자 사이 간격)을 살짝 넓혀 가독성을 높입니다. */
    line-height: 1.4;       /* 행간(줄 간격)을 여유롭게 주어 두 줄 이상일 때 답답하지 않게 합니다. */
}

/* 전시 날짜 스타일: 글자 크기를 살짝 줄이고, 색상을 연하게 하여 타이틀과 대비되도록 합니다. */
.display_date {
    font-size: 0.85em;      /* 기본 크기보다 15% 작게 설정하여 타이틀을 돋보이게 합니다. */
    color: #888888;         /* 연한 회색으로 처리하여 보조 정보임을 시각적으로 나타냅니다. */
    letter-spacing: 0.02em; /* 날짜도 자간을 살짝 주어 세련되게 보입니다. */
    margin: 0;
    font-weight: 300;
}

.exhibit-row {align-items: stretch;}
.exhibit-card {display: flex; flex-direction: column; margin-bottom: 1.5rem;}
.exhibit-meta {flex: 1 1 auto;}

.exhibit-card .thumb-img {
	transition: transform 220ms ease;
	transform-origin: top center;
	will-change: transform;
}

.exhibit-card:hover .thumb-img,
.exhibit-card:focus-within .thumb-img {
	transform: translateY(-6px);
}

@media (max-width: 575.98px) {
	.thumb-box {height: 260px;}
	.exhibit-card {margin-bottom: 2rem;}
	.exhibit-section {padding-left: 0.75rem; padding-right: 0.75rem;}
	.exhibit-card:hover .thumb-img,
	.exhibit-card:focus-within .thumb-img {transform: none;}
}

@media (min-width: 576px) and (max-width: 991.98px) {
	.thumb-box {height: 320px;}
}