html,body{height:100%}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,PingFang SC,Microsoft YaHei,sans-serif;color:#222;background:#fff}
.dyui-container{max-width:1200px;margin:0 auto;padding:0 16px}

.dyui-header {background-color: #fff; box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.1); z-index: 99;}
.dyui-header .navbar {padding: 0}
.dyui-header .logo {height: 60px}
/*导航开始*/
.dyui-header .dyui-nav {padding: 0;}
.dyui-header .dyui-nav li a.c1 {color: #000; padding: 0 20px; height: 48px; line-height: 48px; display: block}
.dyui-header .dyui-nav li a.c1:hover {color: #0071c5}
.dyui-header .dyui-nav li a.dropdown-toggle::after {width: 8px; height: 8px; margin-top: 18px; margin-left: 6px; float: right; border-top:none; border-left:none; border-right: 1px solid #808080; border-bottom: 1px solid #808080; -webkit-transform: rotate(45deg);}
.dyui-header .dyui-nav li.active a.c1 {color: #00234D;}
.dyui-header .dyui-nav li.open .dropdown-menu {display: block;}

.navbar-toggler-icon i {color: #fff}
.dyui-nav .navbar-brand img {height: 40px}
.dyui-nav .form-inline .form-control {border-radius: 3px 0 0 3px; border: none}
.dyui-nav .form-inline .btn {border: solid 1px #98C30F; border-radius: 0 3px 3px 0; background-color: #98C30F; color: #fff}

.dyui-header .btn-search {border: solid 1px #fff; padding: 5px 10px; border-radius: 5px;}
.dyui-header .btn-search:hover {border: solid 1px #eee}
.dyui-header .btn-search i {color: #000; font-size: 18px}
.dyui-header .search-collapse {position: absolute; left: 0; right: 0; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; padding: 20px 0}
.dyui-header .search-collapse .form-control {border: solid 1px #eee; padding: 10px 20px;}



/*Phone手机*/
@media(max-width:767px) {

    .header-top .top-menu {width: 100%}
    .dyui-header {height: 46px; background-color: #fff; box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.1); }
    .dyui-header .navbar {padding: 2px 0 0 0;}
    .dyui-header .navbar .navbar-brand {padding: 0}
    .dyui-header .navbar .navbar-brand img {max-width: 100%; height: 20px; display: block; padding-left: 10px}
    .dyui-header .navbar .navbar-toggler {color: #333}
    .dyui-header .navbar .navbar-toggler i {font-size: 28px;}

    /*导航开始*/
    .dyui-header .dyui-container {padding-left: 0; padding-right: 0;}
    .dyui-header .navbar-collapse {background-color: #fff; padding: 10px; margin-top: 2px; box-shadow: 0 5px 10px rgba(0,0,0,0.1);}
    .dyui-header nav .navbar-nav .nav-item {white-space: nowrap}
    .dyui-header .dyui-nav li a.c1 {display: block; height: 40px; line-height: 40px}
    .dyui-header nav .navbar-nav .nav-link {line-height: 30px}
    .nav>li>.dropdown-menu {background-color: #f5f5f5; border: none}

    .dyui-header .btn-search {border: solid 1px #fff; padding: 0 10px; line-height: 40px}
    .dyui-header .search-collapse {padding: 20px 10px}

    .dyui-header .language {display: flex; padding: 10px}
    .dyui-header .language a {text-align: center; flex: 1; margin: 5px; background-color: #E5D8CB; height: 40px; line-height: 40px}

}



/*首页公司简介*/
.dyui-about {padding: 50px 0 50px; overflow: hidden; background: url("../images/about_bg.jpg") no-repeat center top}
.dyui-about .dyui-main-header {margin: 0 0 30px;}
.dyui-about .dyui-main-header2 {margin-bottom: 40px;}
.dyui-about .about-img img {width: 100%; border-radius: 40px 0 40px 0}
.dyui-about .about-text {font-size: 16px; line-height: 180%; margin: 0 0 10px 0; color: #666}

.dyui-about .about-ys {margin-top: 40px}
.dyui-about .about-ys .col-2 {flex: 0 0 20%; max-width: 20%}
.dyui-about .about-ys li .box {background-color: #fff; border: solid 1px #eee; padding: 20px}
.dyui-about .about-ys li .box b {font-size: 34px; font-weight: bold; color: #333;}
.dyui-about .about-ys li .box b i {font-size: 20px; font-weight: normal; color: #333; font-style: normal; margin-left: 5px}
.dyui-about .about-ys li .box p {font-size: 20px; color: #333;}
.dyui-about .about-ys li:hover .box {background-color: #34599f; border: solid 1px #34599f; color: #fff}
.dyui-about .about-ys li:hover .box * {color: #fff}

@media(max-width:767px) {
    .dyui-about .about-img::before {display: none}
    .dyui-about img {width: 100%; transform:initial}
    .dyui-about .about-text {padding-left: 0; padding-top: 10px}
    .dyui-about .about-more {text-align: center}
}


.dyui-footer{padding:16px 0;border-top:1px solid #eee;color:#666}
.dyui-footer a {color:#fff}
.dyui-sidebar{padding:12px;border:1px solid #eee;border-radius:8px}
.dyui-section{padding:12px;border-radius:8px;background:#fafafa}
.dyui-img{max-width:100%;height:auto;display:block;border-radius:8px}
.dyui-product-card{border:1px solid #eee;border-radius:8px;overflow:hidden;background:#fff}
.dyui-product-card .dyui-card-body{padding:12px}
/* 主页与通用组件 */
.dyui-hero{padding:40px 20px;border-radius:12px;background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 60%,#e0e7ff 100%)}
.dyui-hero-title{font-size:28px;font-weight:700;margin:0 0 8px}
.dyui-hero-sub{font-size:16px;color:#555;margin:0 0 16px}
.dyui-btns{display:flex;gap:12px;flex-wrap:wrap}
.dyui-btn{display:inline-block;padding:10px 16px;border-radius:8px;text-decoration:none;cursor:pointer}
.dyui-btn-primary{background:#1f6feb;color:#fff}
.dyui-btn-secondary{background:#e6e8eb;color:#111}
.dyui-card{border:1px solid #eee;border-radius:10px;background:#fff;overflow:hidden}
.dyui-card-header{padding:12px 16px;font-weight:600;border-bottom:1px solid #f0f0f0}
.dyui-card-body{padding:16px}
.dyui-tagbar{display:flex;gap:8px;flex-wrap:wrap}
.dyui-tag{padding:6px 10px;border-radius:999px;background:#f1f5f9;color:#111;cursor:pointer}
.dyui-form{display:grid;gap:12px}
.dyui-form label{font-weight:600}
.dyui-form input,.dyui-form textarea,.dyui-form select{width:100%;padding:10px;border:1px solid #ddd;border-radius:8px}
.dyui-form .dyui-btn-primary{align-self:start}
/* 卡片图片占位 */
.dyui-img-placeholder{width:100%;aspect-ratio:4/3;display:block;border-radius:8px;background:conic-gradient(from 180deg at 50% 50%,#e5e7eb, #f3f4f6, #e5e7eb)}



/* 轮播图 */
.banner {height: 780px; background-color: #0c1e42; overflow: hidden; position: relative;}
.banner .swiper-slide:after {content: ''; position: absolute; z-index: 0; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,0.1);}
.banner .box {display: flex; height: 100%; align-items: center}
.banner .swiper-caption {position: relative; z-index: 2;}
.banner .swiper-caption h5 {font-size: 60px; display: inline-block; color: #000}
.banner .swiper-caption p {font-size: 30px; line-height: 1.6; display: inline-block; color: #000; margin-top: 36px; letter-spacing: 2px;}
.banner .swiper-caption .btn {height: 50px; line-height: 38px; width: 240px; font-size: 18px; margin-top: 120px;}
.banner .swiper-button-prev,
.banner .swiper-button-next {box-sizing: content-box; color: #fff; width: 50px; height: 50px; padding: 4px; background-color: rgba(255,255,255,0.2); border-radius: 100px}
.banner .swiper-button-prev:after,
.banner .swiper-button-next:after {display: inline-block; width: 50px; height: 50px; line-height: 50px; border-radius: 100px; text-align: center; background-color: rgba(255,255,255,0.2); color: #fff; font-size: 20px;}
.banner .swiper-button-prev:hover:after,
.banner .swiper-button-next:hover:after {background-color: rgba(255,255,255,0.5);}
.banner .swiper-pagination-bullet {width: 12px; height: 12px; border-radius: 10px; background-color: #fff; opacity: 0.5}
.banner .swiper-pagination-bullet-active {background-color: #013281 !important; opacity: 1}
@media(max-width:768px) {
    .banner {height: 230px;}
    .banner .swiper-caption h5 {font-size: 30px;}
    .banner .swiper-caption p {font-size: 16px; line-height: 1.6; display: inline-block; color: #fff; margin-top: 15px; padding-left: 20px; padding-right: 20px;}
    .banner .swiper-button-prev,
    .banner .swiper-button-next {width: 30px; height: 30px;}

}

/* 面包屑 */
.dyui-breadcrumb .breadcrumb-item+.breadcrumb-item::before {color: rgba(255,255,255,0.5)}

/* 表单 */
.dyui-feedback {}
.dyui-feedback .form-group .control-label {width: 100%; margin-bottom: 5px}
@media(min-width:768px) {
    .dyui-feedback .form-group {width: 50%}
    .dyui-feedback .form-group .control-label {width: 100%; margin-bottom: 10px}
    .dyui-feedback .form-group .col-md-10 {width: 100%}
    .dyui-feedback .form-group#dr_row_content {width: 100%}
}

/*商品轮播图*/
.show-product-image {}
.show-product-image .main-image {border: solid 1px #ddd; overflow: hidden}
.show-product-image .main-image .swiper-prev {display: flex; align-items: center; justify-content: center; width: 50px; height: 100%; position: absolute; left: 0; top: 0; z-index: 10; cursor: pointer}
.show-product-image .main-image .swiper-next {display: flex; align-items: center; justify-content: center; width: 50px; height: 100%; position: absolute; right: 0; top: 0; z-index: 10; cursor: pointer}
.show-product-image .thumb-image {margin-top: 10px; display: flex; align-items: center; justify-content: space-between; position: relative}
.show-product-image .thumb-image .swiper-container {margin: 0 36px; flex: 1}
.show-product-image .thumb-image .swiper-slide {width: auto !important;}
.show-product-image .thumb-image .swiper-slide img {border: solid 1px #ddd; cursor: pointer}
.show-product-image .thumb-image .swiper-slide.active img {border: 1px solid #FF5722;}
.show-product-image .thumb-image .swiper-prev {display: flex; align-items: center; justify-content: center; background: #eee; width: 28px; height: 100%; position: absolute; left: 0; top: 0; z-index: 10; cursor: pointer}
.show-product-image .thumb-image .swiper-next {display: flex; align-items: center; justify-content: center; background: #eee; width: 28px; height: 100%; position: absolute; right: 0; top: 0; z-index: 10; cursor: pointer}
div.zoomDiv {z-index: 999; position: absolute; top: 0; left: 0; background: #ffffff; border: 1px solid #ddd; display: none; text-align: center; overflow: hidden; font-size: 0; }
div.zoomMask { position: absolute; background: url('../images/bg-mask.png') repeat scroll 0 0 transparent; cursor: move; z-index: 1; }