@charset "utf-8";

/* 260420 */
/* 260421 - HERO 섹션 이탈 시 GNB 숨김 */
.new-header {
	transition: top 0.35s ease !important;
}
.hot-summer-gnb-hidden .new-header {
	top: -101px !important;
}

.hot-summer-wrapper {
	font-family: 'Pretendard';
}
.section {
	padding: 4.688vw 0 0;
	text-align: center;
}
.section-title {
	font-family: 'NovaECB';
	font-size: 3.229vw;
	font-weight: 800;
	line-height: 1;
}
.section-cont {
	margin-top: 1.563vw;
	font-size: 1.563vw;
	font-weight: 500;
	line-height: 1;
}
.inner-cont {
	max-width: 72.917vw;
	margin: 0 auto;
	padding: 0 3.021vw;
}

.hot-summer-wrapper .swiper-button-prev,
.hot-summer-wrapper .swiper-button-next {
    content: "";
    position: absolute;
   	top: 50%;
    left: 50%;
    width: 2.604vw;
	height: 2.604vw;
    z-index: 2;
    background:url('../images/event/hot-summer-collection/blt_arrow.png?v=1') no-repeat 50% 50% / cover;
}
.hot-summer-wrapper .swiper-button-prev {
    transform: translateX(calc(-33.333vw - 2.604vw - 1.875vw))
}
.hot-summer-wrapper .swiper-button-next {
    transform: translateX(calc(33.333vw + 1.875vw)) rotate(-180deg);
}
.hot-summer-wrapper .swiper-button-disabled::before {
    opacity: 0.2;
}


/* ===== HERO ===== */
.section-hero {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100vh;
	padding-bottom: 100px;
	text-align: center;
	color: #fff;
	line-height: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 9.06%, rgba(0, 0, 0, 0) 56.17%);
}
.section-hero video {
	position: absolute;
	top: 0;
	left: 50%;
	width: 100%;
	height: 100%;
	transform: translateX(-50%);
	object-fit: cover;
	z-index: -1;
}
/* 260422 삭제 */
/* 260422 수정 */
.hero-title {
	width: 28.542vw;
	margin: 0 auto;
}
/* 260422_v2 수정: ico-scroll → btn-ico-scroll-down */
.btn-ico-scroll-down {
	position: absolute;
	bottom: 2.5vw;
	left: 50%;
	transform: translateX(-50%);
}
.btn-wrap .btn-primary {
	min-width: 13.021vw;
	height: 2.604vw;
	padding: 0 4.167vw;
	font-size: 1.042vw;
	font-weight: 700;
	color: #fff;
	border-radius: 0.208vw;
	background: #E31837;
}

/* ===== INTRO ===== */
.section-intro {
	padding: 6.25vw 0;
}
.section-intro .flex-wrap {
	display: flex;
	align-items: flex-end;
	gap: 0 1.25vw;
	font-size: 0;
}
.section-intro .left {
	flex-basis: 38.542vw;
}
.section-intro .right {
	flex-basis: 27.083vw;
}
.section-intro .right img {
	width: 100%;
}
.section-intro video {
	width: 100%;
}
.section-intro .section-title {
	font-size: 2.917vw;
	text-align: left;
}
.section-intro .section-title .tag {
	display: block;
	margin-bottom: 0.521vw;
	font-size: 2.083vw;
}
.section-intro .section-cont {
	margin-bottom: 2.604vw;
	font-size: 1.354vw;
	line-height: 1.5;
	text-align: left;
}

.flow-swiper {
    overflow: hidden;
    margin: 3.125vw 0 0;
}
.flow-track {
    display: flex;
	align-items: center;
    width: max-content;
    will-change: transform;
}
.flow-track.is-running {
    animation: marquee-flow 20s linear infinite;
}
@keyframes marquee-flow {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.flow-item {
    overflow: hidden;
    display: inline-block;
    width: auto;
    height: 21.875vw;
    margin-left: 1.25vw;
    flex-shrink: 0;
}
.flow-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


.section-materials {
	background: #F5F6F7;
}
.section-materials .section-title {
	font-family: 'Pretendard';
	font-size: 2.5vw;
}
.materials-wrap {
	display: flex;
	gap: 0 1.25vw;
	margin-top: 3.646vw;
	padding-bottom: 4.167vw;
}
.materials-wrap .item {
	position: relative;
	display: flex;
	flex-direction: column;
	flex: 1;
	align-items: flex-start;
	padding: 2.083vw 1.563vw;
	height: 23.438vw;
	background: url('../images/event/hot-summer-collection/img_materials_01.jpg?v=1') no-repeat 50% 50% / cover;
	text-align: left;
	color:#fff;
	transition: flex 0.5s;
}
.materials-wrap .item::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(15, 52, 97, 0.3) 13.78%, rgba(60, 102, 153, 0) 55.89%),linear-gradient(180deg, rgba(60, 102, 153, 0) 66.67%, rgba(15, 52, 97, 0.35) 92.11%);
	z-index: 0;
}
.materials-wrap .item.is-hover {
	flex: 3;
}
.materials-wrap .item.is-hover .item-cont,
.materials-wrap .item.is-hover .item-link {
	opacity: 1;
	transition-delay: 0.3s;
}
.materials-wrap .item:nth-child(2) {
	background-image: url('../images/event/hot-summer-collection/img_materials_02.jpg?v=1');
}
.materials-wrap .item:nth-child(2)::after {
	background: linear-gradient(180deg, rgba(188, 188, 188, 0.3) 14.11%, rgba(191, 188, 192, 0) 55.89%),linear-gradient(180deg, rgba(154, 154, 154, 0.45) 24.22%, rgba(191, 188, 192, 0) 47.78%);
	background-blend-mode: multiply;
}
.materials-wrap .item:nth-child(3) {
	background-image: url('../images/event/hot-summer-collection/img_materials_03_v2.jpg?v=1');
}
.materials-wrap .item:nth-child(3)::after {
	background: linear-gradient(180deg, rgba(212, 63, 20, 0.2) 15.6%, rgba(233, 92, 66, 0) 55.89%);
}
.materials-wrap .item:nth-child(4) {
	background-image: url('../images/event/hot-summer-collection/img_materials_04.jpg?v=1');
}
.materials-wrap .item:nth-child(4)::after {
	background: linear-gradient(177.73deg, rgba(30, 48, 82, 0.5) 16.66%, rgba(94, 106, 120, 0) 41.56%);
	background-blend-mode: darken;
}
.materials-wrap .item:nth-child(5) {
	background-image: url('../images/event/hot-summer-collection/img_materials_05.jpg?v=1');
}
.materials-wrap .item:nth-child(5)::after {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.074) 14.11%, rgba(191, 188, 192, 0) 55.89%),linear-gradient(180deg, rgba(0, 0, 0, 0.074) 14.11%, rgba(191, 188, 192, 0) 55.89%);
	background-blend-mode: multiply;
}
.materials-wrap .item-title {
	position: relative;
	display: block;
	padding: 0 4px;
	font-size: 1.667vw;
	font-weight: 700;
	z-index: 1;
	text-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
}
.materials-wrap .item-cont {
	position: relative;
	opacity: 0;
	margin-top: 0.833vw;
	padding: 0 4px;
	font-size: 1.042vw;
	font-weight: 500;
	line-height: 1.5;
	transition: opacity 0.5s;
	z-index: 1;
	text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.45);
}
.materials-wrap .item-link {
	position: relative;
	opacity: 0;
	display: block;
	width: 100%;
	margin-top: auto;
	height: 2.083vw;
	font-size: 0.938vw;
	font-weight: 600;
	line-height: 2.083vw;
	color:#fff;
	border: 0.052vw solid #fff;;
	text-align: center;
	transition: opacity 0.5s;
	z-index: 1;
}

/* ===== TEST INFO ===== */
.section-info {
	position: relative;
	margin-top: 6.25vw;
	padding-bottom: 3.646vw;
	color: #fff;
	background: url('../images/event/hot-summer-collection/bg_event_info_v2.jpg?v=1') no-repeat 50% 0 / cover;
}
/* 퀴즈: section-info 영역을 덮는 오버레이 */
.section-info .section-style-quiz {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 5;
	margin-top: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box;
}
.section-info .section-title {
	font-family: 'NovaECB';
}
.section-info .event-info {
    width: 26.354vw;
    margin: 2.083vw auto 1.771vw;
	text-align: center;
}

.section-info .event-info dl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.625vw 0.729vw;
    text-align: left;
}

.section-info .define-item {
    flex-shrink: 0;
    padding: 0 0.833vw;
    font-size: 0.833vw;
    font-weight: 600;
    line-height: 1.875vw;
    border: 0.052vw solid #fff;
    border-radius: 5.208vw;
    text-align: center;
}

.section-info .define-cont {
    font-size: 1.042vw;
    font-weight: 500;
    color: #fff;
}
.section-info .btn-wrap {
	margin-top: 1.823vw;
}
.section-info .btn-primary {
	width: 19.792vw;
	height: 3.125vw;
}
.benefit-info {
	display: flex;
	align-items: center;
	gap: 1.25vw;
	width: 36.458vw;
	margin: 0 auto;
}
.benefit-info .benefit-item {
	flex: 1;
	padding: 1.563vw 0.781vw 1.302vw;
	border-radius: 0.625vw;
	background: #fff;
}
.benefit-info .benefit-item img {
	width: 7.604vw;
	height: 7.292vw;
}
.benefit-info .benefit-product {
	display: block;
	margin-top: 0.833vw;
	font-size: 0.938vw;
	font-weight: 600;
	color: #000;
}
.benefit-info .benefit-people {
	display: inline-block;
	margin-top: 0.521vw;
	padding: 0 0.417vw;
	font-size: 0.833vw;
	font-weight: 600;
	color: #fff;
	line-height: 1.354vw;
	border-radius: 5.208vw;
	background-color: #000;
}
.bubble-pop {
	position: relative;
	display: inline-block;
	height: 34px;
	margin-top: 1.823vw;
	padding: 0 17px;
	font-size: 16px;
	font-weight: 500;
	border-radius: 5.208vw;
	line-height: 34px;
	background:rgba(255,255,255, 0.25);
}
.bubble-pop strong {
	font-weight: 700;
}
.bubble-pop::after {
	content: "";
	position: absolute;
	bottom: -12px;
	left: 50%;
	transform: translateX(-50%);
	border-width: 6px;
	border-style: solid;
	border-color: rgba(255,255,255, 0.25) transparent transparent transparent;
}
.bubble-pop + .btn-wrap {
	margin-top: 1.25vw;
}



/* ===== GOLDEN HOUR 룩 ===== */
.tab-wrap {
    margin-top: 3.125vw;
    padding-top: 0;
}
.tab-head {
    position: relative;
	display: flex;
    justify-content: center;
    gap:0;
    width: 13.333vw;
    margin: 0 auto;
	background-color: #d9d9d9;
	border-radius: 4px;
}
.tab-anchor {
	display: flex;
	justify-content: center;
	align-items: center;
    width: 6.667vw;
    height: 2.188vw;
	font-family: 'NovaM';
    font-size: 1.25vw;
    font-weight: 500;
    text-align: center;
    position: relative;
    color: #4c4c4c;
	border-radius: 4px;
    z-index: 2;
}
.tab-anchor.is-active {
    color: #fff;
	font-weight: 700;
	background: #E31837;
}
.tab-cont {
    display: none;
}
.tab-cont.is-active {
    display: block;
}
.section-golden-hour {
    position: relative;
	margin-top: 6.25vw;
    padding-top: 4.688vw;
	padding-bottom: 3.281vw;
	background: #F5F6F7;
}
.section-golden-hour .page-sub-text {
    margin-top: 2.083vw;
    font-size: 1.25vw;
    line-height: 1;
    text-align: center;
}
.section-golden-hour .tab-wrap {
	margin-top: 2.396vw;
}
.section-golden-hour .tab-contents-wrap {
    margin-top: 2.292vw;
}
.section-golden-hour .swiper-golden-hour {
	position: relative;
    overflow: hidden;
    max-width: 77.083vw;
    margin: 0 auto;
    padding: 0 5.208vw;
}
.section-golden-hour .slide-link {
    display: block;
    width: 100%;
	height: 39.271vw;
}
.section-golden-hour .swiper-slide{
    max-width: 72.917vw;
}
.section-golden-hour .swiper-slide.swiper-slide-active .theme-desc {
	display: block;
}
.section-golden-hour .slide-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.section-golden-hour .swiper-scrollbar {
    max-width: 60.625vw;
    margin:0;
    height: 4px;
    padding-bottom: 0;
}
.section-golden-hour .swiper-bottom {
	position: relative;
    height: 22px;
    margin-top:34px;
}
.section-golden-hour .swiper-bottom::after {
	content: "";
	position: absolute;
    top:0;
    left: 0;
	width: 100%;
    max-width: 60.625vw;
	height: 4px;
    border-radius: 100px;
    background: #ccc;
    transform: none;
    z-index: 1;
	border-radius: 100px;
}
.section-golden-hour .swiper-controller {
    position: absolute;
    top: -23px;
    right: 0;
    width: 5.521vw;
    height: 2.5vw;
}
.section-golden-hour .swiper-button-prev,
.section-golden-hour .swiper-button-next {
    top:0;
    right: 0;
    width: calc(50% - 5px);
    height: 100%;
    margin:0;
    background:url('../images/event/hot-summer-collection/ico_arrow_round.png?v=1') 50% 50% no-repeat;
    background-size: cover;
	transform: none;
}

.section-golden-hour .swiper-button-prev svg,
.section-golden-hour .swiper-button-next svg {
    display: none;
}
.section-golden-hour .swiper-button-prev {
    left: 0;
    transform: rotate(-180deg);
}
.section-golden-hour .swiper-button-next {
	left: auto;
}
.section-golden-hour .swiper-pagination {
	overflow: hidden;
    width: 100%;
    height: 4px;
    background: none;
	border-radius: 100px;
}
.section-golden-hour .swiper-pagination-progressbar-fill {
    max-width: 60.625vw;
    height: 4px;
    background: #E31837;
	border-radius: 100px;
}


.swiper-golden-hour .swiper-pagination-bullet {
	width: 0.781vw;
	height: 0.208vw;
	background: #ccc;
	border-radius: 0;
	opacity: 1;
	vertical-align: top;
}
.swiper-golden-hour .swiper-pagination-bullet-active {
	width: 2.083vw;
	background-color: #E31837 ;
}


/* ===== STYLE TEST  ===== */
.section-style-quiz {
	margin-top: 6.25vw;
	padding-bottom: 4.531vw;
	background:url('../images/event/hot-summer-collection/bg_my_style_quiz.jpg?v=1') no-repeat 50% 0 / cover;
}
.section-style-quiz .section-title {
	font-size: 3.125vw;
	color: #fff;
}
.quiz-step {
	display: flex;
	justify-content: center;
	gap: 0 1.25vw;
	margin-top: 1.979vw;
}
.quiz-step .step {
	position: relative;
	display: inline-block;
	width: 2.083vw;
	height: 2.083vw;
	font-size: 0;
	font-weight: 500;
	border-radius: 5.208vw;
	border: 0.052vw solid #fff;
	text-align: center;
	line-height: 2.083vw;
	color: #fff;
	background: #fff url('../images/event/hot-summer-collection/ico_done.png?v=1') no-repeat 50% 50%;
}
.quiz-step .step::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 100%;
	width: 1.354vw;
	height: 0.052vw;
	background: rgba(255,255,255, 0.4)
}
.quiz-step .step:first-child::after {
	left: calc(100% + 0.208vw)
}
.quiz-step .step:last-child::after {
	display: none;
}
.quiz-step .step.is-active {
	font-size: 0.833vw;
	font-weight: 700;
	border-width: 0.208vw;
	background: #E31837;
	line-height: 1.719vw;
}
.quiz-step .step.is-active ~ .step {
	font-size: 0.833vw;
	background: none;
}
.quiz-content {
	width: 53.333vw;
	margin: 2.604vw auto 0;
	padding: 3.125vw;
	border-radius: 1.042vw;
	background:url('../images/event/hot-summer-collection/bg_quiz_v2.webp?v=1') no-repeat 50% 50% / cover;
	box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.25);
}
.quiz-content .quiz-title {
	font-size: 2.083vw;
	font-weight: 700;
	color: #000;
}
.quiz-content .input-group {
	display: flex;
	justify-content: center;
	gap: 0 2.083vw;
	margin-top: 2.604vw;
}
.quiz-content .input-item {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	position: relative;
	width: 16.667vw;
	height: 16.146vw;
	padding: 2.083vw 0.521vw;
	border-radius: 0.833vw;
	background-color: #fff;
	box-shadow: 0 0.208vw 0.833vw 0 #42A34240;
	border: 0.313vw solid transparent;
}
.quiz-content .input-item::before {
	content: "";
	position: absolute;
	top: 3.125vw;
	left: 50%;
	width: 6.25vw;
	height: 6.25vw;
	background:url('../images/event/hot-summer-collection/ico_quiz_type.png?v=1') no-repeat 0 0 / 12.5vw auto;
	transform: translateX(-50%);
}
.quiz-content .input-radio {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: visible;
}
.quiz-content .input-item:has(input[type="radio"]:checked){
	border-color: #E31837;
}
.quiz-content .input-label {
	font-size: 1.25vw;
	font-weight: 700;
	color: #000;
}

.quiz-step01 .input-item:first-child + .input-item::before {
	background-position: -6.25vw 0;
}
.quiz-step02 .input-item:first-child::before {
	background-position: 0 -9.375vw;
}
.quiz-step02 .input-item:first-child + .input-item::before {
	background-position: -6.25vw -9.375vw;
}
.quiz-step03 .input-item:first-child::before {
	background-position: 0 -18.75vw;
}
.quiz-step03 .input-item:first-child + .input-item::before {
	background-position: -6.25vw -18.75vw;
}
.quiz-step04 .input-item:first-child::before {
	background-position: 0 -28.125vw;
}
.quiz-step04 .input-item:first-child + .input-item::before {
	background-position: -6.25vw -28.125vw;
}
.quiz-step05 .input-item:first-child::before {
	background-position: 0 -37.5vw;
}
.quiz-step05 .input-item:first-child + .input-item::before {
	background-position: -6.25vw -37.5vw;
}

.quiz-last-step {
	background: #fff;
}
.quiz-text {
	margin-top: 1.563vw;
	font-size: 1.25vw;
	font-weight: 500;
	line-height: 1.5;
	color: #000;
}

.flex-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.042vw;
}
.quiz-last-step .flex-wrap {
	margin-top: 2.083vw;
	padding: 2.083vw 3.021vw;
	border-radius: 0.625vw;
	background: #F5F6F7;
}

.quiz-last-step .cf {
	flex-basis: 100%;
	text-align: left;
}
.quiz-last-step .input-group {
	flex: 1;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin-top: 0;
}
.quiz-last-step .input-group-label {
	font-size: 0.833vw;
	line-height: 1.5;
	font-weight: 600;
}
.quiz-last-step .input-group-label .required {
	font-size: inherit;
	font-weight: inherit;
}
.quiz-last-step .form-control {
	height: 2.292vw;
	margin-top: 0.313vw;
	border-radius: 0.208vw;
	background: #fff;
}
.quiz-last-step .form-control::placeholder {
	font-size: 0.729vw;
}
.quiz-last-step .btn-wrap {
	margin-top: 1.563vw;
}
.cf {
	margin-top: 0.521vw;
	font-size: 0.677vw;
	color: #4c4c4c;
}
.cf .nova {
	font-family: 'NovaM';
}



/* ===== STYLE TEST 결과  ===== */
/* section-info 영역을 덮는 오버레이 */
.section-info .section-style-result {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 6;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box;
}
.section-style-result {
	display: flex;
	justify-content: center;
	gap: 0 1.042vw;
	margin-top: 0;
	padding: 4.167vw 0;
	background: url('../images/event/hot-summer-collection/bg_event_info_v2.jpg?v=1') no-repeat 50% 0 / cover;
}
.section-style-result > article {
	width: 32.708vw;
	padding: 2.604vw;
	background: #fff;
	border-radius: 0.833vw;
	color: #000;
}
.section-style-result .type-desc {
	font-size: 1.042vw;
	font-weight: 600;
}
.section-style-result .type-title {
	display: block;
	margin-top: 0.833vw;
	font-size: 2.188vw;
	font-weight: 700;
}
.section-style-result .img-my-type {
	width: 11.458vw;
	height: 11.458vw;
	margin-top: 1.563vw;
}
.section-style-result .type-detail {
	margin-top: 1.354vw;
	font-size: 0.938vw;
	font-weight: 500;
	line-height: 1.35;
	white-space: pre-wrap;
}
.section-style-result .type-analysis {
	display: inline-block;
	margin-top: 1.25vw;
	padding: 0 0.833vw;
	font-size: 0.833vw;
	font-weight: 500;
	line-height: 1.771vw;
	border-radius: 0.208vw;
	background: #EBEBEB;
}
.section-style-result .type-analysis em {
	font-weight: 700;
}
.btn-flex-wrap {
	position: relative;
	display: flex;
	justify-content: center;
	gap: 0 0.521vw;
	margin-top: 1.25vw;
}
.btn-flex-wrap button {
	flex: 0 0 5.729vw;
	height: 1.875vw;
}
.btn-retry {
	padding-left: 1.302vw;
	font-size: 0.833vw;
	font-weight: 500;
	color: #000;
	border: 0.052vw solid #000;
	border-radius: 0.208vw;
	background: url('../images/common/ico_btn_reset_v3.svg') no-repeat 0.729vw 50% / 0.833vw auto;
}
.btn-share {
	padding-left: 1.302vw;
	font-size: 0.833vw;
	font-weight: 500;
	color: #fff;
	border: 0.052vw solid #54575A;
	border-radius: 0.208vw;
	background: #54575A url('../images/common/ico_sns_share_w.png') no-repeat 0.729vw 50% / 0.833vw auto;
}

.recommend-txt {
	display: inline-block;
	padding-left: 1.563vw;
	font-size: 0.833vw;
	font-weight: 500;
	color: #000;
	background: url('../images/event/hot-summer-collection/ico_like.png?v=1') no-repeat 0 50% / 1.25vw 1.25vw;
}
.recommend-title {
	display: block;
	margin-top: 0.833vw;
	padding-left: 1.563vw;
	font-size: 1.771vw;
	font-weight: 700;
	color: #000;
}
.section-style-result .my-style-recommend {
	padding: 2.604vw 1.302vw;
}
.my-style-recommend .btn-wrap {
	margin-top: 1.25vw;
}
.my-style-recommend .tab-wrap {
	margin-top: 1.25vw;
}
.my-style-recommend .tab-head {
	width: 8.125vw;
	border-radius: 0.208vw;
}
.my-style-recommend .tab-anchor {
	flex: 1;
	height: 1.667vw;
	font-size: 0.833vw;
}
.my-style-recommend .tab-anchor.is-active {
	border-radius: 0.208vw;
	background-color: #000;
}
.my-style-recommend .tab-contents-wrap {
	margin-top: 1.25vw;
}
.my-style-recommend .swiper-slide {
	display: flex;
	justify-content: center;
	gap: 0 0.625vw;
}
.my-style-recommend .slide-link {
	overflow: hidden;
	width: 11.875vw;
	height: 15.833vw;
	border-radius: 0.417vw;
	border:0.052vw solid rgba(229, 229, 229, 0.8)
}
.my-style-recommend .slide-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.my-style-recommend .swiper {
	position: relative;
}

.my-style-recommend .swiper-button-prev {
	left: 0;
	width: 2.188vw;
	height: 2.188vw;
	transform: none;
}
.my-style-recommend .swiper-button-next {
	left: auto;
	right: 0;
	width: 2.188vw;
	height: 2.188vw;
	transform: rotate(-180deg);
}
.my-style-recommend .swiper-wrapper:has(.swiper-slide:only-child) ~ .swiper-button-prev,
.my-style-recommend .swiper-wrapper:has(.swiper-slide:only-child) ~ .swiper-button-next {
	display: none;
}
.share-box {
	top: -0.052vw;
	right: 7.031vw;
	width: 13.542vw;
    padding: 0.781vw 2.604vw 0.781vw 1.042vw;
    border-radius: 1.302vw;
}
.share-box li{
	display: inline-block;
	width: 1.042vw;
	height: 1.042vw;
	vertical-align: middle;
}
.share-box li + li {
	margin: 0 0 0 1.563vw;
}
.share-box li a{
	width: 1.042vw;
	height: 1.042vw;
}



/* ===== BANNER  ===== */
.campaign-banner {
	width: 100%;
	height: 16.667vw;
	margin: 6.25vw auto 0;
	padding: 4.792vw 0 5.208vw;
	background:url('../images/event/hot-summer-collection/bg_banner_v2.jpg?v=1') no-repeat 50% 50% / cover;
}
.campaign-banner .banner-title {
	display: block;
	margin-bottom: 2.083vw;
	font-size: 1.667vw;
	font-weight: 700;
	color: #fff;
	text-align: center;
}
.btn-link-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.833vw;
}
.btn-link-wrap a {
	display: inline-block;
	width: 13.542vw;
	font-size: 0.938vw;
	font-weight: 600;
	line-height: 2.708vw;
	border-radius: 0.208vw;
	text-align: center;
}
.btn-link-w {
	border: 0.104vw solid #E32338;
	background-color: #fff;
	color: #E32338;
}
.btn-link-r {
	border: 0.104vw solid #E32338;
	background-color: #E32338;
	color: #fff
}


.layer-video-view .layer-popup {width:960px;border-radius: 0;}
.layer-video-view .layer-content {position:relative;padding: 60px 0;font-size: 0;}
.layer-video-view .layer-content .video-wrap {width:100%;height: 100%;}
.layer-video-view .layer-content .video-wrap video {width:100%;height: 100%;object-fit: cover;}
.layer-video-view .layer-popup .layer-inner .btn-layer-close {top:-32px;right:0;width:24px;height:24px;background: url('../images/common/ico_pop_close_w.png') no-repeat 50% 50% / cover}

/* 260422 사진 보기 레이어 팝업 */
.layer-photo-view .layer-popup {overflow:hidden;width:672px;max-height:86dvh;height:734px;padding:0 50px;border-radius: 0;background-color: transparent;}
.layer-photo-view .layer-content {position:relative;padding: 0;}
.layer-wrap .layer-popup .layer-inner,
.layer-wrap .layer-popup .layer-body,
.layer-wrap .layer-popup .layer-content {height: 100%;}
.layer-photo-view .layer-content .swiper {overflow:hidden;width:100%;height:100%;}
.layer-photo-view .layer-content .swiper .swiper-slide img {width:100%;height:100%;object-fit: cover;object-position: top;}
.layer-photo-view .layer-content .swiper-button-prev {width:44px;left: -50px;background-image:none;mask: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E") no-repeat;background-color: #fff;}
.layer-photo-view .layer-content .swiper-button-next {width:44px;right: -67px;background-image:none;mask: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E") no-repeat;background-color: #fff;}
.layer-photo-view .layer-content .swiper-pagination {bottom: 4px;left:50%;transform: translateX(-50%);}
.layer-photo-view .layer-content .swiper-pagination-bullet {margin: 0 4px}
.layer-photo-view .layer-content .swiper-pagination-bullet-active {background-color: #E31837;}
.layer-photo-view .layer-popup .layer-inner .btn-layer-close {top:-10px;right:-60px;width:45px;height:45px;z-index: 1;background: url('../images/common/ico-close-white.svg') no-repeat 50% 50% / cover;}
