html,
body {
    position: relative;
    height: 100%;
    width: 100%;
}

/* banner */
.bannerSwiper {
    width: 100%;
    height: 100%;
}

.bannerSwiper .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

.bannerSwiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 箭头 */
.bannerButton {
    position: absolute;
    bottom: 95px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 92%;
    max-width: 1380px;
    height: 0px;
    z-index: 12;
}

.bannerButton>div {
    position: relative;
    top: unset;
    left: unset;
    right: unset;
    bottom: unset;
    margin: 0px;
    display: block;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    overflow: hidden;
}

.bannerButton .swiper-button-prev::after,
.bannerButton .swiper-button-next::after {
    display: none;
}

.bannerButton .swiper-button-prev,
.bannerButton .swiper-button-next {
    opacity: 1;
}

.bannerButton .swiper-button-next {
    margin-left: 30px;
}

.bannerButton .swiper-button-prev {
    background: url(../images/prev1.png)no-repeat center center, #F2F2F2;
    background-size: 10px 18px;
}

.bannerButton .swiper-button-next {
    background: url(../images/next1.png)no-repeat center center, #F2F2F2;
    background-size: 10px 18px;
}

.bannerButton .swiper-button-prev:hover {
    background: url(../images/prev2.png)no-repeat center center, #1751A2;
    background-size: 10px 18px;
}

.bannerButton .swiper-button-next:hover {
    background: url(../images/next2.png)no-repeat center center, #1751A2;
    background-size: 10px 18px;
}

/* 圆点 */
.bannerSwiper .swiper-pagination {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 76px;
    width: 92%;
    max-width: 1380px;
    text-align: left;
}

.bannerSwiper .swiper-pagination-bullet {
    font-family: "Rany-Bold";
    font-size: 24px;
    width: 30px;
    height: auto;
    text-align: center;
    background: none;
    color: #F2F2F2;
    opacity: 1;
}

.bannerSwiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.bannerSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0px 40px 0px 0px;
    transition: margin 0.3s;
}

.bannerSwiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:last-of-type,
.bannerSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:last-of-type {
    margin-right: 0px;
}

.bannerSwiper .swiper-pagination-bullet {
    position: relative;
}

.bannerSwiper .swiper-pagination-bullet::after {
    content: '';
    position: absolute;
    top: 16px;
    left: 130%;
    width: 0px;
    height: 1px;
    background: #1751A2;
    transition: width 0.3s;
}

.bannerSwiper .swiper-pagination-bullet-active {
    color: #1751A2;
    margin-right: 80px !important;
    position: relative;
    transition: margin 0.3s;
}

.bannerSwiper .swiper-pagination-bullet-active::after {
    content: '';
    position: absolute;
    top: 16px;
    left: 130%;
    width: 60px;
    height: 1px;
    background: #1751A2;
    transition: width 0.3s;
}

/* banner 文字 */
.bannerTxt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 30px;
    color: #fff;
}

.bannerTxt h3 {
    /*font-family: "Lingxun-Bold";*/
    font-family: "Montserrat-Regular";
    margin-bottom: 100px;
    line-height: 1.4;
}

.bannerTxtBtn {
    display: inline-block;
    padding: 0px 20px;
    border: 1px solid #fff;
    border-radius: 100px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.bannerTxtBtn p {
    /* font-family: "PlayfairDisplay-Regular"; */
    line-height: 62px;
    padding-right: 26px;
    background: url(../images/next2.png)no-repeat center right;
    background-size: 8px 14px;
}

.bannerTxtBtn:hover {
    background: #fff;
    transform: translateY(-12px);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.bannerTxtBtn:hover p {
    color: #1751A2;
    background: url(../images/next3.png)no-repeat center right;
    background-size: 8px 14px;
}



/* 关于我们 */
.about {
    position: relative;
}

.aboutImgBox {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 40%;
    height: 96%;
}

.aboutImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.aboutImgP {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    margin-left: -80px;
    height: 80%;
    width: auto;
    z-index: 1;
}

.aboutTxt {
    padding-top: 60px;
    width: 58%;
}

.aboutTxt .pubIndexTitle {
    margin-bottom: 16px;
}

.aboutTxt .pubIndexTitle::after {
    top: 26px;
}

.aboutTxt>h2 {
    color: #1751A2;
    font-family: "PlayfairDisplay-Bold";
    margin-bottom: 34px;
}

.aboutTxt .desc {
    color: #666;
    text-align: justify;
    margin-bottom: 32px;
}

.aboutTxt>span {
    display: block;
    color: #333;
    font-family: "PlayfairDisplay-Bold";
    margin-bottom: 42px;
}

.aboutTxtUl {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 46px;
}

.aboutTxtUl li {
    width: 22%;
}

.aboutTxtUl img {
    width: 100%;
    height: auto;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.aboutTxtUl li:hover img {
    transform: scale(1.1);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.aboutTxt .pubBtn {
    margin-bottom: 120px;
}

/* 数字累加 */
.aboutTxtCount {
    display: flex;
    justify-content: space-between;
    padding-bottom: 70px;
}

.aboutTxtCount div {
    display: flex;
    align-items: flex-end;
    margin-bottom: 20px;
}

.aboutTxtCount h3 {
    font-family: "Rany-Bold";
    color: #333;
    margin-right: 6px;
}

.aboutTxtCount span,
.aboutTxtCount p {
    font-family: "Rany-Regular";
    color: #333;
}



/* 产品 */
.products {
    background: #F8F8F8;
    padding-top: 100px;
}

.productsTop {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    background: url(../images/productP.png)no-repeat left bottom;
    background-size: auto 85%;
}

.productsTxt {
    width: 56%;
    padding-bottom: 50px;
}

.productsTxt .pubIndexTitle {
    color: #1751A2;
    margin-bottom: 24px;
}

.productsTxt .pubIndexTitle::after {
    background: #1751A2;
}

.productsTxt h2 {
    color: #333;
    /*font-family: "Rany-Bold";*/
    font-family: "Montserrat-Bold";
    margin-bottom: 30px;
}

.productsTxt p {
    color: #999;
    text-align: justify;
}

.productsBtm {
    display: flex;
    flex-wrap: wrap;
}

.productsBtm li {
    width: 25%;
    height: 580px;
}

.productsBtm li:nth-child(1) {
    width: 44%;
}

.productsBtm li:nth-child(2),
.productsBtm li:nth-child(3) {
    width: 28%;
}

.productsBtm a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.productsBtm img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.productsBtm li:hover img {
    transform: scale(1.05);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.productsTitle {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 0px 20px 36px 32px;
    color: #fff;
}

.productsBtm li:nth-child(1) .productsTitle,
.productsBtm li:nth-child(2) .productsTitle,
.productsBtm li:nth-child(3) .productsTitle {
    padding-left: 55px;
}

.productsTitle h3 {
    /*font-family: "Rany-Bold";*/
    font-family: "Montserrat-Regular";
    margin-bottom: 20px;
    text-transform: uppercase;
}

.productsTitle .pubBtn {
    border: 1px solid #fff;
}

.productsTitle .pubBtn p {
    color: #fff;
    line-height: 40px;
    padding: 0px 30px 0px 14px;
    background: url(../images/next2.png)no-repeat center right 16px;
    background-size: 4px 8px;
}

.productsTitle .pubBtn:hover {
    background: #fff;
    border: 1px solid #fff;
}

.productsTitle .pubBtn:hover p {
    color: #1751A2;
    background: url(../images/next3.png)no-repeat center right 16px;
    background-size: 4px 8px;
}



/* 特殊材料 */
.material {
    background: url(../images/materialBg.png)no-repeat center center;
    background-size: cover;
    color: #fff;
    padding-left: 50%;
}

.materialBox {
    width: 100%;
    padding: 80px 80px 110px 80px;
    background: #000000d4;
    backdrop-filter: blur(6px) saturate(1.4);
    -webkit-backdrop-filter: blur(6px) saturate(1.4);
}

.materialCon .pubIndexTitle {
    color: #fff;
    margin-bottom: 44px;
}

.materialCon .pubIndexTitle::after {
    background: #fff;
    left: 105%;
}

.materialCon h2 {
    margin-bottom: 60px;
    /*font-family: "Rany-Bold";*/
    font-family: "Montserrat-Regular";
}

.materialCon>p {
    /*font-family: "Rany-Regular";*/
    margin-bottom: 90px;
}

.materialCon .pubBtn {
    border: 1px solid #fff;
}

.materialCon .pubBtn a {
    color: #fff;
    background: url(../images/next2.png)no-repeat center right 30px;
    background-size: 6px 12px;
}

.materialCon .pubBtn:hover {
    background: #fff;
    border: 1px solid #fff;
}

.materialCon .pubBtn:hover a,
.materialCon .pubBtn:hover p {
    color: #1751A2;
    background: url(../images/next3.png)no-repeat center right 30px;
    background-size: 6px 12px;
}



/* 面料 */
.fablicTitle {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-top: 110px;
    padding-bottom: 86px;
}

.fablicTitle .pubIndexTitle {
    color: #1751A2;
    margin-bottom: 14px;
}

.fablicTitle .pubIndexTitle::after {
    background: #1751A2;
    left: 105%;
}

.fablicTitle h2 {
    color: #333;
    font-family: "Rany-Bold";
}

.fablicUlCon {
    display: flex;
    align-items: center;
}

.fablicUl {
    overflow: hidden;
}

.fablicUl li:nth-child(even) {
    text-align: right;
}

.fablicUl li:nth-child(even) .fablicUlCon {
    flex-direction: row-reverse;
}

.fablicUlCon img {
    display: block;
    width: 50%;
    height: auto;
}

.fablicUlCon div {
    padding: 0px 32px;
}

.fablicUl li:nth-child(odd) .fablicUlCon div {
    padding-right: 0px;
}

.fablicUl li:nth-child(even) .fablicUlCon div {
    padding-left: 0px;
}

.fablicUlCon h3 {
    color: #333;
    font-family: "Rany-Bold";
    margin-bottom: 32px;
    text-transform: uppercase;
}

.fablicUlCon p {
    color: #999;
}



/* 宣传视频 */
.video a {
    display: block;
    width: 100%;
    padding: 140px 0px 160px 0px;
    color: #fff;
    text-align: center;
    background: url(../images/videoBg.png)no-repeat center center;
    background-size: cover;
}

.video h3 {
    font-family: "Rany-Bold";
    margin-bottom: 55px;
}

.video img {
    display: block;
    width: 75px;
    height: 75px;
    margin: 0px auto;
}



/* 工厂 */
.factory {
    padding-top: 100px;
    padding-bottom: 60px;
    background: #F8F8F8;
}

.factoryTitle {
    margin-bottom: 36px;
}

.factoryTitle .pubIndexTitle {
    color: #1751A2;
    margin-bottom: 32px;
}

.factoryTitle .pubIndexTitle::after {
    background: #1751A2;
}

.factoryTitle h2 {
    color: #333;
    /*font-family: "Rany-Bold";*/
    font-family: "Montserrat-Regular";
}

.factoryP {
    padding-bottom: 30px;
    background: url(../images/factoryP.png)no-repeat bottom right;
    background-size: 60% auto;
    margin-bottom: 12px;
}

.factoryP>p:first-of-type {
    display: block;
    color: #999;
    max-width: 1200px;
}

.factoryP>p:last-of-type {
    color: #555;
}

.factoryP p span {
    color: #AA0707;
}

.factory .pubBtn {
    float: right;
}

/* tab 切换 */
.factoryTab {
    margin-top: -25px;
    display: flex;
    align-items: center;
}

.factoryTab li {
    margin-right: 30px;
    cursor: pointer;
    border: 1px solid #333333;
    border-radius: 6px;
    display: inline-block;
    padding: 0px 18px;
    color: #333;
}

.factoryTab p {
    padding-left: 38px;
    line-height: 56px;
}

.factoryTab li:first-child p {
    background: url(../images/factoryIcon1.png)no-repeat center left;
    background-size: 26px 26px;
}

.factoryTab li:last-child p {
    background: url(../images/factoryIcon2.png)no-repeat center left;
    background-size: 26px 26px;
}

.factoryTab li.active {
    background: #1751A2;
    border: 1px solid #1751A2;
    color: #fff;
}

.factoryTab li.active:first-child p {
    background: url(../images/factoryIcon1W.png)no-repeat center left;
    background-size: 26px 26px;
}

.factoryTab li.active:last-child p {
    background: url(../images/factoryIcon2W.png)no-repeat center left;
    background-size: 26px 26px;
}

.factoryCon {
    padding-top: 50px;
}

.factoryItem {
    display: none;
}

.factoryItem ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
}

.chinaUl li,
.bangladeshUl li {
    margin-bottom: 15px;
    position: relative;
}

.chinaUl li:nth-child(1) {
    width: 58.4%;
}

.chinaUl li:nth-child(2) {
    width: 40.4%;
}

.chinaUl li:nth-child(3),
.chinaUl li:nth-child(4),
.chinaUl li:nth-child(5) {
    width: 32.5%;
}

.factoryItem .imgBox {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.chinaUl li:nth-child(1) .imgBox {
    padding-top: 64%;
}

.chinaUl li:nth-child(2) .imgBox {
    padding-top: 54%;
}

.chinaUl li:nth-child(3) .imgBox,
.chinaUl li:nth-child(4) .imgBox,
.chinaUl li:nth-child(5) .imgBox {
    padding-top: 66%;
}

.factoryItem img {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.factoryItem .imgBox:hover img {
    transform: scale(1.05);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btmTxt {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: linear-gradient(0deg, rgba(105, 105, 105, 0.3) 0%, rgba(105, 105, 105, 0) 100%);
    z-index: 1;
    padding: 40px 24px 30px 24px;
    color: #fff;
    /* font-family: "Rany-Bold"; */
}

.bangladeshUl li:nth-child(1),
.bangladeshUl li:nth-child(2),
.bangladeshUl li:nth-child(3) {
    width: 32.5%;
}

.bangladeshUl li:nth-child(4),
.bangladeshUl li:nth-child(5) {
    width: 49.4%;
}

.bangladeshUl li:nth-child(1) .imgBox,
.bangladeshUl li:nth-child(2) .imgBox,
.bangladeshUl li:nth-child(3) .imgBox {
    padding-top: 66%;
}

.bangladeshUl li:nth-child(4) .imgBox,
.bangladeshUl li:nth-child(5) .imgBox {
    padding-top: 44%;
}



/* 合作客户 */
.clients {
    padding-top: 90px;
    padding-bottom: 100px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.clientsL .pubIndexTitle {
    margin-bottom: 40px;
}

.clientsL h2 {
    color: #1751A2;
    margin-bottom: 48px;
    /*font-family: "PlayfairDisplay-Bold";*/
    font-family: "Montserrat-Regular";
}

.clientsL p {
    display: block;
    color: #999;
    max-width: 510px;
}

/* 轮播 */
.clientsR {
    width: 46%;
    padding-top: 80px;
}

.clientsSwiper {
    width: 100%;
    padding-top: 65px;
    padding-bottom: 130px;
}

.clientsSwiper .swiper-wrapper {
    height: 200px;
}

.clientsSwiper .swiper-slide {
    padding: 6px;
    height: calc((100% - 18px) / 2);
}

.clientsSwiper .swiper-slide:nth-child(odd) {
    margin-bottom: 18px;
}

.clientsSwiper .swiper-slide>div {
    width: 100%;
    height: 100%;
    background: #fff;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    display: flex;
    justify-content: center;
    align-items: center;
}

.clientsSwiper .swiper-slide img {
    width: 78%;
    height: 70%;
    object-fit: contain;
}

/*  */
.clientsSwiper .swiper-pagination {
    top: 0px;
    right: 0px;
    bottom: unset;
    left: unset;
    text-align: right;
    padding-right: 6px;
}

.clientsSwiper .swiper-pagination .swiper-pagination-bullet {
    background: #DEDEDE;
    opacity: 1;
}

.clientsSwiper .swiper-pagination .swiper-pagination-bullet-active {
    background: #1751A2;
}

.clientsBtn {
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: 2;
    display: flex;
    justify-content: right;
}

.clientsBtn>div {
    position: relative;
    top: unset;
    bottom: unset;
    left: unset;
    right: unset;
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.clientsBtn>div::after {
    display: none;
}

.clientsBtn .swiper-button-prev {
    background: url(../images/prev1.png)no-repeat center center, #F2F2F2;
    background-size: 12px 20px;
    margin-right: 30px;
    opacity: 1;
}

.clientsBtn .swiper-button-next {
    background: url(../images/next1.png)no-repeat center center, #F2F2F2;
    background-size: 12px 20px;
    opacity: 1;
}

.clientsBtn .swiper-button-prev:hover {
    background: url(../images/prev2.png)no-repeat center center, #1751A2;
    background-size: 12px 20px;
}

.clientsBtn .swiper-button-next:hover {
    background: url(../images/next2.png)no-repeat center center, #1751A2;
    background-size: 12px 20px;
}



/* 联系我们 */
.contact {
    background: url(../images/contactBg.png)no-repeat center center;
    background-size: cover;
    color: #fff;
}

.contact {
    padding-top: 85px;
    padding-bottom: 85px;
}

.contact .pubIndexTitle {
    color: #fff;
    margin-bottom: 40px;
}

.contact .pubIndexTitle::after {
    background: #fff;
}

.contactCon {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.contactL {
    width: 48%;
}

.contactL>h2 {
    color: #88B9FF;
    /*font-family: "PlayfairDisplay-Bold";*/
    font-family: "Montserrat-Regular";
    margin-bottom: 25px;
}

.contactL>p {
    max-width: 480px;
    margin-bottom: 70px;
}

.contactLBtm>p {
    color: #88B9FF;
    /*font-family: "PlayfairDisplay-Bold";*/
    font-family: "Montserrat-Regular";
    margin-bottom: 24px;
}

.contactLBtm ul {
    display: flex;
    flex-wrap: wrap;
}

.contactUl1 {
    margin-bottom: 30px;
}

.contactUl1 li,
.contactUl2 li {
    padding-left: 30px;
}

.contactUl1 li:nth-child(1),
.contactUl2 li:nth-child(2) {
    background: url(../images/contact1.png)no-repeat center left;
    background-size: 22px 22px;
    margin-right: 40px;
}

.contactUl1 li:nth-child(2) {
    background: url(../images/contact2.png)no-repeat center left;
    background-size: 22px 22px;
}

.contactUl2 li:nth-child(3) {
    background: url(../images/contact3.png)no-repeat center left;
    background-size: 22px 22px;
}

.contactUl1 li:nth-child(3),
.contactUl2 li:nth-child(1) {
    width: 100%;
    padding-left: 30px;
    background: url(../images/contact4.png)no-repeat top 0px left;
    background-size: 22px 22px;
}

.contactUl1 li:nth-child(3) {
    margin-top: 14px;
}

.contactUl2 li:nth-child(1) {
    margin-bottom: 14px;
}

/* 右边 */
.contactR {
    width: 46%;
    padding-top: 60px;
}

.contactR label {
    display: block;
    width: 100%;
    margin: 0px;
}

.contactR ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 40px;
}

.contactR li {
    width: 48%;
}

.contactR ul p {
    margin-bottom: 6px;
}

.contactR ul input {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 5px;
    line-height: 64px;
    padding: 0px 24px;
    color: #fff;
}

.contactR ul li:last-child {
    margin-top: 45px;
    width: 100%;
}

.contactR ul textarea {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 5px;
    padding: 18px 24px;
    color: #fff;
    height: 110px;
}

.contactR button {
    float: right;
    cursor: pointer;
    border: 1px solid #fff;
    color: #fff;
    background: none;
    border-radius: 100px;
    height: 65px;
    line-height: 65px;
    padding: 0px 60px;
    /* font-family: "PlayfairDisplay-Regular"; */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.contactR button:hover {
    background: #fff;
    color: #1751A2;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.about,
.material,
.clientsBox {
    width: 100%;
    overflow-x: hidden;
}


/* 适配 */
@media (max-width: 1680px) {
    .bannerTxt h3 {
        font-size: 60px;
        margin-bottom: 80px;
    }

    .bannerTxtBtn {
        font-size: 24px;
    }

    .bannerButton>div {
        width: 55px;
        height: 55px;
    }

    .bannerButton .swiper-button-next {
        margin-left: 18px;
    }

    .bannerSwiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
    .bannerSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0px 30px 0px 0px;
    }

    .bannerSwiper .swiper-pagination-bullet-active {
        margin-right: 60px !important;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        width: 38px;
    }

    .materialBox {
        padding: 80px 50px 110px 50px;
    }

    .productsTitle h3 {
        font-size: 30px;
    }
}

@media (max-width: 1440px) {
    .productsTitle h3 {
        font-size: 28px;
    }

    .productsTitle {
        padding: 0px 20px 20px 20px;
    }

    .productsBtm li:nth-child(1) .productsTitle,
    .productsBtm li:nth-child(2) .productsTitle,
    .productsBtm li:nth-child(3) .productsTitle {
        padding-left: 30px;
    }

    .material {
        padding-left: 34%;
    }

    .fablicUlCon h3 {
        font-size: 28px;
        margin-bottom: 12px;
    }

    .fablicUlCon p {
        font-size: 18px;
    }

    .video h3 {
        font-size: 40px;
    }

    .video img {
        width: 65px;
        height: 65px;
    }

    .video a {
        padding: 100px 0px;
    }

    .btmTxt {
        padding: 30px 18px 16px 18px;
    }

    .btmTxt {
        font-size: 20px;
    }

    .clients {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .contactLBtm li {
        font-size: 20px;
    }

    .contactLBtm li.fontSize_18 {
        font-size: 16px;
    }
}

@media (max-width: 1280px) {
    .bannerTxt h3 {
        font-size: 48px;
    }

    .bannerTxtBtn {
        font-size: 20px;
    }

    .bannerSwiper .swiper-pagination-bullet {
        font-size: 20px;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        top: 13px;
    }

    .aboutImgP {
        display: none;
    }

    .about {
        padding-top: 30px;
    }

    .aboutImgBox {
        position: relative;
        top: unset;
        right: unset;
        width: 100%;
        height: 440px;
        padding: 0px 4%;
    }

    .aboutTxt {
        width: 100%;
        padding-top: 40px;
    }

    .aboutTxt>h2 br {
        display: none;
    }

    .aboutTxt .pubBtn {
        margin-bottom: 70px;
    }

    .products {
        padding-top: 70px;
    }

    .aboutTxtCount li {
        width: 33.3%;
    }

    .pubBtn a {
        font-size: 16px;
        line-height: 50px;
    }

    .pubBtn a,
    .pubBtn p {
        padding-right: 38px;
        padding: 0px 54px 0px 22px;
        background: url(../images/next1.png)no-repeat center right 22px;
        background-size: 6px 12px;
    }

    .productsTxt {
        width: 68%;
    }

    .productsTitle h3 {
        font-size: 22px;
    }

    .material {
        padding-left: 30%;
    }

    .materialBox {
        padding: 60px 35px 70px 35px;
    }

    .fablicTitle>div:first-child {
        width: 70%;
    }

    .fablicUlCon div {
        padding: 0px 24px;
    }

    .fablicUlCon h3 {
        font-size: 22px;
    }

    .fablicUlCon p {
        font-size: 16px;
    }

    .video h3 {
        font-size: 32px;
    }

    .video a {
        padding: 70px 0px;
    }

    .factory {
        padding-top: 50px;
    }

    .factoryTitle h2 {
        font-size: 40px;
        margin-top: 10px;
    }

    .clientsL h2 {
        font-size: 65px;
    }

    .clients>div:first-child {
        width: 40%;
    }

    .clientsSwiper {
        padding-top: 40px;
        padding-bottom: 70px;
    }

    .clientsBtn>div {
        width: 40px;
        height: 40px;
    }

    .clientsBtn .swiper-button-prev {
        margin-right: 18px;
    }

    .clientsBtn .swiper-button-prev,
    .clientsBtn .swiper-button-next {
        background-size: 6px 10px;
    }

    .clientsR {
        padding-top: 45px;
    }

    .contactL>p {
        margin-bottom: 35px;
    }

    .contactLBtm>p {
        margin-bottom: 14px;
    }
}

@media (max-width: 992px) {
    .bannerSwiper {
        height: auto;
    }

    .bannerTxt h3 {
        font-size: 28px;
        margin-bottom: 34px;
    }

    .bannerTxtBtn p {
        line-height: 42px;
        font-size: 18px;
    }

    .bannerButton {
        display: none;
    }

    .bannerSwiper .swiper-pagination {
        text-align: center;
        bottom: 16px;
    }

    .bannerSwiper .swiper-pagination-bullet {
        font-size: 18px;
    }

    .bannerSwiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
    .bannerSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0px 12px 0px 0px;
    }

    .bannerSwiper .swiper-pagination-bullet-active {
        margin-right: 30px !important;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        top: 12px;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        width: 30px;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        left: 100%;
    }

    .aboutImgBox {
        height: 360px;
    }

    .aboutTxt {
        padding-top: 24px;
    }

    .aboutTxt .pubIndexTitle,
    .productsTxt .pubIndexTitle,
    .materialCon .pubIndexTitle,
    .fablicTitle .pubIndexTitle,
    .factoryTitle .pubIndexTitle,
    .contact .pubIndexTitle {
        font-size: 26px;
    }

    .aboutTxt>h2,
    .productsTxt h2,
    .materialCon h2,
    .fablicTitle h2,
    .factoryTitle h2,
    .contactL>h2 {
        font-size: 36px;
    }

    .aboutTxt>h2 {
        margin-bottom: 26px;
    }

    .aboutTxt>span {
        margin-bottom: 28px;
    }

    .aboutTxtUl {
        margin-bottom: 34px;
    }

    .aboutTxtCount div {
        margin-bottom: 10px;
    }

    .aboutTxtCount span,
    .aboutTxtCount p {
        font-size: 16px;
    }

    .aboutTxtCount li {
        width: auto;
    }

    .products {
        padding-top: 50px;
    }

    .productsTop {
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .productsTxt {
        width: 100%;
    }

    .aboutTxt .pubIndexTitle::after,
    .pubIndexTitle::after {
        top: 18px;
    }

    .pubIndexTitle::after {
        width: 70px;
    }

    .productsTop {
        background-size: 75% auto;
    }

    .productsTop {
        margin-bottom: 40px;
    }

    .productsBtm {
        padding: 0px 4%;
    }

    .productsBtm {
        justify-content: space-between;
        padding-bottom: 40px;
    }

    .productsBtm li {
        width: 49% !important;
        margin-right: 2%;
        height: 480px;
        margin-bottom: 20px;
    }

    .productsBtm li:nth-child(2n) {
        margin-right: 0px;
    }

    .productsTitle {
        padding: 0px 18px 16px 18px !important;
    }

    .productsTitle h3 {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .material {
        padding-left: 0px;
    }

    .materialBox {
        padding: 40px 4% 50px 4%;
    }

    .materialCon .pubIndexTitle {
        margin-bottom: 28px;
    }

    .materialCon h2 {
        margin-bottom: 26px;
    }

    .materialCon>p {
        margin-bottom: 50px;
    }

    .materialCon .pubBtn a {
        padding-right: 38px;
        padding: 0px 54px 0px 22px;
        background: url(../images/next2.png)no-repeat center right 22px;
        background-size: 6px 12px;
    }

    .fablicTitle {
        padding-top: 40px;
        padding-bottom: 50px;
        flex-wrap: wrap;
    }

    .fablicTitle>div:first-child {
        width: 100%;
        margin-bottom: 26px;
    }

    .fablicUl li {
        margin-bottom: 22px;
    }

    .btmTxt {
        font-size: 18px;
        padding: 14px 16px 14px 16px;
    }

    .clientsR {
        width: 52%;
    }

    .contactCon {
        flex-wrap: wrap;
    }

    .contactL,
    .contactR {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .bannerTxt h3 {
        font-size: 16px;
        margin-bottom: 12px;
    }

    .bannerTxtBtn p {
        font-size: 12px;
    }

    .bannerTxtBtn p {
        line-height: 30px;
    }

    .bannerTxtBtn p {
        padding-right: 14px;
        background-size: 4px 8px
    }

    .bannerTxtBtn {
        padding: 0px 12px;
    }

    .bannerSwiper .swiper-pagination {
        bottom: 4px;
    }

    .bannerSwiper .swiper-pagination-bullet {
        font-size: 12px;
        width: auto;
    }

    .bannerSwiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
    .bannerSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0px 8px 0px 0px;
    }

    .bannerSwiper .swiper-pagination-bullet-active {
        margin-right: 8px !important;
    }

    .bannerSwiper .swiper-pagination-bullet-active::after {
        display: none;
    }

    .bannerSwiper .swiper-pagination-bullet:last-of-type {
        margin-right: 0px !important;
    }

    .about {
        padding-top: 20px;
    }

    .aboutImgBox {
        height: 180px;
    }

    .pubIndexTitle {
        font-size: 18px !important;
    }

    .pubIndexTitle::after {
        top: 11px !important;
        width: 45px;
    }

    .aboutTxt>h2,
    .productsTxt h2,
    .materialCon h2,
    .fablicTitle h2,
    .factoryTitle h2,
    .clientsL h2,
    .contactL>h2 {
        font-size: 24px !important;
    }

    .aboutTxt .pubIndexTitle {
        margin-bottom: 10px;
    }

    .aboutTxt>h2,
    .productsTxt h2,
    .materialCon h2,
    .clientsL h2,
    .contactL>h2 {
        margin-bottom: 20px;
    }

    .aboutTxt .desc,
    .productsTxt p {
        font-size: 14px;
    }

    .aboutTxt>span {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .aboutTxtUl li {
        width: 24%;
    }

    .aboutTxtUl,
    .aboutTxt .pubBtn {
        margin-bottom: 30px;
    }

    .pubBtn a {
        font-size: 12px;
        line-height: 38px;
        padding: 0px 30px 0px 18px;
        background: url(../images/next1.png)no-repeat center right 14px;
        background-size: 4px 8px;
    }

    .aboutTxtCount {
        flex-wrap: wrap;
    }

    .aboutTxtCount li {
        width: 50%;
        margin-bottom: 20px;
    }

    .aboutTxtCount li:last-child {
        margin-bottom: 0px;
    }

    .aboutTxtCount span,
    .aboutTxtCount p {
        font-size: 12px;
    }

    .aboutTxtCount h3 {
        font-size: 16px;
    }

    .aboutTxtCount div {
        margin-bottom: 2px;
    }

    .aboutTxtCount {
        padding-bottom: 34px;
    }

    .products {
        padding-top: 30px;
    }

    .productsTxt {
        padding-bottom: 20px;
    }

    .productsTop {
        margin-bottom: 30px;
    }

    .productsBtm li {
        height: 240px;
    }

    .productsTitle .pubBtn p {
        font-size: 10px;
        line-height: 26px;
        padding: 0px 20px 0px 10px;
        background: url(../images/next2.png)no-repeat center right 10px;
        background-size: 4px 8px;
    }

    .productsTitle {
        padding: 0px 12px 10px 12px !important;
    }

    .productsTitle h3 {
        font-size: 14px;
        margin-bottom: 6px;
    }

    .productsBtm {
        padding-bottom: 10px;
    }

    .materialCon .pubIndexTitle::after {
        left: 102%;
    }

    .materialCon>p {
        font-size: 14px;
    }

    .materialCon>p {
        margin-bottom: 30px;
    }

    .materialCon .pubBtn a {
        padding: 0px 30px 0px 18px;
        background: url(../images/next2.png)no-repeat center right 14px;
        background-size: 4px 8px;
    }

    .fablicUlCon,
    .fablicUl li:nth-child(even) {
        flex-wrap: wrap;
        text-align: left;
    }

    .fablicTitle {
        padding-bottom: 30px;
    }

    .fablicUl li:nth-child(even) .fablicUlCon {
        flex-direction: unset;
    }

    .fablicUlCon img {
        width: 100%;
        margin-bottom: 14px;
    }

    .fablicUl {
        padding-bottom: 40px;
    }

    .fablicUl li {
        margin-bottom: 30px;
    }

    .fablicUl li:last-child {
        margin-bottom: 0px;
    }

    .fablicUlCon div {
        padding: 0px;
    }

    .fablicUlCon h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .fablicUlCon p {
        font-size: 14px;
    }

    .video h3 {
        font-size: 18px;
        margin-bottom: 24px;
    }

    .video img {
        width: 32px;
        height: 32px;
    }

    .video a {
        padding: 38px 0px 30px 0px;
    }

    .factory {
        padding-top: 40px;
        padding-bottom: 20px;
    }

    .factoryTitle {
        margin-bottom: 20px;
    }

    .factoryP>p:first-of-type {
        font-size: 14px;
        margin-bottom: 8px;
    }

    .factoryTab {
        margin-top: 30px;
    }

    .factoryP {
        padding-bottom: 20px;
        margin-bottom: 0px;
    }

    .factory .pubBtn {
        float: left;
    }

    .factoryTab {
        padding: 0px 4%;
        justify-content: space-between;
    }

    .factoryTab li {
        margin: 0px;
        width: 48%;
        padding: 0px 12px;
    }

    .factoryTab p {
        line-height: 42px;
        font-size: 14px;
        padding-left: 0px;
        background: none !important;
        text-align: center;
    }

    .factoryCon {
        padding-top: 26px;
    }

    .chinaUl li,
    .bangladeshUl li {
        width: 100% !important;
    }

    .chinaUl li .imgBox,
    .bangladeshUl li .imgBox {
        padding-top: 66% !important;
    }

    .btmTxt {
        font-size: 14px;
        padding: 12px 12px 10px 12px
    }

    .clients {
        padding-top: 40px;
        padding-bottom: 30px;
        flex-wrap: wrap;
    }

    .clients>div {
        width: 100% !important;
    }

    .clientsL .pubIndexTitle,
    .contact .pubIndexTitle {
        margin-bottom: 14px;
    }

    .clientsL p {
        font-size: 14px;
    }

    .clientsBtn {
        display: none;
    }

    .clientsSwiper .swiper-pagination {
        text-align: center;
        bottom: 0px;
        top: unset;
    }

    .clientsR {
        padding-top: 0px;
    }

    .clientsSwiper {
        padding-top: 10px;
        padding-bottom: 18px;
    }

    .clientsSwiper .swiper-wrapper {
        height: 160px;
    }

    .clientsSwiper .swiper-slide:nth-child(odd) {
        margin-bottom: 4px;
    }

    .contact {
        padding-top: 40px;
        padding-bottom: 50px;
    }

    .contactUl1 li:nth-child(1),
    .contactUl2 li:nth-child(2),
    .contactUl1 li:nth-child(2),
    .contactUl2 li:nth-child(3) {
        font-size: 16px;
    }

    .contactLBtm li.fontSize_18 {
        font-size: 14px;
    }

    .contactUl1 li:nth-child(1),
    .contactUl2 li:nth-child(2),
    .contactUl1 li:nth-child(2),
    .contactUl1 li:nth-child(3),
    .contactUl2 li:nth-child(1) {
        background-size: 14px 14px;
    }

    .contactUl1 li:nth-child(1),
    .contactUl2 li:nth-child(2) {
        margin-right: 0px;
    }

    .contactLBtm li {
        padding-left: 22px !important;
        width: 100%;
    }

    .contactUl1 li:nth-child(1),
    .contactUl2 li:nth-child(1),
    .contactUl2 li:nth-child(2) {
        margin-bottom: 4px;
    }

    .contactUl1 li:nth-child(3) {
        margin-top: 4px;
    }

    .contactR {
        padding-top: 40px;
    }

    .contactR ul p {
        font-size: 12px;
    }

    .contactR ul input {
        line-height: 38px;
        font-size: 14px;
        padding: 0px 14px;
    }

    .contactR ul li:last-child {
        margin-top: 22px;
    }

    .contactR ul textarea {
        height: 80px;
        font-size: 14px;
        padding: 12px 14px;
    }

    .contactR button {
        float: unset;
        display: block;
        margin: 0px auto;
        text-align: center;
        line-height: 38px;
        height: 38px;
        font-size: 12px;
        padding: 0px 16px;
    }

    .contactR ul {
        margin-bottom: 24px;
    }

    .contact {
        padding-bottom: 40px;
    }
}