/* D1-Intro / web-mobile collapse text + mobile-only divider
   목적:
   1) 웹에서는 D1 하단 가로줄 없음
   2) 모바일에서는 D1이 예약창 위로 이동하므로 D1 하단에만 얇은 가로 구분선 표시
   3) 웹 margin-bottom:14px / 모바일 margin-bottom:12px
   4) 이전에 잘못 붙은 ::after 가로선 제거
*/

/* 이전 잘못된 화살표 ::after 가로선 강제 제거 */
#hk-studio-description .hk-d1-intro__toggle::after,
#hk-studio-description .hk-d1-intro__more-toggle::after,
#hk-studio-description [data-hk-d1-toggle]::after{
  content:none !important;
  display:none !important;
}

/* D1 기본 */
#hk-studio-description.hk-d1-intro{
  border-bottom:0 !important;
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}

.hk-d1-intro .hk-studio-section__body p{
  margin:0 0 16px;
}

/* 상단 스펙 아이콘/텍스트 */
.hk-d1-intro__specs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px 18px;
  margin:0 0 22px;
}

.hk-d1-intro__spec{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:22px;
  color:#111;
  font-size:13px;
  font-weight:500;
  line-height:1;
  white-space:nowrap;
}

/* 아이콘이 커지는 문제 강제 차단 */
.hk-d1-intro__spec-icon,
.hk-d1-intro__spec-symbol{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:17px !important;
  height:17px !important;
  min-width:17px !important;
  max-width:17px !important;
  min-height:17px !important;
  max-height:17px !important;
  color:#111;
  flex:0 0 17px !important;
  font-size:13px;
  line-height:1;
  overflow:hidden;
}

.hk-d1-intro__spec-icon svg,
.hk-d1-intro__spec-symbol svg{
  display:block !important;
  width:17px !important;
  height:17px !important;
  min-width:17px !important;
  max-width:17px !important;
  min-height:17px !important;
  max-height:17px !important;
  fill:none;
  stroke:currentColor;
  stroke-width:1.85;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* 본문/접힘 구조 */
/* 웹: 가로줄 없음 */
.hk-d1-intro__body{
  position:relative;
  border-bottom:0 !important;
  padding-bottom:0 !important;
  margin-bottom:14px !important;
}

.hk-d1-intro__summary{
  position:relative;
}

.hk-d1-intro__summary p{
  margin:0 0 16px;
}

.hk-d1-intro__toggle-check{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.hk-d1-intro__more{
  max-height:0;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  transition:max-height .32s ease, opacity .22s ease, visibility 0s linear .32s;
}

.hk-d1-intro__toggle-check:checked ~ .hk-d1-intro__more{
  max-height:900px;
  opacity:1;
  visibility:visible;
  transition:max-height .32s ease, opacity .22s ease, visibility 0s linear 0s;
}

.hk-d1-intro__toggle{
  position:static !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  width:auto;
  min-width:34px;
  min-height:24px;
  height:auto;
  margin:4px auto 0 !important;
  padding:0;
  border:0;
  background:transparent;
  color:#111;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}

.hk-d1-intro__toggle-icon{
  display:block;
  width:10px;
  height:10px;
  border:solid currentColor;
  border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg);
  transition:transform .18s ease;
}
.hk-d1-intro__toggle-text{
  display:block;
  color:#777;
  font-size:11px;
  font-weight:400;
  line-height:1;
  letter-spacing:-0.03em;
  white-space:nowrap;
}
.hk-d1-intro__toggle-check:checked ~ .hk-d1-intro__toggle .hk-d1-intro__toggle-icon{
  transform:rotate(-135deg);
}
.hk-d1-intro__toggle-check:checked ~ .hk-d1-intro__toggle .hk-d1-intro__toggle-text{
  display:none;
}

/* 예전 텍스트 방식이 남아 있어도 정상 표시 */
.hk-d1-intro__toggle-less{
  display:none;
}

.hk-d1-intro__toggle-check:checked ~ .hk-d1-intro__toggle .hk-d1-intro__toggle-more{
  display:none;
}

.hk-d1-intro__toggle-check:checked ~ .hk-d1-intro__toggle .hk-d1-intro__toggle-less{
  display:inline;
}

.hk-d1-intro__subhead{
  margin:10px 0 12px;
  color:#111;
  font-size:18px;
  font-weight:700;
  line-height:1.35;
}

.hk-d1-intro__download-wrap{
  margin:18px 0 0;
}

.hk-d1-intro__download{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:150px;
  height:42px;
  padding:0 18px;
  border:1px solid #d2d0cb;
  border-radius:8px;
  background:#f7f7f5;
  color:#222;
  font-size:14px;
  font-weight:500;
  line-height:1;
  letter-spacing:-0.02em;
  text-decoration:none;
  cursor:pointer;
  box-sizing:border-box;
  -webkit-tap-highlight-color:transparent;
}

.hk-d1-intro__download:hover,
.hk-d1-intro__download:focus,
.hk-d1-intro__download:active{
  border-color:#d2d0cb;
  background:#f7f7f5;
  color:#222;
  outline:none;
  box-shadow:none;
  text-decoration:none;
}

.hk-d1-intro__download--disabled{
  color:#777;
  cursor:not-allowed;
}


/* 접힌 상태 문장 분기
   웹: 두 번째 문단(광고/룩북/프로필...까지) 노출
   모바일: 첫 문장만 노출
*/
.hk-d1-intro__summary-mobile{
  display:none;
}

.hk-d1-intro__summary-desktop{
  display:block;
}

.hk-d1-intro__more-mobile{
  display:none;
}

.hk-d1-intro__more-desktop{
  display:block;
}

@media(max-width:760px){

  .hk-d1-intro__summary-mobile{
    display:block;
  }

  .hk-d1-intro__summary-desktop{
    display:none;
  }

  .hk-d1-intro__more-mobile{
    display:block;
  }

  .hk-d1-intro__more-desktop{
    display:none;
  }

  .hk-d1-intro__specs{
    gap:12px 15px;
    margin-bottom:20px;
  }

  .hk-d1-intro__spec{
    font-size:12px;
  }

  .hk-d1-intro__spec-icon,
  .hk-d1-intro__spec-symbol,
  .hk-d1-intro__spec-icon svg,
  .hk-d1-intro__spec-symbol svg{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
    max-width:16px !important;
    min-height:16px !important;
    max-height:16px !important;
    flex-basis:16px !important;
  }

  /* 모바일: 예약창 위로 이동하므로 여기서만 D1 하단 가로줄 표시 */
  .hk-d1-intro__body{
    border-bottom:1px solid #dedbd4 !important;
    padding-bottom:28px !important;
    margin-bottom:12px !important;
  }

  .hk-d1-intro__toggle{
  width:auto;
  min-width:32px;
  min-height:23px;
  height:auto;
  gap:12px;
}

.hk-d1-intro__toggle-text{
  font-size:10px;
}

  .hk-d1-intro__toggle-icon{
    width:9px;
    height:9px;
  }

  .hk-d1-intro__subhead{
    font-size:17px;
  }

  .hk-d1-intro__download{
    width:150px;
    height:42px;
    font-size:14px;
  }
}