/* details::details-content { transition: height 0.4s ease, content-visibility 0.4s ease allow-discrete; height: 0; overflow: clip; }
@supports (interpolate-size: allow-keywords) {
    :root { interpolate-size: allow-keywords; }
    details[open]::details-content { height: auto; }
} */

.v-line-accordion { background: #fff; min-height: 435px; overflow: hidden; position: relative; padding: 96px 0px; }
.v-line-accordion .container { position: relative; z-index: 2; }
.sd-reset.v-line-accordion h2 { color: var(--color-black); font-family: var(--font-normal); font-weight: 400; letter-spacing: -0.16px; text-transform: uppercase; margin-bottom: 24px; }
.sd-reset.v-line-accordion h5 { color: var(--red); font-weight: 500; text-transform: uppercase; margin-bottom: 22px; }
.sd-reset.v-line-accordion h4 { color: var(--color-black); font-weight: 400; line-height: 1.135; text-align: left; text-transform: uppercase; margin-bottom: 32px; }
.v-line-accordion span.text-18 { margin-bottom: 40px; color: rgba(var(--color-black), 0.65); display: block; }
.v-line-accordion .smart-tech { pointer-events: none;  position: absolute; right: 0; bottom: 0; height: 707px; width: 810px; z-index: 0; }
.v-line-accordion h2 + .cmn-accordion, .v-line-accordion .cmn-accordion + .arrow-link { margin-top: 40px; }
.v-line-accordion .cmn-accordion { position: relative; padding-left: 28px; overflow: hidden; }
.v-line-accordion .cmn-accordion:before { background: rgba(0, 0, 0, 0.12); border-radius: 0; content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 4px; z-index: 0; }
.v-line-accordion .cmn-accordion .ver-indicate { background: #FF0000; border-radius: 0; min-height: 0; position: absolute; left: 0; top: 0; transition: top .3s ease, height .3s ease; height: 0; width: 4px; z-index: 9; }
.cmn-accordion .accordion-item { outline: none; border-bottom: 1px solid #E3E3E3; }
.cmn-accordion .accordion-item:nth-child(2) { border-top: 1px solid #E3E3E3; }
.cmn-accordion .accordion-item:last-child { border-bottom: 0; }
.cmn-accordion .accordion-button { border: 0; background: none; cursor: pointer; font-family: var(--font-medium); font-weight: var(--weight-medium); letter-spacing: -0.64px; text-align: left; padding: 24px 0px; outline: none; margin: 0; color: #000000; display: flex; align-items: center; list-style: none; width: 100%; }
.cmn-accordion .accordion-button::-webkit-details-marker { display: none; }
.cmn-accordion .accordion-item[open] .accordion-button { padding-bottom: 4px; pointer-events: none; }
.cmn-accordion .accordion-button span { margin: 0 12px 0 0; min-width: 32px; height: 32px; width: 32px; text-align: center; }
.cmn-accordion .accordion-button:hover { color: #FF0000; }
.cmn-accordion .accordion-collapse { display: block; overflow: hidden; width: 100%; }
.cmn-accordion .accordion-body { color: rgba(0, 0, 0, 0.65); letter-spacing: -0.18px; text-align: left; padding-bottom: 40px; }
.cmn-accordion .accordion-body p:last-child { margin-bottom: 0; }
.cmn-accordion .accordion-item.has-icon .accordion-body { padding-left: 44px; }
.v-line-accordion .left-col { color: rgba(0, 0, 0, 0.65); flex: 0 0 auto; width: 48.2%; }
.v-line-accordion .left-col .arrow-link {color: var(--color-black);}
.v-line-accordion .right-img-col { flex: 0 0 auto; width: 39.7%; margin-left: auto; }
/* Accordion: Right image when accordon open */
.acc-right-img { min-height: 533px; position: relative; }
.acc-right-img > img { border-radius: 20px; display: block; opacity: 1; transition: opacity 0.4s ease-in-out; position: absolute; top: 0; left: 0; width: 100%; object-fit: cover; object-position: top center; }
.acc-right-img .fade-out { opacity: 0; }

/* Accordion: Black BG: */
.v-line-accordion.text-white { background: #000000; color: var(--color-white); padding: 128px 0; }
.sd-reset.v-line-accordion.text-white h2 { color: var(--color-white);}
.v-line-accordion.text-white .cmn-accordion:before { background: rgba(255, 255, 255, .12); }
.v-line-accordion.text-white .cmn-accordion .accordion-item { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.v-line-accordion.text-white .cmn-accordion .accordion-item:nth-child(2) { border-top: 1px solid rgba(255, 255, 255, 0.12); }
.v-line-accordion.text-white .cmn-accordion .accordion-item:last-child { border-bottom: 0; }
.v-line-accordion.text-white .cmn-accordion .accordion-item .accordion-button { color: var(--color-white); }
.v-line-accordion.text-white .cmn-accordion .accordion-button:hover { color: #FF0000; }
.v-line-accordion.text-white .cmn-accordion .accordion-item .accordion-body { padding-left: 0; color: rgba(255, 255, 255, .65); }

/* Accordion: Right column content */
.right-content, .right-content ul, .right-content ul li { display: block; width: 100%; }
.sd-reset .right-content ul { margin-bottom: 30px; }
.sd-reset .right-content ul li { border-bottom: 1px solid #EBEBEB; margin: 0px !important; }
.sd-reset .right-content ul li a { padding: 16px 0px; }

/* Accordion: Image in accordion content that shows on mobile */
.cmn-accordion .accordion-item .accordion-body p:last-of-type {margin-bottom: 0px;}
.cmn-accordion .acc-mob-img { display: none; border-radius: 13px; margin-top: 24px; }

/* Accordion: Left side content */
.v-line-accordion .left-content { color: rgba(0, 0, 0, 0.65); margin-right: auto; width: 39.5%; }
.sd-reset.v-line-accordion .left-content h2 { margin-bottom: 32px; }


@media(min-width: 991.98px) {
    .v-line-accordion.pro-v:not(.bg-black) .smart-tech { position: absolute; height: 435px; width: 710px; bottom: 0px; right: 0px; }
}
@media(max-width: 1399.98px) {
    .acc-right-img { min-height: 471px; }
}
@media(max-width: 1199.98px) {
    .v-line-accordion .smart-tech { background-size: 55%; background-position: bottom right;  height: 100%; width: 100%; }
    .v-line-accordion.bg-black { padding: 128px 0; }
    .v-line-accordion .left-col { width: 52%; }
    .acc-right-img { min-height: 380px; }
}
@media(max-width: 991.98px) {
    .v-line-accordion, .v-line-accordion.bg-black { min-height: 1px; padding: 50px 0px; }
    .sd-reset.v-line-accordion .smart-tech { background-size: 100% auto; float: right; margin: 0px; position: relative; bottom: -50px; height: 235px; width: 50%; }
    .v-line-accordion .cmn-accordion {margin-bottom: 0;}
    .cmn-accordion .accordion-button {padding: 15px 0 15px 0;}
    /* .v-line-accordion.pro-v:not(.bg-black) .smart-tech { padding-top: 40px; padding-bottom: 0; } */
    .v-line-accordion.bg-black { padding: 80px 0px 0px; }
    .left-content { margin-bottom: 40px; width: 100%; }
    .v-line-accordion .left-content {width: 100%;}
    .v-line-accordion .left-col, .v-line-accordion .right-img-col { width: 100%; }
    .v-line-accordion .right-img-col { margin-top: 40px; }
    .v-line-accordion h2 + .cmn-accordion { margin-top: 32px; }
    .cmn-accordion .accordion-body { padding-bottom: 24px; }
    .acc-right-img { display: none; }
    .cmn-accordion .acc-mob-img { display: block; }
}
@media(max-width: 767.98px) {
    .sd-reset.v-line-accordion .smart-tech { height: 230px; width: 375px; }
}



.cmn-accordion .accordion-collapse {
  /* overflow: hidden;
  height: 0; */
  /* transition: height 0.4s ease; */
  /* transition: height 0.4s ease, content-visibility 0.4s ease allow-discrete; height: 0; overflow: clip; */
}
 
/* When active (JavaScript controlled) */
/* .cmn-accordion details[open] .accordion-collapse {
  display: block;
  height: auto;
} */

details:not(.is-open) .accordion-collapse {
  display: none;
}
details.is-open .accordion-collapse {
  display: block;
}