/* Css Flash */
.swiper1 { width:100%; height: 1065px; --swiper-pagination-color: #f08300; --swiper-theme-color: #f08300;}
.swiper1 .swiper-slide { background-repeat: no-repeat; background-position: center; background-size: cover;}
.flash01 { background-image: url(../Images/flash01.jpg);}
.flash02 { background-image: url(../Images/flash02.jpg);}
.swiper-pagination1 { margin-bottom: 16px;}
@media screen and (max-width: 2048px) {
    .swiper1 { height: 850px;}
}
@media screen and (max-width: 1920px) {
    .swiper1 { height: 800px;}
}
@media screen and (max-width: 1680px) {
    .swiper1 { height: 700px;}
}
@media screen and (max-width: 1440px) {
    .swiper1 { height: 600px;}
}
@media screen and (max-width: 1366px) {
    .swiper1 { height: 570px;}
}
@media screen and (max-width: 1280px) {
    .swiper1 { height: 535px;}
}
@media screen and (max-width: 1024px) {
	.swiper1{ height:510px;}
    .flash01 { background-image: url(../Images/mobile01.jpg);}
    .flash02 { background-image: url(../Images/mobile02.jpg);}
    .swiper-pagination1 { margin-bottom: 6px;}
}
@media screen and (max-width:800px) {
	.swiper1{ height:400px;}
}
@media screen and (max-width:640px) {
	.swiper1{ height:320px;}
}
@media screen and (max-width:480px) {
	.swiper1{ height:240px;}
}
@media screen and (max-width:414px) {
	.swiper1{ height:210px;}
}
@media screen and (max-width:375px) {
	.swiper1{ height:190px;}
}
@media screen and (max-width:320px) {
	.swiper1{ height:160px;};
}

/* Css Products */
.title { text-align: center; margin: 3.075vw auto 3.215vw;}
.title h2 { font-size: 30px; font-weight: 600; color: #f08300; letter-spacing: .75px;}
.title h1 { font-weight: 600; font-size: 48px; color: #004098; text-transform: uppercase; line-height: 48px; margin: 8px 0 13px;}
.title p { font-size: 18px; font-weight: 500; color: #666; letter-spacing: 2px;}
@media screen and (max-width: 1920px) {
    .title { margin: 4.125vw auto 4.275vw;}
}
@media screen and (max-width: 1024px) {
    .title h2 { font-size: 24px;}
	.title h1 { font-size: 36px; line-height: 36px; margin: 5px 0 9px;}
	.title p { font-size: 16px;}
}
@media screen and (max-width: 640px) {
    .title h2 { font-size: 20px;}
	.title h1 { font-size: 28px; line-height: 28px; margin: 5px 0 7px;}
	.title p { font-size: 14px;}
}
@media screen and (max-width: 480px) {
    .title { margin: 26px auto 27px;}
}

.ig-ls { flex-wrap: wrap;}
.ig-ls a { width: 31.714286%; padding: 15px 15px 0; border-radius: 15px; background:linear-gradient(top, #2389cb, #0d438b); background:-webkit-linear-gradient(top, #2389cb, #0d438b);}
.ig-ls a:hover { background:linear-gradient(top, #f0af00, #f08300); background:-webkit-linear-gradient(top, #f0af00, #f08300);}
.ig-ls a:nth-child(n+4) { margin-top: 3.55%;}
.ig-ls a .ig-tp { position: relative; border-radius: 12px; overflow: hidden;}
.ig-ls a .ig-tp img { width: 100%;}
.ig-ls a .ig-tp img:last-child { position: absolute; left: 0; top: 0; opacity: 0; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ig-ls a:hover .ig-tp img:last-child { opacity: 1;}
.ig-ls a .ig-js { margin: 25px 0;}
.ig-ls a .ig-js .ig-js-tx { width: 70.75%; color: #fff; display: flex; justify-content: center; flex-direction: column;}
.ig-ls a .ig-js .ig-js-tx h3 { font-size: 24px; font-weight: 600; letter-spacing: .75px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.ig-ls a .ig-js .ig-js-tx p { font-size: 14px; line-height: 22px; margin-top: 12px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.ig-ls a .ig-js .ig-js-ig { width: 24.25%; }
.ig-ls a .ig-js .ig-js-ig img { width: 100%;border-radius: 50%;}
@media screen and (max-width: 1280px) {
    .ig-ls a { padding: 10px 10px 0; border-radius: 10px;}
    .ig-ls a .ig-tp { border-radius: 10px;}
    .ig-ls a .ig-js { margin: 20px 0;}
    .ig-ls a .ig-js .ig-js-tx h3 { font-size: 20px;}
    .ig-ls a .ig-js .ig-js-tx p { margin-top: 8px;}
}
@media screen and (max-width: 1024px) {
    .ig-ls a { padding: 8px 8px 0; border-radius: 8px;}
	.ig-ls a .ig-tp { border-radius: 8px;}
	.ig-ls a .ig-js { margin: 15px 0;}
    .ig-ls a .ig-js .ig-js-tx h3 { font-size: 18px;}
    .ig-ls a .ig-js .ig-js-tx p { font-size:12px; line-height: 18px; margin-top: 4px;}
}
@media screen and (max-width: 768px) {
    .ig-ls a .ig-js .ig-js-tx h3 { font-size: 16px;}
}
@media screen and (max-width: 640px) {
    .ig-ls a { width: 48.5%;}
	.ig-ls a:nth-child(n+3) { margin-top: 3%;}
}
@media screen and (max-width: 480px) {
	.ig-ls a { padding: 5px 5px 0; border-radius: 5px;}
	.ig-ls a .ig-tp { border-radius: 5px;}
	.ig-ls a .ig-js { margin: 10px 0;}
    .ig-ls a .ig-js .ig-js-tx h3 { font-size: 14px;}
	.ig-ls a .ig-js .ig-js-tx p { -webkit-line-clamp: 3;}
}

/* Css About */
.ab-bg { background: url(../Images/gs01.jpg) no-repeat center; background-size: cover; margin-top: 4.85vw;}
.ab-bg .main{ padding-bottom: calc(3.925% + 230px); position: relative;}
.ab-bg .ab-tx { width: 52%; color: #fff; padding-top: 4.625vw;}
.ab-bg .ab-tx h1 { font-weight: 600; font-size: 48px; text-transform: uppercase; line-height: 48px;}
.ab-bg .ab-tx h2 { font-size: 30px; font-weight: 600; letter-spacing: .75px; margin-top: 10px;}
.ab-bg .ab-tx p { font-size: 15px; line-height: 30px; margin-top: 1.45vw;}
.ab-bg .ab-tx a { display: block; width: 180px; height: 50px; background: #f08300 url(../Images/jt02.png) no-repeat 135px center; font-size: 16px; font-weight: 500; color: #fff; letter-spacing: .75px; line-height: 50px; padding-left: 15px; margin-top: 3.05vw; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ab-bg .ab-tx a:hover { background-color: #004098;}
.ab-bg .ab-ig { position: absolute; top: 12.615%; right: -11.45%; width: 49.35%;}
.ab-bg .ab-ig img { width: 100%;}
.ab-bg .ab-ls { position: absolute; bottom: 65px; left: 0; background-color: #fff; width: 100%; height: 165px;}
.ab-bg .ab-ls a { display: block; width: 25%; text-align: center;}
.ab-bg .ab-ls a:nth-child(n+2) { border-left: 1px solid #f5f5f5;}
.ab-bg .ab-ls a img { width: 52px; height: 48px; margin-top: 28px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ab-bg .ab-ls a:hover img { margin-top: 15px;}
.ab-bg .ab-ls a h3 { font-size: 20px; font-weight: 600; color: #004098; letter-spacing: .75px; margin: 11px 0 4px;}
.ab-bg .ab-ls a p { font-size: 15px; color: #666;}
@media screen and (max-width: 1920px) {
    .ab-bg { margin-top: 6.5vw;}
    .ab-bg .main{ padding-bottom: calc(5.3% + 230px);}
    .ab-bg .ab-tx { padding-top: 6.15vw;}
    .ab-bg .ab-tx p { margin-top: 1.95vw;}
    .ab-bg .ab-tx a { margin-top: 4.05vw;}
    .ab-bg .ab-ig { top: 12.615%;}
}
@media screen and (max-width: 1780px) {
    .ab-bg .ab-tx { width: 46.5%;}
    .ab-bg .ab-ig { right: 0;}
}
@media screen and (max-width: 1024px) {
    .ab-bg .main{ padding-bottom: calc(6.35% + 180px);}
    .ab-bg .ab-tx { padding-top: 4.35vw;}
    .ab-bg .ab-tx h1 { font-size: 36px; line-height: 36px;}
    .ab-bg .ab-tx h2 { font-size: 24px; margin-top: 8px;}
    .ab-bg .ab-tx p { font-size: 14px; line-height: 28px; margin-top: 2.275vw;}
    .ab-bg .ab-tx a { width: 150px; height: 40px; background-position: 110px center; font-size: 14px; line-height: 40px; padding-left: 10px; margin-top: 4.25vw;}
    .ab-bg .ab-ig { top: 10.35%;}
    .ab-bg .ab-ls { bottom: 40px; height: 140px;}
    .ab-bg .ab-ls a img { width: 42px; height: 39px; margin-top: 20px;}
    .ab-bg .ab-ls a:hover img { margin-top: 10px;}
    .ab-bg .ab-ls a h3 { font-size: 18px; margin: 12px 0 4px;}
    .ab-bg .ab-ls a p { font-size: 14px;}
}
@media screen and (max-width: 640px) {
    .ab-bg .main{ padding-bottom: 5.35vw;}
    .ab-bg .ab-tx { width: 100%;}
    .ab-bg .ab-tx h1 { font-size: 28px; line-height: 36px;}
    .ab-bg .ab-tx h2 { font-size: 20px; margin-top: 6px;}
    .ab-bg .ab-tx a { width: 120px; height: 32px; background-size: 22px 16px; background-position: 90px center; line-height: 32px; padding-left: 8px;}
    .ab-bg .ab-ig { position: relative; top: inherit; right: inherit; width: 90%; margin: 4.25vw 5% 7.5vw;}
    .ab-bg .ab-ls { position: relative; bottom: inherit; left: inherit; height: auto; flex-wrap: wrap;}
    .ab-bg .ab-ls a { width: 50%; padding: 15px 10px;}
    .ab-bg .ab-ls a:nth-child(3) { border-left: none;}
    .ab-bg .ab-ls a:nth-child(n+3) { border-top: 1px solid #f5f5f5;}
    .ab-bg .ab-ls a img { margin-top: 0;}
    .ab-bg .ab-ls a:hover img { margin-top: 0;}
}
@media screen and (max-width: 480px) {
    .ab-bg { margin-top: 30px;}
    .ab-bg .main{ padding-bottom: 30px;}
    .ab-bg .ab-tx { padding-top: 22px;}
    .ab-bg .ab-tx p { margin-top: 20px;}
    .ab-bg .ab-tx a { margin-top: 28px;}
    .ab-bg .ab-ig { margin: 25px 5% 35px;}
}

/* Css Manufacture */
.sl-ig { background: url(../Images/slBg.jpg) repeat-x bottom;}
.sl-ig a { display: block; width: 22.291667%;}
.sl-ig a img { width: 100%;}
.sl-tx { background-color: #004098; padding: 2.765vw 5% 3.075vw; color: #fff; text-align: center;}
.sl-tx h3 { font-size: 24px; font-weight: 600; letter-spacing: .75px;}
.sl-tx p { font-size: 15px; line-height: 30px; letter-spacing: .5px; margin-top: 13px;}
@media screen and (max-width: 1920px) {
    .sl-tx { padding: 3.685vw 5% 4.15vw;}
}
@media screen and (max-width: 1024px) {
    .sl-tx h3 { font-size: 20px;}
    .sl-tx p { font-size: 14px; line-height: 28px; margin-top: 10px;}
}
@media screen and (max-width: 640px) {
    .sl-ig { flex-wrap: wrap; padding: 0 15px;}
    .sl-ig a { width: 48.5%;}
    .sl-ig a:nth-child(n+3) { margin-top: 3%;}
    .sl-tx { padding: 4.15vw 5%;}
    .sl-tx h3 { font-size: 18px;}
}
@media screen and (max-width: 480px) {
    .sl-tx { padding: 27px 5% 23px;}
    .sl-tx h3 { font-size: 16px;}
    .sl-tx p { margin-top: 11px;}
}

/* Css News */
.ns-bg { background: url(../Images/nsBg2.jpg) no-repeat center; padding: 3.075vw 0 4.765vw; background-size: cover;}
.ns-bg .title { margin-top: 0;}
.swiper2 { --swiper-pagination-color: #f08300; --swiper-theme-color: #f08300;}
.swiper2 a { display: block; background-color: #fff; padding: 1.475vw 1.575vw; -webkit-transition: all .3s ease; transition: all .3s ease;}
.swiper2 a:hover { background-color: #004098;}
.swiper2 a h4 { font-family: 'Gotham Book'; font-size: 16px; font-weight: 500; color: #a0a0a0; -webkit-transition: all .3s ease; transition: all .3s ease;}
.swiper2 a h3 { font-size: 24px; font-weight: 600; color: #333; margin: 28px 0 38px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.swiper2 a p { font-size: 15px; color: #666; line-height: 30px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.swiper2 a:hover h4, .swiper2 a:hover h3, .swiper2 a:hover p { color: #fff;}
.swiper-pagination2 { position: relative; margin-top: 2.35vw;}
@media screen and (max-width: 1920px) {
    .ns-bg { padding-top: 4.125vw;}
    .ns-bg .title { margin-top: 0;}
}
@media screen and (max-width: 1024px) {
    .swiper2 a { padding: 20px;}
    .swiper2 a h4 { font-size: 14px;}
    .swiper2 a h3 { font-size: 20px; margin: 14px 0 20px;}
    .swiper2 a p { font-size: 14px; line-height: 28px;}
}
@media screen and (max-width: 480px) {
    .ns-bg { padding-top: 26px; padding-bottom: 31px;}
    .ns-bg .title { margin-top: 0;}
    .swiper2 a h3 { font-size: 18px; margin: 15px 0 20px;}
    .swiper-pagination2 { margin-top: 18px;}
}