@charset "UTF-8";



/* 그레이 색상 팔레트 var(--var-gr-0);*/
:root {
	--var-gr-0: #ffffff;
	/* Background */
	--var-gr-5: #f8f8f8;
	/* Background */
	--var-gr-10: #f0f0f0;
	/* Background */
	--var-gr-20: #e4e4e4;
	/* Disabled */
	--var-gr-30: #d8d8d8;
	/* Border */
	--var-gr-40: #c6c6c6;
	/* Border */
	--var-gr-50: #8e8e8e;
	/* Border */
	/*Text-disabled */
	--var-gr-60: #717171;
	--var-gr-70: #555555;
	/* Text-body */
	--var-gr-80: #2d2d2d;
	--var-gr-90: #1d1d1d;
	/* Text-title */
	--var-gr-100: #000000;
	/* button */


	/* 레드 색상 팔레트 */
	--var-rd-0: #FFFFFF;
	--var-rd-5: #FEE6E6;
	--var-rd-10: #FECECC;
	--var-rd-20: #FD9D99;
	--var-rd-30: #FC6C66;
	--var-rd-40: #FB3B33;
	--var-rd-50: #FA0A00;
	--var-rd-60: #C80800;
	--var-rd-70: #960600;
	--var-rd-80: #640400;
	--var-rd-90: #320200;
	--var-rd-100: #000000;

	/* 블루 색상 팔레트 */
	--var-bl-0: #ffffff;
	--var-bl-5: #EFF6FC;
	--var-bl-10: #DEEEFA;
	--var-bl-20: #BDDCF5;
	--var-bl-30: #9DCBF0;
	--var-bl-40: #7CBAEB;
	--var-bl-50: #5BA9E6;
	--var-bl-60: #4987B8;
	--var-bl-70: #37658A;
	--var-bl-80: #24445C;
	--var-bl-90: #12222E;
	--var-bl-100: #000000;

	/* 기타 브랜드 색상 팔레트 */
	--var-or-50: #FF8800;
	/* 오렌지 */
	--var-grn-50: #00A003;
	/* 그린 */
	--var-br-50: #74582C;
	/* 브라운 */
}


/* 하이라이트컬러 */

/* 레드 키컬러 */
.c-red {
	color: var(--var-rd-50) !important;
}

/* 블루 키컬러 */
.c-blue {
	color: var(--var-bl-50) !important;
}

/* 블루2 다크버전  */
.c-blue2 {
	color: var(--var-bl-60) !important;
}



/* 브랜드컬러 오렌지 */
.c-org {
	color: var(--var-or-50) !important;
}

/* 브랜드컬러 그린 */
.c-grn {
	color: var(--var-grn-50) !important;
}

/* 브랜드컬러 브라운 */
.c-br {
	color: var(--var-br-50) !important;
}





/* 쿠폰 컬러, 배경 컬러 */


/* 레드 키컬러 */
.bg-red {
	background-color: var(--var-rd-50) !important;
}

/* 레드 키컬러 다크1 */
.bg-red2 {
	background-color: var(--var-rd-60) !important;
}

/* 레드 키컬러 다크2 */
.bg-red3 {
	background-color: var(--var-rd-70) !important;
}

/* 블루 키컬러 */
.bg-blue {
	background-color: var(--var-bl-50) !important;
}

/* 블루 다크버전1 */
.bg-blue2 {
	background-color: var(--var-bl-60) !important;
}

/* 블루 다크버전2 */
.bg-blue3 {
	background-color: var(--var-bl-70) !important;
}

/* 브랜드컬러 오렌지 */
.bg-org {
	background-color: var(--var-or-50) !important;
}

/* 브랜드컬러 그린 */
.bg-grn {
	background-color: var(--var-grn-50) !important;
}

/* 브랜드컬러 브라운 */
.bg-br {
	background-color: var(--var-br-50) !important;
}















/* =========================
   Card pm-section Layout
========================= */

html,body{overflow-x:inherit}




.caution-area {
	margin-top: 2rem;
}

.caution-area .title {
	color: #5a5a5a;
	font-size: 0.9375rem;
	font-style: normal;
	font-weight: 700;
	line-height: 150%;
	letter-spacing: 0.09375;
	background: url(https://image.prospecs.com/front/images/common/promo/i_caution_minus.svg) center right/1rem no-repeat;
	cursor: pointer;
}

.caution-area ul {
	margin-top: 1rem;
}

.caution-area ul li {
	margin-top: 0.4rem;
	color: #757575;
	font-size: 1rem;
	font-weight: 400;
	line-height: 150%;
	margin-left: 1rem;
	text-indent: -0.5rem;
	word-break: auto-phrase;
}

.caution-area ul li::before {
	display: inline-block;
	content: "·";
	font-size: 1rem;
	font-weight: 400;
	line-height: 150%;
	margin-right: 0.5rem;
}

.caution-area ul li:first-of-type {
	margin-top: 0;
}

.caution-area.closed .title {
	background: url(https://image.prospecs.com/front/images/common/promo/i_caution_plus.svg) center right/1rem no-repeat;
}

.float-btn {
	position: fixed;
	padding: 0.9rem 2.8rem;
	font-size: 0.865rem;
	bottom: 1rem;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
	border: 1px solid #2d2d2d;
	z-index: 90;
	display: none;

}

.float-btn > div {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	color: #2d2d2d;
	gap: 0.375rem;
	cursor: pointer;
	white-space: nowrap;
}

.float-btn > div i {
	display: inline-block;
	width: 1rem;
	height: 1rem;
	background: url(https://image.prospecs.com/front/images/common/promo/arr_down.svg) center/cover no-repeat;
}

.card-pm-section .card .coupon-box {
	margin: 1.75rem 0 0;
	padding: 4rem 1.25rem;
	background-color: var(--var-rd-50);
	display: flex;
	flex-flow: column;
	gap: 2rem;
}

.card-pm-section .card .coupon-box .coupon-name {
	color: #f5f5f5;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1;
}

.card-pm-section .card .coupon-box .coupon-desc {
	color: var(--var-gr-0);
	opacity: 0.8;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1;
}

.card-pm-section .card .coupon-box .coupon-percent {
	color: #f5f5f5;
	font-size: 4rem;
	font-weight: 700;
	line-height: 1;
}

.card-pm-section .card button {
	margin-top: 1rem;
	width: 100%;
	height: 64px;
	line-height: 64px;
	background: var(--var-gr-100);
	color: #fff;
	font-size: 1.1875rem;
	font-weight: 500;
	line-height: 150%;
	border: none;
}





.card-pm-section .card .coupon-box {
		margin: 2rem 0 0;
		padding: 2rem 1.25rem;
		background-color: var(--var-rd-50);
		display: flex;
		flex-flow: column;
		gap: 1.5rem;
	}


	.card-pm-section .card .coupon-box .coupon-percent {
		color: #f5f5f5;
		font-size: 3rem;
		font-weight: 700;
		line-height: 1;
	}

	.card-pm-section .card .coupon-box .coupon-desc {
	color: var(--var-gr-0);
	opacity: 0.8;
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 1;
}

	.card-pm-section .card .coupon-box .coupon-name {
	color: #f5f5f5;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1;
}

	












.promotion-page.page .img-link{position:relative;}
.promotion-page.page .img-link a{
  display:flex;align-items:center;justify-content:center;
  position:absolute;width:16px;height:16px;transition:.3s;z-index:5;
}
.promotion-page.page .img-link a img{position:relative;z-index:1;transition:.3s;}
.promotion-page.page .img-link a:after{
  content:'';position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  display:inline-block;width:0%;height:0%;border-radius:50%;
  animation:shadow 1.2s ease-out infinite;
  background:rgb(0,20,42);
}
.promotion-page.page .img-link a.bt:after{background:#fff;}
.promotion-page.page .img-link a:hover img{transform:rotate(90deg);}



/* 보조: 공통 위치 지정 */
.img-link{position:relative;display:inline-block;}
.img-link a{position:absolute;}
.pm-sec3 .goods01 {left: 20%; top: 20%;}
.pm-sec3 .goods02 {left: 28%; top: 45%;}
.pm-sec3 .goods03 {left: 21%; top: 76%;}
.pm-sec3 .goods04 {left: 19%; top: 85%;}
.pm-sec3 .goods05 {left: 73%; top: 24%;}
.pm-sec3 .goods06 {left: 73%; top: 22%;}
.pm-sec3 .goods07 {left: 76%; top: 30%;}
.pm-sec3 .goods08 {left: 73%; top: 54%;}
.pm-sec3 .goods09 {left: 73%; top: 74%;}
.pm-sec3 .goods10 {left: 70%; top: 76%;}



.pm-sec5 .goods01 {left: 40%; top: 40%;}
.pm-sec5 .goods02 {left: 68%; top: 40%;}
.pm-sec5 .goods03 {left: 70%; top: 75%;}


.pm-sec6 .goods01 {left: 50%; top: 17%;}
.pm-sec6 .goods02 {left: 48%; top: 27%;}
.pm-sec6 .goods03 {left: 47%; top: 44%;}
.pm-sec6 .goods04 {left: 54%; top: 43%;}
.pm-sec6 .goods05 {left: 28%; top: 70%;}
.pm-sec6 .goods06 {left: 32%; top: 78%;}
.pm-sec6 .goods07 {left: 26%; top: 91%;}
.pm-sec6 .goods08 {left: 31%; top: 94%;}
.pm-sec6 .goods09 {left: 72%; top: 78%;}
.pm-sec6 .goods10 {left: 65%; top: 89%;}
.pm-sec6 .goods11 {left: 70%; top: 81%;}


.pm-sec7 .goods01 {left: 29%; top: 14%;}
.pm-sec7 .goods02 {left: 21%; top: 27%;}
.pm-sec7 .goods03 {left: 21%; top: 13%;}
.pm-sec7 .goods04 {left: 21%; top: 41%;}
.pm-sec7 .goods05 {left: 28%; top: 44%;}
.pm-sec7 .goods06 {left: 79%; top: 9%;}
.pm-sec7 .goods07 {left: 77%; top: 15%;}
.pm-sec7 .goods08 {left: 72%; top: 26%;}
.pm-sec7 .goods09 {left: 73%; top: 35%;}
.pm-sec7 .goods10 {left: 75%; top: 42%;}

/* ===== pm-sec7: 11 ~ 22 ===== */
.pm-sec7 .goods11 {left: 33%; top: 68%;}  /* 남자모델 상의 */
.pm-sec7 .goods12 {left: 33%; top: 77%;}  /* 남자모델 하의 */
.pm-sec7 .goods13 {left: 25%; top: 95%;}  /* 남자모델 신발 */

.pm-sec7 .goods14 {left: 52%; top: 68%;}  /* 마스크모델 모자 */
.pm-sec7 .goods15 {left: 50%; top: 69%;}  /* 마스크모델  */
.pm-sec7 .goods16 {left: 77%; top: 71%;}  /* 여성 시즌리스 브라탑 */
.pm-sec7 .goods17 {left: 73%; top: 78%;}  /* 여성 시즌리스 5부 레깅스 */

.pm-sec7 .goods18 {left: 76%; top: 92%;}  /* 여자모델 중목 양말 */
.pm-sec7 .goods19 {left: 74%; top: 95%;}  /* 듀플렉스 gf */




.pm-sec8 .goods01 {left: 47%; top: 14%;}
.pm-sec8 .goods02 {left: 55%; top: 12%;}
.pm-sec8 .goods03 {left: 51%; top: 26%;}
.pm-sec8 .goods04 {left: 50%; top: 45%;}
.pm-sec8 .goods05 {left: 24%; top: 68%;}
.pm-sec8 .goods06 {left: 66%; top: 80%;}
.pm-sec8 .goods07 {left: 26%; top: 96%;}
.pm-sec8 .goods08 {left: 72%; top: 88%;}
.pm-sec8 .goods09 {left: 73%; top: 35%;}
.pm-sec8 .goods10 {left: 75%; top: 42%;}







@keyframes shadow{
  0%{width:0%;height:0%;opacity:.7;}
  100%{width:240%;height:240%;opacity:0;}
}











/* === Promo Event pm-section (공통 컴포넌트) === */
.promo-event {
  display: flex;
  gap: 80px;
  text-align: left;
}

/* 좌측 고정 정보 박스 */
.promo-event__sticky {
  position: sticky;
  top: 0;
  padding: 180px 0 0 240px;
  width: 960px;
  height: 825px;
}
.promo-event__title {
  font-weight: 700;
  font-size: 56px;
  color: #1d1d1d;
  line-height: 1.3;
}
.promo-event__desc {
  font-weight: 400;
  font-size: 24px;
  color: #555555;
  line-height: 1.5;
  margin-top: 1.5rem;
}
.promo-event__desc .tx-red { color: #d0122b; }

.promo-event__dl { margin-top: 42px; }
.promo-event__dt {
  font-weight: 600;
  font-size: 20px;
  color: #1d1d1d;
}
.promo-event__dd {
  font-weight: 400;
  font-size: 20px;
  color: #555;
  margin-top: 4px;
}
.promo-event__dd + .promo-event__dt { margin-top: 24px; }

.promo-event__cta {
  width: 620px;
  margin-top: 2.6rem;
}

/* 우측 세로 스텝/이미지 리스트 */
.promo-event__vertical {
  padding-top: 180px;
  display: flex;
  flex-direction: column;
  gap: 160px;
  flex: 0 0 640px;
}
.promo-event__item { width: 100%; }
.promo-event__item .thumb { position: relative; }
.promo-event__item img { width: 100%; }

.promo-event__badge {
  font-weight: 600;
  font-size: 16px;
  color: #d0122b;
  margin-top: 16px;
  display: block;
}
.promo-event__text {
  font-weight: 400;
  font-size: 22px;
  color: #1d1d1d;
  margin-top: 7px;
}

/* 유의사항 */
.promo-event__notice { margin-top: 40px; }
.promo-event__notice .title {
  display: flex; align-items: center; gap: 8px;
  font-weight: 700; font-size: 20px; color: #1d1d1d;
}
.promo-event__notice .title a { display: inline-flex; }
.promo-event__notice ul { margin-top: 12px; }
.promo-event__notice li { font-size: 16px; color: #555; line-height: 1.6; }

/* on-thumb 버튼은 기존 글로벌 스타일(.ps-btn.on-thumb) 사용 */




/* 유의사항 타이틀 */
.promo-event__notice .title {
  font-weight: 700;
  font-size: 17px;
  color: #5a5a5a;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}

/* 리스트 */
.promo-event__notice li {
  font-weight: 500;
  font-size: 15px;
  line-height: 1.5;
  color: #767676;
  position: relative;
  padding-left: 15px;
  list-style: none;
}
.promo-event__notice li::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #767676;
  position: absolute;
  left: 0;
  top: 8px;
}
.promo-event__notice li + li { margin-top: 5px; }

/* 토글 아이콘( + / − ) */
.promo-event__notice .title a {
  display: inline-block;
  flex: 0 0 16px;
  height: 16px;
}
.promo-event__notice .title a span {
  text-indent: -999em;
  display: inline-block;
  position: relative;
}
.promo-event__notice .title a span::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 1px;
  background: #767676;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.promo-event__notice .title a span::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 1px;
  background: #767676;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
  transition: all 0.3s ease-in-out;
}
.promo-event__notice .title a.active span::after {
  transform: translate(-50%, -50%) rotate(0deg);
}