* {
    outline: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body::-webkit-scrollbar-track {
    background-color: rgba(222, 222, 222, 0.75)
}

body::-webkit-scrollbar-thumb {
    background-color: #B0B0B0;
    border-radius: 0
}

body::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background: rgba(222, 222, 222, 0.75)
}

.fancybox-slide::-webkit-scrollbar-track,
.scrollbar::-webkit-scrollbar-track {
    background: none
}

.fancybox-slide::-webkit-scrollbar-thumb,
.scrollbar::-webkit-scrollbar-thumb {
    background-color: #D9D9D6;
    border-radius: 20px
}

.fancybox-slide::-webkit-scrollbar,
.scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background: none
}

body,
html {
    padding: 0;
    margin: 0
}

body {
    -webkit-overflow-scrolling: auto;
    font-size: 1rem;
    font-family: "Lato", sans-serif;
    font-weight: 400;
    color: #434549
}

.container {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%
}

@media (min-width:1101px) {
    .container {
        padding: 0 5.2083%
    }
}

@media (max-width:1100px) {
    .container {
        padding: 0 16px
    }
}

*,
a:active,
a:focus {
    outline: 0!important
}

:focus {
    -webkit-box-shadow: none!important;
    box-shadow: none!important
}

* {
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none
}

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

input[type=number] {
    -moz-appearance: textfield
}

input:-webkit-autofill,
input:-webkit-autofill:active,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover {
    -webkit-transition: all 5000s ease-in-out 0s;
    transition: all 5000s ease-in-out 0s;
    -webkit-transition-property: background-color, color;
    transition-property: background-color, color
}

a,
a:focus,
a:hover,
a:visited {
    text-decoration: none
}

a {
    color: #434549;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    cursor: pointer
}

a:hover {
    color: #054733
}

blockquote,
dd,
div,
dl,
dt,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
pre,
textarea,
ul {
    margin: 0;
    padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    line-height: 1.4
}

.clear {
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0
}

ol,
ul {
    list-style: none
}

img {
    border: none;
    max-width: 100%
}

input {
    color: #333
}

select::-ms-expand {
    display: none
}

button {
    border: none;
    background: none;
    padding: 0
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Black.eot");
    src: url("../fonts/lato/Lato-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Black.woff2") format("woff2"), url("../fonts/lato/Lato-Black.woff") format("woff"), url("../fonts/lato/Lato-Black.ttf") format("truetype"), url("../fonts/lato/Lato-Black.svg#Lato-Black") format("svg");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Bold.eot");
    src: url("../fonts/lato/Lato-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Bold.woff2") format("woff2"), url("../fonts/lato/Lato-Bold.woff") format("woff"), url("../fonts/lato/Lato-Bold.ttf") format("truetype"), url("../fonts/lato/Lato-Bold.svg#Lato-Bold") format("svg");
    font-weight: bold;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato Hairline";
    src: url("../fonts/lato/Lato-Hairline.eot");
    src: url("../fonts/lato/Lato-Hairline.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Hairline.woff2") format("woff2"), url("../fonts/lato/Lato-Hairline.woff") format("woff"), url("../fonts/lato/Lato-Hairline.ttf") format("truetype"), url("../fonts/lato/Lato-Hairline.svg#Lato-Hairline") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Heavy.eot");
    src: url("../fonts/lato/Lato-Heavy.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Heavy.woff2") format("woff2"), url("../fonts/lato/Lato-Heavy.woff") format("woff"), url("../fonts/lato/Lato-Heavy.ttf") format("truetype"), url("../fonts/lato/Lato-Heavy.svg#Lato-Heavy") format("svg");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Italic.eot");
    src: url("../fonts/lato/Lato-Italic.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Italic.woff2") format("woff2"), url("../fonts/lato/Lato-Italic.woff") format("woff"), url("../fonts/lato/Lato-Italic.ttf") format("truetype"), url("../fonts/lato/Lato-Italic.svg#Lato-Italic") format("svg");
    font-weight: normal;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Light.eot");
    src: url("../fonts/lato/Lato-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Light.woff2") format("woff2"), url("../fonts/lato/Lato-Light.woff") format("woff"), url("../fonts/lato/Lato-Light.ttf") format("truetype"), url("../fonts/lato/Lato-Light.svg#Lato-Light") format("svg");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Medium.eot");
    src: url("../fonts/lato/Lato-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Medium.woff2") format("woff2"), url("../fonts/lato/Lato-Medium.woff") format("woff"), url("../fonts/lato/Lato-Medium.ttf") format("truetype"), url("../fonts/lato/Lato-Medium.svg#Lato-Medium") format("svg");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Regular.eot");
    src: url("../fonts/lato/Lato-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Regular.woff2") format("woff2"), url("../fonts/lato/Lato-Regular.woff") format("woff"), url("../fonts/lato/Lato-Regular.ttf") format("truetype"), url("../fonts/lato/Lato-Regular.svg#Lato-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Semibold.eot");
    src: url("../fonts/lato/Lato-Semibold.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Semibold.woff2") format("woff2"), url("../fonts/lato/Lato-Semibold.woff") format("woff"), url("../fonts/lato/Lato-Semibold.ttf") format("truetype"), url("../fonts/lato/Lato-Semibold.svg#Lato-Semibold") format("svg");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Lato";
    src: url("../fonts/lato/Lato-Thin.eot");
    src: url("../fonts/lato/Lato-Thin.eot?#iefix") format("embedded-opentype"), url("../fonts/lato/Lato-Thin.woff2") format("woff2"), url("../fonts/lato/Lato-Thin.woff") format("woff"), url("../fonts/lato/Lato-Thin.ttf") format("truetype"), url("../fonts/lato/Lato-Thin.svg#Lato-Thin") format("svg");
    font-weight: 100;
    font-style: normal;
    font-display: swap
}

@media (max-width:991px) {
    .no-scroll-991 {
        overflow: hidden!important;
        inset: -808px 0 0
    }
}

@supports (-webkit-backdrop-filter:blur(1px)) {
    svg {
        height: intrinsic
    }
}

.des,
.tend,
.tend a {
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box
}

.img-wrap {
    position: relative;
    overflow: hidden;
    width: 100%
}

.cl-white,
.cl-white *,
.cl-white a:hover,
a.cl-white {
    color: #FFF!important
}

.cl-black,
.cl-black *,
.cl-black a:hover,
a.cl-black {
    color: #434549
}

.cl-green {
    color: #054733
}

.cl-brown {
    color: #DCA869
}

.img.full-frame {
    display: block;
    position: relative;
    overflow: hidden
}

.img.full-frame img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.dis-inline {
    display: inline-block
}

.isMobile .dis-inline {
    display: inline!important
}

@media (max-width:1100px) {
    .zindex-higher {
        position: relative;
        z-index: 3
    }
}

.white-bg {
    background-color: #FFF
}

.row,
.sl-gen:not(.no-space) .slick-list {
    margin: 0 -15px!important
}

@media (max-width:991px) {
    .row,
    .sl-gen:not(.no-space) .slick-list {
        margin: 0 -10px!important
    }
}

.row [class^=col-],
.sl-gen:not(.no-space) .item {
    padding-left: 15px!important;
    padding-right: 15px!important
}

@media (max-width:991px) {
    .row [class^=col-],
    .sl-gen:not(.no-space) .item {
        padding-left: 10px!important;
        padding-right: 10px!important
    }
}

.slick-slide img {
    display: inline-block
}

.slick-init .item {
    display: none
}

.slick-init .item.slick-slide,
.slick-init .item:first-child {
    display: block
}

.slick-arrow {
    border: none;
    position: absolute;
    top: 50%;
    width: 22px;
    height: 56px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 0;
    z-index: 5;
    -moz-transform: all 0.3s linear;
    -ms-transform: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

.slick-arrow.slick-prev {
    left: 0;
    background-image: url(../images/icon/previous.svg)
}

.slick-arrow.slick-next {
    right: 0;
    background-image: url(../images/icon/next.svg)
}

.slick-arrow.slick-disabled {
    opacity: 0.4;
    cursor: default
}

.slick-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    z-index: 5
}

.slick-dots li {
    display: inline-block;
    margin: 0 6px
}

.slick-dots li button {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    border: none;
    font-size: 0;
    padding: 0;
    background-color: #054733;
    opacity: 0.5;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

.slick-dots li.slick-active button {
    width: 16px;
    height: 16px;
    opacity: 1
}

.view-col .item {
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: flex!important
}

.box-title {
    position: relative;
    padding-bottom: 24px;
    margin-bottom: 24px;
    background: url(../images/line.png) 0 bottom/auto 16px no-repeat
}

.box-title.text-center {
    background-position: center bottom
}

@media (max-width:1400px) {
    .box-title {
        background-size: auto 12px
    }
}

@media (max-width:1100px) {
    .box-title {
        background-size: auto 10px;
        background-position: center bottom
    }
}

.box-title .title {
    font-size: 2.1875vw;
    line-height: 1.55;
    font-weight: 400
}

@media (max-width:1600px) {
    .box-title .title {
        font-size: 2.25rem
    }
}

@media (max-width:1100px) {
    .box-title .title {
        font-size: 1.875rem;
        line-height: 1.3
    }
}

@media (max-width:420px) {
    .box-title .title {
        font-size: 7vw
    }
}

.box-title.color {
    background-image: url(../images/black-line.png)
}

.box-title.white {
    background-image: url(../images/white-line.png)
}

@media (min-width:1200px) {
    .box-title.medium .title {
        font-size: 2rem
    }
}

@media (max-width:1199px) {
    .box-title.medium .title {
        font-size: 1.675rem
    }
}

@media (max-width:991px) {
    .box-title.medium .title {
        font-size: 1.5rem
    }
}

.button-contact {
    display: block;
    width: 190px;
    height: 48px;
    line-height: 48px;
    font-size: 1.125rem;
    color: #DCA869;
    border: 1px solid #DCA869;
    border-radius: 40px;
    text-align: center;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    cursor: pointer;
    white-space: nowrap;
    margin: 0 auto;
}

.button-contact:hover {
    background-color: #DCA869;
    color: #FFF
}

@media (max-width:1100px) {
    .button-contact {
        height: 40px;
        line-height: 40px;
        font-size: 1rem;
        min-width: 150px
    }
}

.button-web {
    display: block;
    min-width: 190px;
    padding: 0 28px;
    height: 48px;
    line-height: 48px;
    font-size: 1.125rem;
    color: #DCA869;
    border: 1px solid #DCA869;
    background-color: #FFF;
    border-radius: 40px;
    text-align: center;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    cursor: pointer;
    white-space: nowrap
}

.button-web:hover {
    background-color: #DCA869;
    color: #FFF
}

@media (max-width:1100px) {
    .button-web {
        height: 40px;
        line-height: 40px;
        font-size: 1rem;
        min-width: 150px
    }
}

.button-arrow {
    display: inline-block;
    font-weight: 600;
    position: relative;
    padding: 10px 24px;
    color: #FFF;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    border: 0.075rem solid #FFFFFF;
    border-radius: 40px;
    overflow: hidden
}

.button-arrow:before {
    position: absolute;
    content: "";
    top: 0;
    right: -44px;
    bottom: 0;
    width: 41px;
    border-radius: 100%;
    background-color: #DCA869;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0
}

.button-arrow span {
    display: inline-block;
    position: relative;
    z-index: 1;
    padding-right: 16px
}

.button-arrow span:after {
    position: absolute;
    top: 50%;
    right: 0;
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-top: -6px;
    content: "";
    background: url(../images/icon/arr-right.svg) right center no-repeat;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s
}

.button-arrow.color {
    border: 0.075rem solid #434549
}

.button-arrow.color span:after {
    background-image: url(../images/icon/arr-right-black.svg)
}

.button-arrow:hover {
    padding-right: 36px;
    background-color: #FFF;
    border-color: #FFF!important
}

.button-arrow:hover:before {
    opacity: 1;
    right: 0
}

.button-arrow:hover span {
    color: #DCA869!important
}

.button-arrow:hover span:after {
    -webkit-transform: translateX(20px) rotate(45deg);
    transform: translateX(20px) rotate(45deg);
    background-image: url(../images/icon/arr-right.svg)!important
}

@media (max-width:991px) {
    .button-arrow {
        padding: 8px 16px
    }
    .button-arrow:before {
        width: 38px
    }
    .button-arrow:hover span:after {
        -webkit-transform: translateX(23px) rotate(45deg);
        transform: translateX(23px) rotate(45deg)
    }
}

.button-txt {
    display: inline-block;
    position: relative;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.25;
    padding-left: 38px;
    text-transform: uppercase
}

.button-txt:after,
.button-txt:before {
    position: absolute;
    content: "";
    bottom: 4px;
    height: 3px;
    background-color: #434549;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

.button-txt:before {
    left: 0;
    width: 32px
}

.button-txt:after {
    right: 0;
    opacity: 0;
    width: 0
}

.button-txt:hover {
    padding-left: 0!important;
    padding-right: 38px
}

.button-txt:hover:before {
    width: 0!important
}

.button-txt:hover:after {
    opacity: 1;
    width: 32px
}

.button-txt.color {
    color: #DCA869;
    padding-left: 120px
}

.button-txt.color:after,
.button-txt.color:before {
    background-color: #DCA869
}

.button-txt.color:hover {
    padding-right: 120px
}

.button-txt.color:before,
.button-txt.color:hover:after {
    width: 114px
}

.desc ol,
.desc ul {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 1rem
}

.desc ol li,
.desc ul li {
    position: relative;
    margin-top: 0.4rem
}

.desc ol li:before,
.desc ul li:before {
    position: absolute;
    left: 0;
    display: inline-block;
    content: ""
}

.desc ol.no-list li,
.desc ul.no-list li {
    padding: 0
}

.desc ol.no-list li:before,
.desc ul.no-list li:before {
    display: none
}

.desc ul li {
    padding-left: 10px
}

.desc ul li:before {
    top: 8px;
    width: 4px;
    height: 4px;
    background-color: #054733;
    border-radius: 100%;
    margin-right: 10px
}

.desc ol {
    counter-reset: list
}

.desc ol li {
    padding-left: 16px
}

.desc ol li:before {
    top: 0;
    counter-increment: list;
    content: counters(list, ".") ". ";
    color: #054733
}

.desc .h1,
.desc .h2,
.desc .h3,
.desc .h4,
.desc .h5,
.desc .h6,
.desc h1,
.desc h2,
.desc h3,
.desc h4,
.desc h5,
.desc h6 {
    margin-bottom: 1rem
}

.desc h2 {
    font-size: 30px
}

@media (max-width:991px) {
    .desc h2 {
        font-size: 24px
    }
}

.desc h3 {
    font-size: 20px
}

.desc h4 {
    font-size: 18px
}

.flex-hidden {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media (min-width:1101px) {
    .lazyloading {
        filter: alpha(opacity=0);
        opacity: 0
    }
    .lazy-start {
        -webkit-animation-duration: 1.2s;
        animation-duration: 1.2s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both
    }
}

.scale-animate {
    display: block;
    position: relative;
    overflow: hidden
}

.scale-animate img {
    -webkit-transition: transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86);
    -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86);
    transition: -webkit-transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86);
    transition: transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86);
    transition: transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86), -webkit-transform 0.8s cubic-bezier(0.44, 0.185, 0.575, 0.86);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.scale-animate:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.scale-animate.diagonal:hover img {
    -webkit-transform: scale(1.15) rotate(10deg);
    transform: scale(1.15) rotate(10deg)
}

.fancybox-slide {
    padding: 0
}

.fancybox-content {
    background: none;
    opacity: 0;
    padding: 0
}

@media (min-width:1101px) {
    .fancybox-content {
        padding: 20px 0
    }
}

.fancybox-is-open .fancybox-content {
    -webkit-animation: fadeIn;
    animation: fadeIn;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-duration: 1.2s;
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    overflow: visible
}

.fancybox-bg {
    opacity: 1;
    height: 0;
    top: auto;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    background-color: rgba(0, 0, 0, 0.46)
}

.fancybox-is-open .fancybox-bg {
    opacity: 1;
    height: 100%
}

.fancybox-active {
    overflow: hidden
}

.fancybox-button--close,
.fancybox-close-small {
    padding: 0.625vw!important;
    opacity: 1!important
}

.fancybox-button--close svg,
.fancybox-close-small svg {
    display: none!important
}

.fancybox-can-pan .fancybox-content,
.fancybox-can-swipe .fancybox-content {
    cursor: default
}

.fancybox-button--close,
.fancybox-is-open .fancybox-close-small {
    top: 20px;
    right: 20px;
    width: 3.125vw;
    height: 3.125vw;
    border-radius: 100%;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out
}

.fancybox-button--close:hover,
.fancybox-is-open .fancybox-close-small:hover {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.fancybox-button--close {
    position: fixed;
    background: #054733 url(../images/icon/close-icon.svg) center center/35% no-repeat!important
}

.fancybox-is-open .fancybox-close-small {
    top: 36px;
    right: 36px;
    background: url(../images/icon/close-icon-color.svg) center center/22px no-repeat!important
}

.my-fancybox .fancybox-bg {
    background: url(../images/popup-bg.jpg) 0 bottom/cover no-repeat
}

.my-fancybox .fancybox-bg:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    background-color: rgba(205, 216, 202, 0.96)
}

.my-fancybox .fancybox-caption__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #434549;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 1.25vw;
    font-weight: 500;
    -webkit-line-clamp: 1;
    max-height: 36px;
    pointer-events: none
}

.my-fancybox .fancybox-caption__body .slide-count {
    margin-left: 30px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.fancybox-caption__body,
.my-fancybox .fb-caption {
    color: #ccc;
    text-transform: uppercase
}

.my-fancybox .fb-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -30px;
    z-index: 99996;
    pointer-events: none;
    text-align: center;
    -webkit-transition: opacity 200ms;
    transition: opacity 200ms;
    background: none;
    padding: 15px 44px
}

.my-fancybox.fancybox-is-open .fancybox-bg,
.my-fancybox.fancybox-is-open .fancybox-infobar,
.my-fancybox.fancybox-is-open .fancybox-navigation .fancybox-button,
.my-fancybox.fancybox-is-open .fancybox-toolbar {
    opacity: 1!important;
    visibility: visible!important
}

.my-fancybox .fancybox-stage {
    bottom: 50px
}

.my-fancybox.fancybox-show-thumbs .fancybox-stage {
    top: 13.87vh;
    bottom: 15.47vh;
    max-width: 80vw;
    left: 50%;
    margin-left: -40vw
}

.my-fancybox .fancybox-caption {
    bottom: auto;
    top: 5.34vh;
    padding: 0 44px;
    margin: 0;
    color: #434549;
    background: none
}

.my-fancybox .fancybox-thumbs__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto
}

.my-fancybox .fancybox-thumbs__list a {
    float: none;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 10.67vh;
    border-radius: 4px;
    margin: 0 0.52083vw
}

.my-fancybox .fancybox-thumbs__list a:before {
    border: 3px solid #DCA869
}

.my-fancybox .fancybox-thumbs__list a:first-child {
    padding-left: 0
}

.my-fancybox .fancybox-thumbs__list a:last-child {
    padding-right: 0
}

.my-fancybox .fancybox-thumbs {
    top: auto;
    width: auto;
    bottom: 4.8vh;
    left: 0;
    right: 0;
    height: 7.9vh;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: none;
    text-align: center
}

.my-fancybox .fancybox-show-thumbs .fancybox-inner {
    right: 0;
    bottom: 75px
}

.my-fancybox .fancybox-content {
    width: 100%;
    overflow: visible;
    background: rgba(0, 0, 0, 0.8)
}

.my-fancybox .fancybox-button {
    background: none
}

.my-fancybox .fancybox-navigation .fancybox-button {
    width: 22px;
    height: 56px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.my-fancybox.fancybox-show-thumbs .fancybox-inner {
    right: 0
}

.my-fancybox .fancybox-navigation .fancybox-button:not(:hover) {
    -webkit-filter: invert(1) brightness(5);
    filter: invert(1) brightness(5)
}

.my-fancybox .fancybox-button--arrow_left {
    left: 10.83vw;
    background: url(../images/icon/previous.svg) center center/auto 60px no-repeat
}

.my-fancybox .fancybox-button--arrow_right {
    right: 10.83vw;
    background: url(../images/icon/next.svg) center center/auto 60px no-repeat
}

.my-fancybox .fancybox-button,
.my-fancybox .fancybox-button:link,
.my-fancybox .fancybox-button:visited {
    color: #054733
}

.my-fancybox .fancybox-close {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    opacity: 1!important;
    background: url(../images/icon/w-close-icon.png) center center/contain no-repeat
}

.my-fancybox .fancybox-slide--image {
    padding-bottom: 0!important
}

.my-fancybox .fancybox-slide--image .fancybox-content {
    border-radius: 20px;
    overflow: hidden
}

.my-fancybox .fancybox-infobar {
    top: auto;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.fancybox-thumbs-x::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #efefef;
    border-radius: 2px
}

.fancybox-thumbs-x::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #e9c669;
    border-radius: 2px
}

.fancybox-thumbs-x::-webkit-scrollbar {
    background-color: #F5F5F5;
    border-radius: 2px
}

.show-album .has-note .tend {
    position: absolute;
    left: 0;
    bottom: 15px;
    font-size: 1rem;
    color: #FFF
}

@media (max-width:767px) {
    .show-album .has-note .tend {
        font-size: 0.875rem;
        bottom: 10px
    }
}

body:not(.show-album) .has-note .tend {
    display: none
}

@media (min-width:1101px) {
    .my-fancybox .fancybox-thumbs {
        top: auto;
        width: auto;
        max-width: 62.5vw;
        bottom: 4.8vh;
        left: 50%;
        right: auto;
        height: 7.9vh;
        padding: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: none;
        text-align: center;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
    .fancybox-thumbs-x::-webkit-scrollbar {
        height: 0
    }
    .fancybox-thumbs-x:hover::-webkit-scrollbar {
        height: 5px
    }
}

@media (min-width:1920px) {
    .fancybox-button--close,
    .fancybox-is-open .fancybox-close-small {
        width: 60px;
        height: 60px
    }
}

@media (max-width:1440px) {
    .my-fancybox .fancybox-caption__body {
        font-size: 1.5rem
    }
}

@media (max-width:1100px) {
    .fancybox-button--close,
    .fancybox-is-open .fancybox-close-small {
        width: 50px;
        height: 50px;
        padding: 8px!important
    }
    .fancybox-is-open .fancybox-close-small {
        top: 20px;
        right: 30px
    }
    .my-fancybox .fancybox-caption__body {
        font-size: 1.125rem;
        max-height: 28px;
        -webkit-line-clamp: 2;
        max-height: 54px
    }
    .my-fancybox .fancybox-button--arrow_left {
        left: 0
    }
    .my-fancybox .fancybox-button--arrow_right {
        right: 0
    }
    .fancybox-thumbs-x::-webkit-scrollbar {
        height: 5px
    }
}

@media (max-width:767px) {
    .fancybox-button--close,
    .fancybox-is-open .fancybox-close-small {
        top: 10px;
        right: 10px;
        width: 40px;
        height: 40px;
        padding: 10px!important
    }
    .fancybox-is-open .fancybox-close-small {
        position: fixed;
        right: 10px
    }
}

@media (min-width:1101px) {
    .show-blur #header,
    .show-blur #header .sticker {
        z-index: 99993!important
    }
}

@media (max-width:767px) {
    .show-blur .link-register {
        display: none
    }
}

.show-blur #main {
    -webkit-filter: blur(3px);
    filter: blur(3px)
}

@media (min-width:1101px) {
    .show-blur .fancybox-slide {
        padding-top: 96px
    }
}

.menu-tab {
    margin-bottom: 40px
}

.menu-tab:not(.sub-tab) ul {
    padding: 8px;
    background-color: #CDD8CA;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    border-radius: 40px
}

.menu-tab:not(.sub-tab) li {
    margin: 0
}

.menu-tab:not(.sub-tab) li a {
    display: block;
    padding: 12px 40px;
    font-size: 0.875rem;
    color: #434549;
    line-height: 1.2;
    min-width: 120px;
    border-radius: 50px;
    white-space: nowrap
}

.menu-tab:not(.sub-tab) li a.active {
    background-color: #DCA869;
    color: #FFF
}

@media (max-width:575px) {
    .menu-tab:not(.sub-tab) li a {
        padding-left: 12px;
        padding-right: 12px
    }
}

.sub-tab li~li {
    margin-left: 60px
}

@media (max-width:575px) {
    .sub-tab li~li {
        margin-left: 24px
    }
}

.sub-tab li a {
    font-size: 0.875rem;
    padding-bottom: 8px;
    position: relative
}

.sub-tab li a:after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: "";
    width: 100%;
    height: 1px
}

@media (min-width:1101px) {
    .sub-tab li a {
        font-size: 1.125rem
    }
}

.sub-tab li a.active:after,
.sub-tab li:hover:after {
    background-color: #434549
}

.modal {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.modal-open,
.modal-open .modal {
    padding: 0!important
}

.modal-open {
    overflow: hidden!important
}

.modal-open #wrapper {
    -webkit-filter: blur(3px);
    filter: blur(3px)
}

.modal .modal-dialog {
    max-width: 100%
}

.modal .modal-content {
    width: 100%;
    margin: auto;
    background: rgba(255, 255, 255, 0.86);
    border-radius: 20px;
    border: none
}

.modal .close-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 100;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    background: #054733 url(../images/icon/close-icon.svg) center center/35% no-repeat!important;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out
}

.modal .close-icon:hover {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}
.modal-homepage .modal-body img{
    display: block;
    margin: 0 auto;
    text-align: center;
}
@media (max-width:767px) {
    .modal .close-icon {
        top: 10px;
        right: 10px;
        width: 40px;
        height: 40px;
        padding: 10px
    }
}

.content-modal .modal-dialog {
    max-width: 1000px
}

.content-modal .modal-content {
    padding: 36px 12%;
    background: url(../images/bg.jpg) center center repeat-y
}

@media (max-width:767px) {
    .content-modal .modal-content {
        padding: 36px 0 0
    }
}

.content-modal .modal-content .desc h2,
.content-modal .modal-content .desc h3,
.content-modal .modal-content .desc h4,
.content-modal .modal-content .desc h5,
.content-modal .modal-content .desc h6 {
    color: #054733
}

.menu-mobile {
    overflow: hidden;
    width: 30px;
    height: 60px;
    cursor: pointer;
    transition: 0.6s opacity cubic-bezier(0.19, 1, 0.22, 1), 0.4s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -webkit-transition: 0.6s opacity cubic-bezier(0.19, 1, 0.22, 1), 0.4s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 0.4s transform cubic-bezier(0.785, 0.135, 0.15, 0.86), 0.6s opacity cubic-bezier(0.19, 1, 0.22, 1);
    transition: 0.4s transform cubic-bezier(0.785, 0.135, 0.15, 0.86), 0.6s opacity cubic-bezier(0.19, 1, 0.22, 1), 0.4s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.menu-mobile .icon-menu {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.menu-mobile .icon-menu:before {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 30px;
    height: 2px;
    margin-top: -1px;
    background-color: #434549;
    content: "";
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.menu-mobile .icon-menu .style-icon:after,
.menu-mobile .icon-menu .style-icon:before {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #434549;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.menu-mobile .icon-menu .style-icon:before {
    top: 50%;
    margin-top: -9px
}

.menu-mobile .icon-menu .style-icon:after {
    top: 50%;
    margin-top: 7px
}

.menu-mobile.showmenu {
    width: 60px;
    background-color: #054733;
    border-radius: 100%
}

.menu-mobile.showmenu .icon-menu:before {
    display: none
}

.menu-mobile.showmenu .icon-menu .style-icon:after,
.menu-mobile.showmenu .icon-menu .style-icon:before {
    height: 2px;
    left: 15px;
    background-color: #FFF;
    margin-top: 0
}

.menu-mobile.showmenu .icon-menu .style-icon:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center;
    transform-origin: center
}

.menu-mobile.showmenu .icon-menu .style-icon:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: center;
    transform-origin: center
}

.start {
    position: fixed;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 4.6%
}

.start .enter {
    font-size: 1.125rem;
    line-height: 1.4
}

.wheel {
    width: 44px;
    height: 42px;
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
    margin-top: 12px
}

.wheel .arrow {
    opacity: 0;
    -webkit-animation: Move-Arrow 1.4s linear infinite;
    animation: Move-Arrow 1.4s linear infinite;
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
    -webkit-transform-origin: center 0;
    transform-origin: center 0
}

.wheel .arrow:nth-child(3) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s
}

.wheel .arrow:nth-child(4) {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s
}

#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 1001;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0
}

#loading .bg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: inline-block;
    -webkit-transform-origin: 50%;
    transform-origin: 50%
}

#loading .notesB {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0
}

#loading .inner {
    width: 24.27vw;
    max-width: 466px;
    margin: auto
}

@media (max-width:991px) {
    #loading .inner {
        width: 60%;
        max-width: 250px
    }
}

#loading #mylogo {
    width: 100%;
    display: inline-block
}

#loading svg {
    width: 100%;
    height: 100%;
    overflow: visible
}

#loading #dragon-fly path {
    fill: #dca769
}

#loading .swing {
    -webkit-animation: fly 0.2s infinite;
    animation: fly 0.2s infinite
}

#loading #big-text path {
    fill: #125646
}

#loading #small-text path {
    fill: #58585a
}

#loading .loading-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0
}

#loading .loading-video video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%!important;
    height: 100%!important;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 1;
    pointer-events: none
}

.end-load-start #loading {
    pointer-events: none
}

#header {
    background-color: #FFF
}

@media (min-width:1101px) {
    #header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000!important;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@media (max-width:1100px) {
    #header {
        min-height: 70px;
        -webkit-transform: none!important;
        transform: none!important
    }
}

#header .sticker {
    background-color: #FFF;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16)
}

#header .main-head {
    position: relative;
    width: 100%;
    height: 96px;
    padding: 0 5.2083%;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease
}

@media (max-width:1100px) {
    #header .main-head {
        height: 70px;
        padding: 0 16px
    }
}

@media (min-width:1101px) {
    #header .main-head .header-tools,
    #header .main-head .logo {
        -webkit-box-flex: 1;
        -ms-flex: 1 0 130px;
        flex: 1 0 130px
    }
}

#header .main-head .logo img {
    max-height: 70px;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

@media (max-width:1100px) {
    #header .main-head .logo img {
        max-height: 40px
    }
}

#header .main-head .logo-zenity {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0 5%
}

#header .main-head .logo-zenity img {
    max-height: 76px;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

@media (max-width:1100px) {
    #header .main-head .logo-zenity img {
        max-height: 45px
    }
}

#header .main-head .language {
    position: relative;
    top: 2px
}

@media (max-width:1100px) {
    #header .main-head .language {
        margin-right: 16px
    }
}

#header .main-head .language a {
    color: #969696;
    line-height: 1.2;
    position: relative;
    padding: 0 5px;
    font-size: 1.125rem;
    font-weight: 500
}

@media (max-width:767px) {
    #header .main-head .language a {
        padding: 0 2px;
        font-size: 1rem
    }
}

#header .main-head .language a.active {
    font-weight: 700;
    color: #054733;
    pointer-events: none;
}

#header .main-head .language .language-item~.language-item {
    margin-left: 20px
}

#header .main-head .language .language-item~.language-item:before {
    position: absolute;
    top: 50%;
    left: -10px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    content: "";
    width: 1px;
    height: 90%;
    background-color: #7A7979;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease
}


/* #header .main-head .language a:first-child.active+a:before,
#header .main-head .language a:first-child:hover+a:before {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
} */

@media (min-width:1101px) {
    #header .main-head .link-register {
        margin: 0 30px
    }
}

@media (max-width:1100px) {
    #header .main-head .link-register {
        position: fixed;
        bottom: 5px;
        right: 15px;
        z-index: 50
    }
}

@media (max-width:767px) {
    #header .main-head .link-register {
        left: 15px
    }
}

@media (max-width:767px) {
    #header .main-head .link-register .button-web {
        min-width: 100%;
        padding: 0 16px
    }
}

@media (max-width:1100px) {
    #header.fixed .menu-mobile,
    #header.open-menu .menu-mobile {
        position: relative;
        top: auto;
        margin-top: 0
    }
}

#header.fixed .sticker {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    -webkit-animation: stuckMoveDown 1s;
    animation: stuckMoveDown 1s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

#header.fixed .main-head {
    height: 70px
}

@media (min-width:1101px) {
    #header.fixed .logo img {
        max-height: 50px
    }
}

#header.fixed .logo-zenity {
    text-align: center
}

@media (min-width:1101px) {
    #header.fixed .logo-zenity img {
        max-height: 50px
    }
}

#header.open-menu {
    min-height: 100vh
}

.sub-page #header.fixed {
    -webkit-transform: none!important;
    transform: none!important
}

.menu-nav a {
    display: block;
    position: relative;
    color: #4B4F54;
    font-weight: 400;
    white-space: nowrap
}

.dragon-fly-icons {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    overflow: hidden
}

.dragon-fly-icons .dragon-fly {
    position: absolute
}

.dragon-fly-icons .dragon-fly:first-child {
    left: 0;
    bottom: 0;
    width: 30%
}

.dragon-fly-icons .dragon-fly:nth-child(2) {
    left: 64.375%;
    top: 21%;
    width: 17.86%
}

.dragon-fly-icons .dragon-fly:nth-child(3) {
    left: 84.25%;
    top: 21%;
    width: 10.208%
}

@media (max-width:1100px) {
    .ovh {
        overflow: hidden!important;
        inset: -808px 0 0
    }
    .ovh .overlay {
        position: fixed;
        top: 118px;
        left: 0;
        right: 0;
        bottom: 0;
        content: "";
        z-index: 49;
        background-color: rgba(0, 0, 0, 0.6);
        -webkit-transition: width 0.3s linear;
        transition: width 0.3s linear;
        opacity: 1
    }
}

.navigation {
    position: fixed;
    top: 96px;
    left: 0;
    margin: 0;
    width: 100%;
    height: calc(100% - 96px);
    max-height: calc(100% - 96px);
    -ms-scroll-chaining: none;
    overscroll-behavior: none;
    background-color: #F7F7F7;
    -webkit-transition: opacity 0.5s linear;
    transition: opacity 0.5s linear;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 0;
    pointer-events: none;
    z-index: -1
}

.navigation:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    overflow: hidden
}

.navigation:before {
    background: url(../images/bg.jpg) center center repeat-y
}

.open-menu .navigation {
    pointer-events: auto;
    opacity: 1;
    z-index: 100
}

.menu-wrap {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 36px 0;
    text-align: center
}

.menu-wrap:after,
.menu-wrap:before {
    display: inline-block;
    vertical-align: middle;
    content: "";
    height: 100%
}

.menu-nav {
    display: inline-block;
    vertical-align: middle;
    text-align: right;
    height: auto;
    position: relative
}

.menu-nav a,
.menu-nav li {
    position: relative;
    display: block
}

.menu-nav li.active>a,
.menu-nav li:hover>a {
    color: #054733!important
}

.menu-nav li.active>a {
    font-weight: 700
}

.menu-nav>ul:after {
    display: block;
    content: "";
    clear: both
}

.menu-nav>ul>li {
    opacity: 0;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    -webkit-transform-origin: left;
    transform-origin: left
}

.menu-nav>ul>li>a {
    display: inline-block;
    font-size: 3.842vh;
    line-height: 1.2;
    padding: 2vh 0
}

@media (max-width:767px) {
    .menu-nav>ul>li>a {
        font-size: 5vw;
        padding: 3vw 0
    }
}

@media (max-width:575px) {
    .menu-nav>ul>li>a {
        font-size: 6vw
    }
}

.menu-nav ul ul li a {
    font-size: 1.125rem
}

.menu-mobile.showmenu {
    z-index: 1000
}

@media (min-width:1101px) {
    .menu-nav:before {
        position: absolute;
        top: 0;
        width: 1px;
        height: 0;
        right: -4.6875vw;
        content: "";
        background-color: #E9E1D6;
        pointer-events: none;
        -moz-transform: all 0.3s linear;
        -ms-transform: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear
    }
    .menu-nav.menu-has-sub {
        position: relative
    }
    .menu-nav.menu-has-sub:before {
        height: 100%
    }
    .menu-nav .icon-drop {
        display: none
    }
    .menu-nav>ul>li.has-sub>ul:before {
        position: absolute;
        top: 0;
        left: calc(4.6875vw - 2px);
        width: 3px;
        height: 80px;
        content: "";
        pointer-events: none;
        background-color: #DCA869
    }
    .menu-nav ul ul {
        position: absolute;
        display: inherit!important;
        top: 100%;
        left: -9999px;
        min-width: 200px;
        opacity: 0;
        padding: 0;
        padding-left: 9.375vw;
        text-align: left;
        -webkit-transition: opacity 0.3s ease, top 0.4s ease;
        transition: opacity 0.3s ease, top 0.4s ease;
        visibility: hidden;
        z-index: 999;
        pointer-events: none
    }
    .menu-nav ul ul li~li {
        margin-top: 2.134vh
    }
    .menu-nav>ul>li:hover>ul {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 0;
        left: 100%
    }
}

@media (max-width:1100px) {
    .navigation {
        top: 70px;
        height: calc(100% - 70px);
        max-height: calc(100% - 70px)
    }
    .menu-nav {
        margin-right: 0!important
    }
    .menu-nav li .icon-drop {
        position: absolute;
        top: 2.2vh;
        right: -40px;
        width: 40px;
        height: 40px;
        cursor: pointer;
        font-size: 3.842vh
    }
    .menu-nav li .icon-drop:before {
        position: absolute;
        left: 50%;
        top: 52%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        -moz-transform: all 0.3s linear;
        -ms-transform: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear
    }
}

@media (max-width:1100px) and (max-width:767px) {
    .menu-nav li .icon-drop {
        top: 2.5vw;
        font-size: 7vw
    }
}

@media (max-width:1100px) and (max-width:575px) {
    .menu-nav li .icon-drop {
        top: 2vw
    }
}

@media (max-width:1100px) and (max-width:360px) {
    .menu-nav li .icon-drop {
        top: 1.2vw
    }
}

@media (max-width:1100px) {
    .menu-nav li.current>a,
    .menu-nav li.has-sub.current>.icon-drop:before {
        font-weight: 700
    }
}

@media (max-width:1100px) {
    .menu-nav li ul {
        display: none;
        position: relative;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
        padding: 5px 0;
        font-size: 0.938rem
    }
    .menu-nav li ul a {
        padding: 8px 0!important
    }
    .menu-nav li ul li ul {
        border-top: 1px solid rgba(255, 255, 255, 0.3);
        margin-left: 20px
    }
    .menu-nav li ul li .icon-drop {
        top: 0
    }
    .menu-nav li ul.active {
        max-height: 100vh;
        opacity: 1;
        visibility: visible;
        pointer-events: auto
    }
}

@media (max-width:1100px) {
    .menu-nav li.has-sub.current>.icon-drop:before {
        content: "\eacb";
        font-weight: 700
    }
}

#footer {
    background-color: #333132;
    font-size: 0.938rem
}

#footer .title {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.4;
    text-transform: uppercase
}

#footer .main-foot a {
    color: #efeeee!important
}

#footer .main-foot a:hover {
    color: #fff!important;
    text-decoration: underline
}

#footer .main-foot .row-links {
    padding-top: 36px
}

@media (min-width:1240px) {
    #footer .main-foot .row-links {
        margin: 0 -20px!important
    }
}

@media (max-width:991px) {
    #footer .main-foot .row-links {
        padding-top: 24px
    }
}

@media (min-width:992px) {
    #footer .main-foot .row-links .item {
        max-width: 20%
    }
}

@media (min-width:1240px) {
    #footer .main-foot .row-links .item {
        padding: 0 20px!important
    }
}

#footer .main-foot .row-links .title {
    margin-bottom: 16px
}

#footer .box-footer {
    margin-bottom: 36px
}

#footer .bot-link li {
    line-height: 1.3
}

#footer .bot-link li~li {
    padding-top: 8px
}

@media (max-width:991px) {
    #footer .bot-link {
        margin-bottom: 0
    }
    #footer .bot-link .title {
        cursor: pointer;
        position: relative;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        padding: 16px 0;
        margin-bottom: 0
    }
    #footer .bot-link .title:after {
        font-family: "icofont";
        content: "\eac8";
        font-size: 1.25rem;
        font-weight: 400;
        position: absolute;
        top: 50%;
        right: 5px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
    #footer .bot-link.active .title:after {
        content: "\eacb"
    }
    #footer .bot-link .content {
        display: none
    }
    #footer .bot-link.active .content {
        display: block;
        padding-top: 12px;
        margin-bottom: 16px;
        padding-left: 12px
    }
    #footer .bot-link .item:last-child .contentWrap {
        margin-bottom: 24px;
        border-top: 1px solid 1px solid rgba(255, 255, 255, 0.1)
    }
}

#footer .row-bottom {
    padding: 24px 0
}

@media (min-width:992px) {
    #footer .row-bottom {
        border-top: 1px solid rgba(255, 255, 255, 0.3)
    }
}

@media (min-width:992px) {
    #footer .social-links {
        -ms-flex-pack: end;
        -webkit-box-pack: end;
        justify-content: end
    }
}

@media (max-width:991px) {
    #footer .social-links {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

#footer .social-links li:not(:last-child) {
    margin-right: 10px
}

#footer .social-links li a {
    display: block;
    position: relative;
    width: 36px;
    height: 36px;
    text-align: center;
    font-size: 1rem;
    line-height: 34px;
    color: #FFF;
    border-radius: 100%;
    border: 1px solid #FFF;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

#footer .social-links li a:hover {
    text-decoration: none
}

@media (max-width:991px) {
    #footer .footer-menu {
        margin-bottom: 16px
    }
    #footer .footer-menu ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center
    }
}

#footer .footer-menu li {
    display: inline-block;
    padding: 2px 0
}

#footer .footer-menu li:not(:first-child) {
    margin-left: 10px
}

@media (max-width:480px) {
    #footer .footer-menu li:not(:first-child) {
        margin-left: 8px
    }
}

#footer .footer-menu li:not(:last-child) {
    margin-right: 10px
}

@media (max-width:480px) {
    #footer .footer-menu li:not(:last-child) {
        margin-right: 8px
    }
}

#footer .footer-menu li a {
    display: inline-block;
    position: relative
}

@media (max-width:500px) {
    #footer .footer-menu li a {
        font-size: 0.875rem
    }
}

#footer .footer-menu li~li a:before {
    display: inline-block;
    width: 1px;
    content: "";
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: -10px
}

@media (max-width:480px) {
    #footer .footer-menu li~li a:before {
        left: -8px
    }
}

#footer .disclaimer {
    padding: 24px 0;
    background-color: #e6e6e6
}

@media (max-width:991px) {
    #footer .disclaimer {
        font-size: 0.8rem
    }
}

#footer .bottom-foot {
    padding: 36px 0;
    background-color: #FFF
}

#footer .bottom-foot p {
    margin-bottom: 0.2rem
}

@media (max-width:991px) {
    #footer .bottom-foot {
        padding: 24px 0;
        font-size: 0.8rem;
        text-align: center
    }
}

@media (max-width:1100px) {
    #footer .bottom-foot {
        padding-bottom: 64px
    }
}

#footer .address p {
    margin-bottom: 0
}

@media (min-width:992px) {
    #footer .address {
        text-align: right
    }
}

@media (max-width:991px) {
    #footer .address {
        margin-top: 16px
    }
}

@media (max-width:520px) {
    #footer .address {
        font-size: 2.4vw
    }
}

@media (max-width:420px) {
    #footer .address {
        font-size: 2.2vw
    }
}

@media (min-width:1101px) {
    .home-content #footer {
        padding-top: 96px;
        overflow: auto
    }
}

.hotline-fixed {
    width: 41px;
    height: 41px;
    position: fixed;
    right: 15px;
    bottom: 15px;
    border-radius: 100%;
    text-align: center;
    color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 50;
    -webkit-box-shadow: 0 0 20px #caacac;
    box-shadow: 0 0 20px #caacac
}

@media (min-width:1101px) {
    .hotline-fixed {
        display: none
    }
}

.hotline-fixed .fa-ani {
    -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.hotline-fixed:before {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-box-shadow: 0 0 20px #caacac;
    box-shadow: 0 0 20px #caacac;
    content: "";
    left: 0;
    top: 0;
    pointer-events: none;
    border-radius: 100%;
    animation: shadow 1s infinite ease;
    -webkit-animation: shadow 1s infinite ease;
    -moz-animation: shadow 1s infinite ease;
    -o-animation: shadow 1s infinite ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease
}

.hotline-fixed:after {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-box-shadow: 0 0 20px #f5f5f5;
    box-shadow: 0 0 20px #f5f5f5;
    content: "";
    left: 0;
    top: 0;
    pointer-events: none;
    border-radius: 100%;
    animation: shadow 1.4s 1000ms infinite;
    -webkit-animation: shadow 1.4s 1000ms infinite;
    -moz-animation: shadow 1.4s 1000ms infinite;
    -o-animation: shadow 1.4s 1000ms infinite;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.news {
    width: 100%;
    position: relative;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

@media (min-width:992px) {
    .news {
        margin-left: auto;
        margin-right: auto
    }
}

.news .img {
    padding-top: 67%;
    border-radius: 8px
}

.news .date-post {
    position: absolute;
    left: 0;
    top: 0;
    background: #DCA869;
    border-radius: 8px 0px;
    font-size: 0.75rem;
    padding: 13px;
    line-height: 1.2
}

.news .date-post .date {
    font-size: 2rem
}

@media (max-width:1199px) {
    .news .date-post {
        padding: 10px 8px
    }
    .news .date-post .date {
        font-size: 1.5rem
    }
}

@media (max-width:767px) {
    .news .date-post {
        font-size: 0.625rem;
        padding: 8px 4px
    }
    .news .date-post .date {
        font-size: 1.25rem
    }
}

@media (max-width:991px) {
    .news .caption {
        padding-top: 16px
    }
}

.news .tend {
    font-weight: 400;
    font-size: 1.125rem;
    margin-bottom: 10px
}

.news .tend a {
    -webkit-line-clamp: 3;
    max-height: 76px
}

@media (max-width:991px) {
    .news .tend {
        font-size: 1rem
    }
    .news .tend a {
        max-height: 68px
    }
}

.news .des {
    font-size: 0.875rem;
    line-height: 1.45;
    -webkit-line-clamp: 3;
    max-height: 62px
}

.box-news:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    overflow: hidden;
    background: url(../images/bg.jpg) center center repeat
}

@media (min-width:1140px) {
    .box-news .container {
        max-width: 1220px
    }
}

@media (min-width:992px) {
    .box-news .box-title {
        margin-bottom: 36px
    }
}

.box-news .button-txt {
    color: #DCA869
}

.box-news .button-txt:after,
.box-news .button-txt:before {
    background-color: #DCA869
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+2) .news,
    .box-news .item:nth-child(4n+3) .news {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+1) {
        padding-left: 2.9%;
        margin-top: 30px
    }
    .box-news .item:nth-child(4n+1) .img {
        padding-top: 50%
    }
}

.box-news .item:nth-child(4n+1) .caption {
    padding-top: 16px
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+1) .button-txt {
        padding-left: 120px
    }
    .box-news .item:nth-child(4n+1) .button-txt:after,
    .box-news .item:nth-child(4n+1) .button-txt:before {
        background-color: #DCA869
    }
    .box-news .item:nth-child(4n+1) .button-txt:hover {
        padding-right: 120px
    }
    .box-news .item:nth-child(4n+1) .button-txt:before,
    .box-news .item:nth-child(4n+1) .button-txt:hover:after {
        width: 114px
    }
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+2) .img-wrap {
        width: 55%;
        max-width: 300px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin-right: 16px
    }
    .box-news .item:nth-child(4n+2) .img-wrap .img {
        padding-top: 76%
    }
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+3) {
        margin-top: 8.333vw;
        text-align: right
    }
}

.box-news .item:nth-child(4n+3) .news {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+3) .img-wrap {
        width: 53%;
        max-width: 318px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin-left: 16px
    }
    .box-news .item:nth-child(4n+3) .img-wrap .img {
        padding-top: 70%
    }
}

@media (min-width:992px) {
    .box-news .item:nth-child(4n+4) .news {
        padding-right: 12.99%;
        margin-top: -20%
    }
    .box-news .item:nth-child(4n+4) .news .img {
        padding-top: 56%
    }
}

.box-news .item:nth-child(4n+4) .caption {
    padding-top: 16px
}

@media (max-width:991px) {
    .box-news .item:nth-child(n+3) {
        margin-top: 30px
    }
    .box-news .item:first-child {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
    .box-news .item:nth-child(2) {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
    .box-news .item:nth-child(3) {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4
    }
    .box-news .item:nth-child(4) {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }
    .box-news .item:nth-child(5) {
        -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
        order: 6
    }
    .box-news .item:nth-child(6) {
        -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
        order: 5
    }
}

@media (max-width:575px) {
    .box-news .item {
        margin-top: 0!important;
        margin-bottom: 30px
    }
}

.over-bg .bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1
}

@media (max-width:1100px) {
    .over-bg .content-main {
        min-height: 56.25vw
    }
}

.slide {
    position: relative;
    overflow: hidden
}

@media (min-width:1101px) {
    .slides-container {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        z-index: 10
    }
    .slides-container .slide {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden
    }
    .slides-container .content-text {
        position: absolute;
        z-index: 20
    }
    .go-next,
    .go-prev {
        position: absolute;
        cursor: pointer;
        top: 50%
    }
    .go-next {
        left: calc(100% - 32px)
    }
    .nav-dots {
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-40px, -50%);
        transform: translate(-40px, -50%);
        left: 0;
        width: 40px;
        z-index: 100;
        visibility: hidden
    }
    .nav-dots ul {
        margin: 0;
        padding: 0
    }
    .nav-dots li {
        position: relative;
        display: block;
        width: 36px;
        height: 36px;
        margin: 5px 0
    }
    .nav-dots span {
        border-radius: 100%;
        position: absolute;
        z-index: 1;
        height: 36px;
        width: 36px;
        line-height: 36px;
        border: 0;
        left: 50%;
        top: 50%;
        margin: -18px 0 0 -18px;
        color: #FFF;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        text-align: center;
        cursor: pointer
    }
    .nav-dots li span.active,
    .nav-dots li:hover span {
        background-color: #DCA869;
        color: #FFF
    }
    .content-main {
        height: 100%;
        padding: 96px 5.2% 0
    }
    .scrollable-element {
        height: 100%;
        max-height: 100%;
        overflow: hidden;
        overflow-y: auto
    }
}

@media (max-width:1100px) {
    .slides-container .slide {
        height: auto!important
    }
    .slides-container .content-text {
        width: 100%;
        text-align: center;
        padding: 40px 5%
    }
}

@media (min-width:1101px) {
    .home-content .animated {
        opacity: 0
    }
}

@media (max-width:500px) {
    .home-content .box-title .title {
        font-size: 5.6vw
    }
}

.home-content .slide {
    color: #FFF
}

@media (min-width:768px) {
    .home-content .slide .images {
        grid-gap: 16px
    }
    .home-content .slide .images .img-wrap {
        overflow: visible
    }
    .home-content .slide .images .img {
        border-radius: 8px;
        -webkit-box-shadow: 0 10px 40px rgba(5, 71, 51, 0.16);
        box-shadow: 0 10px 40px rgba(5, 71, 51, 0.16)
    }
}

@media (min-width:1101px) {
    .home-content .slide .images {
        position: absolute;
        top: 96px;
        right: 0;
        bottom: 0;
        width: 100%;
        padding: 8.54vh 5.208% 4.8vh 19.11%
    }
}

@media (max-width:1100px) {
    .home-content .slide .images {
        margin: 24px 0 8px;
        padding: 0 16px
    }
}

@media (max-width:767px) {
    .home-content .slide .images {
        grid-gap: 8px
    }
    .home-content .slide .images img {
        border-radius: 5px
    }
}

@media (min-width:1280px) and (max-width:1600px) {
    .home-content .slide .images {
        width: 90%;
        padding-top: 10.67vh
    }
}

@media (orientation:landscape) and (min-width:1101px) and (max-width:1365px) {
    .home-content .slide .images {
        width: 90%
    }
}

@media (max-width:767px) {
    .home-content .slide .des {
        font-size: 0.813rem
    }
}

@media (max-width:575px) {
    .home-content .slide .des br {
        display: none
    }
}

.home-content .slide .link {
    padding-top: 30px
}

.home-content .slide .link-page {
    position: absolute;
    z-index: 20;
    left: 5.2083%;
    bottom: 4.796%;
    letter-spacing: 0.03em
}

@media (max-width:767px) {
    .home-content .slide .link-page {
        font-size: 0.75rem
    }
}

.home-content .over-bg:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 33%;
    content: "";
    pointer-events: none;
    z-index: -1;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45.07%, rgba(0, 0, 0, 0)), color-stop(125.9%, #000000));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45.07%, #000000 125.9%)
}

@media (min-width:1101px) {
    .home-content .over-bg .content-text {
        position: absolute;
        text-align: left;
        padding: 0
    }
}

@media (max-width:1100px) {
    .home-content .slide01 .content-main,
    .home-content .slide02 .content-main {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-bottom: 48px
    }
    .home-content .slide01 .content-main .content-text,
    .home-content .slide02 .content-main .content-text {
        padding-top: 48px
    }
}

@media (min-width:768px) {
    .home-content .slide01 .content-text {
        top: 26%;
        left: 17.7%;
        width: 100%;
        max-width: 550px
    }
}

@media (min-width:768px) {
    .home-content .slide02 .content-text {
        top: 25%;
        right: 13%;
        width: 100%;
        max-width: 600px
    }
}

@media (max-width:767px) {
    .home-content .slide02 .content-text {
        padding-top: 36px
    }
}

.home-content .slide02 .box-title .title {
    letter-spacing: -0.02em
}

.home-content .slide03 {
    background-color: #647362
}

@media (min-width:1101px) {
    .home-content .slide03 .content-text {
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 6.3%;
        width: 100%;
        max-width: 500px
    }
}

@media (min-width:1600px) {
    .home-content .slide03 .content-text {
        max-width: 580px
    }
}

.home-content .slide04 {
    background-color: #CDD8CA
}

@media (min-width:1101px) {
    .home-content .slide04 .content-text {
        top: 18.8%;
        left: 5.2%;
        width: 100%;
        max-width: 420px
    }
}

.home-content .slide04 .img-wrap:first-child {
    width: 24.088%;
    padding-bottom: 11.74vh
}

@media (max-width:1100px) {
    .home-content .slide04 .img-wrap:first-child {
        padding-bottom: 5.729vw
    }
}

.home-content .slide04 .img-wrap:first-child .img {
    padding-top: 100%
}

.home-content .slide04 .img-wrap:nth-child(2) {
    width: 26.15%
}

.home-content .slide04 .img-wrap:nth-child(2) .img:first-child {
    padding-top: 119.74%
}

.home-content .slide04 .img-wrap:nth-child(2) .img:nth-child(2) {
    margin-top: 8px;
    padding-top: 62.63%
}

@media (min-width:768px) {
    .home-content .slide04 .img-wrap:nth-child(2) .img:nth-child(2) {
        margin-top: 16px
    }
}

.home-content .slide04 .img-wrap:nth-child(3) {
    width: 25.8%;
    padding-bottom: 4.27vh
}

@media (max-width:1100px) {
    .home-content .slide04 .img-wrap:nth-child(3) {
        padding-bottom: 2.083vw
    }
}

.home-content .slide04 .img-wrap:nth-child(3) .img {
    padding-top: 148%
}

.home-content .slide04 .img-wrap:nth-child(4) {
    width: 20.65%;
    padding-bottom: 13.34vh
}

@media (max-width:1100px) {
    .home-content .slide04 .img-wrap:nth-child(4) {
        padding-bottom: 4.427vw
    }
}

.home-content .slide04 .img-wrap:nth-child(4) .img {
    padding-top: 140%
}

.box-cover-map .viewer {
    overflow: visible!important
}

.box-cover-map .panzoom,
.box-cover-map .viewer {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute
}

.box-cover-map .map-img {
    width: 1063px;
    height: 716px;
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -531.5px;
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

.box-cover-map .pointer-map {
    width: 7.45%;
    height: 10.5%;
    top: 72.8%;
    left: 25.96%;
    z-index: 10
}

.map-img img {
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto
}

.map-img svg,
.pointer-map {
    position: absolute
}

.map-img svg {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.st-line {
    fill: none;
    stroke-width: 0;
    stroke-dasharray: 0;
    stroke-miterlimit: 10;
    stroke-dashoffset: 0;
    stroke: #285a71
}

.map-svg.show .st-line {
    stroke-dasharray: 10;
    stroke-width: 1;
    -webkit-animation: StrokeLine 3s infinite linear;
    animation: StrokeLine 3s infinite linear
}

.pointer-map .link-detail {
    opacity: 0;
    font-weight: 500;
    font-size: 0.813rem;
    color: #054733;
    line-height: 1;
    text-align: center;
    display: block;
    padding: 11px 15px 9px;
    text-transform: uppercase;
    background-color: #FFF;
    position: absolute;
    top: 50%;
    left: 100%;
    margin: -22px 0 0;
    border-radius: 30px;
    z-index: 20;
    white-space: nowrap;
    -moz-transition: all 0.3s ease-in-out;
    -ms-ms-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transform: scale(0);
    transform: scale(0)
}

.pointer-map:hover .link-detail {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.pointer {
    position: absolute;
    width: 100%;
    height: 100%
}

.pointer .location-icon {
    position: absolute;
    content: "";
    width: 32.6%;
    height: 40.465%;
    left: 50%;
    margin-left: -16.3%;
    bottom: 0;
    background: url(../images/icon/location-icon.svg) center center/contain no-repeat
}

.pointer .pulse {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    width: 70%;
    height: 46.67%;
    position: absolute;
    left: 50%;
    top: 50%;
    content: "";
    margin: 46.67% 0 0 -35%;
    -webkit-transform: rotateX(55deg);
    transform: rotateX(55deg);
    z-index: -2
}

.pointer .pulse:after {
    content: "";
    border-radius: 50%;
    width: 286%;
    height: 286%;
    position: absolute;
    margin: -110% 0 0 -90%;
    -webkit-animation: pulsate 1s ease-out;
    animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-box-shadow: 0 0 1px 2px #FFF;
    box-shadow: 0 0 1px 2px #FFF;
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s
}

@media (max-width:1100px) {
    .pointer .pulse:after {
        margin-left: -140%
    }
}

.pointer:after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 60%;
    z-index: -1;
    background: url(../images/logo-zenity-white-1.svg) center center/90% auto no-repeat
}

@media (min-width:1101px) {
    .box-cover-map {
        width: calc(82.047917% - 500px);
        height: calc(100vh - 214px);
        position: absolute;
        left: 5.2083%;
        bottom: 34px;
        z-index: 5
    }
    .box-cover-map .pointer-map {
        opacity: 0
    }
}

@media (max-width:1100px) {
    .box-cover-map {
        position: relative;
        height: 67.3565380997vw;
        margin: 0;
        width: 100vw;
        overflow: hidden
    }
    .box-cover-map .map-img {
        position: relative;
        width: 100%;
        height: 67.3565380997vw;
        left: auto;
        top: auto;
        margin: 0;
        opacity: 1;
        -webkit-transition: none;
        transition: none
    }
    .box-cover-map .map-img>img {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        display: block
    }
}

@media (min-width:1101px) {
    .slide.active .box-title {
        -webkit-animation-name: scaleLarge;
        animation-name: scaleLarge;
        -webkit-animation-delay: 0.1s;
        animation-delay: 0.1s
    }
    .slide.active .content-text .des {
        -webkit-animation-name: fadeInUp;
        animation-name: fadeInUp;
        -webkit-animation-delay: 0.5s;
        animation-delay: 0.5s
    }
    .slide.active .link {
        -webkit-animation-name: fadeInUp;
        animation-name: fadeInUp;
        -webkit-animation-delay: 0.8s;
        animation-delay: 0.8s
    }
    .slide.active .link-page {
        -webkit-animation-name: fadeInLeft;
        animation-name: fadeInLeft;
        -webkit-animation-delay: 0.8s;
        animation-delay: 0.8s
    }
    .slide.active .pointer-map {
        -webkit-animation-name: bounceInDown;
        animation-name: bounceInDown;
        -webkit-animation-delay: 1s;
        animation-delay: 1s
    }
    .slide.active .images .img-wrap .img {
        -webkit-animation-name: Reveal;
        animation-name: Reveal
    }
    .slide.active .images .img-wrap:first-child .img {
        -webkit-animation-delay: 0.6s;
        animation-delay: 0.6s
    }
    .slide.active .images .img-wrap:nth-child(2) .img {
        -webkit-animation-delay: 0.7s;
        animation-delay: 0.7s
    }
    .slide.active .images .img-wrap:nth-child(3) .img {
        -webkit-animation-delay: 0.8s;
        animation-delay: 0.8s
    }
    .slide.active .images .img-wrap:nth-child(4) .img {
        -webkit-animation-delay: 0.9s;
        animation-delay: 0.9s
    }
    .slide.active .images .img-wrap:nth-child(5) .img {
        -webkit-animation-delay: 1s;
        animation-delay: 1s
    }
    .slide.active .animated {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards
    }
}

@media (min-width:1101px) and (min-width:1101px) {
    .slide.slide01.active .box-title {
        -webkit-animation-delay: 0.5s;
        animation-delay: 0.5s
    }
}

@media (min-width:1101px) and (min-width:1101px) {
    .slide.slide01.active .des {
        -webkit-animation-delay: 0.8s;
        animation-delay: 0.8s
    }
}

@media (min-width:1101px) {
    footer.active .bottom-foot,
    footer.active .disclaimer,
    footer.active .main-foot {
        -webkit-animation-name: fadeIn;
        animation-name: fadeIn;
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s
    }
}

.sub-content .content-main {
    height: auto
}

.sub-content .start {
    position: absolute
}

.box-section {
    overflow: hidden
}

@media (min-width:1101px) {
    .box-section {
        padding-bottom: 60px;
        position: relative;
        width: 100%
    }
    .box-section:first-child {
        padding-top: 156px
    }
}

@media (min-width:1200px) {
    .box-section {
        padding-bottom: 80px
    }
    .box-section:first-child {
        padding-top: 176px
    }
}

@media (max-width:1100px) {
    .box-section {
        padding: 40px 0
    }
    .box-section .content-text {
        text-align: center;
        padding: 48px 5%
    }
}

@media (max-width:767px) {
    .box-section .des {
        font-size: 0.875rem
    }
}

.box-section.full {
    overflow: hidden
}

@media (min-width:1101px) {
    .box-section.full {
        height: 100vh
    }
}

@media (max-width:1100px) {
    .box-section.full.box-video {
        height: 56.25vw
    }
}

.box-section.full video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%!important;
    height: 100%!important;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 1
}

.album {
    position: relative
}

.album a[data-fancybox] {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.album a[data-fancybox] img {
    display: none
}

.album .img {
    padding-top: 100%;
    border-radius: 8px
}

.album .img:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(58.98%, rgba(0, 0, 0, 0)), color-stop(88.18%, rgba(0, 0, 0, 0.3))), -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 58.98%, rgba(0, 0, 0, 0.3) 88.18%), linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

.album .caption {
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 16px
}

.album .tend {
    font-weight: 300;
    font-size: 1.667vw;
    letter-spacing: 0.1em
}

@media (max-width:1100px) {
    .album .tend {
        font-size: 1.5rem
    }
}

@media (max-width:767px) {
    .album .tend {
        font-size: 1.25rem
    }
}

.album:hover .img:after {
    opacity: 0
}

.box-creativity {
    color: #FFF
}

@media (max-width:1100px) {
    .box-creativity {
        padding-top: 0
    }
}

@media (min-width:1101px) {
    .box-creativity .content-main {
        padding-top: 0
    }
}

@media (min-width:1101px) {
    .box-creativity .content-text:before {
        position: absolute;
        top: -6.4vh;
        left: -4.16vw;
        bottom: -4vh;
        right: -4.16vw;
        z-index: -1;
        content: "";
        background: radial-gradient(59.45% 59.45% at 45.72% 48.19%, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 90.03%)
    }
}

.box-creativity .bg:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    pointer-events: none;
    background: #1E1E1E;
    opacity: 0.1
}

@media (max-width:575px) {
    .box-creativity .des br {
        display: none
    }
}

@media (min-width:1101px) {
    .box-creativity .list-album {
        padding-top: 6.83vh
    }
}

@media (min-width:1440px) {
    .box-creativity .list-album {
        padding-top: 10.78vh
    }
}

@media (max-width:1100px) {
    .box-creativity .list-album {
        padding: 0 16px
    }
}

@media (min-width:1300px) {
    .box-creativity .list-album .sl-album:not(.no-space) .slick-list {
        margin: 0 -2.8125vw!important
    }
    .box-creativity .list-album .sl-album:not(.no-space) .item {
        padding-left: 2.8125vw!important;
        padding-right: 2.8125vw!important
    }
}

@media (max-width:991px) {
    .box-creativity .list-album .sl-album:not(.no-space) {
        padding-bottom: 40px
    }
}

@media (max-width:420px) {
    .box-creativity .list-album .sl-album:not(.no-space) .slick-list {
        margin-right: -16px!important;
        padding-right: 25%
    }
}

.web-video {
    position: fixed;
    top: 0;
    left: 0;
    min-height: 100vh;
    height: 100%;
    width: 100%;
    z-index: -1
}

.web-video .video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%!important;
    height: 100%!important;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 1;
    pointer-events: none
}

.box-overview .box-content {
    padding: 48px 24px
}

@media (min-width:1800px) {
    .box-overview .box-content {
        padding-left: 6%;
        padding-right: 6%
    }
}

@media (max-width:1199px) {
    .box-overview .box-content {
        padding: 36px 24px
    }
}

@media (max-width:991px) {
    .box-overview .box-content {
        padding-left: 16px;
        padding-right: 16px
    }
}

@media (max-width:991px) {
    .box-overview .box-title .title {
        font-size: 1.25rem
    }
}

.box-overview .des {
    margin-bottom: 36px
}

@media (min-width:1200px) {
    .box-overview .des {
        margin-bottom: 48px
    }
}

@media (max-width:1800px) {
    .box-overview .des {
        font-size: 0.875rem
    }
}

.box-overview li .txt {
    margin-bottom: 2px
}

.box-overview li .value {
    line-height: 1.4
}

@media (max-width:991px) {
    .box-overview .info-overview {
        padding-top: 16px
    }
}

@media (min-width:1200px) and (max-width:1799px) {
    .box-overview .info-overview {
        padding-left: 6%
    }
}

.box-overview .info-overview .parameters {
    margin-bottom: 48px
}

@media (max-width:991px) {
    .box-overview .info-overview .parameters {
        margin-bottom: 24px
    }
}

.box-overview .parameters .number {
    font-size: 1.875rem;
    line-height: 1.2;
    color: #d7bc8b
}

.box-overview .parameters .number sup {
    font-size: 60%
}

@media (max-width:1199px) {
    .box-overview .parameters .number {
        font-size: 1.5rem
    }
}

@media (max-width:575px) {
    .box-overview .parameters .number {
        font-size: 1.25rem;
        line-height: 1.4
    }
}

.box-overview .parameters .tend {
    line-height: 1.4
}

@media (max-width:1199px) {
    .box-overview .parameters .tend {
        font-size: 0.938rem
    }
}

@media (min-width:575px) {
    .box-overview .parameters .tend br {
        display: none
    }
}

@media (min-width:992px) {
    .box-overview~.box-overview .item:not(:last-child) .info-intro {
        padding-right: 5%
    }
}

@media (max-width:991px) {
    .box-overview~.box-overview {
        padding-top: 0
    }
}

.box-facilities {
    padding-top: 48px
}

@media (max-width:1200px) {
    .box-facilities {
        overflow: hidden
    }
}

@media (max-width:480px) {
    .box-facilities .main-caption {
        font-size: 3.6vw
    }
}

@media (max-width:420px) {
    .box-facilities .box-title .title {
        font-size: 6vw
    }
}

.box-facilities .content {
    padding-top: 16px
}

@media (max-width:1199px) {
    .box-facilities .content {
        padding-top: 48px
    }
}

@media (max-width:720px) {
    .box-facilities .content {
        padding-top: 24px
    }
}

@media (max-width:1199px) {
    .box-facilities .content {
        width: 100%;
        max-width: 960px;
        margin: auto
    }
}

.box-facilities .tend {
    font-size: 1rem;
    font-weight: 500;
    color: #002e19;
    text-transform: uppercase
}

@media (max-width:1199px) {
    .box-facilities .sub-title {
        text-align: center
    }
}

@media (min-width:1200px) {
    .box-facilities .c1 {
        -ms-flex: 0 0 56%;
        -webkit-box-flex: 0;
        flex: 0 0 56%;
        max-width: 56%;
        padding-right: 36px!important
    }
}

.box-facilities .c1 .item .faci-item {
    padding: 16px 0;
    border-top: 1px dotted #ce822b
}

.box-facilities .c1 .item:first-child .faci-item {
    border: none
}

@media (min-width:768px) {
    .box-facilities .c1 .item:nth-child(2) .faci-item {
        border: none
    }
}

.box-facilities .c1 .item .icon {
    width: 20%;
    max-width: 50px;
    margin-right: 12px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.box-facilities .c1 .item .des {
    font-size: 0.875rem;
    line-height: 1.3
}

.box-facilities .c2 {
    z-index: 1
}

@media (min-width:1200px) {
    .box-facilities .c2 {
        -ms-flex: 0 0 44%;
        -webkit-box-flex: 0;
        flex: 0 0 44%;
        max-width: 44%
    }
}

@media (min-width:1280px) {
    .box-facilities .c2 {
        padding-left: 30px!important
    }
}

.box-facilities .circles {
    width: 100%;
    max-width: 450px;
    margin: auto
}

@media (min-width:1800px) {
    .box-facilities .circles {
        max-width: 570px
    }
}

@media (max-width:575px) {
    .box-facilities .circles {
        left: 4%;
        width: 96%
    }
}

.box-facilities .circles .circle {
    padding-top: 100%
}

.box-facilities .circles .circle.blur .dot {
    opacity: 0.4
}

.box-facilities .circles .circle.blur .dot.show,
.box-facilities .circles .circle.blur .dot.show * {
    opacity: 1
}

.box-facilities .circles .cir-bg {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto
}

@media (min-width:721px) {
    .box-facilities .circles .cir-bg {
        -webkit-transform: scale(1, 1)!important;
        transform: scale(1, 1)!important
    }
}

@media (max-width:575px) {
    .box-facilities .circles .cir-bg {
        width: 475px;
        height: 475px
    }
}

.box-facilities .circles .logo-icon {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 15%
}

.box-facilities .circles .logo-icon img {
    max-height: 50px
}

.box-facilities .circles .direction {
    bottom: -24px;
    right: 0;
    width: 7.4%
}

@media (max-width:720px) {
    .box-facilities .circles .direction {
        bottom: 0
    }
}

@media (max-width:575px) {
    .box-facilities .circles .direction {
        right: 24px
    }
}

.box-facilities .circles .direction img {
    max-height: 50px;
    -moz-transform: all 0.3s linear;
    -ms-transform: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

.box-facilities .circles .dots-wrap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media (min-width:721px) {
    .box-facilities .circles .dots-wrap {
        -webkit-transform: scale(1, 1)!important;
        transform: scale(1, 1)!important
    }
}

@media (max-width:575px) {
    .box-facilities .circles .dots-wrap {
        width: 475px;
        height: 475px
    }
}

.box-facilities .circles .dot {
    z-index: 2
}

.box-facilities .circles .dot .icon {
    display: block;
    position: relative;
    cursor: pointer;
    width: 15px;
    height: 15px;
    background-color: #074735;
    border-radius: 100%
}

.box-facilities .circles .dot .icon:before {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    content: "";
    border-radius: 50%;
    -webkit-box-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.6);
    -webkit-animation: Ani-cir 2s infinite;
    animation: Ani-cir 2s infinite;
    z-index: -1
}

@media (max-width:1024px) {
    .box-facilities .circles .dot .icon {
        width: 12px;
        height: 12px
    }
}

.box-facilities .circles .dot .dot-content {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2;
    font-size: 0.875rem;
    line-height: 1.35;
    min-width: 120px;
    white-space: nowrap
}

.box-facilities .circles .dot .dot-content .triangle {
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: #dca769;
    pointer-events: none;
    z-index: -1
}

.box-facilities .circles .dot .dot-content .triangle:after {
    position: absolute;
    top: 1px;
    bottom: 1px;
    right: 1px;
    left: 1px;
    content: "";
    background-color: #FFFFFF;
    pointer-events: none;
    z-index: -1
}

@media (min-width:1101px) {
    .box-facilities .circles .dot .dot-content .dropdown-menu {
        top: 100%!important;
        -webkit-transform: translate3d(0, 0, 0px)!important;
        transform: translate3d(0, 0, 0px)!important
    }
}

.box-facilities .circles .dot .caption {
    padding: 0;
    border: 2px solid #dca769;
    color: #074735;
    min-width: 36vw
}

@media (max-width:1024px) {
    .box-facilities .circles .dot .caption {
        position: fixed!important;
        top: 0!important;
        left: 0!important;
        opacity: 0;
        -moz-transform: all 0.3s linear;
        -ms-transform: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear
    }
}

.box-facilities .circles .dot .distance {
    top: 5%;
    right: 0;
    padding: 8px 16px;
    background-color: #dca769;
    border-radius: 10px 0 0 10px;
    color: #FFF
}

.box-facilities .circles .dot .distance i {
    font-size: 1.5rem;
    color: #f7eadb
}

.box-facilities .circles .dot.show {
    z-index: 10
}

@media (max-width:1024px) {
    .box-facilities .circles .dot.show .caption {
        opacity: 1
    }
}

.box-facilities .circles .dot .link-mb {
    display: block;
    top: 0;
    width: calc(100% + 36px);
    height: 100%;
    z-index: 1500
}

@media (min-width:1101px) {
    .box-facilities .circles .dot .link-mb {
        display: none
    }
}

.box-facilities .circles .dot .link-mb img {
    display: none
}

.box-facilities .circles .dot.d1 {
    top: 16%;
    left: 13.5%
}

.box-facilities .circles .dot.d2 {
    top: 7.8%;
    left: 57.5%
}

.box-facilities .circles .dot.d3 {
    top: 33%;
    left: 25.5%
}

.box-facilities .circles .dot.d4 {
    top: 12.2%;
    left: 68.5%
}

.box-facilities .circles .dot.d5 {
    top: 22%;
    left: 58.5%
}

.box-facilities .circles .dot.d6 {
    top: 33%;
    left: 71.8%
}

.box-facilities .circles .dot.d7 {
    top: 46%;
    left: 66.2%
}

.box-facilities .circles .dot.d8 {
    top: 76.5%;
    left: 42%
}

@media (min-width:1101px) {
    .box-facilities .circles .dot.d8 .dot-content .dropdown-menu {
        top: auto!important;
        bottom: 100%!important
    }
}

.box-facilities .circles .dot.d1 .dot-content,
.box-facilities .circles .dot.d2 .dot-content,
.box-facilities .circles .dot.d3 .dot-content {
    padding: 4px 20px 6px 8px;
    right: 24px
}

.box-facilities .circles .dot.d1 .dot-content .triangle,
.box-facilities .circles .dot.d1 .dot-content .triangle:after,
.box-facilities .circles .dot.d2 .dot-content .triangle,
.box-facilities .circles .dot.d2 .dot-content .triangle:after,
.box-facilities .circles .dot.d3 .dot-content .triangle,
.box-facilities .circles .dot.d3 .dot-content .triangle:after {
    -moz-clip-path: polygon(calc(100% - 15px) 0%, 0% 0%, 0% 100%, calc(100% - 15px) 100%, 100% 50%);
    -webkit-clip-path: polygon(calc(100% - 15px) 0%, 0% 0%, 0% 100%, calc(100% - 15px) 100%, 100% 50%);
    clip-path: polygon(calc(100% - 15px) 0%, 0% 0%, 0% 100%, calc(100% - 15px) 100%, 100% 50%)
}

@media (min-width:1101px) {
    .box-facilities .circles .dot.d1 .dropdown-menu,
    .box-facilities .circles .dot.d2 .dropdown-menu,
    .box-facilities .circles .dot.d3 .dropdown-menu {
        left: -18vw!important
    }
}

.box-facilities .circles .dot.d1 .link-mb,
.box-facilities .circles .dot.d2 .link-mb,
.box-facilities .circles .dot.d3 .link-mb {
    left: 0
}

.box-facilities .circles .dot.d4 .dot-content,
.box-facilities .circles .dot.d5 .dot-content,
.box-facilities .circles .dot.d6 .dot-content,
.box-facilities .circles .dot.d7 .dot-content,
.box-facilities .circles .dot.d8 .dot-content {
    padding: 4px 8px 6px 20px;
    left: 24px
}

.box-facilities .circles .dot.d4 .dot-content .triangle,
.box-facilities .circles .dot.d4 .dot-content .triangle:after,
.box-facilities .circles .dot.d5 .dot-content .triangle,
.box-facilities .circles .dot.d5 .dot-content .triangle:after,
.box-facilities .circles .dot.d6 .dot-content .triangle,
.box-facilities .circles .dot.d6 .dot-content .triangle:after,
.box-facilities .circles .dot.d7 .dot-content .triangle,
.box-facilities .circles .dot.d7 .dot-content .triangle:after,
.box-facilities .circles .dot.d8 .dot-content .triangle,
.box-facilities .circles .dot.d8 .dot-content .triangle:after {
    -moz-clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0 50%);
    -webkit-clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0 50%);
    clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0 50%)
}

@media (min-width:1101px) {
    .box-facilities .circles .dot.d4 .dropdown-menu,
    .box-facilities .circles .dot.d5 .dropdown-menu,
    .box-facilities .circles .dot.d6 .dropdown-menu,
    .box-facilities .circles .dot.d7 .dropdown-menu,
    .box-facilities .circles .dot.d8 .dropdown-menu {
        right: 0!important;
        left: auto!important
    }
}

.box-facilities .circles .dot.d4 .link-mb,
.box-facilities .circles .dot.d5 .link-mb,
.box-facilities .circles .dot.d6 .link-mb,
.box-facilities .circles .dot.d7 .link-mb,
.box-facilities .circles .dot.d8 .link-mb {
    right: 0
}

.box-serenity {
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.1)));
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1))
}

@media (min-width:1101px) {
    .box-serenity .content-text {
        position: absolute;
        top: 23%;
        left: 10.42%;
        width: 100%;
        max-width: 580px;
        z-index: 20
    }
}

.box-serenity .box-title .title {
    letter-spacing: -0.02em
}

@media (max-width:500px) {
    .box-serenity .box-title .title {
        font-size: 6vw
    }
}

@media (min-width:1101px) {
    .box-serenity .circle-items {
        position: absolute;
        bottom: 30.54%;
        right: 10.52%;
        width: 34.11%
    }
}

@media (min-width:1101px) and (max-width:1440px) {
    .box-serenity .circle-items {
        width: 40%
    }
}

@media (max-width:1100px) {
    .box-serenity .circle-items {
        width: 100%;
        max-width: 655px;
        margin: auto;
        padding-bottom: 48px
    }
}

.box-serenity .circle-items .circles-show .link,
.box-serenity .circle-items .trigger {
    -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.16);
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.16);
    border-radius: 100%;
    width: 150px;
    height: 150px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #054733;
    color: #FFF
}

@media (max-width:1100px) {
    .box-serenity .circle-items .circles-show .link,
    .box-serenity .circle-items .trigger {
        margin: auto
    }
}

@media (max-width:767px) {
    .box-serenity .circle-items .circles-show .link,
    .box-serenity .circle-items .trigger {
        width: 120px;
        height: 120px
    }
}

.box-serenity .circle-items .trigger {
    position: relative;
    z-index: 2
}

@media (max-width:1100px) {
    .box-serenity .circle-items .trigger {
        margin-bottom: 20px
    }
}

@media (min-width:1101px) {
    .box-serenity .circle-items .circles-show {
        position: absolute;
        opacity: 0;
        pointer-events: none
    }
}

@media (max-width:1100px) {
    .box-serenity .circle-items .circles-show {
        max-width: calc(320px + 8.33vw);
        margin: auto
    }
}

.box-serenity .circle-items .circles-show .link {
    background-color: #DCA869;
    font-size: 1.125rem;
    line-height: 22px;
    font-weight: 600;
    text-align: center
}

.box-serenity .circle-items .circles-show .link span {
    position: relative;
    padding-bottom: 16px
}

.box-serenity .circle-items .circles-show .link i {
    position: absolute;
    bottom: -4px;
    left: 50%;
    margin-left: -9px
}

.box-serenity .circle-items .circles-show .link:hover {
    background-color: #054733
}

@media (max-width:767px) {
    .box-serenity .circle-items .circles-show .link {
        font-size: 1rem
    }
}

.box-serenity .circle-items .item {
    position: relative
}

.box-serenity .circle-items .item.active .trigger {
    opacity: 0.6
}

@media (min-width:1101px) {
    .box-serenity .circle-items .item.active .circles-show {
        -webkit-animation-name: Reveal;
        animation-name: Reveal;
        pointer-events: auto
    }
}

@media (min-width:1101px) {
    .box-serenity .circle-items .item:not(.active):before {
        position: absolute;
        left: -5px;
        top: -5px;
        right: -5px;
        bottom: -5px;
        content: "";
        border: 1px solid #FFF;
        border-radius: 50%;
        -webkit-box-shadow: 0 0 10px #fff;
        box-shadow: 0 0 10px #fff;
        -webkit-animation: Ani 3s infinite;
        animation: Ani 3s infinite
    }
}

@media (max-width:767px) {
    .box-serenity .circle-items .item~.item {
        margin-top: 40px
    }
}

.box-serenity .circle-items .item:first-child .circles-show {
    top: calc(100% + 3.84vh);
    right: calc(100% + 1.7vh)
}

@media (min-width:1101px) and (max-width:1439px) {
    .box-serenity .circle-items .item:first-child .circles-show {
        top: calc(100% - 3.84vh)
    }
}

.box-serenity .circle-items .item:first-child:before {
    -webkit-animation: Ani 4s infinite;
    animation: Ani 4s infinite
}

@media (min-width:1101px) {
    .box-serenity .circle-items .item:nth-child(2) {
        margin-bottom: 14.94vh
    }
}

.box-serenity .circle-items .item:nth-child(2) .circles-show {
    top: calc(100% - 0.85vh);
    right: calc(-100% + 7.68vh)
}

@media (max-width:1100px) {
    .box-serenity .circle-items .item:nth-child(2) .circles-show .link:before {
        height: 80px;
        top: -78px;
        -webkit-transform-origin: bottom center;
        transform-origin: bottom center
    }
}

.box-serenity .circle-items .item:nth-child(2) .circles-show .link:first-child {
    margin-right: 8.33vw
}

@media (max-width:1100px) {
    .box-serenity .circle-items .item:nth-child(2) .circles-show .link:first-child:before {
        left: 60%;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg)
    }
}

@media (min-width:1101px) {
    .box-serenity .circle-items .item:nth-child(2) .circles-show .link:nth-child(2) {
        margin-top: 12.27vh
    }
}

@media (max-width:1100px) {
    .box-serenity .circle-items .item:nth-child(2) .circles-show .link:nth-child(2):before {
        left: auto;
        right: 60%;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }
}

.all-dot,
.facilities-bg {
    position: absolute;
    left: 0;
    top: 0
}

.facilities-map {
    width: 100%;
    overflow: hidden;
    position: relative
}

.facilities-bg {
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    height: 1105px
}

.hover-svg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.highlight {
    opacity: 0;
    stroke-width: 7;
    cursor: pointer
}

.highlight.current {
    opacity: 1
}

.all-dot {
    width: 100%;
    height: 100%
}

.dot-num,
.dot-num i {
    position: absolute;
    border-radius: 50%
}

.dot-num {
    background-color: #637463;
    cursor: pointer;
    display: block;
    width: 38px;
    height: 38px
}

.dot-num>span {
    display: block;
    line-height: 38px;
    font-weight: 700;
    text-align: center;
    font-size: 1.25rem;
    color: #FFF
}

.dot-num i {
    left: -5px;
    top: -5px;
    width: 50px;
    height: 50px;
    border: 1px solid #FFF;
    -webkit-box-shadow: 0 0 10px #FFF;
    box-shadow: 0 0 10px #FFF;
    display: none
}

.dot-num.current {
    z-index: 3!important;
    background-color: #DCA869!important
}

.dot-num.current i {
    display: block;
    -webkit-animation: Ani 2s infinite;
    animation: Ani 2s infinite
}

.content-center .big-tend {
    font-weight: 600;
    font-size: 1.5rem
}

@media (max-width:1100px) {
    .content-center .big-tend {
        font-size: 1.25rem
    }
}

.content-center.f1 .dot-01 {
    left: 29.85%;
    bottom: 2.4%
}

.content-center.f1 .dot-02 {
    left: 8%;
    bottom: 2.4%
}

.content-center.f1 .dot-03 {
    left: 35%;
    top: 55%
}

.content-center.f1 .dot-04 {
    left: 27.5%;
    top: 50%
}

.content-center.f1 .dot-05 {
    left: 28.2%;
    top: 18.7%
}

.content-center.f1 .dot-06 {
    left: 47.8%;
    top: 18.7%
}

.content-center.f1 .dot-07 {
    left: 68.9%;
    top: 3.1%
}

.content-center.f1 .dot-08 {
    right: 10.9%;
    top: 46%
}

.content-center.f1 .dot-09 {
    right: 28%;
    bottom: 2.4%
}

.content-center.f1 .dot-10 {
    bottom: 2.4%;
    left: 48.3%
}

.content-center.f1 .show-box-pic[data-pic="03"],
.content-center.f1 .show-box-pic[data-pic="04"] {
    padding-left: 24px
}

.content-center.f2 .dot-01 {
    left: 37%;
    bottom: 3.8%
}

.content-center.f2 .dot-02 {
    left: 18%;
    bottom: 4%
}

.content-center.f2 .dot-03 {
    left: 10.5%;
    top: 45.5%
}

.content-center.f2 .dot-04 {
    left: 18.2%;
    top: 3.8%
}

.content-center.f2 .dot-05 {
    left: 35.5%;
    top: 18.6%
}

.content-center.f2 .dot-06 {
    left: 53%;
    top: 18.6%
}

.content-center.f2 .dot-07 {
    left: 70.8%;
    top: 3.8%
}

.content-center.f2 .dot-08 {
    right: 10.9%;
    top: 45.5%
}

.content-center.f2 .dot-09 {
    right: 26.4%;
    bottom: 3.9%
}

.content-center.f2 .dot-10 {
    bottom: 3.9%;
    left: 52.9%
}

.content-center.f3 .dot-01 {
    left: 38.5%;
    bottom: 4.1%
}

.content-center.f3 .dot-02 {
    left: 23.1%;
    bottom: 4.1%
}

.content-center.f3 .dot-03 {
    left: 23.1%;
    top: 2%
}

.content-center.f3 .dot-04 {
    left: 23%;
    top: 2%
}

.content-center.f3 .dot-05 {
    left: 36.4%;
    top: 16.9%
}

.content-center.f3 .dot-06 {
    left: 53.3%;
    top: 16.9%
}

.content-center.f3 .dot-07 {
    left: 69.6%;
    top: 2%
}

.content-center.f3 .dot-08 {
    right: 11.4%;
    top: 45.8%
}

.content-center.f3 .dot-09 {
    right: 26.9%;
    bottom: 4.1%
}

.content-center.f3 .dot-10 {
    bottom: 4.1%;
    left: 52.6%
}

.content-center.f4 {
    max-width: 1340px
}

.content-center.f4 .facilities-bg {
    width: 1340px;
    height: 1533px
}

.content-center.f4 .highlight {
    stroke-width: 1px
}

.content-center.f4 .highlight.active {
    opacity: 0.9
}

.content-center.f4 .dot-01 {
    left: 55.66%;
    bottom: 22.8%
}

.content-center.f4 .dot-02 {
    left: 57.4%;
    bottom: 14.8%
}

.content-center.f4 .dot-03 {
    left: 51.6%;
    top: 57.2%
}

.content-center.f4 .dot-04 {
    left: 30.9%;
    top: 61.2%
}

.content-center.f4 .dot-05 {
    left: 28.9%;
    top: 11.6%
}

.content-center.f4 .dot-06 {
    left: 37.6%;
    top: 13.2%
}

.content-center.f4 .dot-07 {
    left: 51.6%;
    top: 21%
}

.content-center.f4 .dot-08 {
    left: 48.6%;
    top: 38.2%
}

.content-center.f4 .dot-09 {
    left: 39.7%;
    top: 18.8%
}

.content-center.f4 .dot-10 {
    left: 48.3%;
    top: 12.2%
}

.content-center.f4 .dot-11 {
    right: 27.4%;
    top: 11.6%
}

.content-center.f4 .dot-12 {
    left: 53.7%;
    top: 25%
}

.content-center.f4 .dot-13 {
    right: 19.8%;
    top: 36.3%
}

.content-center.f4 .dot-14 {
    right: 23%;
    top: 23.2%
}

.content-center.f4 .dot-15,
.content-center.f4 .dot-16,
.content-center.f4 .dot-17,
.content-center.f4 .dot-19,
.content-center.f4 .dot-20 {
    background-color: #DCA869
}

.content-center.f4 .dot-15 {
    left: 58.6%;
    top: 57.6%
}

.content-center.f4 .dot-16 {
    right: 24.6%;
    top: 56.6%
}

.content-center.f4 .dot-17 {
    left: 26.8%;
    top: 34.9%
}

.content-center.f4 .dot-18 {
    left: 11%;
    top: 28.8%
}

.content-center.f4 .dot-19 {
    top: 44.8%;
    left: 23.6%
}

.content-center.f4 .dot-20 {
    left: 22.1%;
    top: 29%
}

.info-facilities,
.show-box-pic {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto
}

.show-box-pic {
    width: auto;
    left: auto;
    top: auto;
    right: auto;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    background-color: #FFF;
    text-align: left;
    z-index: 500;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    padding: 8px 24px 8px 32px;
    pointer-events: none
}

@media (min-width:1101px) {
    .show-box-pic:after {
        position: absolute;
        left: 50%;
        bottom: -14px;
        margin-left: -15px;
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 14px 0 14px;
        border-color: #FFF transparent transparent transparent
    }
}

.show-box-pic.showup {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1
}

.title-faci .txt,
.title-faci span {
    position: relative;
    font-weight: 700;
    display: inline-block
}

.title-faci span {
    position: absolute;
    top: 50%;
    left: -16px;
    margin-top: -16px;
    width: 32px;
    height: 32px;
    background: #054733;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    line-height: 30px;
    text-align: center;
    color: #FFF;
    font-size: 0.875rem;
    font-weight: 700
}

.title-faci .txt {
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 900
}

.faci-text {
    width: 100%;
    height: auto;
    font-size: 0.875rem
}

.faci-text .more {
    font-size: 0.625rem;
    text-transform: uppercase;
    pointer-events: none
}

@media (max-width:1100px) {
    .show-box-pic .title-faci span {
        top: -16px;
        left: 8px;
        margin: 0
    }
}

@media (min-width:1101px) {
    body {
        height: 100%
    }
    .content-center {
        display: block;
        width: 100%;
        margin: auto
    }
    .facilities-map {
        opacity: 0
    }
    .dot-num {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    .show-text .facilities-map {
        -webkit-animation-name: fadeIn;
        animation-name: fadeIn;
        -webkit-animation-duration: 1.6s;
        animation-duration: 1.6s;
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards
    }
    .show-text .dot-num {
        -webkit-transform: scale(1) translateZ(0);
        transform: scale(1) translateZ(0)
    }
}

@media (max-width:1100px) {
    .content-center {
        bottom: auto;
        display: block;
        max-width: inherit;
        margin: auto;
        text-align: center;
        padding: 0 0 30px
    }
    .box-txt {
        max-width: 500px;
        margin: auto;
        text-align: center
    }
    .facilities-map {
        position: relative;
        width: 100%;
        height: auto;
        top: auto;
        left: auto
    }
}

@media screen and (min-width:1101px) and (hover:hover) and (any-pointer:fine) {
    .dot-num,
    .highlight,
    .hover-li .text {
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out
    }
}

.box-plan {
    background-color: #6B7C6B;
    overflow: hidden
}

@media (min-width:1200px) {
    .box-plan {
        padding-top: 160px!important
    }
}

.box-plan .top-content .dragon-fly-icons {
    left: auto;
    top: 0;
    bottom: -40px;
    right: 5.73%;
    width: 26.5625%;
    height: auto
}

@media (min-width:1101px) {
    .box-plan .top-content .dragon-fly-icons {
        bottom: -64px
    }
}

.box-plan .top-content .dragon-fly {
    opacity: 0.1
}

.box-plan .top-content .dragon-fly:first-child {
    width: 60%
}

.box-plan .top-content .dragon-fly:nth-child(2) {
    width: 30%;
    top: auto;
    bottom: 40%
}

@media (min-width:1101px) {
    .box-plan .box-title,
    .box-plan .menu-tab {
        margin-bottom: 64px
    }
}

@media (max-width:380px) {
    .box-plan .menu-tab:not(.sub-tab) li a {
        min-width: inherit;
        padding-left: 16px;
        padding-right: 16px
    }
}

.box-plan .bottom-content {
    padding-top: 24px;
    padding-bottom: 40px
}

@media (min-width:1101px) {
    .box-plan .bottom-content {
        padding-top: 64px;
        padding-bottom: 60px
    }
}

@media (min-width:1200px) {
    .box-plan .bottom-content {
        padding-bottom: 80px
    }
}

.box-plan .bottom-content .dragon-fly {
    opacity: 0.7
}

.box-plan .bottom-content .dragon-fly:first-child {
    width: 15.26%;
    top: 63%;
    left: auto;
    right: 5.7%
}

.box-plan .bottom-content .dragon-fly:nth-child(2) {
    width: 18.23%;
    left: 0;
    top: auto;
    bottom: 23.85%
}

@media (min-width:1101px) {
    .box-plan .row-plan {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: flex-end;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        max-width: 2560px;
        margin: auto
    }
}

@media (min-width:1101px) {
    .box-plan .img-floor-vector {
        margin-bottom: 2.5vw
    }
}

@media (min-width:1920px) {
    .box-plan .img-floor-vector {
        margin-bottom: 48px
    }
}

@media (max-width:1100px) {
    .box-plan .img-floor-vector {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

@media (max-width:767px) {
    .box-plan .img-floor-vector {
        margin-top: 16px
    }
}

.box-plan .img-floor-vector img {
    max-width: 146px
}

@media (min-width:1101px) {
    .box-plan .img-floor-vector img {
        max-width: 7.6042vw
    }
}

@media (min-width:1920px) {
    .box-plan .img-floor-vector img {
        max-width: 146px
    }
}

.box-plan .disclaimer {
    color: #000
}

@media (max-width:991px) {
    .box-plan .disclaimer {
        font-size: 0.875rem
    }
}

.box-plan .disclaimer li {
    position: relative;
    margin-top: 0.4rem;
    padding-left: 12px
}

.box-plan .disclaimer li:before {
    position: absolute;
    left: 0;
    display: inline-block;
    content: "";
    top: 8px;
    width: 4px;
    height: 4px;
    background-color: #054733;
    border-radius: 100%
}

@media (max-width:767px) {
    .floor {
        text-align: center
    }
}

.floor .title-faci {
    margin-bottom: 36px
}

@media (max-width:1439px) {
    .floor .title-faci {
        margin-bottom: 24px
    }
}

.floor .title-faci .txt {
    font-weight: 700;
    font-size: 1.375rem;
    line-height: 32px
}

.floor .title-faci span {
    left: 0
}

.floor .attributes {
    font-size: 0.875rem;
    line-height: 1.3
}

@media (max-width:767px) {
    .floor .attributes {
        display: inline-block;
        text-align: left
    }
}

.floor .attributes ul {
    list-style: none
}

.floor .attributes .txt {
    width: 64px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-weight: 700
}

.floor .attributes .info {
    position: relative
}

.floor .attributes .info:before {
    display: inline-block;
    content: ":";
    margin-right: 20px
}

@media (max-width:380px) {
    .floor .attributes .info:before {
        margin-right: 8px
    }
}

.floor .attributes .info .name~.name {
    margin-left: 14px;
    padding-left: 14px;
    border-left: 0.027rem solid #414142
}

@media (max-width:380px) {
    .floor .attributes .info .name~.name {
        margin-left: 8px;
        padding-left: 8px
    }
}

.floor .name-floor h4 {
    width: 50%;
    font-size: 0.875rem;
    font-weight: 700
}

@media (max-width:767px) {
    .floor .name-floor h4 {
        font-size: 0.75rem
    }
}

@media (max-width:360px) {
    .floor .name-floor h4 {
        font-size: 3vw
    }
}

.floor-plans .content-main {
    max-width: 1407px
}

.floor-plans .content-main .facilities-bg {
    width: 1407px
}

@media (min-width:1101px) {
    .floor-plans .content-main {
        width: 53.33%
    }
    .floor-plans .content-main .big-tend {
        margin-top: 16px
    }
}

@media (min-width:1101px) {
    .floor-plans .text-note {
        width: 38.84%;
        padding-bottom: 2.92vw
    }
}

@media (min-width:1920px) {
    .floor-plans .text-note {
        padding-bottom: 56px
    }
}

@media (min-width:1101px) {
    .floor-plans .text-note .row-main {
        display: block!important
    }
    .floor-plans .text-note .row-main .item {
        -ms-flex: 0 0 100%;
        -webkit-box-flex: 0;
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media (min-width:1101px) {
    .floor-plans .text-note .type li:not(:last-child) {
        margin-bottom: 0.729vw
    }
}

@media (min-width:1920px) {
    .floor-plans .text-note .type li:not(:last-child) {
        margin-bottom: 14px
    }
}

@media (min-width:992px) and (max-width:1100px) {
    .floor-plans .text-note .type li:not(:last-child) {
        margin-bottom: 12px
    }
}

@media (max-width:991px) {
    .floor-plans .text-note .type li {
        margin-bottom: 6px
    }
}

.floor-plans .text-note .bg-color {
    display: block;
    width: 15%;
    max-width: 56px;
    height: 22px;
    border: 1px solid #414142;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 14px
}

.floor-plans .text-note .tend {
    display: inline-block;
    color: #89786C;
    line-height: 1.3
}

@media (min-width:1101px) {
    .floor-plans .text-note .tend {
        font-size: 0.75rem
    }
}

@media (min-width:1400px) {
    .floor-plans .text-note .tend {
        font-size: 0.875rem
    }
}

@media (min-width:1601px) {
    .floor-plans .text-note .tend {
        font-size: 1rem
    }
}

@media (max-width:991px) {
    .floor-plans .text-note .tend {
        font-size: 0.875rem
    }
}

@media (min-width:1101px) {
    .floor-plans .disclaimer {
        padding-top: 4.6875vw
    }
}

@media (min-width:1440px) {
    .floor-plans .disclaimer {
        padding-top: 7.8125vw
    }
}

@media (min-width:1920px) {
    .floor-plans .disclaimer {
        padding-top: 150px
    }
}

@media (max-width:1100px) {
    .floor-plans .disclaimer {
        padding-top: 48px
    }
}

@media (max-width:991px) {
    .floor-plans .disclaimer {
        padding-top: 24px
    }
}

.floor-plans .disclaimer li {
    font-size: 0.875rem;
    line-height: 1.45
}

.unit-plans .bottom-content {
    padding-top: 36px
}

@media (min-width:1101px) {
    .unit-plans .bottom-content {
        padding-top: 48px
    }
}

.unit-plans .bottom-content .dragon-fly:first-child {
    width: 13.1%;
    top: 75%
}

.unit-plans .container {
    max-width: 1480px
}

@media (min-width:400px) {
    .unit-plans .menu-tab br {
        display: none
    }
}

.unit-plans .sub-tab {
    margin-bottom: 32px
}

@media (min-width:1101px) {
    .unit-plans .sub-tab {
        margin-bottom: 48px
    }
}

@media (max-width:991px) {
    .unit-plans .floor {
        text-align: center
    }
    .unit-plans .floor .attributes {
        display: inline-block;
        text-align: left
    }
    .unit-plans .floor .img {
        margin-top: 24px
    }
}

.unit-plans .sl-unit-plan {
    padding: 0 32px
}

@media (max-width:991px) {
    .unit-plans .sl-unit-plan {
        padding: 0 16px
    }
}

.unit-plans .slick-arrow.slick-prev {
    background-image: url(../images/icon/previous1.svg)
}

@media (max-width:991px) {
    .unit-plans .slick-arrow.slick-prev {
        left: -15px
    }
}

.unit-plans .slick-arrow.slick-next {
    background-image: url(../images/icon/next1.svg)
}

@media (max-width:991px) {
    .unit-plans .slick-arrow.slick-next {
        right: -15px
    }
}

.unit-plans .disclaimer {
    padding-top: 24px
}

@media (min-width:992px) {
    .unit-plans #unit1 .floor {
        width: 100%;
        max-width: 600px;
        margin: auto
    }
    .unit-plans #unit1 .floor .img {
        position: relative;
        margin-top: -36px
    }
}

@media (min-width:1101px) {
    .unit-plans #unit1 .item:last-child .floor {
        margin-left: auto
    }
}

@media (min-width:992px) {
    .unit-plans #unit2 .floor .img {
        position: relative;
        margin-top: -48px
    }
}

@media (min-width:992px) {
    .unit-plans #unit2 .content-floor {
        width: 100%;
        max-width: 1024px;
        margin: auto
    }
}

@media (max-width:991px) {
    .unit-plans #unit2 .content-floor:not(:last-child) {
        border-bottom: 1px solid #e5e5e5
    }
}

.unit-plans #unit2 .content-floor .name-floor {
    padding-left: 20%
}

.facilities-plan {
    overflow: hidden;
    background-color: #CDD8CA
}

.facilities-plan .box-content {
    width: 100%;
    max-width: 1320px;
    margin: auto
}

.facilities-plan .box-title {
    margin-bottom: 56px
}

@media (max-width:1100px) {
    .facilities-plan .box-title {
        margin-bottom: 32px
    }
}

.facilities-plan .faci-map-note {
    top: -48px;
    right: 0;
    z-index: 1
}

@media (min-width:992px) {
    .facilities-plan .faci-map-note {
        top: -10px;
        right: -124px
    }
}

.facilities-plan .faci-map-note li {
    font-size: 0.875rem;
    line-height: 16px
}

.facilities-plan .faci-map-note li span {
    display: block;
    width: 16px;
    height: 16px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    border-radius: 50%
}

@media (max-width:991px) {
    .facilities-plan .faci-map-note li {
        font-size: 0.75rem
    }
    .facilities-plan .faci-map-note li span {
        width: 12px;
        height: 12px
    }
}

.facilities-plan .faci-maps {
    width: 100%;
    max-width: 750px;
    margin: auto;
    padding-top: 48px
}

@media (min-width:1281px) {
    .facilities-plan .faci-maps {
        max-width: 40vw;
        padding-top: 0
    }
}

@media (min-width:1400px) {
    .facilities-plan .faci-maps {
        max-width: 45vw
    }
}

@media (min-width:1800px) {
    .facilities-plan .faci-maps {
        max-width: 1220px
    }
}

.facilities-plan .item {
    width: 50%
}

@media (min-width:1101px) {
    .facilities-plan .item {
        width: 100%;
        max-width: 480px
    }
}

@media (min-width:1101px) {
    .facilities-plan .item:last-child .content-center {
        margin-left: auto
    }
}

@media (max-width:1799px) {
    .facilities-plan .big-tend {
        font-size: 1.25rem
    }
}

@media (max-width:575px) {
    .facilities-plan .big-tend {
        font-size: 1rem
    }
}

.facilities-plan .dot-num {
    width: 36px;
    height: 36px;
    background-color: #035944
}

.facilities-plan .dot-num .span {
    line-height: 36px
}

.facilities-plan .title-faci .txt {
    font-size: 0.875rem
}

@media (max-width:1100px) {
    .facilities-plan .info-facilities {
        display: none
    }
}

.facilities-plan .show-box-pic {
    padding: 5px 15px
}

.facilities-plan .show-box-pic:after {
    bottom: -10px;
    margin-left: -8px;
    border-width: 10px 8px 0 8px
}

.facilities-plan .faci-list {
    grid-gap: 6px
}

@media (min-width:1101px) {
    .facilities-plan .faci-list {
        margin: 30px 0 60px
    }
}

@media (max-width:1100px) {
    .facilities-plan .faci-list {
        margin-bottom: 30px
    }
}

@media (min-width:768px) {
    .facilities-plan .faci-list ul {
        max-width: calc(25% - 6px)
    }
}

@media (max-width:767px) {
    .facilities-plan .faci-list ul {
        width: calc(50% - 6px)
    }
    .facilities-plan .faci-list ul:nth-child(2) {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }
    .facilities-plan .faci-list ul:nth-child(3) {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
    .facilities-plan .faci-list ul:nth-child(4) {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4
    }
}

.facilities-plan .faci-list .hover-li {
    cursor: pointer
}

@media (min-width:768px) {
    .facilities-plan .faci-list .hover-li:not(:last-child) {
        margin-bottom: 6px
    }
}

.facilities-plan .faci-list .hover-li .text {
    position: relative;
    display: inline-block;
    padding: 8px 14px 8px 36px;
    border-radius: 20px;
    line-height: 20px
}

@media (max-width:16000px) {
    .facilities-plan .faci-list .hover-li .text {
        padding: 6px 14px 6px 36px;
        font-size: 0.875rem;
        border-radius: 30px
    }
}

@media (max-width:1100px) {
    .facilities-plan .faci-list .hover-li .text {
        border-radius: 30px
    }
}

.facilities-plan .faci-list .hover-li span {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -10px;
    left: 8px;
    width: 20px;
    height: 20px;
    background-color: #035944;
    border-radius: 50%;
    font-size: 0.75rem;
    line-height: 20px;
    font-weight: 800;
    color: #FFF;
    text-align: center
}

.facilities-plan .faci-list .hover-li[data-text="15"] span,
.facilities-plan .faci-list .hover-li[data-text="16"] span,
.facilities-plan .faci-list .hover-li[data-text="17"] span,
.facilities-plan .faci-list .hover-li[data-text="19"] span,
.facilities-plan .faci-list .hover-li[data-text="20"] span {
    background-color: #DCA869
}

.facilities-plan .faci-list .hover-li.current .text {
    background-color: #DCA869;
    color: #FFF
}

@media (max-width:991px) {
    .facilities-plan .disclaimer {
        font-size: 0.875rem
    }
}

.content-popup {
    width: 100%;
    margin: auto;
    background: rgba(255, 255, 255, 0.96);
    padding: 36px 56px
}

@media (min-width:1101px) {
    .content-popup {
        width: 1000px;
        border-radius: 20px
    }
}

@media (max-width:1439px) {
    .content-popup {
        padding-top: 32px;
        padding-bottom: 32px
    }
}

@media (max-width:1100px) {
    .content-popup.full-mb {
        height: 100vh;
        max-height: 100vh;
        height: var(--window-height);
        max-height: var(--window-height);
        overflow: auto;
        padding: 36px 32px 16px
    }
}

@media (min-width:1101px) {
    .popup-floor-plan .inner {
        width: 100%;
        max-width: 800px;
        margin: auto
    }
}

.popup-floor-plan .floor .title-faci .txt {
    color: #A38775
}

@media (min-width:768px) {
    .popup-floor-plan .floor .attributes {
        position: absolute;
        top: 0;
        left: 5%;
        width: 100%;
        max-width: 350px
    }
}

@media (min-width:768px) {
    .popup-floor-plan .img {
        text-align: right
    }
}

@media (max-width:767px) {
    .popup-floor-plan .img {
        margin-top: 16px
    }
}

@media (min-width:1101px) {
    .popup-floor-plan .img img {
        max-height: 60vh
    }
}

@media (device-width:1024px) and (device-height:768px) and (orientation:landscape) {
    .popup-floor-plan .img img {
        max-height: 80vh
    }
}

.sl-floor-plan .slick-arrow {
    position: fixed
}

@media (min-width:1101px) {
    .sl-floor-plan .slick-arrow {
        top: calc(50% + 28px)
    }
}

@media (min-width:1101px) {
    .sl-floor-plan .slick-arrow:not(:hover) {
        -webkit-filter: invert(1) brightness(5);
        filter: invert(1) brightness(5)
    }
}

@media (min-width:1101px) {
    .sl-floor-plan .slick-prev {
        left: 7.8125vw
    }
}

@media (min-width:1101px) {
    .sl-floor-plan .slick-next {
        right: 7.8125vw
    }
}

.box-contact .bg {
    /* background-position: right 0; */
}

.box-contact .content-text {
    width: 100%
}

@media (min-width:1101px) {
    .box-contact .content-text {
        max-width: 320px
    }
}

@media (min-width:1800px) {
    .box-contact .content-text {
        margin-right: 10vw
    }
}

@media (min-width:420px) and (max-width:1100px) {
    .box-contact .content-text {
        color: #FFF
    }
    .box-contact .content-text a {
        color: #FFF
    }
}

@media (min-width:420px) and (max-width:1100px) {
    .box-contact .content-text .box-title {
        background-image: url(../images/white-line.png)
    }
}

@media (min-width:992px) {
    .box-contact .content-text .box-title {
        margin-bottom: 32px
    }
}

.box-contact .content-text .title,
.box-contact .content-text .txt {
    color: #054733
}

@media (min-width:420px) and (max-width:1100px) {
    .box-contact .content-text .title,
    .box-contact .content-text .txt {
        color: #FFF
    }
}

.box-contact .content-text .des {
    font-size: 1rem!important
}

.show-mobile {
    display: none!important
}

.isMobile .show-mobile {
    display: block!important
}

@media (max-width:1101px) {
    .show-mobile {
        display: block!important
    }
}

.isMobile .hide-mobile {
    display: none!important
}

@media (max-width:1100px) {
    .hide-mobile {
        display: none!important
    }
}

#header .main-head .language .dropdown-item {
    padding: 12px 0;
    text-align: center;
}

#header .main-head .language .dropdown-item:hover {
    background: #f2f2f2;
}

#header .main-head .language .dropdown-menu {
    padding: 0;
}

#header .main-head .language .dropdown-toggle {
    margin-bottom: 4px;
    padding-left: 6px;
}

#header .main-head .language .dropdown-toggle.active {
    pointer-events: unset;
}

#header .main-head .language .dropdown-item.selected {
    font-weight: 700;
    color: #054733;
    pointer-events: none;
}