.wrap{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 80px);
}
.wrap[max='1920']{max-width: 1920px; width: 100%;}
.wrap[max='1440']{max-width: 1440px;}
.wrap[max='1280']{max-width: 1280px;}

.main .s4 .top .s4-swiper .swiper-slide{ height: auto; }
.main .s4 .top .s4-swiper .swiper-slide-active{ margin-left: unset; }
.main .s4 .top .s4-swiper .absol{ position: relative; right: auto; left: auto; }
.main .s4 .top .s4-swiper .title-txt-box strong span{ transform: translateY(0); }
.main .s4 .top .s4-swiper .title-txt-box small span{ transform: translateY(0); }
.main .s4 .top .s4-swiper .title-txt-box .more-btn{ opacity: 1; }

/* 흰 색 슬라이드 버튼에 circle 클래스 추가하면 적용됨 */
section .swiper-button-next.circle,
section .swiper-button-prev.circle {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: #fff;
	background-position: center;
	background-repeat: no-repeat;
	filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.25));
}

section .swiper-button-next.circle {
	right: 40px;
}

section .swiper-button-prev.circle {
	left: 40px;
}

section .swiper-button-prev.circle::after {
	background-image: url(../img/arrow_big_prev.png);
}

section .swiper-button-next.circle::after {
	background-image: url(../img/arrow_big_next.png);
}

section .swiper-button-next.circle::after,
section .swiper-button-prev.circle::after {
	content: '';
	width: 25px;
	height: 24px;
	background-size: cover;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* 텍스트 그림자 */
section .txt-shadow {
	text-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);
}

/* 더보기 버튼 */
section .more-btn {
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 306px;
	height: 56px;
	border-radius: 50px;
	position: relative;
	overflow: hidden;
}

section .more-btn::after {
	content: '';
	display: block;
	position: absolute;
	right: -5px;
	width: calc(100% + 10px);
	height: calc(100% + 10px);
	background-color: #000;
	transition: all 0.6s;
}

section .more-btn::before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50px;
	border: 2px solid #000;
	z-index: 2;
	box-sizing: border-box;
}

section .more-btn span {
	font-size: 18px;
	letter-spacing: -0.01em;
	line-height: 1.333;
	color: #fff;
	font-weight: 600;
	position: relative;
	z-index: 1;
	transition: color 0.6s;
}

section .more-btn:hover span {
	color: #000;
}

section .more-btn:hover::after {
	width: 0;
}

@media screen and (max-width: 1440px) {

	section .swiper-button-next.circle,
	section .swiper-button-prev.circle {
		display: none;
	}
}

@media screen and (max-width: 1024px) {
	section .tit span {
		font-size: 46px;
		line-height: 50px;
	}

	section .tit small {
		font-size: 18px;
		line-height: 20px;
		margin-top: 8px;
	}
}

@media screen and (max-width: 768px) {
	section .tit span {
		font-size: 32px;
		line-height: 36px;
	}

	section .tit small {
		font-size: 16px;
		margin-top: 8px;
		line-height: 24px;
	}
}

/* 브랜드스토리 재작업 */
.main .s4._add .se04sw{ overflow: unset; }
.main .s4._add .absol{ position: absolute; left: calc(100 / 1920 * 100%); z-index: 2; top: 50%; transform: translateY(-50%); }
.main .s4._add .absol .title-txt-box .more-btn{ transition-duration: 0.3s; }


.main .s4._add .absol .title-txt-box strong{ overflow: hidden; display: block; }
.main .s4._add .absol .title-txt-box small{ overflow: hidden; display: block; }

.main .s4._add .absol .title-txt-box strong span{ transition-duration: 0.3s; display: block; }
.main .s4._add .absol .title-txt-box small span{ transition-duration: 0.3s; display: block; }

.main .s4._add .absol.down .title-txt-box strong span{ transform: translateY(100%); }
.main .s4._add .absol.down .title-txt-box small span{ transform: translateY(100%); }
.main .s4._add .absol.down .title-txt-box .more-btn{ opacity: 0; }

.main .s4._add .se04sw .swiper-slide .img-area{ position: relative; transition-duration: 0.6s; width: calc(592 / 1276 * 100%); margin-left: 53.6%; }
.main .s4 .se04sw .swiper-slide.swiper-slide-next .img-area,
.main .s4 .se04sw .swiper-slide.swiper-slide-duplicate-next .img-area
{ margin-left: 0; }

.main .s4._add .se04sw .swiper-slide .img-area .img-box{ border-radius: 16px; overflow: hidden; position: relative; width: 100%;  }
.main .s4._add .se04sw .swiper-slide .img-area .img-box::after{ content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 26.388%; opacity: 0.7; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 100%); }
.main .s4._add .se04sw .swiper-slide .img-area .img-box ._max{ background-repeat: no-repeat; background-size: cover; background-position: center; transition-duration: 0.6s; }
.main .s4._add .se04sw .swiper-slide .img-area .img-box ._max::after{ content: ''; display: block; padding-bottom: calc(720 / 592 * 100%); }
.main .s4._add .se04sw .swiper-slide .img-area .txt-box{ position: absolute; bottom: 0; left: 0; width: 100%; padding: 40px; box-sizing: border-box; color: #fff; }
.main .s4._add .se04sw .swiper-slide .img-area .txt-box em{ font-size: 40px; line-height: 1.2; font-weight: 400; display: block; overflow: hidden; }
.main .s4._add .se04sw .swiper-slide .img-area .txt-box em span{ transform: translateY(-80px); display: block; opacity: 0; transition-duration: 0.3s; }

.main .s4._add .se04sw .swiper-slide .img-area .txt-box small{ font-size: 16px; letter-spacing: -0.016em; line-height: 1.5;  display: block;  overflow: hidden; }
.main .s4._add .se04sw .swiper-slide .img-area .txt-box small span{ transform: translateY(-80px); display: block; opacity: 0; transition-duration: 0.3s; }

@media screen and (min-width: 821px){
    .main .s4._add .se04sw .swiper-slide .img-area:hover .img-box ._max{ transform: scale(1.1); }
    .main .s4._add .se04sw .swiper-slide .img-area:hover .txt-box em span{ transform: translateY(0); opacity: 1; }
    .main .s4._add .se04sw .swiper-slide .img-area:hover .txt-box small span{ transform: translateY(0); opacity: 1; }
}

@media screen and (max-width: 1280px){

    .main .s4._add .se04sw .swiper-slide .img-area .txt-box{ padding: 30px; }
    .main .s4._add .se04sw .swiper-slide .img-area .txt-box em{ font-size: 30px; }
    .main .s4._add .se04sw .swiper-slide .img-area .txt-box small{ font-size: 14px; }
}

@media screen and (max-width: 1024px){
    .main .s4._add .absol{ left: calc(50 / 1920 * 100%); }
}

@media screen and (max-width: 700px){
    .main .s4._add .absol{ position: static; transform: translateY(0); }
    .main .s4._add .title-txt-box .more-btn{ display: none; }
    .main .s4._add .se04sw .swiper-slide .img-area{ width: 100%; margin-left: 0; }
    .main .s4._add .se04sw .swiper-slide .img-area .txt-box{ padding: 20px; }
    .main .s4._add .se04sw .swiper-slide .img-area .txt-box em{ font-size: 24px; line-height: 1.3; }
    .main .s4._add .se04sw .swiper-slide.swiper-slide-active .img-area .txt-box em span{ transform: translateY(0); opacity: 1; }
    .main .s4._add .se04sw .swiper-slide .img-area .txt-box small{ font-size: 12px; line-height: 1.66; }
    .main .s4._add .se04sw .swiper-slide.swiper-slide-active .img-area .txt-box small span{ transform: translateY(0); opacity: 1; }
}

/* 섹션4 -------------------------------------------------------------------------------------------------------- */
.main .s4 {
	padding: 160px 0;
	position: relative;
}
.main .s4 .more-btn.mo{display: none;}
.main .s4 .title-txt-box.mo{display: none;}
.main .s4 .bottom .wrap .img-box.mo{display: none;}
.main .s4 .top{
	max-width: 1432px;
}
.main .s4 .top .s4-swiper {
	width: calc(592 / 1920 * 100vw); max-width:592px; min-width: 320px;
}

.main .s4 .top .s4-swiper .swiper-slide {
	position: relative; transition: margin-left 0.8s; margin-right: 24px;
}
.main .s4 .top .s4-swiper .swiper-slide:nth-of-type(1){z-index: 3;}
.main .s4 .top .s4-swiper .swiper-slide:nth-of-type(2){z-index: 2;}
.main .s4 .top .s4-swiper .swiper-slide:nth-of-type(3){z-index: 1;}
.main .s4 .top .s4-swiper .swiper-slide-active {
	margin-left: calc(100% + 24px);
}


.main .s4 .top .s4-swiper .img-area {
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	z-index: 1;
	cursor: pointer;
	width: 100%;
}

.main .s4 .top .s4-swiper .img-area .img-box {
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
	position: relative;
}

.main .s4 .top .s4-swiper .img-area .img-box::after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 26.388%;
	opacity: 0.7;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}
.main .s4 .top .s4-swiper .img-area:hover .img-box img{
	transform: scale(1.07);
}
.main .s4 .top .s4-swiper .img-area .img-box img {
	width: 100%;
	transition: all 0.5s;
}

.main .s4 .top .s4-swiper .img-area .txt-box {
	position: absolute;
	bottom: 40px;
	left: 54px;
	color: #fff;
}

.main .s4 .top .s4-swiper .img-area .txt-box em {
	display: block;
	margin-bottom: 4px;
	font-size: 40px;
	line-height: 48px;
	overflow: hidden;
}

.main .s4 .top .s4-swiper .img-area .txt-box em span {
	display: inline-block;
	transform: translateY(-80px);
	opacity: 0;
	transition: all 0.3s;
}

.main .s4 .top .s4-swiper .img-area .txt-box small {
	display: block;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: -0.01em;
	overflow: hidden;
}

.main .s4 .top .s4-swiper .img-area .txt-box small span {
	display: inline-block;
	transform: translateY(-80px);
	opacity: 0;
	transition: all 0.3s;
}

.main .s4 .top .s4-swiper .img-area:hover .txt-box em span {
	transform: translateY(0);
	opacity: 1;
}

.main .s4 .top .s4-swiper .img-area:hover .txt-box small span {
	transform: translateY(0);
	opacity: 1;
}

/* 카드옆의 텍스트 */
.main .s4 .top .s4-swiper .absol {
	position: absolute;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	top: 0;
	right: calc(100% + 24px);
}

.main .s4 .top .s4-swiper .title-txt-box {
	position: relative;
	z-index: -1;
	transform: translateX(-4px);
}

.main .s4 .top .s4-swiper .title-txt-box strong {
	display: block;
	overflow: hidden;
}

.main .s4 .top .s4-swiper .title-txt-box strong span {
	display: inline-block;
	transform: translateY(-100%);
	transition: all 0.4s 0.35s;
}

.main .s4 .top .s4-swiper .title-txt-box small {
	display: block;
	overflow: hidden;
}

.main .s4 .top .s4-swiper .title-txt-box small span {
	display: inline-block;
	transform: translateY(-100%);
	transition: all 0.4s 0.35s;
}

.main .s4 .top .s4-swiper .title-txt-box .more-btn {
	opacity: 0;
	transition: all 0.4s 0.35s;
}

.main .s4 .top .s4-swiper .swiper-slide-active .title-txt-box strong span {
	transform: translateY(0);
}

.main .s4 .top .s4-swiper .swiper-slide-active .title-txt-box small span {
	transform: translateY(0);
}

.main .s4 .top .s4-swiper .swiper-slide-active .title-txt-box .more-btn {
	opacity: 1;
}

/* 슬라이드 화살표 영역 */
.s4 .top .arrow-box{
	width: 100vw; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	padding: 0 40px; box-sizing: border-box; z-index: 1;
}
.s4 .top .swiper-button-next.circle{
	background-image: url(../img/arrow_big_next.png);
  background-size: 55%;
}

.s4 .top .swiper-button-prev.circle {
	background-image: url(../img/arrow_big_prev.png);
  background-size: 55%;
}

/* 섹션 텍스트 공통 스타일 */

.main .s4 .title-txt-box strong {
	font-size: 68px;
	line-height: 80px;
}

.main .s4 .title-txt-box small {
	display: block;
	font-size: 24px;
	line-height: 34px;
	letter-spacing: -0.01em;
	color: #4B4B4B;
	font-weight: 400;
}

.main .s4 .title-txt-box small:nth-of-type(1) {
	margin-top: 20px;
}

.main .s4 .title-txt-box small:last-of-type {
	margin-bottom: 60px;
}

.main .s4 .title-txt-box .more-btn {
	margin: unset;
}


@media screen and (max-width: 1280px) {
	.main .s4 .title-txt-box strong {
		font-size: 32px;
		line-height: 36px;
	}

	.main .s4 .title-txt-box small {
		font-size: 16px;
		line-height: 24px;
	}

	.main .s4 .title-txt-box small:nth-of-type(1) {
		margin-top: 8px;
	}

	.main .s4 .title-txt-box small:last-of-type {
		margin-bottom: 24px;
	}

	.main section .more-btn {
		width: 222px;
		height: 44px;
	}

	.main section .more-btn span {
		font-size: 14px;
	}

	
}

@media screen and (max-width: 1024px) {
	.main .s4 {
		padding: 80px 0;
	}
	.main .s4 .top{
		width: calc(100% - 104px);
	}
	.main .s4 .top .s4-swiper .swiper-slide {
		margin-right: 12px;
	}

	/* .main .s4 .top .s4-swiper .swiper-slide .absol {

	}

	.main .s4 .top .s4-swiper .swiper-slide .img-area {

	}

	.main .s4 .top .s4-swiper .swiper-slide .img-area {

	}

	.main .s4 .top .s4-swiper .swiper-slide {

	} */

	.main .s4 .top .s4-swiper .swiper-slide-active {
		margin-left: calc(100% + 12px);
	}

	/* .main .s4 .top .s4-swiper .swiper-slide .img-area {

	} */

	/* 떠있는 텍스트 */
	.main .s4 .top .s4-swiper .absol{
		right: calc(100% + 12px);
	}

	.main .s4 .top .s4-swiper .title-txt-box{
		transform: unset;
	}

	.main .s4 .top .title-txt-box small {
		white-space: nowrap;
	}

	.main .s4 .top .s4-swiper .img-area .txt-box {
		left: 20px;
		bottom: 20px;
	}

	.main .s4 .top .s4-swiper .img-area .txt-box em {
		font-size: 24px;
		line-height: 32px;
		margin-bottom: 0;
	}

	.main .s4 .top .s4-swiper .img-area .txt-box small {
		font-size: 12px;
		line-height: 20px;
	}

}

@media screen and (max-width: 700px) {
	.main .s4 .top .mo {
		display: block;
	}
	.main .s4 .top{
		width: calc(100% - 80px);
	}
	.main .s4 .top .s4-swiper .swiper-slide .absol {
		display: none;
	}

	/* .main .s4 .top .s4-swiper .swiper-slide {

	} */
	.main .s4 .top .s4-swiper .swiper-slide-active{
		margin-left: 0;
	}
	/* .main .s4 .top .s4-swiper .swiper-slide .img-area {

	} */

	.main .s4 .top .s4-swiper .swiper-slide .img-area .img-box {
		border-radius: 12px;
	}

	.main .s4 .more-btn {
		width: 100%;
		height: 44px;
		/* max-width: 320px; */
	}
	.main .s4 .more-btn.mo{display: flex;}

	.main .s4 .title-txt-box strong {
		font-size: 32px;
		line-height: 36px;
		margin-bottom: 8px;
	}

	.main .s4 .title-txt-box small {
		font-size: 16px;
		line-height: 24px;
	}

	.main .s4 .top .more-btn {
		margin-top: 28px;
	}

	.main .s4 .top .more-btn span {
		font-size: 14px;
		font-weight: 600;
	}

	.main .s4 .top .s4-swiper .img-area .txt-box em span,
	.main .s4 .top .s4-swiper .img-area .txt-box small span {
		transform: unset;
		opacity: 1;
	}

}

@media screen and (max-width: 480px) {
	.main .s4 .top{
		width: calc(100% - 40px);
	}
	.main .s4 .top .s4-swiper{
		width: 100%; max-width: 100%; min-width: unset;
	}

	/* .main .s4 .top .more-btn.mo{

	} */

	.main section .more-btn {
		width: 100%; max-width: 100%;
	}

	.main .s4 .title-txt-box small {
		white-space: unset;
	}
}