@import "../font/iconfont.css";
#header {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 100;
    background-color: #000000;
    color: #fff;
    box-shadow: 0 18px 32px rgba(0, 0, 0, 0.14);
}
@media (max-width: 1024px) {
    #header .logo {
        margin-right: auto;
    }
}
#header .main {
    height: 1rem;
    /*line-height: 1rem;*/
}
@media (max-width: 1140px) {
    #header .main {
        height: 60px;
        line-height: 60px;
    }
}
#header .nav {
    margin: 0 0.32rem 0 auto;
    position: relative;
}
@media (max-width: 1024px) {
    #header .nav {
        display: none;
    }
}
#header .nav .item {
    padding: 0 0.2rem;
    border-radius: 0.1rem;
}
#header .nav .item.sec:after {
    content: "\e665";
    font-family: "iconfont" !important;
}
#header .nav:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    border-radius: 0.1rem;
    background-color: #1d1d1d;
    transition: all 0.4s ease-in-out;
    left: var(--left);
    width: var(--width);
    z-index: -1;
}
#header .opt {
    margin: 0 0 0 0.28rem;
}
@media (max-width: 1480px) {
    #header .nav .item {
    padding: 0 0.1rem;
}
}
@media (max-width: 1024px) {
    #header .opt {
        margin-left: 12px;
    }
}
#header .opt:last-child {
    margin-right: 0;
}
#header .opt .label {
    width: 2.2em;
    height: 2.2em;
    border: 1px solid #fff;
    border-radius: 1.1em;
}
#header .opt .label .icon:first-child {
    font-size: 1.1em;
}
@media (max-width: 1280px) {
    #header .opt .label .icon:first-child {
        font-size: 16px;
    }
}
#header .opt .label:hover {
    border-color: #f68001;
    background-color: #f68001;
}
#header .lang {
    height: 100%;
}
#header .lang .label {
    width: 4.9em;
}
#header .lang .label .icon:last-child,
#header .lang .label .t {
    font-size: 12px;
}
#header .lang .label .t {
    margin: 0 4px;
}
@media (max-width: 1024px) {
    #header .lang .label .t {
        margin: 0 2px;
    }
}
#header .lang:hover .fade {
    margin-top: 0;
}
#header .menu.on .icon:before {
    content: "\e613";
}
@media (min-width: 1025px) {
    #header .menu {
        display: none;
    }
}
@media (min-width: 801px) {
    #lang {
        left: 50%;
        top: 100%;
        transform: translateX(-50%);
        margin-top: 1em;
    }
}
@media (max-width: 800px) {
    #lang.fancybox__content {
        display: block;
        opacity: 1;
        visibility: visible;
        pointer-events: unset;
        width: 80%;
        max-width: 480px;
        border-radius: 12px;
    }
    #lang .cc {
        border: 1px solid #eee;
        width: 12px;
        height: 12px;
        border-radius: 6px;
    }
    #lang .item {
        height: 40px;
        border-top: 1px solid #ddd;
    }
    #lang .item:first-child {
        border-top: none;
    }
    #lang .item.on .cc {
        border-color: #000000;
    }
    #lang .item.on .cc:after {
        content: '';
        display: block;
        width: 6px;
        height: 6px;
        margin: 2px;
        border-radius: 3px;
        background-color: #000000;
    }
}
#search {
    background-color: transparent;
    width: 80%;
    max-width: 850px;
    color: #fff;
    display: none;
}
@media (max-width: 800px) {
    #search {
        width: 100%;
        padding: 0 16px;
    }
}
#search .title {
    font-size: 3em;
    line-height: 1;
    color: #f68001;
    margin-bottom: 20px;
    padding-bottom: 0.3rem;
}
#search .container {
    border-bottom: 2px solid #fff;
    height: 4em;
}
#search .container .content {
    flex: 1;
    height: 100%;
}
#search .container input {
    width: 100%;
    height: 100%;
}
#search .container button {
    width: 2em;
    height: 100%;
    font-size: 2em;
}
#navbar {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 1rem;
    background-color: rgba(0, 0, 0, 0.9);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff;
    z-index: 101;
}
@media (max-width: 1140px) {
    #navbar {
        top: 60px;
    }
}
@media (max-width: 1024px) {
    #navbar .swiper-wrapper{
        height: auto!important;
    }
    #navbar .swiper-slide,
    #navbar .main{
        opacity: 1!important;
        transform: none!important;
    }
}
#navbar .button {
    border: 1px solid #fff;
    box-sizing: border-box;
    height: 1.9em;
    width: 8em;
    border-radius: 0.9em;
    margin-right: 1.2em;
}
#navbar .button:hover {
    color: #f68001;
    border-color: #f68001;
}
#navbar .button .t {
    font-size: 0.8em;
    margin-left: 0.625em;
}
#navbar .button .icon {
    font-size: 1.1em;
}
#navbar .main {
    box-sizing: border-box;
    max-width: 1200px;
    margin: 0 auto;
}
#navbar .content {
    overflow-x: hidden;
    overflow-y: auto;
}
@media (min-width: 1141px) {
    #navbar .content {
        max-height: calc(100vh - 1rem - 1.6rem - 1px - 0.64rem - 0.64rem - 1.9em);
    }
}
#navbar .content::-webkit-scrollbar {
    background-color: rgba(255, 255, 255, 0.2);
}
@media (min-width: 1025px) {
    #navbar {
        border-radius: 0 0 1em 1em;
    }
    #navbar .top {
        display: none;
    }
    #navbar .main {
        padding: 0.8rem;
    }
    #navbar .main:has(>.content>.ul:empty) {
        display: none;
    }
    #navbar .list1 .img {
        padding-top: 54.55%;
        border-radius: 0.5em;
        border: 2px solid transparent;
    }
    #navbar .list1 .row {
        max-width: 100%;
        line-height: 1.5;
    }
    #navbar .list1 .t {
        margin-right: 1em;
        height: 1.5em;
    }
    #navbar .list2 {
        font-weight: bold;
        margin: -0.5rem -0.5rem 0 0;
    }
    #navbar .list2 li {
        width: 25%;
    }
    #navbar .list2 a {
        margin: 0.5rem 0.5rem 0 0;
        border: 1px solid rgba(255, 255, 255, 0.2);
        text-align: center;
        border-radius: 0.5em;
        line-height: 1.25;
        padding: 0.3rem;
        background-clip: padding-box;
    }
    #navbar .list2 a:hover {
        background-color: rgba(255, 255, 255, 0.2);
    }
    #navbar .added {
        padding-top: 0.64rem;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        margin-top: 0.64rem;
        height: 1.9em;
    }
    #navbar .item .img {
        transition: all 0.2s linear;
    }
    #navbar .item:hover {
        color: #f68001;
    }
    #navbar .item:hover .img {
        border-color: #f68001;
    }
    #navbar .about .ul {
        margin: -0.6rem -0.6rem 0 0;
    }
    #navbar .about li {
        width: 33.33333%;
    }
    #navbar .about .item {
        margin: 0.6rem 0.6rem 0 0;
    }
    #navbar .about .row {
        margin-top: 0.3rem;
    }
    #navbar .plan .title {
        font-size: 1.125em;
        margin-bottom: 0.2rem;
        padding-bottom: 12px;
    }
    #navbar .plan .ul {
        margin: -0.4rem -0.36rem 0 0;
    }
    #navbar .plan li {
        width: 20%;
    }
    #navbar .plan .item {
        margin: 0.4rem 0.36rem 0 0;
    }
    #navbar .plan .row {
        margin-top: 0.16rem;
    }
    #navbar .product .added .dt {
        color: #f68001;
        white-space: nowrap;
    }
    #navbar .product .added a {
        color: rgba(255, 255, 255, 0.8);
        overflow: hidden;
        position: relative;
    }
    #navbar .product .added a:after {
        content: "、";
        color: rgba(255, 255, 255, 0.8);
        text-decoration: none!important;
    }
    #navbar .product .added a:before {
        content: "";
        position: absolute;
        left: 0;
        right: 1em;
        bottom: 0.1em;
        height: 1px;
        opacity: 0;
        background-color: #f68001;
        transition: all 0.4s ease;
    }
    #navbar .product .added a:last-child:after {
        display: none;
    }
    #navbar .product .added a:last-child:before {
        right: 0;
    }
    #navbar .product .added a:hover {
        color: #f68001;
    }
    #navbar .product .added a:hover:before {
        opacity: 1;
    }
    #navbar .product dt {
        font-weight: bold;
    }
    #navbar .product .dl1 {
        width: fit-content;
        max-width: 100%;
    }
    #navbar .product .dl1 > dt {
        font-size: 1.125em;
        color: #f68001;
        margin-bottom: 0.3rem;
    }
    #navbar .product .dl2 {
        margin-bottom: 0.4rem;
    }
    #navbar .product .dl2:last-child {
        margin-bottom: 0;
    }
    #navbar .product .dl2 > dt {
        margin-bottom: 0.18rem;
    }
    #navbar .product .dl2 > dd {
        font-size: 0.875em;
        color: rgba(255, 255, 255, 0.7);
    }
    #navbar .product .dl2 > dd a {
        margin-bottom: 0.1rem;
    }
    #navbar .product .dl2 > dd a:last-child {
        margin-bottom: 0;
    }
    #navbar .product .ul {
        margin: -0.6rem -0.8rem 0;
        line-height: 1;
    }
    #navbar .product .ul a {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    #navbar .product .ul a:hover {
        color: #f68001;
        text-decoration: underline;
    }
    #navbar .product li {
        width: 33.33333%;
        box-sizing: border-box;
        padding: 0.6rem 0.8rem 0;
    }
    #navbar .product li:nth-of-type(3n-1) {
        border-left: 1px dashed rgba(255, 255, 255, 0.1);
        border-right: 1px dashed rgba(255, 255, 255, 0.1);
    }
    #navbar .product li:nth-of-type(3n-1) .dl1 {
        margin: 0 auto;
    }
    #navbar .product li:nth-of-type(3n) .dl1 {
        margin: 0 0 0 auto;
    }
}
@media (max-width: 1024px) {
    #navbar {
        bottom: 0;
        overflow-y: auto;
    }
    #navbar .swiper-wrapper {
        display: block;
    }
    #navbar .title,
    #navbar .main:has(>.content>.ul:empty) .top .icon,
    #navbar .added {
        display: none;
    }
    #navbar .swiper-fade .swiper-slide {
        pointer-events: unset;
    }
    #navbar .content {
        height: 0;
        overflow: hidden;
        transition: height 0.4s linear;
    }
    #navbar .top {
        line-height: 50px;
        padding: 0 16px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    #navbar .top .icon {
        transition: all 0.2s linear;
        opacity: 0.2;
    }
    #navbar .top.active .icon {
        transform: rotateZ(90deg);
    }
    #navbar .top.on a {
        color: #f68001;
    }
    #navbar .ul {
        display: block;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        padding: 10px 16px;
    }
    #navbar .list2 a,
    #navbar .item {
        padding: 6px 0;
        opacity: 0.75;
    }
    #navbar .dl1 a {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 6px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    #navbar .dl1 dt {
        font-weight: bold;
    }
    #navbar .dl1 > dd {
        margin-left: 1em;
    }
    #navbar .dl2 > dd {
        margin-left: 1em;
        color: rgba(255, 255, 255, 0.5);
    }
    #navbar .product li {
        margin-bottom: 20px;
    }
    #navbar .product li:last-child {
        margin-bottom: 0;
    }
}
#banner {
    padding: 0;
}
#banner .set-height {
    max-height: 100vh;
    overflow: hidden;
}
#banner .set-height:after {
    content: "";
    display: block;
    padding-top: 130%;
}
#banner .swiper .section {
    height: 82%;
    align-items: flex-end;
}
 #banner .swiper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
@media (max-width: 800px) {
    #banner .swiper {
        font-size: 10px;
        
    }
        #banner .swiper .section {
        height: 85%;
    }
}
#banner .main {
    width: 100%;
}
#banner .main .t1 {
    font-size: 2.2em;
    font-weight: bold;
    line-height: 1.3;
}
#banner .main .t2 {
    margin-top: 0.4rem;
    padding-top: 10px;
    text-transform: uppercase;
    font-size: 20px;
}
#banner .pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.5rem;
    margin-bottom: 20px;
    z-index: 2;
}
@media (max-width: 1480px) {
    #banner .main .t2 {
    font-size: 18px;
}
}
@media (max-width: 1280px) {
    #banner .pagination {
        font-size: 14px;
    }
    #banner .main .t2 {
    font-size: 12px;
}
}
#banner .pagination .main {
    position: relative;
    bottom: 0;
}
#banner .pagination .swiper-pagination-bullet {
    width: auto;
    height: 1.8em;
    transition: all 0.4s linear;
    opacity: 1;
    margin: 0 0.6em 0 0;
    background-color: transparent;
}
#banner .pagination .swiper-pagination-bullet:last-child {
    margin-right: 0;
}
#banner .pagination .svg {
    width: 1.8em;
    height: 1.8em;
}
#banner .pagination .c1,
#banner .pagination .c2 {
    fill: none;
    stroke-width: 4;
}
#banner .pagination .c3 {
    fill: #cbcbcb;
    transition: all 0.4s linear;
}
#banner .pagination .c1 {
    stroke: #cbcbcb;
}
#banner .pagination .c2 {
    stroke: #f68001;
    stroke-dasharray: 0,314;
    transition: all var(--duration) linear;
}
#banner .pagination .progress {
    transition: all 0.4s linear;
    width: 0;
    overflow: hidden;
    height: 1px;
    background-color: #cbcbcb;
}
#banner .pagination .progress:after {
    content: "";
    display: block;
    height: 100%;
    background-color: #f68001;
    width: 0;
}
@keyframes banner-progress {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
@keyframes banner-timing {
    0% {
        stroke-dasharray: 0,314;
    }
    100% {
        stroke-dasharray: 314,0;
    }
}
#banner .pagination .swiper-pagination-bullet-active .c2 {
    animation: banner-timing var(--duration--) linear forwards;
}
#banner .pagination .swiper-pagination-bullet-active .c3 {
    fill: #f68001;
}
#banner .pagination .swiper-pagination-bullet-active .progress {
    margin-left: 0.6em;
    width: 3em;
}
#banner .pagination .swiper-pagination-bullet-active .progress:after {
    animation: banner-progress var(--duration--) linear forwards;
}
#about .header {
    padding: 1.5rem 0 1.1rem;
}
@media (max-width: 640px) {
    #about .header {
        padding: 50px 0;
    }
}
@media (min-width: 1001px) {
    #about .header .txt {
        width: 8.8rem;
    }
}
@media (max-width: 1000px) {
    #about .header .txt {
        margin: 30px 0;
    }
}
#about .datum {
    padding-bottom: 2.4rem;
}
@media (min-width: 801px) {
    #about .datum .line {
        position: static;
        margin: 2em 0;
    }
    #about .datum .item {
        width: 12.5em;
        display: block;
        padding-bottom: 0;
        margin-bottom: 0;
    }
}
@media (max-width: 800px) {
    #about .datum {
        display: block;
    }
}
#plan {
    background-color: #f5f5f5;
    overflow: hidden;
}
@media (max-width: 1024px) {
    #plan .container {
        display: block;
    }
}
@media (min-width: 1025px) {
    #plan .aside {
        display: block;
        width: 4.4rem;
    }
}
@media (max-width: 1024px) {
    #plan .aside {
        margin-right: -20px;
        margin-bottom: 20px;
    }
    #plan .aside li {
        min-width: 35%;
        margin-right: 20px;
        flex: 1;
    }
}
#plan .aside li:before,
#plan .aside li:after,
#plan .aside .t,
#plan .aside .s,
#plan .aside .pic,
#plan .aside .img {
    transition: all 0.4s ease;
}
#plan .aside .t {
    font-size: 1em;
    color: rgba(0, 0, 0, 0.7);
    margin: 0 auto 0 0;
}

#plan .aside .s {
    width: 0.4em;
    height: 0.4em;
    background-color: #f68001;
    opacity: 0.3;
    margin-right: 1.4em;
}
#plan .aside .pic {
    background-color: #fff;
    border-radius: 50%;
    padding: 0.4em;
}
#plan .aside .img {
    width: 1.8em;
    height: 1.8em;
    object-fit: contain;
    filter: grayscale(1000%);
}
#plan .aside li {
    position: relative;
    height: 4em;
    cursor: pointer;
}
#plan .aside li:after,
#plan .aside li:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
}
#plan .aside li:before {
    background-color: #dcdcdc;
    height: 1px;
}
#plan .aside li:after {
    background-color: #f68001;
    width: 0;
}
#plan .aside li.on .t {
    font-size: 1.2em;
    color: #000;
}
#plan .aside li.on .s {
    opacity: 1;
}
#plan .aside li.on:before,
#plan .aside li.on:after {
    height: 2px;
}
#plan .aside li.on:before {
    background-color: rgba(246, 128, 1, 0.1);
}
#plan .aside li.on:after {
    width: 43%;
}
#plan .aside li.on .pic {
    transform: scale(1.2);
}
#plan .aside li.on .img {
    filter: none;
}
@media (min-width: 1921px) {
    #plan .content {
        width: calc(1920px - 6.4rem);
    }
}
@media (max-width: 1920px) and (min-width: 1025px) {
    #plan .content {
        width: calc(100vw - 6.4rem);
    }
}
@media (min-width: 1025px) {
    #plan .content {
        box-sizing: border-box;
        padding-left: 1rem;
    }
}
@media (min-width: 641px) {
    #plan .content .gallery {
        margin-right: -1rem;
        height: 40em;
    }
    #plan .content .box {
        margin-right: 0.5rem;
        height: 36em;
    }
    #plan .content .img {
        height: 100%;
        max-height: 80%;
        width: 60%;
    }
    #plan .content .view {
        flex: 1;
        margin: auto auto auto 0.6rem;
        overflow-y: auto;
        max-height: 100%;
    }
    #plan .content .view .txt {
        height: 6.4em;
        -webkit-line-clamp: 4;
    }
    #plan .content .room {
        padding-right: 3rem;
        overflow: visible;
    }
    #plan .content .room .swiper-slide {
        transition: all 0.4s linear;
        transform: scale(0.8);
        transform-origin: left center;
    }
    #plan .content .room .swiper-slide-active {
        transform: scale(1);
    }
    #plan .content .swiper-pagination {
        bottom: -4em;
    }
}
@media (max-width: 640px) {
    #plan .content .room {
        padding-bottom: 30px;
    }
    #plan .content .box {
        display: block;
    }
    #plan .content .img {
        padding-top: 100%;
        margin-bottom: 20px;
    }
    #plan .content .swiper-pagination {
        bottom: 0;
    }
    #plan .aside .s {
    margin-right: .8em;
}
    #plan .aside li{
        min-height: 5em;
    }
    #plan .aside li .t {
    font-size: 12px;
    flex: 1;
}
    #plan .aside li.on .t {
    font-size: 12px;
    
}
}
#plan .content .box {
    box-sizing: border-box;
    border: 1px solid #dcdcdc;
    border-radius: 0.8em;
    padding: 0.8rem;
}
#plan .content .img {
    border-radius: 1em;
}
#plan .content .view .tt {
    font-size: 1.2em;
}
#plan .content .view .go {
    padding-top: 0.1rem;
    margin-top: 10px;
}
#plan .content .view .d {
    margin: 1em 0;
    padding: 0.1rem 0;
}
#plan .content .view .d dt {
    color: #f68001;
    font-size: 1.8em;
}
#plan .content .view .d dt:after {
    content: attr(data-content);
    font-size: 0.56em;
    padding-left: 1em;
}
#plan .content .view .d dd {
    opacity: 0.7;
    font-size: 0.7em;
}
#product .section-title {
    text-align: center;
    margin-bottom: 0;
}
#product .tabs {
    padding-bottom: 0.5em;
    margin: 0 -0.3rem 0.3rem;
}
@media (max-width: 640px) {
    #product .tabs {
        margin: 0 -4px 8px;
        padding-bottom: 0;
    }
}
#product .all {
    height: 3.5em;
    background-color: #f5f5f5;
    border-radius: 0.8em;
    color: #333;
    min-height: 50px;
    margin-bottom: 0.3rem;
}
#product .all:hover {
    background-color: #f68001;
    color: #fff;
}
#product .aside .li {
    position: relative;
    padding: 0 2em 0 1.5em;
    border: 1px solid transparent;
    border-radius: 0.8em;
    color: #6f6f6f;
    line-height: 1.3;
}
#product .aside .li:last-child {
    margin-bottom: 0;
}
#product .aside .li.on {
    border-color: #f68001;
    color: #f68001;
}
#product .aside .li.on .s {
    background-color: #f68001;
}
#product .aside .li .t {
    font-size: .8em;
    flex: 1;
}
#product .aside .li.on .t {
    font-size: .8em;
}
#product .aside .s {
    width: 0.5em;
    height: 0.5em;
    background-color: #939393;
    margin-right: 0.6em;
}
#product .aside .s,
#product .aside .t {
    transition: all 0.4s ease;
}
#product .aside .img {
    width: 4.8em;
    height: 4.8em;
    position: absolute;
    top: 50%;
    margin-top: -2.4em;
    right: -2.4em;
}
@media (min-width: 1921px) {
    #product .content {
        width: calc(1920px - 2rem - 0.7rem - 17.5em);
    }
}
@media (max-width: 1920px) and (min-width: 1025px) {
    #product .content {
        width: calc(100vw - 2rem - 0.7rem - 17.5em);
    }
}
#product .cards {
    padding-bottom: 10px;
    margin-bottom: 0.6rem;
}
@media (max-width: 1024px) {
    #product .cards {
        padding: 10px;
        border: 2px solid #f5f5f5;
        border-radius: 1em;
    }
    #product .cards .wrapper {
        display: block;
    }
}
#product .room {
    overflow: visible;
}
#product .room .swiper-slide {
    pointer-events: unset;
}
#product .room .box {
    border-radius: 1em;
    background-color: #f5f5f5;
    padding: 0.8rem;
}
#product .room .t {
    font-size: 1.2em;
    padding-left: 0.9em;
    line-height: 1.4;
    position: relative;
}
#product .room .t:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.15em;
    bottom: 0.15em;
    width: 0.3em;
    background-color: #f68001;
}
@media (min-width: 1025px) {
    #product .aside {
        overflow-y: auto;
        height: 26em;
        width: 17.5em;
        margin-right: 0.7rem;
        display: block;
    }
    #product .aside .li {
        height: 6em;
        background-color: #f5f5f5;
        margin-right: 2.4em;
        margin-bottom: 1.5em;
    }
    #product .gallery {
        margin-right: -1rem;
        padding-right: 1rem;
    }
    #product .room {
        margin-right: 3rem;
    }
    #product .room .box {
        box-sizing: border-box;
        height: 26em;
        margin-right: 1.4rem;
    }
    #product .room .txt {
        height: auto;
        -webkit-line-clamp: 5;
        margin: 0.5rem 0;
    }
    #product .room .view {
        flex: 1;
        margin-right: 0.6rem;
    }
    #product .room .img {
        height: 100%;
        width: 48%;
    }
    #product .swiper-pagination {
        display: none;
    }
    #product .swiper-button {
        right: 0.7rem;
        left: auto;
        margin-right: -1.4em;
        top: 50%;
    }
    #product .swiper-button-prev {
        margin-top: -4em;
    }
    #product .swiper-button-next {
        margin-top: 1.2em;
    }
}
@media (max-width: 1024px) {
    #product .aside {
        margin: -10px -10px 10px;
        padding: 16px;
        background-color: #f5f5f5;
        overflow-x: auto;
        overflow-y: hidden;
    }
    #product .aside .li {
        height: 4.8em;
        background-color: rgba(246, 128, 1, 0.1);
        margin-right: calc(2.4em + 16px);
    }
    #product .aside .li:last-child {
        margin-right: 2.4em;
    }
    #product .aside .t {
        white-space: nowrap;
    }
    #product .swiper-button {
        display: none;
    }
    #product .room {
        padding-bottom: 24px;
    }
    #product .room .txt {
        margin: 16px 0;
    }
    #product .room .box {
        display: block;
    }
    #product .room .img {
        padding-top: 100%;
        margin-top: 20px;
    }
    #product .swiper-pagination {
        bottom: 0;
    }
}
#news {
    padding-bottom: 2rem;
    overflow: hidden;
}
#news .swiper {
    margin-right: -1.5em;
}
#news .swiper .swiper-slide {
    width: 25%;
}
@media (max-width: 1024px) {
    #news .swiper .swiper-slide {
        width: 33.33333%;
    }
}
@media (max-width: 800px) {
    #news .swiper .swiper-slide {
        width: 50%;
    }
}
@media (max-width: 550px) {
    #news .swiper .swiper-slide {
        width: 100%;
    }
}
#news .swiper .touch {
    margin-right: 1.5em;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 1em;
    padding: 0.7rem 0.5rem;
}
@media (max-width: 640px) {
    #news .swiper .touch {
        padding: 24px 16px;
    }
}
#news .swiper .touch:hover {
    border-color: #f68001;
    color: #f68001;
}
#news .swiper .touch:hover .date {
    opacity: 1;
}
#news .swiper .touch:hover .box {
    border-color: transparent;
}
#news .swiper .touch:hover .fill {
    transform: translateY(0);
}
#news .swiper .box {
    position: relative;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.7);
    padding: 2em 0;
    margin-bottom: 0.3rem;
    margin-top: calc(0.2rem + 0.6em);
}
#news .swiper .fill {
    border-radius: 0.5em;
    transform: translateY(5%);
}
#news .swiper .date {
    line-height: 1;
    opacity: 0.7;
    padding-bottom: 0.1rem;
}
#news .swiper .t {
    font-size: 1.2em;
    margin: 0.5em 0;
}
#news .swiper .look {
    padding-top: 12px;
}
#partner {
    background-color: #f5f5f5;
    padding-top: 0.8rem;
}
#partner:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    height: 852px;
    max-height: 100%;
    background: url(../images/partner.jpg) no-repeat scroll right bottom;
    background-size: contain;
    pointer-events: none;
    mix-blend-mode: darken;
}
@media (max-width: 1200px) {
    #partner {
        padding-top: 50px;
    }
}
#partner .swiper {
    padding-top: 0.9rem;
    margin: 0 -1rem;
}
@media (max-width: 1280px) and (min-width: 641px) {
    #partner .swiper {
        margin: 0 -20px;
    }
}
@media (max-width: 640px) {
    #partner .swiper {
        margin: 0 -16px;
    }
}
#partner .swiper .swiper-slide {
    width: 16.666666%;
}
@media (max-width: 1280px) {
    #partner .swiper .swiper-slide {
        width: 20%;
    }
}
@media (max-width: 800px) {
    #partner .swiper .swiper-slide {
        width: 25%;
    }
}
@media (max-width: 640px) {
    #partner .swiper .swiper-slide {
        width: 33.333333%;
    }
}
#partner .swiper .swiper-wrapper {
    transition-timing-function: linear;
}
#partner .swiper .img {
    width: 100%;
    padding-top: 28.83%;
    filter: grayscale(1000%) opacity(0.8);
    transition: all 0.4s ease;
}
#partner .swiper a {
    height: 13em;
    padding: 0.6rem;
    box-sizing: border-box;
    border-radius: 1em;
}
#partner .swiper a:hover {
    background-color: #fff;
}
#partner .swiper a:hover .img {
    filter: none;
}
#advant .ul {
    margin-top: -0.5rem;
    text-align: center;
}
@media (max-width: 800px) {
    #advant .ul {
        margin-top: -30px;
    }
}
#advant .item {
    width: 19em;
    max-width: 25%;
    padding: 0 0.5rem;
    margin-top: 0.5rem;
    box-sizing: border-box;
}
#advant .item:hover .cc {
    background-color: #f68001;
    color: #fff;
}
#advant .item:hover .dt {
    color: #f68001;
}
@media (max-width: 800px) {
    #advant .item {
        max-width: 50%;
        padding: 0 16px;
        margin-top: 30px;
    }
}
#advant .line {
    position: relative;
    width: 1px;
    margin-left: -1px;
    background-color: rgba(0, 0, 0, 0.1);
    margin-top: 0.6rem;
    margin-bottom: 0.1rem;
}
@media (max-width: 800px) {
    #advant .line {
        margin-top: 36px;
        margin-bottom: 6px;
    }
    #advant .line:nth-of-type(4) {
        display: none;
    }
}
#advant .line:last-child {
    display: none;
}
#advant .line:before,
#advant .line:after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
}
#advant .line:before {
    border-top: 5px solid transparent;
    border-left: 7px solid rgba(0, 0, 0, 0.1);
    border-bottom: 5px solid transparent;
    margin-top: -5px;
}
#advant .line:after {
    border-top: 3px solid transparent;
    border-left: 4px solid #fff;
    border-bottom: 3px solid transparent;
    margin-top: -3px;
}
#advant .cc {
    width: 4em;
    height: 4em;
    background-color: #fff;
    box-shadow: 0 0.5em 2em rgba(0, 0, 0, 0.1);
    color: #f68001;
    margin: 0 auto 0.6em;
    transition: all 0.4s ease;
}
#advant .cc .icon {
    font-size: 1.5em;
}
#advant .dt {
    font-size: 1.2em;
    margin-bottom: 0.5em;
    padding-top: 0.1rem;
    transition: all 0.4s ease;
}
#copyright {
    background-color: #000000;
    color: rgba(255, 255, 255, 0.7);
}
#copyright .main {
    padding: 1.6em 0;
}
@media (max-width: 800px) {
    #copyright .main {
        display: block;
        text-align: center;
    }
}
#copyright .item {
    font-size: 12px;
}
#copyright .item:hover {
    color: #fff;
}
#footer {
    background-color: #000000;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#footer .main {
    padding-bottom: 1rem;
}
@media (max-width: 960px) {
    #footer .main {
        padding-bottom: 50px;
    }
}
@media (max-width: 1024px) {
    #footer .top {
        display: block;
    }
    #footer .top .right {
        display: none;
    }
}
#footer .top .left .logo {
    width: 2.8rem;
    max-width: 360px;
    min-width: 172px;
    /*width: auto;*/
}
#footer .top .left .dt {
    font-size: 1.3em;
    padding-top: 0.5em;
    margin-top: 0.1rem;
}
#footer .top .left .dd {
    font-size: 0.7em;
    margin-top: 0.5em;
}
#footer .top .right{
   width: 70%;
}
#footer .top .right li {
    margin-right: 0.4rem;
}
@media (max-width: 1280px) {
    #footer .top .right li {
        margin-right: 0.5rem;
    }
}
#footer .top .right li:last-child {
    margin-right: 0;
}
#footer .top .right .t {
    font-size: 1em;
    margin-bottom: 0.6rem;
}
#footer .top .right .s {
    opacity: 0.5;
    margin-top: 0.24rem;
}
#footer .top .right a:hover {
    opacity: 1;
    color: #f68001;
}
#footer .bottom {
    margin-top: 30px;
}
@media (min-width: 1025px) {
    #footer .bottom {
        margin-top: -2.5em;
    }
    #footer .bottom .left dl dt {
        margin-bottom: 0.5em;
    }
}
@media (max-width: 1024px) {
    #footer .bottom .left,
    #footer .bottom {
        display: block;
    }
}
@media (min-width: 801px) {
    #footer .bottom .left {
        width: 46.875em;
        max-width: 70%;
        margin-bottom: -0.5rem;
    }
    #footer .bottom .left dl {
        box-sizing: border-box;
        margin-bottom: 0.5rem;
        padding-right: 0.5rem;
        display: block;
    }
    #footer .bottom .left dl:nth-of-type(2n-1) {
        width: 32%;
    }
    #footer .bottom .left dl:nth-of-type(2n) {
        width: 68%;
    }
}
@media (max-width: 800px) {
    #footer .bottom .left {
        margin-bottom: 40px;
    }
    #footer .bottom .left dl {
        margin-bottom: 6px;
    }
    #footer .bottom .left dt {
        width: 6em;
        opacity: 0.75;
    }
    #footer .bottom .left dd {
        flex: 1;
        opacity: 0.4;
    }
}
#footer .bottom .right {
    margin-top: auto;
    margin-bottom: 0;
}
#footer .bottom .code .fade {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(-8px);
    bottom: 100%;
    background-color: #fff;
    padding: 16px;
    border-radius: 0.5em;
}
#footer .bottom .code .fade:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #fff;
}
#footer .bottom .code img {
    width: 110px;
    height: 110px;
    max-width: unset;
}
#footer .bottom .touch {
    position: relative;
    margin-right: 1em;
}
#footer .bottom .touch:last-child {
    margin-right: 0;
}
#footer .bottom .touch .fade {
    margin-bottom: -10px;
}
#footer .bottom .touch .c {
    width: 2.4em;
    height: 2.4em;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: all 0.4s ease;
    border-radius: 2.4em;
}
#footer .bottom .touch:hover .c {
    background-color: #f68001;
    border-color: #f68001;
}
#footer .bottom .touch:hover .fade {
    margin-bottom: 0;
}
#footer .bottom .lang .c {
    width: 3.5em;
    padding: 0 1em;
}
#footer .bottom .lang .fade {
    right: 0;
    bottom: 100%;
}
#catalog {
    padding-top: 1rem;
    padding-bottom: 40px;
}
#catalog .main {
    height: 1rem;
    line-height: 1rem;
    font-size: 14px;
}
@media (max-width: 1140px) {
    #catalog {
        padding-top: 60px;
    }
    #catalog .main {
        height: 60px;
        line-height: 60px;
    }
}
#catalog a {
    display: inline;
    color: #f68001;
    text-decoration: underline;
}
#catalog a:nth-last-of-type(1) {
    color: #999;
    text-decoration: none;
}
#catalog a:nth-last-of-type(1):hover {
    color: #f68001;
    text-decoration: underline;
}
#catalog span {
    opacity: 0.5;
    padding: 0 0.5em;
}
#catalog span:last-child {
    display: none;
}
#profile .datum {
    margin-top: 30px;
}
#profile .section-title {
    padding-bottom: 20px;
    margin-bottom: 1rem;
}
@media (max-width: 1024px) {
    #profile .main {
        display: block;
    }
}
@media (min-width: 1025px) {
    #profile .main .datum {
        font-size: 20px;
        width: 24em;
        margin-top: 0;
    }
    #profile .main .left {
        flex: 1;
        margin-right: 1.4rem;
    }
}
#profile .container {
    padding: 0 16px;
    margin: 2.5em -1rem 0;
    background-image: url(../images/profile-bg1.jpg);
}
@media (max-width: 1280px) and (min-width: 641px) {
    #profile .container {
        margin: 30px -20px 0;
    }
}
@media (max-width: 640px) {
    #profile .container {
        margin: 30px -16px 0;
    }
}
#profile .container .content {
    margin: 0 auto;
    background-color: red;
    background-image: url(../images/profile-bg2.jpg);
    background-attachment: fixed;
    mask-image: url(../images/profile-mask.png);
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-image: url(../images/profile-mask.png);
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
}
@media (min-width: 801px) {
    #profile .container .content {
        width: 66%;
        max-width: 1120px;
    }
}
#profile .container .content:after {
    content: "";
    display: block;
    padding-top: 58.03%;
}
#poster .content {
    max-width: 1500px;
    margin: 0 auto;
}
#poster .content:after {
    content: "";
    display: block;
    padding-top: 53.4%;
}
#history {
    background-color: #f5f5f5;
    overflow: hidden;
}
#history .wrapper {
    margin: 0 auto;
    max-width: 1320px;
}
#history .gallery {
    padding-bottom: 20px;
    margin-bottom: 0.8rem;
}
#history .gallery .img {
    border-radius: 1em;
}
#history .gallery .img:after {
    content: "";
    display: block;
    padding-top: 62.75%;
}
@media (min-width: 641px) {
    #history .gallery .img {
        width: 43%;
    }
    #history .gallery .box {
        margin: auto 0;
        flex: 1;
        padding-left: 0.8rem;
    }
    #history .gallery .year {
        color: #f68001;
        font-size: 1.8em;
        font-weight: bold;
        line-height: 1;
        margin-bottom: 0.5em;
        padding-bottom: 0.2rem;
    }
}
@media (max-width: 640px) {
    #history .gallery .swiper-slide {
        display: block;
    }
    #history .gallery .img {
        margin-bottom: 20px;
    }
    #history .gallery .swiper-change,
    #history .gallery .year {
        display: none;
    }
}
#history .container:before {
    content: "";
    position: absolute;
    left: -1.3rem;
    right: -1.3rem;
    top: 4px;
    height: 3px;
    background-image: linear-gradient(90deg, transparent 0%, #f68001 8%, #f68001 92%, transparent 100%);
    background-image: -webkit-linear-gradient(0deg, transparent 0%, #f68001 8%, #f68001 92%, transparent 100%);
}
#history .thumbs .swiper-slide {
    text-align: center;
    font-weight: bold;
    line-height: 1;
    color: #7a7a7a;
    transition: all 0.4s ease;
    width: 16.666666%;
    cursor: pointer;
}
@media (max-width: 1024px) {
    #history .thumbs .swiper-slide {
        width: 20%;
    }
}
@media (max-width: 800px) {
    #history .thumbs .swiper-slide {
        width: 25%;
    }
}
#history .thumbs .swiper-slide:before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 100%;
    background-color: #f5f5f5;
    border: 3px solid #f68001;
    margin: 0 auto calc(10px + 0.1rem);
}
#history .thumbs .swiper-slide-thumb-active {
    color: #f68001;
}
#honor {
    background-color: #f5f5f5;
}
#honor .main {
    background-color: #fff;
    border-radius: 1em;
    padding: 0.9rem 0;
    box-shadow: 0 0.5em 2.5em rgba(0, 0, 0, 0.07);
    overflow: hidden;
}
@media (max-width: 1060px) {
    #honor .main {
        padding: 50px 0;
    }
}
#honor .swiper {
    padding-bottom: 30px;
    margin-bottom: 0.3rem;
    overflow: visible;
}
#honor .swiper .swiper-slide {
    width: 16.666666%;
}
@media (max-width: 1280px) {
    #honor .swiper .swiper-slide {
        width: 20%;
    }
}
@media (max-width: 800px) {
    #honor .swiper .swiper-slide {
        width: 33.3333333%;
    }
}
@media (max-width: 640px) {
    #honor .swiper .swiper-slide {
        width: 50%;
    }
}
#honor .swiper .item {
    margin: 0 0.2rem;
    box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, 0.17);
    transform: scale(0.9);
}
#honor .swiper .item:after {
    padding-top: 143%;
}
#honor .swiper .swiper-slide-active .item {
    transform: scale(1.1);
}
#honor .tip {
    text-align: center;
    color: #ababab;
}
#honor .mouse {
    width: 2.5em;
    height: 2.5em;
    margin: 0 1.125em;
}
#honor .mouse .c1 {
    fill: none;
    stroke-width: 1px;
    stroke: #888;
}
#honor .t {
    margin-top: 1em;
}
#honor + #partner .swiper {
    padding-top: 0;
    height: 26em;
}
#honor + #partner .swiper-slide {
    height: 50%;
}
#products .tabs {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-top: 1em;
    padding-bottom: 1em;
}
#products .aside,
#products .content {
    padding: 1rem 0;
}
#products .aside {
    position: sticky;
    top: 1rem;
    width: 20em;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    margin-right: 1rem;
    padding-left: 1.6em;
    padding-right: 1.6em;
    box-sizing: border-box;
}
@media (max-width: 1024px) {
    #products .aside {
        display: none;
    }
}
#products .aside .tt {
    line-height: 1;
    font-size: 1.3em;
}
#products .aside dl {
    padding-top: 20px;
    margin-top: 0.4rem;
}
#products .aside a {
    position: relative;
}
#products .aside a:before {
    content: "";
    position: absolute;
    left: -1.6em;
}
#products .aside dd .tf {
    flex: 1;
    margin-right: 2em;
    max-height: 2.6em;
}
#products .aside dd .icon {
    color: #999;
}
#products .aside dd a {
    margin-top: 1em;
    color: #999;
    height: 42px;
    line-height: 1.3;
}
@media (max-width: 1200px) {
    #products .aside dd a {
        height: 36px;
    }
}
#products .aside dd a:before {
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: #999;
    transition: inherit;
    margin-left: -2px;
}
#products .aside dd a.on,
#products .aside dd a:hover {
    color: #f68001;
}
#products .aside dd a.on:before,
#products .aside dd a:hover:before {
    background-color: #f68001;
}
#products .aside dt a:before {
    background-color: #f68001;
    width: 0.45em;
    height: 0.45em;
    margin-left: -0.25em;
    top: 50%;
    margin-top: -0.225em;
}
#products .content {
    flex: 1;
}
@media (max-width: 1024px) {
    #products .content {
        font-size: 14px;
        width:  100%;
    }
}
#products .list .tt {
    font-size: 1.3em;
}
#products .list .txt {
    padding: 1em 0;
    margin-bottom: 0.4rem;
    opacity: 1;
}
#products .list .txt .a {
    -webkit-line-clamp: 3;
    height: 4.8em;
    opacity: 0.7;
}
#products .list .txt .b {
    margin: calc(10px + 0.2rem) 0;
    -webkit-line-clamp: 4;
    height: 6.4em;
}
#products .list .txt dl {
    line-height: 1;
    margin-right: 0.6rem;
}
#products .list .txt dl:last-child {
    margin-right: 0;
}
#products .list .txt dl dt {
    opacity: 0.8;
}
#products .list .txt dl dd {
    color: #f68001;
    font-style: italic;
    margin-top: 4px;
}
#products .list .txt dl dd:after {
    content: attr(data-content);
    font-style: normal;
    padding-left: 1em;
}
#products .list .opt .t {
    font-size: 0.8em;
    margin-left: 0.5em;
    font-weight: bold;
}
#products .list .opt .c {
    width: 9em;
    height: 3em;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 1.5em;
    color: #7a7a7a;
    margin-right: 1.5em;
}
#products .list .opt .c:last-child {
    margin-right: 0;
}
#products .list .opt .c:hover {
    color: #fff;
    border-color: #f68001;
    background-color: #f68001;
}
#products .list .item {
    border-radius: 1em;
    background-color: #f5f5f5;
    margin-top: 1.5em;
    padding: 0.8rem 0.9rem;
}
#products .list .item:first-child {
    margin-top: 0;
}
#products .list .img:after {
    content: "";
    display: block;
    padding-top: 60%;
}
@media (min-width: 641px) {
    #products .list .left {
        width: 48%;
    }
    #products .list .img {
        flex: 1;
        margin-left: 0.8rem;
    }
}
@media (max-width: 640px) {
    #products .list .item {
        display: block;
    }
    #products .list .opt {
        width: fit-content;
        margin: 0 auto 20px;
    }
}
@media (max-width: 500px) {
    #products .list .item {
        padding: 20px;
    }
}
#pdetail .plate1 {
    background-color: #f5f5f5;
    border-radius: 1em;
    padding: 1rem;
}
#pdetail .plate1 .top {
    padding-bottom: 20px;
    margin-bottom: 0.4rem;
}
#pdetail .plate1 .top .touch-box .button {
    background-color: #f68001;
    color: #fff;
    width: 10em;
    height: 3em;
    border-radius: 1.5em;
    margin-left: 1em;
}

@media (max-width: 1280px) {
    #pdetail .plate1 .top .touch-box .button {
        font-size: 14px;
    }
}
#pdetail .plate1 .top .touch-box .button .icon {
    font-size: 1.6em;
}
#pdetail .plate1 .top .touch-box .button .tf {
    font-weight: bold;
    margin-left: 0.5em;
}
@media (min-width: 801px) {
    #pdetail .plate1 .top .section-title {
        margin-right: 1rem;
        
    }
    #pdetail .plate1 .top .section-title .t1{
        margin-top: .3rem;
    }
    #pdetail .plate1 .top .touch {
        z-index: 50;
        height: 100%;
    }
    #pdetail .plate1 .top .touch .fade {
        padding: 0.6rem;
        background-color: #fff;
        border-radius: 1em;
        position: absolute;
        box-sizing: border-box;
        width: 10rem;
        right: 0;
        top: 100%;
        transform-origin: top right;
        margin-top: 2.25em;
        transform: scale(0.8);
        filter: drop-shadow(2px 2px 4em rgba(0, 0, 0, 0.1));
    }
    #pdetail .plate1 .top .touch .fade:before {
        content: "";
        position: absolute;
        right: 9%;
        bottom: 100%;
        border-left: 2.5em solid transparent;
        border-bottom: 2.25em solid #fff;
    }
        #pdetail .plate1 .top .touch:hover .fade {
         transform: scale(1);
    }
}
@media (max-width: 800px) {
    #pdetail .plate1 .top {
        display: block;
        margin-top: 16px;
    }
    #pdetail .plate1 .top .section-title {
        margin-bottom: 24px;
    }
    #pdetail .plate1 .top .section-title .cn {
        font-size: 2em;
    }
}
#pdetail .plate1 .aside dl {
    margin-top: 0.7rem;
    padding-top: 20px;
}
#pdetail .plate1 .aside dl:first-child {
    margin-top: 0;
    padding-top: 0;
}
#pdetail .plate1 .aside dt {
    font-weight: bold;
}
#pdetail .plate1 .aside .t {
    font-size: 0.9em;
    opacity: 0.5;
    margin-top: 0.5em;
}
#pdetail .plate1 .content dl {
    margin-top: 0.4rem;
    padding-top: 20px;
}
#pdetail .plate1 .content dl:first-child {
    margin-top: 0;
    padding-top: 0;
}
#pdetail .plate1 .content dt {
    font-size: 1.3em;
}
#pdetail .plate1 .content dd {
    margin-top: 0.5em;
    border-radius: 1em;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px 1rem;
    box-sizing: border-box;
    min-height: 3.7rem;
}
#pdetail .plate1 .content .img {
    min-width: 72%;
    max-width: 360px;
}
#pdetail .plate1 .content .view .t {
    font-size: 1.125em;
    line-height: 1.5;
    height: 3em;
}
#pdetail .plate1 .content .view .a {
    margin-top: 1.25em;
}
#pdetail .plate1 .content .view .b {
    font-size: 0.875em;
    opacity: 0.8;
}
#pdetail .plate1 .content .view .c {
    color: #f68001;
    font-size: 1.875em;
    font-style: italic;
    line-height: 1;
}
#pdetail .plate1 .content .view .c:after {
    content: attr(data-content);
    font-style: normal;
    font-size: 0.5em;
    padding-left: 0.3em;
}
#pdetail .plate1 .content .view .c:nth-of-type(2) {
    margin: 0 0 0 auto;
}
@media (min-width: 1025px) {
    #pdetail .plate1 .aside {
        width: 10em;
    }
    #pdetail .plate1 .aside dd {
        display: block;
    }
    #pdetail .plate1 .aside .g {
        padding-top: 0.5em;
        margin-top: 0.3rem;
    }
    #pdetail .plate1 .content {
        flex: 1;
        margin-right: 0.4rem;
    }
}
@media (max-width: 1024px) {
    #pdetail .plate1 .container {
        display: block;
    }
    #pdetail .plate1 .aside {
        margin-top: 30px;
    }
    #pdetail .plate1 .aside .img {
        width: 5em;
        height: 5em;
        object-fit: contain;
    }
    #pdetail .plate1 .aside dd {
        margin: 0 -20px 0 0;
        font-size: 14px;
    }
    #pdetail .plate1 .aside .g {
        box-sizing: border-box;
        padding: 20px 20px 0 0 ;
    }
}
@media (min-width: 641px) {
    #pdetail .plate1 .content .view {
        flex: 1;
        margin-left: 1rem;
    }
    #pdetail .plate1 .content .pic {
        width: 6rem;
    }
}
@media (max-width: 640px) {
    #pdetail .plate1 .aside .g {
        width: 33.33333%;
    }
    #pdetail .plate1 .content dd {
        padding: 20px;
        display: flex;
flex-wrap: wrap;
    }
    #pdetail .plate1 .content .pic {
        margin-bottom: 16px;
        width: 100%;
    }
    #pdetail .plate1 .content .view .a {
        margin-top: 10px;
    }
    #pdetail .plate1 .content .view .c {
        font-size: 1.5em;
    }
}
#pdetail .split {
    padding: 30px 0;
}
#pdetail .split:after {
    content: "";
    display: block;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin: 0.5rem 0;
}
#pdetail .plate2 .item .box {
    padding: 1rem 1rem 0.8rem;
}
#pdetail .plate2 .item .img {
    padding-bottom: 70%;
}
.spe-figure .item {
    margin-bottom: 30px;
}
.spe-figure .item .desc{
     padding: 1rem ;
}
#pdetail .plate3 li .box {
    padding: 1rem 1rem 20px;
}
#pdetail .plate3 li .pic{
    text-align: center;
}
/*#pdetail .plate3 li:nth-of-type(1) .box,*/
/*#pdetail .plate3 li:nth-of-type(2) .box,*/
/*#pdetail .plate3 li:nth-of-type(3) .box {*/
/*    padding: 1rem 1rem 20px;*/
/*}*/
/*#pdetail .plate3 li:nth-of-type(1) .pic,*/
/*#pdetail .plate3 li:nth-of-type(2) .pic,*/
/*#pdetail .plate3 li:nth-of-type(3) .pic {*/
/*    text-align: center;*/
/*}*/
/*#pdetail .plate3 li:nth-of-type(4),*/
/*#pdetail .plate3 li:nth-of-type(4) ~ li {*/
/*    width: 50%;*/
/*}*/
/*#pdetail .plate3 li:nth-of-type(4) .item,*/
/*#pdetail .plate3 li:nth-of-type(4) ~ li .item {*/
/*    padding: 0.8rem 1rem 0.5rem;*/
/*}*/
/*#pdetail .plate3 li:nth-of-type(4) .pic,*/
/*#pdetail .plate3 li:nth-of-type(4) ~ li .pic {*/
/*    margin-top: 0.5rem;*/
/*    padding-top: 10px;*/
/*}*/
/*@media (min-width: 801px) {*/
/*    #pdetail .plate3 li:nth-of-type(6) {*/
/*        width: 100%;*/
/*    }*/
/*    #pdetail .plate3 li:nth-of-type(6) .item {*/
/*        padding: 1rem;*/
/*        -webkit-box-orient: vertical;*/
/*        -ms-flex-direction: row;*/
/*        -webkit-flex-direction: row;*/
/*        flex-direction: row;*/
/*    }*/
/*    #pdetail .plate3 li:nth-of-type(6) .box {*/
/*        box-sizing: border-box;*/
/*        width: 50%;*/
/*        padding-right: 1rem;*/
/*        margin: auto;*/
/*    }*/
/*    #pdetail .plate3 li:nth-of-type(6) .pic {*/
/*        width: 50%;*/
/*        border: 1px solid rgba(0, 0, 0, 0.1);*/
/*        border-radius: 1em;*/
/*        text-align: right;*/
/*    }*/
/*}*/
#pdetail .plate4 .view {
    overflow-y: auto;
}
#pdetail .plate4 .view {
    /*max-width: 1400px;*/
    margin: 0 auto;
}
#pdetail .plate4 .view table {
    min-width: 100%;
}
#pdetail .plate4 .view table td {
    height: 3.125em;
    vertical-align: middle;
    background-color: #f7f7f7;
    border-right: 1px solid #dedede;
    border-bottom: 0.25em solid #fff;
    padding: 0 0.8rem;
}
#pdetail .plate4 .view table td:first-child {
    text-align: center;
    background-color: #f2f2f2;
    min-width: calc(4em + 1.6rem);
}
#pdetail .plate4 .view table td:last-child,
#pdetail .plate4 .view table td:first-child {
    border-right: none;
}
#plans {
    overflow: hidden;
}
#plans .top {
    padding-bottom: 0.3rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#plans .top .section-title {
    text-align: left;
}
#plans .content,
#plans .aside {
    padding-top: 1rem;
}
@media (max-width: 960px) {
    #plans .content,
    #plans .aside {
        padding-top: 50px;
    }
}
#plans .aside .tt {
    line-height: 1;
    font-size: 1.2em;
}
#plans .aside .line {
    padding: 10px 0;
    margin: 0.3rem 0;
}
#plans .aside .line:after {
    content: "";
    display: block;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#plans .aside dl {
    margin-bottom: 0.6rem;
    padding-bottom: 20px;
}
#plans .aside dd {
    margin-right: -1.5em;
}
#plans .aside .radio,
#plans .aside .checkbox {
    color: #999;
}
#plans .aside .radio .cc,
#plans .aside .checkbox .cc {
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: #f5f5f5;
}
#plans .aside .radio .cc:before,
#plans .aside .checkbox .cc:before {
    opacity: 0;
    line-height: 1;
}
#plans .aside .radio .cc,
#plans .aside .checkbox .cc,
#plans .aside .radio .cc:before,
#plans .aside .checkbox .cc:before {
    transition: all 0.4s ease;
}
#plans .aside .radio .v,
#plans .aside .checkbox .v {
    font-size: 0.8em;
    margin-left: 0.375em;
}
#plans .aside .radio.on .cc:before,
#plans .aside .checkbox.on .cc:before {
    opacity: 1;
}
#plans .aside .radio.on,
#plans .aside .checkbox.on,
#plans .aside .radio:hover,
#plans .aside .checkbox:hover {
    color: #f68001;
}
#plans .aside .radio.on .cc,
#plans .aside .checkbox.on .cc,
#plans .aside .radio:hover .cc,
#plans .aside .checkbox:hover .cc {
    border-color: #f68001;
}
#plans .aside .radio .cc {
    width: 1em;
    height: 1em;
}
#plans .aside .radio .cc:before {
    content: "";
    display: block;
    border-radius: 100%;
    width: 0.4em;
    height: 0.4em;
    background-color: #f68001;
}
#plans .aside .checkbox {
    min-width: 50%;
    box-sizing: border-box;
    margin-top: 1em;
    padding-right: 1.5em;
}
@media (max-width: 1024px) {
    #plans .aside .checkbox {
        min-width: 33.33333%;
    }
}
#plans .aside .checkbox .cc {
    width: 1.2em;
    height: 1.2em;
    border-radius: 0.2em;
}
#plans .aside .checkbox .cc:before {
    content: "✔";
    display: block;
}
#plans .aside dt .t {
    font-size: 0.9em;
}
#plans .aside .button {
    width: 8em;
    height: 2.3em;
    border: 1px solid #b7b7b7;
    border-radius: 2.3em;
    color: #b7b7b7;
}
#plans .aside .button .t {
    font-size: 0.8em;
    margin-left: 0.5em;
}
#plans .aside .button:hover {
    border-color: #f68001;
    color: #fff;
    background-color: #f68001;
}
#plans .list {
    margin: -1.5em -1.5em 0 0;
}
#plans .list li {
    width: 33.33333%;
}
@media (max-width: 800px) {
    #plans .list li {
        width: 50%;
    }
}
#plans .list .item {
    margin: 1.5em 1.5em 0 0;
    border-radius: 1em;
    padding: 1.6em;
    background-color: #f5f5f5;
    border: 1px solid transparent;
}
#plans .list .item:hover {
    border-color: #f68001;
    background-color: #fff;
    box-shadow: 0 2px 2em rgba(0, 0, 0, 0.1);
}
#plans .list .img {
    padding-top: 81.25%;
    border-radius: 1em;
}
#plans .list .t {
    font-size: 1.2em;
    line-height: 1;
    padding: 0.5em 0;
    margin: 0.2rem 0 0.1rem;
}
#plans .list .l {
    opacity: 0.7;
    font-size: 0.7em;
    padding-top: 12px;
    margin-top: 0.2rem;
}
@media (max-width: 640px) {
    #plans .list .item {
        padding: 16px 9px;
    }
    #plans .list .t {
        font-size: 15px;
    }
    #plans .list .txt {
        font-size: 12px;
    }
}
@media (min-width: 1025px) {
    #plans .aside {
        width: 18em;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
        box-sizing: border-box;
        padding-right: 0.7rem;
    }
    #plans .content {
        flex: 1;
        margin-left: 1rem;
    }
}
@media (max-width: 1024px) {
    #plans .container {
        display: block;
    }
    #plans .content {
        padding-top: 0;
        font-size: 14px;
    }
    #plans .list {
        margin: -10px -10px 0 0;
    }
    #plans .list .item {
        margin: 10px 10px 0 0;
    }
}
#pldetail {
    overflow: hidden;
}
#pldetail .section-title {
    margin-bottom: 0;
}
#pldetail .info {
    margin: -0.5em -0.8rem 0.5rem 0;
    padding-bottom: 20px;
}
#pldetail .info dl {
    padding: 0.5em 0.8rem 0 0;
}
#pldetail .info dd {
    color: #f68001;
}
#pldetail .info dt {
    white-space: nowrap;
}
@media (max-width: 800px) {
    #pldetail .info {
        margin-right: -30px;
    }
    #pldetail .info dl {
        padding-right: 30px;
    }
}
#pldetail .content .pic {
    margin-bottom: 30px;
}
#pldetail .content .pic img {
    border-radius: 1em;
}
@media (min-width: 1025px) {
    #pldetail .section-title {
        max-width: 11rem;
    }
    #pldetail .back {
        order: 2;
    }
    #pldetail .content .pic {
        flex: 1;
        margin-right: 0.3rem;
        padding-right: 20px;
        margin-bottom: 0;
    }
    #pldetail .content .view {
        width: 6.6rem;
    }
}
@media (max-width: 1025px) {
    #pldetail {
        margin-top: -30px;
    }
    #pldetail .back {
        color: #999;
        margin: 0 0 30px;
    }
    #pldetail .content {
        display: block;
    }
}
#recom {
    background-color: #f5f5f5;
}
#recom .main {
    padding: 24px 0;
    max-width: 1200px;
}
#recom .left .img:after {
    content: "";
    display: block;
    padding-top: 87.5%;
}
#recom .left dl {
    flex: 1;
}
#recom .left dt {
    font-size: 1.2em;
    line-height: 1.35;
}
#recom .left dd {
    font-size: 0.9em;
    margin-top: 0.3em;
}
#recom .right .button {
    width: 9em;
    height: 3em;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #666;
    border-radius: 1.5em;
    margin-right: 1.8em;
}
#recom .right .button:last-child {
    margin-right: 0;
}
#recom .right .button:hover {
    background-color: #f68001;
    border-color: #f68001;
    color: #fff;
}
#recom .right .tf {
    font-weight: bold;
    margin-left: 0.5em;
}
@media (min-width: 801px) {
    #recom .left {
        flex: 1;
        margin-right: 0.8rem;
    }
    #recom .left .img {
        width: 11.5em;
        margin-right: 0.5rem;
    }
}
@media (max-width: 800px) {
    #recom .main {
        display: block;
    }
    #recom .left {
        max-width: 480px;
        width: fit-content;
        margin: 0 auto 20px;
    }
    #recom .left .img {
        width: 160px;
        max-width: 35vw;
        margin-right: 20px;
    }
}
#infor .top .section-title {
    text-align: left;
}
#infor .top .gallery .date {
    line-height: 1;
    opacity: 0.6;
    margin-bottom: 0.2rem;
    font-size: 0.8em;
}
#infor .top .gallery .item {
    background-color: #f5f5f5;
    padding: 1rem 0.9rem;
    border-radius: 0.5em;
}
#infor .top .gallery .img {
    padding-top: 55%;
    border-radius: 0.5em;
    margin-bottom: 12px;
}
#infor .top .gallery .a {
    font-size: 1.3em;
    line-height: 1.3;
    height: 2.6em;
}
@media (max-width: 1024px) {
    #infor .top .gallery .a {
        font-size: 18px;
    }
}
#infor .top .gallery .txt {
    -webkit-line-clamp: 3;
}
@media (max-width: 1024px) {
    #infor .top .gallery .txt {
        font-size: 13px;
    }
}
@media (min-width: 801px) {
    #infor .top {
        background: url(../images/new.jpg) no-repeat scroll left bottom;
        background-size: 6rem auto;
    }
    #infor .top .thumbs {
        position: absolute;
        left: 0;
        top: 0;
        width: 4rem;
        bottom: -0.8em;
    }
    #infor .top .thumbs .swiper-slide {
        height: 33.333333%;
        box-sizing: border-box;
        padding-bottom: 0.8em;
    }
    #infor .top .thumbs .img {
        height: 100%;
        border-radius: 0.5em;
        border: 2px solid transparent;
        transition: all 0.4s ease;
        box-sizing: border-box;
    }
    #infor .top .thumbs .swiper-slide-thumb-active .img {
        border-color: #f68001;
    }
    #infor .top .swiper-pagination {
        display: none;
    }
    #infor .top .content {
        width: 6rem;
        padding-left: 4.6rem;
    }
    #infor .top .gallery .img {
        display: none;
    }
    #infor .top .gallery .line {
        padding: 10px 0;
        margin: 0.5rem 0;
    }
    #infor .top .gallery .line:after {
        content: "";
        display: block;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
    #infor .top .gallery .look {
        margin-bottom: 1.3rem;
    }
    #infor .top .gallery .txt {
        height: 4.8em;
    }
}
@media (max-width: 800px) {
    #infor .top {
        display: block;
    }
    #infor .top .swiper-pagination {
        position: static;
        margin-top: 4px;
    }
    #infor .top .gallery .line,
    #infor .top .gallery .look {
        display: none;
    }
    #infor .top .gallery .a {
        height: 1.3em;
        -webkit-line-clamp: 1;
        margin: 8px 0;
    }
    #infor .top .gallery .txt {
        -webkit-line-clamp: 2;
    }
}
#infor .bottom {
    background-color: #f5f5f5;
}
@media (max-width: 1280px) {
    #infor .list {
        font-size: 14px;
    }
}
#infor .list .s {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.8em;
    width: 5.5em;
    height: 5.5em;
    box-sizing: border-box;
    text-align: center;
    line-height: 1;
    transition: all 0.4s ease;
}
#infor .list .s dt {
    font-size: 1.2em;
    margin-bottom: 0.5em;
}
#infor .list .s dd {
    font-size: 0.7em;
    opacity: 0.5;
}
#infor .list .content {
    flex: 1;
    margin: 0 0.6rem;
    max-width: 11rem;
}
#infor .list .content .t {
    -webkit-line-clamp: 1;
    height: 1.1em;
    line-height: 1.1;
    font-size: 1.2em;
}
#infor .list .look {
    margin: 0 0 0 auto;
}
#infor .list .item {
    margin-top: 0.4rem;
    border-radius: 1em;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 0.7rem 1rem;
}
#infor .list .item:hover {
    border-color: #f68001;
    background-color: #fff;
    box-shadow: 0 2px 2.5em rgba(0, 0, 0, 0.1);
}
#infor .list .item:hover .s {
    background-color: #f68001;
    border-color: #f68001;
    color: #fff;
}
#infor .list .item:first-child {
    margin-top: 0;
}
@media (max-width: 800px) {
    #infor .list .look {
        display: none;
    }
    #infor .list .item {
        margin-top: 0.8em;
        padding: 16px 12px;
    }
    #infor .list .content {
        margin: 0 0 0 12px;
        max-width: unset;
    }
}
#idetail .top {
    margin-bottom: 16px;
}
#idetail .top .date {
    color: #f68001;
}
#idetail .section-title {
    margin-bottom: 0.6rem;
    padding-bottom: 20px;
}
@media (max-width: 800px) {
    #idetail .section-title .cn {
        font-size: 2em;
    }
}
#idetail .rtf {
    padding-bottom: 1rem;
}
@media (max-width: 960px) {
    #idetail .rtf {
        padding-bottom: 50px;
    }
}
#idetail .navigate {
    color: #999;
}
#idetail .navigate .line {
    padding: 10px 0;
    margin: 0.2rem 0;
}
#idetail .navigate .line:after {
    content: "";
    display: block;
    border-top: 1px dotted rgba(0, 0, 0, 0.1);
}
#idetail .navigate a:hover {
    color: #f68001;
}
#idetail .aside dt {
    font-size: 1.2em;
    padding-bottom: 10px;
    margin-bottom: 0.3rem;
}
#idetail .aside .item:hover {
    color: #f68001;
}
#idetail .aside .t {
    line-height: 1.3;
}
#idetail .aside .img {
    border-radius: 0.4em;
    padding-top: 58%;
}
#idetail .aside .date {
    font-size: 0.8em;
    color: #999;
    margin: 0.4em 0;
    padding-top: 0.2em;
}
@media (min-width: 1025px) {
    #idetail .content {
        flex: 1;
    }
    #idetail .aside {
        width: 14em;
        padding-left: 1rem;
        border-left: 1px solid rgba(0, 0, 0, 0.1);
        margin-left: 1rem;
    }
    #idetail .aside .li {
        margin-top: 0.5rem;
    }
    #idetail .aside .li:first-child {
        margin-top: 0;
    }
    #idetail .aside .t {
        height: 2.6em;
    }
}
@media (max-width: 1024px) {
    #idetail .main {
        display: block;
    }
    #idetail .aside {
        margin-top: 50px;
    }
    #idetail .aside .t {
        height: 1.3em;
        -webkit-line-clamp: 1;
    }
    #idetail .aside dd {
        margin: -30px -20px 0 0;
    }
    #idetail .aside .li {
        width: 33.333333%;
        box-sizing: border-box;
        padding: 30px 12px 0 0;
    }
}
@media (max-width: 640px) {
    #idetail .aside .li {
        width: 50%;
    }
}
#question .ul .go {
    margin-top: 0.4rem;
}
#question .ul .t {
    line-height: 1.4;
    height: 2.8em;
}
@media (min-width: 801px) {
    #question .ul .item {
        padding: 0.7rem;
    }
}
#case .ul .item:hover .t {
    color: #f68001;
}
#case .ul .go {
    margin-top: 0.3rem;
}
#case .ul .img {
    border-radius: 0.4em;
    padding-top: 62.5%;
    margin-bottom: 0.4rem;
}
#case .ul .t {
    margin-bottom: 0.2rem;
    transition: inherit;
}
@media (max-width: 1024px) {
    #case .ul .t {
        font-size: 16px;
    }
    #case .ul .txt {
        font-size: 13px;
    }
}
@media (min-width: 801px) {
    #case .ul .item {
        padding: 0.4rem;
    }
}
body:has(#contact) {
    background-color: #f5f5f5;
}
#contact {
    overflow: hidden;
}
#contact .content {
    width: fit-content;
    z-index: 2;
}
#contact .content li {
    margin-top: 1.6em;
}
#contact .content li:first-child {
    margin-top: 0;
}
#contact .content .cc {
    flex-shrink: 0;
    width: 4em;
    height: 4em;
    background-color: #fff;
    color: #f68001;
    margin-right: 1em;
    box-shadow: 0 2px 1.5em rgba(0, 0, 0, 0.1);
}
#contact .content .cc .icon {
    font-size: 1.2em;
}
#contact .content dt {
    line-height: 1;
}
#contact .content dd {
    font-size: 1.25em;
    margin-top: 0.5em;
    line-height: 1.35;
}
#contact .sub {
    font-size: 2em;
    padding: 20px 0;
    margin: 0.5rem 0 0.2rem;
}
@media (max-width: 1024px) {
    #contact .content .ul {
        font-size: 14px;
    }
    #contact .content dt {
        opacity: 0.5;
    }
    #contact #map {
        position: relative;
        margin: 30px -16px 0;
        height: 360px;
    }
}
#contact .form {
    border-radius: 1em;
    overflow: hidden;
}
#contact .form .top {
    background-color: rgba(255, 255, 255, 0.35);
}
#contact .form .top .item {
    height: 3.8em;
    flex: 1;
    border-bottom: 2px solid transparent;
    transition: all 0.4s ease;
}
#contact .form .top .item.on {
    background-color: rgba(246, 128, 1, 0.1);
    border-color: #f68001;
    font-weight: bold;
}
#contact .form .top .t {
    font-size: 1.2em;
}
#contact .container {
    padding: 1rem;
    background-image: url(../images/form.jpg);
}
#contact .wrapper .img {
    border-radius: 1em;
}
#contact .wrapper .view .t1 {
    font-size: 0.9em;
    line-height: 1;
}
#contact .wrapper .view .t2 {
    font-size: 2em;
    line-height: 1;
    margin-top: 0.6em;
    padding-bottom: 20px;
    margin-bottom: 0.2rem;
}
#contact .wrapper .ul {
    margin: -1em -0.5em 0 0;
    padding-bottom: 20px;
}
#contact .wrapper .ul li {
    box-sizing: border-box;
    padding: 1em 0.5em 0 0;
}
#contact .wrapper .ul li:last-child {
    width: 100%;
}
#contact .wrapper .ul textarea,
#contact .wrapper .ul input {
    padding: 15px 20px;
    width: 100%;
    font-size: 14px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    background-color: #f5f5f5;
    transition: all 0.4s ease;
}
#contact .wrapper .ul textarea:focus,
#contact .wrapper .ul input:focus {
    background-color: rgba(246, 128, 1, 0.1);
    border-color: #f68001;
}
#contact .wrapper .ul input {
    height: 60px;
}
#contact .wrapper .ul textarea {
    height: 100px;
}
#contact .wrapper .button {
    background-color: #f68001;
    color: #fff;
    cursor: pointer;
    margin-top: 0.2rem;
}
#contact .wrapper .button .tf {
    display: block;
}
@media (min-width: 1025px) {
    #contact .wrapper .img {
        width: 50%;
    }
    #contact .wrapper .view {
        flex: 1;
        padding: 1em 0 1em 0.6rem;
    }
    #contact .wrapper .button {
        width: 160px;
        height: 50px;
        border-radius: 50px;
    }
    #contact .wrapper .ul li {
        width: 50%;
    }
}
@media (max-width: 1024px) {
    #contact .wrapper {
        display: block;
    }
    #contact .wrapper .img {
        padding-top: 68%;
        margin-bottom: 24px;
    }
    #contact .wrapper .button {
        width: 140px;
        height: 45px;
        border-radius: 45px;
    }
    #contact .wrapper .ul li {
        width: 100%;
    }
    #contact .wrapper .ul input {
        height: 50px;
    }
}
#map {
    z-index: 0;
}
@media (min-width: 1025px) {
    #map {
        mask-image: url(../images/map.png);
        mask-size: 200% 100%;
        -webkit-mask-image: url(../images/map.png);
        -webkit-mask-size: 200% 100%;
        right: -1rem;
    }
}
#map .amap-marker .dot {
    width: 1.5em;
    height: 0.4em;
    border-radius: 100%;
    background-color: #f68001;
}
#map .amap-marker img {
    max-width: 90%!important;
}
#map .amap-marker .box {
    bottom: 100%;
    margin-bottom: 0.2em;
    width: 6.5em;
    height: 6.5em;
    background-color: #fff;
    filter: drop-shadow(0 2px 1.5em rgba(0, 0, 0, 0.2));
}
#map .amap-marker .box,
#map .amap-marker .box:after {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
#map .amap-marker .box:after {
    content: "";
    top: 100%;
    border-left: 0.3em solid transparent;
    border-right: 0.3em solid transparent;
    border-top: 0.4em solid #fff;
}
#service .top .section-title {
    text-align: left;
}
#service .banner {
    background-image: linear-gradient(180deg, transparent 0%, transparent 34%, #f5f5f5 34%, #f5f5f5 100%);
    background-image: -webkit-linear-gradient(-90deg, transparent 0%, transparent 34%, #f5f5f5 34%, #f5f5f5 100%);
}
#service .banner .img {
    border-radius: 1em;
}
#service .banner .add {
    max-width: 850px;
    margin: 0 auto;
}
#service .banner .add:after {
    padding-top: 58%;
}
#service .container {
    background-color: #f5f5f5;
}
#service .container .dt {
    font-size: 2em;
    text-align: center;
    padding-bottom: 16px;
    margin-bottom: 0.2rem;
}
#service .container .tabs {
    padding-bottom: 20px;
}
#service .container .tabs .item {
    margin: 0 0.25rem;
    background-color: #fff;
    width: 15em;
}


@media (max-width: 1400px){
    #service .container .tabs .item {
    margin: 0 0.15rem;
}
}
@media (max-width: 1024px) {
    #service .container .tabs {
        margin: -8px -4px 0;
        font-size: 14px;
    }
    #service .container .tabs .item {
        flex: 1;
        min-width: 35%;
        margin: 8px 4px 0;
    }
}
#service .cards {
    border-radius: 1em;
    background-image: url(../images/service.jpg);
    margin-top: 0.3rem;
    background-position: right bottom;
}
#service .cards .swiper-slide {
    height: auto;
}
#service .cards .item {
    padding: 1rem;
    height: 100%;
    box-sizing: border-box;
}
#service .cards .left .t1 {
    font-size: 0.9em;
    line-height: 1;
    padding-bottom: 10px;
}
#service .cards .left .r {
    margin: 0.2rem 0 auto 0;
    padding-bottom: 0.7rem;
}
#service .cards .left .t2 {
    font-size: 2em;
    line-height: 1.35;
    margin-right: 2em;
    white-space: pre;
}
#service .cards .left .img {
    width: 4.5em;
    height: 4em;
}
#service .cards .left .ul li {
    position: relative;
    padding: 10px 10px 0 1em;
    margin: 0.2rem 0.4rem 0 0;
}
#service .cards .left .ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.8em;
    width: 0.4em;
    height: 0.4em;
    border-radius: 100%;
    background-color: #f68001;
    margin-top: -0.2em;
    transform: translateY(10px);
}
@media (max-width: 1280px) {
    #service .cards .list {
        font-size: 16px;
    }
}
@media (max-width: 1280px) {
    #service .cards .right {
        font-size: 16px;
    }
}
#service .cards .right .t {
    padding-left: 2.2em;
    background: url(../images/list.png) no-repeat scroll left center;
    background-size: auto 1.4em;
}
#service .cards .right li {
    padding-bottom: 0.6em;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-top: 16px;
    margin-top: 0.3rem;
}
#service .cards .right li:first-child {
    padding-top: 0;
    margin-top: 0;
}
@media (min-width: 1025px) {
    #service .cards .left {
        flex: 1;
        padding-right: 1.2rem;
    }
    #service .cards .left .ul {
        max-width: 18em;
    }
    #service .cards .right {
        margin: auto 0;
        width: 8.2rem;
    }
    #service .cards .right .ul {
        width: fit-content;
        margin: 0 auto;
    }
}
@media (max-width: 1024px) {
    #service .cards .item {
        display: block;
    }
    #service .cards .left {
        margin-bottom: 40px;
    }
    #service .cards .left .ul {
        font-size: 13px;
    }
    #service .cards .left .ul li {
        padding-right: 0;
        margin-right: 0;
    }
}
@media (max-width: 800px) {
    #service .cards .item {
        padding: 30px 20px;
    }
}
#service .material {
    margin: -1.5em -1.5em 0 0;
}
@media (max-width: 1024px) {
    #service .material {
        font-size: 14px;
    }
}
#service .material .swiper-wrapper {
    height: 15em;
}
#service .material .swiper-slide {
    height: 50%;
    box-sizing: border-box;
    padding: 1.5em 1.5em 0 0;
    pointer-events: unset;
}
#service .material .tt {
    margin-right: 2em;
}
#service .material .d {
    padding: 0 0.4rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.4em;
    height: 6em;
    box-sizing: border-box;
    color: #555;
}
#service .material .d:hover {
    border-color: #f68001;
    background-color: #fff;
    box-shadow: 0 2px 2em rgba(0, 0, 0, 0.1);
    color: #f68001;
}
#service .material .swiper-pagination {
    position: static;
    padding-top: 20px;
    margin-top: 0.4rem;
    margin-left: -6px;
}
@media (max-width: 800px) {
    #service .material {
        margin: -0.75em -0.75em 0 0;
    }
    #service .material .swiper-wrapper {
        height: 13.5em;
    }
    #service .material .d {
        padding: 0 16px;
    }
    #service .material .swiper-slide {
        padding: 0.75em 0.75em 0 0;
    }
    #service .material .tt {
        margin-right: 1em;
    }
}