.hidden {
  display: none;
}

.hidden-seoh {
  visibility: hidden;
  height    : 0px;
  margin    : 0px;
  overflow  : hidden;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block
}

audio,
canvas,
video {
  display: inline-block
}

audio:not([controls]) {
  display: none;
  height : 0
}

[hidden] {
  display: none
}

html {
  font-family             : sans-serif;
  -ms-text-size-adjust    : 100%;
  -webkit-text-size-adjust: 100%
}

body {
  margin: 0
}

a:focus {
  outline: thin dotted
}

a:active,
a:hover {
  outline: 0
}

h1 {
  font-size: 2em;
  margin   : 0.67em 0
}

abbr[title] {
  border-bottom: 1px dotted
}

b,
strong {
  font-weight: bold
}

dfn {
  font-style: italic
}

hr {
  -moz-box-sizing: content-box;
  box-sizing     : content-box;
  height         : 0
}

mark {
  background: #ff0;
  color     : #000
}

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size  : 1em
}

pre {
  white-space: pre-wrap
}

q {
  quotes: "\201C""\201D""\2018""\2019"
}

small {
  font-size: 80%
}

sub,
sup {
  font-size     : 75%;
  line-height   : 0;
  position      : relative;
  vertical-align: baseline
}

sup {
  top: -0.5em
}

sub {
  bottom: -0.25em
}

img {
  border: 0
}

svg:not(:root) {
  overflow: hidden
}

figure {
  margin: 0
}

fieldset {
  border : 1px solid #c0c0c0;
  margin : 0 2px;
  padding: 0.35em 0.625em 0.75em
}

legend {
  border : 0;
  padding: 0
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size  : 100%;
  margin     : 0
}

button,
input {
  line-height: normal
}

button,
select {
  text-transform: none
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor            : pointer
}

button[disabled],
html input[disabled] {
  cursor: default
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding   : 0
}

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing   : content-box;
  -webkit-box-sizing: content-box;
  box-sizing        : content-box
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border : 0;
  padding: 0
}

textarea {
  overflow      : auto;
  vertical-align: top
}

table {
  border-collapse: collapse;
  border-spacing : 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin     : 0;
  line-height: 1.2
}

body {
  overflow-x : hidden;
  background : #fff;
  margin     : 0;
  padding    : 0;
  line-height: 1.4
}

body.hidden {
  overflow: hidden
}

* {
  font-family: "Muli", sans-serif;
  font-weight: 400;
  outline    : none;
  color      : #707070
}

.clr {
  clear  : both;
  display: table;
  float  : none
}

._10 {
  height: 10px
}

._20 {
  height: 20px
}

._30 {
  height: 30px
}

._40 {
  height: 40px
}

._50 {
  height: 50px
}

._60 {
  height: 60px
}

._70 {
  height: 70px
}

.main-color {
  color: #DCB46E !important
}

.sub-color {
  color: #FEDB54 !important
}

.overHide:after,
.landing:after,
.landing .row:after,
.formBox:after,
.navVert.rightTop .owl-nav:after,
.share:after,
.list-search-result .item:after,
.menuCont:after,
.menuHor:after,
.homeAbout:after,
.homeAbout .imgBtn:after,
.homeSer:after,
.row20:after,
.aboutTop:after,
.cont:after,
.aboutGalMain:after,
.aboutGalLeft:after,
.oneEvent:after,
.list-recruitment:after,
.recruitDesc:after,
.recruitBox:after,
.weddingBox .pagewrap:after,
.list-partner:after,
.boxMenu:after,
.slideMenu .owl-dots:after,
.itemMenu:after,
.list-gal-view:after {
  content: "";
  display: table;
  clear  : both
}

.btn-main:before,
.btn-main:after,
.banner .item:after,
.homeSer_slide .tit-wrap>.tit:before,
.homeSer_slide .tit-wrap>.tit:after,
.aboutTop .bg:before,
.homeSer .inside-tit:before,
.homeSer .tit-over:before,
.oneEvent .thumb:after,
.oneRecruit .thumb:after,
.recruitBox .bg:after,
.weddingBox .bg:after,
.onePartner .img:before {
  content : "";
  position: absolute;
  top     : 0;
  right   : 0;
  bottom  : 0;
  left    : 0
}

capcha {
  user-select        : none;
  -moz-user-select   : none;
  -webkit-user-select: none;
  -o-user-select     : none;
  -ms-user-select    : none
}

.construction,
.backTop {
  white-space: nowrap
}

.construction:before,
.backTop:before {
  content       : "";
  display       : inline-block;
  vertical-align: middle;
  height        : 100%
}

.dots .owl-dot,
.dots-small .owl-dot,
.dots-md .owl-dot,
.dots .slick-dots>li,
.dots-small .slick-dots>li,
.dots-md .slick-dots>li,
.landing ul li:after,
.nums>a,
.slideMenu .owl-dot,
.oneVideo .thumb:after {
  border-radius        : 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius   : 50%;
  -o-border-radius     : 50%;
  -ms-border-radius    : 50%
}

.construction>p>a,
.navPro:after,
.aboutGal_next:after,
.aboutGal_prev:after,
.weddingBox .img .thumb:after,
.list-gal-view .item:after,
.oneNews .thumb:before,
.oneGal .thumb:before,
.oneVideo .thumb:before,
.landing a,
.formBox input[type="text"],
.formBox input[type="email"],
.formBox textarea,
.dropdown-share>li>a,
.navVert .owl-prev,
.navVert .owl-next,
.loadMore,
.share>a,
.slickNav .slick-arrow,
.titBox a.tit,
.follow>a,
.nums>a,
.share-button .dropdown-menu>li>a,
.list-search-result .item .img,
.list-search-result .item .tit,
.banner,
.menuLeft>ul>li>a,
.menuLeft>ul>li i,
.menuLeft>ul>li>ul>li>a,
.menuLeft>ul>li>ul>li>ul>li>a,
.navPro:before,
.bannerInside .breadcrumb li a,
.oneRecruit .tit a,
.itemMenu .desc ul li,
.itemMenu .desc ul li:before,
.list-gal-view .item:before,
.oneNews,
.oneGal,
.oneVideo,
.oneNews .tit,
.oneGal .tit,
.oneVideo .tit,
.oneGal .tit:before,
.oneVideo .tit:before,
.owl-item .oneNews,
.owl-item .oneGal,
.owl-item .oneVideo {
  transition        : all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  -moz-transition   : all 0.2s ease;
  -o-transition     : all 0.2s ease;
  -ms-transition    : all 0.2s ease
}

.backTop,
.rightNav>.button,
.rightNav>.button>i,
.rightNav>.button .share-button>i,
.loadMore .icon,
.loadMore .plus,
.fbMess,
.numsList a,
.btn,
.btn-main:before,
.btn-main:after,
header,
.topBtn .bt,
.topLink a,
.menuHor>li>a,
.menuInfo p a,
.menuInfo .menuBook,
.homeAbout .imgBtn a,
.homeSer_slide .tit-wrap>.tit:before,
.homeSer_slide .tit-wrap>.tit:after,
.formStyle .btnSubmit:before,
.fooNav li a,
.img-link:before,
.navPro,
.aboutGal_next,
.aboutGal_prev,
.itemGalSlide .tit,
.oneEvent .thumb:after,
.oneEvent .thumb>.tit,
.weddingBox .tit,
.onePartner .img:before,
.onePartner .link,
.list-gal-view .item .title,
.oneNews .thumb:before,
.oneGal .thumb:before,
.oneVideo .thumb:before,
.oneNews .thumb:after,
.oneGal .thumb:after,
.oneVideo .thumb:after {
  transition        : all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition   : all 0.3s ease;
  -o-transition     : all 0.3s ease;
  -ms-transition    : all 0.3s ease
}

.loadMore .plus:before,
.loadMore .plus:after,
.menuLeft>ul>li,
.homeSer_slide .tit-wrap,
.homeSer_slide .tit-wrap>.tit,
.homeSer .inside-tit,
.homeSer .desc {
  transition        : all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition   : all 0.5s ease;
  -o-transition     : all 0.5s ease;
  -ms-transition    : all 0.5s ease
}

.homeSer .tit-over {
  transition        : all 1s;
  -webkit-transition: all 1s;
  -moz-transition   : all 1s;
  -o-transition     : all 1s;
  -ms-transition    : all 1s
}

.pagewrap,
.dots .owl-dot,
.dots-small .owl-dot,
.dots-md .owl-dot,
.landing [class*="col-"],
.formBox input[type="text"],
.formBox input[type="email"],
.formBox textarea,
.rightNav>.button>i,
.rightNav>.button .share-button>i,
.formPhone,
.contact .custom-iw .gm-style-iw>div,
.custom-iw .gm-style-iw>div {
  box-sizing        : border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing   : border-box;
  -o-box-sizing     : border-box;
  -ms-box-sizing    : border-box
}

.thumb,
.banner .item,
.banner .item .bg,
.menuLeftMain .bg,
.aboutTop .bg,
.img-link,
.counterBox,
.navPro,
.aboutGal_next,
.aboutGal_prev,
.bannerInside,
.recruitBox .bg,
.weddingBox,
.weddingBox .bg,
.onePartner .img,
.itemMenu .img {
  background-position: center center;
  background-repeat  : no-repeat;
  background-size    : cover
}

.dots .owl-dots,
.dots-small .owl-dots,
.dots-md .owl-dots,
.dots .slick-dots,
.dots-small .slick-dots,
.dots-md .slick-dots,
.landing p.full-wrap,
.landing p.full-page {
  -webkit-transform: translateX(-50%);
  -moz-transform   : translateX(-50%);
  -ms-transform    : translateX(-50%);
  -o-transform     : translateX(-50%);
  transform        : translateX(-50%)
}

.btn.btn-gra,
.btn.btn-gra:hover {
  background: -moz-linear-gradient(left, #DCB46E 0%, #f90 100%);
  background: -webkit-linear-gradient(left, #DCB46E 0%, #f90 100%);
  background: -o-linear-gradient(left, #DCB46E 0%, #f90 100%);
  background: -ms-linear-gradient(left, #DCB46E 0%, #f90 100%);
  background: linear-gradient(to right, #DCB46E 0%, #f90 100%)
}

.landing p.col-2,
.banner .pagewrap,
.homeSer_slide .tit-wrap,
.counterMain,
.counterMain .item,
.aboutGalMain,
.conference .aboutTop .desc,
.oneEvent .thumb>.tit,
.oneEvent .thumb .desc,
.oneRecruit .desc,
.weddingBox .img,
.weddingBox .cont,
.onePartner .img span,
.itemMenu .menu-btn,
.oneNews.ser .tit {
  display                : -webkit-box;
  display                : -webkit-flex;
  display                : -ms-flexbox;
  display                : flex;
  -webkit-justify-content: space-between;
  -ms-flex-pack          : space-between;
  justify-content        : space-between
}

.btn {
  color             : #FFF;
  background        : #4c98c9;
  border            : 0;
  margin-bottom     : 10px;
  margin-right      : 5px;
  font-size         : 13px;
  text-transform    : uppercase;
  font-weight       : 500;
  line-height       : 1;
  padding           : 15px 20px 14px;
  border-radius     : 0;
  text-shadow       : none;
  -webkit-transition: all 150ms ease-in-out;
  -o-transition     : all 150ms ease-in-out;
  transition        : all 150ms ease-in-out;
  -webkit-box-shadow: none;
  box-shadow        : none;
  display           : inline-block
}

.text-center .btn {
  margin-left : 4px;
  margin-right: 4px
}

.text-right .btn {
  margin-right: 0
}

.btn-rounded {
  border-radius: 4px
}

.btn-full-rounded {
  border-radius: 30px
}

.btn-s {
  padding  : 12px 15px 11px;
  font-size: 13px
}

.btn-xs {
  padding              : 8px 13px 7px 13px;
  font-size            : 12px;
  border-radius        : 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius   : 3px;
  -o-border-radius     : 3px;
  -ms-border-radius    : 3px
}

.btn-l {
  padding  : 15px 25px 14px;
  font-size: 14px
}

.btn-xl {
  padding  : 17px 25px 16px;
  font-size: 14px
}

.btn.fixed-width {
  width: 165px
}

.btn.bold {
  font-weight: bold
}

.btn.spacing {
  letter-spacing: 1px
}

@-moz-document url-prefix() {
  .btn {
    padding: 14px 20px
  }

  .btn-s {
    padding: 11px 15px
  }

  .btn-l {
    padding: 15px 25px
  }
}

.btn.btn-square {
  padding: 7px 7px 5px 7px
}

.btn-submit {
  margin: 0
}

.btn.btn-blue {
  background: #4c98c9
}

.btn.btn-green {
  background: #3fbfae
}

.btn.btn-orange {
  background: #ee7757
}

.btn.btn-red {
  background: #e45050
}

.btn.btn-yellow {
  background: #f1bd69
}

.btn.btn-pink {
  background: #df739b
}

.btn.btn-purple {
  background: #c78ed7
}

.btn.btn-brown {
  background: #9c7c6f
}

.btn.btn-navy {
  background: #34495e
}

.btn.btn-aqua {
  background: #28b8d8
}

.btn.btn-forest {
  background: #85ae7d
}

.btn.btn-lime {
  background: #afca74
}

.btn.btn-violet {
  background: #9a8eb2
}

.btn.btn-sky {
  background: #7bc4e6
}

.btn.btn-white {
  background: #FFF;
  color     : #404040
}

.btn-border {
  border    : 2px solid #4c98c9;
  background: none;
  color     : #4c98c9
}

.btn.btn-border.btn-blue {
  border-color: #4c98c9;
  background  : none;
  color       : #4c98c9
}

.btn.btn-border.btn-green {
  border-color: #3fbfae;
  background  : none;
  color       : #3fbfae
}

.btn.btn-border.btn-orange {
  border-color: #ee7757;
  background  : none;
  color       : #ee7757
}

.btn.btn-border.btn-red {
  border-color: #e45050;
  background  : none;
  color       : #3fbfae
}

.btn.btn-border.btn-orange {
  border-color: #ee7757;
  background  : none;
  color       : #ee7757
}

.btn.btn-border.btn-red {
  border-color: #e45050;
  background  : none;
  color       : #e45050
}

.btn.btn-border.btn-yellow {
  border-color: #f1bd69;
  background  : none;
  color       : #f1bd69
}

.btn.btn-border.btn-pink {
  border-color: #df739b;
  background  : none;
  color       : #df739b
}

.btn.btn-border.btn-purple {
  border-color: #c78ed7;
  background  : none;
  color       : #c78ed7
}

.btn.btn-border.btn-brown {
  border-color: #9c7c6f;
  background  : none;
  color       : #9c7c6f
}

.btn.btn-border.btn-navy {
  border-color: #34495e;
  background  : none;
  color       : #34495e
}

.btn.btn-border.btn-aqua {
  border-color: #28b8d8;
  background  : none;
  color       : #28b8d8
}

.btn.btn-border.btn-forest {
  border-color: #85ae7d;
  background  : none;
  color       : #85ae7d
}

.btn.btn-border.btn-lime {
  border-color: #afca74;
  background  : none;
  color       : #afca74
}

.btn.btn-border.btn-violet {
  border-color: #9a8eb2;
  background  : none;
  color       : #9a8eb2
}

.btn.btn-border.btn-sky {
  border-color: #7bc4e6;
  background  : none;
  color       : #7bc4e6
}

.btn.btn-border.btn-white {
  border-color: #FFF;
  background  : none;
  color       : #FFF
}

.btn.btn-center {
  display     : table;
  margin-left : auto !important;
  margin-right: auto !important
}

.btn:hover,
.btn:focus,
.btn:active,
.btn.active {
  background        : #DCB46E;
  color             : #fff;
  border            : 0;
  -webkit-transition: all 150ms ease-in-out;
  -o-transition     : all 150ms ease-in-out;
  transition        : all 150ms ease-in-out;
  -webkit-box-shadow: none;
  box-shadow        : none
}

.btn.btn-blue:hover,
.btn.btn-blue:focus,
.btn.btn-blue:active,
.btn.btn-blue.active {
  background: #3682b2
}

.btn.btn-green:hover,
.btn.btn-green:focus,
.btn.btn-green:active,
.btn.btn-green.active {
  background: #2fac9b
}

.btn.btn-orange:hover,
.btn.btn-orange:focus,
.btn.btn-orange:active,
.btn.btn-orange.active {
  background: #dc6849
}

.btn.btn-red:hover,
.btn.btn-red:focus,
.btn.btn-red:active,
.btn.btn-red.active {
  background: #d14242
}

.btn.btn-yellow:hover,
.btn.btn-yellow:focus,
.btn.btn-yellow:active,
.btn.btn-yellow.active {
  background: #e5af57
}

.btn.btn-pink:hover,
.btn.btn-pink:focus,
.btn.btn-pink:active,
.btn.btn-pink.active {
  background: #d2648d
}

.btn.btn-purple:hover,
.btn.btn-purple:focus,
.btn.btn-purple:active,
.btn.btn-purple.active {
  background: #b97cca
}

.btn.btn-brown:hover,
.btn.btn-brown:focus,
.btn.btn-brown:active,
.btn.btn-brown.active {
  background: #8b6a5d
}

.btn.btn-navy:hover,
.btn.btn-navy:focus,
.btn.btn-navy:active,
.btn.btn-navy.active {
  background: #223344
}

.btn.btn-aqua:hover,
.btn.btn-aqua:focus,
.btn.btn-aqua:active,
.btn.btn-aqua.active {
  background: #19aaca
}

.btn.btn-forest:hover,
.btn.btn-forest:focus,
.btn.btn-forest:active,
.btn.btn-forest.active {
  background: #749d6c
}

.btn.btn-lime:hover,
.btn.btn-lime:focus,
.btn.btn-lime:active,
.btn.btn-lime.active {
  background: #9cb663
}

.btn.btn-violet:hover,
.btn.btn-violet:focus,
.btn.btn-violet:active,
.btn.btn-violet.active {
  background: #867aa0
}

.btn.btn-sky:hover,
.btn.btn-sky:focus,
.btn.btn-sky:active,
.btn.btn-sky.active {
  background: #65afd2
}

.btn.btn-white:hover,
.btn.btn-white:focus,
.btn.btn-white:active,
.btn.btn-white.active {
  background: #f1f1f1;
  color     : #404040
}

.btn-border:hover,
.btn-border:focus,
.btn-border:active,
.btn-border.active {
  border    : 2px solid #4c98c9;
  color     : #FFF;
  background: #4c98c9
}

.btn.btn-border.btn-blue:hover,
.btn.btn-border.btn-blue:focus,
.btn.btn-border.btn-blue:active,
.btn.btn-border.btn-blue.active {
  background: #4c98c9;
  color     : #FFF
}

.btn.btn-border.btn-green:hover,
.btn.btn-border.btn-green:focus,
.btn.btn-border.btn-green:active,
.btn.btn-border.btn-green.active {
  background: #3fbfae;
  color     : #FFF
}

.btn.btn-border.btn-orange:hover,
.btn.btn-border.btn-orange:focus,
.btn.btn-border.btn-orange:active,
.btn.btn-border.btn-orange.active {
  background: #ee7757;
  color     : #FFF
}

.btn.btn-border.btn-red:hover,
.btn.btn-border.btn-red:focus,
.btn.btn-border.btn-red:active,
.btn.btn-border.btn-red.active {
  background: #e45050;
  color     : #FFF
}

.btn.btn-border.btn-yellow:hover,
.btn.btn-border.btn-yellow:focus,
.btn.btn-border.btn-yellow:active,
.btn.btn-border.btn-yellow.active {
  background: #f1bd69;
  color     : #FFF
}

.btn.btn-border.btn-pink:hover,
.btn.btn-border.btn-pink:focus,
.btn.btn-border.btn-pink:active,
.btn.btn-border.btn-pink.active {
  background: #df739b;
  color     : #FFF
}

.btn.btn-border.btn-purple:hover,
.btn.btn-border.btn-purple:focus,
.btn.btn-border.btn-purple:active,
.btn.btn-border.btn-purple.active {
  background: #c78ed7;
  color     : #FFF
}

.btn.btn-border.btn-brown:hover,
.btn.btn-border.btn-brown:focus,
.btn.btn-border.btn-brown:active,
.btn.btn-border.btn-brown.active {
  background: #9c7c6f;
  color     : #FFF
}

.btn.btn-border.btn-navy:hover,
.btn.btn-border.btn-navy:focus,
.btn.btn-border.btn-navy:active,
.btn.btn-border.btn-navy.active {
  background: #34495e;
  color     : #FFF
}

.btn.btn-border.btn-aqua:hover,
.btn.btn-border.btn-aqua:focus,
.btn.btn-border.btn-aqua:active,
.btn.btn-border.btn-aqua.active {
  background: #28b8d8;
  color     : #FFF
}

.btn.btn-border.btn-forest:hover,
.btn.btn-border.btn-forest:focus,
.btn.btn-border.btn-forest:active,
.btn.btn-border.btn-forest.active {
  background: #85ae7d;
  color     : #FFF
}

.btn.btn-border.btn-lime:hover,
.btn.btn-border.btn-lime:focus,
.btn.btn-border.btn-lime:active,
.btn.btn-border.btn-lime.active {
  background: #afca74;
  color     : #FFF
}

.btn.btn-border.btn-violet:hover,
.btn.btn-border.btn-violet:focus,
.btn.btn-border.btn-violet:active,
.btn.btn-border.btn-violet.active {
  background: #9a8eb2;
  color     : #FFF
}

.btn.btn-border.btn-sky:hover,
.btn.btn-border.btn-sky:focus,
.btn.btn-border.btn-sky:active,
.btn.btn-border.btn-sky.active {
  background: #7bc4e6;
  color     : #FFF
}

.btn.btn-border.btn-white:hover,
.btn.btn-border.btn-white:focus,
.btn.btn-border.btn-white:active,
.btn.btn-border.btn-white.active {
  background: #FFF;
  color     : #404040
}

.btn-icon i {
  vertical-align: -1px;
  color         : inherit
}

.btn-icon-left i {
  margin-right: 5px
}

.btn-icon-right i {
  margin-left: 5px
}

.btn-close {
  font-size  : 45px;
  font-weight: 300;
  color      : inherit
}

.btn-close:before {
  content       : '\00d7';
  padding       : 0;
  letter-spacing: normal
}

.cart-remove .btn-close {
  font-size: 25px
}

.btn.btn-gra {
  position: relative;
  z-index : 2;
  overflow: hidden;
  color   : #fff
}

.btn.btn-gra:hover {
  opacity: 0.7
}

.btn.btn-full {
  width : 100%;
  margin: 0
}

@media screen and (max-width: 1023px) {
  .mb-md-30 {
    margin-bottom: 30px
  }
}

@font-face {
  font-family: 'Muli';
  font-weight: 300;
  src        : url("../fonts/Muli-Light.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 300;
  font-style : italic;
  src        : url("../fonts/Muli-LightItalic.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 400;
  src        : url("../fonts/Muli-Regular.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 400;
  font-style : italic;
  src        : url("../fonts/Muli-Italic.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 600;
  src        : url("../fonts/Muli-SemiBold.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 600;
  font-style : italic;
  src        : url("../fonts/Muli-SemiBoldItalic.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 700;
  src        : url("../fonts/Muli-Bold.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 700;
  font-style : italic;
  src        : url("../fonts/Muli-BoldItalic.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 800;
  src        : url("../fonts/Muli-ExtraBold.ttf") format("truetype")
}

@font-face {
  font-family: 'Muli';
  font-weight: 900;
  src        : url("../fonts/Muli-Black.ttf") format("truetype")
}

@font-face {
  font-family: 'Tinos';
  font-style : normal;
  font-weight: 400;
  src        : local("Tinos"), url("../fonts/Tinos.woff") format("woff")
}

@font-face {
  font-family: 'Tinos';
  font-style : normal;
  font-weight: 700;
  src        : local("Tinos Bold"), local("Tinos-Bold"), url("../fonts/Tinos-Bold.woff") format("woff")
}

@font-face {
  font-family: 'Tinos';
  font-style : italic;
  font-weight: 400;
  src        : local("Tinos Italic"), local("Tinos-Italic"), url("../fonts/Tinos-Italic.woff") format("woff")
}

@font-face {
  font-family: 'Tinos';
  font-style : italic;
  font-weight: 700;
  src        : local("Tinos Bold Italic"), local("Tinos-BoldItalic"), url("../fonts/Tinos-BoldItalic.woff") format("woff")
}

@font-face {
  font-family: 'iCiel Rukola';
  font-style : normal;
  font-weight: normal;
  src        : local("iCiel Rukola"), local("iCielRukola"), url("../fonts/iCielRukola.ttf") format("truetype")
}

a {
  outline        : none;
  text-decoration: none;
  color          : #DCB46E
}

a:focus {
  outline: none;
  color  : inherit
}

a:hover {
  color: #000
}

strong,
strong *,
b,
b * {
  font-weight: bolder
}

em,
em *,
i,
i * {
  font-style: italic
}

u,
u * {
  text-decoration: underline
}

img {
  border: none
}

.cap {
  text-transform: uppercase
}

.construction {
  position  : fixed;
  top       : 0;
  left      : 0;
  background: #fff;
  z-index   : 30000;
  width     : 100%;
  height    : 100%;
  text-align: center
}

.construction>p {
  display       : inline-block;
  vertical-align: middle;
  text-align    : center
}

.construction>p>span {
  display    : block;
  clear      : both;
  font-size  : 30px;
  font-weight: 400;
  color      : #333;
  line-height: 2em
}

.construction>p>a {
  display              : inline-block;
  vertical-align       : top;
  margin               : auto;
  padding              : 3px 12px;
  border               : solid 1px #DCB46E;
  margin-top           : 10px;
  font-size            : 14px;
  color                : #fff;
  background           : #DCB46E;
  line-height          : 28px;
  text-decoration      : none !important;
  font-weight          : bold;
  border-radius        : 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius   : 20px;
  -o-border-radius     : 20px;
  -ms-border-radius    : 20px;
  cursor               : pointer
}

.construction>p>a i {
  margin-right: 5px;
  color       : inherit;
  font-size   : 18px
}

.construction>p>a:hover {
  background  : #FEDB54;
  border-color: #FEDB54;
  color       : #DCB46E
}

::selection {
  background-color: #DCB46E;
  color           : #fff
}

::-webkit-selection {
  background-color: #DCB46E;
  color           : #fff
}

-webkit-::selection {
  background-color: #DCB46E;
  color           : #fff
}

::-moz-selection {
  background-color: #DCB46E;
  color           : #fff
}

.backTop {
  display    : none;
  position   : fixed;
  right      : 5px;
  bottom     : 10px;
  width      : 45px;
  height     : 50px;
  line-height: 50px;
  text-align : center;
  background : #DCB46E;
  cursor     : pointer;
  z-index    : 100;
  font-size  : 0;
  color      : #fff
}

@media screen and (max-width: 767px) {
  .backTop {
    width: 35px
  }
}

@media screen and (max-width: 767px) {
  .backTop {
    height: 35px
  }
}

@media screen and (max-width: 767px) {
  .backTop {
    line-height: 35px
  }
}

@media screen and (max-width: 767px) {
  .backTop {
    right: 0
  }
}

@media screen and (max-width: 767px) {
  .backTop {
    border-radius: 50%
  }
}

.backTop * {
  color    : inherit;
  font-size: inherit
}

.backTop:hover {
  background: #333
}

.backTop img {
  position      : relative;
  display       : inline-block;
  vertical-align: middle;
  width         : 10px;
  height        : auto;
  z-index       : 2
}

@media screen and (max-width: 767px) {
  .backTop img {
    width: 7px
  }
}

.overHide {
  overflow: hidden
}

.thumb {
  display       : block;
  position      : relative;
  padding-bottom: 66.6666%
}

.thumb>img {
  position: absolute;
  display : none !important;
  width   : 100%;
  height  : auto
}

.thumb br {
  display: none
}

.owl-item .thumb>img {
  display: none !important
}

.navPro:after,
.aboutGal_next:after,
.aboutGal_prev:after,
.weddingBox .img .thumb:after,
.list-gal-view .item:after,
.oneNews .thumb:before,
.oneGal .thumb:before,
.oneVideo .thumb:before {
  content   : "";
  position  : absolute;
  left      : 0;
  top       : 0;
  right     : 0;
  bottom    : 0;
  z-index   : 1;
  background: #DCB46E;
  opacity   : 0
}

.navPro:hover:after,
.aboutGal_next:hover:after,
.aboutGal_prev:hover:after,
.weddingBox .img .thumb:hover:after,
.list-gal-view .item:hover:after,
.oneNews .thumb:hover:before,
.oneGal .thumb:hover:before,
.oneVideo .thumb:hover:before {
  opacity: 0.2
}

.ell *,
.itemGalSlide .tit *,
.oneRecruit p *,
.weddingBox .tit *,
.oneNews .tit *,
.oneGal .tit *,
.oneVideo .tit *,
.oneNews p *,
.oneGal p *,
.oneVideo p * {
  font-size  : inherit;
  color      : inherit;
  font-family: inherit;
  font-weight: inherit;
  font-style : inherit;
  margin     : 0
}

.pagewrap {
  width    : 1200px;
  max-width: calc(100% - 40px);
  margin   : 0 auto;
  position : relative
}

.loading {
  position: relative
}

.loading::before {
  content   : '';
  position  : fixed;
  z-index   : 100000;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
  background: #fff
}

.loading::after {
  content       : '';
  position      : fixed;
  z-index       : 100000;
  top           : 50%;
  left          : 50%;
  width         : 60px;
  height        : 60px;
  margin        : -30px 0 0 -30px;
  pointer-events: none;
  border-radius : 50%;
  opacity       : 0.4;
  background    : #DCB46E;
  animation     : loaderAnim 0.7s linear infinite alternate forwards
}

.loader {
  position                   : fixed;
  top                        : 0;
  left                       : 0;
  width                      : 100%;
  height                     : 100%;
  z-index                    : 99;
  opacity                    : 0;
  pointer-events             : none;
  -webkit-animation          : fadeOut 1s ease backwards;
  -moz-animation             : fadeOut 1s ease backwards;
  -o-animation               : fadeOut 1s ease backwards;
  -ms-animation              : fadeOut 1s ease backwards;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode     : both;
  animation-fill-mode        : both
}

.loader.block {
  -webkit-animation          : fadeIn 2s ease backwards;
  -moz-animation             : fadeIn 2s ease backwards;
  -o-animation               : fadeIn 2s ease backwards;
  -ms-animation              : fadeIn 2s ease backwards;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode     : both;
  animation-fill-mode        : both
}

.loader::before {
  content   : '';
  position  : fixed;
  z-index   : 100000;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
  background: #fff
}

@keyframes loaderAnim {
  to {
    opacity  : 1;
    transform: scale3d(0.5, 0.5, 1)
  }
}

.mobile_viewer .banner .owl-nav {
  display: none
}

.mobile_viewer input[type="text"],
.mobile_viewer input[type="email"],
.mobile_viewer textarea {
  -webkit-appearance: none;
  -moz-appearance   : none;
  appearance        : none
}

.mobile_viewer ::-webkit-scrollbar {
  -webkit-appearance: none
}

.mobile_viewer ::-webkit-scrollbar:vertical {
  width: 4px
}

.mobile_viewer ::-webkit-scrollbar:horizontal {
  height: 4px
}

.mobile_viewer ::-webkit-scrollbar-thumb {
  background-color: #C8C8C8;
  border-radius   : 10px
}

.mobile_viewer ::-webkit-scrollbar-track {
  border-radius   : 10px;
  background-color: #eee
}

.dots .owl-dots,
.dots-small .owl-dots,
.dots-md .owl-dots {
  position      : absolute;
  bottom        : 50px;
  left          : 50%;
  font-size     : 0;
  letter-spacing: 0;
  white-space   : nowrap
}

.dots .owl-dot,
.dots-small .owl-dot,
.dots-md .owl-dot {
  display       : inline-block;
  vertical-align: top;
  width         : 16px;
  height        : 16px;
  border        : solid 2px #fff !important;
  position      : relative;
  background    : #fff;
  margin        : 0 6px
}

.dots .owl-dot.active,
.dots-small .owl-dot.active,
.dots-md .owl-dot.active {
  background: transparent
}

.dots .slick-dots,
.dots-small .slick-dots,
.dots-md .slick-dots {
  position: absolute;
  display : block;
  margin  : 0;
  left    : 50%;
  bottom  : 0;
  padding : 0;
  height  : auto
}

.dots .slick-dots>li,
.dots-small .slick-dots>li,
.dots-md .slick-dots>li {
  list-style    : none;
  display       : inline-block;
  vertical-align: top;
  width         : 8px;
  height        : 8px;
  padding       : 0;
  margin        : 0 4px;
  background    : rgba(255, 255, 255, 0.4)
}

.dots .slick-dots>li.slick-active,
.dots-small .slick-dots>li.slick-active,
.dots-md .slick-dots>li.slick-active {
  background: #fff
}

.dots .slick-dots>li button,
.dots-small .slick-dots>li button,
.dots-md .slick-dots>li button {
  display: none
}

.dots.white .owl-dot,
.dots-small.white .owl-dot,
.dots-md.white .owl-dot {
  border-color: #fff
}

.dots.white .owl-dot.active,
.dots-small.white .owl-dot.active,
.dots-md.white .owl-dot.active {
  background: #fff
}

.dots.dots-out .owl-dots,
.dots-small.dots-out .owl-dots,
.dots-md.dots-out .owl-dots {
  display          : table;
  margin           : 20px auto 0 auto;
  position         : static;
  -webkit-transform: none;
  -ms-transform    : none;
  -o-transform     : none;
  transform        : none
}

.dots.dots-out .owl-dot,
.dots-small.dots-out .owl-dot,
.dots-md.dots-out .owl-dot {
  border-color: #DCB46E;
  background  : #DCB46E
}

.dots-md .owl-dot {
  width : 15px;
  height: 15px
}

.dots-small .owl-dot {
  width       : 12px;
  height      : 12px;
  border-width: 1px
}

.owl-carousel {
  display: block !important
}

.mobile_viewer .scrollPane {
  overflow: auto !important
}

body .jspVerticalBar {
  width     : 14px;
  background: transparent
}

body .jspTrack {
  background: transparent
}

body .jspTrack:after {
  content              : "";
  position             : absolute;
  top                  : 0;
  left                 : 0;
  right                : 0;
  bottom               : 0;
  width                : 4px;
  margin               : auto;
  background           : #E6E6E6;
  border-radius        : 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius   : 5px;
  -o-border-radius     : 5px;
  -ms-border-radius    : 5px
}

body .jspDrag {
  background: transparent
}

body .jspDrag:after {
  content              : "";
  position             : absolute;
  top                  : 0;
  left                 : 0;
  right                : 0;
  bottom               : 0;
  width                : 6px;
  margin               : auto;
  background           : #C8C8C8;
  z-index              : 10;
  border-radius        : 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius   : 5px;
  -o-border-radius     : 5px;
  -ms-border-radius    : 5px
}

body .jspDrag:hover:after {
  background: #999
}

body:hover .jspDrag:hover:after {
  background: #999
}

.landing {
  color      : #666;
  font-size  : 17px;
  font-family: "Tinos", sans-serif
}

.landing * {
  font-family: inherit
}

@media screen and (max-width: 767px) {
  .landing {
    font-size: 14px
  }
}

.landing p,
.landing ul,
.landing ol {
  margin     : 0;
  line-height: 1.4;
  color      : inherit;
  text-align : justify
}

.landing p strong,
.landing p b,
.landing ul strong,
.landing ul b,
.landing ol strong,
.landing ol b {
  font-size: inherit
}

.landing p *,
.landing ul *,
.landing ol * {
  color: inherit
}

.landing p+ul,
.landing p+ol,
.landing p+p,
.landing ul+ul,
.landing ul+ol,
.landing ul+p,
.landing ol+ol,
.landing ol+ul,
.landing ol+p {
  margin-top: 20px
}

.landing ul,
.landing ol {
  padding-left: 25px
}

.landing ul li,
.landing ol li {
  font-weight: inherit;
  font-family: inherit
}

.landing ul>li li,
.landing ol>li li {
  list-style: disc;
  color     : inherit
}

.landing ol>li {
  list-style-type  : none;
  counter-increment: list;
  position         : relative;
  margin-bottom    : 10px;
  padding-left     : 10px
}

.landing ol>li:after {
  content   : counter(list) ".";
  position  : absolute;
  top       : 0;
  left      : -35px;
  width     : 2em;
  text-align: right;
  color     : red
}

.landing ul {
  padding-left: 15px
}

.landing ul li {
  list-style   : none;
  position     : relative;
  padding-left : 18px;
  margin-bottom: 5px
}

.landing ul li:after {
  content   : "";
  position  : absolute;
  left      : 0px;
  top       : 9px;
  width     : 6px;
  height    : 6px;
  background: #999
}

.landing span,
.landing b,
.landing strong,
.landing em,
.landing u {
  font-family: inherit
}

.landing b,
.landing strong {
  font-weight: bolder
}

.landing [class*="width-"] {
  margin-left : auto;
  margin-right: auto
}

.landing p .img {
  display      : inline-block;
  max-width    : 100%;
  margin-top   : 15px;
  margin-bottom: 15px
}

.landing p.full-wrap {
  position  : relative;
  width     : 1360px;
  left      : 50%;
  max-width : calc(100vw - 40px);
  text-align: center
}

.landing p.full-page {
  position  : relative;
  width     : 100vw;
  left      : 50%;
  max-width : 100vw;
  text-align: center
}

.landing p.col-2 .img {
  display       : inline-block;
  vertical-align: top;
  width         : calc(50% - 10px)
}

.landing img {
  width    : auto;
  height   : auto !important;
  max-width: 100%
}

.landing p>img {
  margin-top   : 15px;
  margin-bottom: 15px
}

.landing h1,
.landing .h1,
.landing h2,
.landing .h2,
.landing h3,
.landing .h3,
.landing h4,
.landing .h4,
.landing h5,
.landing .h5,
.landing h6,
.landing .h6 {
  line-height  : 1.4;
  margin-bottom: 20px;
  color        : #444;
  font-weight  : bold
}

.landing h1 strong,
.landing h1 b,
.landing .h1 strong,
.landing .h1 b,
.landing h2 strong,
.landing h2 b,
.landing .h2 strong,
.landing .h2 b,
.landing h3 strong,
.landing h3 b,
.landing .h3 strong,
.landing .h3 b,
.landing h4 strong,
.landing h4 b,
.landing .h4 strong,
.landing .h4 b,
.landing h5 strong,
.landing h5 b,
.landing .h5 strong,
.landing .h5 b,
.landing h6 strong,
.landing h6 b,
.landing .h6 strong,
.landing .h6 b {
  font-weight: bolder
}

.landing p+h1,
.landing p+h2,
.landing p+h3,
.landing p+h4,
.landing p+h5,
.landing p+h6,
.landing ul+h1,
.landing ul+h2,
.landing ul+h3,
.landing ul+h4,
.landing ul+h5,
.landing ul+h6,
.landing ol+h1,
.landing ol+h2,
.landing ol+h3,
.landing ol+h4,
.landing ol+h5,
.landing ol+h6 {
  margin-top: 20px
}

.landing h1,
.landing .h1 {
  font-size: 35px
}

.landing h2,
.landing .h2 {
  font-size: 30px
}

.landing h3,
.landing .h3 {
  font-size: 26px
}

.landing h4,
.landing .h4 {
  font-size: 22px
}

.landing h5,
.landing .h5 {
  font-size: 18px
}

.landing h6,
.landing .h6 {
  font-size: 14px
}

.landing p+.row,
.landing div+.row,
.landing ul+.row,
.landing ol+.row,
.landing h1+.row,
.landing h2+.row,
.landing h3+.row,
.landing h4+.row,
.landing h5+.row,
.landing h6+.row {
  margin-top   : 25px;
  margin-bottom: 25px
}

.landing .title {
  display    : block;
  font-weight: bold;
  color      : #fff;
  line-height: 1.2;
  font-size  : 25px
}

@media screen and (min-width: 600px) {
  .landing .title {
    font-size: calc(25px + 20 * (100vw - 600px) / 890)
  }
}

@media screen and (min-width: 1490px) {
  .landing .title {
    font-size: 45px
  }
}

.landing h2.desc {
  font-size  : 15px;
  color      : #666;
  font-style : italic;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif
}

.landing hr {
  border-top         : none;
  border-bottom-color: #828282;
  margin-top         : 20px;
  margin-bottom      : 20px
}

@media screen and (min-width: 600px) {
  .landing hr {
    margin-top: calc(20px + 30 * (100vw - 600px) / 1320)
  }
}

@media screen and (min-width: 1920px) {
  .landing hr {
    margin-top: 50px
  }
}

@media screen and (min-width: 600px) {
  .landing hr {
    margin-bottom: calc(20px + 30 * (100vw - 600px) / 1320)
  }
}

@media screen and (min-width: 1920px) {
  .landing hr {
    margin-bottom: 50px
  }
}

.landing blockquote {
  border     : none;
  padding    : 3px 0 5px 40px;
  position   : relative;
  font-size  : 17px;
  font-weight: 600;
  font-style : italic;
  color      : #1E1E46;
  font-family: "Muli", sans-serif
}

.landing blockquote:before {
  content   : "";
  position  : absolute;
  top       : 0;
  left      : 0;
  width     : 25px;
  height    : 20px;
  background: url("../images/quote.png") no-repeat left center
}

.landing blockquote:after {
  content       : "";
  display       : inline-block;
  vertical-align: bottom;
  width         : 25px;
  height        : 20px;
  margin        : 0 0 -5px 5px;
  background    : url("../images/quote.png") no-repeat right center
}

.landing a {
  color: #DCB46E !important
}

.landing a:hover {
  color          : #000 !important;
  text-decoration: underline
}

.landing .fr-video {
  display       : block;
  width         : 100%;
  padding-bottom: 56.25%;
  position      : relative
}

.landing .fr-video iframe,
.landing .fr-video video {
  display : block;
  position: absolute;
  top     : 0;
  left    : 0;
  width   : 100%;
  height  : 100%
}

.landing video {
  display: block;
  width  : 100%;
  height : 400px
}

.landing .row {
  margin-bottom: 25px;
  margin-left  : -10px;
  margin-right : -10px
}

.landing [class*="col-"] {
  padding-left : 10px;
  padding-right: 10px
}

.landing [class*="col-"] img {
  width  : 100%;
  display: block
}

.landing [class*="col-"] .img {
  margin-top   : 10px;
  margin-bottom: 0
}

.landing .col-md-6 {
  width: 50%;
  float: left
}

.landing .desc {
  margin-bottom: 20px
}

.landing .table-bordered td,
.landing .table-bordered th {
  padding: 10px 12px
}

.landing .main-color {
  color      : #DCB46E;
  text-shadow: 0.01em 0 #DCB46E
}

.landing .sub-color {
  color      : #FEDB54;
  text-shadow: 0.01em 0 #FEDB54
}

.landing .datePost {
  display  : block;
  font-size: 13px;
  color    : #888;
  margin   : -5px 0 25px 0
}

.landing .datePost i {
  display       : inline-block;
  vertical-align: top;
  font-size     : 14px;
  margin        : 1px 7px 0 0
}

.landing table {
  border         : none;
  border-collapse: collapse;
  empty-cells    : show;
  width          : 100%;
  max-width      : 100%;
  margin-bottom  : 30px;
  margin-top     : 5px
}

.landing table.fr-dashed-borders td,
.landing table.fr-dashed-borders th {
  border-style: dashed
}

.landing table.fr-alternate-rows tbody tr:nth-child(2n) {
  background: #f5f5f5
}

.landing table h1,
.landing table .h1,
.landing table h2,
.landing table .h2,
.landing table h3,
.landing table .h3,
.landing table h4,
.landing table .h4,
.landing table h5,
.landing table .h5,
.landing table h6,
.landing table .h6 {
  margin-top : 0;
  font-family: "Muli", sans-serif
}

.landing table>thead>tr>th,
.landing table>tbody>tr>th,
.landing table>tfoot>tr>th,
.landing table>thead>tr>td,
.landing table>tbody>tr>td,
.landing table>tfoot>tr>td,
.landing table>tr>th,
.landing table>tr>td {
  border     : 1px solid #ccc;
  padding    : 10px 15px;
  font-size  : 15px;
  color      : inherit;
  line-height: 1.4
}

.landing table td:empty,
.landing table th:empty {
  height: 20px
}

.landing table td.fr-highlighted,
.landing table th.fr-highlighted {
  border: 1px double red
}

.landing table td.fr-thick,
.landing table th.fr-thick {
  border-width: 2px
}

.landing table th {
  background: #e6e6e6
}

.landing table.bg-head {
  margin-bottom: 40px
}

.landing table.bg-head tr th {
  background  : #ffb400;
  color       : #fff;
  border-color: #FFAA00;
  box-shadow  : inset 1px -1px #FFBE00
}

.landing table.bg-head tr th * {
  color: inherit
}

.landing table.bg-head tr td {
  background  : #F5F5F5;
  border-color: #EBEBEB;
  box-shadow  : inset 1px -1px #fff
}

.landing table.no-border {
  border: none
}

.landing table.no-border tr,
.landing table.no-border th,
.landing table.no-border td {
  border      : inherit;
  padding-left: 0
}

.landing .table-responsive {
  border       : none;
  margin-bottom: 30px;
  box-shadow   : inset 1px 0 #ccc, inset -1px 0 #ccc
}

.landing .table-responsive table {
  margin-bottom: 0;
  margin-top   : 0
}

.landing .column-2 {
  column-count: 2;
  column-gap  : 4vw
}

.list {
  width         : calc(100% + 35px);
  font-size     : 0;
  letter-spacing: 0
}

.invert-text {
  color: #fff
}

.invert-text * {
  color: inherit
}

.hide {
  display: none
}

.formBox select {
  border               : none;
  border               : solid 2px #E1E1E1;
  height               : 45px !important;
  outline              : none !important;
  box-shadow           : none !important;
  -webkit-appearance   : none;
  -moz-appearance      : none;
  position             : relative;
  font-size            : 14px;
  border-radius        : 7px !important;
  -webkit-border-radius: 7px !important;
  -moz-border-radius   : 7px !important;
  -o-border-radius     : 7px !important;
  -ms-border-radius    : 7px !important
}

.formBox select:focus {
  border-color: #DCB46E !important
}

.formBox .select {
  position: relative
}

.formBox .select:before {
  content   : "";
  position  : absolute;
  right     : 0;
  bottom    : 17px;
  width     : 30px;
  height    : 16px;
  margin    : auto;
  background: url("../images/icon-select.png") no-repeat center center;
  z-index   : 2
}

.formBox input[type="text"],
.formBox input[type="email"] {
  line-height: 45px;
  height     : 45px
}

.formBox input[type="text"],
.formBox input[type="email"],
.formBox textarea {
  outline              : none !important;
  box-shadow           : none !important;
  font-size            : 14px;
  border               : solid 1px transparent;
  border-bottom-color  : #8C8C8C;
  padding              : 0;
  width                : 100%;
  background           : transparent !important;
  color                : #999;
  border-radius        : 0 !important;
  -webkit-border-radius: 0 !important;
  -moz-border-radius   : 0 !important;
  -o-border-radius     : 0 !important;
  -ms-border-radius    : 0 !important
}

.formBox input[type="text"]:focus,
.formBox input[type="email"]:focus,
.formBox textarea:focus {
  color       : #666;
  padding     : 0 15px;
  border-color: #DCB46E !important
}

.formBox textarea {
  height : 190px;
  padding: 13px 0
}

.formBox textarea:focus {
  padding: 13px 15px
}

.formBox .form-group {
  margin-bottom: 20px;
  position     : relative;
  display      : block;
  width        : 100%
}

.formBox .form-group label {
  font-size    : 15px;
  line-height  : 1.4;
  color        : #646464;
  display      : block;
  margin-bottom: 5px
}

.formBox .listBtn {
  text-align: right
}

capcha {
  position      : absolute;
  right         : 25px;
  bottom        : 0;
  line-height   : 45px;
  z-index       : 3;
  letter-spacing: 1px;
  color         : #DCB46E;
  pointer-events: none;
  font-size     : 13px;
  font-weight   : bold
}

.rightNav {
  position    : fixed;
  right       : 0;
  top         : 50%;
  z-index     : 100;
  padding     : 0;
  margin-top  : -80px;
  box-shadow  : 0 0 20px 0 rgba(0, 0, 0, 0.2);
  padding-left: 0
}

.rightNav>.button {
  position       : relative;
  display        : block;
  text-decoration: none !important;
  line-height    : 50px
}

.rightNav>.button:hover>i,
.rightNav>.button:hover .share-button>i {
  background: #DCB46E;
  color     : #000
}

.rightNav>.button>i,
.rightNav>.button .share-button>i {
  display    : block;
  width      : 50px;
  height     : 50px;
  line-height: inherit;
  text-align : center;
  color      : #DCB46E;
  background : #000000;
  font-size  : 20px;
  z-index    : 2;
  position   : relative
}

.rightNav>.button+>.button {
  margin-top: 1px
}

.rightNav.active {
  z-index: 0
}

.rightNav .dropdown-share {
  top              : 100% !important;
  left             : auto !important;
  right            : 10px !important;
  margin           : 10px 0 0 0 !important;
  -webkit-transform: none !important;
  -ms-transform    : none !important;
  -o-transform     : none !important;
  transform        : none !important
}

.rightNav .dropdown-share:before {
  left             : auto;
  right            : 5px;
  -webkit-transform: none;
  -ms-transform    : none;
  -o-transform     : none;
  transform        : none
}

.dropdown-share>li>a {
  line-height    : 1;
  padding        : 13px 15px;
  display        : block;
  font-size      : 13px;
  color          : #555;
  text-decoration: none
}

.dropdown-share>li>a {
  border-top: 1px solid rgba(0, 0, 0, 0.1)
}

.dropdown-share>li:first-child>a {
  border: 0
}

.dropdown-share:before {
  content          : "";
  position         : absolute;
  top              : -16px;
  bottom           : auto;
  left             : 50%;
  right            : auto;
  -webkit-transform: translateX(-50%);
  -ms-transform    : translateX(-50%);
  transform        : translateX(-50%);
  border-top       : 8px solid transparent;
  border-left      : 8px solid transparent;
  border-right     : 8px solid transparent;
  border-bottom    : 8px solid #FFF
}

.dropdown-share[x-placement="top-start"] {
  margin-top   : 0;
  margin-bottom: 20px
}

.dropdown-share[x-placement="top-start"]:before {
  top          : auto;
  bottom       : -20px;
  border-bottom: 10px solid transparent;
  border-top   : 10px solid #FFF
}

.dropdown-share {
  position          : absolute !important;
  top               : 0% !important;
  left              : 50% !important;
  padding           : 0;
  min-width         : unset;
  width             : 128px;
  margin            : 10px 0px 0px -64px;
  list-style        : none;
  border            : 0;
  border-radius     : 4px;
  background        : #FFF;
  -webkit-box-shadow: none;
  box-shadow        : none;
  -webkit-filter    : drop-shadow(0px 1px 8px rgba(0, 0, 0, 0.1));
  filter            : drop-shadow(0px 1px 8px rgba(0, 0, 0, 0.1))
}

.dropdown-share>li>a i {
  padding-right : 10px;
  width         : 25px;
  display       : inline-block;
  vertical-align: middle;
  text-align    : center;
  vertical-align: -1px;
  color         : inherit;
  font-size     : 16px
}

.dropdown-share>li>a:hover,
.dropdown-share>li>a:focus {
  color     : #DCB46E;
  background: none
}

.noafter:after {
  display: none !important
}

.timepicker-picker span[class*="ion-chevron-"] {
  background-color: transparent !important
}

.navVert .owl-prev,
.navVert .owl-next {
  position   : absolute;
  top        : 0;
  bottom     : 0;
  width      : 35px;
  height     : 30px;
  line-height: 32px;
  margin     : auto;
  font-size  : 22px;
  background : #DCB46E;
  text-align : center;
  color      : #fff
}

.navVert .owl-prev *,
.navVert .owl-next * {
  color    : inherit !important;
  font-size: inherit !important
}

.navVert .owl-prev:hover,
.navVert .owl-next:hover {
  background: #555
}

.navVert .owl-prev {
  left: 0
}

.navVert .owl-next {
  right: 0
}

.navVert.rightTop .owl-nav {
  position: absolute;
  right   : 0;
  top     : -55px
}

@media screen and (min-width: 600px) {
  .navVert.rightTop .owl-nav {
    top: calc(-55px + -5 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .navVert.rightTop .owl-nav {
    top: -60px
  }
}

.navVert.rightTop .owl-prev,
.navVert.rightTop .owl-next {
  position   : relative;
  left       : auto;
  right      : auto;
  float      : left;
  margin-left: 5px;
  width      : 35px;
  height     : 30px
}

.navVert.rightBottom .owl-nav {
  position   : relative;
  top        : auto;
  display    : table;
  margin-left: auto;
  margin-top : 25px
}

#formPhone.fancybox-content {
  background: #DCB46E;
  padding   : 5px
}

.formPhone {
  width     : 500px;
  max-width : 100%;
  background: #fff;
  padding   : 60px 30px 15px 30px;
  text-align: center;
  position  : relative
}

.formPhone h3 {
  font-size  : 20px;
  display    : block;
  color      : #333;
  font-weight: 400;
  position   : absolute;
  top        : 25px;
  left       : 0;
  right      : 0;
  padding    : 0 20px;
  line-height: 22px;
  margin     : 0
}

.formPhone .formBox {
  width     : auto;
  float     : none;
  display   : block;
  background: none;
  margin    : 0
}

.formPhone .formBox>li {
  list-style: none;
  width     : auto;
  display   : table;
  margin    : 0 auto 20px auto;
  float     : none
}

.formPhone .formBox .btn {
  margin-top    : 10px;
  height        : 50px;
  line-height   : 50px;
  padding       : 0 50px;
  width         : auto;
  min-width     : unset;
  letter-spacing: 2px;
  margin        : 0
}

.formPhone .formBox .btn:after {
  position: absolute;
  left    : 50px;
  right   : 50px;
  bottom  : 15px;
  width   : auto
}

.formPhone .formBox>li input {
  width                : 205px;
  float                : none;
  display              : block;
  text-align           : center;
  background           : none;
  border               : none;
  border-bottom        : solid 1px #DCB46E;
  font-size            : 20px;
  letter-spacing       : 1px;
  padding              : 0;
  border-radius        : 0 !important;
  -webkit-border-radius: 0 !important;
  -moz-border-radius   : 0 !important;
  -o-border-radius     : 0 !important;
  -ms-border-radius    : 0 !important
}

.social {
  display: table;
  margin : 0 auto
}

.social>a {
  width       : 30px;
  height      : 30px;
  line-height : 30px;
  text-align  : center;
  color       : #fff;
  background  : #999;
  font-size   : 18px;
  margin-right: 5px
}

.social>a.fa-facebook {
  background: #3b5998
}

.social>a.fa-skype {
  background: #11B7F0
}

.social>a,
.social>span {
  float: left
}

.social>span a {
  display    : block;
  line-height: 30px;
  background : #999;
  color      : #fff;
  padding    : 0 20px
}

.formPhone p {
  line-height: 1.6;
  font-size  : 13px
}

.formPhone p * {
  font-size: inherit
}

.formPhone p a {
  color: #111
}

.formPhone p a:hover {
  color          : #333;
  text-decoration: underline
}

.loadMore {
  display       : table;
  margin        : 30px auto 0 auto;
  height        : 50px;
  line-height   : 50px;
  text-transform: uppercase;
  font-size     : 17px;
  padding       : 0 80px 0 35px;
  padding-right : 60px;
  padding-left  : 15px;
  cursor        : pointer;
  color         : #05050A;
  background    : #fff;
  letter-spacing: 0.01em;
  position      : relative;
  z-index       : 1;
  letter-spacing: 1px
}

@media screen and (min-width: 600px) {
  .loadMore {
    padding-right: calc(60px + 20 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .loadMore {
    padding-right: 80px
  }
}

@media screen and (min-width: 600px) {
  .loadMore {
    padding-left: calc(15px + 20 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .loadMore {
    padding-left: 35px
  }
}

.loadMore.left {
  float: left
}

.loadMore.small {
  height     : 45px;
  line-height: 45px;
  font-size  : 14px;
  padding    : 0 25px
}

.loadMore .icon {
  position   : absolute;
  top        : 0;
  right      : 0;
  bottom     : 0;
  width      : 50px;
  text-align : center;
  line-height: 50px;
  background : #232328
}

.loadMore .plus:before,
.loadMore .plus:after {
  content   : "";
  position  : absolute;
  top       : 0;
  right     : 0;
  bottom    : 0;
  left      : 0;
  margin    : auto;
  width     : 2px;
  height    : 15px;
  background: #fff
}

.loadMore .plus:after {
  width : 15px;
  height: 2px
}

.loadMore:hover {
  background: rgba(255, 255, 255, 0.8)
}

.loadMore:hover .icon {
  background: #DCB46E
}

.loadMore:hover .plus:before,
.loadMore:hover .plus:after {
  -webkit-transform: rotate(360deg);
  -ms-transform    : rotate(360deg);
  -o-transform     : rotate(360deg);
  transform        : rotate(360deg)
}

#infscr-loading {
  text-align           : center;
  z-index              : 100;
  position             : fixed;
  left                 : 0 !important;
  right                : 0 !important;
  bottom               : 15px;
  margin               : 0 auto !important;
  white-space          : nowrap;
  padding              : 10px 20px;
  background           : #000;
  opacity              : 0.8;
  color                : #FFF !important;
  width                : 200px;
  border-radius        : 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius   : 5px;
  -o-border-radius     : 5px;
  -ms-border-radius    : 5px
}

#infscr-loading * {
  color    : inherit !important;
  font-size: 13px !important
}

body .vcx-gallery {
  background: #000
}

body .vcx-gallery>.close {
  color          : #ddd;
  font-weight    : 300;
  text-shadow    : none;
  font-size      : 40px;
  right          : 20px;
  text-decoration: none !important
}

body .vcx-gallery>.close:hover {
  color: #000
}

body .vcx-gallery>.title {
  text-shadow: none;
  color      : #ddd;
  font-weight: 500;
  top        : auto !important;
  bottom     : 15px !important;
  right      : 15px !important;
  margin     : 0 !important;
  text-align : center
}

body .vcx-gallery-controls>.prev,
body .vcx-gallery-controls>.next {
  font-family    : "Ionicons";
  background     : none !important;
  text-indent    : 0;
  font-size      : 0;
  text-align     : center;
  width          : 50px;
  height         : 50px;
  line-height    : 50px;
  text-align     : center;
  text-decoration: none !important
}

body .vcx-gallery-controls>.prev:hover,
body .vcx-gallery-controls>.next:hover {
  opacity: 1
}

body .vcx-gallery-controls>.prev:before,
body .vcx-gallery-controls>.next:before {
  font-family: inherit;
  font-size  : inherit;
  color      : #ddd;
  font-size  : 45px;
  font-weight: 500
}

body .vcx-gallery-controls>.prev.prev,
body .vcx-gallery-controls>.next.prev {
  left: 10px
}

body .vcx-gallery-controls>.prev.next,
body .vcx-gallery-controls>.next.next {
  right: 10px
}

body .vcx-gallery-controls>.prev:before {
  content: "\f3d2"
}

body .vcx-gallery-controls>.next:before {
  content: "\f3d3"
}

body .lg-outer.lg-visible {
  background: #000 !important
}

body .lg-toolbar,
body .lg-prev,
body .lg-next,
body .lg-sub-html {
  background: transparent !important;
  color     : #ddd !important
}

body .lg-toolbar .lg-icon,
body .lg-toolbar #lg-counter,
body .lg-prev .lg-icon,
body .lg-prev #lg-counter,
body .lg-next .lg-icon,
body .lg-next #lg-counter,
body .lg-sub-html .lg-icon,
body .lg-sub-html #lg-counter {
  color: inherit !important
}

body .lg-prev:hover,
body .lg-next:hover {
  color: #ddd !important
}

.share {
  display: block
}

.share>span {
  color       : #999;
  float       : left;
  font-size   : 15px;
  margin-right: 5px;
  line-height : 30px
}

.share>a {
  float           : left;
  color           : #999;
  font-size       : 19px;
  text-decoration : none;
  text-align      : center;
  margin-left     : 5px;
  width           : 30px;
  height          : 30px;
  line-height     : 28px;
  background-color: #282828
}

.share>a:hover {
  color: #fff !important
}

.share>a i {
  color: inherit
}

.share a.btn_facebook:hover,
.share a.ion-social-facebook:hover {
  background  : #3b5998;
  border-color: #3b5998
}

.share a.btn_twitter:hover,
.share a.ion-social-twitter:hover {
  background  : #00aced;
  border-color: #00aced
}

.share a.btn_google:hover,
.share a.ion-social-google:hover {
  background  : #dd4b39;
  border-color: #dd4b39
}

.share a.pin-it-button:hover,
.share a.ion-social-pinterest:hover {
  background  : #C92228;
  border-color: #C92228
}

.share a.ion-social-youtube:hover {
  background  : #bb0000;
  border-color: #bb0000
}

.contact .custom-iw * {
  color: #fff !important
}

.contact .custom-iw {
  width        : 300px !important;
  margin-left  : 19px !important;
  padding-right: 15px;
  background   : #DCB46E
}

.contact .custom-iw:after {
  content         : "";
  position        : absolute;
  top             : 100%;
  left            : 50%;
  border          : solid 15px transparent;
  border-top-color: #DCB46E;
  margin-left     : -15px;
  margin-top      : -5px
}

.contact .custom-iw .gm-style-iw {
  top          : 15px !important;
  left         : 0 !important;
  border-radius: 2px
}

.contact .custom-iw>div:first-child>div:nth-child(2) {
  display: none
}

.contact .custom-iw>div:first-child>div:last-child {
  left      : 0 !important;
  top       : 0px;
  box-shadow: rgba(0, 0, 0, 0.6) 0px 1px 6px;
  z-index   : -1 !important
}

.contact .custom-iw .gm-style-iw,
.contact .custom-iw .gm-style-iw>div,
.contact .custom-iw .gm-style-iw>div>div {
  width    : 300px !important;
  max-width: 100% !important
}

.contact .custom-iw>div:first-child>div:nth-child(n-1)>div>div,
.contact .custom-iw>div>div:last-child,
.contact .custom-iw .gm-style-iw,
.contact .custom-iw .gm-style-iw>div,
.contact .custom-iw .gm-style-iw>div>div {
  background-color: transparent !important
}

.contact .custom-iw .gm-style-iw>div>div {
  padding    : 0 15px 10px 15px;
  font-weight: bold !important;
  font-size  : 15px
}

.contact .custom-iw .gm-style-iw>div>div p {
  font-weight: 400 !important
}

.contact .gm-style .gm-style-iw {
  overflow: visible !important
}

.contact .custom-iw>div:last-child {
  top       : 8px !important;
  right     : 9px !important;
  height    : 13px !important;
  width     : 13px !important;
  background: url("../images/close-pop.png") no-repeat center center !important;
  opacity   : 1 !important
}

.contact .custom-iw>div:last-child img {
  display: none
}

.contact .localInfo {
  background  : #DCB46E !important;
  padding     : 15px;
  color       : #fff;
  line-height : 1.4;
  overflow    : auto !important;
  font-size   : 14px;
  width       : 300px;
  margin-left : auto;
  margin-right: auto;
  display     : block
}

.contact .localInfo * {
  color      : #fff;
  font-size  : inherit;
  line-height: 1.2;
  font-size  : 13px
}

.contact .localInfo:after {
  content         : "";
  position        : absolute;
  top             : 100%;
  left            : 50%;
  border          : solid 15px transparent;
  border-top-color: #DCB46E;
  margin-left     : -15px;
  margin-top      : -5px
}

.contact .localInfo a {
  border-bottom  : solid 1px transparent;
  text-decoration: none !important
}

.contact .localInfo a:hover {
  color              : #fff;
  text-decoration    : none !important;
  border-bottom-color: #fff
}

.contact .localInfo h1,
.contact .localInfo h2,
.contact .localInfo h3 {
  text-transform: uppercase;
  font-size     : 15px;
  margin        : 0 0 10px 0
}

.contact .localInfo p {
  line-height: 1.4;
  margin     : 0
}

.contact .localInfo p+p {
  margin-top: 12px
}

.contact .localInfo .bt {
  border-top : solid 1px #fff;
  margin     : 20px 0 0 0;
  padding-top: 15px;
  text-align : center
}

.contact .gm-style-iw {
  font-size  : 15px;
  color      : #fff;
  font-weight: 600 !important
}

.contact .gm-style-iw * {
  font-size  : inherit;
  font-weight: inherit
}

.contact .gm-style-iw p {
  font-size  : 13px;
  display    : block;
  margin     : 10px 0 0 0;
  font-weight: 400 !important
}

.contact .custom-iw .gm-style-iw>div {
  overflow     : hidden !important;
  padding-right: 20px
}

body .fancybox-is-open .fancybox-bg {
  opacity   : 1;
  background: rgba(0, 0, 0, 0.8)
}

body .addthis_inline_share_toolbox_uc75 {
  display       : inline-block;
  vertical-align: top
}

body .at-share-tbx-element .at-share-btn {
  margin     : 0 0 0 5px;
  width      : 30px;
  height     : 30px;
  line-height: 30px;
  text-align : center;
  background : #282828 !important
}

body .at-share-tbx-element .at-share-btn:hover {
  background: #999 !important
}

body .at-share-tbx-element .at-share-btn:hover svg {
  fill: #fff !important
}

body .at-share-tbx-element .at-share-btn svg {
  fill: #999 !important
}

.slickNav {
  position: relative
}

.slickNav:hover .slick-arrow {
  opacity: 1
}

.slickNav .slick-arrow {
  position   : absolute;
  top        : 0;
  bottom     : 0;
  width      : 45px;
  height     : 50px;
  line-height: 50px;
  margin     : auto;
  z-index    : 10;
  font-size  : 30px;
  background : #fff;
  color      : #333;
  text-align : center;
  cursor     : pointer;
  opacity    : 0
}

.slickNav .slick-arrow:hover {
  background: #DCB46E;
  color     : #fff
}

.slickNav .slick-arrow * {
  color    : inherit;
  font-size: inherit
}

.slickNav .slick-prev {
  left: 0
}

.slickNav .slick-next {
  right: 0
}

.titBox {
  margin-bottom: 25px
}

@media screen and (min-width: 600px) {
  .titBox {
    margin-bottom: calc(25px + 25 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titBox {
    margin-bottom: 50px
  }
}

.titBox .tit {
  display        : block;
  margin         : 0;
  line-height    : 1.2;
  text-transform : uppercase;
  text-decoration: none;
  font-weight    : 800;
  color          : #333;
  font-size      : 20px
}

@media screen and (min-width: 600px) {
  .titBox .tit {
    font-size: calc(20px + 6 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titBox .tit {
    font-size: 26px
  }
}

.titBox a.tit:hover {
  color: #333
}

.titBox.white .tit {
  color: #fff
}

.titBox.line:before {
  content              : "";
  display              : block;
  margin               : 0 auto;
  background           : #E6E6E6;
  border-radius        : 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius   : 10px;
  -o-border-radius     : 10px;
  -ms-border-radius    : 10px;
  margin-bottom        : 15px;
  width                : 90px;
  height               : 7px
}

@media screen and (min-width: 600px) {
  .titBox.line:before {
    margin-bottom: calc(15px + 10 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titBox.line:before {
    margin-bottom: 25px
  }
}

@media screen and (min-width: 600px) {
  .titBox.line:before {
    width: calc(90px + 90 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titBox.line:before {
    width: 180px
  }
}

@media screen and (min-width: 600px) {
  .titBox.line:before {
    height: calc(7px + 3 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titBox.line:before {
    height: 10px
  }
}

.follow {
  display       : inline-block;
  vertical-align: middle;
  font-size     : 0;
  letter-spacing: 0;
  height        : 25px;
  margin-right  : 10px
}

.follow>span {
  display       : inline-block;
  vertical-align: top;
  font-size     : 15px;
  color         : #888;
  font-weight   : 600;
  line-height   : 25px;
  margin-right  : 5px
}

.follow>a {
  font-size      : 15px;
  width          : 25px;
  height         : 25px;
  line-height    : 25px;
  text-align     : center;
  position       : relative;
  display        : inline-block;
  vertical-align : top;
  text-align     : center;
  text-decoration: none !important;
  color          : #fff;
  background     : #bbb;
  border         : none !important
}

.follow>a:hover {
  color     : #fff;
  background: #DCB46E
}

.follow a+a {
  margin-left: 7px
}

.follow a.ion-social-facebook {
  font-size: 18px
}

.follow a.ion-social-facebook:hover {
  background-color: #3b5998
}

.follow a.ion-social-pinterest:hover {
  background-color: #cb2027
}

.follow a.ion-social-twitter:hover {
  background-color: #00aced
}

.follow a.ion-social-google-plus:hover {
  background-color: #dd4b39
}

.follow a.ion-social-flickr:hover,
.follow a.fab-flickr:hover,
.follow a.fab-flickr-alt:hover {
  background-color: #ff0084
}

.follow a.ion-social-instagram:hover {
  background-color: #517fa4
}

.follow a.ion-social-youtube:hover {
  background-color: #bb0000
}

.follow a.ion-social-yahoo:hover {
  background-color: #7B0099
}

.follow a.ion-social-tumblr:hover {
  background-color: #32506d
}

.follow a.ion-social-skype:hover {
  background-color: #00AFF0
}

.follow a.ion-social-foody:hover {
  background-color: #ff0000
}

.follow a.ion-social-linkedin:hover {
  background-color: #009CD3
}

.follow a.fab {
  font-size    : 0.97rem;
  margin-bottom: -0.04em
}

.follow .fb-like {
  display       : inline-block;
  vertical-align: top;
  margin-left   : 20px
}

.follow a.ion-social-zalo {
  max-width : 15px;
  fill      : #888 !important;
  max-height: 15px;
  margin-top: 5px
}

.follow a.ion-social-zalo svg {
  display   : block;
  max-height: 100%;
  width     : 100%;
  fill      : inherit !important
}

.follow a.ion-social-zalo:hover {
  fill: #0F88CB !important
}

.openChat {
  position: fixed;
  right   : 10px;
  bottom  : 100px;
  z-index : 110;
  width   : 60px;
  cursor  : pointer
}

@media screen and (max-width: 767px) {
  .openChat {
    width: 35px
  }
}

@media screen and (max-width: 767px) {
  .openChat {
    right: 1px
  }
}

.openChat img {
  display                : block;
  width                  : 100%;
  height                 : auto;
  -webkit-animation      : fadeInRight 1s ease backwards;
  -moz-animation         : fadeInRight 1s ease backwards;
  -o-animation           : fadeInRight 1s ease backwards;
  -ms-animation          : fadeInRight 1s ease backwards;
  -webkit-animation-delay: 1s;
  -o-animation-delay     : 1s;
  animation-delay        : 1s
}

@-webkit-keyframes RingRing {
  0% {
    -webkit-transform: rotate(25deg)
  }

  4% {
    -webkit-transform: rotate(-25deg)
  }

  8% {
    -webkit-transform: rotate(25deg)
  }

  12% {
    -webkit-transform: rotate(-25deg)
  }

  16% {
    -webkit-transform: rotate(25deg)
  }

  20% {
    -webkit-transform: rotate(-25deg)
  }

  24% {
    -webkit-transform: rotate(0deg)
  }

  100% {
    -webkit-transform: rotate(0deg)
  }
}

@-moz-keyframes RingRing {
  0% {
    -moz-transform: rotate(25deg)
  }

  4% {
    -moz-transform: rotate(-25deg)
  }

  8% {
    -moz-transform: rotate(25deg)
  }

  12% {
    -moz-transform: rotate(-25deg)
  }

  16% {
    -moz-transform: rotate(25deg)
  }

  20% {
    -moz-transform: rotate(-25deg)
  }

  24% {
    -moz-transform: rotate(0deg)
  }

  100% {
    -moz-transform: rotate(0deg)
  }
}

@-ms-keyframes RingRing {
  0% {
    -ms-transform: rotate(25deg)
  }

  4% {
    -ms-transform: rotate(-25deg)
  }

  8% {
    -ms-transform: rotate(25deg)
  }

  12% {
    -ms-transform: rotate(-25deg)
  }

  16% {
    -ms-transform: rotate(25deg)
  }

  20% {
    -ms-transform: rotate(-25deg)
  }

  24% {
    -ms-transform: rotate(0deg)
  }

  100% {
    -ms-transform: rotate(0deg)
  }
}

@-o-keyframes RingRing {
  0% {
    -o-transform: rotate(25deg)
  }

  4% {
    -o-transform: rotate(-25deg)
  }

  8% {
    -o-transform: rotate(25deg)
  }

  12% {
    -o-transform: rotate(-25deg)
  }

  16% {
    -o-transform: rotate(25deg)
  }

  20% {
    -o-transform: rotate(-25deg)
  }

  24% {
    -o-transform: rotate(0deg)
  }

  100% {
    -o-transform: rotate(0deg)
  }
}

@keyframes RingRing {
  0% {
    transform: rotate(25deg)
  }

  4% {
    transform: rotate(-25deg)
  }

  8% {
    transform: rotate(25deg)
  }

  12% {
    transform: rotate(-25deg)
  }

  16% {
    transform: rotate(25deg)
  }

  20% {
    transform: rotate(-25deg)
  }

  24% {
    transform: rotate(0deg)
  }

  100% {
    transform: rotate(0deg)
  }
}

.fbMess {
  position          : fixed;
  right             : 0px;
  bottom            : 0;
  z-index           : 200;
  background        : #fff;
  border            : solid 1px #3b5998;
  border-bottom     : none;
  opacity           : 0;
  visibility        : hidden;
  -webkit-transform : translateY(100%);
  -moz-transform    : translateY(100%);
  -ms-transform     : translateY(100%);
  -o-transform      : translateY(100%);
  transform         : translateY(100%);
  transition        : all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition   : all 0.3s;
  -o-transition     : all 0.3s;
  -ms-transition    : all 0.3s
}

.fbMess .btnChat {
  position     : absolute;
  right        : -1px;
  bottom       : 100%;
  white-space  : nowrap;
  color        : #fff;
  background   : #3b5998;
  font-weight  : 400;
  padding      : 0 10px;
  font-size    : 13px;
  margin-bottom: -30px;
  line-height  : 30px;
  cursor       : pointer
}

.fbMess .btnChat * {
  color: inherit
}

.fbMess.loaded {
  opacity   : 1;
  visibility: visible
}

.fbMess.show {
  -webkit-transform: translateY(0);
  -moz-transform   : translateY(0);
  -ms-transform    : translateY(0);
  -o-transform     : translateY(0);
  transform        : translateY(0)
}

.fbMess.show .btnChat {
  margin-bottom: 0
}

.numsList {
  display              : table;
  margin-left          : auto;
  margin-top           : 10px;
  margin-bottom        : 30px;
  padding              : 12px 15px 5px 15px;
  background           : #E6E6E6;
  border-radius        : 30px;
  -webkit-border-radius: 30px;
  -moz-border-radius   : 30px;
  -o-border-radius     : 30px;
  -ms-border-radius    : 30px
}

.numsList a {
  display       : inline-block;
  vertical-align: top;
  line-height   : 20px;
  text-align    : center;
  font-weight   : 600;
  color         : #333;
  padding       : 0 5px;
  margin        : 0 5px;
  font-size     : 12px
}

@media screen and (min-width: 600px) {
  .numsList a {
    font-size: calc(12px + 4 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .numsList a {
    font-size: 16px
  }
}

.numsList a:after {
  content   : "";
  display   : block;
  height    : 2px;
  background: transparent
}

.numsList a.current {
  color: #DCB46E
}

.numsList a.current:after {
  background: #DCB46E
}

.numsList a:hover {
  color: #FEDB54
}

.numsList a i {
  color      : inherit;
  font-weight: inherit;
  font-size  : 13px
}

.numsList a span {
  font-size: 0
}

.numsMain {
  display: block
}

.numsMain.leftSMall {
  float: left
}

.numsMain.leftSMall .nums {
  margin: 0
}

.numsMain.leftSMall .nums>a {
  width      : 35px;
  height     : 35px;
  line-height: 35px;
  margin     : 5px 5px 0 0 !important
}

.nums {
  display: table;
  margin : 0 auto
}

.nums a,
.nums span {
  text-decoration: none !important
}

.nums>a {
  float      : left;
  width      : 38px;
  height     : 38px;
  line-height: 38px;
  text-align : center;
  color      : #222227;
  font-size  : 14px;
  background : #ddd
}

.nums>a+a {
  margin-left: 2px
}

.nums>a * {
  color: inherit
}

.nums>a.current {
  background  : #DCB46E;
  color       : #fff;
  border-color: #DCB46E
}

.nums>a:not(.current):hover {
  background: #ccc;
  color     : #000
}

.selectBox {
  position             : relative;
  width                : 50px;
  height               : 38px;
  background           : url("../images/select-2.png") no-repeat 33px center #ddd;
  float                : left;
  margin-left          : 2px;
  z-index              : 20;
  border-radius        : 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius   : 20px;
  -o-border-radius     : 20px;
  -ms-border-radius    : 20px
}

.selectBox>ul {
  position     : absolute;
  right        : 0;
  bottom       : 100%;
  left         : 0;
  max-height   : 300px;
  overflow     : auto;
  border-bottom: solid 10px transparent;
  display      : none;
  padding      : 0;
  margin       : 0
}

.selectBox:after {
  content         : "";
  position        : absolute;
  left            : 50%;
  top             : -10px;
  border          : solid 10px transparent;
  margin-left     : -10px;
  border-top-color: #666;
  z-index         : 10;
  display         : none
}

.selectBox:hover>ul,
.selectBox:hover:after,
.selectBox.click>ul,
.selectBox.click:after {
  display: block
}

.selectBox>ul a,
.selectBox>ul span {
  display    : block;
  line-height: 30px;
  padding    : 0 5px;
  color      : #fff;
  text-align : center;
  background : #666;
  font-size  : 14px
}

.selectBox>ul a:hover,
.selectBox>ul a.current {
  background: #DCB46E;
  color     : #fff
}

.selectBox>ul span.active {
  color: #fff !important
}

.selectBox>span {
  display    : block;
  width      : 40px;
  line-height: 38px;
  font-style : normal;
  text-align : center;
  cursor     : default;
  font-size  : 14px;
  color      : #222227
}

.otherBox {
  margin-top: 30px
}

@media screen and (min-width: 600px) {
  .otherBox {
    margin-top: calc(30px + 20 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .otherBox {
    margin-top: 50px
  }
}

.otherBox>.tit {
  position      : relative;
  color         : #DCB46E;
  text-transform: uppercase;
  font-weight   : 900;
  margin        : 0;
  margin-bottom : 20px;
  font-size     : 20px
}

@media screen and (min-width: 600px) {
  .otherBox>.tit {
    margin-bottom: calc(20px + 10 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .otherBox>.tit {
    margin-bottom: 30px
  }
}

@media screen and (min-width: 600px) {
  .otherBox>.tit {
    font-size: calc(20px + 10 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .otherBox>.tit {
    font-size: 30px
  }
}

.otherTit {
  position      : relative;
  color         : #DCB46E;
  text-transform: uppercase;
  font-weight   : 500;
  margin        : 0;
  font-family   : "Tinos", sans-serif;
  margin-bottom : 15px;
  font-size     : 30px
}

@media screen and (min-width: 600px) {
  .otherTit {
    margin-bottom: calc(15px + 5 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .otherTit {
    margin-bottom: 20px
  }
}

@media screen and (min-width: 768px) {
  .otherTit {
    font-size: calc(30px + 10 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .otherTit {
    font-size: 40px
  }
}

.otherTit.line:after {
  content   : "";
  display   : block;
  width     : 50px;
  height    : 3px;
  background: #DCB46E;
  margin-top: 10px
}

@media screen and (min-width: 600px) {
  .otherTit.line:after {
    width: calc(50px + 50 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .otherTit.line:after {
    width: 100px
  }
}

.page-products .otherTit {
  font-size: 20px
}

@media screen and (min-width: 600px) {
  .page-products .otherTit {
    font-size: calc(20px + 5 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .page-products .otherTit {
    font-size: 25px
  }
}

.titMain {
  margin-bottom: 30px
}

.titMain .tit {
  margin-top    : 0;
  color         : #000;
  line-height   : 1.2;
  text-transform: uppercase;
  font-family   : "Tinos", sans-serif;
  font-size     : 20px
}

@media screen and (min-width: 600px) {
  .titMain .tit {
    font-size: calc(20px + 15 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .titMain .tit {
    font-size: 35px
  }
}

.titMain:after {
  content   : "";
  display   : block;
  width     : 50px;
  height    : 3px;
  background: #DCB46E;
  margin-top: 15px
}

@media screen and (min-width: 600px) {
  .titMain:after {
    width: calc(50px + 50 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200) {
  .titMain:after {
    width: 100px
  }
}

.titMain .date {
  font-size     : 12px;
  font-weight   : bold;
  color         : #818181;
  margin        : 15px 0 20px 0;
  line-height   : 1.2;
  text-transform: uppercase
}

.titMain .date span {
  display       : inline-block;
  vertical-align: middle;
  width         : 2px;
  height        : 11px;
  background    : #818181;
  margin        : -3px 5px 0 7px
}

.titMain p {
  font-style: italic;
  color     : #333
}

.titMain.center {
  text-align: center
}

.titMain.center:after {
  margin-left : auto;
  margin-right: auto
}

.titMain.main-color .tit {
  color: #DCB46E
}

.titMain.main-color:after {
  background: #ccc
}

.blog-share {
  position     : relative;
  display      : block;
  margin-top   : 35px;
  margin-bottom: 30px
}

@media screen and (min-width: 600px) {
  .blog-share {
    margin-bottom: calc(30px + 15 * (100vw - 600px) / 600)
  }
}

@media screen and (min-width: 1200px) {
  .blog-share {
    margin-bottom: 45px
  }
}

.blog-share:before {
  content   : "";
  position  : absolute;
  top       : 3px;
  left      : 0;
  right     : 0;
  bottom    : 0;
  height    : 1px;
  background: #ccc;
  margin    : auto
}

.blog-share>li {
  list-style : none;
  display    : table;
  margin     : 0 auto;
  background : #F5F5F5;
  position   : relative;
  line-height: 30px;
  padding    : 0 30px;
  z-index    : 2
}

.blog-share span {
  display       : inline-block;
  vertical-align: top;
  color         : #888;
  font-size     : 14px;
  text-transform: uppercase;
  font-weight   : 600
}

.blog-share a {
  display       : inline-block;
  vertical-align: top;
  color         : #888;
  margin-left   : 5px;
  width         : 30px;
  height        : 30px;
  line-height   : 30px;
  text-align    : center;
  font-size     : 18px
}

.blog-share a i {
  color: inherit
}

.blog-share a.btn_facebook:hover {
  color: #3b5998
}

.blog-share a.btn_twitter:hover {
  color: #00aced
}

.blog-share a.btn_google:hover {
  color: #dd4b39
}

.share-title {
  display       : block;
  color         : #999;
  text-transform: uppercase;
  font-size     : 13px;
  font-weight   : bold;
  margin-bottom : 20px
}

.share-button {
  position: relative;
  display : table;
  margin  : 0 auto
}

.share-button .btn {
  margin    : 0;
  background: #DCB46E !important;
  box-shadow: none !important
}

.share-button.open .dropdown-toggle {
  -webkit-box-shadow: none;
  box-shadow        : none
}

.share-button .dropdown-menu>li>a {
  line-height    : 1;
  padding        : 13px 15px;
  display        : block;
  font-size      : 13px;
  color          : #555;
  text-decoration: none
}

.share-button .dropdown-menu>li>a {
  border-top: 1px solid rgba(0, 0, 0, 0.1)
}

.share-button .dropdown-menu>li:first-child>a {
  border: 0
}

.share-button .dropdown-menu:before {
  content          : "";
  position         : absolute;
  top              : -20px;
  bottom           : auto;
  left             : 50%;
  right            : auto;
  -webkit-transform: translateX(-50%);
  -ms-transform    : translateX(-50%);
  transform        : translateX(-50%);
  border-top       : 10px solid transparent;
  border-left      : 10px solid transparent;
  border-right     : 10px solid transparent;
  border-bottom    : 10px solid #FFF
}

.share-button .dropdown-menu[x-placement="top-start"] {
  margin-top   : 0;
  margin-bottom: 20px
}

.share-button .dropdown-menu[x-placement="top-start"]:before {
  top          : auto;
  bottom       : -20px;
  border-bottom: 10px solid transparent;
  border-top   : 10px solid #FFF
}

.share-button .dropdown-menu {
  position          : absolute !important;
  top               : 0% !important;
  left              : 50% !important;
  padding           : 0;
  min-width         : unset;
  width             : 128px;
  margin            : 10px 0px 0px -64px;
  list-style        : none;
  border            : 0;
  border-radius     : 4px;
  background        : #FFF;
  -webkit-box-shadow: none;
  box-shadow        : none;
  -webkit-filter    : drop-shadow(0px 1px 8px rgba(0, 0, 0, 0.1));
  filter            : drop-shadow(0px 1px 8px rgba(0, 0, 0, 0.1))
}

.share-button .dropdown-menu>li>a i {
  padding-right : 10px;
  width         : 25px;
  display       : inline-block;
  vertical-align: middle;
  text-align    : center;
  vertical-align: -1px;
  color         : inherit
}

.share-button .dropdown-menu>li>a:hover,
.share-button .dropdown-menu>li>a:focus {
  color     : #4c98c9;
  background: none
}

.open>.dropdown-menu {
  display: block
}

hr.line {
  border       : 0;
  padding      : 0;
  margin       : 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-top  : 30px;
  margin-bottom: 30px
}

@media screen and (min-width: 767px) {
  hr.line {
    padding-top: calc(30px + 20 * (100vw - 767px) / 433)
  }
}

@media screen and (min-width: 1200px) {
  hr.line {
    padding-top: 50px
  }
}

@media screen and (min-width: 767px) {
  hr.line {
    margin-bottom: calc(30px + 20 * (100vw - 767px) / 433)
  }
}

@media screen and (min-width: 1200px) {
  hr.line {
    margin-bottom: 50px
  }
}

.no-after:after {
  display: none
}

.search-sub {
  display   : block;
  margin    : -20px 0 35px 0;
  font-size : 16px;
  color     : #999;
  font-style: italic
}

.list-search-result {
  margin-bottom: 50px
}

.list-search-result .item {
  display                : block;
  list-style             : none;
  padding                : 0 0 25px 0;
  margin                 : 0 0 25px 0;
  border-bottom          : solid 1px #ccc;
  display                : -webkit-box;
  display                : -webkit-flex;
  display                : -ms-flexbox;
  display                : flex;
  -webkit-justify-content: space-between;
  -ms-flex-pack          : space-between;
  justify-content        : space-between;
  -webkit-flex-wrap      : no-wrap;
  -ms-flex-wrap          : no-wrap;
  flex-wrap              : no-wrap
}

.list-search-result .item .img {
  display: block;
  width  : auto;
  height : auto
}

.list-search-result .item .img img {
  display  : block;
  width    : auto;
  height   : auto;
  max-width: 320px
}

.list-search-result .item .img:hover {
  opacity: .7
}

.list-search-result .item .img+ul {
  padding: 20px 0 0 9;
  width  : calc(100% - 370px)
}

.list-search-result .item ul {
  margin : 0;
  padding: 0
}

.list-search-result .item .tit {
  display        : block;
  font-size      : 18px;
  text-decoration: none !important;
  font-weight    : 600;
  color          : #DCB46E
}

.list-search-result .item a.tit:hover {
  color: #DCB46E
}

.list-search-result .item p {
  margin     : 15px 0 0 0;
  color      : #999;
  line-height: 1.5
}

.btn-main {
  background-color: transparent;
  border-top      : solid 2px #DCB46E !important;
  border-bottom   : solid 2px #DCB46E !important;
  height          : 37px;
  line-height     : 35px;
  padding         : 0 20px !important;
  font-weight     : bold;
  font-size       : 13px;
  color           : #000;
  text-transform  : uppercase;
  position        : relative
}

@media screen and (max-width: 767px) {
  .btn-main {
    padding: 0 15px !important
  }
}

.btn-main.btn-lg {
  height     : 42px;
  line-height: 38px
}

.btn-main.btn-lx {
  height     : 45px;
  line-height: 43px;
  padding    : 0 25px !important
}

.btn-main:hover,
.btn-main:focus {
  background-color: #DCB46E
}

.btn-main:hover:before,
.btn-main:hover:after,
.btn-main:focus:before,
.btn-main:focus:after {
  height: 100%
}

.btn-main:before,
.btn-main:after {
  border-left : solid 2px #DCB46E;
  border-right: solid 2px #DCB46E;
  height      : 25%
}

.btn-main:after {
  top: auto
}

.btn-main.white {
  border-top   : solid 2px #fff !important;
  border-bottom: solid 2px #fff !important;
  color        : #fff
}

.btn-main.white:before,
.btn-main.white:after {
  border-color: #fff
}

.btn-main.white:hover {
  border-color: #DCB46E !important
}

.btn-main.white:hover:before,
.btn-main.white:hover:after {
  border-color: #DCB46E
}

.banner {
  display      : block;
  position     : relative;
  width        : 100%;
  height       : 100vh;
  z-index      : 0;
  overflow     : hidden;
  margin-bottom: 100px
}

@media screen and (min-width: 768px) {
  .banner {
    margin-bottom: calc(100px + 70 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .banner {
    margin-bottom: 170px
  }
}

@media screen and (max-width: 1024px) {
  .banner {
    margin-bottom: 0
  }
}

.banner .pagewrap {
  position           : absolute;
  left               : 0;
  right              : 0;
  top                : 0;
  bottom             : 0;
  width              : 1600px;
  max-width          : calc(100% - 200px);
  z-index            : 2;
  -webkit-align-items: center;
  align-items        : center
}

@media screen and (max-width: 1366px) {
  .banner .pagewrap {
    max-width: calc(100% - 80px)
  }
}

@media screen and (max-width: 1200px) {
  .banner .pagewrap {
    max-width: calc(100% - 40px)
  }
}

.banner .item {
  display            : block;
  width              : 100%;
  height             : 100vh;
  float              : left;
  position           : relative;
  background-position: center center;
  z-index            : 1
}

.banner .item:after {
  background: rgba(0, 0, 0, 0.4);
  z-index   : -1
}

.banner .item .bg {
  position: absolute;
  top     : 0;
  left    : 0;
  width   : 100%;
  height  : 100%;
  z-index : -1
}

.bannerDesc {
  white-space: normal;
  width      : 700px;
  max-width  : 100%
}

.bannerDesc * {
  text-shadow: 1px 1px rgba(0, 0, 0, 0.3)
}

.bannerDesc .tit {
  font-size     : 55px;
  line-height   : 1.1;
  margin        : 0;
  font-family   : "Tinos", sans-serif;
  color         : #DCB46E;
  text-transform: uppercase;
  font-size     : 25px;
  margin-bottom : 15px;
  opacity       : 0
}

@media screen and (min-width: 479px) {
  .bannerDesc .tit {
    font-size: calc(25px + 30 * (100vw - 479px) / 921)
  }
}

@media screen and (min-width: 1400px) {
  .bannerDesc .tit {
    font-size: 55px
  }
}

@media screen and (min-width: 768px) {
  .bannerDesc .tit {
    margin-bottom: calc(15px + 10 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .bannerDesc .tit {
    margin-bottom: 25px
  }
}

@media screen and (max-width: 767px) {
  .bannerDesc .tit {
    margin-bottom: 10px
  }
}

.bannerDesc .desc {
  color       : #fff;
  padding-left: 40px;
  position    : relative
}

.bannerDesc .desc * {
  color: inherit
}

.bannerDesc .desc:before {
  content   : "";
  width     : 25px;
  height    : 3px;
  background: #fff;
  position  : absolute;
  top       : 12px;
  left      : 0;
  opacity   : 0
}

.bannerDesc p {
  display      : block;
  font-size    : 18px;
  font-family  : "Tinos", sans-serif;
  line-height  : 1.4;
  opacity      : 0;
  color        : #fff;
  margin-bottom: 15px
}

@media screen and (max-width: 1200px) {
  .bannerDesc p {
    font-size: 16px
  }
}

@media screen and (max-width: 1023px) {
  .bannerDesc p {
    font-size: 14px
  }
}

@media screen and (min-width: 768px) {
  .bannerDesc p {
    margin-bottom: calc(15px + 15 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .bannerDesc p {
    margin-bottom: 30px
  }
}

.bannerDesc .btn {
  opacity: 0
}

.bannerDesc.white .tit {
  color: #fff
}

.active .item .bg {
  -webkit-animation: banner_style 5s ease backwards;
  -moz-animation   : banner_style 5s ease backwards;
  -o-animation     : banner_style 5s ease backwards;
  -ms-animation    : banner_style 5s ease backwards
}

.active .bannerDesc .tit,
.active .bannerDesc .desc:before,
.active .bannerDesc p,
.active .bannerDesc .btn {
  -webkit-animation          : fadeInUp 1.5s ease backwards;
  -moz-animation             : fadeInUp 1.5s ease backwards;
  -o-animation               : fadeInUp 1.5s ease backwards;
  -ms-animation              : fadeInUp 1.5s ease backwards;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode     : both;
  animation-fill-mode        : both;
  -webkit-animation-delay    : 0.3s;
  -o-animation-delay         : 0.3s;
  animation-delay            : 0.3s
}

.active .bannerDesc .desc:before,
.active .bannerDesc p {
  -webkit-animation-delay: 0.5s;
  -o-animation-delay     : 0.5s;
  animation-delay        : 0.5s
}

.active .bannerDesc .btn {
  -webkit-animation-delay: 0.8s;
  -o-animation-delay     : 0.8s;
  animation-delay        : 0.8s
}

@-webkit-keyframes banner_style {
  from {
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform        : scale3d(1.5, 1.5, 1.5)
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform        : scale3d(1, 1, 1)
  }
}

@keyframes banner_style {
  from {
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform        : scale3d(1.5, 1.5, 1.5)
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform        : scale3d(1, 1, 1)
  }
}

.uMain {
  overflow: hidden;
  display : block;
  position: relative
}

.uSlide {
  overflow  : hidden;
  display   : block;
  position  : absolute;
  cursor    : pointer;
  float     : left;
  display   : inline-block;
  zoom      : 1;
  background: #000
}

.uCaption {
  position          : absolute;
  bottom            : 0;
  left              : 0;
  -moz-box-sizing   : border-box;
  -webkit-box-sizing: border-box;
  box-sizing        : border-box;
  display           : none
}

.uContent {
  position: absolute;
  top     : 0;
  left    : 0;
  display : none;
  width   : 100%;
  height  : 100%
}

.uDrag {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab
}

.uSlide_mouseDown {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing
}

.uSlide img,
.uSlide video {
  position          : relative;
  width             : 100%;
  opacity           : 0.7;
  -o-transition     : opacity 700ms;
  -ms-transition    : opacity 700ms;
  -moz-transition   : opacity 700ms;
  -webkit-transition: opacity 700ms;
  transition        : opacity 700ms
}

.uSlide img:hover,
.uSlide video:hover {
  opacity: 1
}

.uSlide.active img,
.uSlide.active video {
  opacity: 1
}

.breadcrumb {
  padding         : 0;
  background-color: transparent
}

.breadcrumb li {
  font-size: 14px;
  color    : #666
}

@media screen and (max-width: 767px) {
  .breadcrumb li {
    font-size: 12px
  }
}

.breadcrumb li a {
  color: inherit
}

.breadcrumb li a:hover {
  color: #DCB46E
}

.breadcrumb li.active {
  color: #DCB46E
}

.breadcrumb.hide,
.breadcrumb .hide {
  display: none !important
}

.wrapper {
  width             : 100%;
  padding           : 0;
  margin            : 0;
  overflow-x        : hidden;
  -webkit-transition: all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1)
}

.wrapper.open {
  -webkit-transform: translateX(100%) !important;
  -ms-transform    : translateX(100%) !important;
  -o-transform     : translateX(100%) !important;
  transform        : translateX(100%) !important
}

.open .btnBook {
  opacity           : 0;
  pointer-events    : none;
  -webkit-transition: all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1)
}

.open .openMenu i {
  border: none;
  width : 30px;
  height: 30px
}

.open .openMenu i:before,
.open .openMenu i:after {
  left              : 0;
  top               : 0;
  right             : 0;
  bottom            : 0;
  border            : none;
  margin            : auto;
  background        : #141414;
  -webkit-transition: all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1)
}

.open .openMenu i:before {
  width            : 100%;
  height           : 2px;
  -webkit-transform: rotate(45deg);
  -ms-transform    : rotate(45deg);
  -o-transform     : rotate(45deg);
  transform        : rotate(45deg)
}

.open .openMenu i:after {
  width            : 2px;
  height           : 100%;
  -webkit-transform: rotate(45deg);
  -ms-transform    : rotate(45deg);
  -o-transform     : rotate(45deg);
  transform        : rotate(45deg)
}

header {
  height  : 75px;
  position: absolute;
  top     : 0;
  left    : 0;
  right   : 0;
  z-index : 500
}

header.fixed {
  -webkit-animation: fadeIn 1s ease backwards;
  -moz-animation   : fadeIn 1s ease backwards;
  -o-animation     : fadeIn 1s ease backwards;
  -ms-animation    : fadeIn 1s ease backwards;
  position         : fixed;
  background       : #fff;
  border-bottom    : solid 1px #ccc
}

header.fixed .openMenu {
  height: 74px
}

header.fixed .topLink a {
  color: #000
}

header.fixed .logo {
  opacity       : 1;
  pointer-events: all
}

.topBtn {
  position   : absolute;
  left       : 0;
  top        : 0;
  font-size  : 0;
  line-height: 75px;
  z-index    : 2
}

.topBtn .bt {
  display        : inline-block;
  vertical-align : top;
  line-height    : 75px;
  font-size      : 14px;
  font-weight    : 900;
  text-transform : uppercase;
  padding        : 0 50px;
  letter-spacing : 1px;
  text-decoration: none;
  cursor         : pointer
}

.openMenu {
  background: #fff;
  color     : #141414
}

.openMenu i {
  display       : inline-block;
  vertical-align: middle;
  width         : 32px;
  height        : 21px;
  border-top    : solid 1px #141414;
  border-bottom : solid 1px #141414;
  position      : relative;
  margin-right  : 16px
}

.openMenu i:before {
  content      : "";
  position     : absolute;
  top          : 4px;
  left         : 0;
  right        : 0;
  bottom       : 4px;
  border-top   : solid 1px #141414;
  border-bottom: solid 1px #141414
}

.openMenu i:after {
  content   : "";
  position  : absolute;
  top       : 0;
  left      : 0;
  right     : 0;
  bottom    : 0;
  margin    : auto;
  height    : 1px;
  background: #141414
}

.btnBook {
  background: #DCB46E;
  color     : #fff !important
}

.btnBook:hover {
  background: #444
}

.topLink {
  position   : absolute;
  top        : 0;
  right      : 60px;
  line-height: 75px;
  z-index    : 2
}

.topLink a {
  color          : #fff;
  display        : inline-block;
  vertical-align : middle;
  line-height    : 1.2;
  font-weight    : 900;
  text-transform : uppercase;
  font-size      : 14px;
  border-bottom  : solid 1px transparent;
  text-decoration: none !important
}

.topLink a:hover {
  color       : #DCB46E !important;
  border-color: #DCB46E
}

.topLink a i {
  font-size: inherit;
  color    : inherit
}

.topLink a .ion-ios-location-outline {
  font-size     : 22px !important;
  margin-top    : -4px;
  display       : inline-block;
  vertical-align: middle
}

.topLink a.ion {
  font-size : 27px;
  border    : none;
  margin-top: -3px
}

.topLink a+a {
  margin-left: 17px
}

.logo {
  position      : absolute;
  top           : 16px;
  left          : 0;
  right         : 0;
  margin        : auto;
  width         : 250px;
  opacity       : 0;
  pointer-events: none
}

.logo img {
  display: block;
  width  : 100%;
  height : auto
}

body.open {
  overflow: hidden
}

body.open header {
  background         : transparent;
  border-bottom-color: transparent
}

body.open header .logo {
  opacity       : 0;
  pointer-events: none
}

body.open .topLink a {
  color: #fff
}

.menuLeftMain {
  position          : fixed;
  top               : 0;
  bottom            : 0;
  left              : 0;
  right             : 0;
  width             : 100%;
  min-height        : 100%;
  z-index           : 99;
  -webkit-transform : translateX(-100%);
  -ms-transform     : translateX(-100%);
  -o-transform      : translateX(-100%);
  transform         : translateX(-100%);
  overflow-y        : auto;
  -webkit-transition: all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 0.8s cubic-bezier(0.785, 0.135, 0.15, 1)
}

.menuLeftMain .bg {
  position      : fixed;
  top           : 0;
  left          : 0;
  right         : 0;
  height        : 100%;
  -webkit-filter: grayscale(100%);
  filter        : grayscale(100%);
  z-index       : -1
}

.menuLeftMain .bg:before {
  content   : "";
  position  : absolute;
  top       : 0;
  left      : 0;
  right     : 0;
  bottom    : 0;
  background: rgba(0, 0, 0, 0.7)
}

.menuLeftMain.open {
  -webkit-transform: translateX(0);
  -ms-transform    : translateX(0);
  -o-transform     : translateX(0);
  transform        : translateX(0)
}

.menuCont {
  display       : block;
  padding-top   : 100px;
  padding-bottom: 100px;
  width         : 1200px;
  margin        : auto;
  max-width     : calc(100% - 40px);
  min-height    : 100vh;
  position      : relative;
  z-index       : 2
}

.menuLeft {
  width    : auto;
  min-width: 220px;
  max-width: calc(100% - 40px);
  float    : left
}

.menuLeft ul {
  margin : 0;
  padding: 0
}

.menuLeft>ul>li {
  list-style: none;
  margin    : 0 0 5px 0;
  padding   : 0 0 5px 0;
  position  : relative
}

.menuLeft>ul>li.active>a,
.menuLeft>ul>li.active>i {
  color: #DCB46E
}

.menuLeft>ul>li a {
  font-family: "Tinos", sans-serif
}

.menuLeft>ul>li>a {
  display        : table;
  font-size      : 24px;
  font-weight    : 400;
  color          : #E5E5E5;
  line-height    : 38px;
  padding-right  : 30px;
  text-decoration: none
}

.menuLeft>ul>li>a:hover {
  color: #DCB46E
}

.menuLeft>ul>li i {
  position   : absolute;
  top        : 0;
  right      : 0;
  width      : 50px;
  height     : 37px;
  line-height: 37px;
  text-align : right;
  z-index    : 2;
  font-size  : 13px;
  text-indent: 23px;
  color      : #999;
  cursor     : pointer
}

.menuLeft>ul>li i:before {
  content     : "\f123";
  font-style  : normal;
  font-family : "Ionicons" !important;
  font-size   : 11px;
  color       : #999;
  margin-right: 3px;
  font-weight : 300
}

.menuLeft>ul>li i:hover:before {
  color: #DCB46E
}

.menuLeft>ul>li.active>i:before,
.menuLeft>ul>li i.active:before {
  content: "" !important
}

.menuLeft>ul>li>ul {
  display      : none;
  margin-bottom: 10px
}

.menuLeft>ul>li>ul>li {
  list-style : none;
  margin-left: 35px;
  position   : relative
}

.menuLeft>ul>li>ul>li>a {
  display        : block;
  font-size      : 19px;
  line-height    : 40px;
  color          : #aaa;
  text-decoration: none
}

.menuLeft>ul>li>ul>li.active:after {
  background: #DCB46E
}

.menuLeft>ul>li>ul>li:hover a {
  color: #DCB46E
}

.menuLeft>ul>li>ul>li:after {
  background: #666
}

.menuLeft>ul>li>ul>li>i {
  line-height: 38px
}

.menuLeft>ul>li>ul>li>ul {
  margin-top   : -5px;
  margin-bottom: 20px;
  display      : none
}

.menuLeft>ul>li>ul>li>ul>li {
  margin    : 0;
  margin-top: 10px;
  list-style: none
}

.menuLeft>ul>li>ul>li>ul>li>a {
  color          : #aaa !important;
  padding-left   : 35px;
  font-size      : 18px;
  position       : relative;
  text-decoration: none
}

.menuLeft>ul>li>ul>li>ul>li>a:before {
  content   : "";
  position  : absolute;
  top       : 10px;
  left      : 0;
  width     : 20px;
  height    : 2px;
  background: #999
}

.menuLeft>ul>li>ul>li>ul>li>a:hover {
  color: #DCB46E !important
}

.menuLeft>ul>li>ul>li>ul>li>a:hover:before {
  background: #DCB46E
}

.menuLeft>ul li:last-child {
  border: none
}

.menuHor {
  font-size: 0;
  position : absolute;
  left     : 0;
  bottom   : 50px
}

.menuHor>li {
  display       : inline-block;
  vertical-align: top
}

.menuHor>li>a {
  font-size      : 13px;
  font-weight    : 800;
  color          : #aaa;
  text-transform : uppercase;
  text-decoration: none;
  border-bottom  : solid 1px transparent
}

.menuHor>li>a:hover {
  color       : #DCB46E;
  border-color: #DCB46E
}

.menuHor>li+li {
  margin-left: 35px
}

.menuInfo {
  width   : 50%;
  float   : right;
  position: relative;
  z-index : 2
}

.menuInfo .menuLogo {
  display      : block;
  width        : 270px;
  max-width    : 100%;
  margin-bottom: 50px
}

.menuInfo .menuLogo img {
  display: block;
  width  : 100%;
  height : auto
}

.menuInfo .tit {
  display       : block;
  color         : #aaa;
  text-transform: uppercase;
  margin        : 0 0 25px 0;
  font-weight   : 900;
  font-size     : 14px;
  white-space   : nowrap
}

.menuInfo .tit:before {
  content       : "";
  display       : inline-block;
  vertical-align: middle;
  width         : 40px;
  height        : 4px;
  background    : #aaa;
  margin-right  : 12px;
  margin-top    : -2px
}

.menuInfo p {
  display  : block;
  color    : #aaa;
  font-size: 15px;
  margin   : 0
}

.menuInfo p * {
  color: inherit
}

.menuInfo p a {
  text-decoration: none;
  border-bottom  : solid 1px transparent
}

.menuInfo p a:hover {
  color       : #DCB46E;
  border-color: #DCB46E
}

.menuInfo p+p {
  margin-top: 10px
}

.menuInfo .follow {
  height: auto
}

.menuInfo .follow a {
  color      : #aaa;
  font-size  : 18px;
  width      : auto;
  width      : 30px;
  height     : 30px;
  line-height: 30px;
  background : rgba(50, 50, 50, 0.7)
}

.menuInfo .follow a:hover {
  color: #fff
}

.menuInfo .follow a+a {
  margin-left: 5px
}

.menuInfo .menuBook {
  display        : inline-block;
  color          : #fff;
  text-transform : uppercase;
  font-weight    : 900;
  letter-spacing : 1px;
  width          : 190px;
  height         : 50px;
  line-height    : 50px;
  text-align     : center;
  background     : #DCB46E;
  text-decoration: none
}

.menuInfo .menuBook:hover {
  background: #fff;
  color     : #DCB46E
}

.homeAbout {
  padding   : 50px 0 120px 0;
  background: #EEEEEA
}

@media screen and (max-width: 1200px) {
  .homeAbout {
    padding: 50px 0
  }
}

.homeAbout .img {
  float     : right;
  width     : 50%;
  margin-top: -100px;
  position  : relative
}

@media screen and (max-width: 1200px) {
  .homeAbout .img {
    margin-top: 0
  }
}

.homeAbout .imgBtn {
  position  : absolute;
  right     : 0;
  top       : 0;
  z-index   : 20;
  margin    : 0;
  list-style: none
}

.homeAbout .imgBtn a {
  float      : left;
  width      : 60px;
  height     : 60px;
  line-height: 60px;
  text-align : center;
  color      : #E0B300;
  font-size  : 30px;
  background : rgba(0, 0, 0, 0.7);
  margin-left: 1px
}

@media screen and (max-width: 768px) {
  .homeAbout .imgBtn a {
    width: 40px
  }
}

@media screen and (max-width: 768px) {
  .homeAbout .imgBtn a {
    height: 40px
  }
}

@media screen and (max-width: 768px) {
  .homeAbout .imgBtn a {
    line-height: 40px
  }
}

@media screen and (max-width: 768px) {
  .homeAbout .imgBtn a {
    font-size: 20px
  }
}

.homeAbout .imgBtn a:hover {
  background: #E0B300;
  color     : #000
}

.homeAbout .imgBtn a i {
  color: inherit
}

.homeAbout .text {
  float: left;
  width: calc(50% - 80px)
}

.homeAbout .tit {
  display       : block;
  margin        : 0;
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  text-transform: uppercase;
  font-size     : 25px;
  margin-bottom : 10px
}

@media screen and (min-width: 768px) {
  .homeAbout .tit {
    font-size: calc(25px + 30 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .homeAbout .tit {
    font-size: 55px
  }
}

@media screen and (min-width: 768px) {
  .homeAbout .tit {
    margin-bottom: calc(10px + 10 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .homeAbout .tit {
    margin-bottom: 20px
  }
}

.homeAbout .ell {
  display      : block;
  font-family  : "Tinos", sans-serif;
  margin       : 0;
  max-height   : 120px;
  overflow     : hidden;
  color        : #666;
  line-height  : 1.4;
  text-align   : justify;
  margin-bottom: 20px;
  font-size    : 13px
}

@media screen and (min-width: 768px) {
  .homeAbout .ell {
    margin-bottom: calc(20px + 15 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .homeAbout .ell {
    margin-bottom: 35px
  }
}

@media screen and (min-width: 768px) {
  .homeAbout .ell {
    font-size: calc(13px + 4 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .homeAbout .ell {
    font-size: 17px
  }
}

.line-left {
  position    : relative;
  padding-left: 40px
}

@media screen and (max-width: 767px) {
  .line-left {
    padding-left: 0 !important
  }
}

.line-left:before {
  content   : "";
  position  : absolute;
  top       : 10px;
  left      : 0;
  width     : 25px;
  height    : 3px;
  background: #DCB46E
}

@media screen and (max-width: 767px) {
  .line-left:before {
    display: none
  }
}

.homeSerMain,
.aboutSer {
  overflow: hidden
}

.homeSerMain .uSlide,
.aboutSer .uSlide {
  max-width: 55%
}

@media screen and (max-width: 768px) {

  .homeSerMain .uSlide,
  .aboutSer .uSlide {
    max-width: 75%
  }
}

.homeSer {
  position: relative
}

.homeSer_slide {
  overflow: hidden;
  display : block;
  position: relative
}

.homeSer .uPlayPause {
  display: none
}

.homeSer_slide img {
  display: block;
  width  : 100%;
  height : auto;
  opacity: .5 !important
}

.uSlide {
  list-style: none
}

.homeSer_slide .uSlide.active img {
  opacity: 1 !important
}

.homeSer_slide .uSlide.active .tit-wrap {
  width: 100% !important
}

.homeSer_slide .uSlide.active .tit-wrap>.tit {
  background: #DCB46E
}

.homeSer_slide .uSlide.active .tit-wrap>.tit:before,
.homeSer_slide .uSlide.active .tit-wrap>.tit:after {
  height: 100%
}

.homeSer_slide .tit-wrap {
  position               : absolute;
  top                    : 0;
  left                   : 0;
  height                 : 100%;
  z-index                : 12;
  -webkit-align-items    : center;
  align-items            : center;
  -webkit-justify-content: center;
  text-decoration        : none;
  text-align             : center;
  cursor                 : pointer
}

.homeSer_slide .tit-wrap>.tit {
  display         : inline-block;
  position        : relative;
  text-align      : center;
  border-top      : solid 4px #DCB46E;
  border-bottom   : solid 4px #DCB46E;
  padding         : 15px 35px;
  color           : #fff;
  font-family     : "Tinos", sans-serif;
  font-size       : 40px;
  text-shadow     : 1px 1px rgba(0, 0, 0, 0.2);
  text-transform  : uppercase;
  background-color: transparent
}

@media screen and (max-width: 1366px) {
  .homeSer_slide .tit-wrap>.tit {
    font-size: 30px
  }
}

@media screen and (max-width: 1366px) {
  .homeSer_slide .tit-wrap>.tit {
    border-width: 3px
  }
}

@media screen and (max-width: 1366px) {
  .homeSer_slide .tit-wrap>.tit {
    padding: 10px 30px
  }
}

@media screen and (max-width: 768px) {
  .homeSer_slide .tit-wrap>.tit {
    padding: 10px 20px
  }
}

@media screen and (max-width: 768px) {
  .homeSer_slide .tit-wrap>.tit {
    font-size: 22px
  }
}

@media screen and (max-width: 768px) {
  .homeSer_slide .tit-wrap>.tit {
    border-width: 2px
  }
}

.homeSer_slide .tit-wrap>.tit:before,
.homeSer_slide .tit-wrap>.tit:after {
  border-left : solid 4px #DCB46E;
  border-right: solid 4px #DCB46E;
  height      : 25%
}

@media screen and (max-width: 1366px) {

  .homeSer_slide .tit-wrap>.tit:before,
  .homeSer_slide .tit-wrap>.tit:after {
    border-width: 3px
  }
}

@media screen and (max-width: 768px) {

  .homeSer_slide .tit-wrap>.tit:before,
  .homeSer_slide .tit-wrap>.tit:after {
    border-width: 2px
  }
}

.homeSer_slide .tit-wrap>.tit:after {
  top: auto
}

.row20 {
  margin-left : -10px;
  margin-right: -10px
}

.col-md-5th {
  width  : 20%;
  float  : left;
  padding: 0 10px
}

@media screen and (max-width: 1200px) {
  .col-md-5th {
    width: 50%
  }
}

@media screen and (max-width: 767px) {
  .col-md-5th {
    width: 100%
  }
}

.fooForm {
  padding-top   : 50px;
  padding-bottom: 50px
}

@media screen and (min-width: 1024px) {
  .fooForm {
    padding-top: calc(50px + 50 * (100vw - 1024px) / 376)
  }
}

@media screen and (min-width: 1400px) {
  .fooForm {
    padding-top: 100px
  }
}

@media screen and (min-width: 1024px) {
  .fooForm {
    padding-bottom: calc(50px + 50 * (100vw - 1024px) / 376)
  }
}

@media screen and (min-width: 1400px) {
  .fooForm {
    padding-bottom: 100px
  }
}

.fooForm .line-tit {
  margin-bottom: 10px
}

.line-tit {
  display       : block;
  position      : relative;
  padding-left  : 50px;
  font-size     : 14px;
  text-transform: uppercase;
  font-weight   : 900;
  color         : #000
}

.line-tit:before {
  content   : "";
  position  : absolute;
  left      : 0;
  top       : 6px;
  bottom    : 0;
  width     : 40px;
  height    : 4px;
  background: #000
}

.formStyle label {
  display    : block;
  font-size  : 18px;
  color      : #666;
  font-family: "Tinos", sans-serif
}

@media screen and (max-width: 768px) {
  .formStyle label {
    font-size: 16px
  }
}

@media screen and (max-width: 767px) {
  .formStyle label {
    font-size: 14px
  }
}

.formStyle .form-control {
  height               : 50px;
  box-shadow           : none !important;
  border               : solid 1px #DCB46E;
  border-radius        : 0 !important;
  -webkit-border-radius: 0 !important;
  -moz-border-radius   : 0 !important;
  -o-border-radius     : 0 !important;
  -ms-border-radius    : 0 !important;
  color                : #666;
  font-family          : "Tinos", sans-serif;
  font-size            : 14px
}

.formStyle .form-control:focus {
  border-color: #444
}

.formStyle select {
  -webkit-appearance: none;
  -moz-appearance   : none;
  appearance        : none;
  color             : #828282;
  font-style        : italic;
  font-family       : "Tinos", sans-serif
}

.formStyle .select {
  position: relative
}

.formStyle .select:before {
  content       : "\f3d0";
  position      : absolute;
  top           : 0;
  bottom        : 0;
  right         : 15px;
  font-size     : 20px;
  font-family   : "Ionicons";
  pointer-events: none;
  height        : 20px;
  line-height   : 20px;
  margin        : auto
}

.formStyle .col-md-5th {
  margin-top: 30px
}

.formStyle .btnSubmit {
  height             : 50px;
  line-height        : 45px;
  padding            : 0;
  border             : solid 1px #DCB46E;
  border-bottom-width: 5px;
  color              : #000;
  text-transform     : uppercase;
  font-weight        : 900;
  background-color   : transparent;
  position           : relative;
  letter-spacing     : 1px
}

.formStyle .btnSubmit:before {
  content   : "";
  position  : absolute;
  top       : 0;
  bottom    : 0;
  left      : 0;
  width     : 30px;
  height    : 4px;
  margin    : auto;
  background: #DCB46E
}

.formStyle .btnSubmit:hover {
  border-color: #333;
  background  : #DCB46E
}

.formStyle .btnSubmit:hover:before {
  background: #333
}

.formStyle textarea {
  height: 100px !important
}

.bootstrap-datetimepicker-widget table .picker-switch {
  font-weight: bold
}

.bootstrap-datetimepicker-widget table td.day,
.bootstrap-datetimepicker-widget table th {
  height     : 30px;
  line-height: 30px;
  width      : 20px !important;
  font-size  : 13px;
  color      : #333
}

.bootstrap-datetimepicker-widget table td.disabled {
  color: #ccc
}

.bootstrap-datetimepicker-widget table td.active {
  color: #fff
}

.bootstrap-datetimepicker-widget table th.next,
.bootstrap-datetimepicker-widget table th.prev {
  background: #eee
}

.bootstrap-datetimepicker-widget table th.next span,
.bootstrap-datetimepicker-widget table th.prev span {
  font-size: 20px
}

.bootstrap-datetimepicker-widget table td span {
  margin     : 0;
  color      : #fff;
  width      : 40px;
  height     : 30px;
  line-height: 30px
}

.bootstrap-datetimepicker-widget table td span.timepicker-hour,
.bootstrap-datetimepicker-widget table td span.timepicker-minute {
  color      : #555;
  width      : 40px;
  margin     : -5px auto 0 auto;
  display    : block;
  text-indent: -5px
}

.bootstrap-datetimepicker-widget .datepicker {
  padding-top: 15px
}

.bootstrap-datetimepicker-widget .datepicker,
.bootstrap-datetimepicker-widget .timepicker {
  width    : 100%;
  max-width: 100%;
  flex     : unset;
  display  : block;
  clear    : both
}

.bootstrap-datetimepicker-widget .row {
  margin-left : 0;
  margin-right: 0
}

.bootstrap-datetimepicker-widget .timepicker {
  border-top : solid 1px #ddd;
  padding-top: 15px;
  margin-top : 15px
}

footer {
  background    : #EEEEEA;
  padding-top   : 40px;
  padding-bottom: 40px
}

@media screen and (min-width: 768px) {
  footer {
    padding-top: calc(40px + 40 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  footer {
    padding-top: 80px
  }
}

@media screen and (min-width: 768px) {
  footer {
    padding-bottom: calc(40px + 40 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  footer {
    padding-bottom: 80px
  }
}

@media screen and (max-width: 1024px) {
  footer .row {
    display: block
  }
}

.fooLogo {
  display: block;
  margin : 0 auto 60px auto;
  width  : 250px
}

@media screen and (max-width: 767px) {
  .fooLogo {
    width: 160px
  }
}

@media screen and (max-width: 1024px) {
  .fooLogo {
    margin-bottom: 25px
  }
}

.fooLogo img {
  display: block;
  width  : 100%;
  height : auto
}

.fooInfo {
  font-size  : 13px;
  color      : #646464;
  line-height: 1.4;
  font-style : italic
}

@media screen and (max-width: 1024px) {
  .fooInfo {
    width: 100%
  }
}

@media screen and (max-width: 1024px) {
  .fooInfo {
    max-width: unset
  }
}

@media screen and (max-width: 1024px) {
  .fooInfo {
    text-align: center
  }
}

.fooInfo p {
  margin: 0
}

.fooInfo * {
  font-size: inherit;
  color    : inherit
}

.fooFollow {
  text-align : right;
  padding-top: 5px
}

@media screen and (max-width: 1024px) {
  .fooFollow {
    padding-top: 25px
  }
}

@media screen and (max-width: 1024px) {
  .fooFollow {
    width: 100%
  }
}

@media screen and (max-width: 1024px) {
  .fooFollow {
    max-width: unset
  }
}

@media screen and (max-width: 1024px) {
  .fooFollow {
    text-align: center
  }
}

.fooFollow .follow {
  margin-right: 0;
  height      : auto
}

.fooNav {
  font-size  : 0;
  text-align : center;
  padding-top: 10px
}

@media screen and (max-width: 1024px) {
  .fooNav {
    padding-top: 25px
  }
}

@media screen and (max-width: 1024px) {
  .fooNav {
    width: 100%
  }
}

@media screen and (max-width: 1024px) {
  .fooNav {
    max-width: unset
  }
}

@media screen and (max-width: 1024px) {
  .fooNav {
    text-align: center
  }
}

.fooNav li {
  list-style    : none;
  display       : inline-block;
  vertical-align: top
}

.fooNav li a {
  display        : block;
  font-size      : 13px;
  color          : #000;
  font-weight    : 800;
  text-decoration: none;
  border-bottom  : solid 1px transparent;
  text-transform : uppercase
}

.fooNav li a:hover {
  border-color: #DCB46E;
  color       : #DCB46E
}

.fooNav li+li {
  margin-left: 40px
}

@media screen and (max-width: 1024px) {
  .fooNav li+li {
    margin-left: 20px
  }
}

.banner.fix {
  margin-bottom: 50px
}

@media screen and (min-width: 768px) {
  .banner.fix {
    margin-bottom: calc(50px + 50 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .banner.fix {
    margin-bottom: 100px
  }
}

.banner.fix .pagewrap {
  width: 1200px
}

.banner.fix .item:after {
  background: rgba(0, 0, 0, 0.3)
}

.banner.fix .bannerDesc {
  width: 50%
}

.noMargin {
  margin: 0 !important
}

.aboutTop {
  position               : relative;
  background             : url("../images/bg-about.jpg") no-repeat center bottom;
  -webkit-background-size: cover;
  background-size        : cover;
  padding-top            : 40px;
  padding-bottom         : 40px
}

@media screen and (min-width: 768px) {
  .aboutTop {
    padding-top: calc(40px + 80 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .aboutTop {
    padding-top: 120px
  }
}

@media screen and (min-width: 768px) {
  .aboutTop {
    padding-bottom: calc(40px + 80 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .aboutTop {
    padding-bottom: 120px
  }
}

.aboutTop .desc {
  float: right;
  width: 50%
}

.aboutTop .text {
  width  : 600px;
  padding: 60px 50px 0 50px
}

.aboutTop .tit {
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  text-transform: uppercase;
  line-height   : 1.1;
  margin-bottom : 15px;
  font-size     : 30px
}

@media screen and (min-width: 1024px) {
  .aboutTop .tit {
    margin-bottom: calc(15px + 10 * (100vw - 1024px) / 176)
  }
}

@media screen and (min-width: 1200px) {
  .aboutTop .tit {
    margin-bottom: 25px
  }
}

@media screen and (min-width: 1024px) {
  .aboutTop .tit {
    font-size: calc(30px + 25 * (100vw - 1024px) / 896)
  }
}

@media screen and (min-width: 1920px) {
  .aboutTop .tit {
    font-size: 55px
  }
}

.aboutTop p {
  font-family: "Tinos", sans-serif;
  color      : #505050;
  text-align : justify;
  font-size  : 14px
}

@media screen and (min-width: 1024px) {
  .aboutTop p {
    font-size: calc(14px + 3 * (100vw - 1024px) / 376)
  }
}

@media screen and (min-width: 1400px) {
  .aboutTop p {
    font-size: 17px
  }
}

.aboutTop .bg {
  position: absolute;
  top     : 0;
  right   : 0;
  bottom  : 0;
  left    : calc(50% + 600px)
}

.aboutTop .bg:before {
  background-color: rgba(0, 0, 0, 0.3)
}

.aboutTop .btn {
  margin-top: 20px
}

.cont {
  position: relative
}

.img-link {
  float: left;
  width: 50%
}

.img-link:before {
  content       : "";
  display       : block;
  width         : 100%;
  padding-bottom: calc(600/960 * 100%);
  background    : url("../images/icon-video.png") no-repeat center center rgba(0, 0, 0, 0.3)
}

.noclip:before {
  background-image: none !important;
  background-color: transparent
}

.noclip:hover:before {
  background-color: rgba(0, 0, 0, 0.3)
}

.about-titbox {
  display   : block;
  text-align: center
}

.about-titbox .tit {
  font-size     : 55px;
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  text-transform: uppercase;
  line-height   : 1;
  margin-bottom : 10px
}

@media screen and (max-width: 1200px) {
  .about-titbox .tit {
    font-size: 40px
  }
}

@media screen and (max-width: 1023px) {
  .about-titbox .tit {
    font-size: 30px
  }
}

.about-titbox .tit.text-shadow {
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.6)
}

.about-titbox .desc {
  text-transform: uppercase;
  color         : #444;
  font-size     : 17px;
  display       : block;
  margin        : 0;
  font-weight   : 800;
  letter-spacing: 1px;
  position      : relative
}

@media screen and (max-width: 1023px) {
  .about-titbox .desc {
    font-size: 15px
  }
}

@media screen and (max-width: 1023px) {
  .about-titbox .desc {
    letter-spacing: 0
  }
}

.counterBox {
  overflow: hidden
}

.counterBox .pagewrap {
  padding: 90px 0
}

.counterBox .about-titbox {
  margin-bottom: 70px
}

.counterMain .item {
  -webkit-flex-wrap      : wrap;
  flex-wrap              : wrap;
  -webkit-align-items    : center;
  align-items            : center;
  -webkit-justify-content: center;
  justify-content        : center;
  position               : relative;
  width                  : 244px;
  height                 : 252px;
  background             : url("../images/bg-counter.svg") no-repeat center top;
  -webkit-background-size: 100%;
  background-size        : 100%;
  text-align             : center;
  -webkit-animation      : float 4.5s ease-in-out infinite;
  animation              : float 6s ease-in-out infinite
}

.counterMain .item:nth-child(2) {
  -webkit-animation-delay: 0.5s;
  -o-animation-delay     : 0.5s;
  animation-delay        : 0.5s
}

.counterMain .item:nth-child(3) {
  -webkit-animation-delay: 1.5s;
  -o-animation-delay     : 1.5s;
  animation-delay        : 1.5s
}

.counterMain .item:last-child {
  -webkit-animation-delay: 1s;
  -o-animation-delay     : 1s;
  animation-delay        : 1s
}

.counterMain .item li {
  list-style: none;
  margin    : 0;
  padding   : 0
}

.counterMain .item .tit {
  display    : block;
  width      : 100%;
  font-size  : 60px;
  color      : #DCB46E;
  line-height: 1.4;
  font-family: "Tinos", sans-serif;
  font-weight: bold
}

@media screen and (max-width: 1200px) {
  .counterMain .item .tit {
    font-size: 50px
  }
}

@media screen and (max-width: 1023px) {
  .counterMain .item .tit {
    font-size: 35px
  }
}

@media screen and (max-width: 767px) {
  .counterMain .item .tit {
    font-size: 25px
  }
}

.counterMain .item p {
  display       : block;
  width         : 110px;
  margin        : 0 auto;
  font-size     : 16px;
  font-weight   : 800;
  color         : #444;
  clear         : both;
  text-transform: uppercase
}

@media screen and (max-width: 1200px) {
  .counterMain .item p {
    font-size: 14px
  }
}

.counterMain .item:first-child,
.counterMain .item:last-child {
  margin-top: 50px
}

.counterMain .item:before,
.counterMain .item:after {
  content   : "";
  position  : absolute;
  left      : 0;
  right     : 0;
  bottom    : 100%;
  width     : 2px;
  height    : 500px;
  background: #fff;
  margin    : auto
}

.counterMain .item:after {
  display: none
}

.counterMain .item:nth-child(2):before,
.counterMain .item:nth-child(3):before {
  height: 65px
}

.counterMain .item:nth-child(2):after,
.counterMain .item:nth-child(3):after {
  display      : block;
  margin-bottom: 180px
}

@keyframes float {
  0% {
    transform: translateY(0px)
  }

  50% {
    transform: translateY(-25px)
  }

  100% {
    transform: translateY(0px)
  }
}

.aboutSer .about-titbox,
.aboutPromotion .about-titbox {
  overflow      : hidden;
  padding-top   : 50px;
  padding-bottom: 30px
}

@media screen and (min-width: 1024px) {

  .aboutSer .about-titbox,
  .aboutPromotion .about-titbox {
    padding-top: calc(50px + 50 * (100vw - 1024px) / 342)
  }
}

@media screen and (min-width: 1366px) {

  .aboutSer .about-titbox,
  .aboutPromotion .about-titbox {
    padding-top: 100px
  }
}

@media screen and (min-width: 1024px) {

  .aboutSer .about-titbox,
  .aboutPromotion .about-titbox {
    padding-bottom: calc(30px + 40 * (100vw - 1024px) / 342)
  }
}

@media screen and (min-width: 1366px) {

  .aboutSer .about-titbox,
  .aboutPromotion .about-titbox {
    padding-bottom: 70px
  }
}

.aboutSer .about-titbox .desc:after,
.aboutPromotion .about-titbox .desc:after {
  content   : "";
  position  : absolute;
  left      : 0;
  right     : 0;
  top       : 100%;
  width     : 2px;
  height    : 60px;
  margin    : 20px auto 0 auto;
  background: #DCB46E
}

.homeSer .inside-tit {
  position      : absolute;
  left          : 0;
  right         : 0;
  bottom        : 0;
  max-width     : calc(100% - 40px);
  width         : 380px;
  margin        : 0 auto;
  text-align    : center;
  color         : #fff;
  font-family   : "Tinos", sans-serif;
  text-transform: uppercase;
  font-weight   : bold;
  text-shadow   : 1px 1px 0 rgba(0, 0, 0, 0.6);
  z-index       : 10;
  padding       : 80px 0 30px 0;
  line-height   : 1.2;
  font-size     : 25px
}

@media screen and (min-width: 1024px) {
  .homeSer .inside-tit {
    font-size: calc(25px + 10 * (100vw - 1024px) / 896)
  }
}

@media screen and (min-width: 1920px) {
  .homeSer .inside-tit {
    font-size: 35px
  }
}

.homeSer .inside-tit:before {
  background             : url("../images/ser-bg-title.svg") no-repeat center top;
  -webkit-background-size: 100%;
  background-size        : 100%;
  z-index                : -1;
  opacity                : 0.6
}

.homeSer .desc {
  max-width              : calc(100% - 40px);
  width                  : 420px;
  padding                : 0 20px 100px 20px;
  text-align             : center;
  z-index                : 2;
  position               : absolute;
  left                   : 0;
  right                  : 0;
  top                    : -150px;
  margin                 : auto;
  background             : url("../images/ser-bg-overplay.svg") no-repeat center bottom;
  -webkit-background-size: 100%;
  background-size        : 100%;
  opacity                : 0
}

.homeSer .desc p {
  color      : #fff;
  font-size  : 18px;
  line-height: 1.4;
  font-family: "Tinos", sans-serif;
  margin     : 0 auto;
  max-height : 140px;
  width      : 290px;
  max-width  : calc(100% - 30px);
  text-align : center
}

@media screen and (max-width: 1200px) {
  .homeSer .desc p {
    font-size: 16px
  }
}

@media screen and (max-width: 1024px) {
  .homeSer .desc p {
    font-size: 14px
  }
}

.homeSer .tit-over {
  display       : block;
  max-width     : 100%;
  width         : 380px;
  margin        : 0 auto;
  text-align    : center;
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  text-transform: uppercase;
  font-weight   : bold;
  padding       : 40px 0 80px 0;
  line-height   : 1.2;
  position      : relative;
  z-index       : 2;
  margin-bottom : 0;
  font-size     : 25px
}

@media screen and (min-width: 1024px) {
  .homeSer .tit-over {
    font-size: calc(25px + 10 * (100vw - 1024px) / 896)
  }
}

@media screen and (min-width: 1920px) {
  .homeSer .tit-over {
    font-size: 35px
  }
}

.homeSer .tit-over:before {
  background             : url("../images/ser-bg-title.svg") no-repeat center bottom;
  -webkit-background-size: 100%;
  background-size        : 100%;
  z-index                : -1
}

.homeSer .uSlide.active .inside-tit {
  opacity: 0;
  bottom : -100px
}

.homeSer .uSlide.active .desc {
  top    : 0;
  opacity: 1
}

.homeSer .uSlide.active .tit-over {
  margin-bottom: 35px
}

.aboutPromotion {
  background    : #F0F0F0;
  padding-bottom: 50px
}

@media screen and (min-width: 1024px) {
  .aboutPromotion {
    padding-bottom: calc(50px + 70 * (100vw - 1024px) / 342)
  }
}

@media screen and (min-width: 1366px) {
  .aboutPromotion {
    padding-bottom: 120px
  }
}

.proSlider {
  position: relative
}

.proSlider .owl-dots {
  display: none
}

@media screen and (max-width: 1200px) {
  .proSlider .owl-dots {
    display: block
  }
}

@media screen and (max-width: 1200px) {
  .proSlider .owl-dots {
    bottom: 20px
  }
}

.navPro {
  position: absolute;
  top     : 60px;
  bottom  : 60px;
  cursor  : pointer;
  z-index : 2
}

.navPro:before {
  font-family   : "Black Tie";
  position      : absolute;
  display       : inline-block;
  vertical-align: middle;
  top           : 0;
  bottom        : 0;
  width         : 40px;
  height        : 40px;
  line-height   : 40px;
  color         : #000;
  font-size     : 27px;
  font-weight   : 200;
  background    : #fff;
  margin        : auto;
  z-index       : 2
}

.navPro:hover:before {
  background-color: #DCB46E;
  color           : #fff
}

.navPro:after {
  background-color: rgba(0, 0, 0, 0.5);
  opacity         : 1;
  z-index         : 0
}

.navPro:hover:after {
  background-color: rgba(0, 0, 0, 0.3);
  opacity         : 1
}

.navPro.navPrev {
  left      : 0;
  right     : calc(50% + 600px);
  text-align: right
}

.navPro.navPrev:before {
  content: "\f0aa";
  right  : 0
}

.navPro.navNext {
  right     : 0;
  left      : calc(50% + 600px);
  text-align: left
}

.navPro.navNext:before {
  content: "\f0ab";
  left   : 0
}

.itemPro {
  display: block
}

.itemPro .thumb {
  padding-bottom: 50%
}

.aboutGalMain {
  padding-top        : 50px;
  -webkit-align-items: flex-end;
  align-items        : flex-end
}

@media screen and (min-width: 1024px) {
  .aboutGalMain {
    padding-top: calc(50px + 70 * (100vw - 1024px) / 342)
  }
}

@media screen and (min-width: 1366px) {
  .aboutGalMain {
    padding-top: 120px
  }
}

.aboutGalLeft {
  width        : 50%;
  float        : left;
  position     : relative;
  padding-right: 50px
}

.aboutGalLeft .wrap {
  width: 550px;
  float: right
}

.aboutGalLeft .about-titbox {
  text-align   : left;
  margin-bottom: 70px
}

.aboutGalLeft .about-titbox .tit:after {
  content   : "";
  display   : block;
  clear     : both;
  height    : 2px;
  background: #DCB46E;
  margin    : 20px -50px 15px 0
}

.aboutGal_next {
  width   : 100%;
  height  : 330px;
  display : block;
  position: relative;
  cursor  : pointer
}

.aboutGal_next:hover:after {
  background-color: rgba(0, 0, 0, 0.2)
}

.aboutGal_next:after {
  background-color: rgba(0, 0, 0, 0.4);
  opacity         : 1 !important;
  pointer-events  : none
}

.aboutGal_prev {
  width   : calc(100% - 650px);
  height  : 330px;
  float   : left;
  position: absolute;
  left    : 0;
  bottom  : 0;
  cursor  : pointer
}

.aboutGal_prev:hover:after {
  background-color: rgba(0, 0, 0, 0.2)
}

.aboutGal_prev:after {
  opacity         : 1 !important;
  background-color: rgba(0, 0, 0, 0.4);
  pointer-events  : none
}

.aboutGalRight {
  width   : 50%;
  float   : right;
  height  : 640px;
  position: relative;
  z-index : 2
}

.aboutGalRight .dots .owl-dots {
  right            : calc(100% + 50px);
  bottom           : 355px;
  left             : auto;
  text-align       : right;
  -webkit-transform: none;
  -ms-transform    : none;
  -o-transform     : none;
  transform        : none
}

.aboutGalRight .dots .owl-dot {
  border: solid 1px #A0A0A0 !important;
  width : 15px;
  height: 15px;
  margin: 0
}

.aboutGalRight .dots .owl-dot.active {
  background  : #DCB46E;
  border-color: #DCB46E !important
}

.aboutGalRight .dots .owl-dot+.owl-dot {
  margin-left: 10px
}

.itemGalSlide {
  display : block;
  width   : 100%;
  position: relative
}

.itemGalSlide .thumb {
  padding-bottom: 0;
  height        : 640px
}

.itemGalSlide .desc {
  position  : absolute;
  left      : 0;
  bottom    : 0;
  background: rgba(255, 255, 255, 0.9);
  padding   : 50px;
  width     : 600px;
  max-width : calc(100% - 150px);
  padding   : 20px
}

@media screen and (min-width: 1024px) {
  .itemGalSlide .desc {
    padding: calc(20px + 30 * (100vw - 1024px) / 342)
  }
}

@media screen and (min-width: 1366px) {
  .itemGalSlide .desc {
    padding: 50px
  }
}

.itemGalSlide .tit {
  display        : block;
  font-size      : 30px;
  text-transform : uppercase;
  line-height    : 1.2;
  color          : #DCB46E;
  font-weight    : bold;
  text-decoration: none !important;
  font-family    : "Tinos", sans-serif;
  margin         : 0 0 15px 0;
  font-size      : 20px
}

@media screen and (min-width: 768px) {
  .itemGalSlide .tit {
    font-size: calc(20px + 10 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .itemGalSlide .tit {
    font-size: 30px
  }
}

.itemGalSlide .tit * {
  margin: 0
}

.itemGalSlide .tit:hover {
  color: #333
}

.itemGalSlide p {
  display      : block;
  color        : #333;
  line-height  : 1.4;
  margin       : 0;
  font-family  : "Tinos", sans-serif;
  margin-bottom: 15px;
  font-size    : 14px
}

@media screen and (min-width: 768px) {
  .itemGalSlide p {
    margin-bottom: calc(15px + 15 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .itemGalSlide p {
    margin-bottom: 30px
  }
}

@media screen and (min-width: 768px) {
  .itemGalSlide p {
    font-size: calc(14px + 3 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .itemGalSlide p {
    font-size: 17px
  }
}

.conference .aboutTop {
  position  : relative;
  padding   : 0 !important;
  background: #E6E6E6 !important;
  z-index   : 2
}

.conference .aboutTop:before {
  content                : "";
  position               : absolute;
  top                    : 0;
  left                   : 50%;
  bottom                 : 0;
  width                  : 600px;
  background             : url("../images/bg-box-conference.png") no-repeat center center #E6E6E6;
  -webkit-background-size: cover;
  background-size        : cover;
  z-index                : -1
}

.conference .aboutTop .desc {
  position           : absolute;
  top                : 0;
  left               : 50%;
  bottom             : 0;
  width              : 600px;
  -webkit-align-items: center;
  align-items        : center
}

.conference .aboutTop .text {
  padding-top   : 0;
  padding-bottom: 0
}

.conference .aboutTop .ns {
  color      : #C8C8C8;
  font-family: "iCiel Rukola", sans-serif;
  line-height: 0.6;
  font-size  : 25px
}

@media screen and (min-width: 768px) {
  .conference .aboutTop .ns {
    font-size: calc(25px + 45 * (100vw - 768px) / 832)
  }
}

@media screen and (min-width: 1600px) {
  .conference .aboutTop .ns {
    font-size: 70px
  }
}

.conference .aboutTop .bg {
  filter: grayscale(100%)
}

.conference .aboutTop:nth-child(2n) {
  -webkit-flex-direction: row-reverse;
  flex-direction        : row-reverse
}

.conference .aboutTop:nth-child(2n):before {
  left : 0;
  right: 50%;
  width: auto
}

.conference .aboutTop:nth-child(2n) .bg {
  display: none
}

.conference .aboutTop:nth-child(2n) .desc {
  left       : 50%;
  right      : auto;
  margin-left: -600px
}

.conference .aboutTop:nth-child(2n) .text {
  padding-left: 0
}

.conference .aboutTop:nth-child(2n) .img-link {
  float: right
}

.bannerInside {
  position     : relative;
  margin-bottom: 50px
}

@media screen and (min-width: 768px) {
  .bannerInside {
    margin-bottom: calc(50px + 50 * (100vw - 768px) / 1152)
  }
}

@media screen and (min-width: 1920px) {
  .bannerInside {
    margin-bottom: 100px
  }
}

.bannerInside:before {
  content   : "";
  display   : block;
  width     : 100%;
  background: rgba(0, 0, 0, 0.3)
}

@media screen and (max-width: 1919px) {
  .bannerInside:before {
    padding-bottom: calc(500/1920 * 100%)
  }
}

@media screen and (min-width: 1920px) {
  .bannerInside:before {
    padding-bottom: 0px
  }
}

@media screen and (min-width: 1920px) {
  .bannerInside:before {
    height: 500px
  }
}

@media screen and (max-width: 1919px) {
  .bannerInside:before {
    height: auto
  }
}

@media screen and (max-width: 767px) {
  .bannerInside:before {
    height: 170px
  }
}

@media screen and (max-width: 767px) {
  .bannerInside:before {
    padding-bottom: 0
  }
}

.bannerInside .bannerTit {
  position  : absolute;
  left      : 0;
  right     : 0;
  text-align: center;
  color     : #fff;
  bottom    : 25px
}

@media screen and (min-width: 768px) {
  .bannerInside .bannerTit {
    bottom: calc(25px + 40 * (100vw - 768px) / 1152)
  }
}

@media screen and (min-width: 1920px) {
  .bannerInside .bannerTit {
    bottom: 65px
  }
}

.bannerInside .bannerTit * {
  color: inherit !important
}

.bannerInside .bannerTit a:hover {
  color       : #DCB46E !important;
  border-color: #DCB46E
}

.bannerInside .breadcrumb {
  margin : 0;
  display: block;
  z-index: 2
}

.bannerInside .breadcrumb li {
  display: inline-block
}

.bannerInside .breadcrumb li a {
  text-decoration: none;
  border-bottom  : solid 1px transparent;
  font-family    : "Tinos", sans-serif;
  font-size      : 13px
}

@media screen and (min-width: 768px) {
  .bannerInside .breadcrumb li a {
    font-size: calc(13px + 7 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .bannerInside .breadcrumb li a {
    font-size: 20px
  }
}

.bannerInside .breadcrumb li+li:before {
  content    : "\f097";
  font-family: "Black Tie";
  font-size  : 10px;
  color      : #fff
}

.bannerInside .breadcrumb-item+.breadcrumb-item {
  padding-left: 0.3rem
}

.bannerInside .title {
  display       : block;
  color         : inherit;
  text-transform: uppercase;
  font-family   : "Tinos", sans-serif;
  line-height   : 1.2;
  margin-bottom : 10px;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .bannerInside .title {
    font-size: calc(25px + 30 * (100vw - 768px) / 1152)
  }
}

@media screen and (min-width: 1920px) {
  .bannerInside .title {
    font-size: 55px
  }
}

@media screen and (max-width: 767px) {
  .bannerInside .title {
    font-size: 20px
  }
}

@media screen and (max-width: 767px) {
  .bannerInside .title {
    margin-bottom: 0
  }
}

.event-desc {
  margin-bottom: 30px
}

@media screen and (min-width: 768px) {
  .event-desc {
    margin-bottom: calc(30px + 40 * (100vw - 768px) / 632)
  }
}

@media screen and (min-width: 1400px) {
  .event-desc {
    margin-bottom: 70px
  }
}

.event-desc .tit {
  font-family   : "Tinos", sans-serif;
  color         : #DCB46E;
  text-transform: uppercase;
  margin-bottom : 15px;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .event-desc .tit {
    font-size: calc(25px + 30 * (100vw - 768px) / 1152)
  }
}

@media screen and (min-width: 1920px) {
  .event-desc .tit {
    font-size: 55px
  }
}

.event-desc p {
  color      : #666;
  line-height: 1.4;
  margin     : 0;
  font-family: "Tinos", sans-serif;
  text-align : justify;
  font-size  : 14px
}

@media screen and (min-width: 768px) {
  .event-desc p {
    font-size: calc(14px + 3 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .event-desc p {
    font-size: 17px
  }
}

.oneEvent .thumb {
  position       : relative;
  padding-bottom : 0;
  width          : 50%;
  float          : left;
  text-decoration: none;
  color          : #fff;
  font-family    : "Tinos", sans-serif
}

.oneEvent .thumb * {
  color      : inherit;
  font-family: inherit
}

.oneEvent .thumb:before {
  content       : "";
  display       : block;
  clear         : both;
  width         : 100%;
  padding-bottom: calc(540/960 * 100%)
}

.oneEvent .thumb:after {
  z-index         : 0;
  background-color: rgba(0, 0, 0, 0.5)
}

.oneEvent .thumb>.tit,
.oneEvent .thumb .desc {
  position               : absolute;
  top                    : 0;
  left                   : 0;
  right                  : 0;
  bottom                 : 0;
  margin                 : auto;
  max-width              : calc(100% - 100px);
  -webkit-align-items    : center;
  align-items            : center;
  -webkit-justify-content: center;
  justify-content        : center;
  z-index                : 2
}

.oneEvent .thumb>.tit {
  cursor        : pointer;
  text-transform: uppercase;
  text-align    : center;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .oneEvent .thumb>.tit {
    font-size: calc(25px + 20 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .oneEvent .thumb>.tit {
    font-size: 45px
  }
}

.oneEvent .thumb>.desc {
  width      : 500px;
  left       : 100px;
  margin-left: 0
}

.oneEvent .thumb .tit-sub {
  font-weight: 400;
  font-size  : 18px
}

@media screen and (min-width: 768px) {
  .oneEvent .thumb .tit-sub {
    font-size: calc(18px + 17 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .oneEvent .thumb .tit-sub {
    font-size: 35px
  }
}

.oneEvent .thumb p {
  text-align: justify;
  font-size : 14px
}

@media screen and (min-width: 768px) {
  .oneEvent .thumb p {
    font-size: calc(14px + 6 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .oneEvent .thumb p {
    font-size: 20px
  }
}

.oneEvent .thumb.right {
  filter: grayscale(100%)
}

.oneEvent:hover .tit {
  text-shadow: 0 1px 0 #fff;
  color      : #DCB46E
}

.oneEvent:hover .thumb:after {
  background-color: rgba(0, 0, 0, 0.3)
}

.loadMoreEvent {
  display: table;
  margin : 50px auto 80px auto !important
}

.formPartner {
  background: #EEEEEA;
  padding   : 70px 0
}

.formPartner .tit {
  color         : #DCB46E;
  text-transform: uppercase;
  font-family   : "Tinos", sans-serif;
  margin        : 0;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .formPartner .tit {
    font-size: calc(25px + 20 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .formPartner .tit {
    font-size: 45px
  }
}

.formPartner .btn {
  background: #fff
}

.oneRecruit {
  float   : left;
  width   : 50%;
  position: relative;
  overflow: hidden
}

@media screen and (max-width: 1023px) {
  .oneRecruit {
    width: 100%
  }
}

.oneRecruit .thumb {
  z-index           : 0;
  filter            : grayscale(100%);
  padding-bottom    : 50%;
  -webkit-transition: all 1s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 1s cubic-bezier(0.785, 0.135, 0.15, 1)
}

@media screen and (max-width: 768px) {
  .oneRecruit .thumb {
    padding-bottom: 66.6666%
  }
}

.oneRecruit .thumb:after {
  -webkit-transition: all 1s cubic-bezier(0.785, 0.135, 0.15, 1);
  transition        : all 1s cubic-bezier(0.785, 0.135, 0.15, 1);
  background-color  : rgba(0, 0, 0, 0.6)
}

.oneRecruit .desc {
  position               : absolute;
  top                    : 0;
  right                  : 0;
  bottom                 : 0;
  width                  : 600px;
  max-width              : calc(100% - 60px);
  padding-right          : 70px;
  -webkit-align-items    : center;
  align-items            : center;
  -webkit-justify-content: center;
  justify-content        : center;
  z-index                : 2
}

.oneRecruit .tit {
  font-family: "Tinos", sans-serif;
  font-weight: 400;
  margin     : 0 0 15px 0;
  line-height: 1.2;
  font-size  : 22px
}

@media screen and (min-width: 768px) {
  .oneRecruit .tit {
    font-size: calc(22px + 13 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .oneRecruit .tit {
    font-size: 35px
  }
}

.oneRecruit .tit a {
  display        : block;
  color          : #DCB46E !important;
  font-size      : inherit;
  font-weight    : inherit;
  text-decoration: none;
  font-family    : inherit;
  text-decoration: none
}

.oneRecruit .tit a:hover {
  color: #fff
}

.oneRecruit .desc {
  color: #fff
}

.oneRecruit .desc * {
  color: inherit
}

.oneRecruit p {
  max-height: 100px;
  overflow  : hidden
}

.oneRecruit .btn {
  margin-top     : 30px;
  color          : #fff !important;
  text-decoration: none !important
}

.oneRecruit .btn:hover {
  color: #fff !important
}

.oneRecruit:hover .thumb {
  filter           : grayscale(0);
  -webkit-transform: scale(1.15);
  -ms-transform    : scale(1.15);
  -o-transform     : scale(1.15);
  transform        : scale(1.15)
}

.oneRecruit:hover .thumb:after {
  background-color: rgba(0, 0, 0, 0.5)
}

.oneRecruit:nth-child(2n) .desc {
  left         : 0;
  right        : auto;
  padding-right: 0;
  padding-left : 70px
}

.recruitDesc {
  padding: 70px 0
}

.recruitDesc .text {
  float: left;
  width: calc(100% - 400px)
}

.recruitDesc .text * {
  font-family: "Tinos", sans-serif;
  color      : #333;
  font-size  : 20px
}

.recruitDesc .text a {
  color: #DCB46E
}

.recruitDesc .text a:hover {
  color          : #000;
  text-decoration: underline
}

.recruitDesc .text h2,
.recruitDesc .text h3,
.recruitDesc .text h4,
.recruitDesc .text h5 {
  color        : #DCB46E;
  margin-bottom: 15px
}

.recruitDesc .listButton {
  float: right;
  width: 350px
}

.recruitDesc .listButton .btn {
  background : #DCB46E;
  font-family: "Tinos", sans-serif;
  font-weight: bold;
  font-size  : 16px
}

.recruitDesc .listButton .btn:hover {
  background: #333
}

.recruitDesc .listButton .btn+.btn {
  margin-top: 5px
}

.recruitDesc .listButton h4 {
  font-family  : "Tinos", sans-serif;
  color        : #DCB46E;
  font-size    : 20px;
  font-weight  : bold;
  margin-bottom: 15px
}

.recruitmentView .pagewrap {
  width         : 1200px;
  padding-top   : 10px;
  padding-bottom: 10px;
  color         : #666
}

@media screen and (max-width: 767px) {
  .recruitmentView .pagewrap {
    max-width: 100%
  }
}

.recruitmentView .pagewrap .landing {
  color: inherit
}

.recruit_tit_sub {
  display       : block;
  color         : #505050;
  font-weight   : bold;
  margin        : 0 0 5px 0;
  line-height   : 1.2;
  text-transform: uppercase
}

.recruit_tit {
  display    : block;
  color      : #333 !important;
  font-weight: bold;
  margin     : 0 0 30px 0;
  width      : 100% !important;
  max-width  : 100%;
  line-height: 1.2;
  font-size  : 25px
}

@media screen and (min-width: 768px) {
  .recruit_tit {
    font-size: calc(25px + 10 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .recruit_tit {
    font-size: 35px
  }
}

.recruitBox {
  position: relative;
  padding : 80px 0
}

.recruitBox .bg {
  position: absolute;
  top     : 0;
  left    : 0;
  right   : 0;
  bottom  : 0;
  filter  : grayscale(100%)
}

.recruitBox .bg:after {
  background-color: rgba(0, 0, 0, 0.7)
}

.recruitBox .pagewrap {
  z-index: 2
}

.recruitBox .pagewrap * {
  color: #fff !important
}

.recruitBox .tit {
  float      : left;
  width      : 420px;
  margin     : 0;
  padding-top: 20px;
  font-family: "Tinos", sans-serif;
  text-align : right;
  font-size  : 25px
}

@media screen and (min-width: 768px) {
  .recruitBox .tit {
    font-size: calc(25px + 15 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .recruitBox .tit {
    font-size: 40px
  }
}

.recruitBox .landing {
  float         : right;
  width         : 700px;
  padding-top   : 20px;
  padding-bottom: 20px;
  padding-left  : calc(50/700 * 100%);
  border-left   : solid 1px rgba(230, 230, 230, 0.5)
}

.recruitBox .landing * {
  font-family: "Tinos", sans-serif;
  font-size  : 18px
}

.recruitBox .landing ul {
  padding-left: 0
}

.recruitBox .landing ul li:after {
  width                : 5px;
  height               : 5px;
  background           : #fff;
  border-radius        : 0;
  -webkit-border-radius: 0;
  -moz-border-radius   : 0;
  -o-border-radius     : 0;
  -ms-border-radius    : 0
}

.weddingBox {
  position               : relative;
  padding                : 150px 0 150px 0;
  background-image       : url(../images/bg-box-wedding.jpg);
  -webkit-background-size: auto;
  background-size        : auto
}

@media screen and (min-width: 1920px) {
  .weddingBox {
    background-size: cover
  }
}

.weddingBox .bg {
  position      : absolute;
  top           : 0;
  left          : 0;
  right         : 0;
  bottom        : 0;
  filter        : grayscale(100%);
  pointer-events: none;
  display       : none
}

.weddingBox .bg:after {
  background-color: rgba(0, 0, 0, 0.7)
}

.weddingBox .pagewrap {
  z-index: 2
}

.weddingBox .img {
  float: left;
  width: 710px;
  width: 460px
}

@media screen and (min-width: 768px) {
  .weddingBox .img {
    width: calc(460px + 250 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .weddingBox .img {
    width: 710px
  }
}

.weddingBox .img .thumb {
  display       : inline-block;
  padding-bottom: 0;
  width         : calc(217/710 * 100%);
  box-shadow    : 5px 5px 15px 0 rgba(0, 0, 0, 0.1)
}

.weddingBox .img .thumb:before {
  content       : "";
  display       : block;
  width         : 100%;
  padding-bottom: calc(470/215 * 100%)
}

.weddingBox .img .thumb:nth-child(2) {
  -webkit-transform: translateY(10%);
  -ms-transform    : translateY(10%);
  -o-transform     : translateY(10%);
  transform        : translateY(10%)
}

.weddingBox .img .thumb:last-child {
  -webkit-transform: translateY(-10%);
  -ms-transform    : translateY(-10%);
  -o-transform     : translateY(-10%);
  transform        : translateY(-10%)
}

.weddingBox .cont {
  position           : absolute;
  top                : 0;
  right              : 0;
  bottom             : 0;
  width              : 280px;
  -webkit-align-items: center;
  align-items        : center
}

@media screen and (min-width: 768px) {
  .weddingBox .cont {
    width: calc(280px + 120 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .weddingBox .cont {
    width: 400px
  }
}

.weddingBox .tit {
  display        : block;
  color          : #DCB46E;
  font-family    : "Tinos", sans-serif;
  text-transform : uppercase;
  line-height    : 1.1;
  margin-bottom  : 15px;
  text-decoration: none;
  font-size      : 25px
}

@media screen and (min-width: 768px) {
  .weddingBox .tit {
    font-size: calc(25px + 30 * (100vw - 768px) / 1152)
  }
}

@media screen and (min-width: 1920px) {
  .weddingBox .tit {
    font-size: 55px
  }
}

.weddingBox .tit:hover {
  opacity: 0.7
}

.weddingBox .tit * {
  margin: 0
}

.weddingBox p {
  font-family  : "Tinos", sans-serif;
  color        : #505050;
  text-align   : justify;
  margin-bottom: 30px;
  font-size    : 14px
}
.wrap-dichvu{
  background: #f7f3f3 url(../images/icon-flower.png) no-repeat top center;
  padding: 200px 0 50px;
}
.shadow-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0, rgba(0,0,0,0.85) 20%, rgba(0, 0, 0, 0) 100%);
  background: -moz-linear-gradient(0deg, rgba(0,0,0,1) 0, rgba(0,0,0,0.85) 20%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(0deg, rgba(0,0,0,1) 0, rgba(0,0,0,0.85) 20%, rgba(0, 0, 0, 0) 100%);
  background-position: 50% 50%;
  -webkit-background-origin: padding-box;
  background-origin: padding-box;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-background-size: auto auto;
  background-size: auto auto;
  transition: all 0.2s ease-out;
  opacity: .5;
}
.btn-dichvu {
  display: inline-block;
  padding: 8px 20px;
  font-size: 14px;
  border: 2px solid #fff;
  text-decoration: none;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.d-flex--v2{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.desc-dichvu{
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  line-height: 1.5em;
  color: #000000;
  text-align: center;
  min-height: 100px;
  margin-bottom: 20px;
}
.desc-dichvu p{
  color: #000;
}
.item-dichvu{
  width: calc(100% / 3);
  position: relative;
  padding: 15px;
}
.pic-news img{
  max-width: 100%;
  height: auto;
}
.item-dichvu a{
  overflow: hidden;
  position: relative;
}
.info-news{
  position: absolute;
  width: 100%;
  bottom: 60px;
  padding: 90px 20px 20px 20px;
  text-align: center;
  z-index: 1;
  transition: all 0.2s ease-out;
}
.name-news{
  font-weight: 400;
  font-style: normal;
  font-size: 36px;
  line-height: 1.3em;
  color: #fff;
  font-family: "Tinos", sans-serif;
  text-transform: uppercase;
  padding-bottom: 20px;
}
.btn-dichvu{
  display: inline-block;
  padding: 8px 20px;
  font-size: 14px;
  border: 2px solid #fff;
  text-decoration: none;
  color: #fff;
  transition: all 0.2s ease-out;
}
.shared-border-color{
  display: block;
  margin: 0 auto 30px auto;
  height: 0;
  width: 60px;
  border-bottom-width: 2px;
  border-bottom-style: solid;
  -webkit-transition: all .4s;
  transition: all .4s;
  border-color: #fff;
}

.item-dichvu:hover .shared-border-color{
  width: 120px;
}
.item-dichvu:hover .shadow-wrapper {
  opacity: 1;
}
.item-dichvu:hover .info-news{
  padding: 50px 20px 60px 20px;
}
@media screen and (min-width: 1024px) {
  .weddingBox p {
    font-size: calc(14px + 3 * (100vw - 1024px) / 376)
  }
}

@media screen and (min-width: 1400px) {
  .weddingBox p {
    font-size: 17px
  }
}

.weddingBox:nth-child(2n) .bg {
  display: block
}

.weddingBox:nth-child(2n) .img {
  float: right
}

.weddingBox:nth-child(2n) .cont {
  right: auto;
  left : 0
}
.weddingBox .line-left{
  margin-bottom: 30px;

}
.weddingBox:nth-child(2n) .line-left,
.weddingBox:nth-child(2n) .btn {
  color: #fff;
  margin-bottom: 30px;
}

@keyframes goDown {
  from {
    opacity   : 0;
    margin-top: -50px
  }

  to {
    opacity   : 1;
    margin-top: 0
  }
}

.goDown {
  animation-name: goDown
}

.partner {
  overflow: hidden
}

.list-partner {
  width         : calc(100% + 50px);
  font-size     : 0;
  letter-spacing: 0
}

.onePartner {
  display       : inline-block;
  vertical-align: top;
  width         : calc(50% - 50px);
  margin        : 0 50px 50px 0
}

.onePartner .img {
  display       : block;
  width         : 100%;
  padding-bottom: 100%;
  position      : relative;
  margin        : 0 0 25px 0
}

.onePartner .img:before {
  background-color: rgba(0, 0, 0, 0.5)
}

.onePartner .img:hover:before {
  background-color: rgba(0, 0, 0, 0.35)
}

.onePartner .img span {
  position               : absolute;
  top                    : 0;
  left                   : 0;
  right                  : 0;
  bottom                 : 0;
  z-index                : 2;
  -webkit-align-items    : center;
  align-items            : center;
  -webkit-justify-content: center;
  justify-content        : center
}

.onePartner .img span img {
  display   : block;
  max-width : calc(100% - 80px);
  max-height: calc(100% - 80px)
}

.onePartner .tit {
  display       : block;
  text-transform: uppercase;
  color         : #333;
  font-family   : "Tinos", sans-serif;
  margin        : 0;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .onePartner .tit {
    font-size: calc(25px + 20 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .onePartner .tit {
    font-size: 45px
  }
}

.onePartner .link {
  color          : #DFBD79;
  font-style     : italic;
  font-family    : "Tinos", sans-serif;
  display        : table;
  text-decoration: none;
  border-bottom  : solid 1px transparent;
  line-height    : 1.2;
  font-size      : 14px
}

@media screen and (min-width: 768px) {
  .onePartner .link {
    font-size: calc(14px + 6 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .onePartner .link {
    font-size: 20px
  }
}

.onePartner .link:hover {
  border-color: #666;
  color       : #666
}

.onePartner .ell {
  color      : #666;
  font-family: "Tinos", sans-serif;
  line-height: 1.4;
  margin-top : 20px;
  font-size  : 13px
}

@media screen and (min-width: 768px) {
  .onePartner .ell {
    font-size: calc(13px + 4 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .onePartner .ell {
    font-size: 17px
  }
}

.onePartner .ell:before {
  background: #999
}

.map {
  display              : block;
  position             : relative;
  z-index              : 2;
  border               : solid 10px #fff;
  border-radius        : 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius   : 5px;
  -o-border-radius     : 5px;
  -ms-border-radius    : 5px;
  height               : 250px;
  margin-bottom        : 30px
}

@media screen and (min-width: 767px) {
  .map {
    height: calc(250px + 350 * (100vw - 767px) / 683)
  }
}

@media screen and (min-width: 1450px) {
  .map {
    height: 600px
  }
}

@media screen and (min-width: 767px) {
  .map {
    margin-bottom: calc(30px + 20 * (100vw - 767px) / 683)
  }
}

@media screen and (min-width: 1450px) {
  .map {
    margin-bottom: 50px
  }
}

#map {
  position: absolute;
  top     : 0;
  left    : 0;
  width   : 100%;
  height  : 100%
}
#map iframe{
  width: 100%;
}
.custom-iw * {
  color: #fff !important
}

.custom-iw {
  width        : 300px !important;
  margin-left  : 22px !important;
  padding-right: 15px;
  background   : #DCB46E
}

.custom-iw:after {
  content         : "";
  position        : absolute;
  top             : 100%;
  left            : 50%;
  border          : solid 15px transparent;
  border-top-color: #DCB46E;
  margin-left     : -15px;
  margin-top      : -5px
}

.custom-iw .gm-style-iw {
  top          : 15px !important;
  left         : 0 !important;
  border-radius: 2px
}

.custom-iw>div:first-child>div:nth-child(2) {
  display: none
}

.custom-iw>div:first-child>div:last-child {
  left      : 0 !important;
  top       : 0px;
  box-shadow: rgba(0, 0, 0, 0.6) 0px 1px 6px;
  z-index   : -1 !important
}

.custom-iw .gm-style-iw,
.custom-iw .gm-style-iw>div,
.custom-iw .gm-style-iw>div>div {
  width    : 300px !important;
  max-width: 100% !important
}

.custom-iw>div:first-child>div:nth-child(n-1)>div>div,
.custom-iw>div>div:last-child,
.custom-iw .gm-style-iw,
.custom-iw .gm-style-iw>div,
.custom-iw .gm-style-iw>div>div {
  background-color: transparent !important
}

.custom-iw .gm-style-iw>div>div {
  padding    : 0 15px 10px 15px;
  font-weight: bold !important;
  font-size  : 15px
}

.custom-iw .gm-style-iw>div>div p {
  font-weight: 400 !important
}

.gm-style .gm-style-iw {
  overflow: visible !important
}

.custom-iw>div:last-child {
  top       : 8px !important;
  right     : 9px !important;
  height    : 13px !important;
  width     : 13px !important;
  background: url("../images/close-pop.png") no-repeat center center !important;
  opacity   : 1 !important
}

.custom-iw>div:last-child img {
  display: none
}

.localInfo {
  background  : #DCB46E !important;
  padding     : 15px;
  color       : #fff;
  line-height : 1.4;
  overflow    : auto !important;
  font-size   : 14px;
  width       : 300px;
  margin-left : auto;
  margin-right: auto;
  display     : block
}

.localInfo * {
  color      : #fff;
  font-size  : inherit;
  line-height: 1.2;
  font-size  : 13px
}

.localInfo:after {
  content         : "";
  position        : absolute;
  top             : 100%;
  left            : 50%;
  border          : solid 15px transparent;
  border-top-color: #DCB46E;
  margin-left     : -15px;
  margin-top      : -5px
}

.localInfo a {
  border-bottom  : solid 1px transparent;
  text-decoration: none !important
}

.localInfo a:hover {
  color              : #fff;
  text-decoration    : none !important;
  border-bottom-color: #fff
}

.localInfo h1,
.localInfo h2,
.localInfo h3 {
  text-transform: uppercase;
  font-size     : 15px;
  margin        : 0 0 10px 0
}

.localInfo p {
  line-height: 1.4;
  margin     : 0
}

.localInfo p+p {
  margin-top: 12px
}

.localInfo .bt {
  border-top : solid 1px #fff;
  margin     : 20px 0 0 0;
  padding-top: 15px;
  text-align : center
}

.gm-style-iw {
  font-size  : 15px;
  color      : #fff;
  font-weight: 600 !important
}

.gm-style-iw * {
  font-size  : inherit;
  font-weight: inherit
}

.gm-style-iw p {
  font-size  : 13px;
  display    : block;
  margin     : 10px 0 0 0;
  font-weight: 400 !important
}

.custom-iw .gm-style-iw>div {
  overflow     : hidden !important;
  padding-right: 20px
}

.c_tit {
  width      : 380px;
  float      : left;
  margin     : 0 0 20px 0;
  color      : #DCB46E;
  font-family: "Tinos", sans-serif;
  font-size  : 22px
}

@media screen and (min-width: 600px) {
  .c_tit {
    font-size: calc(22px + 23 * (100vw - 600px) / 850)
  }
}

@media screen and (min-width: 1450px) {
  .c_tit {
    font-size: 45px
  }
}

.c_right {
  width     : 800px;
  float     : right;
  margin-top: 10px
}

.c_right .landing {
  color        : #666;
  margin-bottom: 40px;
  font-size    : 17px
}

.c_right .landing * {
  font-family: "Tinos", sans-serif
}

.c_right .landing:after {
  content   : "";
  display   : table;
  width     : 50px;
  height    : 3px;
  background: #DCB46E;
  margin-top: 20px
}

.c_info {
  float        : left;
  width        : calc(50% - 20px);
  margin-bottom: 30px
}

.c_info * {
  font-family: "Tinos", sans-serif
}

.c_info p {
  color      : #666;
  font-size  : 13px;
  margin     : 0;
  line-height: 1.4;
  font-size  : 16px
}

@media screen and (min-width: 420px) {
  .c_info p {
    font-size: calc(13px + 2 * (100vw - 420px) / 1030)
  }
}

@media screen and (min-width: 1450px) {
  .c_info p {
    font-size: 15px
  }
}

.c_info p strong {
  font-size    : 16px;
  display      : block;
  margin-bottom: 20px;
  color        : #000
}

@media screen and (min-width: 600px) {
  .c_info p strong {
    font-size: calc(16px + 4 * (100vw - 600px) / 850)
  }
}

@media screen and (min-width: 1450px) {
  .c_info p strong {
    font-size: 20px
  }
}

.c_info p a {
  color: #000
}

.c_info p a:hover {
  color          : #DCB46E;
  text-decoration: underline
}

.c_info p+p {
  margin-top: 20px
}

.c_info.right {
  float: right
}

.c_info.right p+p {
  margin-top: 5px
}

.c_cont {
  margin-bottom: 20px
}

.page-contact {
  position   : relative;
  padding-top: 100px;
  padding-top: 50px
}

@media screen and (min-width: 1024px) {
  .page-contact {
    padding-top: calc(50px + 50 * (100vw - 1024px) / 376)
  }
}

@media screen and (min-width: 1400px) {
  .page-contact {
    padding-top: 100px
  }
}

.page-contact:before {
  content   : "";
  display   : block;
  position  : absolute;
  top       : 0;
  left      : 0;
  right     : 0;
  height    : 400px;
  background: #F0F0F0
}

.page-contact .pagewrap {
  z-index: 2
}

.page-contact .formStyle .btn {
  margin-right       : 0;
  width              : 180px;
  border             : solid 2px #DCB46E;
  border-bottom-width: 5px !important;
  font-size          : 14px;
  color              : #000;
  font-weight        : 900;
  letter-spacing     : 1px
}

.page-contact .formStyle .btn:after {
  display: none
}

.page-contact .formStyle .btn:before {
  height    : 4px;
  width     : 28px;
  left      : 0;
  top       : 0;
  bottom    : 0;
  margin    : auto;
  right     : auto;
  border    : none !important;
  background: #DCB46E
}

.page-contact .formStyle .form-group {
  margin-bottom: 25px
}

.fw-black {
  font-weight: 900
}

.page-menu {
  position   : relative;
  padding-top: 100px
}

.page-menu:before {
  content   : "";
  display   : block;
  position  : absolute;
  top       : 0;
  left      : 0;
  right     : 0;
  height    : 500px;
  background: #F0F0F0
}

.page-menu .pagewrap {
  min-height: 300px
}

.boxMenu {
  margin-bottom: 50px
}

@media screen and (min-width: 768px) {
  .boxMenu {
    margin-bottom: calc(50px + 50 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .boxMenu {
    margin-bottom: 100px
  }
}

.boxMenu>.text {
  float      : left;
  width      : 350px;
  padding-top: 45px
}

.boxMenu>.text .tit {
  display       : block;
  margin        : 0 0 20px 0;
  text-transform: uppercase;
  color         : #DCB46E;
  font-weight   : 900;
  font-size     : 13px
}

@media screen and (min-width: 768px) {
  .boxMenu>.text .tit {
    font-size: calc(13px + 2 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .boxMenu>.text .tit {
    font-size: 15px
  }
}

.boxMenu>.text .tit span {
  font-family  : "Tinos", sans-serif;
  color        : inherit;
  display      : block;
  margin-bottom: 10px;
  font-size    : 25px
}

@media screen and (min-width: 768px) {
  .boxMenu>.text .tit span {
    font-size: calc(25px + 20 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .boxMenu>.text .tit span {
    font-size: 45px
  }
}

.boxMenu>.text p {
  text-align : justify;
  font-family: "Tinos", sans-serif;
  color      : #555;
  font-size  : 15px
}

@media screen and (min-width: 768px) {
  .boxMenu>.text p {
    font-size: calc(15px + 2 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .boxMenu>.text p {
    font-size: 17px
  }
}

.slideMenu {
  float     : right;
  width     : 800px;
  background: #fff;
  box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.1)
}

.slideMenu .owl-dots {
  counter-reset: dots;
  position     : absolute;
  bottom       : 45px;
  right        : calc(50% + 45px)
}

.slideMenu .owl-dot {
  float      : left;
  width      : 30px;
  height     : 30px;
  line-height: 28px;
  border     : solid 1px #ccc;
  font-family: "Tinos", sans-serif;
  color      : #777;
  font-size  : 18px;
  text-align : center;
  margin-left: 10px;
  font-weight: bold
}

@media screen and (max-width: 768px) {
  .slideMenu .owl-dot {
    font-size: 15px
  }
}

.slideMenu .owl-dot.active {
  border-color: #DCB46E;
  background  : #DCB46E;
  color       : #fff
}

.slideMenu .owl-dot:before {
  counter-increment: dots;
  content          : counter(dots);
  color            : inherit;
  font-size        : inherit;
  font-family      : inherit
}

.itemMenu {
  display : block;
  width   : 100%;
  position: relative
}

.itemMenu .desc {
  float     : left;
  width     : 50%;
  padding   : 40px 45px 100px 45px;
  min-height: 550px
}

.itemMenu .desc ul {
  padding: 0 10px 0 0
}

.itemMenu .desc ul li {
  display     : block;
  list-style  : none;
  padding-left: 25px;
  position    : relative;
  font-size   : 18px;
  color       : #777;
  font-family : "Tinos", sans-serif;
  margin      : 0;
  line-height : 1.4;
  cursor      : pointer
}

.itemMenu .desc ul li:hover {
  color: #333
}

@media screen and (max-width: 768px) {
  .itemMenu .desc ul li {
    font-size: 15px
  }
}

.itemMenu .desc ul li:before {
  content   : "";
  position  : absolute;
  top       : 11px;
  left      : 0;
  width     : 0;
  height    : 2px;
  background: #DCB46E
}

.itemMenu .desc ul li.active {
  color      : #DCB46E;
  font-weight: bold
}

.itemMenu .desc ul li.active:before {
  width: 15px
}

.itemMenu .desc ul li+li {
  margin-top: 10px
}

.itemMenu .tit {
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  font-weight   : bold;
  text-transform: uppercase;
  margin        : 0 0 20px 0;
  font-size     : 20px
}

@media screen and (min-width: 768px) {
  .itemMenu .tit {
    font-size: calc(20px + 6 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .itemMenu .tit {
    font-size: 26px
  }
}

.itemMenu .img {
  position: absolute;
  top     : 0;
  right   : 0;
  bottom  : 0;
  width   : 50%;
  display : none
}

.itemMenu .img.active {
  display: block
}

.itemMenu .menu-btn {
  padding-left: 25px
}

.itemMenu .menu-btn .btn {
  margin: 0
}

.itemMenu .scrollPane {
  max-height   : 250px;
  overflow     : hidden;
  margin-bottom: 50px
}

.titBox {
  display: block
}

.titBox.center {
  text-align: center
}

.titBox .tit {
  display       : block;
  margin        : 0;
  text-transform: uppercase;
  color         : #DCB46E;
  font-family   : "Tinos", sans-serif;
  font-weight   : normal;
  font-size     : 25px
}

@media screen and (min-width: 768px) {
  .titBox .tit {
    font-size: calc(25px + 20 * (100vw - 768px) / 432)
  }
}

@media screen and (min-width: 1200px) {
  .titBox .tit {
    font-size: 45px
  }
}

.titBox .desc {
  display: block;
  margin : 10px 0 0 0
}

.titBox .mb {
  margin-bottom: 20px
}

.list-gal-view {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.list-gal-view .item {
  /* float   : left; */
  /* margin  : 0 20px 20px 0; */
  position: relative;
  z-index : 1;
  width: calc(50% - 15px);
  margin-bottom: 30px;
}

.list-gal-view .item:after {
  background-color: rgba(0, 0, 0, 0.2);
  pointer-events  : none
}

.list-gal-view .item:before {
  content : "";
  position: absolute;
  top     : 5px;
  left    : 5px;
  right   : 5px;
  bottom  : 0;
  z-index : -1
}

.list-gal-view .item img {
  display: block;
  width  : auto;
  height : 100%;
  max-width: 100%;
}

.list-gal-view .item:hover:before {
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2)
}

.list-gal-view .item .title {
  position   : absolute;
  left       : 0;
  bottom     : 0;
  right      : 0;
  font-family: "Tinos", sans-serif;
  color      : #fff;
  margin     : 0;
  font-size  : 18px;
  padding    : 30px 20px 15px 20px;
  background : -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%);
  background : -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%);
  background : -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%);
  background : -ms-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%);
  background : linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%);
  font-weight: 400
}

.list-gal-view .item:hover .title {
  padding-top: 100px
}

body .vcx-gallery>.title {
  left       : 0;
  bottom     : 0;
  right      : 0;
  top        : auto;
  padding    : 10px;
  font-weight: 500;
  text-align : center;
  font-size  : 18px;
  margin     : 0;
  color      : #000;
  font-family: "Times New Roman", Times, Baskerville, Georgia, serif
}

.oneNews,
.oneGal,
.oneVideo {
  display       : inline-block;
  vertical-align: top;
  width         : calc(33.3333% - 35px);
  margin        : 0 35px 35px 0;
  list-style    : none;
  padding       : 0;
  position      : relative
}

.oneNews .thumb,
.oneGal .thumb,
.oneVideo .thumb {
  position      : relative;
  padding-bottom: 66.6666%;
  z-index       : 2;
  display       : block
}

.oneNews .thumb:after,
.oneGal .thumb:after,
.oneVideo .thumb:after {
  content    : "\f12e";
  color      : #fff;
  position   : absolute;
  right      : 20px;
  bottom     : 20px;
  z-index    : 1;
  font-family: "Ionicons";
  font-size  : 35px;
  width      : 30px;
  text-align : center;
  line-height: 30px;
  opacity    : 0
}

.oneNews .thumb:hover:after,
.oneGal .thumb:hover:after,
.oneVideo .thumb:hover:after {
  opacity: 1
}

.oneNews .thumb:hover+ul .tit,
.oneGal .thumb:hover+ul .tit,
.oneVideo .thumb:hover+ul .tit {
  color: #DCB46E
}

.oneNews .tit,
.oneGal .tit,
.oneVideo .tit {
  display        : block;
  margin-bottom  : 15px;
  line-height    : 1.2em;
  text-decoration: none;
  color          : #333;
  font-size      : 20px;
  font-weight    : bold;
  overflow       : hidden;
  font-family    : "Tinos", sans-serif;
  text-transform : uppercase
}

.oneNews .tit:hover,
.oneGal .tit:hover,
.oneVideo .tit:hover {
  color: #DCB46E
}

.oneNews ul,
.oneGal ul,
.oneVideo ul {
  padding   : 25px;
  background: #F2F2F2;
  margin    : 0
}

.oneNews p,
.oneGal p,
.oneVideo p {
  display    : block;
  font-size  : 17px;
  margin     : 0;
  color      : #595959;
  line-height: 1.4em;
  overflow   : hidden;
  max-height : 70px;
  font-weight: 400;
  font-family: "Tinos", sans-serif
}

@media screen and (max-width: 768px) {

  .oneNews p,
  .oneGal p,
  .oneVideo p {
    font-size: 14px
  }
}

.oneNews .line-left,
.oneGal .line-left,
.oneVideo .line-left {
  padding-left: 30px
}

.oneNews .line-left:before,
.oneGal .line-left:before,
.oneVideo .line-left:before {
  height    : 2px;
  width     : 20px;
  background: #828282
}

.oneGal .thumb,
.oneVideo .thumb {
  border       : solid 10px #fff;
  box-shadow   : 0 5px 20px 0 rgba(0, 0, 0, 0.2);
  margin-bottom: 17px
}

.oneGal .thumb:after,
.oneVideo .thumb:after {
  content  : "\f148";
  opacity  : 1;
  font-size: 40px
}

.oneGal .tit,
.oneVideo .tit {
  line-height  : 1.3;
  margin-bottom: 0;
  padding-left : 30px;
  position     : relative
}

.oneGal .tit:before,
.oneVideo .tit:before {
  content   : "";
  position  : absolute;
  left      : 0;
  top       : 12px;
  height    : 2px;
  width     : 20px;
  background: #888
}

.oneGal .thumb:hover+.tit,
.oneVideo .thumb:hover+.tit {
  color: #DCB46E
}

.oneGal .thumb:hover+.tit:before,
.oneVideo .thumb:hover+.tit:before {
  background: #DCB46E
}

.oneVideo .thumb:after {
  content    : "\f488";
  right      : 0;
  bottom     : 0;
  left       : 0;
  top        : 0;
  margin     : auto;
  width      : 65px;
  height     : 65px;
  line-height: 60px;
  text-align : center;
  border     : solid 2px #fff;
  font-size  : 40px;
  text-indent: 4px
}

.owl-item .oneNews,
.owl-item .oneGal,
.owl-item .oneVideo {
  display: block;
  width  : 100%;
  margin : 0;
  opacity: 0
}

.owl-item.active .oneNews,
.owl-item.active .oneGal,
.owl-item.active .oneVideo {
  opacity: 1
}

.owl-item .oneGal .thumb {
  border-color: #eee
}

.page-services-view {
  background             : url("../images/bg-ser-view.jpg") no-repeat center center #F0F0F0;
  -webkit-background-size: auto;
  background-size        : auto;
  padding-top            : 50px;
  padding-bottom         : 50px
}

@media screen and (min-width: 1920px) {
  .page-services-view {
    background-size: cover
  }
}

@media screen and (min-width: 768px) {
  .page-services-view {
    padding-top: calc(50px + 50 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .page-services-view {
    padding-top: 100px
  }
}

@media screen and (min-width: 768px) {
  .page-services-view {
    padding-bottom: calc(50px + 50 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .page-services-view {
    padding-bottom: 100px
  }
}

.page-services-view .titBox {
  margin-bottom: 20px
}

.page-services-view .landing.line-left {
  margin-bottom: 50px
}

.serMenu {
  width     : 250px;
  float     : left;
  text-align: center
}

.serMenu .btn {
  display    : block;
  font-size  : 20px;
  font-family: "Tinos", sans-serif;
  font-weight: normal;
  white-space: normal;
  height     : auto;
  line-height: 1.4;
  padding    : 10px 20px !important
}

.serDetail {
  float: right;
  width: calc(100% - 300px)
}

.serSlider .item>img {
  display      : block;
  width        : 100%;
  height       : auto;
  margin-bottom: 25px
}

.serSlider .dots-out .owl-dots {
  margin-top: 25px
}

.serSlider .dots-out .owl-dot {
  background  : #ccc;
  border-color: #ccc
}

.serSlider .dots-out .owl-dot.active {
  background: #DCB46E
}

.page-other-services {
  padding-bottom: 20px
}
.bt-promotion {
  background: #fff;
}
.title-global {
  text-align: center;
}
.title-global span {
  font-size: calc(25px + 30 * (100vw - 768px) / 1152);
  display: inline-block;
  color: #DCB46E;
  font-family: "Tinos", sans-serif;
  text-transform: uppercase;
  line-height: 1.1;
  margin-bottom: 15px;
  text-decoration: none;
  border-bottom: 2px solid;
}
#footer-map {
  position: relative;
  padding-bottom: 40%;
}
#footer-map iframe {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#fanpage-facebook {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  .page-other-services {
    padding-bottom: calc(20px + 40 * (100vw - 768px) / 598)
  }
}

@media screen and (min-width: 1366px) {
  .page-other-services {
    padding-bottom: 60px
  }
}

.oneNews.ser .tit {
  align-items    : center;
  justify-content: center;
  border-bottom  : solid 2px #DCB46E;
  padding        : 10px 0;
  text-align     : center;
  min-height     : 70px;
  font-size      : 18px;
  line-height    : 1.3
}

.oneNews.ser .thumb:hover+.tit {
  color: #DCB46E
}

.page-promotion {
  padding-bottom: 60px
}

.page-promotion .pagewrap {
  padding-top: 50px
}

.loadMorePro {
  margin-bottom: 40px
}

.sendPrice {
  width    : 800px;
  padding  : 10px;
  max-width: calc(100vw - 80px)
}

.sendPrice .titBox {
  margin-bottom: 20px
}

.sendPrice .titBox .tit {
  font-size  : 30px;
  font-weight: bold
}

.sendPrice .btn {
  width : 180px;
  margin: 0 !important
}

.sendPrice .form-control {
  margin-bottom: 20px
}

@media screen and (max-width: 1200px) {

  .landing h1,
  .landing .h1 {
    font-size: 28px
  }

  .landing h2,
  .landing .h2 {
    font-size: 25px
  }

  .landing h3,
  .landing .h3 {
    font-size: 23px
  }

  .landing h4,
  .landing .h4 {
    font-size: 20px
  }

  .landing h5,
  .landing .h5 {
    font-size: 17px
  }

  .landing h6,
  .landing .h6 {
    font-size: 14px
  }

  header {
    height: 55px
  }

  .topBtn {
    line-height: 55px
  }

  .topBtn .bt {
    line-height: inherit;
    padding    : 0 20px
  }

  .topLink {
    line-height: 55px;
    right      : 20px
  }

  .banner .pagewrap {
    top   : auto;
    bottom: 50px
  }

  .banner .owl-dots {
    bottom: 25px
  }

  header.fixed .logo {
    display: none
  }

  header.fixed .openMenu {
    height: 54px
  }

  .banner.active {
    height: auto
  }

  .banner.active .item {
    height        : auto;
    padding-bottom: 66.6666%
  }

  .aboutTop {
    padding: 50px 20px
  }

  .aboutTop .text {
    width  : auto;
    padding: 20px 0 0 25px
  }

  .counterBox .about-titbox {
    margin-bottom: 100px
  }

  .counterMain .item {
    width : 230px;
    height: 240px
  }

  .homeSer .inside-tit {
    padding  : 45px 0 15px 0;
    font-size: 20px
  }

  .aboutGalMain {
    padding-left : 20px;
    padding-right: 20px;
    display      : block
  }

  .aboutGalLeft {
    width        : 100%;
    padding-right: 0
  }

  .aboutGalLeft .wrap {
    width: auto;
    float: none
  }

  .aboutGalRight {
    width : 100%;
    height: auto
  }

  .aboutGal_next,
  .aboutGal_prev {
    display: none
  }

  .aboutGalRight .dots .owl-dots {
    right : auto;
    left  : 0;
    bottom: auto;
    top   : -45px
  }

  .aboutSer .about-titbox,
  .aboutPromotion .about-titbox {
    padding-bottom: 40px
  }

  .aboutSer .about-titbox .desc:after,
  .aboutPromotion .about-titbox .desc:after {
    margin-top: 10px
  }

  .itemGalSlide .thumb {
    height        : auto;
    padding-bottom: 66.6666%
  }

  .itemGalSlide p {
    padding-left: 0
  }

  .itemGalSlide p:before {
    display: none
  }

  .itemGalSlide .desc {
    padding: 20px 20px 15px 20px
  }

  .list {
    width: calc(100% + 20px)
  }

  .oneNews,
  .oneGal,
  .oneVideo {
    width : calc(33.3333% - 20px);
    margin: 0 20px 25px 0
  }

  .oneNews ul,
  .oneGal ul,
  .oneVideo ul {
    padding: 20px
  }

  .oneNews .tit,
  .oneGal .tit,
  .oneVideo .tit {
    font-size: 16px
  }

  .oneEvent .thumb>.desc {
    width    : auto;
    left     : 0;
    padding  : 0 20px;
    max-width: unset
  }

  .list-partner {
    width: calc(100% + 20px)
  }

  .onePartner {
    width : calc(33.3333% - 20px);
    margin: 0 20px 25px 0
  }

  .onePartner .tit {
    font-size: 25px
  }

  .conference .aboutTop .desc {
    width        : 50%;
    padding-left : 20px;
    padding-right: 20px;
    box-sizing   : border-box
  }

  .conference .aboutTop .desc .text {
    padding-left : 0 !important;
    padding-right: 0 !important
  }

  .conference .aboutTop:nth-child(2n) .desc {
    margin-left: 0;
    float      : left;
    left       : 0
  }

  .conference .aboutTop p {
    margin-bottom: 0
  }

  .page-promotion .proSlider .pagewrap {
    padding-top: 0
  }

  .page-menu {
    padding-top: 50px
  }

  .boxMenu>.text {
    width        : 100%;
    padding-top  : 0;
    margin-bottom: 20px
  }

  .slideMenu {
    width: 100%
  }

  .page-contact:before {
    display: none
  }

  .map {
    border       : none;
    border-radius: 0
  }

  .c_tit,
  .c_right {
    width: 100%
  }
}

@media screen and (max-width: 1023px) {
  .itemMenu .desc {
    padding   : 30px 20px;
    min-height: 480px
  }

  .slideMenu .owl-dots {
    bottom: 25px;
    right : calc(50% + 20px)
  }

  .conference {
    padding: 25px 20px 0 20px
  }

  .conference .aboutTop {
    margin-bottom: 25px
  }

  .conference .aboutTop .desc {
    position      : relative;
    width         : 100%;
    left          : 0 !important;
    padding-top   : 20px;
    padding-bottom: 20px
  }

  .conference .aboutTop:before {
    left : 0 !important;
    right: 0 !important;
    width: 100%
  }

  .img-link {
    width: 100%
  }

  .img-link:before {
    -webkit-background-size: 80px;
    background-size        : 80px
  }

  .aboutTop .desc {
    width: 100%
  }

  .aboutTop .desc .text {
    padding-left: 0
  }

  .onePartner {
    width: calc(50% - 20px)
  }

  .serMenu {
    width                  : 100%;
    display                : -webkit-box;
    display                : -webkit-flex;
    display                : -ms-flexbox;
    display                : flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack          : space-between;
    justify-content        : space-between;
    flex-wrap              : wrap;
    margin-bottom          : 25px
  }

  .serMenu .btn {
    width    : calc(33.3333% - 7px);
    font-size: 15px
  }

  .serDetail {
    width: 100%
  }

  .list-search-result .item .img+ul {
    padding: 10px 0 0 0;
    width  : calc(100% - 290px)
  }

  .list-search-result .item .tit {
    font-size: 15px
  }

  .list-search-result .item p {
    font-size  : 13px;
    line-height: 1.4
  }

  .list-search-result .item .img img {
    max-width: 260px
  }

  .landing .column-2 {
    column-count: 1;
    column-gap  : 0
  }

  .landing h1,
  .landing .h1 {
    font-size: 26px
  }

  .landing h2,
  .landing .h2 {
    font-size: 23px
  }

  .landing h3,
  .landing .h3 {
    font-size: 20px
  }

  .landing h4,
  .landing .h4 {
    font-size: 17px
  }

  .landing h5,
  .landing .h5 {
    font-size: 16px
  }

  .landing h6,
  .landing .h6 {
    font-size: 13px
  }

  .banner .item {
    height        : auto;
    padding-bottom: calc(1200/1920 * 100%)
  }

  .banner {
    height: auto
  }

  .bannerDesc {
    width: 500px
  }

  .counterMain .item {
    width : 160px;
    height: 166px
  }

  .weddingBox .img {
    width: 50%
  }

  .weddingBox .img .thumb {
    width: calc(50% - 10px)
  }

  .weddingBox .img .thumb:nth-child(3) {
    display: none
  }

  .weddingBox {
    padding: 50px 0 90px 0
  }

  .weddingBox .cont {
    width      : calc(50% - 25px);
    padding-top: 30px
  }

  .weddingBox p {
    margin-bottom: 20px;
    padding-left : 0
  }

  .weddingBox p:before {
    display: none
  }

  .oneNews,
  .oneVideo,
  .oneGal {
    width: calc(50% - 20px)
  }

  .oneRecruit {
    padding      : 0 20px;
    margin-bottom: 30px
  }

  .oneRecruit .thumb {
    margin-bottom: 15px
  }

  .oneRecruit .thumb:after {
    display: none
  }

  .oneRecruit .desc {
    display  : block;
    position : relative;
    width    : auto;
    left     : 0 !important;
    right    : 0 !important;
    max-width: 100%;
    padding  : 0 !important;
    color    : #333
  }

  .oneRecruit .btn {
    color       : #666 !important;
    border-color: #666 !important;
    margin      : 15px 0 0 0
  }

  .oneRecruit .btn:before,
  .oneRecruit .btn:after {
    border-color: #666 !important
  }

  .page-news-view .offset-md-0 {
    padding-left : 0;
    padding-right: 0
  }
}

@media screen and (max-width: 767px) {
  .d-flex--v2{
    display: block;
  }
  .item-dichvu {
    width: 100%;
    position: relative;
    padding: 15px;
  }
  .desc-dichvu {
    font-size: 18px;
  }
  .name-news {
    font-size: 22px;
  }
  .c_tit {
    margin-bottom: 10px
  }

  .c_info {
    width: 100%
  }

  .boxMenu {
    margin-bottom: 80px
  }

  .page-menu:before {
    height: 290px
  }

  .itemMenu .scrollPane {
    max-height   : unset;
    margin-bottom: 20px
  }

  .itemMenu .desc {
    min-height: unset;
    width     : 100%;
    float     : none;
    display   : block
  }

  .itemMenu .img {
    width         : 100%;
    position      : relative;
    padding-bottom: 66.6666%;
    bottom        : auto
  }

  .slideMenu .owl-dots {
    bottom    : -45px;
    right     : 0;
    left      : 0;
    text-align: center
  }

  .slideMenu .owl-dots .owl-dot {
    display: inline-block;
    float  : none;
    margin : 0 5px
  }

  .page-services-view {
    background: #f5f5f5
  }

  .serMenu .btn {
    font-size: 14px
  }

  .homeSer_slide img {
    opacity: .7 !important
  }

  .counterBox .about-titbox {
    margin-bottom: 25px
  }

  .counterMain .item:before,
  .counterMain .item:after {
    display: none !important
  }

  .counterMain {
    display: block
  }

  .counterMain .item {
    float            : none;
    display          : block;
    width            : 200px;
    height           : 210px;
    -webkit-animation: none;
    -moz-animation   : none;
    animation        : none;
    margin           : 15px auto !important
  }

  .counterMain .item:before {
    all           : unset !important;
    content       : "" !important;
    display       : inline-block !important;
    vertical-align: middle !important;
    height        : 100% !important
  }

  .counterMain .item li {
    display       : inline-block;
    vertical-align: middle
  }

  .aboutTop .tit {
    font-size: 22px
  }

  .serMenu .btn {
    width: calc(50% - 7px)
  }

  .about-titbox .tit {
    font-size: 25px
  }

  .about-titbox .desc {
    font-size: 14px
  }

  .oneEvent .thumb {
    width: 100%
  }

  .oneEvent .right.thumb {
    width         : 100%;
    padding-bottom: 0;
    background    : #fff !important
  }

  .oneEvent .right.thumb:before {
    padding-bottom: 0
  }

  .oneEvent .right.thumb:after {
    display: none
  }

  .oneEvent .right.thumb .desc {
    position: relative;
    color   : #333;
    padding : 15px 20px 30px 20px
  }

  .oneEvent .right.thumb .desc .tit-sub {
    margin-bottom: 10px
  }

  .weddingBox {
    padding-bottom: 35px
  }

  .weddingBox .img,
  .weddingBox .cont {
    width: 100%
  }

  .weddingBox .img {
    float: none
  }

  .weddingBox .img .thumb {
    width: calc(33.3333% - 8px)
  }

  .weddingBox .cont {
    position   : relative;
    bottom     : unset;
    padding-top: 50px
  }

  .weddingBox .img .thumb:nth-child(3) {
    display: block
  }

  .loadMoreEvent {
    margin: 20px auto 50px auto !important
  }

  .bannerDesc .desc {
    padding-left: 0
  }

  .bannerDesc .desc:before {
    display: none
  }

  .bannerDesc .desc p {
    max-height: 50px
  }

  .bannerDesc .desc .btn-main.btn-lg {
    padding            : 0;
    border-top         : none !important;
    height             : auto !important;
    line-height        : unset !important;
    padding            : 0 0 5px 0 !important;
    min-width          : unset;
    border-bottom-width: 1px !important
  }

  .bannerDesc .desc .btn-main.btn-lg:before,
  .bannerDesc .desc .btn-main.btn-lg:after {
    display: none
  }

  .list-search-result .item .img+ul {
    width: calc(100% - 120px)
  }

  .list-search-result .item .img+ul p {
    display: none
  }

  .list-search-result .item ul {
    padding-top: 0
  }

  .list-search-result .item .img img {
    max-width: 100px
  }

  .list-search-result .item .tit {
    font-size: 14px
  }

  .banner .item {
    padding-bottom: calc(500/600 * 100%)
  }

  .homeAbout {
    padding: 30px 0 25px 0
  }

  .homeAbout .text,
  .homeAbout .img {
    width: 100%
  }

  .homeAbout .img {
    margin-bottom: 20px
  }

  .topBtn .btnBook {
    display: none
  }

  .topLink .ev {
    display: none
  }

  .menuLeftMain {
    z-index: 110
  }

  .menuCont {
    padding-top   : 170px;
    padding-bottom: 75px
  }

  .menuInfo {
    position: unset;
    z-index : unset;
    width   : 100%
  }

  .menuInfo *,
  .menuInfo .tit {
    display: none
  }

  .menuInfo .menuLogo {
    position: absolute;
    top     : 70px;
    left    : 0;
    display : block !important;
    z-index : 10;
    margin  : 0 auto;
    right   : 0;
    width   : 180px
  }

  .menuLeft {
    width    : 100%;
    max-width: 100%
  }

  .menuLeft>ul>li>a {
    line-height: 32px;
    font-size  : 20px
  }

  .menuLeft>ul>li>ul>li>ul {
    margin-bottom: 10px
  }

  .menuLeft>ul>li>ul>li>a {
    font-size  : 18px;
    line-height: 34px
  }

  .menuLeft>ul>li.hide {
    display: block
  }

  .menuInfo .menuBook {
    width: 160px
  }

  .menuHor>li+li {
    margin-left: 0
  }

  .menuHor {
    right                  : 0;
    bottom                 : 28px;
    display                : -webkit-box;
    display                : -webkit-flex;
    display                : -ms-flexbox;
    display                : flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack          : space-between;
    justify-content        : space-between
  }

  .menuHor:after {
    display: none
  }

  .menuHor .show {
    display: none
  }

  .line-tit {
    padding-left: 35px;
    line-height : 1.4
  }

  .line-tit:before {
    width : 20px;
    height: 3px;
    top   : 7px
  }

  .fooNav {
    display: none
  }

  footer {
    padding: 25px 0
  }

  .oneNews,
  .oneVideo,
  .oneGal,
  .onePartner {
    width: calc(100% - 20px)
  }

  .uSlide {
    width    : 100%;
    max-width: 100% !important;
    display  : block;
    position : relative
  }

  .homeSer_slide .tit-wrap {
    height: auto;
    left  : 0 !important;
    right : 0 !important;
    width : auto !important;
    top   : auto;
    bottom: 0
  }

  .itemGalSlide .desc {
    position  : relative;
    width     : 100%;
    max-width : unset;
    background: #f5f5f5
  }
}

@media screen and (max-width: 359px) {
  .serMenu .btn {
    width: 100%
  }
}