._contents{
	padding-top: 160px; padding-bottom: 115px;
}
._contents .wrap{}
._contents .wrap .top{
	margin-bottom: 80px;
}
._contents .wrap h3{
	font-size: 43px; letter-spacing: -0.05em; font-weight: 700;
	margin-bottom: 1em; text-align: center; line-height: 1.3;
}
._contents .wrap .tab{
	display: flex;
	align-items: center; justify-content: center;
}
._contents .wrap .tab div{
	display: flex; width: 152px; height: 63px;
	align-items: center; justify-content: center;
	background-color: #ececec; color: #565656;
	font-size: 18px; font-weight: 500; letter-spacing: -0.05em;
	transition: background-color 0.1s,color 0.1s; cursor: pointer;
}
html.pc ._contents .wrap .tab div:hover{background-color: #444; color: #fff;}
._contents .wrap .tab div.on{background-color: var(--red) !important; color: #fff !important;}
._contents .wrap .tab div p{}
._contents .wrap .listBx{margin-bottom: 100px;}
._contents .wrap .list{
	display: flex; flex-wrap: wrap; gap: 90px 24px;
	opacity: 0; pointer-events: none; transform: translateY(40px);
	transition: opacity 0.5s,transform 0.5s;
	position: absolute; left: 0; top: 0;
}
._contents .wrap .list.on{opacity: 1; pointer-events: auto; transform: translateY(0); transition-delay: 0.3s;}
._contents .wrap .list li{
	width: calc(100% / 4 - (24px * 3 / 4)); cursor: pointer;
}
._contents .wrap .list li .imgBx{
	background-color: #ececec; position: relative;
	display: flex; align-items: center; justify-content: center;
}
._contents .wrap .list li .imgBx::before {
	content:''; display: block; padding-bottom: calc(380/289*100%);
}
._contents .wrap .list li .imgBx img{
	position: absolute; width: 77.8%; height: 83.1%; object-fit: cover;
}
._contents .wrap .list li .imgBx .bg{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	background-color: #000; opacity: 0.45;
	transform: scaleY(0); transform-origin: center bottom;
	transition: transform 0.5s;
}
._contents .wrap .list li .imgBx .btn{
	opacity: 0; transform: translateY(40px);
	transition: opacity 0.5s, transform 0.5s;
	font-size: 17px; border-radius: calc(6/17*1em);
	width: calc(132/17*1em); height: calc(42/17*1em); display: flex; align-items: center;
	justify-content: center; gap: 1em; color: #fff; font-weight: 500; background-color: var(--red);
	position: absolute;
}

.mo ._contents .wrap .list li .imgBx .bg{display: none;}
.mo ._contents .wrap .list li .imgBx .btn{display: none;}

._contents .wrap .list li:hover .imgBx .bg{transform: scaleY(1);}
._contents .wrap .list li:hover .imgBx .btn{opacity: 1; transform: translateY(0);}
._contents .wrap .list li .imgBx .btn p{}
._contents .wrap .list li .imgBx .btn i{}
._contents .wrap .list li .tit{
	font-size: 17px; font-weight: 500; letter-spacing: -0.05em; line-height: 1.4; text-align: center;
	margin-top: 24px;
}
._contents .wrap ._paging{}

@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {
	._contents .wrap h3{font-size: 36px;}
}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	._contents .wrap h3{font-size: 28px;}
	._contents .wrap .tab div{width: 130px; height: 50px; font-size: 16px;}

	._contents .wrap .list{gap: 60px 20px;}
	._contents .wrap .list li{width: calc(100% / 3 - (20px * 2 / 3));}
}
@media screen and (max-width:820px) {
	._contents .wrap .top{margin-bottom: 40px;}
	._contents .wrap h3{font-size: 24px;}
	._contents .wrap .tab div{width: 110px; height: 40px; font-size: 14px;}

	._contents .wrap .list{gap: 60px 10px;}
	._contents .wrap .list li{width: calc(100% / 2 - (10px * 1 / 2));}
	._contents .wrap .list li .imgBx img{width: calc(100% - 20px); height: calc(100% - 20px);}
	._contents .wrap .list li .tit{font-size: 14px; margin-top: 1em;}
}
@media screen and (max-width:500px) {
	._contents .wrap .listBx{margin-bottom: 40px;}
	._contents .wrap .list {gap: 40px 6px;}
	._contents .wrap .list li{width: calc(100% / 2 - (6px * 1 / 2));}
	._contents .wrap .list li .tit{font-size: 12px;}
}
@media screen and (max-width:320px) {}






/* 팝업 */
._paperPopup{
	position: fixed; z-index: 9999999; left: 0; top: 0; width: 100%; height: 100%;
	overflow: auto; text-align: center;
	background-color: rgba(0,0,0,0.85);
	cursor: pointer;
	opacity: 0; pointer-events: none;
	transition: opacity 0.5s;
}
._paperPopup.on{opacity: 1; pointer-events: auto;}
._paperPopup .cont{
	min-height: 100%; padding: 40px 0; box-sizing: border-box; position: relative; z-index: 3;
	display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
	cursor: auto;
}
._paperPopup .tit{
	font-size: 36px; font-weight: 700; letter-spacing: -0.05em; color: #fff;
	line-height: 1.4;
}
._paperPopup .imgBx{
	position: relative; width: 95vw; max-width: 400px;
	margin-top: 24px; margin-bottom: 12px;
}
._paperPopup .imgBx::before {
	content:''; display: block; padding-bottom: calc(732/517*100%);
}
._paperPopup .imgBx img{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;
}
._paperPopup .ico{
	font-size: 24px; color: #fff; background-color: #7d7d7d;
	border-radius: 50%; display: flex; align-items: center; justify-content: center;
	cursor: pointer; min-width: 2em; min-height: 2em;
	transition: background-color 0.1s;
}
html.pc ._paperPopup .ico:hover{background-color: #444;}
._paperPopup .ico i{}





@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	._paperPopup .tit{font-size: 30px;}
}
@media screen and (max-width:1024px) {
	._paperPopup .tit{font-size: 28px;}
}
@media screen and (max-width:820px) {
	._paperPopup .tit{font-size: 22px;}
	._paperPopup .ico{font-size: 18px;}
}
@media screen and (max-width:500px) {
	._paperPopup .tit{font-size: 18px;}
	._paperPopup .ico{font-size: 16px;}
}
@media screen and (max-width:320px) {}