html {
	scroll-behavior: smooth;
}

.sewing {
	height: 1.1rem;
}

.header {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 6.4rem;
	padding: .2rem;
	margin: 0 auto;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 97;
	background: #fff;
}

.header .main-contain {
	align-items: center;
}

.header h1 {
	width: 1.5rem;
	height: .7rem;
	background:
	url(../images/logo.png)
	no-repeat
	left center/contain;
}

.header h1 a {
	text-indent: -9999px;
	display: inline-block;
	width: 100%;
	height: 100%;
}

.header .link, .header .button {
	display: flex;
	align-items: center;
}

.header .link {
	margin-left: auto;
}

.header .link a {
	color: #044997;
	font-size: .3rem;
	line-height: .4rem;
	display: block;
}

.header .link a:not(:last-child) {
	margin-right: .28rem;
}

.header .button {
	margin-left: .35rem;
}

.header .button .icon {
	width: .4rem;
	height: .4rem;
}

.header .button .icon:not(:last-child) {
	margin-right: .35rem;
}

.header .button .search-icon {
	background-image: url(../images/search.png);
}

.header .button .menu-icon {
	background-image: url(../images/menu.png);
}

.header .button .menu-icon.active {
    background-image: url(../images/close.png);
}

.header .form_box {
	width: 100%;
	max-width: 6.4rem;
	position: absolute;
	top: 1.1rem;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	background: rgba(0, 0, 0, .4);
	display: none;
	z-index: 99;
}

.header .form_box form {
	display: inline-block;
	position: relative;
	margin: .25rem 0;
	border-radius: 4px;
	overflow: hidden;
	box-sizing: border-box;
	width: 90%;
	max-width: 6.5rem;
}

.header .form_box form input.text {
	width: 6.5rem;
	height: .5rem;
	line-height: .5rem;
	border-bottom: 1px solid #ccc;
	background: none;
	font-size: .2rem;
	color: #666;
	outline: none;
	border: none;
	background: #fff;
	padding-left: .15rem;
	box-sizing: border-box;
}

.header .form_box form input.submit {
	width: .3rem;
	height: .3rem;
	margin-right: .15rem;
	background: none;
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url(../images/search2.png);
	background-size: contain;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}




.menubar {
	overflow-y: auto; 
	width: 100%;
	height: 100%;
	padding: .3rem .2rem .6rem;
	margin: 0 auto;
	position: fixed;
	top: 1.1rem;
	left: -100%;
	z-index: 99;
    transition: all ease-in-out .4s;
	background: #f4f4f4;
}

.menubar.active {
    left: 0;
}

.menubar .hd {
	color: #222;
	font-size: .26rem;
	line-height: .75rem;
	position: relative;
	border-bottom: 1px solid #dedede;
}

.menubar .hd::after {
	content: '>';
	color: #222;
	font-size: .28rem;
	top: 50%;
	right: 0;
    transition: all .3s;
	transform: translateY(-50%);
}

.menubar .hd.active::after {
	transform: translateY(-50%) rotate(90deg);
}

.menubar .column:nth-child(1) .hd::after,
.menubar .column:nth-child(8) .hd::after,
.menubar .column:nth-child(9) .hd::after {
    display: none;
}

.menubar .column .hd a {
    display: inline-block;
    height: 100%;
}

.menubar .column:nth-child(1) .hd a,
.menubar .column:nth-child(8) .hd a,
.menubar .column:nth-child(9) .hd a {
    width: 100%;
}

.menubar .contain {
    display: none;
}

.menubar .drop-down {
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: .15rem .15rem .25rem;
}

.menubar .pro-contain .drop-down {
	background: #fff;
}

.menubar .drop-down .li {
	color: #666;
	font-size: .22rem;
	line-height: .5rem;
}

.menubar .pro-contain .drop-down .li {
	font-size: .22rem;
}

.menubar .pro-contain {
	margin: .2rem 0 .35rem;
}

.menubar .pro-contain .item:not(:last-child) {
	margin-bottom: .4rem;
}

.menubar .pro-contain h4 {
	color: #666;
	font-size: .24rem;
	padding: 0 .15rem;
	margin-bottom: .22rem;
}




.footer {
    color: #666;
    font-size: .22rem;
	padding: .65rem 0 .55rem;
    background: url(../images/footer.jpg)
    no-repeat
    center/cover;
}

.footer .title {
    display: flex;
    align-items: center;
	margin-bottom: .5rem;
}

.footer .title a {
    display: block;
    width: 1.5rem;
    height: .7rem;
    background: url(../images/logo.png)
    no-repeat
    left center/contain;
}

.footer .title h3 {
    color: #000;
    font-size: .32rem;
    margin-left: .35rem;
}

.footer .article {
    line-height: .4rem;
	margin-bottom: .4rem;
} 

.footer .know {
	margin-bottom: .5rem;
}

.footer .know p {
	margin-bottom: .3rem;
}

.footer .know .button {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .2rem;
}

.footer .know .button a {
    color: #fff;
    text-align: center;
    line-height: .65rem;
    display: block;
	background: var(--theme-color);
}

.footer .know .button a:nth-child(2),
.footer .know .button a:nth-child(3) {
	background: var(--theme-vice-color);
}

.footer .qrcode {
    display: flex;
	margin-bottom: .6rem;
}

.footer .qrcode .group:not(:last-child) {
    margin-right: .2rem;
}

.footer .qrcode .group img {
    width: 1.7rem;
    height: 1.7rem;
}

.footer .qrcode .group p {
	font-size: .2rem;
	text-align: center;
	margin-top: .2rem;
}

.footer .friendship {
    display: flex;
}

.footer .friendship li:not(:first-child,:last-child) {
    margin-right: .2rem;
}




.copy {
    color: #fff;
    font-size: .22rem;
    line-height: .4rem;
    padding: .15rem .2rem;
    background: var(--theme-vice-color);
}




.news {
	padding-top: .45rem;
}

.news .page {
	padding: .85rem 0;
}




.news-detail {
	padding: .6rem 0;
}

.news-detail .title {
	margin-bottom: .35rem;
	text-align: center;
}

.news-detail .title h2 {
	color: #444;
	font-size: .28rem;
	line-height: .48rem;
	margin-bottom: .1rem;
}

.news-detail .title p {
	color: #999;
	font-size: .22rem;
	display: block;
}

.news-detail .article {
	color: #333;
	font-size: .22rem;
	line-height: .42rem;
	padding-bottom: .3rem;
	margin-bottom: .38rem;
	border-bottom: 1px solid #d2d2d2;
}

.news-detail .agrop {
	display: flex;
	align-items: center;
	justify-content: center;
}

.news-detail .agrop a {
	color: #666;
	font-size: .2rem;
	display: block;
	position: relative;
}

.news-detail .agrop a:not(:last-child) {
	margin-right: .81rem;
}

.news-detail .agrop a:hover {
	color: var(--theme-color);
}

.news-detail .agrop a::after {
	content: '';
	position: absolute;
	top: 50%;
	left: auto;
	right: -.41rem;
	transform: translate(0 , -50%);
	width: 1px;
	height: .2rem;
	background-color: #bfbfbf;
}

.news-detail .agrop a:last-child::after {
	display: none;
}




.sample {
	margin: .4rem 0 .35rem;
}




.contact {
	padding: .7rem 0 .85rem;
	margin-top: .4rem;
	background: #f7f7f7;
}

.contact .theme-title {
	margin-bottom: .55rem;
}

.contact .list .column:not(:last-child) {
	margin-bottom: .25rem;
}

.contact .list .column {
	display: flex;
	align-items: center;
    padding: .45rem .3rem;
    background: #fff;
}

.contact .column .icon {
    width: .85rem;
    height: .85rem;
}

.contact .column:nth-child(1) .icon {
    background-image: url(../images/address.png);
}

.contact .column:nth-child(2) .icon,
.contact .column:nth-child(3) .icon {
    background-image: url(../images/phone.png);
}

.contact .column:nth-child(4) .icon {
    background-image: url(../images/fax.png);
}

.contact .column:nth-child(5) .icon {
    background-image: url(../images/email.png);
} 

.contact .column:nth-child(6) .icon {
    background-image: url(../images/website.png);
} 

.contact .column .text {
	width: calc(100% - 1.15rem);
	margin-left: auto;
}

.contact .column h4 {
    color: #888;
    font-size: .2rem;
    margin-bottom: .1rem;
}

.contact .column p {
    color: #222;
    font-size: .24rem;
    line-height: .32rem;
}

.contact .column p a {
    color: var(--theme-color);
}




.message {
	margin-bottom: .35rem;
}




.download {
	padding-top: .45rem;
}

.download .page {
	padding: .85rem 0 .45rem;
}




.media {
	padding-top: .5rem;
}

.media .page {
	padding: .8rem 0 .45rem;
}




.about {
    padding: .65rem 0 .85rem;
}

.about .theme-title {
    text-align: left;
    margin-bottom: .4rem;
}

.about .theme-title h2 {
    font-size: .34rem;
    margin-bottom: .15rem;
}

.about .theme-title p {
    color: #2799ce;
    line-height: normal;
}

.about .article {
    color: #666;
    font-size: .22rem;
    line-height: .4rem;
	margin-bottom: .6rem;
}




.honor {
    padding: .65rem 0 .8rem;
    background-image: linear-gradient(
        to bottom,
        #f4f4f4,
        #ffffff
    );
}

.honor .theme-title {
    margin-bottom: .4rem;
}

.honor .picture {
    margin-bottom: .5rem;
}

.honor .contain {
    position: relative;
}

.honor .contain .common-carousel-2 {
    position: absolute;
    top: 1.1rem;
	margin-top: 0;
}

.honor .contain .common-carousel-2.swiper-button-prev {
	left: 0;
}

.honor .contain .common-carousel-2.swiper-button-next {
	right: 0;
}

.honor-swiper {
    width: 4rem;
} 

.honor-swiper .img {
    height: 2.8rem;
    margin-bottom: .3rem;
}

.honor-swiper p {
    color: #222;
    font-size: .22rem;
    text-align: center;
}




.course {
	padding: .75rem 0 .9rem;
	background: url(../images/course.jpg)
	no-repeat
	center/cover;
}

.course .theme-title {
	margin-bottom: .55rem;
}

.course .list {
	padding-bottom: .15rem;
	position: relative;
}

.course .list::before,
.course .list::after {
	content: '';
	position: absolute;
}

.course .list::before {
	width: .02rem;
	height: calc(100% - .1rem);
	top: .1rem;
	left: .06rem;
	background: var(--theme-color);
}

.course .list::after {
	width: .14rem;
	height: .1rem;
	left: 0;
	bottom: -.03rem;
	background-image: url(../images/down-2.png);
}

.course .list .column {
	display: flex;
	align-items: flex-start;
	padding-left: .5rem;
	position: relative;
}

.course .list .column:not(:last-child) {
	margin-bottom: .35rem;
}

.course .list .column::after {
	content: '';
	width: .28rem;
	height: .28rem;
	top: .025rem;
	left: -.07rem;
	z-index: 9;
	background-image: url(../images/dot.png);
}

.course .column span {
	color: var(--theme-color);
	font-size: .32rem;
}

.course .column p {
	color: #222;
	font-size: .22rem;
	line-height: .3rem;
	min-height: .6rem;
	width: 4.5rem;
	margin-left: auto;
}




.culture {
    padding: .8rem 0 .9rem;
}

.culture .theme-title {
    margin-bottom: .4rem;
}

.culture .list {
    gap: .2rem;
}

.culture .list .column {
    color: #fff;
    text-align: center;
    min-height: 4.35rem;
    padding: .95rem .2rem;
    position: relative;
    z-index: 10;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.culture .list .column::after {
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: rgba(0, 0, 0, .3);
}

.culture .column h4 {
    font-size: .22rem;
    margin-bottom: .1rem;
}

.culture .column p {
    font-size: .24rem;
    line-height: .42rem;
}




.honor2 {
    padding: .7rem 0 .8rem;
    background: #f4f4f4;
}

.honor2 .theme-title {
    margin-bottom: .4rem;
}

.honor2-swiper .swiper-wrapper {
    margin-bottom: .5rem;
}

.honor2-swiper .img {
    height: 3.85rem;
    padding: .15rem;
    margin-bottom: .2rem;
    background: #fff;
}

.honor2-swiper p {
    color: #222;
    font-size: .22rem;
    text-align: center;
}

.honor2-swiper .common-carousel-2 {
	border: 1px solid #fff;
	background: #fff;
}

.honor2-swiper .common-carousel-2:active {
	border: 1px solid var(--theme-color);
	background: var(--theme-color);
}




.exhibition {
	padding: .65rem 0 .4rem;
}

.exhibition .theme-title {
	margin-bottom: .4rem;
}

.exhib-swiper .swiper-wrapper {
	margin-bottom: .6rem;
}

.exhib-swiper .swiper-slide {
    position: relative;
}

.exhib-swiper .img {
	height: 4rem;
    position: relative;
}

.exhib-swiper .img::after {
    content: '';
    width: .7rem;
    height: .7rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../images/play.png);
}

.exhib-swiper p {
    color: #fff;
    font-size: .22rem;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: .7rem;
    width: 100%;
    padding: 0 .2rem;
    position: absolute;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .3);
}

.exhib-swiper .common-carousel-2 {
	border: 1px solid #dcdcdc;
	background: #fff;
}

.exhib-swiper .common-carousel-2:active {
	border: 1px solid var(--theme-color);
	background: var(--theme-color);
}




.index-engine {
	padding: .45rem 0 .6rem;
}

.index-engine .keywords {
	margin-top: 0;
}

.index-engine .form {
    overflow: visible;
    display: flex;
    border-radius: 0;
    border: 1px solid #dcdcdc;
}

.index-engine .form::after {
    display: none;
}

.index-engine .form .drop-down {
    width: 1.8rem;
    position: relative;
    border-right: 1px solid #dcdcdc;
}

.index-engine .form .drop-down h4 {
    color: #666;
    font-size: .22rem;
    line-height: .75rem;
    height: .75rem;
    padding: 0 .3rem 0 .2rem;
    position: relative;
}

.index-engine .form .drop-down h4::after {
    content: '';
    width: .11rem;
    height: .08rem;
    top: 50%;
    right: .2rem;
	transform: translateY(-50%);
    background-image: url(../images/down-3.png);
}

.index-engine .form .drop-down ul {
    width: 100%;
    display: none;
    padding: .15rem 0;
    position: absolute;
    top: .76rem;
    left: 0;
    background: #fff;
}

.index-engine .form .drop-down ul li {
	color: #666;
    font-size: .2rem;
    text-align: center;
    line-height: .4rem;
    height: .4rem;
}

.index-engine .form form {
    display: block;
    width: 4.6rem;
}

.index-engine .form input {
    width: 100%;
    height: .75rem;
    padding: 0 .6rem 0 .2rem;
	border: none;
	border-radius: 0;
    background: transparent;
}

.index-engine .form button {
    width: .3rem;
    height: .3rem;
    position: absolute;
    top: 50%;
    right: .2rem;
	transform: translateY(-50%);
    background: url(../images/search2.png)
    no-repeat
    right center/contain;
}




.index-media {
	padding: .65rem 0 .8rem;
	background: #f4f4f4;
}

.index-media .theme-title {
	margin-bottom: .3rem;
}

.index-media .bd {
	margin-bottom: .6rem;
}




.index-product {
	padding: .65rem 0 .8rem;
}

.index-product .theme-title {
	margin-bottom: .3rem;
}




.index-media2 {
	padding: .7rem 0;
	background: #f4f4f4;
}

.index-media2 .theme-title {
	margin-bottom: .3rem;
}

.index-media2 .common-hd {
	margin-bottom: .45rem;
}

.index-media2 .common-media-list {
    gap: .3rem .2rem;
	margin-bottom: .45rem;
}

.index-media2 .column .img {
	margin-bottom: .15rem;
}




.index-about {
   padding: .95rem 0;
}

.index-about .title {
    color: #2799ce;
	margin-bottom: .3rem;
}

.index-about .title em {
    font-size: .32rem;
    line-height: 1;
    display: block;
    margin-bottom: .1rem;
}

.index-about .title span {
    font-size: 1.5rem;
    line-height: 1;
	display: block;
	margin-bottom: .15rem;
}

.index-about .title h2 {
    color: #222;
    font-size: .34rem;
    line-height: .54rem;
}

.index-about .article {
    color: #666;
    font-size: .22rem;
    line-height: .36rem;
    margin-bottom: .75rem;
}

.index-about h3 {
    color: #222;
    font-size: .26rem;
	padding-bottom: .25rem;
    margin-bottom: .5rem;
	border-bottom: 1px solid #dcdcdc;
}




.index-news {
	padding: .7rem 0 .8rem;
	background: #f4f4f4;
	border-bottom: .05rem solid var(--theme-color);
}

.index-news .theme-title {
	margin-bottom: .4rem;
}

.index-news .common-hd {
	margin-bottom: .5rem;
}

.index-news .bd {
	margin-bottom: .55rem;
}




.product {
	padding-top: .35rem;
}

.product .page {
	padding: .8rem 0 .4rem;
}




.introduce {
	font-size: .22rem;
    max-width: 6rem;
    padding: .45rem 0 .35rem;
    margin: 0 auto;
}

.introduce .gallery-swiper {
    height: 3.4rem;
    margin-bottom: .15rem;
}

.introduce .gallery-swiper .img {
    position: relative;
}

.introduce .gallery-swiper .img .icon {
    width: .7rem;
    height: .7rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../images/play.png);
}

.introduce .thumbs {
    position: relative;
}

.introduce .thumbs .introd-carousel {
    width: .13rem;
    height: .22rem;
    margin-top: 0;
    transform: translateY(-50%);
}

.introduce .thumbs .swiper-button-prev {
    left: 0;
    background-image: url(../images/around-prev.png);
}

.introduce .thumbs .swiper-button-next {
    right: 0;
    background-image: url(../images/around-next.png);
}

.introduce .thumb-swiper {
    width: 4.9rem;
	margin-bottom: .65rem;
}

.introduce .thumb-swiper .swiper-slide {
    height: .9rem;
    border: 1px solid transparent;
}

.introduce .thumb-swiper .swiper-slide-thumb-active {
    border: 1px solid #2799ce;
}

.introduce h2 {
    color: #222;
    font-size: .28rem;
    padding-bottom: .3rem;
    margin-bottom: .35rem;
    border-bottom: 1px solid #dcdcdc;
}

.introduce h4 {
    color: #000;
    margin-bottom: .15rem;
}

.introduce p {
    color: #888;
    line-height: .36rem;
    padding-bottom: .25rem;
    margin-bottom: .35rem;
    border-bottom: 1px solid #dcdcdc;
}

.introduce .skip {
    display: flex;
    margin-bottom: .4rem;
}

.introduce .skip a {
    color: #666;
}

.introduce .skip a:not(:last-child) {
    margin-right: .3rem;
}

.introduce .skip a:active {
	color: var(--theme-color);
}




.product-hd {
    display: flex;
    align-items: center;
    margin-bottom: .35rem;
}

.product-hd .around-btn {
    margin-left: auto;
}




.details {
	padding: .3rem .2rem;
}

.details .item:not(:last-child) {
    margin-bottom: .55rem;
}

.details .theme-vice-title {
	padding-bottom: .2rem;
    margin-bottom: .25rem;
	border-bottom: 1px solid #dcdcdc;
}

.details .article {
    color: #666;
    font-size: .22rem;
    line-height: .36rem;
}




.relevant {
	padding: .35rem 0;
}




.other {
    padding: .45rem 0 .5rem;
}

.other-swiper .column:not(:last-child) {
	margin-bottom: .3rem;
}

.other-swiper .img {
    height: 3.4rem;
}

.other-swiper .content {
    text-align: center;
    padding: .3rem .2rem .35rem;
    background: #f4f4f4;
}

.other-swiper .content p {
    color: #222;
    font-size: .22rem;
    margin-bottom: 13px;
}

.other-swiper .content span {
    color: #11aaed;
    font-size: .22rem;
}




.login {
    padding: 1.3rem 0 1.4rem;
    background: url(../images/login.jpg)
    no-repeat
    center/cover;
}

.login .card {
    width: 5.6rem;
    padding: .45rem .3rem .75rem;
    margin: 0 auto;
    border-radius: .15rem;
    background: #fff;
}

.login .hd {
    display: flex;
    justify-content: center;
    margin-bottom: .55rem;
}

.login .hd li {
    color: #222;
    font-size: .36rem;
}

.login .hd li.on {
    color: var(--theme-color);
}

.login .hd li:not(:last-child) {
    margin-right: 1.15rem;
}

.login .group {
    position: relative;
}

.login .group:not(:first-child) {
    margin-top: .35rem;
}

.login .group label {
    color: #222;
    font-size: .26rem;
}

.login .group input {
    color: #222;
    font-size: .26rem;
    height: .8rem;
    border-bottom: 1px solid #dcdcdc;
}

.login .group input::-webkit-input-placeholder {
    color: #bababa;
}

.login .group img {
    cursor: pointer;
    width: 2rem;
    height: .65rem;
    position: absolute;
    right: 0;
    bottom: .3rem;
}

.login button {
    color: #fff;
    font-size: .32rem;
    height: .8rem;
    overflow: hidden;
    margin-top: .45rem;
    position: relative;
    z-index: 10;
    border-radius: .5rem;
    background: var(--theme-color);
}

.login button::after {
    content: '';
    width: 0;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all ease-in-out .4s;
    background: #2aa4dd;
}

.login button:active::after {
    width: 100%;
}