@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@100;200;300;400;500;600;700&display=swap");
html,
body {
overflow-x: hidden;
}
.main-header,
.page-banner {
display: none;
}
.content-area {
position: relative;
top: 0;
left: 50%;
width: 1920px;
margin: 0 auto;
transform: translateX(-50%);
}
.content-area figure {
width: 100%;
margin-bottom: 0;
}
.wp-block-kadence-column {
position: relative;
}
.kb-row-layout-wrap .kt-row-column-wrap {
padding: 0;
gap: 0;
}
.bg-section {
position: relative;
width: 100%;
}
.img-m {
display: none;
}
.carousel-reviews {
position: absolute;
top: 134px;
left: 50%;
height: auto;
z-index: 9;
transform: translateX(-50%);
}
.carousel-reviews .kt-row-column-wrap {
display: block;
width: 1329px;
height: 422px;
}
.carousel-reviews .wp-block-kadence-column {
width: 443px;
}
.carousel-reviews .flickity-viewport {
height: 100%;
}
.carousel-reviews .wp-block-kadence-column {
padding: 52px 25px 0 96px;
transition: padding 0.4s ease-in-out, opacity 0.4s ease-in-out, filter 0.4s ease-in-out;
}
.carousel-reviews .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-reviews .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 52px 96px 0 25px;
}
.carousel-reviews .wp-block-kadence-column.is-selected,
.carousel-reviews .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:only-child {
padding: 0 !important;
}
.carousel-reviews .wp-block-kadence-column .kt-inside-inner-col {
border: 2px solid #fff;
border-radius: 17px;
overflow: hidden;
background-color: #fff;
box-shadow: 0 6px 2px 0 rgba(102, 110, 119, 0.3);
}
.carousel-reviews .wp-block-kadence-column img {
width: 100%;
max-width: unset;
height: auto;
opacity: 0.4;
transition: opacity 0.4s ease-in-out;
}
.carousel-reviews .wp-block-kadence-column.is-selected img {
opacity: 1;
}
.kt-row-column-wrap .flickity-page-dots {
display: flex;
justify-content: center;
align-items: center;
bottom: -47px;
gap: 20px;
}
.kt-row-column-wrap .flickity-page-dots .dot {
display: block;
width: 14px;
height: 14px;
margin: 0;
padding: 0;
background: #bdc9d4;
opacity: 1;
}
.kt-row-column-wrap .flickity-page-dots .dot.is-selected {
width: 18px;
height: 18px;
background: #93c6ff;
}
.kt-row-column-wrap .flickity-prev-next-button {
width: 40px;
height: 118px;
padding: 0;
outline: 0;
z-index: 9;
border-radius: 20px;
background: #e58100;
transform: translateY(-55%);
transition: background 0.35s ease-in-out;
}
.kt-row-column-wrap .flickity-button:hover {
background: #445b99;
}
.kt-row-column-wrap .flickity-button:focus {
outline: 0;
box-shadow: none;
}
.kt-row-column-wrap .flickity-button:active {
opacity: 1;
}
.kt-row-column-wrap .flickity-prev-next-button.previous {
left: 0;
}
.kt-row-column-wrap .flickity-prev-next-button.next {
right: 0;
}
.kt-row-column-wrap .flickity-prev-next-button .flickity-button-icon,
.flickity-prev-next-button .flickity-button-icon {
fill: #fff;
left: 50%;
top: 50%;
width: 28px;
height: 28px;
transform: translateX(-50%) translateY(-50%);
transition: fill 0.4s ease-in-out;
}
.kt-row-column-wrap .flickity-prev-next-button.previous .flickity-button-icon,
.flickity-prev-next-button.previous .flickity-button-icon {
left: calc(50% + 3px);
}
.kt-row-column-wrap .flickity-prev-next-button:hover .flickity-button-icon,
.flickity-prev-next-button:hover .flickity-button-icon {
fill: #fff;
}
.carousel-video {
position: absolute;
top: 136px;
left: 50%;
height: auto;
z-index: 9;
transform: translateX(-50%);
}
.carousel-video .kt-row-column-wrap {
display: block;
width: 1062px;
height: 635px;
}
.carousel-video .wp-block-kadence-column {
width: 354px;
}
.carousel-video .flickity-viewport {
height: 100%;
}
.carousel-video .wp-block-kadence-column {
padding: 65px 75px 0 0;
transition: padding 0.4s ease-in-out, opacity 0.4s ease-in-out, filter 0.4s ease-in-out;
}
.carousel-video .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-video .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 65px 0 0 75px;
}
.carousel-video .wp-block-kadence-column.is-selected,
.carousel-video .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:only-child {
padding: 0 !important;
}
.carousel-video .wp-block-kadence-column .kt-inside-inner-col {
border: 2px solid #fff;
border-radius: 22px;
overflow: hidden;
background-color: #fff;
box-shadow: 0 6px 2px 0 rgba(102, 110, 119, 0.3);
}
.carousel-video-btn {
position: relative;
display: block;
opacity: 0.4;
transition: opacity 0.4s ease-in-out;
}
.carousel-video .wp-block-kadence-column.is-selected .carousel-video-btn {
opacity: 1;
}
.carousel-video-btn::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 91px;
height: 91px;
opacity: 0;
background-image: url(//vsquare.clinic/wp-content/themes/plant/img/ultherapy/icon-play.png);
background-repeat: no-repeat;
background-position: center center;
background-size: auto 100%;
transform: translateX(-50%) translateY(-50%);
transition: opacity 0.35s ease-in-out;
}
.carousel-video .wp-block-kadence-column.is-selected .carousel-video-btn::before {
opacity: 1;
}
.carousel-video-btn img {
width: 100%;
max-width: unset;
height: auto;
object-fit: cover;
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.previous {
left: -128px;
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.next {
right: -128px;
}
.fancybox-container .fancybox-slide:before {
display: none;
}
.fancybox-container .fancybox-slide--iframe .fancybox-content {
display: flex;
justify-content: center;
align-items: flex-start;
overflow: hidden;
background: transparent;
}
.fancybox-container .fancybox-content iframe,
.fancybox-container .fancybox-iframe {
position: relative;
width: auto;
min-width: 322px;
height: 100%;
}
.fancybox-container.ig-iframe .fancybox-content iframe,
.fancybox-container.ig-iframe .fancybox-iframe {
min-width: 525px;
}
.fancybox-container.youtube-iframe .fancybox-content iframe,
.fancybox-container.youtube-iframe .fancybox-iframe {
min-width: 455px;
}
.fancybox-container.facebook-iframe .fancybox-content iframe,
.fancybox-container.facebook-iframe .fancybox-iframe {
min-width: 430px;
}
.btn-reserve {
position: absolute;
top: 9px;
left: 50%;
width: 530px;
height: 96px;
z-index: 9;
transform: translateX(-50%);
}
.btn-addline {
position: absolute;
bottom: 32px;
left: 50%;
width: 171px;
height: 65px;
z-index: 9;
transform: translateX(171px);
}
.section-promotion {
position: relative;
z-index: 1;
background: #E0ECFA;
background: linear-gradient(90deg, rgb(224, 236, 250) 0%, rgb(255, 255, 255) 28%, rgb(255, 255, 255) 72%, rgb(218, 231, 247) 100%);
}
.section-promotion .bg-section {
position: absolute;
top: 0;
left: 50%;
width: 100%;
max-width: 1920px;
height: 100%;
z-index: 1;
transform: translateX(-50%);
}
.promotion-wrapper {
width: 1041px;
margin: 0 auto;
padding: 49px 0 45px;
border-radius: 113px;
z-index: 2;
background-color: #f9fafa;
box-shadow: 0 0 29px 0 rgba(119, 156, 196, 0.16);
}
.section-promotion .wp-block-heading {
position: relative;
display: block;
font-family: "IBM Plex Sans Thai", sans-serif !important;
font-size: 42px;
color: #445b99;
font-weight: 500;
font-style: normal;
line-height: 1.4;
text-align: center;
margin: 0 auto;
padding: 0 0 31px;
}
.section-promotion .wp-block-heading mark {
padding: 0;
}
.section-promotion .wp-block-heading::before {
content: "";
position: absolute;
top: 89px;
left: 50%;
width: 725px;
height: 85px;
background-image: url(//vsquare.clinic/wp-content/themes/plant/img/ultherapy/shadow-heading-promotion.png);
background-repeat: no-repeat;
background-position: center center;
background-size: auto 100%;
transform: translateX(-50%);
}
.promotion-img {
display: block;
width: 842px;
height: auto;
margin: 55px auto 0;
}
.promotion-img .kt-inside-inner-col {
display: flex;
justify-content: flex-start;
align-items: flex-start;
gap: 27px;
}
.promotion-img .wp-block-image {
width: 100%;
overflow: hidden;
border: 3px solid #fff;
border-radius: 28px;
box-shadow: 0 6px 9px 0 rgba(74, 79, 90, 0.34);
}
.promotion-img img {
display: block;
width: 100%;
max-width: unset;
height: auto;
}
.promotion-btn {
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: column;
margin-top: 45px;
}
.promotion-btn .wp-block-image {
width: 771px;
height: auto;
}
.promotion-btn .wp-block-image img {
width: 100%;
height: auto;
}
.promotion-wrapper .btn-addline {
bottom: 34px;
transform: translateX(168px);
}
.section-qa {
position: relative;
top: -20px;
z-index: 2;
}
@media (max-width: 1919px) {
.content-area {
width: 100vw;
}
.carousel-reviews {
top: 6.9791666667vw;
}
.carousel-reviews .kt-row-column-wrap {
width: 69.21875vw;
height: 21.9791666667vw;
}
.carousel-reviews .wp-block-kadence-column {
width: 23.0729166667vw;
}
.carousel-reviews .wp-block-kadence-column {
padding: 2.7083333333vw 1.3020833333vw 0 5vw;
}
.carousel-reviews .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-reviews .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 2.7083333333vw 5vw 0 1.3020833333vw;
}
.carousel-reviews .wp-block-kadence-column .kt-inside-inner-col {
border-width: 0.1041666667vw;
border-radius: 0.8854166667vw;
box-shadow: 0 0.3125vw 0.1041666667vw 0 rgba(102, 110, 119, 0.3);
}
.kt-row-column-wrap .flickity-page-dots {
bottom: -2.4479166667vw;
gap: 1.0416666667vw;
}
.kt-row-column-wrap .flickity-page-dots .dot {
width: 0.7291666667vw;
height: 0.7291666667vw;
}
.kt-row-column-wrap .flickity-page-dots .dot.is-selected {
width: 0.9375vw;
height: 0.9375vw;
}
.kt-row-column-wrap .flickity-prev-next-button {
width: 2.0833333333vw;
height: 6.1458333333vw;
border-radius: 1.0416666667vw;
}
.kt-row-column-wrap .flickity-prev-next-button .flickity-button-icon,
.flickity-prev-next-button .flickity-button-icon {
width: 1.4583333333vw;
height: 1.4583333333vw;
}
.kt-row-column-wrap .flickity-prev-next-button.previous .flickity-button-icon,
.flickity-prev-next-button.previous .flickity-button-icon {
left: calc(50% + 0.15625vw);
}
.carousel-video {
top: 7.0833333333vw;
}
.carousel-video .kt-row-column-wrap {
width: 55.3125vw;
height: 33.0729166667vw;
}
.carousel-video .wp-block-kadence-column {
width: 18.4375vw;
}
.carousel-video .wp-block-kadence-column {
padding: 3.3854166667vw 3.90625vw 0 0;
}
.carousel-video .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-video .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 3.3854166667vw 0 0 3.90625vw;
}
.carousel-video .wp-block-kadence-column .kt-inside-inner-col {
border-width: 0.1041666667vw;
border-radius: 1.1458333333vw;
box-shadow: 0 0.3125vw 0.1041666667vw 0 rgba(102, 110, 119, 0.3);
}
.carousel-video-btn::before {
width: 4.7395833333vw;
height: 4.7395833333vw;
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.previous {
left: -6.6666666667vw;
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.next {
right: -6.6666666667vw;
}
.fancybox-container .fancybox-content iframe,
.fancybox-container .fancybox-iframe {
min-width: 16.7708333333vw;
}
.fancybox-container.ig-iframe .fancybox-content iframe,
.fancybox-container.ig-iframe .fancybox-iframe {
min-width: 27.34375vw;
}
.fancybox-container.youtube-iframe .fancybox-content iframe,
.fancybox-container.youtube-iframe .fancybox-iframe {
min-width: 23.6979166667vw;
}
.fancybox-container.facebook-iframe .fancybox-content iframe,
.fancybox-container.facebook-iframe .fancybox-iframe {
min-width: 20.8333333333vw;
}
.btn-reserve {
top: 0.46875vw;
width: 27.6041666667vw;
height: 5vw;
}
.btn-addline {
bottom: 1.6666666667vw;
width: 8.90625vw;
height: 3.3854166667vw;
transform: translateX(8.90625vw);
}
.section-promotion .bg-section {
max-width: 100vw;
}
.promotion-wrapper {
width: 54.21875vw;
padding: 2.5520833333vw 0 2.34375vw;
border-radius: 5.8854166667vw;
box-shadow: 0 0 1.5104166667vw 0 rgba(119, 156, 196, 0.16);
}
.section-promotion .wp-block-heading {
font-size: 2.1875vw;
padding: 0 0 1.6145833333vw;
}
.section-promotion .wp-block-heading::before {
top: 4.6354166667vw;
width: 37.7604166667vw;
height: 4.4270833333vw;
}
.promotion-img {
width: 43.8541666667vw;
margin: 2.8645833333vw auto 0;
}
.promotion-img .kt-inside-inner-col {
gap: 1.40625vw;
}
.promotion-img .wp-block-image {
border-width: 0.15625vw;
border-radius: 1.4583333333vw;
box-shadow: 0 0.3125vw 0.46875vw 0 rgba(74, 79, 90, 0.34);
}
.promotion-btn {
margin-top: 2.34375vw;
}
.promotion-btn .wp-block-image {
width: 40.15625vw;
}
.promotion-wrapper .btn-addline {
bottom: 1.7708333333vw;
transform: translateX(8.75vw);
}
.section-qa {
top: -1.0416666667vw;
}
}
@media (max-width: 768px) {
.img-d {
display: none;
}
.img-m {
display: block;
}
.carousel-reviews {
top: 25.390625vw;
}
.carousel-reviews .kt-row-column-wrap {
width: 208.984375vw;
height: 65.1041666667vw;
}
.carousel-reviews .wp-block-kadence-column {
width: 69.6614583333vw;
}
.carousel-reviews .wp-block-kadence-column {
padding: 11.71875vw 1.953125vw 0 22.1354166667vw;
}
.carousel-reviews .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-reviews .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 11.71875vw 22.1354166667vw 0 1.953125vw;
}
.carousel-reviews .wp-block-kadence-column .kt-inside-inner-col {
border-width: 0.2604166667vw;
border-radius: 2.2135416667vw;
box-shadow: 0 0.78125vw 0.2604166667vw 0 rgba(102, 110, 119, 0.3);
}
.carousel-reviews .wp-block-kadence-column img {
opacity: 0.4;
}
.carousel-reviews .wp-block-kadence-column.is-selected img {
opacity: 1;
}
.kt-row-column-wrap .flickity-page-dots {
bottom: -6.1197916667vw;
gap: 2.6041666667vw;
}
.kt-row-column-wrap .flickity-page-dots .dot {
width: 1.8229166667vw;
height: 1.8229166667vw;
}
.kt-row-column-wrap .flickity-page-dots .dot.is-selected {
width: 2.34375vw;
height: 2.34375vw;
}
.kt-row-column-wrap .flickity-prev-next-button {
width: 4.5572916667vw;
height: 13.28125vw;
border-radius: 2.6041666667vw;
transform: translateY(-55%);
}
.kt-row-column-wrap .flickity-button:hover {
background: #e58100;
}
.kt-row-column-wrap .flickity-button:active {
background: #445b99;
}
.kt-row-column-wrap .flickity-prev-next-button.previous {
left: 50%;
transform: translateY(-55%) translateX(-46.2239583333vw);
}
.kt-row-column-wrap .flickity-prev-next-button.next {
right: 50%;
transform: translateY(-55%) translateX(46.2239583333vw);
}
.kt-row-column-wrap .flickity-prev-next-button .flickity-button-icon,
.flickity-prev-next-button .flickity-button-icon {
width: 3.6458333333vw;
height: 3.6458333333vw;
}
.kt-row-column-wrap .flickity-prev-next-button.previous .flickity-button-icon,
.flickity-prev-next-button.previous .flickity-button-icon {
left: calc(50% + 0.390625vw);
}
.kt-row-column-wrap .flickity-prev-next-button:hover .flickity-button-icon,
.flickity-prev-next-button:hover .flickity-button-icon {
fill: #fff;
}
.kt-row-column-wrap .flickity-prev-next-button:active .flickity-button-icon,
.flickity-prev-next-button:active .flickity-button-icon {
fill: #fff;
}
.carousel-video {
top: 20.5729166667vw;
}
.carousel-video .kt-row-column-wrap {
width: 128.90625vw;
height: 82.6822916667vw;
}
.carousel-video .wp-block-kadence-column {
width: 42.96875vw;
}
.carousel-video .wp-block-kadence-column {
padding: 8.0729166667vw 5.2083333333vw 0 4.0364583333vw;
}
.carousel-video .flickity-slider:has(.wp-block-kadence-column.is-selected:last-child) .wp-block-kadence-column:first-child,
.carousel-video .wp-block-kadence-column.is-selected + .wp-block-kadence-column {
padding: 8.0729166667vw 4.0364583333vw 0 5.2083333333vw;
}
.carousel-video .wp-block-kadence-column .kt-inside-inner-col {
border-width: 0.2604166667vw;
border-radius: 2.8645833333vw;
box-shadow: 0 0.78125vw 0.2604166667vw 0 rgba(102, 110, 119, 0.3);
}
.carousel-video-btn {
opacity: 0.4;
}
.carousel-video .wp-block-kadence-column.is-selected .carousel-video-btn {
opacity: 1;
}
.carousel-video-btn::before {
width: 10.9375vw;
height: 10.9375vw;
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.previous {
left: 50%;
transform: translateY(-55%) translateX(-46.2239583333vw);
}
.carousel-video .kt-row-column-wrap .flickity-prev-next-button.next {
right: 50%;
transform: translateY(-55%) translateX(46.2239583333vw);
}
.fancybox-container .fancybox-content iframe,
.fancybox-container .fancybox-iframe {
min-width: 100%;
}
.fancybox-container.ig-iframe .fancybox-content iframe,
.fancybox-container.ig-iframe .fancybox-iframe {
min-width: 100%;
}
.fancybox-container.youtube-iframe .fancybox-content iframe,
.fancybox-container.youtube-iframe .fancybox-iframe {
min-width: 100%;
}
.fancybox-container.facebook-iframe .fancybox-content iframe,
.fancybox-container.facebook-iframe .fancybox-iframe {
min-width: 100%;
}
.btn-reserve {
top: 1.8229166667vw;
width: 72.9166666667vw;
height: 13.671875vw;
}
.btn-addline {
bottom: 8.3333333333vw;
width: 20.8333333333vw;
height: 7.8125vw;
transform: translateX(20.3125vw);
}
.section-promotion {
padding-bottom: 0.5208333333vw;
}
.section-promotion .bg-section {
max-width: 100%;
}
.promotion-wrapper {
width: 95.9635416667vw;
padding: 5.7291666667vw 2.0833333333vw 4.1666666667vw;
border-radius: 7.03125vw;
box-shadow: 0 0 2.8645833333vw 0 rgba(119, 156, 196, 0.16);
}
.section-promotion .wp-block-heading {
font-size: 5.9895833333vw !important;
padding: 0 0 4.1666666667vw;
}
.section-promotion .wp-block-heading::before {
top: 12.3697916667vw;
width: 88.4114583333vw;
height: 13.8020833333vw;
background-image: url(//vsquare.clinic/wp-content/themes/plant/img/ultherapy/shadow-heading-promotion-m.png);
}
.promotion-img {
width: 100%;
margin: 6.25vw auto 0;
}
.promotion-img .kt-inside-inner-col {
gap: 3.125vw;
}
.promotion-img .wp-block-image {
border-width: 0.390625vw;
border-radius: 2.734375vw;
box-shadow: 0 0.6510416667vw 0.78125vw 0 rgba(74, 79, 90, 0.34);
}
.promotion-btn {
margin-top: 4.9479166667vw;
}
.promotion-btn .wp-block-image {
width: 100%;
}
.promotion-wrapper .btn-addline {
bottom: 4.1666666667vw;
transform: translateX(20.0520833333vw);
}
.section-qa {
top: unset;
}
}