.simulation.colorPattern {
  height: 79vh;
}

.colorPattern {
  position: relative;
  width: 100%;
}

.colorPattern .simulation__option--group-inner .choice-color {
  display: block;
  width: 308px;
}

.colorPattern .simulation__option--group-inner .choice-color__frame {
  display: block;
  height: 48px;
  width: 100%;
}

.colorPattern .simulation__option--group-inner .choice-color__frame .image {
  display: block;
  width: 100%;
}

.colorPattern .simulation__option--group-inner .choice-color .color {
  font-size: 12px;
}

.colorPattern .simulation__option--group-inner .choice-color:hover {
  color: #0056b3;
}

.colorPattern .simulation__option--buttons {
  flex-direction: column;
  gap: 3px 0;
  margin-top: 24px;
  width: 340px;
}

.colorPattern .simulation__option--buttons .btn-second {
  font-weight: 400;
  margin-bottom: 0;
  min-height: 48px;
}

.colorPattern .simulation__option--buttons .text-box {
  display: block;
  margin-top: 12px;
}

.colorPattern .simulation__option--buttons .text-box .text {
  font-size: 12px;
  line-height: 2;
}

.simulation.colorPattern .l-sm {
  display: none !important;
}

@media only screen and (max-width: 1120px) {
  .colorPattern .simulation__option--group-inner .choice-color,
  .colorPattern .simulation__option--buttons {
    width: 100%;
  }
}

@media only screen and (max-width: 768px) {
  .simulation.colorPattern .l-sm {
    display: block !important;
  }

  .simulation.colorPattern {
    height: unset;
  }

  .site-main {
      padding-block: 0px 12px !important;
  }

  .colorPattern .simulation__image--body {
    height: unset;
  }
}