@charset "UTF-8";@import url(help/reset.css);@import url(font-awesome-4.7.0/font-awesome.min.css);@import url(help/rwdgrid.css);@import url("https://fonts.googleapis.com/css?family=Noto+Sans+TC:400,700|Oswald:500|Yellowtail&display=swap");@import url(textEditor.css);@import url(contentbuilder.css);*,.b-box,.classBox>ul>li>a,.controlBox,.controlBox .main,.hideBox,.m_classLink .main,.m_classLink>ul,.menu a,.menuOpenBtn,.moreBtn,.rectDotList button,.side_share a,.sideMenu>ul>li>a,.tab a,.wrap,[class*=col-],header .wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#loader-wrapper #loader,#loader-wrapper .whiteBg,.bevelClassBox>ul>li,.classBox>ul .submenuList a:before,.controlBox .main,.hideBox,.hImgScale .Img img,.logo svg,.logo svg .cls-4,.m_menu.active .hideBox,.menu .submenu,.menu>li,.menu>li>a:after,.menuOpenBtn,.moreBtn:before,.moreBtn svg,.rectDotList button:before,.searchArea,.side_menu ul li a:after,.sideMenu>ul .submenuList a:before,.slick-dots button:before,.tab a:after,a,footer .bottom ul.downMenu li a,header .Img svg .cls-6 {
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

body {
    background-color: #fff;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    color: #000;
    overflow: hidden;
    user-select: none;
}

body>svg {
    display: none
}

body#insideBody {
    overflow: auto
}

a {
    color: #000;
    cursor: pointer
}

@media (min-width: 1181px) {
    a:hover {
        color:#df1617
    }
}

a[href="javascript:;"] {
    cursor: default
}

p {
    font-size: 15px;
    line-height: 24px;
    color: #454545;
    font-weight: 400
}

h2 {
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase
}

h3 {
    font-weight: 500;
    font-size: 18px
}

[class*=col-] {
    float: left
}

div.titan {
    display: none
}

.col-1 {
    width: 100%
}

.col-2 {
    width: 50%
}

.col-3 {
    width: 33.33%
}

.col-4 {
    width: 25%
}

.col-5 {
    width: 20%
}

input[type=text],textarea {
    -webkit-appearance: none
}

.outerWrap {
    position: relative;
    overflow: hidden
}

.wrap {
    margin-left: auto;
    margin-right: auto;
    width: 1380px
}

@media (max-width: 1400px) {
    .wrap {
        width:1200px
    }
}

@media (max-width: 1280px) {
    .wrap {
        width:100%;
        padding-left: 40px;
        padding-right: 40px
    }
}

.searchArea {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: #000000e0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    z-index: -1
}

.searchArea.active {
    opacity: 1;
    z-index: 99999;
    visibility: visible
}

.searchArea.active .box:after {
    width: 100%
}

.searchArea.active .box input {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px)
}

.searchArea.active .box a.serchIcon {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px)
}

.searchArea .overlay {
    position: absolute;
    width: 100%;
    height: 100%
}

.searchArea .box {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.searchArea .box:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0px;
    height: 1px;
    background-color: #b7b7b7;
    -webkit-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease
}

.searchArea .box input {
    padding: 30px;
    border: none;
    font-size: 35px;
    background-color: transparent;
    color: #d2d2d2;
    font-weight: 400;
    opacity: 0;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px)
}

.searchArea .box input::-webkit-input-placeholder {
    color: #d2d2d2;
    letter-spacing: 0.5px;
    font-weight: 400
}

.searchArea .box input:-ms-input-placeholder {
    color: #d2d2d2;
    letter-spacing: 0.5px;
    font-weight: 400
}

.searchArea .box input::-ms-input-placeholder {
    color: #d2d2d2;
    letter-spacing: 0.5px;
    font-weight: 400
}

.searchArea .box input::placeholder {
    color: #d2d2d2;
    letter-spacing: 0.5px;
    font-weight: 400
}

.searchArea .box input:focus {
    outline: none
}

.searchArea .box a.serchIcon {
    color: #fff;
    display: block;
    opacity: 0;
    width: 20px;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px)
}

.searchArea .box a.serchIcon .cls-6 {
    stroke: #fff
}

.pageMainArea {
    position: relative;
    z-index: 1;
    max-width: 1670px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 220px;
    background-color: #fff;
    -webkit-box-shadow: 0 8px 84px rgba(0, 0, 0, 0.1);
    box-shadow: 0 8px 84px rgba(0, 0, 0, 0.1)
}

@media (min-width: 1181px) and (max-width:1720px) {
    .pageMainArea {
        margin-left:40px;
        margin-right: 40px
    }
}

@media (min-width: 1181px) {
    .pageMainArea {
        margin-top:-255px;
        margin-bottom: 180px
    }
}

@media (max-width: 1180px) {
    .pageMainArea {
        padding-bottom:60px
    }
}

.pageMainArea>.pageWrap {
    max-width: 1290px;
    padding-top: 160px
}

@media (max-width: 1450px) {
    .pageMainArea>.pageWrap {
        padding-left:20px;
        padding-right: 20px
    }
}

@media (max-width: 1180px) {
    .pageMainArea>.pageWrap {
        padding-top:60px
    }
}

.pageMainArea>.handText {
    top: 40px;
    left: 80px;
    z-index: 1;
    font-size: 150px
}

@media (max-width: 1180px) {
    .pageMainArea>.handText {
        top:0;
        left: 0;
        font-size: 80px
    }
}

.moduleBox {
    position: fixed;
    left: 50%;
    top: 48%;
    z-index: 1005;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition-property: top, opacity, visibility;
    -o-transition-property: top, opacity, visibility;
    transition-property: top, opacity, visibility;
    -webkit-transition-duration: .5s;
    -o-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-timing-function: ease-in-out;
    -o-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out
}

.moduleBox.show {
    top: 50%;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

.moduleMask {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1003;
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out
}

.moduleMask.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

header {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: 0;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
    -webkit-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease
}

header.show {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1
}

@media (max-width: 1281px) {
    header {
        display:none
    }
}

header .Img svg .cls-6 {
    stroke: #df1617
}

header.is-active {
    background-color: #fff;
    -webkit-box-shadow: 7px 6px 10px #0000000f;
    box-shadow: 7px 6px 10px #0000000f;
    padding: 11px 0
}

header.is-active svg {
    width: 88px
}

header.is-active svg .cls-4 {
    fill: #000
}

header.is-active .menu a {
    color: #4e4e4e
}

header.is-active .Img {
    width: 22px
}

header.is-active .Img svg {
    width: auto
}

header .wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.logo svg {
    width: 185px;
    max-width: 100%
}

.logo a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.iconBox {
    cursor: pointer
}

.iconBox .Img {
    width: 21px
}

.iconBox .Img img {
    max-width: 100%
}

.menuBox {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.menu>li {
    position: relative
}

.menu>li:first-child {
    -webkit-transition-delay: 0.6s;
    -o-transition-delay: 0.6s;
    transition-delay: 0.6s
}

.menu>li:nth-child(2) {
    -webkit-transition-delay: 0.55s;
    -o-transition-delay: 0.55s;
    transition-delay: 0.55s
}

.menu>li:nth-child(3) {
    -webkit-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s
}

.menu>li:nth-child(4) {
    -webkit-transition-delay: 0.45s;
    -o-transition-delay: 0.45s;
    transition-delay: 0.45s
}

.menu>li:nth-child(5) {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s
}

.menu>li:nth-child(6) {
    -webkit-transition-delay: 0.35s;
    -o-transition-delay: 0.35s;
    transition-delay: 0.35s
}

.menu>li:nth-child(7) {
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s
}

.menu>li>a {
    position: relative;
    padding: 20px 30px;
    font-size: 17px;
    letter-spacing: 1px;
    font-weight: 300;
    color: #fff;
    text-transform: capitalize
}

.menu>li>a:after {
    content: '';
    position: absolute;
    width: 0px;
    height: 1px;
    background-color: #df1617;
    left: 0;
    bottom: 10px
}

.menu>li>a:hover:after {
    width: 100%
}

.menu>li>a.current {
    color: #df1617
}

.menu a {
    display: block
}

.menu .submenu {
    position: absolute;
    width: 100%;
    background-color: #fff;
    top: 77px;
    opacity: 0;
    visibility: hidden;
    z-index: -1;
    -webkit-box-shadow: 7px 6px 10px #0000000f;
    box-shadow: 7px 6px 10px #0000000f
}

.menu .submenu dl{
	display: none;
}

.menu .submenu.show {
    visibility: visible;
    opacity: 1;
    z-index: 99
}

.menu .submenu a {
    padding: 10px 15px;
    font-size: 14px;
    letter-spacing: .5px
}

.menu .submenu a:hover {
    color: #df1617
}

.m_menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9990;
    display: block;
    width: 100%;
    background-color: #fff
}

@media (min-width: 1281px) {
    .m_menu {
        display:none
    }
}

.m_menu.is-active {
    border-bottom: 1px solid #d7d7d7
}

.m_menu.active .controlBox {
    height: 80px
}

.m_menu.active .controlBox .main:after,.m_menu.active .controlBox .main:before {
    top: 50%
}

.m_menu.active .controlBox .main:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.m_menu.active .controlBox .main:after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.m_menu.active .hideBox {
    visibility: visible;
    z-index: 99;
    opacity: 1
}

.controlBox {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 60px;
    background-color: #fff
}

.controlBox .main {
    position: absolute;
    right: 0px;
    width: 60px;
    height: 60px;
    border: none;
    background-color: #df1617
}

.controlBox .main:after,.controlBox .main:before {
    content: '';
    position: absolute;
    left: 50%;
    z-index: 1;
    width: 20px;
    height: 1px;
    margin-left: -10px;
    margin-top: -.5px;
    background-color: #fff
}

.controlBox .main:before {
    top: calc(50% - 3px)
}

.controlBox .main:after {
    top: calc(50% + 3px)
}

.m_logo a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.m_logo svg {
    width: 60px
}

.m_logo svg .cls-4 {
    fill: #000
}

.hideBox {
    position: absolute;
    top: 0px;
    left: 0;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100vh;
    -webkit-overflow-scrolling: touch;
    background-color: #fff;
    overflow: auto
}

.hideBox:before {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #f6f6f6;
    position: absolute;
    z-index: -1;
    -webkit-clip-path: polygon(0 0, 15% 0, 85% 100%, 0% 100%);
    clip-path: polygon(0 0, 15% 0, 85% 100%, 0% 100%)
}

.hideBox .top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.hideBox .top .searchBox_m {
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.hideBox .top .searchBox_m a.Img {
    display: block;
    width: 22px;
    position: absolute;
    left: 22px;
    top: 50%;
    margin-top: -11px
}

.hideBox .top .searchBox_m a.Img .cls-6 {
    stroke: #df1617
}

.hideBox .top .searchBox_m input {
    width: 100%;
    padding-left: 60px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    background-color: #373737;
    color: #bfbfbf
}

.hideBox .top .searchBox_m input::-webkit-input-placeholder {
    font-size: 14px
}

.hideBox .top .searchBox_m input:-ms-input-placeholder {
    font-size: 14px
}

.hideBox .top .searchBox_m input::-ms-input-placeholder {
    font-size: 14px
}

.hideBox .top .searchBox_m input::placeholder {
    font-size: 14px
}

.hideBox .top a.closeBtn {
    width: 50%;
    background-color: #df1617;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px 0
}

.hideBox .top a.closeBtn .line {
    position: relative;
    width: 23px;
    height: 23px;
    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-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 10px
}

.hideBox .top a.closeBtn .line:before {
    content: '';
    display: block;
    width: 22px;
    height: 1px;
    background-color: #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.hideBox .top a.closeBtn .line:after {
    content: '';
    display: block;
    width: 22px;
    height: 1px;
    margin-top: -1px;
    background-color: #fff;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg)
}

.hideBox .top a.closeBtn b {
    font-weight: 400;
    color: #fff;
    letter-spacing: 1px;
    font-size: 14px
}

.hideBox .hideLogo {
    width: 130px;
    margin: 40px auto
}

.hideBox .hideLogo .cls-4 {
    fill: #000
}

.hideBox .bottom {
    width: 100%;
    padding: 40px 25px;
    background-color: #373737;
    bottom: 0;
    margin-top: 100px
}

.hideBox .bottom .email {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.hideBox .bottom .email span.title {
    width: 50%;
    color: #df1617;
    font-weight: 600;
    font-size: 12px
}

.hideBox .bottom .email span.text {
    width: 50%;
    color: #cecece;
    font-size: 14px;
    line-height: 18px
}

.hideBox .bottom .copyright {
    color: #747474;
    font-weight: 400;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 25px;
    margin-top: 25px;
    border-top: 1px solid #747474;
    font-size: 13px
}

.hideBox .bottom .copyright .translateIbest {
    margin-left: 10px
}

.hideBox .bottom .copyright .translateIbest a:last-child {
    color: #df1617;
    font-weight: 500
}

@media (max-width: 501px) {
    .hideBox .bottom .copyright .translateIbest {
        width:100%;
        margin-left: 0
    }
}

.mMenu {
    margin-bottom: 40px
}

.mMenu>li+li>a:before {
    display: none
}

.mMenu>li>a {
    position: relative;
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 15px;
    letter-spacing: .5px;
    color: #000;
    text-align: center;
    text-transform: capitalize
}

.mMenu>li>a.current {
    color: #df1617
}

.mMenu>li .submenu {
    display: none;
    background-color: #e4e4e4
}

.mMenu>li .submenu a {
    padding: 8px;
    text-align: center;
    display: block;
    font-size: 14px
}

.functionBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.functionBox a {
    width: 180px;
    height: 50px;
    line-height: 50px;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1.5px;
    text-align: center;
    text-transform: uppercase;
    border-radius: 25px;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #95d7e3), to(#0da4e8));
    background-image: -webkit-linear-gradient(left, #95d7e3 0, #0da4e8 100%);
    background-image: -o-linear-gradient(left, #95d7e3 0, #0da4e8 100%);
    background-image: linear-gradient(to right, #95d7e3 0, #0da4e8 100%)
}

@media (min-width: 1181px) and (max-width:1410px) {
    .functionBox a {
        width:120px
    }
}

.menuOpenBtn {
    position: relative;
    width: 50px;
    height: 50px;
    margin-right: 8px;
    border-radius: 50%;
    border: none;
    background-color: #8fd5e2;
    cursor: pointer;
    pointer-events: none;
    visibility: hidden;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}

.menuOpenBtn:hover {
    background-color: #df1617
}

.menuOpenBtn:after,.menuOpenBtn:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 20px;
    height: 1px;
    margin-left: -10px;
    margin-top: -.5px;
    background-color: #fff
}

.menuOpenBtn:before {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px)
}

.menuOpenBtn:after {
    -webkit-transform: translateY(3px);
    -ms-transform: translateY(3px);
    transform: translateY(3px)
}

footer {
    padding-top: 80px;
    color: #fff;
    background-color: #373737
}

footer .top ul.contactItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

footer .top ul.contactItem li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    width: calc(100% / 4)
}

@media (max-width: 1181px) {
    footer .top ul.contactItem li {
        width:calc(100% / 2);
        margin-bottom: 20px
    }
}

@media (max-width: 601px) {
    footer .top ul.contactItem li {
        width:calc(100% / 1)
    }
}

footer .top ul.contactItem li .iconPic {
    width: 95px;
    height: 95px;
    background-color: #414141;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 99em
}

@media (max-width: 601px) {
    footer .top ul.contactItem li .iconPic {
        width:45px;
        height: 45px
    }
}

footer .top ul.contactItem li .iconPic img {
    width: 24px
}

@media (max-width: 601px) {
    footer .top ul.contactItem li .iconPic img {
        width:12px
    }
}

footer .top ul.contactItem li .textRight {
    width: calc(100% - 120px);
    margin-left: 20px
}

footer .top ul.contactItem li .textRight h4 {
    color: #df1617;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px
}

footer .top ul.contactItem li .textRight h4:after {
    content: '';
    width: 15px;
    height: 1px;
    background-color: #fff;
    display: block;
    margin: 10px 0
}

footer .top ul.contactItem li .textRight em {
    font-size: 12px;
    letter-spacing: .5px;
    color: #cecece;
    line-height: 20px;
    display: block
}

footer .bottom {
    border-top: 1px solid #ffffff36;
    margin-top: 40px;
    padding-top: 40px;
    padding-bottom: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (max-width: 961px) {
    footer .bottom {
        padding-bottom:40px
    }
}

footer .bottom .copyright {
    font-size: 12px;
    color: #747474
}

footer .bottom .copyright .translateIbest {
    margin-left: 5px;
    display: inline-block
}

footer .bottom ul.downMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media (max-width: 961px) {
    footer .bottom ul.downMenu {
        display:none
    }
}

footer .bottom ul.downMenu li:last-child:after {
    display: none
}

footer .bottom ul.downMenu li:after {
    content: '·';
    display: inline-block;
    margin: 0 20px;
    color: #828282
}

footer .bottom ul.downMenu li a {
    color: #828282;
    text-transform: capitalize;
    font-size: 14px
}

footer .bottom ul.downMenu li a:hover {
    color: #df1617
}

#insidePage.outerWrap header {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

#insidePage.outerWrap .mainArea {
    padding-bottom: 100px
}

#insidePage.outerWrap .titleBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #000;
    padding-bottom: 15px;
    position: relative
}

#insidePage.outerWrap .titleBox em {
    font-size: 28px;
    color: #df1617
}

@media (max-width: 601px) {
    #insidePage.outerWrap .titleBox em {
        font-size:16px
    }
}

#insidePage.outerWrap .titleBox:before {
    content: '';
    position: absolute;
    width: 60px;
    height: 3px;
    background-color: #df1617;
    bottom: -1px
}

#insideBanner.bannerArea {
    position: relative;
    padding-top: 88px
}

@media (max-width: 1280px) {
    #insideBanner.bannerArea {
        padding-top:60px
    }
}

#insideBanner.bannerArea .wrap {
    width: 100%;
    padding-left: 0;
    padding-right: 0
}

.bannerBox img {
    display: block;
    width: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    height: 322px;
    background-size: cover;
    background-repeat: no-repeat;
    object-fit: cover;
}

#banner .nextArrow,#banner .prevArrow {
    position: absolute;
    top: 50%;
    z-index: 1;
    margin-top: -27px
}

#banner .nextArrow:before,#banner .prevArrow:before {
    border-color: rgba(255, 255, 255, 0.3)
}

#banner .nextArrow:after,#banner .prevArrow:after {
    color: #fff
}

#banner .prevArrow {
    left: 5%
}

#banner .nextArrow {
    right: 5%
}

#banner .nextArrow .circle {
    stroke: #fff
}

.titleArea {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-bottom: 40px;
    color: #df1617
}

@media (max-width: 1180px) {
    .titleArea {
        margin-bottom:30px
    }
}

@media (max-width: 640px) {
    .titleArea {
        padding-top:30px
    }
}

.titleArea .titleBox {
    margin-bottom: 0
}

.titleBox {
    position: relative;
    z-index: 1;
    margin-bottom: 30px
}

.titleBox h2 {
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase
}

@media (max-width: 501px) {
    .titleBox h2 {
        font-size:35px;
        line-height: 38px
    }
}

.titleBox p {
    font-size: 15px;
    line-height: 24px;
    color: #454545;
    font-weight: 400
}

.handText {
    position: absolute;
    top: 0;
    left: -50px;
    z-index: -1;
    font-size: 180px;
    line-height: 1;
    font-family: "Yellowtail", cursive;
    color: #f2f2f2;
    -webkit-transform: rotate(-13deg);
    -ms-transform: rotate(-13deg);
    transform: rotate(-13deg);
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    white-space: nowrap;
    pointer-events: none
}

.bread {
    text-align: right;
    margin-bottom: 100px;
    background-color: #eeeeee;
    padding: 15px 0;
    font-size: 13px;
    color: #8e8e8e;
    text-transform: uppercase
}

.bread a,.bread span {
    display: inline-block;
    font-size: 13px;
    letter-spacing: .5px;
    color: #8e8e8e;
    text-transform: uppercase
}

.bread a:hover {
    color: #df1617
}

.contentBox {
    clear: both
}

.articleTitle {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #d7d7d7;
    font-size: 25px;
    font-weight: 400;
    color: #111
}

@media (max-width: 480px) {
    .articleTitle {
        margin-bottom:10px;
        padding-bottom: 10px;
        font-size: 22px
    }
}

.subTitle {
    position: relative;
    margin-bottom: 5px;
    padding-left: 13px
}

.subTitle:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    width: 3px;
    height: 18px;
    margin-top: -9px;
    background-color: currentColor
}

table.breakpoint>tbody>tr>td.expand {
    cursor: pointer;
    background: url("../images/plus.png") no-repeat 5px center;
    padding-left: 40px
}

@media (max-width: 1180px) {
    .classBox>ul.classLink,.sideMenu>ul.classLink {
        display:none
    }
}

.classBox>ul>li.current>a,.sideMenu>ul>li.current>a {
    color: #df1617;
    border-color: #df1617;
    background-color: transparent
}

.classBox>ul>li.current .submenuList,.sideMenu>ul>li.current .submenuList {
    display: block
}

.classBox>ul>li>a,.sideMenu>ul>li>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 145px;
    height: 35px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 35px;
    font-size: 14px;
    text-align: center;
    letter-spacing: 1px;
    color: #636363;
    border: 1px solid #e4e4e4;
    background-color: #e4e4e4
}

@media (min-width: 1181px) {
    .classBox>ul>li>a:hover,.sideMenu>ul>li>a:hover {
        color:#df1617;
        border-color: #df1617;
        background-color: transparent
    }
}

.classBox>ul .submenuList,.sideMenu>ul .submenuList {
    display: none;
    margin-left: 45px;
    padding-top: 15px
}

.classBox>ul .submenuList a,.sideMenu>ul .submenuList a {
    position: relative;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 14px
}

.classBox>ul .submenuList a:before,.sideMenu>ul .submenuList a:before {
    content: '\f105';
    position: absolute;
    top: 50%;
    left: -13px;
    z-index: 1;
    line-height: 1;
    margin-top: -7px;
    font-family: FontAwesome;
    pointer-events: none;
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
    opacity: 0
}

.classBox>ul .submenuList a.current,.classBox>ul .submenuList a:hover,.sideMenu>ul .submenuList a.current,.sideMenu>ul .submenuList a:hover {
    color: #df1617
}

.classBox>ul .submenuList a.current:before,.classBox>ul .submenuList a:hover:before,.sideMenu>ul .submenuList a.current:before,.sideMenu>ul .submenuList a:hover:before {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

.sideMenu>ul>li+li {
    margin-top: 30px
}

.classBox {
    position: relative;
    z-index: 1;
    margin-bottom: 50px
}

.classBox>ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.classBox>ul>li+li {
    margin-left: 25px
}

.bevelClassBox {
    position: relative;
    z-index: 2;
    margin-top: 40px
}

.bevelClassBox>ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width: 1180px) {
    .bevelClassBox>ul {
        display:none
    }
}

.bevelClassBox>ul>li {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 0);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 0)
}

.bevelClassBox>ul>li+li {
    margin-left: 3px
}

.bevelClassBox>ul>li.current {
    -webkit-clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%, 0 15%);
    clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%, 0 15%)
}

.bevelClassBox>ul>li.current>a {
    color: #fff;
    background-color: #df1617
}

.bevelClassBox>ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 45px 30px;
    font-size: 24px;
    color: #df1617;
    background-color: #f5f5f5;
    letter-spacing: 1px
}

@media (min-width: 1181px) {
    .bevelClassBox>ul>li>a:hover {
        color:#fff;
        background-color: #df1617
    }
}

.m_classLink {
    position: relative;
    z-index: 1
}

@media (min-width: 1181px) {
    .m_classLink {
        display:none
    }
}

.m_classLink .main {
    position: relative;
    display: block;
    font-size: 16px;
    padding: 20px 30px 20px 10px;
    color: #fff;
    letter-spacing: 1px;
    cursor: pointer;
    background-color: #df1617
}

.m_classLink .main:before {
    content: '\f107';
    position: absolute;
    right: 15px;
    top: 50%;
    z-index: 1;
    margin-top: -6px;
    line-height: 1;
    font-size: 15px;
    color: #fff;
    font-family: FontAwesome
}

.m_classLink>ul {
    position: absolute;
    left: 0;
    top: calc(100% - 1px);
    z-index: 1;
    display: none;
    width: 100%;
    background-color: #fff;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1)
}

.m_classLink>ul>li+li {
    border-top: 1px solid #f2f2f2
}

.m_classLink>ul>li.current>a {
    color: #df1617
}

.m_classLink>ul a {
    position: relative;
    z-index: 1;
    display: block;
    padding: 14px 20px;
    color: #000;
    font-size: 14px;
    background-color: #fff
}

.m_classLink .hasSubmenu {
    position: relative;
    padding-right: 40px
}

.m_classLink .hasSubmenu:after {
    content: '\f107';
    position: absolute;
    top: 50%;
    right: 20px;
    z-index: 1;
    line-height: 1;
    margin-top: -7px;
    font-family: FontAwesome
}

.m_classLink .hasSubmenu.open:after {
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg)
}

.m_classLink .submenuList {
    display: none;
    padding-left: 15px;
    padding-bottom: 10px;
    background-color: #efefef
}

.m_classLink .submenuList a {
    padding: 10px 20px;
    background-color: #efefef
}

.m_classLink .submenuList a.current {
    color: #df1617
}

.sectionTitle {
    margin-bottom: 15px;
    font-weight: 400
}

.sectionTitle:after {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    margin-top: 10px;
    background-color: #000
}

.side_menu ul li {
    border-bottom: 1px solid #ccc
}

.side_menu ul li a {
    padding: 12px;
    padding-left: 0;
    display: block;
    position: relative
}

.side_menu ul li a:after {
    content: '';
    width: 0px;
    height: 1px;
    position: absolute;
    background-color: #df1617;
    left: 0;
    bottom: 0
}

.side_menu ul li a:hover:after {
    width: 100%
}

.side_menu ul li a.current {
    color: #df1617
}

.side_menu dl{
    padding-left: 30px;
}

.tab {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 50px;
    margin-bottom: 50px;
    border-bottom: 1px solid #d7d7d7
}

@media (max-width: 1180px) {
    .tab {
        margin-top:30px;
        margin-bottom: 30px
    }
}

.tab a {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 48px;
    padding-left: 30px;
    padding-right: 30px;
    color: #666
}

@media (min-width: 1181px) {
    .tab a:hover {
        color:#111
    }
}

@media (max-width: 1180px) {
    .tab a {
        padding-left:10px;
        padding-right: 10px
    }
}

.tab a.current {
    color: #111
}

.tab a.current:after {
    height: 2px
}

.tab a+a:before {
    content: '';
    position: absolute;
    top: 50%;
    left: -1px;
    z-index: 1;
    width: 1px;
    height: 16px;
    margin-top: -8px;
    background-color: #d7d7d7
}

.tab a:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -1px;
    z-index: 1;
    width: 100%;
    height: 0;
    pointer-events: none;
    background-color: #df1617
}

.tabContent {
    margin-bottom: 70px
}

.tabContent>li {
    display: none
}

.side_album {
    margin-bottom: 30px
}

@media (min-width: 1024px) {
    .side_album {
        margin-top:30px;
        margin-right: -10px
    }
}

@media (max-width: 1023px) {
    .side_album {
        margin-top:10px
    }
}

.side_album li {
    float: left;
    max-width: 100px;
    width: 33.33%;
    padding: 0 10px 10px 0
}

.side_album a {
    display: block;
    -webkit-box-shadow: 2px 2px 5px #c3c3c3;
    box-shadow: 2px 2px 5px #c3c3c3
}

.side_album a img {
    display: block;
    width: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

@media (min-width: 1024px) {
    .side_contactInfo {
        margin-top:50px
    }
}

@media (max-width: 1023px) {
    .side_contactInfo {
        margin-top:20px
    }
}

.side_contactInfo li {
    margin-bottom: 10px
}

.side_contactInfo a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 16px
}

.side_contactInfo i {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    margin-right: 10px;
    border-radius: 50%;
    text-align: center;
    color: #fff;
    background-color: #df1617
}

.side_contactInfo b {
    width: calc(100% - 45px);
    font-weight: 400;
    letter-spacing: 1px;
    word-break: break-all
}

.side_share {
    clear: both;
    display: none;
    margin-top: 30px
}

.side_share a {
    display: block;
    width: 100%;
    margin-top: 5px;
    padding: 15px 10px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 13px;
    line-height: 1;
    color: #fff;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
    text-align: center
}

.side_share i {
    padding-right: 5px;
    font-size: 18px
}

.side_share .line {
    -webkit-box-shadow: 0 0 0 1px #22a00b;
    box-shadow: 0 0 0 1px #22a00b;
    border-top: 1px solid #e1ffa9;
    background: #a7e732;
    background: -webkit-linear-gradient(315deg, #a7e732 0%, #1fb50e 35%);
    background: -o-linear-gradient(315deg, #a7e732 0%, #1fb50e 35%);
    background: linear-gradient(135deg, #a7e732 0%, #1fb50e 35%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a7e732', endColorstr='#1fb50e', GradientType=1)
}

.side_share .fb {
    -webkit-box-shadow: 0 0 0 1px #235c9b;
    box-shadow: 0 0 0 1px #235c9b;
    border-top: 1px solid #8DCFF5;
    background: #5da0ea;
    background: -webkit-gradient(linear, left top, left bottom, from(#5da0ea), to(#3d8ce6));
    background: -webkit-linear-gradient(top, #5da0ea 0%, #3d8ce6 100%);
    background: -o-linear-gradient(top, #5da0ea 0%, #3d8ce6 100%);
    background: linear-gradient(to bottom, #5da0ea 0%, #3d8ce6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5da0ea', endColorstr='#3d8ce6', GradientType=0)
}

.newsClass {
    display: inline-block;
    padding: 5px 20px;
    font-size: 12px;
    font-weight: 300;
    color: #df1617;
    background-color: #d7effb
}

.newsClass+.dateBox {
    margin-left: 15px
}

.dateBox {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #df1617;
    letter-spacing: 1px
}

@media (max-width: 640px) {
    .dateBox {
        -ms-flex-wrap:wrap;
        flex-wrap: wrap;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.dateBox i {
    margin-right: 5px;
    margin-top: 2px
}

@media (min-width: 641px) {
    .dateBox .activity {
        margin-left:20px
    }
}

@media (max-width: 640px) {
    .dateBox .activity {
        width:100%
    }
}

.btnBox {
    margin-top: 35px
}

.btnBox.center .moreBtn {
    margin-left: auto;
    margin-right: auto
}

@media (max-width: 1180px) {
    .btnBox {
        margin-top:20px
    }

    .btnBox .moreBtn {
        margin-left: auto;
        margin-right: auto
    }
}

.moreBtn {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 200px;
    height: 55px;
    padding-left: 20px;
    color: #df1617;
    font: italic 15px "Oswald", "Noto Sans TC", Arial, Helvetica, sans-serif;
    border: 1px solid currentColor;
    text-transform: uppercase;
    letter-spacing: .5px
}

.moreBtn:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #8fd5e2), to(#0ea5e8));
    background-image: -webkit-linear-gradient(left, #8fd5e2 0, #0ea5e8 100%);
    background-image: -o-linear-gradient(left, #8fd5e2 0, #0ea5e8 100%);
    background-image: linear-gradient(to right, #8fd5e2 0, #0ea5e8 100%);
    opacity: 0
}

.moreBtn.fill,.moreBtn.long {
    width: 100%;
    padding-left: 60px
}

@media (min-width: 1181px) {
    .moreBtn.fill:hover svg,.moreBtn.long:hover svg {
        color:#fff;
        right: 30px
    }
}

@media (max-width: 400px) {
    .moreBtn.fill,.moreBtn.long {
        padding-left:20px
    }
}

.moreBtn.long {
    max-width: 355px
}

.moreBtn.current {
    color: #fff;
    border-color: #df1617
}

.moreBtn.current:before {
    opacity: 1
}

.moreBtn.current svg {
    color: #fff;
    right: 30px
}

.moreBtn svg {
    position: absolute;
    top: 50%;
    right: -34px;
    z-index: 1;
    width: 68px;
    height: 5px;
    color: #df1617;
    margin-top: -2.5px
}

@media (min-width: 1181px) {
    .moreBtn:hover {
        color:#fff;
        border-color: #df1617
    }

    .moreBtn:hover:before {
        opacity: 1
    }

    .moreBtn svg {
        -webkit-animation: 2s arrowRight ease-out infinite;
        animation: 2s arrowRight ease-out infinite
    }
}

@media (max-width: 1180px) {
    .moreBtn {
        color:#fff;
        border-color: #df1617
    }

    .moreBtn:before {
        opacity: 1
    }

    .moreBtn svg {
        color: #fff;
        right: 30px;
        -webkit-animation: 2s arrowRight ease-out infinite;
        animation: 2s arrowRight ease-out infinite
    }
}

@-webkit-keyframes arrowRight {
    0%,20%,50%,80%,to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    40% {
        -webkit-transform: translateX(-20%);
        transform: translateX(-20%)
    }

    60% {
        -webkit-transform: translateX(-10%);
        transform: translateX(-10%)
    }
}

@keyframes arrowRight {
    0%,20%,50%,80%,to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    40% {
        -webkit-transform: translateX(-20%);
        transform: translateX(-20%)
    }

    60% {
        -webkit-transform: translateX(-10%);
        transform: translateX(-10%)
    }
}

.rectDotList {
    margin-top: 30px;
    text-align: center
}

.rectDotList>li {
    display: inline-block;
    vertical-align: middle
}

.rectDotList .slick-active button:before {
    background-color: #df1617
}

.rectDotList button {
    position: relative;
    width: 40px;
    height: 40px;
    border: none;
    outline: none;
    color: transparent;
    background-color: transparent
}

@media (min-width: 1181px) {
    .rectDotList button:hover {
        cursor:pointer
    }
}

.rectDotList button:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 10px;
    height: 10px;
    margin-left: -5px;
    margin-top: -5px;
    background-color: #fcfcfc
}

.slick-dots .slick-active button:before {
    background-color: transparent
}

.slick-dots>li {
    display: inline-block
}

.slick-dots button {
    position: relative;
    width: 30px;
    height: 30px;
    border: none;
    outline: none;
    color: transparent;
    background-color: transparent;
    cursor: pointer
}

.slick-dots button:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    margin-left: -3px;
    border-radius: 50%;
    background-color: transparent
}

.parallaxImg,.parallaxText {
    position: absolute;
    z-index: -1
}

.parallaxImg img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.parallaxText {
    line-height: 1
}

@media (min-width: 1181px) {
    .hImgScale:hover .Img img {
        -webkit-transform:scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1)
    }
}

.hImgScale .Img {
    overflow: hidden
}

.hImgScale .Img img {
    display: block;
    max-width: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.newIcon {
    position: absolute;
    top: -17px;
    left: 0;
    z-index: 1;
    padding: 6px 30px;
    font-size: 16px;
    color: #fff;
    letter-spacing: 3px
}

.newIcon_green {
    background: #71c7ac
}

.newIcon_brown {
    background: #ed842e
}

.newIcon_pink {
    background: #f48daf
}

.newIcon_blue {
    background: #719dc7
}

.newIcon_navy {
    background: #3f4c6b
}

.newIcon_orange {
    background: #ecaf75
}

.newIcon_gold {
    background: #eab92d
}

@media (max-width: 480px) {
    .col-2,.col-3,.col-4,.col-5 {
        float:none;
        width: 100%
    }
}

@media screen and (min-width: 0\0) {
    .fMapBox a {
        background-image:none;
        color: #7fccd5
    }
}

#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

#loader-wrapper #loader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 100%;
/*    position: absolute;*/
    z-index: 99999
}

#loader-wrapper #loader svg {
    width: 250px;
    -webkit-animation-name: logofade;
    animation-name: logofade;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    opacity: 0
}

#loader-wrapper #loader svg .cls-4 {
    fill: #000
}

@media (max-width: 550px) {
    #loader-wrapper #loader svg {
        width:150px
    }
}

#loader-wrapper #loader h4 {
    margin-top: 10px;
    color: #df1617;
    -webkit-animation-name: textfade;
    animation-name: textfade;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#loader-wrapper .whiteBg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 1;
    -webkit-transition: all 1s cubic-bezier(0.31, 0, 0.29, 0.99);
    -o-transition: all 1s cubic-bezier(0.31, 0, 0.29, 0.99);
    transition: all 1s cubic-bezier(0.31, 0, 0.29, 0.99)
}

@-webkit-keyframes bgLoad {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@keyframes bgLoad {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@-webkit-keyframes logofade {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@keyframes logofade {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@-webkit-keyframes textfade {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@keyframes textfade {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

.loaded #loader-wrapper .whiteBg {
    width: 0
}

.loaded #loader {
    opacity: 0
}

.loaded #loader-wrapper {
    visibility: hidden
}

body.loaded {
    overflow: unset;
    top: auto
}

.no-js #loader-wrapper {
    display: none
}









.privacyArea{
    position: fixed;
    bottom: 0;
    background-color: #000000d9;
    z-index: 9;
    width: 100%;
    padding: 20px 0;
    letter-spacing: .5px;
    font-size: 13px;
}

.privacyArea .textEditor{
    color:#fff;
    display: flex;
}

@media (max-width: 600px){
    .privacyArea .textEditor{
        flex-wrap: wrap;
    }
}

.privacyArea .textEditor p{
    color:#fff;
    font-weight: 300;
    font-size: 15px;
    padding-right: 40px;
    margin-bottom: 0px !important;
}

@media (max-width: 600px){
    .privacyArea .textEditor p{
        width: 100%;
        padding-right: 0;
    }
}



.privacyArea .textEditor a.btn{
    display: flex;
    color:#fff;
    width: 100px;
    height: 40px;
    justify-content: center;
    align-items:center;
    background-color: #df1617;
    display: flex;
}

@media(max-width: 800px){
    .privacyArea .textEditor a.btn{
        width: 140px;
    }
}

@media(max-width: 600px){
    .privacyArea .textEditor a.btn{
        width: 100px;
        height: 35px;
        margin-top: 10px;
    }
}

.vr_btn{
    position: fixed;
    margin: 0px 12px;
    right: 12px;
    bottom: 90px;
}
.vr_icon{
    width: 60px;
    height: 60px;
}