html, body { width: 100%; }
html { font-family: sans-serif; line-height: 1.15; box-sizing: border-box; text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
body { margin: 0px; color: rgba(0, 0, 0, 0.6); font-size: 14px; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-variant: tabular-nums; font-weight: 400; line-height: 1.5; background-color: rgb(255, 255, 255); font-feature-settings: "tnum"; }
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; }
*, ::before, ::after { box-sizing: inherit; }
[tabindex="-1"]:focus { outline: none !important; }
hr { box-sizing: content-box; height: 0px; overflow: visible; }
h1, h2, h3, h4, h5, h6 { margin-top: 0px; margin-bottom: 0px; color: rgba(0, 0, 0, 0.6); font-weight: 500; }
.h1, .h2, .h3, .h4, .h5, .h6 { font-family: inherit; font-weight: 400; line-height: 1.5; margin-bottom: 0px; }
p { margin-top: 0px; margin-bottom: 0px; }
abbr[title], abbr[data-original-title] { text-decoration: underline dotted; border-bottom: 0px; cursor: help; }
address { margin-bottom: 1em; font-style: normal; line-height: inherit; }
input[type="text"], input[type="password"], input[type="number"], textarea { appearance: none; }
ol, ul, dl { margin: 0px; padding: 0px; }
dt { font-weight: 500; }
dd { margin-bottom: 0.5em; margin-left: 0px; }
li { list-style: none; }
blockquote { margin: 0px 0px 1em; }
dfn { font-style: italic; }
b, strong { font-weight: bolder; }
small { font-size: 80%; }
sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
a { text-decoration: none; background-color: transparent; outline: 0px; cursor: pointer; transition: color 0.3s; }
a:focus { text-decoration: none; text-decoration-skip-ink: auto; }
a:hover { text-decoration: none; outline: 0px; }
a[disabled] { cursor: not-allowed; pointer-events: none; }
pre, code, kbd, samp { font-size: 1em; font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace; }
pre { margin-top: 0px; margin-bottom: 1em; overflow: auto; }
figure { margin: 0px 0px 1em; }
img { vertical-align: middle; border-style: none; max-width: 100%; display: block; }
svg:not(:root) { overflow: hidden; }
a, area, button, [role="button"], input:not([type="range"]), label, select, summary, textarea { touch-action: manipulation; }
table { border-collapse: collapse; }
caption { padding-top: 0.75em; padding-bottom: 0.3em; color: rgba(0, 0, 0, 0.45); text-align: left; caption-side: bottom; }
th { text-align: inherit; }
input, button, select, optgroup, textarea { margin: 0px; color: inherit; font-size: inherit; font-family: inherit; line-height: inherit; outline: 0px; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, html [type="button"], [type="reset"], [type="submit"] { appearance: button; }
input[type="radio"], input[type="checkbox"] { box-sizing: border-box; padding: 0px; }
input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] { appearance: listbox; }
textarea { overflow: auto; resize: vertical; }
fieldset { min-width: 0px; margin: 0px; padding: 0px; border: 0px; }
legend { display: block; width: 100%; max-width: 100%; margin-bottom: 0.5em; padding: 0px; color: inherit; font-size: 1.5em; line-height: inherit; white-space: normal; }
progress { vertical-align: baseline; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }
[type="search"] { outline-offset: -2px; appearance: none; }
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { appearance: none; }
::-webkit-file-upload-button { font: inherit; appearance: button; }
output { display: inline-block; }
summary { display: list-item; }
template { display: none; }
[hidden] { display: none !important; }
mark { padding: 0.2em; background-color: rgb(254, 255, 230); }
::selection { color: rgb(255, 255, 255); background: rgb(234, 34, 45); }
a[title="站长统计"] { display: none; }
.clearfix::before, .clearfix::after { content: " "; display: table; }
.clearfix { clear: both; }
.center-block { display: block; margin-left: auto; margin-right: auto; }
.pull-right { float: right; }
.pull-left { float: left; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); border: 0px; }
.sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0px; overflow: visible; clip: auto; }
.invisible { visibility: hidden; }
.text-hide { color: transparent; text-shadow: none; background-color: transparent; border: 0px; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.text-nowrap { white-space: nowrap; }
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-lowercase { text-transform: lowercase; }
.text-uppercase { text-transform: uppercase; }
.text-capitalize { text-transform: capitalize; }
.c-flex { display: flex; flex-wrap: wrap; -webkit-box-align: center; align-items: center; }
.just-betw { justify-content: space-between; }
.just-cen { justify-content: center; }
.just-around { justify-content: space-around; }
.align-start { align-items: flex-start; }
.align-base { align-items: baseline; }
.overflow-hidden { overflow: hidden; }
input:-webkit-autofill { box-shadow: white 0px 0px 0px 1000px inset !important; }
svg.icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentcolor; overflow: hidden; }
.unable-to-interact { cursor: not-allowed; pointer-events: none; }
hr { margin-top: 16px; margin-bottom: 16px; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(0, 0, 0, 0.1) currentcolor currentcolor; border-image: none; }
#app { opacity: 0; transition: opacity 0.4s; }
#app.ready { opacity: 1; }
.center { text-align: center; }
#pageMain { overflow: hidden; }
.page-main { padding-top: 85px; }
.page-main.notop { padding-top: 0px; }
::-webkit-input-placeholder { color: rgb(205, 205, 205); }
.c-imghover { overflow: hidden; }
.c-imghover .c-imghover-item { transition: transform 0.4s ease-out, -webkit-transform 0.4s ease-out; }
@media only screen and (min-width: 961px) {
  .c-imghover:hover .c-imghover-item { transition: transform 1.2s ease-out, -webkit-transform 1.2s ease-out; transform: scale(1.1); }
}
@media only screen and (max-width: 1150px) {
  .page-main.notop { padding-top: 60px; }
}
.f34 { font-size: 34px; }
.f36 { font-size: 36px; }
.f42 { font-size: 42px; }
.f56 { font-size: 56px; }
.f60 { font-size: 60px; }
h1, .h1 { font-size: 30px; }
h2, .h2 { font-size: 28px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 20px; }
h5, .h5 { font-size: 18px; }
h6, .h6 { font-size: 16px; }
.fc33 { color: rgb(51, 51, 51); }
.fc66 { color: rgb(102, 102, 102); }
.fc99 { color: rgb(153, 153, 153); }
.fcff { color: rgb(255, 255, 255); }
.fred { color: rgb(216, 12, 30); }
.fl225 { line-height: 2.25; }
.fl1875 { line-height: 1.875; }
.richtext img { max-width: 100%; height: auto; }
.richtext p { margin-bottom: 1em; }
.richtext p:last-child { margin-bottom: 0px; }
.richtext p[style*="text-align: center"], .richtext p[style*="text-align:center"] { text-indent: 0px !important; }
.richtext p[style*="text-align: center"] img, .richtext p[style*="text-align:center"] img { display: inline-block; }
.fl172 { line-height: 1.72; }
.fw600 { font-weight: 600; }
@media only screen and (max-width: 1600px) {
  .f56 { font-size: 50px; }
  .f60 { font-size: 54px; }
}
@media only screen and (max-width: 1480px) {
  .f56 { font-size: 46px; }
  .f60 { font-size: 48px; }
}
@media only screen and (max-width: 1400px) {
  .f56 { font-size: 42px; }
  .f60 { font-size: 42px; }
}
@media only screen and (max-width: 1280px) {
  .f56 { font-size: 36px; }
  .f60 { font-size: 36px; }
}
@media only screen and (max-width: 1200px) {
  .f56 { font-size: 32px; }
  .f60 { font-size: 32px; }
  .f42 { font-size: 40px; }
  .f36 { font-size: 34px; }
  .f34 { font-size: 32px; }
  h1, .h1 { font-size: 28px; }
  h2, .h2 { font-size: 26px; }
  h3, .h3 { font-size: 22px; }
  h4, .h4 { font-size: 18px; }
  h5, .h5 { font-size: 16px; }
  h6, .h6 { font-size: 15px; }
}
@media only screen and (max-width: 960px) {
  .f56 { font-size: 28px; }
  .f60 { font-size: 28px; }
  .f42 { font-size: 36px; }
  .f36 { font-size: 30px; }
  .f34 { font-size: 28px; }
  h1, .h1 { font-size: 26px; }
  h2, .h2 { font-size: 24px; }
  h3, .h3 { font-size: 20px; }
  h4, .h4 { font-size: 17px; }
}
@media only screen and (max-width: 640px) {
  .f56 { font-size: 24px; }
  .f60 { font-size: 24px; }
  .f42 { font-size: 28px; }
  .f36 { font-size: 24px; }
  .f34 { font-size: 20px; }
  h1, .h1 { font-size: 20px; }
  h2, .h2 { font-size: 18px; }
  h3, .h3 { font-size: 18px; }
  h4, .h4 { font-size: 16px; }
  h5, .h5 { font-size: 15px; }
  h6, .h6 { font-size: 14px; }
}
.width1400 { width: 100%; max-width: 1400px; margin: 0px auto; }
.width1270 { max-width: 1270px; width: 80%; margin: 0px auto; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt55 { margin-top: 55px; }
.pt45 { padding-top: 45px; }
.pb45 { padding-bottom: 45px; }
.pt60 { padding-top: 60px; }
.pb60 { padding-bottom: 60px; }
.bg { overflow: hidden; position: relative; }
.bg_img { position: absolute; top: 50%; left: 50%; height: 100%; max-width: 1e+06px; transform: translate(-50%, -50%); transition: 0.4s; }
.scroll_top { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: rgb(226, 0, 22); position: fixed; right: 1%; bottom: 20%; border-radius: 3px; z-index: 99; opacity: 0; transition: 0.4s; }
.scroll_top.active { opacity: 1; }
.lists-hide { display: flex; justify-content: center; flex-direction: column; align-items: center; width: 100%; }
.lists-hide img { max-width: 600px; margin: 80px 0px 20px; }
.lists-hide p { font-size: 16px; }
.page_ftit { font-weight: 300; margin-top: 4px; color: rgb(170, 170, 170); }
.bread { background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.06) 0px 4px 4px 0px; }
.bread .width1400 { height: 70px; }
.bread .width1400 .item-r { height: 100%; }
.bread .item-r .item { position: relative; margin-right: 56px; display: flex; align-items: center; height: 100%; color: rgb(51, 51, 51); }
.bread .item-r .item::after { content: ""; display: block; width: 100%; height: 3px; background: rgb(216, 12, 30); position: absolute; left: 0px; bottom: 0px; transform: scale(0); transition: 0.4s; }
.bread .item-r .item:last-child { margin-right: 0px; }
.bread .item-r .item.active { color: rgb(216, 12, 30); }
.bread .item-r .item.active::after { transform: scale(1); }
.bread .bread_box { height: 64px; }
.bread .bread_box::before { content: ""; display: block; width: 15px; height: 17px; background: url("../assets/162-bread_home.png") center center / cover no-repeat; margin-right: 10px; }
.bread_box .item::after { content: ""; display: block; width: 4px; height: 9px; background: url("../assets/163-bread_next.png") center center / cover no-repeat; margin: 0px 12px; box-sizing: border-box; }
.bread_box .item:last-child a { color: rgb(216, 12, 30); }
.bread_box .item:last-child::after { display: none; }
.bread_box .item a { color: rgb(51, 51, 51); }
.page-banner { position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; height: 360px; margin-top: 0px; }
.page-banner__img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; object-position: center center; transform: scale(1.06); animation: 10s ease-out 0s 1 normal forwards running pageBannerZoom; }
@keyframes pageBannerZoom { 
  100% { transform: scale(1); }
}
.page-banner__mask { position: absolute; inset: 0px; background: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.55)); z-index: 1; }
.page-banner__content { position: relative; z-index: 10; text-align: center; color: rgb(255, 255, 255); padding: 0px 24px; animation: 0.9s ease-out 0.2s 1 normal both running pageBannerIn; }
@keyframes pageBannerIn { 
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0px); }
}
.page-banner__title { font-size: 56px; font-weight: 800; margin: 0px 0px 16px; color: rgb(255, 255, 255); letter-spacing: 4px; text-shadow: rgba(0, 0, 0, 0.3) 0px 2px 10px; line-height: 1.35; }
.page-banner__subtitle { margin: 0px; font-size: 20px; line-height: 1.5; color: rgb(255, 255, 255); opacity: 0.8; letter-spacing: 2px; }
@media only screen and (max-width: 1366px) {
  .bread .item-r .item { margin-right: 48px; }
}
@media only screen and (max-width: 1280px) {
  .width1270 { width: 82%; }
  .bread .item-r .item { margin-right: 40px; }
}
@media only screen and (max-width: 1043px) {
  .bread .item-r .item { margin-right: 32px; }
}
@media only screen and (max-width: 960px) {
  .bread .item-r .item { margin-right: 20px; }
  .bread .width1400 .item-r { display: none; }
}
@media only screen and (max-width: 768px) {
  .fl225 { line-height: 1.875; }
}
@media only screen and (max-width: 960px) {
  .pb45 { padding-bottom: 40px; }
  .pt45 { padding-top: 35px; }
  .pb60 { padding-bottom: 50px; }
}
@media only screen and (max-width: 768px) {
  .width1270 { width: 92%; }
  .bread { display: none; }
  .page-banner { height: 220px; }
  .page-banner__title { font-size: 28px; margin-bottom: 12px; }
  .page-banner__subtitle { font-size: 14px; }
  .mt40 { margin-top: 25px; }
  .pb60 { padding-bottom: 30px; }
  .pt60 { padding-top: 30px; }
  .mt55 { margin-top: 25px; }
  .mt30 { margin-top: 25px; }
  .pb45 { padding-bottom: 30px; }
  .pt45 { padding-top: 25px; }
  .page_desc { text-align: center; }
  .lists-hide img { margin: 25px 0px 20px; width: 62%; }
  .page_tit { text-align: center; }
}
.culture_lists .list { height: 260px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 26px 0px; padding: 0px 2.5%; box-sizing: border-box; display: flex; align-items: center; margin-right: 2.57%; margin-top: 40px; transition: 0.4s; }
.culture_lists .list .box { position: relative; width: 100%; }
.culture_lists .tit { font-weight: bold; color: rgb(216, 12, 30); }
.culture_lists .text { margin-top: 28px; }
.culture-page .text p { margin: 0px 0px 6px; }
.culture-page .text p:last-child { margin-bottom: 0px; }
.culture_lists .list .icon { max-width: 128px; position: absolute; right: 2.25%; top: 50%; transform: translateY(-50%); transition: 0.4s; }
.culture_lists2 .list { width: 48.715%; }
.culture_lists2 .list:nth-child(2n) { margin-right: 0px; }
.culture_lists3 .list { width: 31.62%; }
.culture_lists3 .list { width: 31.62%; }
.culture_lists3 .list:nth-child(3n) { margin-right: 0px; }
@media only screen and (min-width: 961px) {
  .culture_lists .list:hover { box-shadow: rgba(0, 0, 0, 0.12) 0px 8px 32px; transform: translateY(-4px); }
  .culture_lists .list:hover .icon { transform: translateY(-50%) scale(1.05); }
}
@media only screen and (max-width: 1400px) {
  .culture_lists .list { padding: 0px 3%; }
  .culture_lists .list .icon { right: 0px; }
}
@media only screen and (max-width: 1280px) {
  .culture_lists .list .icon { max-width: 120px; }
}
@media only screen and (max-width: 1200px) {
  .culture_lists .list { height: 242px; }
  .culture_lists .text { margin-top: 20px; }
}
@media only screen and (max-width: 1024px) {
  .culture_lists .list .icon { max-width: 96px; }
  .culture_lists .text { margin-top: 15px; }
  .culture_lists .list { height: 224px; }
}
@media only screen and (max-width: 960px) {
  .culture_lists .list { padding: 0px 18px; }
  .culture_lists .list .icon { max-width: 82px; }
}
@media only screen and (max-width: 768px) {
  .culture_lists .list { min-height: 196px; width: 100%; margin-right: 0px; margin-top: 20px; padding: 20px 18px; height: auto; }
  .culture_lists .list .icon { max-width: 70px; }
  .culture_lists .lists .list { text-align: center; }
}
.primary-red { color: rgb(226, 0, 22); }
.bg-primary-red { background-color: rgb(226, 0, 22); }
.border-primary-red { border-color: rgb(226, 0, 22); }
.nav-link::after { content: ""; position: absolute; width: 0px; height: 2px; bottom: -4px; left: 0px; background-color: rgb(226, 0, 22); transition: width 0.3s; }
.nav-link:hover { color: rgb(226, 0, 22); }
.nav-link:hover::after { width: 100%; }
.glass-effect { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); }
.reveal { opacity: 0; transform: translateY(20px); transition: 0.8s ease-out; }
.reveal.active { opacity: 1; transform: translateY(0px); }
.carousel-slide { position: absolute; inset: 0px; opacity: 0; transition: opacity 1s ease-in-out; }
.carousel-slide.active { opacity: 1; }
.carousel-btn { transition: 0.3s; }
.carousel-btn:hover { background: rgba(196, 30, 36, 0.9); }
.carousel-dot { transition: 0.3s; }
.carousel-dot.active { background: rgb(226, 0, 22); width: 32px; border-radius: 4px; }
.industrial-bg { position: absolute; inset: 0px; overflow: hidden; opacity: 0.05; pointer-events: none; z-index: 0; }
.industrial-bg svg { width: 100%; height: 100%; }
.red-divider { width: 40px; height: 3px; background-color: rgb(226, 0, 22); }
@media (min-width: 768px) {
  h1.md\:text-6xl { line-height: 1.2; letter-spacing: 5px; }
}
@media (max-width: 1280px) {
  .space-x-14 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(3rem * var(--tw-space-x-reverse)) !important; margin-left: calc(3rem * calc(1 - var(--tw-space-x-reverse))) !important; }
}
@media (max-width: 768px) {
  .mb-4 { margin-bottom: 15px !important; }
  .mb-6 { margin-bottom: 15px !important; }
  .mb-8 { margin-bottom: 15px !important; }
  .mt-8 { margin-top: 20px !important; }
  .mt-10 { margin-top: 20px !important; }
  .mb-10 { margin-bottom: 20px !important; }
  .mb-12 { margin-bottom: 24px !important; }
  .mb-14 { margin-bottom: 25px !important; }
  .py-24 { padding-top: 30px !important; padding-bottom: 30px !important; }
  .px-6 { padding-left: 15px !important; padding-right: 15px !important; }
  .p-10 { padding: 20px !important; }
  .bottom-20 { bottom: 20px !important; }
  .gap-16 { gap: 25px !important; }
  .advice_btns { display: none !important; }
  .carousel-btn { display: none !important; }
  .index_banner { touch-action: pan-y; user-select: none; height: 320px !important; }
}
.page_header .logo { width: 13rem; }
.page_header .logo .logo-link { display: block; width: 100%; }
.page_header .logo img { display: block; width: 100%; height: auto; }
.page_header .page-nav-hid { position: absolute; left: 50%; top: 60px; margin-left: -80px; width: 160px; opacity: 0; visibility: hidden; transform: scaleY(0); transform-origin: center top; transition: transform 0.3s, opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s; z-index: 9999; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px 0px; }
.page_header .page-nav-hid .link { text-align: center; color: rgb(102, 102, 102); background: rgb(255, 255, 255); position: relative; line-height: 40px; font-size: 14px; transition: background-color 0.4s, color 0.4s; display: block; }
.other { position: relative; }
.other .langure::before { content: ""; display: block; width: 26px; height: 26px; background: url("https://www.xy-oss.com/img/lang_icon.png") center center / cover no-repeat; margin-right: 12px; }
.other .langure::after { content: ""; display: block; width: 14px; height: 8px; background: url("https://www.xy-oss.com/img/langure_next.png") center center / cover no-repeat; margin-left: 10px; }
.other:hover .page-nav-hid { transform: scaleY(1); opacity: 1; visibility: visible; }
.page-nav-hid .link:hover { background: rgb(226, 0, 22); color: rgb(255, 255, 255); }
.head-phone { display: none; height: 60px; position: absolute; top: 0px; left: 0px; z-index: 99; width: 100%; transition: transform 0.3s, -webkit-transform 0.3s; background: rgb(255, 255, 255); }
.head-phone.sc-head { background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.2) -4px 4px 5px; }
.head-phone .width1400 { -webkit-box-pack: justify; justify-content: space-between; display: flex; -webkit-box-align: center; align-items: center; height: 60px; }
.head-phone .logo { display: flex; -webkit-box-align: center; align-items: center; }
.head-phone .logo img { height: 28px; }
.head-phone .nav-toggle-list { cursor: pointer; }
.head-phone .nav-toggle-list span { width: 30px; height: 2px; background-color: rgb(255, 255, 255); border-radius: 1.5px; display: block; }
.head-phone .nav-toggle-list span:first-of-type { top: 0px; }
.head-phone .nav-toggle-list span:nth-child(2) { opacity: 1; margin-top: 8px; }
.head-phone .nav-toggle-list span:nth-child(3) { width: 15px; margin-top: 8px; }
.head-phone .item-r a { margin-right: 10px; }
.head-phone .item-r a:last-child { margin-right: 0px; }
.head-phone .phonenav { position: fixed; inset: 60px 0px 0px; width: 100%; z-index: 99; background: rgb(255, 255, 255); display: none; }
.head-phone .phonenav a { display: block; text-align: left; font-size: 16px; line-height: 50px; border-bottom: 1px dashed rgb(210, 191, 175); padding: 0px 20px; box-sizing: border-box; }
.mbnav-btn { width: 60px; height: 60px; position: absolute; right: 0px; top: 0px; cursor: pointer; overflow: hidden; transition: 0.4s ease-out; display: none; }
.mbnav-btn-list { width: 30px; height: 18px; position: absolute; top: 21px; right: 15px; }
.mbnav-btn-item { position: absolute; right: 0px; width: 100%; height: 2px; background-color: rgb(102, 102, 102); border-radius: 1.5px; transition: 0.3s; }
.mbnav-btn-item:nth-of-type(1) { top: 0px; }
.mbnav-btn-item:nth-of-type(2) { top: 8px; }
.mbnav-btn-item:nth-of-type(3) { width: 50%; top: 16px; }
.mbnav { position: fixed; inset: 0px; z-index: 100; opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; overflow: hidden; }
.mbnav ::-webkit-scrollbar { width: 0px; height: 0px; background-color: rgba(255, 255, 255, 0); }
.mbnav .data { display: none; }
.mbnav .bg { position: absolute; inset: 0px; z-index: 0; }
.mbnav .main { position: absolute; right: 0px; top: 0px; z-index: 1; width: 240px; height: 100%; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px 0px; overflow: hidden; transform: translateX(100%); transition: transform 0.3s, -webkit-transform 0.3s; }
.mbnav .header { background-color: rgb(226, 0, 22); }
.mbnav .tel { padding: 0px 20px; line-height: 60px; color: rgb(255, 255, 255); display: flex; -webkit-box-align: center; align-items: center; font-size: 18px; font-family: Gothicb, Arial, Helvetica, sans-serif; }
.mbnav .tel .iconfont { display: inline-block; color: rgb(255, 255, 255); width: 12px; height: 12px; border-style: solid; border-width: 0px 1px 1px 0px; transform: rotate(135deg); font-size: 22px; margin-right: 6px; }
.mbnav .search { display: flex; flex-wrap: wrap; -webkit-box-align: center; align-items: center; padding: 0px 20px; height: 60px; line-height: 60px; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; background: rgb(210, 191, 175); }
.mbnav .search .submit { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; outline: none; background: none 0% 0% / 20px auto; padding: 0px; width: 22px; height: 60px; color: rgb(255, 255, 255); font-size: 22px; }
.mbnav .search .input { width: calc(100% - 22px); height: 60px; line-height: 1.5; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 0px 0px 0px 12px; outline: none; color: rgb(255, 255, 255); font-size: 16px; background: none; }
.mbnav .search ::-webkit-input-placeholder { color: rgb(255, 255, 255); }
.mbnav .item { display: block; height: 50px; line-height: 50px; padding: 0px 20px; font-size: 15px; border-bottom: 1px solid rgb(242, 242, 242); color: rgb(119, 119, 119); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; }
.mbnav .item.sub { padding-right: 40px; }
.mbnav .item.sub::after { content: ""; position: absolute; right: 16px; top: 50%; display: inline-block; border-right: 1px solid rgb(119, 119, 119); border-bottom: 1px solid rgb(119, 119, 119); width: 9px; height: 9px; transform: rotate(-45deg); margin-top: -4.5px; }
.mbnav .slist { position: fixed; top: 0px; right: 0px; z-index: 1; width: 240px; height: 100%; transform: translateX(100%); }
.mbnav .sitem { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-color: rgb(255, 255, 255); opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s, transform 0.3s, -webkit-transform 0.3s; }
.mbnav .sitem.active { transform: translateX(-100%); opacity: 1; visibility: visible; }
.mbnav .tit { font-size: 16px; line-height: 60px; padding-right: 20px; padding-left: 40px; text-align: right; background-size: 7px auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background-color: rgb(242, 242, 242); position: relative; }
.mbnav .tit::before { content: ""; position: absolute; left: 16px; top: 50%; display: inline-block; border-left: 1px solid rgb(119, 119, 119); border-top: 1px solid rgb(119, 119, 119); width: 10px; height: 10px; transform: rotate(-45deg); margin-top: -4.5px; }
.langure_box { position: absolute; bottom: 0px; left: 0px; width: 100%; }
.langure_title { display: flex; align-items: center; justify-content: center; margin: 35px auto 15px; font-size: 16px; }
.langure_title::before { content: ""; display: block; width: 26px; height: 26px; background: url("https://www.xy-oss.com/img/lang_icon.png") center center / cover no-repeat; margin-right: 10px; }
.langure_box .item { display: flex; align-items: center; justify-content: space-between; height: 50px; line-height: 50px; padding: 0px 20px; font-size: 15px; border-bottom: 1px solid rgb(242, 242, 242); color: rgb(119, 119, 119); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; }
.langure_box .item_box { display: flex; align-items: center; }
.langure_box .item .icon { margin-right: 5px; }
.langure_box .item .icon img { width: 25px; display: flex; align-items: center; justify-content: center; }
.langure_active { width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; opacity: 0; }
.langure_active::before { content: ""; display: block; width: 18px; height: 18px; background: url("https://www.xy-oss.com/img/flag_active.svg") center center / cover no-repeat; }
.langure_box .item.active .langure_active { opacity: 1; }
@-webkit-keyframes phone-navtop-animon { 
  0% { top: 0px; transform: rotate(0deg); }
  50% { top: 8px; transform: rotate(0deg); }
  100% { top: 8px; transform: rotate(45deg); }
}
@keyframes phone-navtop-animon { 
  0% { top: 0px; transform: rotate(0deg); }
  50% { top: 8px; transform: rotate(0deg); }
  100% { top: 8px; transform: rotate(45deg); }
}
@-webkit-keyframes phone-navbottom-animon { 
  0% { width: 50%; top: 16px; transform: rotate(0deg); }
  50% { width: 100%; top: 8px; transform: rotate(0deg); }
  100% { width: 100%; top: 8px; transform: rotate(-45deg); }
}
@keyframes phone-navbottom-animon { 
  0% { width: 50%; top: 16px; transform: rotate(0deg); }
  50% { width: 100%; top: 8px; transform: rotate(0deg); }
  100% { width: 100%; top: 8px; transform: rotate(-45deg); }
}
@-webkit-keyframes phone-navtop-animoff { 
  0% { top: 8px; transform: rotate(45deg); }
  50% { top: 8px; transform: rotate(0deg); }
  100% { top: 0px; transform: rotate(0deg); }
}
@keyframes phone-navtop-animoff { 
  0% { top: 8px; transform: rotate(45deg); }
  50% { top: 8px; transform: rotate(0deg); }
  100% { top: 0px; transform: rotate(0deg); }
}
@-webkit-keyframes phone-navbottom-animoff { 
  0% { width: 100%; top: 8px; transform: rotate(-45deg); }
  50% { width: 100%; top: 8px; transform: rotate(0deg); }
  100% { width: 50%; top: 16px; transform: rotate(0deg); }
}
@keyframes phone-navbottom-animoff { 
  0% { width: 100%; top: 8px; transform: rotate(-45deg); }
  50% { width: 100%; top: 8px; transform: rotate(0deg); }
  100% { width: 50%; top: 16px; transform: rotate(0deg); }
}
@media only screen and (max-width: 1150px) {
  .mbnav-btn { display: block; }
  body.mbNavOpen .mbnav-btn-item:nth-of-type(1) { animation: 0.4s linear 0s 1 normal forwards running phone-navtop-animon; }
  body.mbNavOpen .mbnav-btn-item:nth-of-type(2) { opacity: 0; }
  body.mbNavOpen .mbnav-btn-item:nth-of-type(3) { animation: 0.4s linear 0s 1 normal forwards running phone-navbottom-animon; }
  body.mbNavOpen .mbnav { opacity: 1; visibility: visible; }
  body.mbNavOpen .mbnav .main { transform: translateX(0px); }
  body.mbNavOpen .page-header { transform: translateX(-240px); }
  body.mbNavOff .mbnav-btn-item:nth-of-type(1) { animation: 0.4s linear 0s 1 normal forwards running phone-navtop-animoff; }
  body.mbNavOff .mbnav-btn-item:nth-of-type(2) { opacity: 1; transition: opacity 0.2s linear 0.2s; }
  body.mbNavOff .mbnav-btn-item:nth-of-type(3) { animation: 0.4s linear 0s 1 normal forwards running phone-navbottom-animoff; }
  body.mbNavOff .mbnav { opacity: 0; visibility: hidden; }
  body.mbNavOff .mbnav .main { transform: translateX(100%); }
}
@media only screen and (max-width: 1150px) {
  .head-phone { display: block; }
  .page_header { display: none; }
  .page-main { padding-top: 60px; }
}
footer { background: rgb(0, 0, 0); }
.foot_log { width: 13rem; }
.foot_top { padding: 68px 0px 55px; box-sizing: border-box; background: rgb(239, 239, 239); }
.foot_top .content { max-width: 282px; }
.foot_con { color: rgb(51, 51, 51); }
.cmp_optional .link { margin-right: 24px; transition: 0.4s; }
.cmp_optional .link img { max-width: 20px; }
.cmp_optional .link:hover { transform: translateY(-5px); }
.cmp_optional .link:hover { color: rgb(226, 0, 22); }
.foot_top .foot_top_items { max-width: 1045px; width: 67%; }
.foot_top .text { color: rgb(51, 51, 51); margin-bottom: 18px; transition: 0.4s; }
.foot_top .text .text_tit { width: 28px; height: 28px; border-radius: 50%; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.7); display: none; }
.foot_top .text .text_tit img { max-width: 15px; }
.foot_top .text .text_text { padding-left: 0px; box-sizing: border-box; }
.foot_top .item:last-child { width: 295px; }
.foot_top .item a { display: block; }
.foot_top .tit { font-weight: bold; color: rgb(51, 51, 51); margin-bottom: 25px; }
.foot_top .item .link { color: rgb(51, 51, 51); margin-bottom: 18px; transition: 0.4s; }
.foot_top .item .link:last-child { margin-bottom: 0px; }
.foot_top .item .link:hover { transform: translateX(5px); color: rgb(226, 0, 22); }
.copyright { background: rgb(226, 0, 22); }
.copyright .width1400 { height: 65px; }
.copyright .copyright-l { color: rgb(255, 255, 255); }
.copyright .copyright-l a { color: rgb(255, 255, 255); }
.record { color: rgb(255, 255, 255); transition: 0.4s; margin-left: 20px; }
.record:hover { transform: translateX(5px); }
@media only screen and (max-width: 1280px) {
  .foot_top .foot_top_items { width: 70%; }
}
@media only screen and (max-width: 1130px) {
  .foot_top .content { max-width: 236px; }
  .foot_top .foot_top_items { width: 73%; }
}
@media only screen and (max-width: 1024px) {
  .foot_log img { max-width: 12rem; }
  .page_header .logo { width: 12rem; }
  .foot_top .foot_top_items { width: 100%; margin-top: 45px; }
  .foot_top .content { max-width: 100%; display: flex; flex-direction: column; align-items: center; width: 100%; }
}
@media only screen and (max-width: 768px) {
  .foot_top .content { max-width: 100%; flex-direction: column; display: flex; align-items: center; }
  .text_texts { margin-top: 25px; display: none; }
  .foot_con { text-align: center; }
  .foot_top .contents { width: 100%; max-width: 100%; }
  .foot_top .foot_top_items { width: 100%; display: none; }
  .foot_top .item a { text-align: center; }
  .foot_log img { max-width: 11rem; }
  .foot_log { text-align: center; }
  .foot_top .ewm { justify-content: center; }
  .foot_top { padding: 30px 0px 25px; }
  .foot_top .ewm_img { max-width: 85px; }
  .copyright .maxwidth { height: auto; padding: 15px 0px; text-align: center; }
  .record { margin-left: 0px; margin-top: 3px; }
  .foot_top .item .tit, .foot_top .item .link { display: none; }
  .foot_top .foot_top_items .items { justify-content: center; }
  .foot_top .item:last-child { width: 100%; }
  .copyright .width1400 { height: auto; padding: 15px 0px; text-align: center; justify-content: center; }
}
.nav-link.item_social { color: rgb(226, 0, 22); }
.nav-link.item_social::after { width: 100%; }
.about-block__head { text-align: center; margin-bottom: 40px; }
.about-block__head .page_line { margin-left: auto; margin-right: auto; }
.about-block__head--left { text-align: left; }
.about-block__head--left .page_tit { text-align: left; }
.about-block__head--left .page_line { margin-left: 0px; margin-right: auto; }
.about-block__head--left .social-model-pillars__sub { text-align: left; }
.social-page .about-bread.bread { position: sticky; top: 88px; z-index: 35; background: rgb(255, 255, 255); }
.social-model-page { background: rgb(240, 240, 240); }
.social-model-page .about-block__head { margin-bottom: 32px; }
.social-model-page .about-block__head--left { margin-bottom: 28px; }
.social-model-page .social-model-hero { position: relative; overflow: hidden; background: linear-gradient(rgb(255, 255, 255) 0%, rgb(255, 255, 255) 62%, rgb(243, 243, 243) 100%); }
.social-model-hero::before { content: ""; position: absolute; top: -100px; right: -60px; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(216, 12, 30, 0.07) 0%, transparent 68%); pointer-events: none; }
.social-model-hero::after { content: ""; position: absolute; left: 0px; right: 0px; bottom: 0px; height: 1px; background: linear-gradient(90deg, transparent 0%, rgb(229, 229, 229) 18%, rgb(229, 229, 229) 82%, transparent 100%); pointer-events: none; }
.social-model-hero__wrap { position: relative; z-index: 1; }
.social-model-hero__body { display: flex; align-items: center; gap: 56px; }
.social-model-hero__visual.reveal { transition-delay: 0s; }
.social-model-hero__content.reveal { transition-delay: 0.1s; }
.social-model-hero__visual { flex: 0 0 38%; max-width: 38%; }
.social-model-hero__imgframe { position: relative; background: rgb(255, 255, 255); padding: 16px 20px; border-radius: 4px; border: 1px solid rgb(238, 238, 238); box-shadow: rgba(0, 0, 0, 0.08) 0px 10px 36px; }
.social-model-hero__imgframe img { width: 100%; display: block; }
.social-model-hero__content { flex: 1 1 0%; min-width: 0px; background: rgb(255, 255, 255); padding: 36px 40px; border-radius: 4px; border: 1px solid rgb(238, 238, 238); box-shadow: rgba(0, 0, 0, 0.05) 0px 8px 32px; }
.social-model-hero__quote { width: 52px; margin-bottom: 14px; display: block; opacity: 0.85; }
.social-model-hero__lead { line-height: 1.75; color: rgb(216, 12, 30); margin-bottom: 24px; padding-left: 16px; border-left: 3px solid rgb(216, 12, 30); }
.social-model-hero__desc { line-height: 1.875; padding-top: 24px; border-top: 1px solid rgb(240, 240, 240); }
.social-model-pillars__sub { max-width: 640px; margin-left: auto; margin-right: auto; line-height: 1.875; text-align: center; }
.social-model-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: stretch; }
.social-model-pillars .social-model-item { box-shadow: rgba(0, 0, 0, 0.07) 0px 6px 24px; }
.social-model-grid .social-model-item.reveal:nth-child(1) { transition-delay: 0s; }
.social-model-grid .social-model-item.reveal:nth-child(2) { transition-delay: 0.08s; }
.social-model-grid .social-model-item.reveal:nth-child(3) { transition-delay: 0.16s; }
.social-model-grid .social-model-item.reveal:nth-child(4) { transition-delay: 0.24s; }
.social-model-item { display: flex; flex-direction: column; height: 100%; background: rgb(255, 255, 255); padding: 32px 24px 28px; border-width: 3px 1px 1px; border-style: solid; border-color: rgb(216, 12, 30) rgb(240, 240, 240) rgb(240, 240, 240); border-image: none; border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 20px; transition: transform 0.35s, box-shadow 0.35s, border-color 0.35s; text-decoration: none; position: relative; overflow: hidden; }
.social-model-item::after { content: ""; position: absolute; right: -20px; bottom: -20px; width: 72px; height: 72px; border-radius: 50%; background: rgba(216, 12, 30, 0.04); pointer-events: none; transition: transform 0.35s; }
.social-model-item:hover { transform: translateY(-5px); box-shadow: rgba(0, 0, 0, 0.09) 0px 10px 32px; border-color: rgb(232, 232, 232); }
.social-model-item:hover::after { transform: scale(1.2); }
.social-model-item__head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; position: relative; z-index: 1; }
.social-model-item__dot { width: 7px; height: 7px; border-radius: 50%; background: rgb(216, 12, 30); flex-shrink: 0; }
.social-model-item__num { color: rgb(216, 12, 30); letter-spacing: 1px; }
.social-model-item__tit { display: block; font-weight: 700; margin-bottom: 12px; position: relative; z-index: 1; }
.social-model-item__desc { display: block; flex: 1 1 0%; line-height: 1.85; position: relative; z-index: 1; }
.social-model-cta { margin-top: 48px; padding: 40px 32px; background: rgb(255, 255, 255); border-radius: 4px; border: 1px solid rgb(238, 238, 238); box-shadow: rgba(0, 0, 0, 0.04) 0px 4px 24px; text-align: center; }
.social-model-cta__btn { display: inline-block; padding: 14px 40px; background: rgb(216, 12, 30); color: rgb(255, 255, 255); letter-spacing: 1px; text-decoration: none; border-radius: 2px; transition: background 0.3s, transform 0.3s, box-shadow 0.3s; }
.social-model-cta__btn:hover { background: rgb(176, 10, 24); color: rgb(255, 255, 255); transform: translateY(-2px); box-shadow: rgba(216, 12, 30, 0.25) 0px 6px 18px; }
.social-model-intro { background: rgb(255, 255, 255); }
.social-model-intro__inner { display: flex; align-items: center; gap: 56px; }
.social-model-intro__img { flex: 0 0 42%; max-width: 42%; }
.social-model-intro__img img { width: 100%; display: block; }
.social-model-intro__text { flex: 1 1 0%; }
.social-model-intro__lead { font-size: 22px; line-height: 1.7; font-weight: 700; color: rgb(51, 51, 51); margin-bottom: 24px; }
.social-model-intro__desc { font-size: 16px; line-height: 2; color: rgb(102, 102, 102); }
.social-model-pillars { position: relative; overflow: hidden; background: linear-gradient(rgb(235, 235, 235) 0%, rgb(243, 243, 243) 10%, rgb(248, 248, 248) 100%); }
.social-model-pillars::before { content: ""; position: absolute; left: -80px; bottom: 10%; width: 300px; height: 300px; border-radius: 50%; background: rgba(216, 12, 30, 0.04); pointer-events: none; }
.social-model-pillars::after { content: ""; position: absolute; top: 12%; right: -40px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(216, 12, 30, 0.05) 0%, transparent 70%); pointer-events: none; }
.social-model-pillars > .width1400 { position: relative; z-index: 1; }
.social-pillar-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.social-pillar-card { background: rgb(255, 255, 255); padding: 32px 24px 28px; border-top: 3px solid rgb(216, 12, 30); box-shadow: rgba(0, 0, 0, 0.06) 0px 4px 20px; transition: transform 0.3s, box-shadow 0.3s; }
.social-pillar-card:hover { transform: translateY(-4px); box-shadow: rgba(0, 0, 0, 0.1) 0px 8px 28px; }
.social-pillar-card__icon { width: 48px; height: 48px; border-radius: 50%; background: rgba(216, 12, 30, 0.08); color: rgb(216, 12, 30); font-size: 20px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.social-pillar-card__tit { font-size: 18px; font-weight: 700; color: rgb(51, 51, 51); margin-bottom: 12px; }
.social-pillar-card__desc { font-size: 14px; line-height: 1.85; color: rgb(102, 102, 102); }
.social-esg-tabs { padding-top: 32px; padding-bottom: 8px; background: rgb(255, 255, 255); }
.social-esg-tabs__list { display: flex; gap: 20px; }
.social-esg-tab { flex: 1 1 0%; display: flex; align-items: center; justify-content: center; padding: 20px 16px; background: rgb(244, 244, 244); color: rgb(123, 123, 123); font-size: 16px; font-weight: 700; text-decoration: none; text-align: center; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 8px; transition: box-shadow 0.3s, background 0.3s, color 0.3s; position: relative; }
.social-esg-tab:hover { box-shadow: rgba(0, 0, 0, 0.15) 0px 6px 12px; color: rgb(123, 123, 123); }
.social-esg-tab.active { background: rgb(192, 0, 0); color: rgb(255, 255, 255); }
.social-esg-tab.active::after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); border-width: 10px 10px 0px; border-style: solid; border-color: rgb(192, 0, 0) transparent transparent; }
.social-esg-overview__inner { gap: 48px; align-items: flex-start; }
.social-esg-overview__label { flex: 0 0 28%; max-width: 28%; line-height: 1.45; }
.social-esg-overview__text { flex: 1 1 0%; line-height: 1.875; }
.social-esg-block__tit { margin-bottom: 16px; line-height: 1.35; }
.social-esg-block__divider { width: 100%; height: 2px; background: rgb(215, 12, 30); margin-bottom: 40px; }
.social-esg-block__top { gap: 48px; align-items: flex-start; margin-bottom: 40px; }
.social-esg-block__quote-col { flex: 1 1 0%; min-width: 0px; }
.social-esg-block__quote-icon { width: 100px; display: block; margin-bottom: 16px; }
.social-esg-block__quote-text { line-height: 1.85; color: rgb(51, 51, 51); }
.social-esg-block__strategy-col { flex: 1 1 0%; min-width: 0px; }
.social-esg-block__strategy-tit { margin-bottom: 16px; }
.social-esg-block__strategy-list { list-style: none; padding: 0px; margin: 0px; }
.social-esg-block__strategy-list li { position: relative; padding-left: 18px; line-height: 1.85; color: rgb(102, 102, 102); margin-bottom: 10px; }
.social-esg-block__strategy-list li::before { content: ""; position: absolute; left: 0px; top: 11px; width: 6px; height: 6px; border-radius: 50%; background: rgb(216, 12, 30); }
.social-esg-sdgs { margin-bottom: 32px; }
.social-esg-sdgs__label { margin: 0px 0px 32px; line-height: 1.3; }
.social-esg-sdgs__row { display: flex; overflow: hidden; width: 100%; }
.social-esg-sdg-card { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; padding: 37px 5%; color: rgb(255, 255, 255); box-sizing: border-box; aspect-ratio: 323 / 213; }
.social-esg-sdg-card__head { display: flex; align-items: flex-start; gap: 8px; text-align: left; }
.social-esg-sdg-card__num { flex-shrink: 0; line-height: 1; letter-spacing: -0.02em; }
.social-esg-sdg-card__tit { margin: 2px 0px 0px; line-height: 1.35; }
.social-esg-sdg-card__icon { display: block; width: clamp(64px, 65%, 145px); height: auto; margin: auto auto 0px; color: rgb(255, 255, 255); }
.social-esg-sdgs__row--green .social-esg-sdg-card--11 { background: rgb(245, 161, 0); }
.social-esg-sdgs__row--green .social-esg-sdg-card--12 { background: rgb(210, 145, 0); }
.social-esg-sdgs__row--green .social-esg-sdg-card--13 { background: rgb(66, 121, 53); }
.social-esg-sdgs__row--green .social-esg-sdg-card--15 { background: rgb(41, 168, 56); }
.social-esg-sdgs__row--cooperation .social-esg-sdg-card--1 { background: rgb(229, 0, 29); }
.social-esg-sdgs__row--cooperation .social-esg-sdg-card--3 { background: rgb(0, 151, 58); }
.social-esg-sdgs__row--cooperation .social-esg-sdg-card--2 { background: rgb(178, 131, 49); }
.social-esg-sdgs__row--cooperation .social-esg-sdg-card--11 { background: rgb(232, 148, 49); }
.social-esg-sdgs__row--people .social-esg-sdg-card--3 { background: rgb(0, 151, 58); }
.social-esg-sdgs__row--people .social-esg-sdg-card--5 { background: rgb(232, 58, 24); }
.social-esg-sdgs__row--people .social-esg-sdg-card--8 { background: rgb(145, 30, 63); }
.social-esg-sdgs__row--people .social-esg-sdg-card--10 { background: rgb(221, 0, 122); }
@media only screen and (max-width: 768px) {
  .social-esg-sdgs__label, .social-esg-practice-label { margin-bottom: 20px; }
  .social-esg-sdgs__row { flex-wrap: wrap; }
  .social-esg-sdg-card { flex: 1 1 50%; aspect-ratio: auto; min-height: 148px; }
}
@media only screen and (max-width: 480px) {
  .social-esg-sdg-card { flex: 1 1 100%; min-height: 132px; }
}
.social-esg-practice-label { margin: 0px 0px 24px; line-height: 1.3; }
.social-esg-slider { position: relative; background: rgb(250, 250, 250); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 4px; padding: 36px 72px 64px; box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 24px; overflow: hidden; }
.social-esg-slider::before { content: ""; position: absolute; top: -60px; right: -40px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, rgba(216, 12, 30, 0.05) 0%, transparent 70%); pointer-events: none; }
.social-esg-slider__viewport { overflow: hidden; position: relative; z-index: 1; touch-action: none; cursor: grab; }
.social-esg-slider__viewport:active { cursor: grabbing; }
.social-esg-slider__track { display: flex; transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1); touch-action: none; }
.social-esg-slide { flex: 0 0 100%; min-width: 100%; box-sizing: border-box; display: flex; align-items: stretch; gap: 48px; }
.social-esg-slide__media { flex: 0 0 42%; max-width: 42%; position: relative; border-radius: 4px; overflow: hidden; background: rgb(238, 238, 238); box-shadow: rgba(0, 0, 0, 0.1) 0px 6px 24px; touch-action: none; }
.social-esg-slide__media::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(to top, rgba(0, 0, 0, 0.18) 0%, transparent 45%); pointer-events: none; }
.social-esg-slide__img { width: 100%; height: 100%; min-height: 300px; display: block; object-fit: cover; transition: transform 0.6s; }
.social-esg-slide:hover .social-esg-slide__img { transform: scale(1.03); }
.social-esg-slide__body { flex: 1 1 0%; min-width: 0px; display: flex; align-items: center; gap: 20px; padding-top: 8px; }
.social-esg-slide__index { flex-shrink: 0; line-height: 1; color: rgba(216, 12, 30, 0.12); letter-spacing: -1px; user-select: none; }
.social-esg-slide__content { flex: 1 1 0%; min-width: 0px; }
.social-esg-slide__tit { margin-bottom: 16px; letter-spacing: 0.5px; color: rgb(216, 12, 30); }
.social-esg-slide__text { line-height: 1.875; color: rgb(102, 102, 102); margin: 0px; }
.social-esg-slide__text-wrap { width: 100%; }
.social-esg-slide__text-preview .social-esg-slide__text { overflow: hidden; word-break: normal; overflow-wrap: break-word; }
.social-esg-slide__text-preview .social-esg-slide__text img { display: none; }
.social-esg-slide__more { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 20px; padding: 12px 32px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 2px; background: rgb(216, 12, 30); color: rgb(255, 255, 255); font-size: 15px; font-weight: 600; letter-spacing: 0.5px; line-height: 1; cursor: pointer; transition: background 0.3s, transform 0.3s, box-shadow 0.3s; position: relative; z-index: 2; }
.social-esg-slide__more::after { content: "→"; color: inherit; font-size: 16px; font-weight: 400; transition: transform 0.25s; }
.social-esg-slide__more:hover { background: rgb(176, 10, 24); color: rgb(255, 255, 255); transform: translateY(-1px); box-shadow: rgba(216, 12, 30, 0.3) 0px 6px 18px; }
.social-esg-slide__more:hover::after { transform: translateX(4px); }
.social-esg-modal[hidden] { display: none !important; }
.social-esg-modal { position: fixed; inset: 0px; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 24px; }
.social-esg-modal__backdrop { position: absolute; inset: 0px; background: rgba(0, 0, 0, 0.52); }
.social-esg-modal__dialog { position: relative; z-index: 1; width: min(760px, 100%); max-height: min(72vh, 560px); background: rgb(255, 255, 255); border-radius: 4px; padding: 28px 36px 32px; box-shadow: rgba(0, 0, 0, 0.18) 0px 16px 48px; display: flex; flex-direction: column; }
.social-esg-modal__close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 50%; background: rgb(245, 245, 245); color: rgb(102, 102, 102); font-size: 24px; line-height: 1; cursor: pointer; transition: background 0.25s, color 0.25s; }
.social-esg-modal__close:hover { background: rgb(216, 12, 30); color: rgb(255, 255, 255); }
.social-esg-modal__title { flex-shrink: 0; margin: 0px 40px 16px 0px; color: rgb(216, 12, 30); line-height: 1.4; }
.social-esg-modal__title[hidden] { display: none; }
.social-esg-modal__body { flex: 1 1 0%; min-height: 0px; overflow-y: auto; padding-right: 8px; line-height: 1.875; color: rgb(102, 102, 102); }
.social-esg-modal__body::-webkit-scrollbar { width: 6px; }
.social-esg-modal__body::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.18); border-radius: 3px; }
body.social-esg-modal-open { overflow: hidden; }
.social-esg-slider__prev, .social-esg-slider__next { position: absolute; top: 50%; z-index: 3; width: 48px; height: 48px; margin-top: -36px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 50%; background: rgb(255, 255, 255); color: rgb(51, 51, 51); font-size: 24px; line-height: 48px; text-align: center; cursor: pointer; transition: 0.3s; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 16px; }
.social-esg-slider__prev { left: 16px; }
.social-esg-slider__next { right: 16px; }
.social-esg-slider__prev:hover, .social-esg-slider__next:hover { background: rgb(216, 12, 30); color: rgb(255, 255, 255); box-shadow: rgba(216, 12, 30, 0.3) 0px 6px 20px; transform: scale(1.05); }
.social-esg-slider__dots { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); display: flex; gap: 6px; align-items: center; z-index: 2; }
.social-esg-slider__dot { width: 8px; height: 8px; border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 0px; background: rgb(221, 221, 221); cursor: pointer; transition: background 0.35s, transform 0.35s; }
.social-esg-slider__dot.active { background: rgb(216, 12, 30); transform: scale(1.15); }
.social-esg-slider__footer { position: absolute; right: 72px; bottom: 28px; z-index: 2; pointer-events: none; }
.social-esg-slider__counter { font-size: 14px; font-weight: 700; color: rgb(153, 153, 153); letter-spacing: 1px; white-space: nowrap; }
.social-esg-slider__current { color: rgb(216, 12, 30); font-size: 18px; }
.social-esg-slider__sep { margin: 0px 4px; color: rgb(204, 204, 204); font-weight: 400; }
.social-esg-report { background: rgb(248, 248, 248); }
.social-esg-report__inner { display: flex; gap: 48px; align-items: center; }
.social-esg-report__cover { flex: 0 0 282px; max-width: 282px; }
.social-esg-report__cover img { width: 100%; display: block; box-shadow: rgba(0, 0, 0, 0.12) 0px 8px 24px; }
.social-esg-report__content { flex: 1 1 0%; }
.social-esg-report__tit { font-size: 20px; font-weight: 700; color: rgb(51, 51, 51); margin-bottom: 24px; }
.social-esg-report__btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 28px; background: rgb(216, 12, 30); color: rgb(255, 255, 255); text-decoration: none; font-size: 16px; transition: background 0.3s; }
.social-esg-report__btn:hover { background: rgb(176, 10, 24); color: rgb(255, 255, 255); }
@media (max-width: 1024px) {
  .social-pillar-grid, .social-model-grid { grid-template-columns: repeat(2, 1fr); }
  .social-model-hero__body { flex-direction: column; gap: 32px; }
  .social-model-hero__visual { flex: 0 0 auto; max-width: 100%; width: 100%; }
  .social-model-intro__inner { flex-direction: column; gap: 32px; }
  .social-model-intro__img { flex: 0 0 auto; max-width: 100%; width: 100%; }
  .social-esg-overview__inner { flex-direction: column; gap: 24px; }
  .social-esg-overview__label { flex: 0 0 auto; max-width: 100%; }
  .social-esg-block__top { flex-direction: column; gap: 32px; }
  .social-esg-tabs__list { flex-direction: column; gap: 15px; }
  .social-esg-tab { padding: 15px; }
  .social-esg-report__inner { flex-direction: column; gap: 32px; }
  .social-esg-report__cover { flex: 0 0 auto; max-width: 220px; margin: 0px auto; }
  .social-esg-slide { gap: 28px; }
  .social-esg-slide__media { flex: 0 0 40%; max-width: 40%; }
  .social-esg-slide__img { min-height: 240px; }
  .social-esg-slider { padding: 28px 56px 68px; }
  .social-esg-slider__footer { right: 56px; }
}
@media (max-width: 768px) {
  .social-page .about-bread.bread { display: block; position: static; }
  .social-page .about-bread .item-r { display: none; }
  .social-model-page .about-block__head, .social-model-page .about-block__head--left { margin-bottom: 24px; }
  .social-model-hero::before { width: 260px; height: 260px; top: -60px; right: -40px; }
  .social-model-pillars::before, .social-model-pillars::after { opacity: 0.6; }
  .social-pillar-grid, .social-model-grid { grid-template-columns: 1fr; }
  .social-model-hero__content { padding: 28px 24px; }
  .social-model-hero__quote { width: 44px; margin-bottom: 12px; }
  .social-model-hero__lead { margin-bottom: 20px; padding-left: 12px; }
  .social-model-hero__desc { padding-top: 20px; }
  .social-model-hero__imgframe { padding: 16px; }
  .social-model-grid { gap: 20px; }
  .social-model-cta { margin-top: 36px; padding: 32px 24px; text-align: center; }
  .social-model-item { padding: 28px 22px 26px; }
  .social-esg-slider { padding: 20px 20px 56px; }
  .social-esg-slider__footer { right: 20px; bottom: 20px; }
  .social-esg-slide { flex-direction: column; gap: 20px; }
  .social-esg-slide__media { flex: 0 0 auto; max-width: 100%; width: 100%; }
  .social-esg-slide__img { min-height: 200px; aspect-ratio: 16 / 10; }
  .social-esg-slide__body { flex-direction: column; gap: 12px; padding-top: 0px; }
  .social-esg-slide__text-preview .social-esg-slide__text { overflow: visible; }
  .social-esg-slide__text-preview .social-esg-slide__text p { display: block; margin: 0px 0px 1em; }
  .social-esg-slide__text-preview .social-esg-slide__text p:last-child { margin-bottom: 0px; }
  .social-esg-slide__text-preview .social-esg-slide__text p:not(:last-child)::after { content: none; }
  .social-esg-slide__text-preview .social-esg-slide__text img { display: block; }
  .social-esg-slide__more { display: none !important; }
  .social-esg-modal { padding: 16px; }
  .social-esg-modal__dialog { max-height: min(78vh, 520px); padding: 24px 20px 28px; }
  .social-esg-slider__prev, .social-esg-slider__next { width: 40px; height: 40px; line-height: 40px; font-size: 20px; margin-top: -20px; top: 28%; }
  .social-esg-slider__prev { left: 8px; }
  .social-esg-slider__next { right: 8px; }
  .social-esg-slider__dots { bottom: 20px; }
  .social-model-cta__btn { padding: 15px; }
}
html[lang="id"] { --oss-nav-font-size: 14px; --oss-nav-tracking: 0.08em; --oss-body-line-height: 1.65; --oss-title-line-height: 1.3; }
html[lang="id"] body { line-height: var(--oss-body-line-height); }
html[lang="id"] .page_header nav { font-size: var(--oss-nav-font-size); letter-spacing: var(--oss-nav-tracking); }
html[lang="id"] .page_header nav a { white-space: nowrap; }
html[lang="id"] h1, html[lang="id"] h2, html[lang="id"] .banner-title { line-height: var(--oss-title-line-height); }
html[lang="id"] .page-nav-hid .link { font-size: 13px; }
html[lang="id"] .index .watch_more { width: 200px; }
html[lang="id"] .about-block__head .page_ftit { display: none; }
html[lang="id"] .about-shareholder__title .page_ftit { display: none; }
html[lang="id"] .culture-page .page_ftit { display: none; }
html[lang="id"] .foot_top .foot_top_items { width: calc(100% - 282px); max-width: initial; padding-left: 3%; box-sizing: border-box; }
html[lang="id"] .foot_top .item .link { margin-bottom: 12px; }
html[lang="id"] .foot_top .item .link:last-child { margin-bottom: 0px; }
html[lang="id"] .foot_top .text { margin-bottom: 12px; }
html[lang="id"] .foot_top .tit { margin-bottom: 20px; }
html[lang="id"] .time_items .time_item { width: 49%; }
html[lang="id"] .news-page .bread .item-r .news-cat-label { margin-right: 25px; }
html[lang="id"] .bread_box .item::after { margin: 0px 7px; }
html[lang="id"] .bread .bread_box::before { margin-right: 5px; }
html[lang="id"] .bread .bread_box { height: auto; padding: 12px 0px; box-sizing: border-box; line-height: 1.875; }
@media only screen and (max-width: 1400px) {
  html[lang="id"] .foot_top .item:nth-child(4) { display: none; }
  html[lang="id"] .bread .width1400 .item-r { display: none; }
  html[lang="id"] .news-page .news-cat-mobile { display: block; }
  html[lang="id"] .bread .width1400 { height: auto; }
}
@media only screen and (max-width: 1240px) {
  html[lang="id"] .foot_top .foot_top_items { width: 100%; padding-left: 0px; }
  html[lang="id"] .foot_top .content { max-width: 100%; margin: 0px auto 35px; display: flex; flex-direction: column; align-items: center; }
  html[lang="id"] .time_items .time_item { padding: 0px 3%; }
}
@media only screen and (max-width: 1024px) {
  html[lang="id"] .foot_top .foot_top_items { margin-top: 0px; }
}
@media only screen and (max-width: 910px) {
  html[lang="id"] .foot_top .foot_top_items { display: none; }
  html[lang="id"] .foot_top .content { margin-bottom: 0px; }
}
@media only screen and (max-width: 768px) {
  html[lang="id"] .time_items .time_item { width: 100%; height: 95px; margin-right: 0px; margin-bottom: 16px; }
  html[lang="id"] .time_items .time_item:last-child { margin-bottom: 0px; }
  html[lang="id"] .index .watch_more { width: auto; padding: 0px 10px; box-sizing: border-box; }
}
*, ::after, ::before { box-sizing: border-box; border-width: 0px; border-style: solid; border-color: rgb(229, 231, 235); }
::after, ::before { --tw-content: ''; }
:host, html { line-height: 1.5; text-size-adjust: 100%; tab-size: 4; font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-feature-settings: normal; font-variation-settings: normal; -webkit-tap-highlight-color: transparent; }
body { margin: 0px; line-height: inherit; }
hr { height: 0px; color: inherit; border-top-width: 1px; }
abbr:where([title]) { text-decoration: underline dotted; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: bolder; }
code, kbd, pre, samp { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
table { text-indent: 0px; border-color: inherit; border-collapse: collapse; }
button, input, optgroup, select, textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0px; padding: 0px; }
button, select { text-transform: none; }
button, input:where([type="button"]), input:where([type="reset"]), input:where([type="submit"]) { appearance: button; background-color: transparent; background-image: none; }
progress { vertical-align: baseline; }
::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }
[type="search"] { appearance: textfield; outline-offset: -2px; }
::-webkit-search-decoration { appearance: none; }
::-webkit-file-upload-button { appearance: button; font: inherit; }
summary { display: list-item; }
blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre { margin: 0px; }
fieldset { margin: 0px; padding: 0px; }
legend { padding: 0px; }
menu, ol, ul { list-style: none; margin: 0px; padding: 0px; }
dialog { padding: 0px; }
textarea { resize: vertical; }
input::placeholder, textarea::placeholder { opacity: 1; color: rgb(156, 163, 175); }
[role="button"], button { cursor: pointer; }
:disabled { cursor: default; }
audio, canvas, embed, iframe, img, object, svg, video { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
[hidden]:where(:not([hidden="until-found"])) { display: none; }
*, ::before, ::after { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; }
::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; }
.fixed { position: fixed; }
.relative { position: relative; }
.top-0 { top: 0px; }
.z-50 { z-index: 50; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mb-10 { margin-bottom: 2.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.mb-6 { margin-bottom: 1.5rem; }
.flex { display: flex; }
.hidden { display: none; }
.w-full { width: 100%; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.space-x-14 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(3.5rem * var(--tw-space-x-reverse)); margin-left: calc(3.5rem * calc(1 - var(--tw-space-x-reverse))); }
.overflow-x-hidden { overflow-x: hidden; }
.bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.font-bold { font-weight: 700; }
.font-medium { font-weight: 500; }
.uppercase { text-transform: uppercase; }
.tracking-widest { letter-spacing: 0.1em; }
.shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }
.transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.duration-300 { transition-duration: 300ms; }
@media (min-width: 768px) {
  .md\:px-12 { padding-left: 3rem; padding-right: 3rem; }
}
@media (min-width: 1024px) {
  .lg\:flex { display: flex; }
}