@media (max-width: 992px) {
  .layoutProduct_detail .container {
    padding-left: 10px;
    padding-right: 10px; } }

@media (max-width: 992px) {
  .layoutProduct_detail {
    overflow-x: hidden;
    padding-top: 20px; } }

.section-themes-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  padding: 0 0 50px 0;
  justify-content: space-between; }
  @media (max-width: 992px) {
    .section-themes-wrapper {
      padding-top: 15px; } }
  @media (max-width: 992px) {
    .section-themes-wrapper .theme-detail--images {
      margin-bottom: 20px; }
      .section-themes-wrapper .theme-detail--images .lazyload-image .lazyload-image__placeholder {
        padding-bottom: 135% !important; } }
  .section-themes-wrapper .section-themes-description {
    margin-top: 15px; }
    .section-themes-wrapper .section-themes-description .desc-detail .text-center {
      text-align: left !important; }
  .section-themes-wrapper .section-themes_left {
    flex: 0 0 calc(65% - 15px);
    max-width: calc(65% - 15px); }
    @media (max-width: 992px) {
      .section-themes-wrapper .section-themes_left {
        flex: 0 0 100%;
        max-width: 100%; } }
    @media (max-width: 992px) {
      .section-themes-wrapper .section-themes_left .theme-detail--images.screenshot-desktop {
        display: block; } }
  .section-themes-wrapper .section-themes_right {
    flex: 0 0 calc(35% - 15px);
    max-width: calc(35% - 15px); }
    @media (max-width: 992px) {
      .section-themes-wrapper .section-themes_right {
        flex: 0 0 100%;
        max-width: 100%; } }
    @media (min-width: 992px) {
      .section-themes-wrapper .section-themes_right .sticky-wrapper {
        position: sticky;
        top: 85px; } }
  .section-themes-wrapper .hrvcard {
    box-shadow: none;
    padding: 20px 20px;
    border-radius: 8px;
    background-color: #F5F7F9; }
    @media (max-width: 992px) {
      .section-themes-wrapper .hrvcard {
        padding: 24px 10px; } }

.theme-detail--price {
  padding-bottom: 15px;
  border-bottom: 1px solid var(--border-color); }

.theme-detail--heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--border-color) !important;
  margin-bottom: 20px; }
  .theme-detail--heading .theme-detail--price {
    margin: 0;
    padding: 0;
    border: none; }
  .theme-detail--heading .theme-detail--vendor {
    margin: 0;
    font-size: 13px;
    color: var(--heading-color); }

.list-tags-content {
  margin-top: 25px; }
  @media (max-width: 992px) {
    .list-tags-content {
      margin-top: 0px;
      border-radius: 8px;
      background-color: #F5F7F9;
      padding: 12px; } }
  .list-tags-content .tag-item + .tag-item {
    margin-top: 13px; }
  .list-tags-content .tag-item .title {
    display: inline-block;
    width: 140px;
    font-weight: 600;
    font-size: 14px; }
  .list-tags-content .tag-item .details {
    display: inline-block;
    color: #383838;
    font-size: 13px;
    font-weight: 400; }

.theme-detail--cta-inner {
  display: flex;
  gap: 15px;
  justify-content: space-between; }
  .theme-detail--cta-inner .theme-detail--ctas {
    flex: 1; }

@media (max-width: 992px) {
  .themes-action-desktop {
    display: none; } }

.themes-action-mobile {
  display: none; }
  @media (max-width: 992px) {
    .themes-action-mobile {
      display: block; } }

.themes-action .btn {
  width: 100%;
  border-radius: var(--border-lg); }
  @media (max-width: 767px) {
    .themes-action .btn {
      padding: 8px 14px;
      font-size: 15px; } }
  @media (max-width: 480px) {
    .themes-action .btn {
      font-size: 14px; } }

.themes-action .btn-mobile {
  display: none; }
  @media (max-width: 992px) {
    .themes-action .btn-mobile {
      display: block; } }

@media (max-width: 992px) {
  .themes-action .btn-desktop {
    display: none; } }

.themes-action .more-theme-btn {
  margin-top: 0px; }
  .themes-action .more-theme-btn button {
    padding-left: 5px;
    padding-right: 5px; }

.block-hrvcard_promotion {
  padding: 5px;
  background: white;
  margin-top: 20px;
  border-radius: 8px; }
  .block-hrvcard_promotion .hrvcard.hrvcard_promotion {
    padding-left: 10px;
    padding-right: 10px; }
  .block-hrvcard_promotion .promotion-details__action {
    margin-top: 10px; }

.hrvcard_promotion {
  background-color: #EAF7FF !important; }
  @media (max-width: 992px) {
    .hrvcard_promotion {
      margin-top: 0;
      padding-left: 10px !important;
      padding-right: 10px !important; } }
  .hrvcard_promotion .promotion-title {
    font-size: 18px; }
  .hrvcard_promotion .promotion-details {
    font-size: 15px; }
    .hrvcard_promotion .promotion-details p {
      margin-bottom: 10px; }
    .hrvcard_promotion .promotion-details del {
      color: #6f717b;
      font-size: 15px;
      display: inline-block;
      margin-right: 7px; }
    .hrvcard_promotion .promotion-details strong {
      text-align: right;
      font-size: 16px;
      color: red; }
    .hrvcard_promotion .promotion-details span {
      margin-left: 10px;
      display: inline-flex;
      padding: 3px 12px;
      line-height: 1.4;
      background-color: red;
      color: white;
      font-weight: 500;
      font-size: 12px;
      border-radius: 999px;
      align-items: center;
      justify-content: center; }
    .hrvcard_promotion .promotion-details .promotion-details-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 0; }
      @media (max-width: 1500px) {
        .hrvcard_promotion .promotion-details .promotion-details-inner {
          flex-wrap: wrap; } }
    .hrvcard_promotion .promotion-details .promotion-details__price {
      text-align: right;
      display: flex;
      align-items: center;
      justify-content: end; }
      .hrvcard_promotion .promotion-details .promotion-details__price strong {
        font-weight: 400; }
    @media (max-width: 1500px) {
      .hrvcard_promotion .promotion-details .promotion-details__action {
        width: 100%; } }
    .hrvcard_promotion .promotion-details .promotion-details__action .btn {
      max-width: max-content;
      margin-left: auto;
      margin-right: auto;
      border-radius: var(--border-lg); }
      @media (min-width: 992px) and (max-width: 1500px) {
        .hrvcard_promotion .promotion-details .promotion-details__action .btn {
          max-width: 100%;
          margin-top: 15px; } }

.section-themes-recommend {
  background-color: #f5f7f9;
  position: relative;
  z-index: 1; }
  @media (max-width: 992px) {
    .section-themes-recommend {
      background-color: unset;
      border-top: unset; } }
  .section-themes-recommend .product-recommend__title {
    margin-bottom: 0; }
    .section-themes-recommend .product-recommend__title.sitebox-heading h2 {
      font-size: 38px; }
      @media (max-width: 992px) {
        .section-themes-recommend .product-recommend__title.sitebox-heading h2 {
          font-size: 28px; } }
  .section-themes-recommend:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
    background-image: url(https://file.hstatic.net/1000012173/file/product-gradient.png);
    background-size: 100% 100%; }
    @media (max-width: 992px) {
      .section-themes-recommend:before {
        content: none; } }
  @media (max-width: 992px) {
    .section-themes-recommend .listTheme-row {
      margin-left: -6px;
      margin-right: -6px; }
      .section-themes-recommend .listTheme-row [class*='col-'] {
        padding-left: 0;
        padding-right: 0;
        flex: 0 0 100%;
        max-width: 100%; }
      .section-themes-recommend .listTheme-row.owl-carousel:not(.owl-loaded) {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow: hidden; }
      .section-themes-recommend .listTheme-row .hrvtheme-item__image {
        padding-top: 172%; }
    .section-themes-recommend .hrvtheme-item {
      margin-top: 12px;
      border: 1px solid #ececec; }
    .section-themes-recommend .product-recommend__title {
      margin-bottom: 5px; }
    .section-themes-recommend .container {
      padding-left: 6px;
      padding-right: 6px; } }

#serviceModal .modal-content, #serviceModal-1 .modal-content {
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.5); }

#serviceModal .modal-title, #serviceModal-1 .modal-title {
  font-size: 18px;
  font-weight: 600; }

#serviceModal .modal-header,
#serviceModal .modal-footer, #serviceModal-1 .modal-header,
#serviceModal-1 .modal-footer {
  border-top: none;
  border-bottom: none; }

#serviceModal .modal-footer, #serviceModal .modal-body, #serviceModal-1 .modal-footer, #serviceModal-1 .modal-body {
  padding-top: 0; }

#serviceModal .modal-body, #serviceModal-1 .modal-body {
  padding-bottom: 5px; }

#serviceModal .close, #serviceModal-1 .close {
  position: absolute;
  right: 8px;
  top: 7px;
  background-color: #4c8fff;
  opacity: 1;
  color: white;
  font-weight: 400;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  width: 30px;
  height: 30px; }
  #serviceModal .close span, #serviceModal-1 .close span {
    display: flex;
    align-items: center;
    justify-content: center; }
  #serviceModal .close svg, #serviceModal-1 .close svg {
    width: 12px;
    fill: white; }
  #serviceModal .close:hover, #serviceModal-1 .close:hover {
    background-color: rgba(76, 143, 255, 0.9);
    transition: .3s all; }

#serviceModal .modal-dialog, #serviceModal-1 .modal-dialog {
  margin: 0;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) !important; }
  @media (max-width: 580px) {
    #serviceModal .modal-dialog, #serviceModal-1 .modal-dialog {
      max-width: 90%; } }

#serviceModal .input-group, #serviceModal-1 .input-group {
  display: block; }
  #serviceModal .input-group label, #serviceModal-1 .input-group label {
    display: block;
    margin-bottom: 5px; }
    #serviceModal .input-group label span, #serviceModal-1 .input-group label span {
      color: red; }
  #serviceModal .input-group input, #serviceModal-1 .input-group input {
    width: 100%;
    min-height: 43px;
    border-radius: 6px;
    transition: .2s all; }
    #serviceModal .input-group input:focus, #serviceModal-1 .input-group input:focus {
      outline: none;
      border-color: rgba(41, 121, 255, 0.8);
      box-shadow: 0 0 2px rgba(41, 121, 255, 0.5); }
      #serviceModal .input-group input:focus::placeholder, #serviceModal-1 .input-group input:focus::placeholder {
        color: transparent; }

#serviceModal .btn, #serviceModal-1 .btn {
  min-width: 150px;
  font-size: 16px; }

@media (max-width: 992px) {
  .section-themes-details.has-guide .themes-action-mobile > .hrvcard {
    padding-top: 10px; }
  .section-themes-details.has-guide .theme-detail--images.screenshot-desktop {
    margin-bottom: 5px; } }

.theme-detail--notify-inner {
  padding: 5px 0px 0px 5px;
  border-radius: 6px;
  margin: 5px 0 0px; }
  .theme-detail--notify-inner p {
    margin-bottom: 0px;
    line-height: 1.4;
    margin-bottom: 3px; }
  .theme-detail--notify-inner .theme-detail--notify__title {
    font-weight: 500; }
  .theme-detail--notify-inner + .block-hrvcard_promotion {
    margin-top: 10px; }

/*modal*/
#serviceModal .listChoice-option .checkbox-primary, #serviceModal .listChoice-option .radio-primary, #serviceModal-1 .listChoice-option .checkbox-primary, #serviceModal-1 .listChoice-option .radio-primary, .block-hrvcard_promotion .listChoice-option .checkbox-primary, .block-hrvcard_promotion .listChoice-option .radio-primary {
  margin: 0px 0 0px;
  padding: 0;
  position: relative; }

#serviceModal .listChoice-option .radio-primary input[type='radio'] + label,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox'] + label, #serviceModal-1 .listChoice-option .radio-primary input[type='radio'] + label,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox'] + label, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio'] + label,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox'] + label {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  margin: 0; }

#serviceModal .listChoice-option .radio-primary input[type='radio'],
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox'], #serviceModal-1 .listChoice-option .radio-primary input[type='radio'],
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox'], .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio'],
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox'] {
  position: absolute;
  top: 2px;
  left: 0;
  height: 20px;
  width: 20px;
  min-height: 20px;
  color: #fff;
  background: #fffef2;
  border: 1px solid #333;
  border-radius: 2px;
  cursor: pointer;
  outline: none;
  display: inline-block;
  margin: 0;
  transition: all 0.15s ease-out 0s;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:before,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:before, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:before,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:before, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:before,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:before {
  content: '\2714\fe0e';
  font-size: 14px;
  height: 18px;
  width: 18px;
  line-height: 18px;
  opacity: 0;
  position: absolute;
  display: inline-block;
  text-align: center; }

#serviceModal .listChoice-option .radio-primary .input-radius[type='radio'],
#serviceModal .listChoice-option .radio-primary .input-radius[type='radio']:after, #serviceModal-1 .listChoice-option .radio-primary .input-radius[type='radio'],
#serviceModal-1 .listChoice-option .radio-primary .input-radius[type='radio']:after, .block-hrvcard_promotion .listChoice-option .radio-primary .input-radius[type='radio'],
.block-hrvcard_promotion .listChoice-option .radio-primary .input-radius[type='radio']:after {
  border-radius: 50%; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:hover:before,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:hover:before, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:hover:before,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:hover:before, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:hover:before,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:hover:before {
  opacity: 1;
  color: #F9A825; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:hover,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:hover, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:hover,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:hover, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:hover,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:hover {
  background: #fff; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:checked,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:checked, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:checked,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:checked, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:checked,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:checked {
  background: #0047ba;
  border-color: #ffffff; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:checked:after,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:checked:after, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:checked:after,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:checked:after, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:checked:after,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:checked:after {
  content: '';
  display: block;
  position: relative;
  z-index: 100;
  background: #00b0ff;
  -webkit-animation: click-wave 0.65s;
  -moz-animation: click-wave 0.65s;
  animation: click-wave 0.65s; }

#serviceModal .listChoice-option .radio-primary input[type='radio']:checked:before,
#serviceModal .listChoice-option .checkbox-primary input[type='checkbox']:checked:before, #serviceModal-1 .listChoice-option .radio-primary input[type='radio']:checked:before,
#serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox']:checked:before, .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio']:checked:before,
.block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox']:checked:before {
  opacity: 1;
  color: #ffffff; }

@keyframes click-wave {
  0% {
    height: 15px;
    width: 15px;
    opacity: 0.35;
    position: relative; }
  100% {
    height: 40px;
    width: 40px;
    margin-left: -12.5px;
    margin-top: -12.5px;
    opacity: 0; } }

#serviceModal .field-error, #serviceModal-1 .field-error, .block-hrvcard_promotion .field-error {
  font-size: 12px;
  color: red;
  position: relative;
  top: -15px;
  margin: 0; }

#serviceModal input[type='checkbox']:not(:checked), #serviceModal-1 input[type='checkbox']:not(:checked) {
  cursor: auto; }
  #serviceModal input[type='checkbox']:not(:checked):after, #serviceModal input[type='checkbox']:not(:checked):before, #serviceModal-1 input[type='checkbox']:not(:checked):after, #serviceModal-1 input[type='checkbox']:not(:checked):before {
    display: none !important; }

.theme-detail--notify-inner ul {
  padding-left: 15px; }
  .theme-detail--notify-inner ul li {
    margin-bottom: 0px;
    line-height: 1.4;
    margin-bottom: 3px; }

.promotion-details {
  gap: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between; }

.groupbox-dropdown__inner {
  display: none;
  padding-left: 35px; }
  .groupbox-dropdown__inner .groupbox-dropdown__price del {
    color: #6f717b;
    font-size: 13px;
    display: inline-block;
    margin-right: 7px;
    font-weight: 400; }
  .groupbox-dropdown__inner .groupbox-dropdown__price strong.price {
    text-align: right;
    font-size: 15px;
    color: red;
    font-weight: 500; }
  .groupbox-dropdown__inner .groupbox-dropdown__price span {
    margin-left: 10px;
    display: inline-flex;
    padding: 3px 12px;
    line-height: 1.4;
    background-color: red;
    color: white;
    font-weight: 500;
    font-size: 12px;
    border-radius: 999px;
    align-items: center;
    justify-content: center; }
  .groupbox-dropdown__inner .groupbox-dropdown__notify {
    display: block;
    font-size: 13px;
    margin-top: 5px;
    margin-bottom: 10px; }

.groupbox-dropdown__total {
  font-size: 15px;
  font-weight: 500; }
  .groupbox-dropdown__total .groupbox-dropdown__total-text {
    font-size: 18px;
    color: red; }

.promotion-details__price-compare {
  margin-left: 10px;
  display: inline-flex;
  padding: 3px 8px;
  line-height: 1.3;
  background-color: red;
  color: white;
  font-weight: 300;
  font-size: 12px;
  border-radius: 999px;
  align-items: center;
  justify-content: center; }

@media (max-width: 480px) {
  .promotion-details__notify strong {
    display: block; }
  .promotion-details__price-compare {
    margin-left: 5px;
    padding: 3px 6px; }
  #serviceModal .listChoice-option .radio-primary input[type='radio'] + label,
  #serviceModal .listChoice-option .checkbox-primary input[type='checkbox'] + label,
  #serviceModal-1 .listChoice-option .radio-primary input[type='radio'] + label,
  #serviceModal-1 .listChoice-option .checkbox-primary input[type='checkbox'] + label,
  .block-hrvcard_promotion .listChoice-option .radio-primary input[type='radio'] + label,
  .block-hrvcard_promotion .listChoice-option .checkbox-primary input[type='checkbox'] + label {
    padding-left: 30px;
    font-size: 13px; }
  .groupbox-dropdown__total {
    font-size: 13px; }
  .groupbox-dropdown__total .groupbox-dropdown__total-text {
    font-size: 14px; } }