/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;400;700&display=swap');*/

/*@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,600&family=Montserrat:wght@500;600;700;900&family=PT+Sans:wght@400;700&display=swap');*/

/*@import url("./reset.css");*/

/*@font-face { font-family: "DM Sans"; src: url("./fonts/DMSans-Regular.woff2") format("woff2"), url("./fonts/DMSans-Regular.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; }*/

/*@font-face { font-family: "DM Sans"; src: url("./fonts/DMSans-Bold.woff2") format("woff2"), url("./fonts/DMSans-Bold.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap; }*/

body { font-family: var(--font-family); font-size: .7rem; line-height: 1.8; color: var(--normal); }
hr { --bs: 2px; margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: var(--bs) solid var(--lightgray); }
hr.min { --bs: 1px; }
hr.with-line { margin: 0; border: 0; }
hr.with-line::before { display: block; width: 3.6rem; height: .5rem; content: ""; background-color: var(--primary); }
hr.with-line.light::before { background-color: var(--light); }
hr.with-line.xs::before { width: 1.6rem; height: .2rem; }
.ff-en { font-family: "Arial", var(--font-family); }
.left-pad { padding-left: var(--left-pad); }
.frame-full, .frame-wide, .frame-middle, .frame-narrow { position: relative; width: 100%; width: auto; padding-right: var(--page-pad); padding-left: var(--page-pad); margin-right: auto; margin-left: auto; }

@media screen and (min-width:1200px) {
  .frame-middle { max-width: 1100px; padding-right: 0; padding-left: 0; }
  .frame-wide { max-width: 1180px; padding-right: 0; padding-left: 0; }
}
@media screen and (min-width:1280px) {
  .frame-middle { max-width: 1160px; }
  .frame-wide { max-width: 1200px; } 
}
@media screen and (min-width:1440px) {
  .frame-narrow { max-width: 1000px; padding-right: 0; padding-left: 0; }
  .frame-middle { max-width: 1200px; }
  .frame-wide { max-width: 1300px; padding-right: 0; padding-left: 0; }
}
@media screen and (min-width:1600px) {
  .frame-narrow { max-width: 1100px; }
  .frame-middle { max-width: 1500px; }
  .frame-wide { max-width: 1500px; }
}
@media screen and (min-width:1900px) {
  .frame-narrow { max-width: 1200px; }
  .frame-middle { max-width: 1500px; }
  .frame-wide { max-width: 1650px; }
}
@media screen and (min-width:2200px) {
  .frame-narrow { max-width: 1400px; }
  .frame-middle { max-width: 1800px; }
  .frame-wide { max-width: 2000px; }
}
body { overflow-x: hidden; color: var(--normal); background-color: white; }
main { width: 100%; margin: 0; }
main:after { display: table; clear: both; content: ""; }
.menu-mask { position: fixed; top: 0; left: 99999999rem; z-index: 20; display: block; width: 100%; height: 100%; content: ""; pointer-events: none; opacity: .7; background-color: rgb(0, 0, 0); }

.top-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 990; display: flex; height: var(--top-nav); transition: transform .25s, height .25s; background-color: rgba(255, 255, 255, 1); box-shadow: 0 5px 10px rgba(0, 0, 0, .025); justify-content: space-between; }
.top-nav .row-nav { width: 100%; }
.main-nav-bar, .top-nav-menu, .tnm-con, .tnm-con dl, .tnm-con dt { height: 100%; }
.main-nav-bar { align-items: center; flex-grow: 1; justify-content: flex-end; }
.main-nav-bar .top-row { display: flex; padding-right: 2rem; align-items: center; justify-content: flex-end; }
.top-nav-menu { z-index: 8; width: var(--w); line-height: 1.5rem; --px: .75rem; --w: 66%; }
.top-nav-logo { z-index: 9; display: flex; height: var(--h); --h: 2rem; align-items: center; flex-shrink: 0; }
.top-nav-logo h1 { display: block; width: 100%; height: 100%; transition: height .25s linear; }
.top-nav-logo h1 a { display: block; height: 100%; transition: none; }
.top-nav-logo img, .top-nav-logo svg { height: 100%; transition: all .25s; vertical-align: top; }
.top-nav-logo .logo-white { opacity: 0; }
.top-nav-logo .logo-color { position: absolute; top: 0; left: 0; width: 100%; height: auto; opacity: 1; }
.top-nav-menu dt { z-index: 11; text-align: center; }
.top-nav-menu dt a { position: relative; z-index: 3; display: block; display: flex; height: 100%; padding-right: var(--px); padding-left: var(--px); font-size: .9rem; line-height: 1.5rem; transition: color .25s ease; white-space: nowrap; color: var(--normal); align-items: center; }
.top-nav-menu dt a>em { line-height: 2.5; }
.top-nav-menu dt a::after { position: absolute; bottom: 0; left: var(--px); width: calc(100% - var(--px) * 2); height: 3px; content: ""; transition: transform .35s ease; transform: scaleX(0); transform-origin: right; background-color: var(--primary); }
.top-nav-menu dl.active dt a, .top-nav-menu dt a:hover { color: var(--link); }
.top-nav-menu dl.active dt a::after, .top-nav-menu dt a:hover::after { transform: scaleX(1); transform-origin: left; opacity: 1; }
.tnmc-fit { display: none; }
[data-view="desktop"] .top-nav-menu { transition: all .25s ease }
[data-view="desktop"] .top-nav-menu dl:hover .top-sub-menu, [data-view="desktop"] .top-nav-menu dl:hover:after { pointer-events: initial; opacity: 1; }
[data-view="desktop"] .tnmc-fit { display: block; height: 0; overflow: hidden; }
[data-view="desktop"] .tnmc-item { position: absolute; top: 0; left: 0; display: flex; width: 100%; height: 100%; transition: opacity .25s ease; align-items: center; justify-content: center; }
[data-view="desktop"] .tnmci-sub { z-index: 2; visibility: hidden; opacity: 0; }
.top-nav-menu dl.active dt a { font-weight: bold; color: var(--primary); }
.top-nav-menu dl.active dt a>em:after { left: 0; width: 100%; transition: width .5s; }
.top-nav-menu dl:last-child dt { padding-right: 0; }
.top-sub-menu { position: absolute; top: auto; left: 0; z-index: 2; width: calc(100% + var(--px) * 2 - 0rem); padding-top: .25rem; padding-bottom: .25rem; margin-right: calc(-1 * var(--px) + 0rem); margin-left: calc(-1 * var(--px) + 0rem); transition: all .25s linear; pointer-events: none; opacity: 0; background-color: rgba(255, 255, 255, 1); }
.top-sub-menu a { display: block; padding: .65rem 1rem; font-size: .85rem; transition: initial; text-align: center; white-space: nowrap; color: var(--normal); }
.top-sub-menu a::after { position: absolute; bottom: 0; left: .65rem; width: calc(100% - 1.3rem); height: 1px; content: ""; transition: all .25s ease; background-color: var(--lightgray); }
.top-sub-menu li:last-child a::after { content: initial; }
.top-sub-menu a:hover, .top-sub-menu a.active { font-weight: bold; color: var(--primary); }
.top-sub-menu a:hover::after, .top-sub-menu a.active::after { bottom: -1px; height: 3px; background-color: var(--primary); }
.tnm-con:before { position: absolute; top: 0; left: -10000px; z-index: 5; width: 50000px; height: 100%; content: ""; pointer-events: none; }
.top-quick { z-index: 9; width: var(--w); height: 1.8rem; margin-left: var(--ml); font-size: 1.2rem; color: var(--link); --fw: 42vw; --ml: 1rem; --w: 5rem; }
.top-quick a:hover { color: var(--primary); }
.top-quick a i { vertical-align: top; }
.top-quick .tq-con { position: absolute; top: 0; right: 0; z-index: 99999; width: var(--fw); height: 100%; transition: all .25s ease; transform: scaleX(0); transform-origin: center right; }
.tq-con { position: absolute; z-index: 2; display: flex; width: 100%; height: 100%; pointer-events: none; opacity: 0; align-items: center; justify-content: flex-end; }
.tq-con>dd { position: absolute; top: 0; left: 0; display: flex; width: calc(100% - 2.5rem); height: 100%; font-size: 1rem; pointer-events: none; opacity: 0; align-items: center; justify-content: flex-end; }
.top-nav[data-active^="@"] .tq-nav { pointer-events: none; opacity: 0; }
.top-nav[data-active^="@"] .tq-con { transform: unset; pointer-events: unset; opacity: 1; }
.top-nav[data-active="@lang"] .tq-con>dd[data-con="lang"], .top-quick[data-active="@buy"] .tq-con>dd[data-con="buy"], .top-quick[data-active="@search"] .tq-con>dd[data-con="search"] { pointer-events: unset; opacity: 1; }
.tq-con dd[data-con="lang"] a { color: var(--primary); }
.tq-con dd[data-con="lang"] a:hover { color: white; }
.tq-con dd[data-con="buy"] a { height: 100%; margin-right: .5rem; margin-left: .5rem; }
.tq-con dd[data-con="buy"] a svg { width: auto; height: 100%; }
.tq-con dd[data-con="buy"] a svg path { fill: var(--primary); }
.tq-con dd[data-con="buy"] a:hover svg path { fill: white; }
.tq-con .img-ico>span.ico { background-color: var(--primary); }
.tq-con .img-ico:hover>span.ico { background-color: white; }
.top-nav[data-active] .top-nav-menu { pointer-events: none; opacity: 0; }
.tqc-search dt { order: 2; }
.tqc-search dd { width: 100%; }
.top-nav-menu .visible-inline-xs { display: none; }
.top-toggle-nav { display: none; }
.top-side a { color: var(--normal); }
.top-side a:hover { color: var(--primary); }
.top-search { display: flex; width: 100%; align-items: center; justify-content: flex-end; }
.top-search input[type="text"] { width: 100%; height: 2rem; padding: 0 2.5rem 0 1rem; font-size: .8rem; line-height: 1; color: var(--normal); border: 1px solid var(--lightgray); background-color: rgba(255, 255, 255, .25); }
.top-search button { position: absolute; top: 0; right: .5rem; z-index: 2; display: flex; height: 100%; font-size: 1.2rem; color: var(--muted); border: 0; background-color: transparent; align-items: center; }
.top-search button i { -webkit-font-smoothing: auto; }
.top-search:hover input { width: 100%; opacity: 1; }
.tlang-con>dd>a { display: flex; line-height: 1; align-items: center; }
.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav { background-color: rgba(0, 0, 0, 0); box-shadow: none; }
.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-menu dt a, .transparent body[data-view="desktop"]:not(.fixed-tn) .top-side a { color: var(--white); }
.fixed-tn .top-nav-logo .logo-white { opacity: 0; }
.fixed-tn .top-nav-logo .logo-color { opacity: 1; }
.fixed-tn .top-nav { height: var(--top-nav-sm); }
.top-nav-logo svg path { fill: var(--primary) !important; }
.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-logo svg.logo-color path { fill: var(--white) !important; }
.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-menu dl.active dt a { color: var(--primary); }
.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-menu dl.active dt a::after { opacity: 0; }

/*.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-logo .logo-white { opacity: 1 }*/

/*.transparent body[data-view="desktop"]:not(.fixed-tn) .top-nav-logo .logo-color { opacity: 0 }*/
[data-view="desktop"].hide-top-nav .top-nav { transform: translateY(-101%); }
.b-border, .b-bc, .b-bcb, .b-arrow { white-space: nowrap; }
.b-arrow { display: flex; width: fit-content; transform-origin: left center; --move: .5rem; --pad: .25rem; align-items: center; }
.b-arrow::before { position: absolute; top: 0; left: 0; width: calc(100% + var(--move)); height: 100%; content: ""; pointer-events: none; background-color: rgba(0, 0, 0, 0); }
.b-arrow::after { width: fit-content; margin-left: var(--pad); font-family: "cxany"; font-size: .5rem; content: "\e929"; }
.b-arrow:hover { transform: scale(1.2); }
.b-border { display: flex; width: fit-content; min-width: 8.4rem; padding: var(--py) var(--px); overflow: hidden; line-height: 1.5; transition: all .25s ease; color: var(--bc); border: var(--bs) solid var(--bc); --bc: var(--primary); --bs: 1px; --px: 1.5rem; --py: .45rem; align-items: center; justify-content: center; }
.b-border:hover { color: white !important; border-radius: 10rem; background-color: var(--darkprimary); }
.b-border>i { margin-left: .75rem; }
.b-border.b-xl { --bs: 1px; --px: 2.5rem; }
.b-border.b-primary::before { transition: filter .35s ease; transform: unset; background-color: var(--darkprimary) !important; }
.b-border.b-primary { color: white !important; }
.b-border.b-primary:hover::before { filter: brightness(.9); }
.b-bc { --py: 1rem; --px: 2.5rem; display: flex; align-items: center; width: fit-content; padding: var(--py) var(--px); line-height: 1.5; color: white; border: 1px solid var(--bc); --bc: var(--darkprimary); --bs: 1px; justify-content: center; }
.b-bc:hover { color: var(--primary) !important; }
.b-bc.b-xl { --bs: 2px; --px: 2.5rem; }
.b-bc::before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: var(--bc); z-index: -1; transition: transform .5s ease; transform: scaleY(1); transform-origin: bottom; }
.b-bc:hover::before { transform: scaleY(0); transform-origin: top; }
.b-bcb { --bc: var(--darkprimary); --bs: 1px; --px: 1.5rem; --py: .45rem; white-space: nowrap; display: flex; width: fit-content; padding: var(--py) var(--px); overflow: hidden; line-height: 1.5; transition: all .25s ease; background-color: var(--bc); color: var(--white); border: var(--bs) solid var(--bc); align-items: center; justify-content: center; }
.b-bcb:hover { color: var(--primary); background-color: var(--white) }

h3.title { color: var(--primary); }
h3.title.white { color: var(--white); }
.video-play-button { z-index: 1; color: var(--primary); }
.video-play-button:before { position: absolute; top: 50%; left: 50%; z-index: 0; display: block; width: 80px; height: 80px; content: ""; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-animation: pulse-border 1500ms ease-out infinite; animation: pulse-border 1500ms ease-out infinite; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: white repeat scroll 0 0; }
.video-play-button.theme:before, .video-play-button.theme:after { background: var(--primary) repeat scroll 0 0; }
.video-play-button:after { position: absolute; top: 50%; left: 50%; z-index: 1; display: block; width: 80px; height: 80px; content: ""; -webkit-transition: all 200ms; -moz-transition: all 200ms; -ms-transition: all 200ms; -o-transition: all 200ms; transition: all 200ms; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: white repeat scroll 0 0; }
@-webkit-keyframes pulse-border {
  0% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; }
  100% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; }
}
@keyframes pulse-border {
  0% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; }
  100% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; }
}
.video-play-button i { z-index: 3; }
.video-play-button.relative { position: relative; width: 3rem; height: 3rem; }
.video-play-button.relative::before, .video-play-button.relative::after { width: 100%; height: 100%; }
.slides-list, .slides-list li, .bx-wrapper, .bx-viewport { position: relative; height: 100%; }
.slick-list, .slick-track { height: inherit; overflow: hidden; }
.slick-dotted { --db: 2.25rem; }
.slick-dots { bottom: var(--db); left: 0; z-index: 3; font-size: 0; line-height: 1; text-align: center; }
.slick-dots li { width: 20px; height: 20px; padding: 0; margin-right: .5rem; margin-left: .5rem; transition: all .5s ease; }
.slick-dots li button { width: 100%; height: 100%; padding: 0; margin: 0; background-color: transparent; }
.slick-dots li button:before { width: 100%; height: 100%; font-size: 0; line-height: 1; transition: all .25s ease; opacity: .85; border-radius: 5rem; background-color: var(--white); }
.slick-dots li.slick-active { width: 2.5rem; }
.slick-dots li.slick-active button:before { opacity: 1; color: white; background-color: var(--primary); }
.dot-primary .slick-dots li button { background-color: white; }
.dot-primary .slick-dots li.slick-active button { background-color: rgb(30, 80, 164); }
.slides-nav { top: 30%; }
.slides-nav a { position: absolute; top: 50%; display: inline-block; line-height: 1; }
.slides-nav i { vertical-align: top; }
.slides-nav-prev { left: 0; -webkit-transform: translateX(-80%) translateY(-50%); transform: translateX(-80%) translateY(-50%); }
.slides-nav-next { right: 0; -webkit-transform: translateX(80%) translateY(-50%); transform: translateX(80%) translateY(-50%); }
.slick-track { margin-right: auto; margin-left: auto; }
.slick-dotted.slick-slider { margin: 0; }
.slick-slider { --pn: 3rem; --pp: 3rem; --size: 2.4rem; }
.slick-prev, .slick-next { z-index: 5; width: var(--size); height: var(--size); margin: 0; transition: all .25s ease; }
.slick-prev::before, .slick-next:before { font-family: "cxany"; font-size: var(--size); transition: all .25s ease; opacity: 1; color: var(--darkgray); }
.slick-prev::before { content: "\e934"; }
.slick-next::before { content: "\e935"; }
.slick-prev { left: var(--pp); }
.slick-next { right: var(--pn); }
.slick-prev:hover::before, .slick-next:hover::before { color: var(--primary); }
.bottom-nav.slick-slider { --pn: 8.25rem; --pp: 4.5rem; --size: 2.6rem; }
.bottom-nav .slick-next { right: initial; left: var(--pn); }
.bottom-nav .slick-prev::before, .bottom-nav .slick-next::before { font-size: 1.4rem; color: var(--normal); }
.bottom-nav .slick-prev, .bottom-nav .slick-next { top: initial; bottom: 2.5rem; z-index: 2; transform: none; opacity: .85; border-radius: 100%; background: rgba(255, 255, 255); }
.bottom-nav .slick-prev::before { content: "\e904"; }
.bottom-nav .slick-next::before { content: "\e905"; }
.bottom-nav .slick-prev:hover, .bottom-nav .slick-next:hover { background: var(--primary); }
.bottom-nav .slick-prev:hover::before, .bottom-nav .slick-next:hover::before { color: white; }
@media screen and (min-width:1920px) {
  .slides-nav-prev { -webkit-transform: translateX(-100%) translateY(-50%); transform: translateX(-100%) translateY(-50%); }
  .slides-nav-next { -webkit-transform: translateX(100%) translateY(-50%); transform: translateX(100%) translateY(-50%); }
}
.shadow-con { overflow: hidden; }
.radius-5 { border-radius: 5px; }
.radius-10 { border-radius: 10px; }
.desktop .home .fixed-tn .hsec-banner>div { padding-top: var(--top-nav-sm); }
.banner-wrapper { height: 100vh; }
.full-banner { height: 100vh; /* max-height: calc(100vw * .6); */ --h3:3rem; --h3s: 3rem; --h4: 1.2rem; --h4s: .9rem }
.slides-info { z-index: 1; display: flex; width: 100%; height: 100%; padding-top: 5vw; transition: opacity .8s ease .6s, transform .5s linear .6s; transform: translateY(5%); opacity: 0; align-items: center;  }
.completed .slick-current .slides-info { transition: all .75s ease 1s; transform: none; opacity: 1; }
.hs-item { overflow: hidden; }
.hsi-container { z-index: 2; }
.hsi-con { font-family: "Arial"; text-align: right; }
.hsi-con.primary { color: var(--primary); }
.hsi-con img { width: auto; max-height: 100%; }
.hsi-con h4 { margin-top: 1rem; font-size: var(--h4s); line-height: 1.5; }
.hsi-con h4 em { font-size: 80%; }
.full-banner .hsi-con h4 { font-size: var(--h4) }
.sub-banner .sbani-con h3 { font-size: var(--h3s) }
.sub-banner .sbani-con h4 { font-size: var(--h4s) }

/*.hsi-con h3 { padding-left: .4rem; letter-spacing: .4rem }*/
.hsi-player { width: 100%; height: 100%; }
.hs-item:after { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 100%; content: ""; }
.hcom-overview { max-width: 33rem; padding-top: 1.75rem; padding-bottom: 3.25rem; line-height: 2.3; text-align: justify; }
.home-about { --cs: .7rem; --hb: 2.75rem; --him: 6rem; --is: 1.2rem; --ts: .8rem; }
.hab-heading { padding-bottom: var(--hb); text-align: center; }
.hab-heading img { width: auto; max-height: var(--him); }
.hab-title { font-size: var(--ts); }
.hab-intro { font-size: var(--is); }
.hab-con { font-size: var(--cs); line-height: 2; }
.hab-con p { margin-bottom: .5rem; }
.hab-media { height: 100%; }
.hab-footer { top: initial; bottom: 7rem; }
.habc-txt { flex-grow: 1; }
.habc-img { width: 55vw; flex-shrink: 0; }

/* home business */
.home-business { color: white; background-color: var(--darkprimary); }
.hbus-info { width: 36%; padding-left: var(--left-pad); flex-shrink: 0; }
.hbus-gallery { flex-grow: 1; }
.hbusg-item { height: 100vh; max-height: 55vw; }
.hbusgi-bg::after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ""; transition: background-color .5s ease; background-color: rgba(0, 0, 0, .7); }
.hbusg-item:hover .hbusgi-bg::after { background-color: rgba(0, 0, 0, .3); }
[data-view="desktop"] .hbus-heading hr.with-line::before { height: .4rem; }
.hbusgi-con img { height: 6.4rem; }

/* home brands */
.home-brands { --h: 5rem; }
.home-brands::after { position: absolute; bottom: 0; left: 0; z-index: -1; width: 100%; height: 0; content: ""; border-bottom: 1px solid var(--silver); }
.hbra-heading>h3 { height: var(--h); border-right: 1px solid darkgray; }
.hbrai-img, .hbra-more { height: var(--h); }
.hbrai-img img { z-index: 2; width: auto; height: var(--h); }
.hbra-item .title { opacity: 0; }
.hbra-item .title::after { position: absolute; bottom: 0; left: 0; z-index: 2; width: 100%; height: 0; content: ""; border-bottom: 1px solid var(--primary); }
.hbra-item:hover .title { opacity: 1; }
.hbrai-img img { opacity: 0; }
.hbrai-icon, .hbrai-img img { transition: opacity .5s ease; }
.hbra-item:hover .hbrai-img img { opacity: 1; }
.hbra-item:hover .hbrai-icon { opacity: 0; }

/* home news */
.hnewsii-pic { padding-top: 60%; }
.hnewsi-info { flex-grow: 1; }
.hnews-hot-top { order: 2; }
.hnews-item { cursor: default; }
.hnews-hot-list .hnews-item>dt { width: 40%; flex-shrink: 0; }
.hnewsi-txt .cats { padding-right: .75rem; margin-right: .75rem; border-right: 1px solid var(--darkgray); }
.hnews-hot-list .hnews-list { padding-right: 2rem; }
.hnews-hot-list .hnewsi-info { padding-left: 2.5rem; }
.hnews-hot-list .hnews-item { padding-bottom: 1.75rem; margin-bottom: 1.75rem; border-bottom: 1px solid var(--lightgray); }
.hnews-hot-list .hnews-item::after { position: absolute; bottom: 0; left: 0; width: 55%; height: 0; content: ""; transition: transform .35s ease; transform: scaleX(0); transform-origin: left center; border-bottom: 2px solid var(--primary); }
.hover-auto .hnews-hot-list .hnews-item:hover::after { transform: scaleX(1); transform-origin: left center; }
.hover-auto .hnews-item:hover .hnewsi-more>a { transform: scale(1.15); }
.hnews-item:hover .subject { color: var(--primary) !important; }
[data-view="desktop"] .hnews-hot-top .hnewsi-info { padding-top: 2.5rem !important; }

/* footer */
.main-footer { background-color: var(--silver); --im: 15vw; }
.main-footer a:hover { font-weight: bold; color: var(--primary); }
.mfn-sub-nav a { display: block; }
.footer-link { --ih: 2.25rem; }
.footer-link dd a { margin: .75rem; }
.footer-link dd a img { height: var(--ih); }
.footer-copyright { background-color: var(--darkprimary); }
.footer-copyright, .footer-copyright a { color: var(--darkgray); }
.footer-copyright a:hover { font-weight: bold; color: var(--light); }
.social-image>span.pic { position: absolute; top: -.25rem; left: 50%; display: block; width: 7rem; padding: .5rem; overflow: hidden; transition: all .25s; transform: translate3d(-50%, -110%, 0); pointer-events: none; opacity: 0; border-radius: 6px; background: white; box-shadow: 0 0 15px rgb(0 0 0 / 15%); }
.social-image:hover>span.pic { transform: translate3d(-50%, -100%, 0); opacity: 1; }
.mfclink-list li { padding-right: .5rem; margin-right: .5rem; border-right: 1px solid var(--darkgray); }
.mfclink-list li:last-child { border-width: 0; }
.ftsoc-list a { height: 1.6rem; }
.mfnsm-follow img { width: 3.6rem; }
/*.mfoocc-logo { height: 5.5rem; }*/
.mfoocc-logo>img, .mfoocc-contact>img { width: 18rem; }
.pp-social.fancybox-is-open .fancybox-bg { background-color: rgba(0, 0, 0, .8); }
.pp-social .fancybox-toolbar { position: relative; display: flex; width: 100%; justify-content: center; order: 2; }
.pp-social .fancybox-inner { display: flex; flex-direction: column; justify-content: center; }
.pp-social .fancybox-infobar, .pp-social .fancybox-navigation { display: none !important; }
.pp-social .fancybox-stage { position: relative; top: initial; bottom: initial; height: 26rem; margin: 0; }
.pp-social .fancybox-content { overflow: hidden; border-radius: 6px; }
.pp-social .fancybox-slide { padding-bottom: 1rem; }

/* quick nav */
.quick-nav { position: fixed; right: 0; bottom: 8rem; z-index: 999; width: var(--w); transition: transform .25s ease,opacity .25s ease; transform: translateX(0); --w: 3.25rem; }
.quick-nav a { z-index: 1; display: flex; width: 100%; height: var(--w); margin-top: 1px; color: white; border: 1px solid var(--darkprimary); background-color: var(--darkprimary); align-items: center; justify-content: center; }
.quick-nav a:hover { z-index: 5; background-color: var(--primary); }
.quick-nav a span { position: absolute; right: calc(var(--w) + 2px); bottom: 0; z-index: -1; transition: all .25s ease; transform: translateX(-10%); white-space: nowrap; pointer-events: none; opacity: 0; border: 1px solid var(--lightgray); border-radius: 8px; background-color: white; }
.quick-nav a span::after { position: absolute; top: 0; right: -10px; width: 15px; height: 100%; content: ""; background-color: transparent; }
.quick-nav a:hover { color: var(--darkprimary); border-color: var(--lightgray); background-color: white; }
.quick-nav a:hover span { -webkit-transform: translateX(0); transform: translateX(0); pointer-events: initial; opacity: 1; }
.quick-nav.hide-me { transform: translateX(100%); pointer-events: none; opacity: 0; }

/* sub page */
.sban-img { z-index: -99; pointer-events: none; opacity: 0; }
.sban-info h3 { font-size: var(--h3); line-height: 1.2; }
.sban-info h4 { font-size: var(--h4); margin-top: 1.5rem; }
.sub-banner.sm-banner { height: var(--h); --h: 25vw; }
.sban-con { padding-top: var(--top-nav); left: 0; top: 0; right: 0; width: 100%; }
.sban-con.abs { width: inherit; }


/* hover border  */
.hover-border { padding:.4rem 0; line-height: 1; }
.hover-border:before { content: ""; display: block; width: 100%; height: 4px; transform-origin: 100% 50%; transform: scale(0, 1); transition: transform 0.6s cubic-bezier(0.36, 0.14, 0, 1); position: absolute; bottom: 0; left: 0; background-color: var(--primary); }
.hover-border.hb-normal:before { background-color: var(--normal); }
.hover-auto .hover-link:hover .hover-border:before, .hover-auto .hover-border:hover:before { transform-origin: 0% 50%; transform: scale(1, 1); }
.hover-link { cursor: pointer; }
.hover-border.hb-dark { color: var(--dark); }

/* Sub Page */
.breadcrumb { margin-top: 5.75rem; }
.breadcrumb a, .breadcrumb span { opacity: .3; margin-right: .5rem; flex-shrink: 0; }
.breadcrumb a:hover { opacity: 1; color: inherit; }

.subnav-container { border-bottom: 1px solid var(--lightgray) }
.sub-nav a { display: flex; height: 5rem; }
.sub-nav a.active { font-weight: bold; color: var(--primary) }
.sub-nav a.active .hover-border:before { transform-origin: 0% 50%; transform: scale(1, 1); }
.sub-nav a:first-child { margin-left: 0!important }
.sub-nav a .hover-border { height: 100%; display: flex; align-items: center; }

.subban-txt { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 5; flex-wrap: wrap; }
.subban-txt>dl { max-width: 40rem; }

/* about */
.about-banner .slides-info { padding-top: 0; }
[data-view="desktop"] .abb-pic .obs { margin-top: 5rem; }
.about-chairman { --w: 5vw; }
[data-view="desktop"] .abchat-con { position: absolute; bottom: calc(-1 * var(--w)); left: 0; width: fit-content; min-width: calc(100% + var(--w)); }
.abcha-det { margin-top: var(--w); }
.abcha-img img { background-color: var(--silver) }
.abtab-nav { height: 2.5rem; border-bottom: 1px solid var(--lightgray); }
.abtab-nav a { height: 100%; border-bottom: 2px solid transparent; }
.abtab-nav a:hover, .abtab-nav a.active { font-weight: bold; }
.abtab-nav a.active { border-color: var(--primary); }
.about-philosophy { --w: 3rem; }
[data-view="desktop"] .abphi-nav { min-width: calc(100% + var(--w)); margin-left: calc(-1 * var(--w)); }
[data-view="desktop"] .abphi-txt { position: absolute; right: 0; bottom: calc(-1 * var(--w)); width: fit-content; min-width: calc(100% + var(--w)); }
[data-view="desktop"] .abphit-con { min-height: 25vw; padding: calc(var(--w) - .75rem) var(--w); background-color: white; }
.abphit-con p.fs-12 { font-size: 65%; }
[data-view="desktop"] .abphit-con p:last-child { padding-bottom: .75rem; }
[data-view="desktop"] .ablay-item { display: flex; min-height: 100vh; align-items: center; }
.ablaymd-list dt { display: flex; line-height: 1; align-items: flex-end; }
.ablaymd-list dt>strong { padding-left: 1rem; letter-spacing: -.05em; }
.ablaymd-list dt>em { margin-bottom: .75em; margin-left: .5em; font-size: 1rem; font-weight: bold; }
.ablaymd-list dd { height: 2rem; }
.ablaymd-list li.gap-line { border-right: 1px solid var(--light); }
.ablaymd-list li.gap-line:last-child { display: none; }
.ablayp-item { opacity: 0; flex: 1; }
.ablaym-img { top: 0; left: 0; z-index: 5; width: 100%; }
.abind-nav-panel { overflow: initial; }
.abindc-item { display: flex; align-items: center; }
.abindci-img { padding-top: 76%; border-radius: .9rem; }
.abindc-list .abindci-img { transition: transform .15s; transform: scale(.85); }
.abind-nav-panel.visible .abindc-list .slick-current .abindci-img { transition: transform .8s ease .8s; transform: none; }
.abind-con .slick-slider { --pn: calc(-1.2 * var(--size)); --size: 2.8rem; }
.abind-con .slick-prev { display: none !important; }
.abindct-con dt em { margin-left: .5rem; font-size: 1.5rem; }
.ablay-main .ablaymi-con { top: 0; left: 0; width: 100%; height: 100%; transition: all 1s ease; opacity: 0; }
.ablaymi-con:not([data-id="1"]) { position: absolute; }
.ablaymi-con[data-id="1"] { transform: translateY(10rem); }
.ablaymi-con[data-id="2"], .ablaymi-con[data-id="3"] { transform: translateY(-10rem); }
.ablaym-img.active .ablaymi-con { transform: none !important; opacity: 1 !important; }
.ablaym-img.active .ablaymi-con[data-id="2"] { transition-delay: .5s; }
.ablaym-img.active .ablaymi-con[data-id="3"] { transition-delay: .75s; }
.abhis-list { padding-top: 4rem; --pn: 3rem; --pp: calc(100% - 3rem * 3 - 1.5rem); --size: 2.8rem; }
.abhis-list .slick-list::before { position: absolute; top: 2px; left: 0; width: 100%; height: 0; content: ""; border-top: 1px solid var(--lightgray); }
.abhis-item h3 { padding-top: 1rem; padding-bottom: 1rem; line-height: 1; transition: border-color .25s ease; border-top: 3px solid transparent; }
.abhis-item h4::after { position: absolute; bottom: -1rem; left: 0; width: 1.4rem; height: 4px; content: ""; background-color: var(--lightgray); }
.abhis-list .slick-arrow { top: 2rem; }
.abhis-list li.slick-current .abhis-item h3 { border-color: var(--primary); }
.abhis-list li.slick-current .abhis-item h4 { font-weight: bold; }
.abhis-list li.slick-current .abhis-item h4::after { background-color: var(--primary); }
.abhis-list li.slick-current .abhis-item dt { color: var(--primary); }
.abpar-item { width: 20%; }
.abpari-logo { padding-top: 50%; }
.abpari-logo:hover>img { opacity: 1; }
.abpari-logo>img { transition: all .25s ease; }
.abpari-logo:hover>.ico { opacity: 0; }
.abesg-heading { padding-right: 55%; }

/* services */
.mouse-scroll { z-index: 2; display: block; width: 2rem; height: 2.7rem; border: 1px solid var(--silver); border-radius: 1rem; background: none; }
.mouse-scroll:before { position: absolute; top: .45rem; left: .75rem; width: .4rem; height: .4rem; content: ""; -webkit-animation: scrollanimation 2s infinite; -moz-animation: scrollanimation 2s infinite; -ms-animation: scrollanimation 2s infinite; -o-animation: scrollanimation 2s infinite; animation: scrollanimation 2s infinite; border-radius: 100%; background: var(--silver); }
.mouse-scroll:hover { opacity: .8; }
@keyframes scrollanimation {
  0% { top: .45rem; opacity: 0; }
  20% { top: .45rem; opacity: 1; }
  60% { top: 1.15rem; opacity: 1; }
  80%, 100% { top: 1.15rem; opacity: 0; }
}
.serintro-mouse.hide-me a { opacity: 0 }
.sers-item { --ml: 13rem; --ico: 9rem; --pl: var(--left-pad) }
.sers-item a.cover-link { display: none; }
.sers-list, .sers-item { height: 100%; max-height: initial; }
.sers-item .hbusgi-bg::after { content: initial; }
.sersi-con { transition: all .5s ease .25s; }
.sersi-det { color: white; padding-left: var(--pl) }
.sersi-det .sersi-ico img { height: var(--ico); width: var(--ico) }
/*[data-view="desktop"] .sers-item.slick-current.slick-active .sersi-txt { transform: translate(85%, -60%); transition-delay: .85s; will-change: transform }*/
[data-view="desktop"] .sers-item.active .sersi-txt { transform: translate(85%, -60%); transition-delay: .25s; will-change: transform }
[data-view="desktop"] .sersi-txt>h5 { margin-top: .5rem; line-height: 1 }
[data-view="desktop"] .sersi-txt>h4, .sersi-txt>h5 { transition: font-size .5s ease }
[data-view="desktop"] .sersi-next .sersi-con { transition: transform .5s ease .25s; transform: translateX(calc(-1 * var(--ml))); will-change: transform }
[data-view="desktop"] .sersi-next.sers-item { --pl: 3rem; --ico: 6rem; --sh4:2.4rem; --sh5:1.4rem; z-index: 2 }
.sersi-next .sersi-txt { margin-bottom: 5rem }
.sersi-next .sersi-txt>h4 { font-size: var(--sh4); }
.sersi-next .sersi-txt>h5 { font-size: var(--sh5); margin-top: 1rem; line-height: 1.4 }
.sersi-next.sers-item .hbusgi-bg::after { content: ""; }
.sersi-next.sers-item a.cover-link { display: block; pointer-events: initial; }
.sersi-next.sers-item:hover { --ml: 16rem }
.sersi-next.sers-item:hover .sersi-bg { transform: none; }
.sersi-next.sers-item:hover .sersi-con { transition-delay: 0s; transition-duration: .25s; }
.sersi-link { width: 100%; height: 4.5rem; display: flex; align-items: center; position: absolute; bottom: 0; left: 0; padding-left: 4rem; color: white; transition: opacity .75s ease; overflow: hidden; opacity: 0; z-index: 9 }
.sersi-link::before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: var(--primary); z-index: -1; transition: transform .5s ease; transform: scaleY(0); transform-origin: top; }
.sersi-next.sers-item:hover .sersi-link { opacity: 1 }
.sersi-next.sers-item:hover .sersi-link::before { transform: scaleY(1); transform-origin: bottom; }
.services body { background-color: var(--lightsilver); }
.services body:not(.document-idle) { overflow-y: hidden; margin-right: var(--bar-width) }
.services body:not(.document-idle) .top-nav { margin-right: var(--bar-width) }

.art-services { pointer-events: none; }
.leave.art-services { pointer-events: initial; }
.serintro-con { margin-top: -6rem; width: 66.6666%; pointer-events: initial; }
.serintro-con::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--darkprimary); opacity: .95; }
.serintro-mouse { height: 6rem; padding-left: var(--left-pad) }
.seric-txt { padding-left: 12%; padding-right: 23%; }
.serintro-img { z-index: 2; padding-left: 50%; padding-right: var(--left-pad); margin-top: -15vw }
.serad-item dt { width: 10.4rem; height: 5.2rem; }
.services-prod { --w: 20rem; --s: 50vw; }
[data-view="desktop"] .serprod-det { width: calc(var(--s) * 2 + var(--w)) }
[data-view="desktop"] .serprod-list { margin-left: calc(-1 * var(--w)); }
[data-view="desktop"] .serprod-item { padding-left: var(--w); }
.serprod-img { padding-top: 62.5%; border-radius: 1rem; }
.serprod-nav { left: var(--s); width: var(--w); padding: 1rem 5vw }
.serprodn-btn { line-height: 1; height: 3rem; margin-top: 1rem; }
.serprodn-btn a { color: var(--darkgray) }
.serprodn-btn a:hover { color: var(--primary) }
.serprodn-list { height: calc(100% - 4rem); overflow-y: auto }
.serprodn-list li { margin-top: .5rem; margin-bottom: 1rem; cursor: pointer; }
.serprodn-list li.active { font-weight: bold; color: var(--primary) }
[data-view="desktop"] .btn-sercont { width: 30vw; letter-spacing: .35em; }
.sercontc-mouse .mouse-scroll { transform: scale(.7); --silver: var(--muted) }
.services .main-footer { display: none; }
.services-next { height: 31rem; background-color: var(--darkgray) }
.services-ready-next { position: absolute; width: 100%; height: 10px; left: 0; bottom: 0; }
.services-next { --ico: 8.5rem; }
.sernext-bg::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: black; opacity: .75; }
.sernext-item .sersi-det { width: fit-content; }
.sernext-item .sersi-txt { transform: translate(85%, -60%); transition-delay: 1.1s; will-change: transform; }

/* news */
.newsli-box { border-bottom: 1px solid var(--lightgray); }
.newsli-con { transition: transform .5s ease }
.news-list .item-left { line-height: 1; width: 8rem; flex-shrink: 0; height: fit-content; }
.ani-font { transition: color .5s ease; }
.ani-bg { transition: background .5s ease; }
[data-view="desktop"] .news-list .item-info { line-height: 1.5; margin-left: 8rem; padding-right: 5rem; flex-grow: 1 }
.news-list.has-thumbs .item-left { width: 150px; padding-right: 30px; text-align: left }
.news-list.has-thumbs .item-info { margin-left: 15rem; padding-right: 8rem; }
.news-list.has-thumbs .overview { line-height: 22px; max-height: 44px; color: rgb(128, 128, 128) }
.news-list .image { width: 9rem; flex-shrink: 0 }
.news-list .item-info i[class^='icon-'] { position: absolute; top: 35%; right: 0; transition: all .5s ease; }
.desktop .news-list .newsl-item:hover { background-color: var(--darkprimary); color: var(--white) }
.desktop .news-list .newsl-item:hover .newsli-con { transform: scale(1.1); }
.desktop .news-list .newsl-item:hover .ani-font { color: var(--white)!important }
.news-details.sub-page { padding-top: 20px; padding-bottom: 20px }
/*.news-details { margin-bottom: 100px }*/
.news-heading { text-align: center }
.news-heading h2 { font-weight: bold; line-height: 1; margin-top: 100px; margin-bottom: 20px; color: black }
.news-heading h4 { font-size: 14px; color: rgb(155, 155, 156) }
.news-heading h4 i { font-size: 1rem; margin-right: 5px; vertical-align: middle; margin-top: -.25rem; }
.news-heading h4 span { margin-right: 10px; margin-left: 10px; vertical-align: middle; }
.news-content { font-size: 15px; margin-top: 40px; padding-bottom: 40px }
.news-content strong { color: black }
.newsd-con p { margin-bottom: 1.5em; }

.nsca-list li a i { margin-top: -.2rem; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; vertical-align: middle; }
.nsca-list li a:hover i { -webkit-transform: translateX(.5rem); transform: translateX(.5rem); }
.nscv-list .image .inner::after { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: black; opacity: .4; transition: background-color .5s ease, opacity .5s ease; }
.nscv-list .image .ratio::after { font-family: "cxany"; font-size: 3.5rem; line-height: 3.5rem; position: absolute; z-index: 3; top: 50%; left: 50%; width: 3.5rem; height: 3.5rem; content: '\e92f'; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; color: var(--white); border-radius: 100%; background-color:  }
.nscv-list li:hover .text { background-color: var(--darkprimary) }
.nscv-list li:hover .ani-font { color: var(--white)!important }

.video-list>li:nth-child(n+7) { display: none; }
.video-list>li.active { display: list-item; }

.newsdet-container { padding-top: var(--top-nav-sm) }
.article-prev-next { border-top: 1px solid var(--darkgray); border-bottom: 1px solid var(--darkgray) }
.apn-con { --w: 2.5rem; --h: 3.5rem; height: var(--h); }
.apn-con>div { height: 100%; display: flex; align-items: center; }
.apnc-item { width: calc(50% -  var(--w)); flex-shrink: 0; }
.apnc-item::before { content: ""; position: absolute; width: 50vw; height: 100%; top: 0; right: 0; transition: background .5s ease; background-color: var(--darkgray); }
.apnc-item.apnc-next::before { right: initial; left: 0 }
.apnc-item:hover::before { background-color: var(--primary) }
.apnc-item:hover, .apnc-item:hover a, .apnc-item:hover a>i { color: var(--white)!important }
.apnc-back { width: calc(var(--w) * 2); justify-content: center; background-color: var(--silver) }
.apnc-back a { width: 100%; height: 100% }
.apnc-back a:hover { background-color: var(--primary); color: var(--white)!important }
.apnc-item a { width: 100%; color: var(--dark) }
.apnc-item a span { max-width: 80% }
.related-news { background: rgba(227, 227, 227, 1); }
.related-news .btn-more { --bc: var(--muted); min-width: initial; bottom: 0; top: initial; }
.related-list hr { --lightgray: var(--darkgray) }
.relatedn-item:hover .btn-more {  }
.relatedn-item .intro { line-height: 1.3rem; min-height: 3.9rem }

/* share */
.newsd-share .social-share a { display: flex; justify-content: center; align-items: center; border: 0; padding: .35rem; width: 1.6rem; height: 1.6rem; border-radius: 6px; background-color: var(--lightgray); margin-left: .5rem; margin-right: .5rem; font-size: 1rem; }
.newsd-share .social-share a:hover { background-color: var(--light); }
.newsd-share .social-share a:before { content: unset!important; }

/* pager */
.pager-list a { display: flex; align-items: center; justify-content: center; margin-left: .5rem; margin-right: .5rem; font-size: .9rem; min-width: 1.6rem; height: 1.6rem; }
.pager-list a.active { color: var(--white); background-color: var(--primary); pointer-events: none; }
.pager-list a:hover { color: var(--primary); }
.pager-list .pager-prev, .pager-list .pager-next { background-color: transparent; margin-left: .25rem; margin-right: .25rem; font-size: .9rem; }

/* talent */
.talculi-con { display: flex; flex-direction: column; }
[data-view="desktop"] .talcul-item:nth-child(2) dd { order: -1; padding-left: 2.75rem; padding-right: 2.75rem; }
[data-view="desktop"] .talcul-item:nth-child(3) dd { justify-content: end; }
.talculi-dd { width: fit-content; }
.talculi-det p { font-size: inherit!important; }
[data-view="desktop"] .talcont-con { margin-right: -5rem; }
.talacti-img { border-radius: 1rem; padding-top: 55.5555%; }
.talactivity-con { --w: 17.5rem; --s: 48vw; }
[data-view="desktop"] .talact-det { width: calc(var(--s) * 2 + var(--w)) }
[data-view="desktop"] .talact-list { margin-left: calc(-1 * var(--w)); }
[data-view="desktop"] .talact-item { padding-left: var(--w); }
.talact-img { padding-top: 62.5%; border-radius: 1rem; }
.talact-nav { left: var(--s); width: var(--w); --link: va(--white); padding-top: 11vw }
.talacti-img { transform-origin: left; }
.talact-item:not(.active) .talacti-img { transform: scale(.7); }
.talact-item:not(.active) { pointer-events: none; }
.talacti-more { --link: var(--white); border-bottom: 1px solid currentColor; }
.talact-item:hover .talacti-more { color: var(--light) }
.talcar-det { width: fit-content; }
.talcar-nav a { --py: .4rem; --px: 3rem }

.fancy-slider { width: 95%; background-color: transparent; padding: 0 5rem }
.fancy-slider .slick-slider { --pn: -4.75rem; --pp: -4.75rem; --size: 3.25rem; --primary: var(--white); padding: 0 }
.fancy-slider-item { width: 100%; height: 85vh; }
.fancy-iframe.fancybox-is-open .fancybox-bg { opacity: .85 }
.fancy-feedback.fancybox-is-open .fancybox-bg { opacity: .45 }
.fancy-iframe .fancybox-button--close { border-width: 0; right: 1rem; top: 1rem; font-size: 1.6rem; color: var(--gray); --primary: var(--white) }
[data-view="desktop"].compensate-for-scrollbar { margin-right: 0!important; border-right: var(--bar-width) solid white }
.fancy-feedback .fancybox-toolbar { display: none; }
.common-feedback .cfb-close { right: 0; top: 0; left: initial; width: fit-content; }
.common-feedback .b-bcb { --py: .35rem; }
[data-view="desktop"] .cfee-con { width: 80vw }
.common-feedback .cfb-close:hover button>i { transform: rotate(90deg); }
.fancybox-container { --size: 5rem }
.fancybox-inner { z-index: 9; }
.fancybox-inner .fancybox-infobar, .fancybox-inner [data-fancybox-play] { display: none; }
[data-view="desktop"] .fancybox-slide--image { padding: 2rem 16vw!important }
.fancy-iframe .fancybox-navigation { transform: translateY(50%); top: 50%; z-index: 99999; }
.fancy-iframe .fancybox-navigation button { visibility: visible; opacity: 1 }
.fancybox-navigation .fancybox-button { background-color: transparent; display: flex; align-items: center; justify-content: center; padding: 0; width: var(--size); height: var(--size);  }
.fancybox-navigation .fancybox-button div::before { content: ""; font-family: "cxany"; -webkit-font-smoothing: antialiased; }
.fancybox-navigation .fancybox-button[data-fancybox-prev] { padding-left: 9.25vw; }
.fancybox-navigation .fancybox-button[data-fancybox-next] { padding-right: 9.25vw; }
.fancybox-navigation .fancybox-button[data-fancybox-prev] div::before { content: "\e934"; }
.fancybox-navigation .fancybox-button[data-fancybox-next] div::before { content: "\e935"; }
.fancybox-navigation .fancybox-button div { padding: 0; height: auto; line-height: 1; font-size: 3rem; color: white; opacity: .5; transition: opacity .25s ease; }
.fancybox-navigation .fancybox-button:hover div { opacity: 1; }
.fancybox-navigation .fancybox-button div>svg { display: none; }

/* join */
[data-view="desktop"] .join-banner.sub-banner.sm-banner { --h: 30rem; height: var(--h)!important }
[data-view="desktop"] .sub-banner .sban-con { padding-top: initial; position: fixed; padding-top: var(--top-nav-sm); height: var(--h)!important; z-index: -1 }
/*.join-banner { padding-top: var(--top-nav) }*/
.join-banner .contact-search { align-items: flex-end }
[data-view="desktop"] .join-nav { width: 20rem; margin-right: -20rem; padding-right: 2rem; }
.jnav-list label i { opacity: 0 }
[data-view="desktop"] .join-main { padding-left: 20rem }
[data-view="desktop"] .join-main .ajl-item h4 { border-top: 1px solid var(--silver); border-bottom: 1px solid transparent; color: var(--gray) }
[data-view="desktop"] .join-main .ajl-item h5 { opacity: 0; pointer-events: none; overflow: hidden; max-height: 0; }
[data-view="desktop"] .join-main .ajl-item .row-5>span { flex: 20% 0 0; text-align: center; }
[data-view="desktop"] .join-main .ajl-item .row-5>span:first-child { flex: 25% 0 0; }
[data-view="desktop"] .join-main .ajl-item .row-5>span:last-child { flex: 15% 0 0; }
[data-view="desktop"] .join-main .ajl-item.active h5 { opacity: 1; max-height: 3rem; padding-top: 1rem; padding-bottom: 1rem; }
[data-view="desktop"] .join-main .ajl-item.active h4 { border-bottom-color: var(--silver); background-color: var(--silver); color: var(--link) }
[data-view="desktop"] .join-main .ajl-item.active .bnav-icon { transform: rotate(90deg); }
[data-view="desktop"] .join-main .ajl-item:not(:last-child) { padding-bottom: 0 }
[data-view="desktop"] .join-main .ajl-item h4:hover { background-color: var(--silver); color: var(--link) }

.jmain-det strong { color: var(--black) }
/*.join-home input[type="checkbox"] { width: .95rem; height: .95rem; }*/
/*.join-home input[type="checkbox"]:before { border-radius: 3px; top: 0; border-color: var(--darkgray) }*/
.join-home a.b-bc { --py: .5rem; --px: 1.5rem }
.ajl-content h3 { font-weight: bold; font-size: .9rem; color: var(--light) }
[data-view="desktop"] .ajl-item:not(:last-child) { padding-bottom: 2.5rem; }
.ajl-item h4 { cursor: pointer; transition: background-color .5s; background-color: white; }
.ajl-content { padding: 0; margin-top: 1px; overflow: hidden; line-height: 2; transition: height .5s ease; background-color: white; }
/*.ajl-content { height: 0; padding: 0; margin-top: 1px; overflow: hidden; font-family: var(--font-system); line-height: 2; transition: height .5s ease; background-color: white; }*/
.ajl-content>div { padding: 2rem 1.5rem; background-color: rgba(242, 248, 255, 1) }
.ajl-item.active h4 .icon-down { transform: rotate(180deg); }
[aria-expanded="true"] .icon-down { transform: rotate(180deg); }
.ajl-content h5 { margin-bottom: .5rem; }

/* contact */
.contact-article { padding-top: 2rem; }
.contact-list { padding-top: 2.5rem; }
.con-desc { padding-top: 1.5rem; padding-bottom: 2rem; line-height: 2.5; }
.contact-list:first-child .con-item { border-bottom: 1px solid var(--silver); }
.conh-title { height: 3.5rem; }
.conh-sub { height: 3.5rem; }
.conhi-info .conh-sub { letter-spacing: .15em }
.consec-feedback { padding-top: 2.5rem; padding-bottom: 5rem; margin-top: 2rem; background-color: var(--gray); }
.conf-item { padding-top: 1rem; padding-bottom: 1rem; line-height: 2rem; border-bottom: 1px dotted rgb(198, 198, 198); justify-content: flex-start; }
.conf-item:last-child, .conf-item.no-border { border-bottom: 0; }
.conf-item label { width: 7.5rem; padding: 0; margin: 0; flex-shrink: 0; }
.conf-item>div.width-full { flex-grow: 1; }
.confi-text { height: 10.25rem; }
.btn-reset { margin-left: 2.5rem; }
.group-auth { padding-top: 0; }
.cfc-box { margin-bottom: 1px; }
.cfcb-address h4 { margin-top: 1rem; }
.cfcb-address .tel { padding-top: 1.25rem; padding-bottom: 1.5rem; line-height: 1; }
.cfcb-address .tel>i { margin-right: .25rem; }
.cfcb-address .overview { line-height: 2.3; }
.cfc-work { z-index: 2; padding-top: 1.75rem; padding-bottom: 1.75rem; }
.cfcwork-img { height: 6rem; }
.cfcb-time dt { padding-right: 1.5rem; }
.cfcb-time dd h4 { margin-bottom: .5rem; }
.cfclogo-img { width: 30rem; }
.cfclogo-img img { position: absolute; right: 0; width: 100%; height: 20rem; max-height: unset; transform: translateY(-55%); }
.cfcb-address { margin-bottom: 4rem; }
.cfcc-con label { z-index: 2; display: block; margin-bottom: .5rem; font-size: .75rem; color: var(--muted); }
.cfcc-con input[type="text"], .cfcc-con textarea { padding: .4rem .5rem; vertical-align: top; border-color: var(--darkgray); }
.cfcb-form { padding-bottom: 1.5rem; }
.conjg-item:nth-child(even) { margin-top: 1.5rem; }
.conjg-item:nth-child(odd) { margin-bottom: 1.5rem; }
#map img { height: initial; max-width: initial; max-height: initial; vertical-align: initial; }
#map label { max-width: unset; }
.conhic-item>dt { width: 1.8rem; height: 1.8rem; flex-shrink: 0 }
.conhicd-title::after { content: ": " }
.cfcc-badge { right: 0; left: initial; z-index: 2; width: fit-content; max-width: 18rem; transform: translate(-10%, -100%); }
.top-sub-nav>li { height: 100%; }
.top-sub-nav span { position: absolute !important; top: 100%; left: 1.3rem; width: 18rem; padding: 3rem; transition: top .25s, opacity .25s; text-align: center; pointer-events: none; opacity: 0; background-color: white; }
.top-sub-nav span>img { max-width: 9rem; }
.top-sub-nav a:hover span { top: 100%; opacity: 1; }
.conj-con input[type="text"] { padding: 1rem var(--px); margin-bottom: 1rem; font-size: .9rem; line-height: 1rem; border: 0; border-bottom: 1px solid var(--primary); background-color: initial; --px: 3rem; }
.conj-con label { top: 1rem; left: 0; font-size: .9rem; line-height: 1rem; color: var(--primary); }
.conj-con .cfcc-desc { margin: 0; --l: 3rem; }
.conj-con .cfcc-desc label { position: relative; top: initial; line-height: var(--l); }
.conj-con .cfcc-desc textarea { height: calc(100% - var(--l) - 1rem); padding: 1rem 0; font-size: .9rem; line-height: 1.6; border: 0; border-top: 1px solid var(--primary); border-bottom: 1px solid var(--primary); background-color: initial; }

/* services */
.serhli-con:nth-child(even) { background-color: var(--silver); }
.serhi-img { width: 14rem; flex-shrink: 1; }
.serhi-txt { flex-grow: 1; }
.serhli-con:nth-child(odd) .serhi-img { margin-right: 6vw; }
.serhli-con:nth-child(even) .serhi-img { margin-left: 6vw; order: 2; }

/* search */
.search-title { padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px dotted var(--primary); }
.search-title h3 { font-family: "ikeasbi"; font-size: 1.7rem; }
.search-products .subject { display: inline-block; padding-right: 1.5rem; padding-left: 1.5rem; margin-top: .5rem; font-size: .85rem; line-height: 1.5rem; color: var(--primary); border: 1px solid var(--primary); border-radius: .75rem; }
.search-products .overview { font-family: var(--font-system); font-size: .7rem; color: var(--primary); }
.search-list a { padding-bottom: 1rem; margin-top: 1rem; margin-bottom: 1rem; }
.search-list a:hover { background-color: rgb(248, 248, 248); box-shadow: .35rem .35rem .75rem rgba(0, 0, 0, .1); }
.search-list a:hover .subject, .search-list a:hover .overview { color: var(--muted); border-color: var(--muted); }
.search-count { align-items: flex-end; justify-content: space-between; }
.search-home .top-search input[type="text"] { color: var(--normal); }
.ressub-nav a { border-bottom: 2px solid transparent; }
.ressub-nav a.active { color: var(--primary); border-color: var(--primary); }
.seares-products.prodh-list { --tis: .9rem; --tss: 2rem; }
.hide-nav .top-nav { display: none; }
.hide-nav body { padding: 0; }
.fancybox-slide--iframe .fancybox-content { background-color: transparent; }
.fancybox-is-open .fancybox-bg { opacity: 1; background-color: black; }
.fancybox-toolbar { visibility: visible !important; opacity: 1 !important; }
.fancybox-button--close { display: flex; width: 2.8rem; height: 2.8rem; padding: 5px; margin: 0; font-size: 1.2rem; transition: all .25s ease; color: white; border: 2px solid white; border-radius: 100%; background-color: transparent; align-items: center; justify-content: center; }
.fancybox-button--close svg { display: none; }
.fancybox-button--close:before { font-family: "cxany"; content: "\c0009"; }
.fancybox-button--close:hover { transform: rotate(90deg); color: var(--primary); border-color: var(--primary); }
.fancybox-button--zoom, .fancybox-close-small { display: none !important; }
.fancy-parent .fancybox-container { position: absolute; }
.fancy-parent .fancybox-slide--html { padding: 0; }
.fancybox-container { max-width: 100vw; }
.waiting_agree, .waiting_agree body { overflow: hidden; height: 100vh; }
.waiting_agree .agree-frame { z-index: 99990; pointer-events: unset; display: flex; }
.agree-frame { position: fixed; display: none; z-index: -9999999; left: 0; top: 0; overflow: hidden; width: 100vw; height: 100vh; justify-content: center; align-items: center; }
.agree-frame:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: var(--primary); opacity: .6; }
.agree-img { width: 16rem; }
.agree-frame input[type="radio"] { width: 1rem; height: 1rem; margin-top: -1px; cursor: pointer; }
.agree-frame input[type="radio"]:before { border-radius: 100%; border: 1px solid white; }
.agree-submit { cursor: pointer; }
.agree-btn a, .cookies-settings .b-bcb { border-radius: 3px!important; --px: 1rem; min-width: initial; }
.fancy-cookies .fancybox-bg { opacity: .25 }
.fancy-cookies .fancybox-toolbar { display: none; }
.cookies-settings { width: 25rem; max-width: 100%; }
.cookies-set-list dd>h4 { background-color: var(--silver); cursor: pointer; }
.cookies-set-list dd>div { border: 1px solid var(--silver); display: none; }
.cookies-set-list dd { margin-bottom: 1px; }
.cookies-set-list dd.active>div { display: block; }
.fancy-cookies .fancybox-content { padding: 1.25rem 1.75rem; margin-bottom: 15%; border-radius: 3px; max-width: 90vw; }

/* error 404 */
.error-404 { height: 100vh; }
.page-404 .b-bc { --py: .25rem; }
.page-404-badges { width: 8rem; left: initial; right: 0; top: 0; transform: translate(50%, -50%); }

/* archive */
.arch-content { color: var(--link) }
.arch-content h1, .arch-content h2, .arch-content h3, .arch-content h4 { color: var(--dark) }
.archive-title hr.with-line::before { height: .25rem; }
.arch-faq-list { border-bottom: 1px solid var(--darkgray) }
.archfaq-item { border-top: 1px solid var(--darkgray) }
.archfaq-item .ajl-content>div { padding: 0; background-color: initial; }
.archfaqi-con { color: var(--link) }
.archfaqi-con p { margin-bottom: 1em; }
.archfaqi-con p strong { color: var(--primary); font-size: 118% }
.archfaq-item [aria-expanded="true"] .bnav-icon::before  { content:"\c014" }
.archive-sitemap .archive-title hr.with-line::before { height: 1px; width: 100%; background-color: var(--darkgray) }

/*.compensate-for-scrollbar { margin-right: 0!important }*/
.form-message { z-index: -9; display: none; visibility: hidden; height: 0; font-size: 0; line-height: 0; }
input { outline: none !important; }
input[type="text"], textarea { z-index: 1; padding: 0 .8rem; transition: all .5s ease; border: 1px solid rgb(198, 198, 198); background-color: white; }
textarea { padding-top: .9rem; padding-bottom: .9rem; }
input[type="text"] { padding-top: .9rem; padding-bottom: .9rem; }
input[type="text"].error, textarea.error, input[type="text"]:focus, textarea:focus { border-color: var(--primary); }
