/* Original NEWS skin: keep the heading and article list in two desktop columns.
 * Only the requested label sizing and article spacing change. */
.sec-news .sec-news-wrapper {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 4rem;
  align-items: start;
}
.sec-news .sec-news-title { grid-column: 1; grid-row: 1; }
.sec-news .sec-news-title h2 > span:first-child { white-space: nowrap; }
.sec-news .news-lists { grid-column: 2; grid-row: 1; min-width: 0; }
.sec-news .news-lists li { align-items: flex-start; column-gap: 2rem; }
.sec-news .news-lists li:not(:last-child) { margin-bottom: 2rem; }
.sec-news .news-lists li > a { flex: 0 0 26%; min-width: 0; }
.sec-news .news-lists li img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.sec-news .news-item-data { flex: 1 1 0; min-width: 0; }
.sec-news .news-item-title { width: auto; overflow-wrap: anywhere; }
.sec-news .news-lists li .comment {
  flex: 0 0 auto;
  min-width: 0;
  align-items: flex-start;
  row-gap: .8rem;
}
.sec-news .news-lists li .comment .ctg,
.sec-news .news-lists li .comment .tag {
  display: inline-block;
  padding: .65rem 1rem;
  font-size: 12px;
  line-height: 1.5;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}
/* Show the complete thumbnail inside the existing desktop/mobile archive frame. */
#newsPage .news-wrapper .news-img { object-fit: contain; }
/* Keep all lettering inside the unchanged thumbnail frame, including while hovered. */
#newsPage .news-wrapper .news-data-permalink:hover .news-img { transform: none; }
/* Fixed gallery frames retain their original dimensions without stretching. */
#goodFlat .sec-good-gallery .swiper-slide img { object-fit: cover; }
@media screen and (max-width: 768px) {
  .sec-news .sec-news-wrapper { display: flex; flex-direction: column; row-gap: 4rem; }
  .sec-news .news-lists { width: 100%; }
  .sec-news .news-lists li { max-width: 100%; align-items: stretch; }
  .sec-news .news-lists li > a { flex: none; width: 100%; }
  .sec-news .news-item-data { flex: none; }
  .sec-news .news-lists li .comment { flex: none; flex-wrap: wrap; }
}

/* Preserve the original selected-item color when adding keyboard-operable links. */
a.anew-original-link { color: inherit; }
#servicePageDetail .section-group > section { scroll-margin-top: 120px; }

/* EC only: keep the original two-column chapters without allowing the brand
 * content to squeeze its heading down to a few characters per line. */
#servicePageDetail:has(#sec-ec-features) .sec-sub-service-02 .sub-service-wrapper > .anew-legacy-h4 {
  flex-shrink: 0;
}
#servicePageDetail:has(#sec-ec-features) .sec-sub-service-02 .sub-service-wrapper > div {
  width: 60%;
  min-width: 0;
}
/* Make wrapped menu labels clickable between their lines, too. */
#servicePageDetail:has(#sec-ec-features) .sticky-navi a.anew-original-link { display: block; }
/* Follow the EC chapters only; stop before the full-width FAQ and contact.
 * Preserve the original viewport-based width and the 22rem/15rem gutter offset. */
body:has(#servicePageDetail #sec-ec-features) { overflow-x: clip; }
#servicePageDetail:has(#sec-ec-features) .sticky-navi {
  position: sticky;
  align-self: flex-start;
  right: auto;
  width: 16vw;
  flex-shrink: 0;
  margin-right: -7rem;
}
/* FAQ questions must not inherit the page hero's h3 size. */
#servicePageDetail:has(#sec-ec-features) .sec-faq .anew-faq-title { font-size: 1.8rem; }
/* The parent accidentally nests its 1080px rule inside a 768px media query. */
@media screen and (max-width: 1080px) {
  #servicePageDetail:has(#sec-ec-features) .sticky-navi { display: none; }
  #servicePageDetail:has(#sec-ec-features) .section-group { width: 100%; }
}
@media screen and (max-width: 768px) {
  #servicePageDetail:has(#sec-ec-features) .sec-sub-service-02 .sub-service-wrapper > div { width: 100%; }
  #servicePageDetail:has(#sec-ec-features) .sec-faq .anew-faq-title { font-size: 1.4rem; }
}
/* Brand descriptions: allow long shop URLs to wrap inside their existing text frame. */
#brand .brand-item-content a { overflow-wrap: anywhere; }

/* FAQ only: page hero h3 rules must not enlarge questions or their buttons.
 * Keep the list width, section heading, copy and existing accordion behavior. */
body .sec-faq .anew-faq-title,
body .sec-faq .anew-faq-toggle {
  font-size: 16px !important;
  line-height: 1.65 !important;
}
body .sec-faq .anew-faq-title { margin: 0; font-weight: 500; }
body .sec-faq .anew-faq-toggle {
  min-height: 44px;
  padding: 12px 16px;
  align-items: flex-start;
  gap: 12px;
}
body .sec-faq .anew-faq-toggle > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}
body .sec-faq .anew-faq-toggle > .icon {
  flex: 0 0 20px;
  font-size: 20px;
  line-height: 1.32;
  text-align: center;
}
body .sec-faq .faq-answer { padding: 12px 16px; }
body .sec-faq .faq-answer p {
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  overflow-wrap: anywhere;
}
@media (max-width: 768px) {
  body .sec-faq .anew-faq-title,
  body .sec-faq .anew-faq-toggle { font-size: 15px !important; }
  body .sec-faq .anew-faq-toggle,
  body .sec-faq .faq-answer { padding: 11px 12px; }
  body .sec-faq .faq-answer p { font-size: 14px !important; }
}
