.page-container {
  width: 100%;
}

.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.grid {
  display: grid;
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.col-span-12 {
  grid-column: span 12 / span 12;
}

.flex {
  display: flex;
}

.inline-block {
  display: inline-block;
}

.inline-flex {
  display: inline-flex;
}

.items-center {
  align-items: center;
}

.justify-between {
  justify-content: space-between;
}

.w-full {
  width: 100%;
}

.w-4 {
  width: 1rem;
}

.h-4 {
  height: 1rem;
}

.h-auto {
  height: auto;
}

.object-cover {
  object-fit: cover;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.bg-white {
  background-color: #fff;
}

.text-center {
  text-align: center;
}

.font-bold {
  font-weight: 700;
}

.font-semibold {
  font-weight: 600;
}

.sticky {
  position: sticky;
}

.order-last {
  order: 9999;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-3 {
  gap: 0.75rem;
}

.gap-6 {
  gap: 1.5rem;
}

.space-y-2 > * + * {
  margin-top: 0.5rem;
}

.space-y-4 > * + * {
  margin-top: 1rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.px-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.p-0 {
  padding: 0;
}

.p-4 {
  padding: 1rem;
}

.pr-5 {
  padding-right: 1.25rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pb-3 {
  padding-bottom: 0.75rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.mt-8 {
  margin-top: 2rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mb-10 {
  margin-bottom: 2.5rem;
}

.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.border {
  border-width: 1px;
  border-style: solid;
}

.shadow-sm {
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.transition-colors {
  transition-property: color, background-color, border-color;
  transition-duration: 150ms;
}

.text-sm {
  font-size: 14px;
}

.text-2xl {
  font-size: 24px;
  line-height: 1.3;
}

.text-gray-400 {
  color: #9ca3af;
}

.text-gray-300 {
  color: #d1d5db;
}

.text-gray-500 {
  color: #6b7280;
}

.text-gray-600 {
  color: #4b5563;
}

.text-gray-700 {
  color: #374151;
}

.text-white {
  color: #fff;
}

.bg-blue-600 {
  background-color: #2563eb;
}

.hover\:bg-blue-700:hover {
  background-color: #1d4ed8;
}

.hover\:text-gray-600:hover {
  color: #4b5563;
}

.hover\:text-gray-700:hover {
  color: #374151;
}

.text-\[11px\] {
  font-size: 11px;
}

.text-\[13px\] {
  font-size: 13px;
}

.text-\[14px\] {
  font-size: 14px;
}

.text-\[18px\] {
  font-size: 18px;
}

.text-\[44px\] {
  font-size: 44px;
}

.leading-\[24px\] {
  line-height: 24px;
}

.leading-\[60px\] {
  line-height: 60px;
}

.color-\[\#191919\] {
  color: #191919;
}

.text-\[\#191919\] {
  color: #191919;
}

.text-\[\#666666\] {
  color: #666666;
}

.border-\[\#B9B9B9\] {
  border-color: #B9B9B9;
}

.border-\[\#E5E7EB\] {
  border-color: #E5E7EB;
}

.bg-\[\#FAFBFF\] {
  background-color: #FAFBFF;
}

.rounded-\[12px\] {
  border-radius: 12px;
}

.w-\[56px\] {
  width: 56px;
}

.h-\[56px\] {
  height: 56px;
}

.h-\[2px\] {
  height: 2px;
}

.top-\[90px\] {
  top: 90px;
}

@media (min-width: 768px) {
  .md\:col-span-9 {
    grid-column: span 9 / span 9;
  }

  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .lg\:col-span-3 {
    grid-column: span 3 / span 3;
  }

  .lg\:col-span-9 {
    grid-column: span 9 / span 9;
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:order-none {
    order: 0;
  }

  .blog-detail__aside {
    grid-column: span 3 / span 3;
    order: 0;
  }
}

p {
  font-size: 18px;
  line-height: 1.4;
  font-family: HarmonyOS_Sans;
}

h1 {
  font-size: 48px;
  line-height: 1.4;
  font-weight: bold;
  font-family: HarmonyOS_Sans;
}

h2 {
  font-size: 36px;
  line-height: 1.4;
  font-weight: bold;
  font-family: HarmonyOS_Sans;
}

h3 {
  font-size: 30px;
  line-height: 1.4;
  font-weight: bold;
  font-family: HarmonyOS_Sans;
}

h4 {
  font-size: 24px;
  line-height: 1.4;
  font-weight: bold;
  font-family: HarmonyOS_Sans;
}

h5 {
  font-size: 21px;
  line-height: 1.4;
  font-weight: bold;
  font-family: HarmonyOS_Sans;
}

div {
  line-height: 1.4;
}

.blog-detail table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin: 16px 0;
  background-color: #fff;
}

#articleContent img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 16px auto;
}

#articleContent iframe,
#articleContent video,
#articleContent embed {
  display: block;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 360px;
  height: auto;
  border: 0;
}

.blog-detail__side-ad {
  width: 100%;
  min-height: 0;
  margin-bottom: 1rem;
  background: transparent;
  overflow: hidden;
  box-sizing: border-box;
}

.blog-detail__side-ad-link {
  display: block;
  width: 100%;
  min-height: 0;
}

.blog-detail__side-ad-img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  margin: 0 !important;
}

.blog-detail__aside {
  min-width: 0;
}

.blog-detail__quote-sticky {
  z-index: 2;
}

.blog-detail__aside .quote-card {
  box-sizing: border-box;
}

.blog-detail__related {
  min-height: 430px;
}

.blog-detail table thead th {
  background-color: #e6f2ff;
  font-weight: bold;
  padding: 12px;
  text-align: left;
  border: 1px solid #ddd;
}

.blog-detail table tbody td {
  background-color: #fff;
  padding: 12px;
  border: 1px solid #ddd;
}

.blog-detail table tbody tr:hover {
  background-color: #f9f9f9;
}

.blog-detail p,
.blog-detail h2,
.blog-detail h3,
.blog-detail h4,
.blog-detail h5 {
  margin: 16px 0 !important;
}

.blog-detail li {
  list-style: initial !important;
  margin: 0 0 0 2.5em !important;
}

.blog-detail li::marker {
  color: #6e6e6e !important;
}

.blog-detail * {
  word-break: break-word !important;
  white-space: normal !important;
  word-wrap: break-word !important;
}

#tableOfContents a.toc-active {
  color: #191919 !important;
  transition: color 0.3s ease, font-weight 0.3s ease;
}

#tableOfContents a.toc-active:hover {
  color: #191919 !important;
}

.valuation {
  width: 100%;
}

.valuation .titles {
  width: 100%;
  height: 68px;
  font-family: HarmonyOS Sans, HarmonyOS Sans;
  font-weight: bold;
  font-size: 28px;
  color: #FFFFFF;
  line-height: 34px;
  text-align: center;
  font-style: normal;
  text-transform: none;
  display: inline-block;
  margin-top: 23px;
}

.valuation .desc {
  width: 100%;
  height: 45px;
  font-family: HarmonyOS Sans, HarmonyOS Sans;
  font-weight: 400;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 22px;
  text-align: center;
  font-style: normal;
  text-transform: none;
  margin-top: 8px;
  display: inline-block;
}

.valuation .Dimensions {
  margin-top: 16px;
  height: 28px;
  font-family: HarmonyOS Sans, HarmonyOS Sans;
  font-weight: bold;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 28px;
  text-align: left;
  font-style: normal;
  text-transform: none;
}

.paramwh {
  width: 100%;
  height: 34px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #CCCCCC;
}

.paramwh .h {
  width: 63px;
  height: 32px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  margin-left: 5px;
  margin-right: 16px;
  border: none;
  outline: none;
  text-indent: 8px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.paramwh .w {
  width: 67px;
  height: 32px;
  border-radius: 0px 0px 0px 0px;
  border: none;
  margin-right: 7px;
  margin-left: 7px;
  outline: none;
  border-right: 1px solid #CCCCCC;
  text-indent: 8px;
}

.layers {
  text-align: left;
}

.layers span:nth-child(1) {
  margin-right: 67px;
}

.layers span {
  height: 28px;
  font-family: HarmonyOS Sans, HarmonyOS Sans;
  font-weight: bold;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 28px;
  text-align: left;
  font-style: normal;
  text-transform: none;
}

.layersselect {
  right: 3px;
}

.layersselect,
.quantityselect {
  padding-left: 12px;
  width: calc(50% - 4px);
  height: 34px;
  background: #FFFFFF;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #CCCCCC;
  position: relative;
}

.quantityselect {
  left: 5px;
}

.quantity {
  margin-bottom: 24px;
  width: 100%;
}

.quotenow {
  width: 100%;
  height: 37px;
  background: #0060FF;
  border-radius: 4px 4px 4px 4px;
  text-align: center;
}

.quotenow .bg_ico {
  width: 13px;
  height: 15px;
  border-radius: 0px 0px 0px 0px;
  background: url("/aivon/static/img/onlineNew/ji.png") no-repeat center;
  display: inline-block;
  position: relative;
  top: 2px;
}

.quotenow span {
  width: 84px;
  height: 35px;
  font-family: HarmonyOS Sans, HarmonyOS Sans;
  font-weight: bold;
  font-size: 16px;
  color: #FFFFFF;
  line-height: 35px;
  text-align: center;
  font-style: normal;
  text-transform: none;
}

.quotenow a {
  color: inherit;
  width: 100%;
  display: inline-block;
}

#articleContent a {
  color: var(--color-main) !important;
  text-decoration: underline !important;
}
       .items-center {
            align-items: center;
        }
#tableOfContents a{
  color:#6b7280
}
#tableOfContents a:hover{
  color:#191919;
}