@charset "utf-8";
.clearfix{ clear:both;}
/* ===================首页样式========================== */
.banner{width: 100%;position: relative;overflow: hidden;}
.banner-img{width: 100%;}
.banner-img img{width: 100%;object-fit: cover;}
.banner-img img.none-mb{height: 100vh;}
.banner-img img.none-pc-pad{min-height: 440px;}
.banner-cont{position: absolute;z-index: 4;width: 100%;height: 100%;top: 0;left: 0;display: flex;align-items: center;color: #fff;}
.banner-cont .text{max-width: 1000px;line-height: 1.22;}
.banner-cont .link{display: flex;align-items: center;width:200px;height:50px; border:1px solid #FFF;transition: all .4s ease;justify-content: center;font-family: "SamsungOne700";}
.banner-cont .link span{padding-right: 18px;background: url('../images/arrRW.svg') no-repeat right center/14px auto;}
.banner-cont .link:hover{background: #fff; color:#000;}
.banner .swiper-pagination{bottom: 36px;}
.banner .swiper-pagination-bullet{width: 40px;height: 2px;background: rgba(255, 255, 255, .5);opacity: 1;margin: 0 10px !important;position: relative;border-radius: 0;}
.banner .swiper-pagination-bullet:before{content: "";width: 0;height: 100%;background: #a92334;position: absolute;top: 0;left: 0;}
.banner .swiper-pagination-bullet-active.swiper-pagination-bullet{background: #fff;}
.banner .swiper-pagination-bullet-active.swiper-pagination-bullet:before{animation: bulletLine 4s linear both .8s;}
.banner .swiper-pagination-bullet-active.oneBullet:before{animation: bulletLine 3.8s linear both 0s;}
@keyframes bulletLine{0%{width: 0;}100%{width: 100%;}}
/* 效果 */
.banner-cont .text, .banner-cont .link{opacity: 0;}
.swiper-slide-active .banner-cont .text{animation: bannerUp 1s ease both 1s;}
.swiper-slide-active .banner-cont .link{animation: bannerUp 1s ease both 1.1s;}
.oneSlide .banner-cont .text{animation: bannerUp 1s ease both .4s;}
.oneSlide .banner-cont .link{animation: bannerUp 1s ease both .5s;}
@keyframes bannerUp{0%{opacity: 0;transform: translateY(120px);}100%{opacity: 1;transform: translateY(0);}}
.banner .swiper-slide {overflow: hidden;position: relative;}
.banner .swiper-slide img {width: 100%;object-fit: cover;transform: matrix(1, 0, 0, 1, 0, 0);transition: all 0.4s ease 1.2s;}
.banner .swiper-slide-active img {transition-delay: 0.4s !important;transform: matrix(1.06, 0, 0, 1.06, 0, 0);transition: all 4s ease;}

.screen-reader-text
.product__catalog{padding:3rem 0 8rem;}
.screen-reader-text{ font-size: 40px; height:60px; line-height:60px; color:#000; margin-top:20px;}
.icon-catch-arrow-regular{ background:url(../images/t.png); width:30px; height:24px;}
@media(max-width: 1024.98px){.product__catalog{padding:2rem 0 5.5rem}}
@media(max-width: 767.98px){.product__catalog{padding:1.3rem 0 3.4rem}
.icon-catch-arrow-regular{ background:url(../images/t-1.png); width:20px; height:16px;}
}

.product__grid{margin-bottom:3rem}
@media(max-width: 1024.98px){.product__grid{margin-bottom:5.5rem}}
@media(max-width: 767.98px){.product__grid{margin-bottom:0}}
.grid{display:-ms-grid;display:grid;grid-gap:0;grid-auto-flow:dense;grid-template-columns:repeat(auto-fill, minmax(25%, 1fr))}
@media(max-width: 767.98px){.grid{grid-gap:2rem;grid-template-columns:repeat(2, 1fr)}}
@media(max-width: 767.98px){.grid--fullwidth{grid-gap:0;width:100%}}

.grid__item{position:relative;display:block;overflow:hidden; margin:10px;border:0;background:none;-webkit-appearance:none}
.grid__item,.grid__item:focus{outline:none}
.grid__item::after{position:relative;top:0;left:0;width:100%;height:100%;padding-bottom:100%;content:"";display:block}
@media(max-width: 767.98px){.grid__item{grid-area:span 1/span 1;width:98%; margin:1%;}}
.grid__item--horizontal{grid-area:span 1/span 2}
@media(max-width: 767.98px){.grid__item--horizontal{grid-area:span 1/span 1}}
.grid__item--horizontal::after{padding-bottom:50%}
@media(max-width: 767.98px){.grid__item--horizontal::after{padding-bottom:100%}}
.grid__item--vertical{grid-area:span 2/span 1}
@media(max-width: 767.98px){.grid__item--vertical{grid-area:span 1/span 1}}
.grid__item--vertical::after{padding-bottom:200%}
@media(max-width: 767.98px){.grid__item--vertical::after{padding-bottom:100%}}
.grid__item--large{grid-area:span 2/span 2}
@media(max-width: 767.98px){.grid__item--large{grid-area:span 1/span 1}}
.grid__image{background-size:cover;background-position:center;width:100%;height:100%;position:absolute;top:0;left:0;transition:filter .3s ease}
.grid__image img,.grid__image source{width:100%;height:auto;display:block}

.grid__name{position:absolute;bottom:2rem;left:2rem;margin:0;font-size: calc(25 * 100vw / 1920);line-height:1.4;color:#fff;text-align:left;display:flex}
@media(max-width: 1024.98px){.grid__name{bottom:1.7rem;left:1.7rem;font-size:1rem}}
@media(max-width: 767.98px){.grid__name{bottom:1rem;left:1rem;padding-left:1.5rem}}
.grid__name div{transition:padding-left .3s ease-in-out}
@media(max-width: 767.98px){.grid__name div{padding-left:.4em}}
.grid__name i{font-size:.85em;top:.3em;left:0;opacity:0;position:absolute;transition:opacity .3s ease}
@media(max-width: 767.98px){.grid__name i{opacity:0}}
.grid__item:hover .grid__image,.grid__item:focus .grid__image{filter:brightness(50%)}
.grid__item:hover .grid__name div,.grid__item:focus .grid__name div{padding-left:1.5em}
@media(max-width: 767.98px){.grid__item:hover .grid__name div,.grid__item:focus .grid__name div{padding-left:.4em}}
.grid__item:hover .grid__name i,.grid__item:focus .grid__name i{opacity:1}
.catalog__more-button{margin:0 auto}


.b-main{padding-top: 1.07rem;margin-bottom: .13rem;}
.s15{font-size: calc(15 * 100vw / 1920);}
@media(max-width: 1651px){.s15{font-size: 12.9px;}}
.s16{font-size: calc(16 * 100vw / 1920);}
@media(max-width: 1584px){.s16{font-size: 13.2px;}}
.s17{font-size: calc(17 * 100vw / 1920);}
@media(max-width: 1524px){.s17{font-size: 13.5px;}}
.s18{font-size: calc(18 * 100vw / 1920);}
@media(max-width: 1472px){.s18{font-size: 13.8px;}}
.s20{font-size: calc(20 * 100vw / 1920);}
@media(max-width: 1382px){.s20{font-size: 14.4px;}}
.s28{font-size: calc(28 * 100vw / 1920);}
@media(max-width: 1152px){.s28{font-size: 16.8px;}}
.s30{font-size: calc(25 * 100vw / 1920);}
@media(max-width: 1113px){ .s30{font-size: 17.4px;}}
.s50{font-size: calc(40 * 100vw / 1920);}
@media(max-width: 898px){.s50{font-size: 23.4px;}}
.b-title{margin-bottom: 0.26rem;color: #333;text-align: center;}
.b-title a{color: #333;display: inline-block;vertical-align: top;}
.b-des{color: #666;line-height: 2;text-align: center;max-width: 65em;margin: 0 auto 2rem;}
.b-list{overflow: hidden;width: 100%;position: relative;}
.b-a{position: relative;display: block;float: left;}
.b-h2{left:3rem;top:2rem;color: #fff;position: absolute;z-index: 10;font-weight: bold;font-weight: bold;}
.b-img{width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: block;}
.b-img img{width: 100%;height: 100%;object-fit: cover;}
.b-a1{width: 30.625%;padding-top: 47.08%;margin-right: 0.65%;}
.b-a2{width: 37.45%;padding-top: 23.23%;margin-right: 0.65%;}
.b-a3{width: 30.625%;padding-top: 47.08%;}
.b-a4{width: 37.45%;padding-top: 23.23%;position: absolute;left: 31.275%;bottom: 0;}
@media(min-width: 1201px){
    .b-title a:hover{color: #e60012;}
    .b-a:hover .b-h2{color: #e60012;}
}
@media(max-width: 900px){.b-des{padding: 0 10px;max-width: 100%;}}
@media(max-width: 750px){.b-h2{left:0;top: 10px;padding: 0 10px;width: 100%;}}
@media(max-width: 500px){
    .b-main{margin-bottom: 0;padding-top: 30px;}
    .b-h2{font-size: 16px;}
    .b-title{margin-bottom: 20px;}
    .b-des{display: none;}
    .b-a{width:100%;padding-top:56.25%;margin-bottom: 1%;position: relative;left: 0;}
    .b-list{padding-top: 57.25%;}
    .b-a2{position: absolute;left: 0;top: 0;}
}

.theme-light, :root {
  --base-color-text-normal: rgba(0, 0, 0, 0.88);
  --base-color-text-disabled: rgba(0, 0, 0, 0.3);
  --base-color-border: rgba(0, 0, 0, 0.12);
  --link-color-text-normal: rgba(0, 0, 0, 0.56);
  --link-color-text-hover: rgba(0, 0, 0, 0.88);
  --check-box-color-background: rgba(255, 255, 255, 0.96);
  --check-mark-color-background: rgba(0, 0, 0, 0.88);
  color: var(--base-color-text-normal);
  --input-color-background-normal: rgba(255, 255, 255, 0.96);
  --input-color-border-normal: rgba(0, 0, 0, 0.3);
  --input-color-text-normal: rgba(0, 0, 0, 0.76);
  --input-color-background-focus: rgba(255, 255, 255, 0.96);
  --input-color-border-focus: rgba(0, 0, 0, 0.88);
  --input-color-text-focus: rgba(0, 0, 0, 0.76);
  --input-color-background-hover: rgba(255, 255, 255, 0.96);
  --input-color-border-hover: rgba(0, 0, 0, 0.88);
  --input-color-text-hover: rgba(0, 0, 0, 0.76);
  --input-color-background-active: rgba(255, 255, 255, 0.96);
  --input-color-border-active: rgba(0, 0, 0, 0.88);
  --input-color-text-active: rgba(0, 0, 0, 0.76);
  --input-color-background-disabled: rgba(255, 255, 255, 0.96);
  --input-color-border-disabled: rgba(0, 0, 0, 0.18);
  --input-color-text-disabled: rgba(0, 0, 0, 0.3);
  --input-color-placeholder: rgba(0, 0, 0, 0.56);
  --input-color-border-invalid: rgb(255, 0, 0);
  --color-contrast-1: rgba(0, 0, 0, 0.04);
  --color-contrast-invers-1: rgba(255, 255, 255, 0.12);
  --color-contrast-2: rgba(0, 0, 0, 0.12);
  --color-contrast-invers-2: rgba(255, 255, 255, 0.24);
  --color-contrast-3: rgba(0, 0, 0, 0.18);
  --color-contrast-invers-3: rgba(255, 255, 255, 0.44);
  --color-contrast-4: rgba(0, 0, 0, 0.3);
  --color-contrast-invers-4: rgba(255, 255, 255, 0.7);
  --color-contrast-5: rgba(0, 0, 0, 0.56);
  --color-contrast-invers-5: rgba(255, 255, 255, 0.82);
  --color-contrast-6: rgba(0, 0, 0, 0.76);
  --color-contrast-invers-6: rgba(255, 255, 255, 0.9);
  --color-contrast-7: rgba(0, 0, 0, 0.88);
  --color-contrast-invers-7: rgba(255, 255, 255, 0.96);
}
.theme-light--9 {--base-color-background: rgb(246, 246, 246);background-color: var(--base-color-background);}
.tiles {--tile-height: 550px;display: grid;gap: 16px;grid-auto-columns: 1fr;grid-auto-rows: auto auto;}
@media (min-width: 800px) {.tiles {padding-right: 16px;padding-left: 16px;  }}
@media (min-width: 1024px) {.tiles {--tile-height: 660px;}}
.tiles--equal {grid-auto-rows: 1fr 1fr;}
.tiles--full-width {padding-right: 0;  padding-left: 0;}
.tiles--gap-top {padding-top: 16px;}
.tiles--gap-bottom { padding-bottom: 16px;}
.tiles__image-container, .tiles__content { position: relative;}
.tiles__image-container {min-height: var(--tile-height);grid-row-end: span 2;}
.tiles__image-container .tiles__image {position: absolute;width: 100%;height: 100%;}
.tiles__image-container .tiles__image--pictogram {--pictogramm-size:120px;position:absolute;bottom:calc(50% + 30px);left:calc(50% - var(--pictogramm-size) / 2);width:var(--pictogramm-size);height:var(--pictogramm-size);}
.tiles__image-container .tiles__image--cover {-o-object-fit: cover;object-fit: cover;}
.tiles__image-container .tiles__image--wide {left: 50%;max-width: 2200px;height: 67%;-o-object-position: top center;object-position: top center;transform: translate(-50%, 0);}
.tiles__image-container .tiles__image--smaller-wide {max-width: 1200px;}
.tiles__image-container:nth-child(1) {grid-column-start: 1; grid-row-start: 1;}
.tiles__content { min-height: 100%; padding: 150px 32px 32px 32px; text-align: center;}
.tiles__content::before { display: block; width: 0; height: 0; margin-top: calc((1.2 - 1.42857143) * 0.5em);content: "";}
@media (min-width: 800px) {.tiles__content {padding-bottom: 48px;}}
.tiles__content--dark-gradient {background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%);}
.tiles__content:nth-child(2) {grid-column-start: 1;grid-row-start: 2;}
.tiles__image-container:nth-child(3) {grid-column-start: 1;grid-row-start: 3;}
@media (min-width: 800px) {.tiles__image-container:nth-child(3) {grid-column-start: 2;grid-row-start: 1;}}
.tiles__content:nth-child(4) {grid-column-start: 1;grid-row-start: 4;}
@media (min-width: 800px) {.tiles__content:nth-child(4) {grid-column-start: 2;grid-row-start: 2;}}
.tiles__action {--flow-space: 20px;display: inline-block;}
@media (min-width: 800px) {.tiles__action {--flow-space: 32px;}}
.tiles__content--pad-top-small {padding-top: 16px;}
.tiles__content--align-bottom {display: flex;flex-direction: column;align-items: center;justify-content: flex-end;}
.tiles__headline, .tiles__subline, .tiles__subsubline { margin: 0 auto; margin-top:20px;}
.tiles__headline::before, .tiles__subline::before, .tiles__subsubline::before {display: block;width: 0;height: 0; margin-top: calc((1.2 - 1.25) * 0.5em);content: "";}
@media (min-width: 800px) {.tiles__headline, .tiles__subline, .tiles__subsubline {max-width: 765px;}}
@media (min-width: 1024px) {.tiles__headline, .tiles__subline, .tiles__subsubline {max-width: 100%;}}
.tiles__headline {font-size: 24px;font-weight: 600;}
.tiles__headline sup {top: -0.75em;left: -0.3em;font-size: 0.5em;}
@media (min-width: 800px) {.tiles__headline {font-size: 32px;}}
.tiles__headline--font-size-big {font-size: 24px; color:#fff;}
@media (min-width: 800px) {.tiles__headline--font-size-big {font-size: 48px; color:#fff;}}
.tiles__subline {font-size: 18px; color:#fff;}
@media (min-width: 800px) {.tiles__subline {font-size: 24px; color:#fff;}}
.tiles__subsubline {--flow-space: 20px;font-size: 14px;}
@media (min-width: 800px) {.tiles__subsubline {font-size: 18px;}}
.tiles__content--small-text-width .tiles__headline, .tiles__content--small-text-width .tiles__subline, .tiles__content--small-text-width .tiles__subsubline { max-width: 344px;}
@media (min-width: 1024px) {
.tiles__content--small-text-width .tiles__headline, .tiles__content--small-text-width .tiles__subline, .tiles__content--small-text-width .tiles__subsubline {max-width: 434px;}
}

.button{height: 40px;padding-right: 32px;padding-left: 32px;font-size: 18px;line-height: 38px;background:#eee; margin-top:30px;}


.cp-footer {width: 100%;background-color: #FFFFFF;border-top: 1px solid #D4D4D4;}
.cp-footer h2,.cp-footer .h2 {font-weight: bold;font-size: 16px;letter-spacing: 0;line-height: 1.3em;color: #8d8d8d;margin-bottom: 20px;}
.cp-footer h3 {font-weight: bold;font-size: 14px;letter-spacing: 0;line-height: 1.3em;color: #8d8d8d;margin-bottom: 10px;}
.cp-footer p {font-weight: normal;font-size: 14px;letter-spacing: 0;line-height:30px;color: #8d8d8d;}
.cp-footer__content {display: block;padding: 15px;padding-top: 50px;padding-bottom: 50px;}
.cp-footer__content__section{margin-bottom: 30px;width:20%;float:left;}
.cp-footer__content__section:nth-child(2),.cp-footer__content__section:nth-child(3),.cp-footer__content__section:nth-child(4){padding-left:5%;}
@media (max-width: 480px) {
.cp-footer__content__section {padding: 10px;width:100%; float:none;margin-bottom: 30px;}
.cp-footer__content {padding: 10px;}
.cp-footer h2,.cp-footer .h2 {margin-bottom:0px;}
}
@media (max-width: 768px) {
.cp-footer__content__section {width:100%;padding:0px;margin-bottom:10px;}
.cp-footer__content__section:nth-child(2),.cp-footer__content__section:nth-child(3),.cp-footer__content__section:nth-child(4){padding-left:0;}
.cp-footer__content {width: 100%;padding:0px;display: block;}
.cp-footer__content::after {content: "";display: table;clear: both;}
.cp-footer .btn-stroke {font-size: 12px;white-space: nowrap;padding-right: 50px !important;}
.cp-footer .btn-stroke:after {font-size: 18px !important;}
}
@media (max-width: 992px) {
.cp-footer__content {padding: 15px;}
}
@media (max-width: 1420px) {
.cp-footer__content {padding: 15px;}
.cp-footer .btn-stroke {font-size: 15px;padding-right: 50px !important;}
.cp-footer .btn-stroke:after {font-size: 22px !important;}
}
@media (max-width: 1600px) {
.cp-footer__content {padding: 15px;}
.cp-footer h2,.cp-footer .h2 {margin-bottom:0px;}
}
.cp-footer__links {list-style: none;}
.cp-footer__links li {display: block;padding: 0; }
.cp-footer__links a {display: inline-block;font-weight: normal; height:30px; line-height:30px;font-size: 14px;color: #8d8d8d;letter-spacing: -0.02em;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.cp-footer__links a:before {margin-right: 10px;line-height:30px;font-size: 14px;color: inherit;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.cp-footer__links a:hover,.cp-footer__links a.is-hover {color: #ff282d;}
.cp-footer__links a:hover:before,.cp-footer__links a.is-hover:before {margin-left: 3px;margin-right: 7px;}
.cp-footer__social {list-style: none;margin-top: -3px;}
.cp-footer__social li {display: inline-block; margin-right:10px;}
.cp-footer ul {list-style: none;}
.cp-footer__top {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-ms-flex-line-pack: distribute;align-content: space-around;border-top: 1px solid #D4D4D4;border-bottom: 1px solid #D4D4D4;}
@media (min-width: 768px) {.cp-footer__top {-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;}}
.cp-footer__top span {display: inline-block;font-weight: bold;font-size: 16px;margin-bottom: 20px;}
.cp-footer__top__col {-ms-flex-preferred-size: 100%;flex-basis: 100%;border-bottom: 1px solid #D4D4D4;margin-top: 0px;}
.cp-footer__top__col:last-child {border-bottom: none;border-right: none;}
@media (min-width: 768px) {.cp-footer__top__col {border-bottom: none;border-right: 1px solid #D4D4D4;-ms-flex-preferred-size: 25%;flex-basis: 25%;}}
.cp-footer__bottom {position: relative;border-top: 1px solid #D4D4D4;}
.cp-footer__bottom img{ margin-top:10px; max-height:70px;}
.cp-footer__bottom__scrolltop {width: 100%;float: none;border-bottom: 1px solid #D4D4D4;}
@media (min-width: 768px) {.cp-footer__bottom__scrolltop {width: 90px;float: right;border-bottom: none;}}
.cp-footer__bottom__scrolltop a {display: block;height: 50px;width: 100%;position: relative;padding: 10px;
  color: #8d8d8d;text-align: center;border-left: 1px solid #D4D4D4;overflow: hidden;-webkit-transition: background-color 0.3s linear;transition: background-color 0.3s linear;}
@media (min-width: 768px) {.cp-footer__bottom__scrolltop a {height: 103px;padding: 40px 10px;}}
.no-touch .cp-footer__bottom__scrolltop a:hover {background-color: #ff282d;color: #fff;}
.cp-footer__bottom__scrolltop a span {display: block;speak: none;font-style: normal;font-weight: bold;font-variant: normal;text-transform: none;font-size: 18px;line-height: 26px;vertical-align: middle;}
.cp-footer__bottom__scrolltop a span:after {float: none;}
.cp-footer__bottom__copyright {float: none;color: #8d8d8d;overflow: hidden;font-size: 14px;text-align: center;line-height: 50px;}
@media (max-width: 768px) {
.cp-footer__bottom__copyright {width: 100%;float: left;margin-right: -90px;}
}
.cp-footer__delete-link {display: block;position: absolute;left: 20px;text-align: left;padding-top: 15px;line-height: 1.7;}
@media (max-width: 768px) {.cp-footer__delete-link {display: none;}
}