@charset "UTF-8";
/* ==========================================================================
  パンツ比較チャート
========================================================================== */
.pantsChartPage {
  padding-bottom: 120px;
}
.pantsChartPage label, .pantsChartPage button {
  cursor: pointer;
  outline: none;
}
.pantsChartPage label:hover, .pantsChartPage button:hover {
  opacity: 0.8;
  transition: all 0.2s ease-in-out;
}
.pantsChartPage .topText {
  margin-top: 50px;
  text-align: center;
}
.pantsChartPage .searchListMainBox {
  width: min(100% - 40px, 1100px);
  margin: 64px auto 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0 77px;
  container-type: inline-size;
}
.pantsChartPage .searcListUL {
  display: flex;
  align-items: center;
  gap: 18px;
}
.pantsChartPage .searcListUL > li {
  width: 17.2727272727cqw;
  height: 45px;
  position: relative;
}
.pantsChartPage .searcListUL > li .dialogOpenBtn {
  border-radius: 3px;
  border: 1px solid var(--color);
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.4rem;
  padding: 0 14px;
  position: relative;
  z-index: 1000;
  transition: all 0.2s;
}
@media (max-width: 850px) {
  .pantsChartPage .searcListUL > li .dialogOpenBtn {
    padding: 0;
  }
}
.pantsChartPage .searcListUL > li .dialogOpenBtn::before {
  content: "";
  width: 11px;
  flex-shrink: 0;
}
.pantsChartPage .searcListUL > li .dialogOpenBtn::after {
  content: "";
  width: 24px;
  height: 24px;
  background: url("../../img/common/arrow-bottom-next.svg") no-repeat center center/contain;
  flex-shrink: 0;
}
.pantsChartPage .searcListUL > li:has(input[type=number]):has(input:not(:-moz-placeholder-shown)) .dialogOpenBtn {
  background: #FFE3E3;
  border-color: #C91C21;
}
.pantsChartPage .searcListUL > li:has(input[type=number]):has(input:not(:placeholder-shown)) .dialogOpenBtn {
  background: #FFE3E3;
  border-color: #C91C21;
}
.pantsChartPage .searcListUL > li:has(input:checked) .dialogOpenBtn {
  background: #FFE3E3;
  border-color: #C91C21;
}
.pantsChartPage .itemsList::before {
  content: "";
  background: url("../../img/pants-chart/search_icon.svg") no-repeat center center/contain;
  width: 26px;
  height: 20px;
  flex-shrink: 0;
}
.pantsChartPage .sortList::before {
  content: "";
  background: url("../../img/pants-chart/sort_icon.svg") no-repeat center center/contain;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}
.pantsChartPage .searchListDialog {
  position: absolute;
  top: 61px;
  left: 50%;
  translate: -50% 0;
  background: #fff;
  border: 1px solid var(--color);
  border-radius: 5px;
  outline: none;
  opacity: 0;
  padding: 0;
  transition: opacity 0.4s ease;
  z-index: 1003;
}
.pantsChartPage .searchListDialog > ul {
  padding: 20px 30px;
  display: flex;
  flex-flow: column;
}
.pantsChartPage .searchListDialog li {
  font-size: 1.4rem;
  line-height: 2.3;
  display: inline-flex;
  align-items: center;
  gap: 0 10px;
}
.pantsChartPage .searchListDialog li input {
  margin: 0;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
.pantsChartPage .genderDialog {
  min-width: 100%;
}
.pantsChartPage .brandsDialog {
  min-width: 354px;
}
.pantsChartPage .priceDialog {
  min-width: 324px;
}
.pantsChartPage .priceDialog figure {
  padding: 20px 30px;
}
.pantsChartPage .priceDialog figcaption {
  font-size: 1.2rem;
  line-height: 2.3;
  margin-bottom: 10px;
}
.pantsChartPage .priceDialog .row {
  display: flex;
  align-items: center;
}
.pantsChartPage .priceDialog .row input {
  width: 100px;
  height: 38px;
  line-height: 38px;
  font-size: 1.4rem;
  text-align: center;
  border: 1px solid var(--color);
  border-radius: 4px;
  margin-right: 8px;
}
.pantsChartPage .priceDialog .row span {
  font-size: 1.4rem;
}
.pantsChartPage .priceDialog .row .kara {
  padding-right: 20px;
}
.pantsChartPage .sortDialog {
  min-width: 100%;
}
.pantsChartPage .customBackdrop {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
  opacity: 0;
  pointer-events: none;
  z-index: 999;
  transition: opacity 0.4s ease;
}
.pantsChartPage .customBackdrop.show {
  display: block;
  opacity: 1;
  pointer-events: auto;
}
.pantsChartPage .dialogShow {
  opacity: 1;
}
.pantsChartPage .dialogHide {
  opacity: 0;
}
.pantsChartPage .pantsChartTable {
  margin-top: 34px;
}
.pantsChartPage .searchListSide {
  width: 260px;
  border: 1px solid #E5E5E5;
  background: #fff;
}
.pantsChartPage .searchListSide .title {
  height: 45px;
  background: #6D7694;
  color: #fff;
  display: grid;
  place-content: center;
  text-align: center;
}
.pantsChartPage .searchListSide .emptyImgBox {
  height: 200px;
}
.pantsChartPage .searchListSide .gender {
  height: 25px;
  background: #F0F0F0;
  display: grid;
  place-content: center;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.3;
}
.pantsChartPage .searchListSide .price {
  border-top: 1px solid #E5E5E5;
  height: 25px;
  background: #fff;
  display: grid;
  place-content: center;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.3;
}
.pantsChartPage .parentSearchItem {
  display: grid;
  grid-template-columns: 38px 1fr;
}
.pantsChartPage .parentSearchItem > h2 {
  background: #E5E5E5;
  grid-row: 1/5;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.5em;
  padding-top: 0.5em;
  writing-mode: vertical-lr;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pantsChartPage .parentSearchItem .childSearchItem {
  grid-column: 2;
  padding: 10px 15px;
  min-height: 80px;
  border-top: 1px solid #E5E5E5;
  display: flex;
  flex-flow: column;
  justify-content: center;
}
.pantsChartPage .parentSearchItem .childSearchItem > h2 {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.03em;
  margin-bottom: 5px;
  pointer-events: none;
}
.pantsChartPage .parentSearchItem .childSearchSilhouette,
.pantsChartPage .parentSearchItem .childSearchWaist,
.pantsChartPage .parentSearchItem .childSearchPocket {
  min-height: 90px;
}
.pantsChartPage .parentSearchItem .pcDefaultShowDialog {
  width: 100%;
  display: block;
  opacity: 1;
  position: static;
  border: none;
  padding: 0;
  margin: 0;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList {
  display: flex;
  flex-flow: row wrap;
  gap: 8px;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList li {
  width: 20px;
  height: 20px;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList input[type=checkbox] {
  display: none;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList label {
  width: 100%;
  height: 100%;
  display: block;
  border: 1px solid transparent;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList .white {
  border-color: #E5E5E5;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList label:has(img) {
  border-color: #E5E5E5;
}
.pantsChartPage .parentSearchItem .colorListDialog .colorList input:checked + label {
  border-color: #F72626;
}
.pantsChartPage .parentSearchItem .subSearch {
  position: relative;
  width: 100%;
}
.pantsChartPage .parentSearchItem .subSearch .dialogOpenBtn {
  border-radius: 3px;
  border: 1px solid var(--color);
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.4rem;
  padding: 0 14px;
  height: 34px;
  position: relative;
  z-index: 1000;
  transition: all 0.2s;
}
.pantsChartPage .parentSearchItem .subSearch .dialogOpenBtn::before {
  content: "";
  width: 24px;
  flex-shrink: 0;
}
.pantsChartPage .parentSearchItem .subSearch .dialogOpenBtn::after {
  content: "";
  width: 24px;
  height: 24px;
  background: url("../../img/common/arrow-bottom-next.svg") no-repeat center center/contain;
  flex-shrink: 0;
}
.pantsChartPage .parentSearchItem .subSearch .checkboxList {
  padding: 20px 24px;
  font-size: 1.4rem;
  line-height: 2.3;
  display: flex;
  flex-flow: column;
}
.pantsChartPage .parentSearchItem .subSearch .checkboxList li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.pantsChartPage .parentSearchItem .subSearch .checkboxList input {
  margin: 0;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.pantsChartPage .parentSearchItem .subSearch:has(input:checked) .dialogOpenBtn {
  background: #FFE3E3;
  border-color: #C91C21;
}
.pantsChartPage .parentSearchItem .pcDefaultHideDialog {
  width: 100%;
  position: absolute;
  top: 42px;
  left: 0;
  background: #fff;
  border: 1px solid var(--color);
  border-radius: 5px;
  outline: none;
  opacity: 0;
  padding: 0;
  transition: opacity 0.4s ease;
  z-index: 1001;
}
.pantsChartPage .parentSearchItem .pcDefaultHideDialog.dialogShow {
  opacity: 1;
}
.pantsChartPage .parentSearchItem .pcDefaultHideDialog.dialogHide {
  opacity: 0;
}
.pantsChartPage .parentSearchItem .silhouetteList li {
  gap: 5px;
}
.pantsChartPage .parentSearchItem .silhouetteList label {
  display: flex;
  align-items: center;
  gap: 5px;
}
.pantsChartPage .parentSearchItem .btnBoxList {
  display: grid;
  gap: 8px;
}
.pantsChartPage .parentSearchItem .btnBoxList input {
  display: none;
}
.pantsChartPage .parentSearchItem .btnBoxList label {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #E5E5E5;
  border-radius: 5px;
  height: 32px;
  font-size: 1.4rem;
  text-align: center;
}
.pantsChartPage .parentSearchItem .btnBoxList input:checked + label {
  border-color: #C91C21;
  background: #FFE3E3;
}
.pantsChartPage .parentSearchItem .widthList {
  grid-template-columns: repeat(3, 1fr);
}
.pantsChartPage .parentSearchItem .liningList {
  grid-template-columns: repeat(2, 1fr);
}
.pantsChartPage .parentSearchItem .hemAlterationList {
  grid-template-columns: repeat(3, 1fr);
}
.pantsChartPage .parentSearchItem .stretchList {
  grid-template-columns: repeat(5, 1fr);
}
.pantsChartPage .parentSearchItem .moistureWickingList {
  grid-template-columns: repeat(5, 1fr);
}
.pantsChartPage .parentSearchItem .industrialWashList {
  grid-template-columns: repeat(2, 1fr);
}
.pantsChartPage .parentSearchItem .materialTitle {
  font-size: 1.4rem;
}
.pantsChartPage .parentSearchItem + .parentSearchItem h2 {
  border-top: 1px solid #fff;
}
.pantsChartPage .pantsChartTable {
  display: grid;
  grid-template-columns: minmax(20px, calc((100vw - min(1100px, 100vw - 40px)) / 2)) 1fr;
}
.pantsChartPage .pantsChartTable::before {
  content: "";
  grid-column: 1;
}
.pantsChartPage .pantsChartTable .tableMain {
  grid-column: 2;
  display: grid;
  grid-template-columns: 260px 1fr;
}
.pantsChartPage .searchListSide.isScrolling {
  margin-bottom: 3px;
}
@supports (-moz-appearance: none) {
  .pantsChartPage .searchListSide.isScrolling {
    margin-bottom: 0;
  }
}
.pantsChartPage .searchResult {
  display: grid;
  grid-template-columns: repeat(auto-fill, 186px);
  grid-auto-flow: column;
  overflow-x: auto;
  position: relative;
}
@media (hover: hover) {
  .pantsChartPage .searchResult::-webkit-scrollbar {
    height: 3px;
  }
  .pantsChartPage .searchResult::-webkit-scrollbar-thumb {
    background-color: #6D7694;
  }
}
.pantsChartPage .searchResultItem {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 15;
  width: 186px;
  border: 1px solid #E5E5E5;
  border-left: none;
  background: #fff;
}
.pantsChartPage .searchResultItem .title {
  height: 45px;
  background: #6D7694;
  color: #fff;
  display: grid;
  place-content: center;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.6;
  font-weight: 400;
}
.pantsChartPage .searchResultItem .imgBox {
  height: 200px;
  padding: 10px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pantsChartPage .searchResultItem .imgBox img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.pantsChartPage .searchResultItem .gender {
  height: 25px;
  background: #F0F0F0;
  display: grid;
  place-content: center;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.3;
}
.pantsChartPage .searchResultItem .gender.mens {
  color: #2551AF;
}
.pantsChartPage .searchResultItem .gender.ladies {
  color: #D25490;
}
.pantsChartPage .searchResultItem .gender.unisex {
  color: #45AB70;
}
.pantsChartPage .searchResultItem .price {
  border-top: 1px solid #E5E5E5;
  height: 25px;
  display: grid;
  place-content: center;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.3;
}
.pantsChartPage .searchResultItem .dataBox {
  min-height: 80px;
  padding: 10px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
}
.pantsChartPage .searchResultItem .dataBox + .dataBox {
  border-top: 1px solid #E5E5E5;
}
.pantsChartPage .searchResultItem .spacer + .dataBox {
  border-top: 1px solid #E5E5E5;
}
.pantsChartPage .searchResultItem .silhouette,
.pantsChartPage .searchResultItem .waist,
.pantsChartPage .searchResultItem .pocket {
  min-height: 90px;
}
.pantsChartPage .searchResultItem .colorListUl {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-content: center;
  gap: 8px;
}
.pantsChartPage .searchResultItem .colorListUl li {
  width: 20px;
  height: 20px;
  border: 1px solid transparent;
}
.pantsChartPage .searchResultItem .colorListUl .white {
  border-color: #E5E5E5;
}
.pantsChartPage .searchResultItem .colorListUl li:has(img) {
  border-color: #E5E5E5;
}
.pantsChartPage .searchResultLoading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.05);
  animation: loading-pulse 1.5s ease-in-out infinite;
}
.pantsChartPage .searchResultLoading::before {
  position: absolute;
  top: 100px;
  left: 50%;
  translate: -50% -50%;
  width: 40px;
  height: 40px;
  content: "";
  animation: loader 0.8s infinite linear;
  border: 6px solid #000;
  border-top-color: #ddd;
  border-radius: 50%;
}
.pantsChartPage .searchResultText {
  position: absolute;
  top: 50px;
  left: 0;
  width: 100%;
  height: 100%;
}
.pantsChartPage .searchResultText p {
  animation: fadeIn 0.6s 1 0s ease forwards;
  text-align: center;
}

@keyframes loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes loading-pulse {
  0%, 100% {
    background-color: rgba(0, 0, 0, 0.02);
  }
  50% {
    background-color: rgba(0, 0, 0, 0.08);
  }
}
@media only screen and (max-width: 767px) {
  /* ==========================================================================
    パンツ比較チャート
  ========================================================================== */
  .pantsChartPage {
    padding-bottom: 21.5384615385vw;
  }
  .pantsChartPage label:hover, .pantsChartPage button:hover {
    opacity: 1;
    transition: none;
  }
  .pantsChartPage .topText {
    margin: 7.9487179487vw auto 0;
    text-align: justify;
    max-width: 82.0512820513vw;
  }
  .pantsChartPage .searchListMainBox {
    width: 88.7179487179vw;
    margin: 7.9487179487vw auto 0;
    grid-template-columns: 100%;
    gap: 2.8205128205vw 0;
  }
  .pantsChartPage .searcListUL {
    gap: 2.5641025641vw;
  }
  .pantsChartPage .searcListUL > li {
    height: 9.2307692308vw;
    width: 25.641025641vw;
  }
  .pantsChartPage .searcListUL > li .dialogOpenBtn {
    border: 0.2564102564vw solid var(--color);
    border-radius: 0.7692307692vw;
    font-size: 1.2rem;
    padding: 0 1.2820512821vw;
  }
  .pantsChartPage .searcListUL > li .dialogOpenBtn::before {
    width: 1.2820512821vw;
  }
  .pantsChartPage .searcListUL > li .dialogOpenBtn::after {
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
  .pantsChartPage .itemsList::before {
    width: 4.358974359vw;
    height: 3.3333333333vw;
  }
  .pantsChartPage .sortList::before {
    width: 4.358974359vw;
    height: 4.358974359vw;
  }
  .pantsChartPage .searchListDialog {
    top: 10.7692307692vw;
    left: 0;
    translate: 0;
    border: 0.2564102564vw solid var(--color);
    border-radius: 0.7692307692vw;
  }
  .pantsChartPage .searchListDialog > ul {
    padding: 3.0769230769vw 5.1282051282vw;
  }
  .pantsChartPage .searchListDialog li {
    font-size: 1.2rem;
    gap: 0 2.0512820513vw;
  }
  .pantsChartPage .searchListDialog li input {
    width: 4.6153846154vw;
    height: 4.6153846154vw;
  }
  .pantsChartPage .genderDialog {
    min-width: 33.3333333333vw;
    z-index: 1001;
  }
  .pantsChartPage .brandsDialog {
    min-width: 74.8717948718vw;
    z-index: 1001;
    left: -28.2051282051vw;
  }
  .pantsChartPage .priceDialog {
    min-width: 85.641025641vw;
    z-index: 1001;
    left: auto;
    right: 0;
  }
  .pantsChartPage .priceDialog figure {
    padding: 3.0769230769vw 5.1282051282vw;
  }
  .pantsChartPage .priceDialog figcaption {
    margin-bottom: 0.5128205128vw;
  }
  .pantsChartPage .priceDialog .row {
    display: flex;
    align-items: center;
  }
  .pantsChartPage .priceDialog .row input {
    width: 25.641025641vw;
    height: 9.7435897436vw;
    line-height: 9.7435897436vw;
    font-size: 16px;
    text-align: center;
    border: 0.2564102564vw solid var(--color);
    border-radius: 1.0256410256vw;
    margin-right: 2.0512820513vw;
  }
  .pantsChartPage .priceDialog .row span {
    font-size: 1.2rem;
  }
  .pantsChartPage .priceDialog .row .kara {
    padding: 0 2.5641025641vw;
  }
  .pantsChartPage .sortDialog {
    min-width: 36.9230769231vw;
    z-index: 1001;
  }
  .pantsChartPage .dialogShow {
    opacity: 1;
  }
  .pantsChartPage .dialogHide {
    opacity: 0;
  }
  .pantsChartPage .customBackdrop {
    transition: opacity 0.4s ease;
  }
  .pantsChartPage .pantsChartTable:has(dialog[open]) + .customBackdrop {
    display: none;
  }
  .pantsChartPage .searchListSubDialog::backdrop {
    background-color: rgba(0, 0, 0, 0.2);
    opacity: 0;
    transition: opacity 0.6s ease;
  }
  .pantsChartPage .searchListSubDialog.dialogShow::backdrop {
    opacity: 1;
  }
  .pantsChartPage .searchListSubDialog.dialogHide::backdrop {
    opacity: 0;
  }
  .pantsChartPage .searchListSide {
    width: 26.1538461538vw;
    border: 0.2564102564vw solid #E5E5E5;
  }
  .pantsChartPage .searchListSide .childSearchItem:has(input:checked) {
    position: relative;
  }
  .pantsChartPage .searchListSide .childSearchItem:has(input:checked)::before {
    content: "";
    width: calc(100% + 0.5128205128vw);
    height: calc(100% + 0.5128205128vw);
    background: #FFE3E3;
    border: 0.2564102564vw solid #C91C21;
    position: absolute;
    top: -0.2564102564vw;
    left: -0.2564102564vw;
    z-index: 1;
  }
  .pantsChartPage .searchListSide .title {
    height: 7.1794871795vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .searchListSide .emptyImgBox {
    height: 38.4615384615vw;
  }
  .pantsChartPage .searchListSide .gender {
    height: 6.4102564103vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .searchListSide .price {
    border-top: 0.2564102564vw solid #E5E5E5;
    height: 6.9230769231vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .parentSearchItem {
    display: grid;
    grid-template-columns: 100%;
  }
  .pantsChartPage .parentSearchItem > h2 {
    background: #E5E5E5;
    grid-row: 1;
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 0.03em;
    padding: 0;
    writing-mode: horizontal-tb;
    height: 6.4102564103vw;
  }
  .pantsChartPage .parentSearchItem .childSearchItem {
    grid-column: 1;
    padding: 0;
    border-top: 0.2564102564vw solid #E5E5E5;
    min-height: 10.7692307692vw;
  }
  .pantsChartPage .parentSearchItem .childSearchItem > h2 {
    font-size: 1.2rem;
    margin-bottom: 0;
    pointer-events: all;
    position: relative;
    z-index: 2;
    height: 100%;
  }
  .pantsChartPage .parentSearchItem .childSearchItem > h2 button {
    width: 100%;
    height: 100%;
    padding: 2.5641025641vw 2.5641025641vw 2.5641025641vw 2.0512820513vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .pantsChartPage .parentSearchItem .childSearchItem > h2 button::after {
    content: "";
    background: url("../../img/pants-chart/search_icon.svg") no-repeat center center/contain;
    width: 3.5897435897vw;
    height: 2.8205128205vw;
    flex-shrink: 0;
  }
  .pantsChartPage .parentSearchItem .pcDefaultShowDialog {
    display: inherit;
    opacity: 0;
    position: fixed;
    border: none;
    padding: 0;
    margin: auto;
    transition: opacity 0.4s ease;
  }
  .pantsChartPage .parentSearchItem .pcDefaultShowDialog.dialogShow {
    opacity: 1;
  }
  .pantsChartPage .parentSearchItem .pcDefaultShowDialog.dialogHide {
    opacity: 0;
  }
  .pantsChartPage .parentSearchItem .searchListSubDialog h2 {
    font-size: 1.4rem;
    line-height: 1.6;
    font-weight: 400;
    letter-spacing: 0.03em;
    margin: 2.5641025641vw 0 2.5641025641vw 3.8461538462vw;
  }
  .pantsChartPage .parentSearchItem .searchListSubDialog .dialogCloseBtn {
    position: absolute;
    top: 2.5641025641vw;
    right: 3.8461538462vw;
    width: 6.1538461538vw;
  }
  .pantsChartPage .parentSearchItem .colorListDialog {
    width: 76.9230769231vw;
  }
  .pantsChartPage .parentSearchItem .colorListDialog .colorList {
    padding: 0 3.8461538462vw 3.8461538462vw;
    gap: 3.5897435897vw;
  }
  .pantsChartPage .parentSearchItem .colorListDialog .colorList li {
    width: 6.6666666667vw;
    height: 6.6666666667vw;
  }
  .pantsChartPage .parentSearchItem .colorListDialog .colorList label {
    border: 0.2564102564vw solid transparent;
  }
  .pantsChartPage .parentSearchItem .subSearch .dialogOpenBtn {
    display: none;
  }
  .pantsChartPage .parentSearchItem .subSearch .checkboxList {
    padding: 0 3.8461538462vw 3.8461538462vw 3.8461538462vw;
    font-size: 1.4rem;
    line-height: 2.3;
  }
  .pantsChartPage .parentSearchItem .subSearch .checkboxList li {
    gap: 1.5384615385vw;
  }
  .pantsChartPage .parentSearchItem .subSearch .checkboxList input {
    width: 4.6153846154vw;
    height: 4.6153846154vw;
  }
  .pantsChartPage .parentSearchItem .pcDefaultHideDialog {
    width: 51.2820512821vw;
    position: fixed;
    top: 0;
    left: 0;
    border: 0.2564102564vw solid #D5D5CE;
    border-radius: 0.5128205128vw;
  }
  .pantsChartPage .parentSearchItem .silhouetteList li {
    gap: 1.5384615385vw;
  }
  .pantsChartPage .parentSearchItem .silhouetteList label {
    display: flex;
    align-items: center;
    gap: 1.5384615385vw;
  }
  .pantsChartPage .parentSearchItem .silhouetteList img {
    width: 5.1282051282vw;
  }
  .pantsChartPage .parentSearchItem .btnBoxList {
    gap: 2.0512820513vw;
    padding: 0 3.8461538462vw 3.8461538462vw;
  }
  .pantsChartPage .parentSearchItem .btnBoxList label {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0.2564102564vw solid #E5E5E5;
    border-radius: 1.2820512821vw;
    height: 8.2051282051vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .parentSearchItem .widthListDialog {
    width: 69.2307692308vw;
  }
  .pantsChartPage .parentSearchItem .widthList {
    grid-template-columns: repeat(3, 1fr);
  }
  .pantsChartPage .parentSearchItem .liningListDialog {
    width: 56.4102564103vw;
  }
  .pantsChartPage .parentSearchItem .hemAlterationListDialog {
    width: 69.2307692308vw;
  }
  .pantsChartPage .parentSearchItem .stretchListDialog {
    width: 69.2307692308vw;
  }
  .pantsChartPage .parentSearchItem .moistureWickingListDialog {
    width: 69.2307692308vw;
  }
  .pantsChartPage .parentSearchItem .industrialWashListDialog {
    width: 56.4102564103vw;
  }
  .pantsChartPage .parentSearchItem .materialTitle {
    font-size: 1.2rem;
    padding: 2.5641025641vw 2.5641025641vw 2.5641025641vw 2.0512820513vw;
  }
  .pantsChartPage .parentSearchItem + .parentSearchItem h2 {
    border-top: none;
  }
  .pantsChartPage .parentSearchItem + .parentSearchItem .childSearchItem:nth-of-type(1):not(.materialTitle) {
    border-top: 0.2564102564vw solid #E5E5E5;
  }
  .pantsChartPage .pantsChartTable {
    grid-template-columns: 4.6153846154vw 1fr;
  }
  .pantsChartPage .pantsChartTable .tableMain {
    grid-template-columns: 26.1538461538vw 1fr;
  }
  .pantsChartPage .searchListSide.isScrolling {
    margin-bottom: 0;
  }
  .pantsChartPage .searchResult {
    display: grid;
    grid-template-columns: repeat(auto-fill, 35.8974358974vw);
  }
  .pantsChartPage .searchResultItem {
    width: 35.8974358974vw;
    border: 0.2564102564vw solid #E5E5E5;
    border-left: none;
    grid-row: span 18;
  }
  .pantsChartPage .searchResultItem .title {
    height: 7.1794871795vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .searchResultItem .imgBox {
    height: 38.4615384615vw;
    padding: 0 2.5641025641vw;
  }
  .pantsChartPage .searchResultItem .imgBox img {
    width: 33.3333333333vw;
    height: 33.3333333333vw;
  }
  .pantsChartPage .searchResultItem .gender {
    height: 6.4102564103vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .searchResultItem .price {
    border-top: 0.2564102564vw solid #E5E5E5;
    height: 6.9230769231vw;
  }
  .pantsChartPage .searchResultItem .dataBox {
    min-height: 10.7692307692vw;
    padding: 1.2820512821vw 2.5641025641vw;
    font-size: 1.2rem;
  }
  .pantsChartPage .searchResultItem .dataBox + .dataBox {
    border-top: 0.2564102564vw solid #E5E5E5;
  }
  .pantsChartPage .searchResultItem .spacer + .dataBox {
    border-top: 0.2564102564vw solid #E5E5E5;
  }
  .pantsChartPage .searchResultItem .silhouette,
  .pantsChartPage .searchResultItem .waist,
  .pantsChartPage .searchResultItem .pocket {
    min-height: 10.7692307692vw;
  }
  .pantsChartPage .searchResultItem .colorListUl {
    gap: 1.2820512821vw;
  }
  .pantsChartPage .searchResultItem .colorListUl li {
    width: 3.8461538462vw;
    height: 3.8461538462vw;
    border: 0.2564102564vw solid transparent;
  }
  .pantsChartPage .searchResultItem .spacer {
    height: 6.4102564103vw;
    background: #E5E5E5;
    display: block;
  }
  .pantsChartPage .searchResultLoading::before {
    top: 25.641025641vw;
    width: 10.2564102564vw;
    height: 10.2564102564vw;
    border: 1.5384615385vw solid #000;
    border-top-color: #ddd;
    animation: loader 0.8s infinite linear;
  }
  .pantsChartPage .searchResultText {
    position: absolute;
    top: 12.8205128205vw;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .pantsChartPage .searchResultText p {
    animation: fadeIn 0.6s 1 0s ease forwards;
    text-align: center;
    font-size: 1.4rem;
    padding: 0 1em;
  }
}/*# sourceMappingURL=../map/pants-chart/style.css.map */