/* Humanoid product cards - scoped Proterial JP-style port.
   Load AFTER the Korean site's main stylesheet. */
#humanoid-products .card-wrap {
  display:flex !important;
  flex-flow:row wrap !important;
  width:100%;
  margin:24px 0 0;
  padding:0;
  gap:20px 36px;
  box-sizing:border-box;
  container-type:inline-size;
  container-name:humanoid-cards;
}
#humanoid-products .card-wrap, #humanoid-products .card-wrap * {box-sizing:border-box;}
#humanoid-products .card-wrap > .card {
  display:flex !important;
  flex:0 0 calc((100% - 36px)/2);
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  outline:0;
  box-shadow:none !important;
  background:transparent !important;
  list-style:none;
}
#humanoid-products .card-wrap > .card > .card__type {
  display:flex !important;
  flex-flow:row nowrap !important;
  align-items:flex-start;
  width:100%;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  text-align:left;
  text-decoration:none !important;
  color:#333;
}
#humanoid-products .card__head {
  display:block !important;
  flex:0 0 46.34%;
  width:46.34% !important;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
#humanoid-products .card__image {display:block;overflow:hidden;margin:0;padding:0;border:0 !important;}
#humanoid-products .card__image img {
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100%;
  margin:0;
  padding:0;
  border:0 !important;
  box-shadow:none !important;
  transition:transform .25s ease;
}
#humanoid-products .card__body {
  display:block !important;
  flex:1 1 0;
  min-width:0;
  width:auto !important;
  margin:0 0 0 1.4em !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
#humanoid-products .card__title {
  display:block;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  color:#222 !important;
  font-size:16px;
  font-weight:700;
  line-height:1.4;
  overflow-wrap:anywhere;
}
/* Product names and images are informational only, not links. */
#humanoid-products .card__title::after { content:none !important; display:none !important; }
#humanoid-products .card__image img { transition:none !important; transform:none !important; }
#humanoid-products .card__type { cursor:default !important; }
#humanoid-products .util-sup {font-size:.65em;vertical-align:super;line-height:0;}
/* Independent of viewport size, keep two columns until each card has enough room. */
@media (max-width:767px) {
  #humanoid-products .card-wrap {gap:24px;margin-top:18px;}
  #humanoid-products .card-wrap > .card {flex-basis:100%;}
  #humanoid-products .card-wrap > .card > .card__type {display:block !important;}
  #humanoid-products .card__head {width:100% !important;max-width:360px;}
  #humanoid-products .card__body {margin:10px 0 0 !important;}
  #humanoid-products .card__title {font-size:15px;}
}
/* Prevent crowding inside narrow CMS columns even on desktop-sized windows. */
@container humanoid-cards (max-width:720px) {
  #humanoid-products .card-wrap > .card {flex-basis:100%;}
}
