@charset "utf-8";

/* 공통 - 버튼 */
.imc__btnArea {
  display: flex;
  gap: calc(10 * var(--vw));
}
.imc__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(150 * var(--vw));
  height: calc(48 * var(--vw));
  border-radius: calc(5 * var(--vw));
  font-size: calc(16 * var(--vw));
  letter-spacing: calc(-0.8 * var(--vw));
}
.imc__btn--dark {
  background-color: #151415;
  color: #fff !important;
}


/* 공통 - 레이아웃 */
.imc {
  position: relative;
  color: #151415;
}
[class*="imc__section"] {
  position: relative;
  padding-bottom: calc(160 * var(--vw));
}
[class*="imc__section"] .section__title {
  margin-bottom: calc(20 * var(--vw));
  padding: 0 calc(55 * var(--vw));
  font-size: calc(36 * var(--vw));
  font-weight: 900;
  line-height: calc(54 * var(--vw));
  letter-spacing: -0.05em;
}
[class*="imc__section"] .section__title .en {
  font-size: calc(42 * var(--vw));
  font-weight: 800;
  letter-spacing: calc(-2.1 * var(--vw));
}
.collection .md_choice.md_choice-st02 {
  margin-top: 0;
}

/* 상단 메뉴 */
.imc__gnb {
  z-index: 10;
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  text-align: center;
  transition: .2s;
}
.imc__gnb.on {
  transform: translateY(-78px);
}
.imc__gnb .gnb__title {
  font-size: 44px;
  font-family: 'ITCGaramondStd', sans-serif;
  padding-top: 31px;
  color: #151415;
  line-height: 1;
  letter-spacing: -0.01em;
}
.imc__gnb .gnb__list {
  display: flex;
  justify-content: center;
  padding: 20px 0;
}
.imc__gnb .gnb__link {
  display: block;
  color: #151415;
  font-size: 16px;
  letter-spacing: -0.05em;
  line-height: 20px;
  padding: 0 16px;
}
.imc__gnb .gnb__link:hover {
  color: #cf0a2c;
}


/*  슬라이드 영역 */
.imc__banner {
  padding: 0 calc(55 * var(--vw)) calc(160 * var(--vw));
}
.imc__banner .swiper-pagination-bullets {
  z-index: 1;
  position: absolute;
  left: 0;
  top: calc((794 - 15) * calc(var(--vw))); /* 브라우저 스크롤 넓이 제외 */
  bottom: initial;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}

.imc__banner .swiper-pagination-bullets .swiper-pagination-bullet {
  opacity: 0.3;
  width: 16px;
  height: 16px;
  margin: 0;
  border-radius: 50%;
  background-color: #151415;
}
.imc__banner .swiper-pagination-bullets .swiper-pagination-bullet-active {
  opacity: 1;
}

/* 스와이핑 배너 */
.imc__section--running {}
.imc__section--running .running__thumb {}
.imc__section--running .running__content {
  padding-top: calc(20 * var(--vw));
}
.imc__section--running .running__title {
  font-size: calc(28 * var(--vw));
  font-weight: 800;
  line-height: calc(34 * var(--vw));
}
.imc__section--running .running__desc {
  font-size: calc(18 * var(--vw));
  line-height: calc(26 * var(--vw));
  padding-top: calc(5 * var(--vw));
  letter-spacing: calc(-0.8 * var(--vw));
}
.imc__section--running .running__btns {
  margin-top: calc(24 * var(--vw));
}
.imc__section--running .swiper-container {
  padding: 0 calc(40 * var(--vw));
}
.imc__section--running .swiper-slide {
  width: calc(480 * var(--vw));
  margin: 0 calc(15 * var(--vw));
}


.imc__section--purpose {}
.imc__section--purpose .purpose__thumb {}
.imc__section--purpose .purpose__content {
  margin-top: calc(30 * var(--vw));
}
.imc__section--purpose .purpose__title {
  font-size: calc(30 * var(--vw));
  font-weight: 900;
  line-height: 120%;
  letter-spacing: calc(-1.5 * var(--vw));
}
.imc__section--purpose .purpose__title .en {
  font-size: calc(34 * var(--vw));
  font-weight: 800;
}
.imc__section--purpose .purpose__info {
  margin-top: calc(40 * var(--vw));
  font-size: calc(18 * var(--vw));
  line-height: calc(13 * var(--vw));
  letter-spacing: calc(-0.9 * var(--vw));
}
.imc__section--purpose .purpose__info .en {
  font-size: calc(20 * var(--vw));
  letter-spacing: 0;
}
.imc__section--purpose .purpose__info .info__item {
  display: flex;
}
.imc__section--purpose .purpose__info .info__item:not(:first-of-type) {
  margin-top: calc(16 * var(--vw));
  padding-top: calc(16 * var(--vw));
  border-top: 1px solid #CBCBCB;
}
.imc__section--purpose .purpose__info .info__title {
  flex-shrink: 0;
  width: calc(104 * var(--vw));
  font-weight: 900;
}
.imc__section--purpose .purpose__info .info__desc {
  white-space: nowrap;
}
.imc__section--purpose .purpose__btns {
  margin-top: calc(34 * var(--vw));
}
.imc__section--purpose .swiper-container {
  padding: 0 calc(40 * var(--vw));
}
.imc__section--purpose .swiper-slide {
  width: calc(400 * var(--vw));
  margin: 0 calc(15 * var(--vw));
}


.imc__section--quick {
  margin-bottom: calc(160 * var(--vw));;
  color: #EEECE5;
  text-align: center;
}

.imc__section--quick .img_titlev1{
  width: calc(646 * var(--vw));
  padding: 72px 0 6px;
  margin: auto;
}


.imc__section--quick.fb__color--black {
  color: #151415;
}
.imc__section--quick .quick__subTitle {
  font-size: calc(44 * var(--vw));
  font-weight: 900;
  letter-spacing: -0.05em;
}
.imc__section--quick .quick__subTitle .en {
  font-size: calc(48 * var(--vw));
  font-weight: 800;
}
.imc__section--quick .quick__title {
  margin-top: calc(5 * var(--vw));
  font-size:calc(84 * var(--vw));
  font-family: 'ITCGaramondStd', sans-serif;
  line-height: calc(101 * var(--vw));
  letter-spacing: -0.01em;
}
.imc__section--quick .quick__desc {
  margin-top: calc(6 * var(--vw));
  font-size: calc(24 * var(--vw));
  line-height: calc(38 * var(--vw));
  letter-spacing: -0.05em;
}
.imc__section--quick .quick__desc b {
  font-weight: 700;
}
.imc__section--quick .quick__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: calc(54 * var(--vw)) auto 0;
  width: calc(180 * var(--vw));
  height: calc(48 * var(--vw));
  background-color: #151415;
  border: 1px solid #3D2F2E;
  border-radius: calc(5 * var(--vw));
  font-size: calc(16 * var(--vw));
  font-weight: 700;
  color: #FFFFFF !important;
}

/* 러닝화 상품 리뷰 */
.imc__section--review {}
.imc__section--review .review__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: calc(10 * var(--vw));
  padding: 0 calc(55 * var(--vw));
}
.imc__section--review .review__item {
  position: relative;
}
.imc__section--review .review__btns {
  z-index: 1;
  position: absolute;
  bottom: 6.4%;
  left: 8.6%;
  display: flex;
  width: 51%;
  height: 5.8%;
  gap: 4%;
}
.imc__section--review .review__btn {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 0;
}

/* NB 러너 혜택 */
.imc__section--benefit .benefit__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(10 * var(--vw));
  padding: 0 calc(55 * var(--vw));
}
.imc__section--benefit .benefit__item {
  position: relative;
}
.imc__section--benefit .benefit__btn {
  z-index: 1;
  position: absolute;
  left: 8.84%;
  bottom: 16.4%;
  width: 12.4%;
  height: 12%;
  font-size: 0;
}

/* 러닝 의류/용품 */
.imc__section--category {}
.imc__section--category .category__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(65 * var(--vw));
  padding: 0 calc(55 * var(--vw));
}
.imc__section--category .category__link {
  position: relative;
  display: block;
  border-radius: calc(16 * var(--vw));
  overflow: hidden;
}
.imc__section--category .category__link::after {
  content: '';
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  transition: opacity .5s ease-in-out;
}
.imc__section--category .category__link:hover::after {
  opacity: 0.3;
}
.imc__section--category .category__title {
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: calc(48 * var(--vw));
  font-weight: 800;
  color: #fff;
  transform: translate(-50%, -50%);
}

.btn_top {cursor: pointer;}

/* 배너 공통 :: S */
.imc .visual_txtbox {margin-bottom: 0; background-color: #fff; height: auto;}
.imc_btn_area{display: flex; gap: 12px;}
.imc_btn_area-center{justify-content: center;}
.imc_btn{height: 48px;line-height: 46px;padding: 0 25px; box-sizing: border-box; border-radius: 5px;font-size: 16px;letter-spacing: -0.05em;text-align: center;min-width: 140px;} /* 20240725 #18491 수정 */
.imc_btn-bk{background: #151415;color: #fff;}
.imc_btn-bk:hover, .imc_btn-bk:active, .rsp_btn:hover{color: #fff;}
.visual_txtbox .mainBtn {margin: 0}
.visual_txtbox .mainBtn-white {border:1px solid #151415;}
.imc_banner_info{display: flex;flex-direction: column;/*padding-bottom: 30px;*/ height:124px;}/*20230628 수정*/ /* 20240719 #18491 수정 */
.imc_banner_info .banner_tit{font-size: 45px;font-weight: 800;text-align: center; line-height: 55px; color: #151415; white-space: nowrap;}
.imc_banner_info .banner_desc{font-size: 20px;text-align: center;margin-top: 14px; line-height: 22px; color: #151415} /* 20240719 #18491 수정 */
/* 배너 공통 :: E */


/* 오프라인 착화 가능 매장 자세히보기 팝업 */
.offlineShopPopup{display: none; position:fixed; top:0; z-index: 9999; background:rgba(0,0,0,0.6); left:0; width:100%; height:100%; overflow: auto}
.offlineShopPopup .offlineShopPopup_wrap{ padding: 3.5% 0; position: relative; width:73%; margin:0 auto;  }
.offlineShopPopup .offlineShopPopup_wrap .offlineShopPopup_inner{display: flex; justify-content: flex-end; align-items: flex-start; background:#fff; padding:40px 80px 100px 80px; flex-wrap: wrap; border-radius: 30px; width:100%; box-sizing: border-box;}
.offlineShopPopup .offlineShopPopup_wrap .offlineShopPopup_inner>img{width:100%; }
.offlineShopPopup .offlineShopPopup_wrap button{position:sticky; top:40px; left:40px; transform:translateX(40px); z-index: 9999;}