/* 리스트 페이지 */
.sect-sub-kv {
	/* max-width: 1980px; */
	width: 100%;
	height: 420px;
	position: relative;
	background-size: cover;
	-webkit-background-size: cover;
}

.sect-sub-kv img {
	display: block;
	width: 100%
}

.sub-kv-txt {
	position: absolute;
	left: 0;
	top: 50%;
	right: 0;
	text-align: center;
	transform: translateY(-50%)
}

.sub-kv-txt h2,
.sub-kv-txt p {
	color: #171717;
}

.sub-kv-txt .sub-kv-tit {
	font-family: bodoni-urw, serif;
	font-weight: 400;
	font-style: normal;
	font-size: 96px;
	font-size: 6.857rem;
	margin-bottom: 30px;
	position: relative;
	height: 1.1em;
	overflow: hidden;
}

.sub-kv-txt .sub-kv-desc {
	font-weight: 300;
	font-size: 22px;
	font-size: 1.571rem;
	position: relative;
	overflow: hidden;
	line-height: 1.5;
}

.sub-kv-txt span {
	display: block;
	position: absolute;
	width: 100%;
	left: 0;
	top: 100%;
	transition: all 1s;
}

/* .sub-kv-txt .sub-kv-tit span {
	text-shadow: 7px 5px 3px rgba(0, 0, 0, 0.06)
} */


.more-cont {
	display: none
}

.filter-area {
	position: relative;
	right: 6.25%;
	text-align: right;
	padding: 22px 0 4px;
}

.filter-area .filtering {
	display: inline-block;
	position: relative;
	width: 210px
}

.filter-area .filter-by {
	font-size: 13px;
	font-size: 0.8125rem;
	color: #828282;
	display: inline-block;
	position: absolute;
	padding-left: 25px
}

.filter-area .filter-by:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 5px;
	width: 15px;
	height: 1px;
	background: #555
}

/* select li custom */
.filter-name {
	font-family: noto-sans, sans-serif;
	font-weight: 400;
	font-size: 20px;
	font-size: 1.428rem;
	display: inline-block;
	width: 100%;
	height: 48px;
	line-height: 46px;
	padding: 0 25px;
	background: #fff;
	border: 1px solid #ebebeb;
	cursor: pointer;
	position: relative
}

.filter-name:after {
	display: block;
	content: "\f0dd";
	font-family: FontAwesome;
	position: absolute;
	right: 20px;
	top: 0px;
	font-size: 16px;
	line-height: 40px;
	color: #333
}

.filter-name.open:after {
	content: "\f0de";
	line-height: 56px;
}

.filter-name.selected {
	color: rgb(77, 141, 209)
}

.filter-opt {
	display: none;
	width: 100%;
	padding: 12px 25px;
	background-color: rgba(255, 255, 255, 0.94);
	position: absolute;
	right: 0;
	top: 47px;
	z-index: 99;
	font-size: 1.25rem;
	border: 1px solid #ebebeb
}

.filter-opt li a {
	display: inline-block;
	padding: 12px 0;
	color: #2c2c2c
}

.filter-opt li .h-line:after {
	height: 2px;
	bottom: 7px
}

.sect-list-area {
	width: 100%;
	background: #f9f9f9
}

.sect-list-area ul {
	overflow: hidden
}

.sect-list-area li {
	float: left;
	width: 25%;
	height: auto;
	position: relative
}

.sect-list-area li img {
	display: block;
	width: 100%
}

.sect-list-area li .detail-info {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.70);
	text-align: center;
	line-height: 1.5
}

.sect-list-area li .detail-info a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0 5%;
	text-align: center
}

.sect-list-area li .detail-info .main-tit {
	display: block;
	font-family: bodoni-urw, serif;
	font-weight: 400;
	font-size: 52px;
	font-size: 3.714rem;
	color: #1a2e43;
	position: relative;
	line-height: 1;
	padding-bottom: 15px
}

.sect-list-area li .detail-info .main-tit:after {
	content: '';
	display: block;
	width: 35px;
	height: 1px;
	background: rgba(26, 46, 67, 0.5);
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -17.5px
}

.sect-list-area li .detail-info .sub-tit {
	font-family: noto-sans, sans-serif;
	font-weight: 400;
	font-size: 26px;
	font-size: 1.857rem;
	color: #1a2e43;
	line-height: 1.2;
	display: block;
	margin-top: 10px
}

.sect-list-area li .detail-info .desc {
	font-family: noto-sans, sans-serif;
	font-weight: 400;
	font-size: 21px;
	font-size: 1.5rem;
	color: #fff;
	display: inline-block;
	background: #1a2e43;
	padding: 0 10px;
	margin-top: 20%
}

@media screen and (max-width:1600px) {
	.sect-list-area li .detail-info .main-tit {
		font-size: 36px
	}

	.sect-list-area li .detail-info .sub-tit {
		font-size: 24px
	}

	.sect-list-area li .detail-info .desc {
		font-size: 20px
	}
}

@media screen and (max-width:1400px) {
	.sect-list-area li .detail-info .main-tit {
		font-size: 32px
	}

	.sect-list-area li .detail-info .sub-tit {
		font-size: 20px
	}

	.sect-list-area li .detail-info .desc {
		font-size: 18px
	}
}

@media screen and (max-width:1024px) {
	.sub-kv-txt .sub-kv-desc {
		padding: 0 5%
	}

	.sub-kv-txt .sub-kv-desc span {
		display: inline;
		top: auto;
		transition: none;
		position: static
	}

	.filter-area {
		right: auto;
		text-align: left
	}

	.filter-area>ul {
		padding-left: 4.5%
	}

	.filter-area .filtering {
		display: block;
		width: 100%;
		position: relative;
		margin-bottom: 5px
	}

	.filter-area .filter-opt {
		top: inherit !important
	}

	.filter-name:after {
		font-size: 12px;
		line-height: 24px;
		right: 0
	}

	.filter-name.open:after {
		line-height: 36px
	}

	.sect-list-area li {
		width: 50%
	}

	.filter-name {
		height: 32px;
		line-height: 32px
	}

	.filter-opt {
		margin-left: 0;
		width: 100%;
		max-height: 130px;
		padding: 12px 25px;
		position: fixed;
		bottom: 0;
		top: auto;
		overflow-y: scroll
	}
}

@media screen and (max-width:640px) {
	.sect-sub-kv {
		background: none;
		height: auto
	}

	.sub-kv-txt {
		width: 89%;
		left: 5.5%;
		transform: translateY(-50%)
	}

	.sub-kv-txt .sub-kv-tit {
		font-size: 48px;
		margin-bottom: 15px
	}

	.sub-kv-txt .sub-kv-desc {
		width: 100%;
		top: 4em;
		position: absolute;
		font-size: 16px;
		line-height: 1.3;
		opacity: 0;
		transition: all .6s
	}

	.filter-area {
		font-size: 16px
	}

	.filter-area .filter-by {
		font-size: 12px;
		font-size: 1.5rem;
		padding-left: 20px
	}

	.filter-area .filter-by:before {
		width: 8px
	}

	.filter-name {
		font-size: 1.75rem;
		padding: 0 15px
	}

	.filter-name:after {
		right: 10px
	}

	.filter-opt {
		font-size: 14px;
		font-size: 1.75rem;
	}
}

@media screen and (max-width:360px) {
	.sect-list-area li .detail-info .desc {
		margin-top: 5%;
		line-height: 1.2
	}
}