@charset "utf-8";
/* CSS Document */
#content{padding: 0!important;}
.indexA {display: flex; flex-wrap: wrap; height: 100%; margin: 0 auto 3.153% auto; padding: 0 6%;background-color: #fff; }
.indexAL {display: flex; flex-wrap: wrap; align-content: center; width: 50%; padding: 60px 45px; }
.indexAL h1 {position: relative;font-size: 3.2rem; font-weight: bold; line-height: 1.2; margin: 0 0 40px 0; transition: all 0.25s ease 0s;}
.indexAL p {font-size: 1.6rem; color: #666666; line-height: 1.6; margin: 0; transition: all 0.25s ease 0s;}
.indexAR {width: 50%; line-height: 0; font-size: 0;}
.indexAR img:nth-child(1) {display: block;}
.indexAR img:nth-child(2) {display: none;}

.indexB {max-width:1300px; margin:auto; padding: 0 20px; height: 100%; margin-bottom: 3.679%;}
.indexBP {position: relative; /*padding-bottom: 36.845%;*/ margin: 0 auto 25px auto; display: block; max-width: 140px; height: 140px; line-height: 0; font-size: 0;}
.indexBP div {position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; background-color: #fff; border-radius: 50%;}
.indexBP div img {max-height: 100%!important;}
.indexBT {color: #333333; line-height: 1.15; max-width: 150px; margin: auto; text-align: center; margin-bottom: 15px!important;}
.indexBN {color: #000; line-height: 1.125; max-width: 150px; margin: auto; text-align: center;}
.indexBT.fs_18{font-size: 2rem!important; font-weight: bold; margin-left: auto; margin-right: auto;}
.indexBN.fs_16{color: #666; margin-left: auto; margin-right: auto;}

.indexC {text-align: center;background-color: #fff; padding: 4.73% 0 3.679% 0;}
.indexC .fs_32.ta_c{ display: inline-block; position: relative; font-weight: bold; line-height: 1.188; margin: 0;}

.indexAL h1::after,
.indexC h2::after,
.indexD h2::after{
    content: '';
    position: absolute;
    top: 0;
    left: -40px;
    transform: rotate(90deg);
    width: 32px;
    height: 32px;
    font-size: 0;
    line-height: 0;
    background: url(../images/ico_tag_shield.svg) no-repeat;
}

.ind_P {position: relative; padding: 7.018% 0 0 0;}
.ind_PP {position: relative; padding-bottom: 100%; margin: 0 auto 40px auto; display: block; height: 0px; line-height: 0; font-size: 0;}
.ind_PP div {position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.ind_PP div img {max-height: 100%!important;}
.ind_PT {text-align: center; line-height: 1.167; margin: 0;}
.indexC a:link, .indexC a:visited {text-decoration:none; font-size: 0; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  color:#fff; transition: all 0.5s ease 0s;}
.indexC a:active, .indexC a:hover {text-decoration:none; color:#fff; cursor:pointer; transition: all 0.5s ease 0s;}
.indexC .ind_PP::before {
    right: 0;
    bottom: -30px;
    width: 32px;
    height: 32px;
    background: url(../images/ico_tag_shield.svg) no-repeat;
    transform: rotate(90deg);
}
.indexC .ind_PP::after {
    color: #bb1b21;
    left: 100%;
    top: 100%;
    bottom: 0px;
    right: 0;
    border-bottom: 4px solid;
    border-right: 4px solid;
}
.indexC .ind_PP::before, .indexC .ind_PP::after {content: ""; opacity: 0; pointer-events: none; z-index: 3; position: absolute; box-sizing: border-box; transition: all 0.5s ease; box-shadow: none;}
.indexC .item:hover .ind_PP:before {opacity: 1; right: 0%;}
.indexC .item:hover .ind_PP:after {opacity: 1; left: 0%;}
.indexC .item:hover .ind_PT {color:#bb1b21;}
.indexC h2:hover {color:#bb1b21;}

.indexD {padding: 4.73% 0 3.679% 0; text-align: center;}
.indexD .fs_32.ta_c{ display: inline-block; position: relative; font-weight: bold; line-height: 1.188; margin: 0;}
.gallery-thumbs.ind_applic{ max-width: 980px; margin: 60px auto 32px;}
.gallery-thumbs.ind_applic .swiper-slide{ padding: 12px 8px; opacity: 1; font-size: 1.8rem; line-height: 1.167; font-weight: bold; color: #bb1b21; border: 1px solid #bb1b21; border-radius: 60px;}
.gallery-thumbs.ind_applic .swiper-slide:hover{cursor: pointer;}
.gallery-thumbs.ind_applic .swiper-slide-thumb-active{ color: #fff; background-color: #bb1b21;}
.gallery-top.ind_applic{}
.gallery-top.ind_applic .txtblock{ 
	position: absolute;
    top: 50%;
    left: 14%;
    text-align: left;
    color: #fff;
    width: 30%;
    transform: translateY(-50%);
}
.gallery-top.ind_applic .txtblock::before{
	content: "";
	position: absolute;
	z-index: -1;
	top: -100%;
	right: 0;
	opacity: .7;
	width: 220px;
	height: 360px;
	background: url("../images/artdeco_bevel01.svg") no-repeat;
}
.gallery-top.ind_applic .txtblock h3{ margin: 0 0 32px 0; font-size: 3.2rem; font-weight: bold; line-height: 1.188;}
.gallery-top.ind_applic .txtblock .text{ font-size: 1.8rem;}
.gallery-top.ind_applic .txtblock .text p {font-size: 18px; line-height: 1.167;}


.ind_A {position: relative; padding: 4.204% 0 0 0; max-width:1140px; margin:auto; height: 100%;}
.ind_AC {display: flex; flex-direction: column;}
.ind_A .owl-item:nth-child(2n+2) .ind_AC {flex-direction: column-reverse;}
.ind_ACP {position: relative; padding-bottom: 50.353%; display: block; height: 0px; line-height: 0; font-size: 0;}
.ind_ACP div {position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.ind_ACP div img {max-height: 100%!important;}
.ind_ACP::after {content: ''; position: absolute; height: 0; width: 0; left: 50%; bottom: -1px; border-color: transparent transparent #fff transparent; border-style: solid solid solid solid; border-width: 20px 17px; margin-left: -17px;}
.ind_A .owl-item:nth-child(2n+2) .ind_ACP::after {content: ''; position: absolute; height: 0; width: 0; left: 50%; top: -1px; border-color: #fff transparent transparent transparent; border-style: solid solid solid solid; border-width: 20px 17px; margin-left: -17px;}
.ind_ACC {position: relative; padding-bottom: 50.353%; display: block; height: 0px; background-color: #fff; color: #333333;}
.ind_ACC > div {position: absolute; top: 0px; left: 40px; right: 40px; bottom: 0; display: flex; flex-wrap: wrap; align-content: center; align-items: center;}
.ind_ACCT {margin-bottom: 6.125%; width: 100%;}
.ind_ACCC {line-height: 200%; width: 100%;}
.ind_AC .ind_ACP div::before {color:#f0f0f0; top: 20px; left: 20px; right: 100%; bottom: 100%; border-top: 8px solid; border-left: 8px solid;}
.ind_AC .ind_ACP div::after {color:#f0f0f0; left: 100%; top: 100%; bottom: 20px; right: 20px; border-bottom: 8px solid; border-right: 8px solid;}
.ind_AC .ind_ACP div::before, .ind_AC .ind_ACP div::after {content: ""; opacity: 0; pointer-events: none; z-index: 3; position: absolute; box-sizing: border-box; transition: all 0.5s ease; box-shadow: none;}
.ind_AC:hover .ind_ACP div::before {opacity: 1; bottom: 0%; right: 0%;}
.ind_AC:hover .ind_ACP div::after {opacity: 1; top: 0%; left: 0%;}
.ind_AC:hover .ind_ACCT {color:#bb1b21; font-style: italic;}
.ind_AC:hover .ind_ACCC {color:#bb1b21;}

.indexE {background-color: #dedede; padding: 4.73% 0 6.306% 0;display: none;}
.ind_N {position: relative; padding: 3.153% 20px 0 20px; max-width:1212px; margin:auto; height: 100%;}
.ind_NC {max-width: 347px; margin: auto;}
.ind_NP {position: relative; padding-bottom: 54.47%; margin: 0 auto 20px auto; display: block; height: 0px; line-height: 0; font-size: 0;}
.ind_NP div {position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.ind_NP div img {max-height: 100%!important;}
.ind_ND {color: #bb1b21; margin-bottom: 15px;}
.ind_NT {color: #333333; margin-bottom: 20px; line-height: 156%;}
.indexE h2 {max-width: 1180px; margin: auto; padding: 0 20px;}
.indexE h2:hover {color:#bb1b21;}

.ind_NP .itv_0::before {color:#dedede; top: 10px; left: 10px; right: 100%; bottom: 100%; border-top: 8px solid; border-left: 8px solid;}
.ind_NP .itv_0::after {color:#dedede; left: 100%; top: 100%; bottom: 10px; right: 10px; border-bottom: 8px solid; border-right: 8px solid;}
.ind_NP .itv_0::before, .ind_NP .itv_0::after {content: ""; opacity: 0; pointer-events: none; z-index: 3; position: absolute; box-sizing: border-box; transition: all 0.5s ease; box-shadow: none;}
.ind_NP:hover .itv_0::before {opacity: 1; bottom: 0%; right: 0%;}
.ind_NP:hover .itv_0::after {opacity: 1; top: 0%; left: 0%;}

.banner {display: flex; flex-wrap: wrap; justify-content: center; position: relative; }
.banner .owl-item,
.banner .owl-item .item{height: 100%;}
.banner .item > div {
    display: flex; 
    justify-content: space-evenly;
    align-items: stretch;
    flex-direction: row-reverse; 
    flex-wrap: wrap; 
    margin: auto;
    height: 100%;
}
.bannerP {
    position: absolute;
    right: 20%;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    width: 40%;
    z-index: 1;
    padding: 10px 0px 0 0;
    text-align: center;
     line-height: 0; 
    font-size: 0;
}
.bannerC {position: absolute;left: 25%;display: flex; flex-direction: column; justify-content: center; height: 100%; align-items: center;  z-index: 2;}
/*
.bannerC::before{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 25%;
    min-width: 540px;
    transform: skewX(344deg);
    z-index: -1;
    background-color: #bb1b21;
}
*/
.bannerC_artdeco{
    position: absolute;
    top: 0;
    left: 10%;
    bottom: 0;
    width: 25%;
    min-width: 300px;
    transform: skewX(344deg);
    z-index: 1;
    background-color: #bb1b21;
}
.banner_text{
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}
.bannerCT {font-family: 'Oswald', 'Heebo', sans-serif; font-size: 11rem; color: #fff; font-weight: bold; line-height: 120%; letter-spacing: 1px;}
.bannerCS {font-family: 'PT Sans', sans-serif; font-size: 2.4rem; line-height: 1.292; color: #000; margin-bottom: 17px; letter-spacing: 1px;}
.bannerCN { margin-top: 60px; margin-left: -20%; color: #fff; text-align: center; line-height: 1.182;}
.bannerCA{font-family: 'Oswald', 'Heebo', sans-serif;font-size: 8rem; line-height: 1; font-weight: 600; }
.bannerCA:link, .bannerCA:visited {text-decoration:none;color:#000; display: flex; align-items: center; justify-content: center; width: max-content; margin: 0 12px; transition: all 0.5s ease 0s;}
.bannerCA:active, .bannerCA:hover {text-decoration:none; color:#fff;cursor:pointer; transition: all 0.5s ease 0s;}
.banner_Bg{
    display: flex;
    justify-content: flex-end;
    position: relative;
    z-index: 0;
    width: 100%;
    height: 100%;
    line-height: 0;
    overflow: hidden;
}
.banner_Bg img{
    width: 100% !important;
    height: 100%;
}

.site_btn {width: 200px;height: 50px;padding: 0 22px;box-sizing: border-box;display: inline-flex;align-items: center;justify-content: center;gap: 24px;border: 0;border-radius: 5px;font-weight: 500; font-size: 16px; line-height: 1.4; text-decoration: none!important;transition: background .25s ease, color .25s ease;background: #BA272D;color: #fff;line-height: 1;}
.site_btn:hover{border-radius: 25px;background: #a9161d;}
.banner {position: relative;margin: 0;padding: 0;width: 100%;height: auto!important;overflow: hidden;background: #0b0b0b url('../images/banner/banner-bg01.jpg') center top / 100% auto no-repeat;background-size: cover;}
.banner .slider {width: 100%;margin: 0;}
.banner .slide {position: relative;}
.banner .wrap {max-width: 1290px;margin: auto;position: relative;width: 90%;}
.banner .slide .wrap {display: grid;grid-template-columns: 1fr 1fr;padding: 101px 20px 95px 20px;align-items: center;height: 966px;}
.banner .txt {padding-bottom: 80px;position: relative;z-index: 1;}
.banner .hd {margin: 0 0 18px;font-family: 'Times New Roman', Georgia, serif;font-size: clamp(42px, 5.25vw, 100px);font-weight: 600;line-height: 1.04;letter-spacing: -3px;color: #171717;transform: scaleX(.74);transform-origin: left center;}
.banner .hd span {display: block;}
.banner .hd .gold {color: #a6803d;}
.banner .txt p {font-size: 21px;line-height: 1.5;color: #404040;margin: 0 0 52px;}
.banner .btn {color: #fff;background: #151818;width: 240px;height: 60px;box-shadow: none;font-size: 18px;font-weight: 400;gap: 7px;}
.banner .pic {width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
.banner .ctrl {position: absolute;top: clamp(640px, 60vw, 820px);right: 3.5%;display: flex;gap: 12px;align-items: center;color: #ccc;}

.banner .ctrl .control {
  width: 52px;height: 52px;border: 1px solid #777;
  border-radius: 50%;
  background: transparent;
  color: #ddd;
  font-size: 22px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.banner .ctrl .control img {
  width: 12px;
  height: 10px;
  display: block;
  margin: auto;
  object-fit: contain;
}

.banner .ctrl .control:hover:not(:disabled) {
  border-color: #bb1b21;
  color: #fff;
  background: #bb1b21;
}

.banner .ctrl .control:disabled {
  opacity: .4;
  cursor: default;
  background: transparent !important;
  color: #ddd !important;
}

.banner .num {
  display: flex;
  gap: 12px;
  margin-left: 14px;
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}

.banner .cur {
  color: #CB121A;
}

.banner .cert {
  width: 100%;
  max-width: none;
  margin: 0;
  border-top: 1px solid #ffffff14;
  padding: 36px 0 67px;
}

.banner .cert .wrap {
  max-width: 1440px;
}

.banner .grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.banner .item {
  text-align: center;
  padding: 0 30px;
  color: #c7c4bd;
  border-right: 1px solid #ffffff18;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
}

.banner .item:last-child {
  border-right: 0;
}

.banner .item img {
  margin: 0 auto 24px;
  display: block;
}

.banner .item h2 {
  font-weight: 400;
  font-size: 24px;
  line-height: 1.3;
  margin: 0 0 14px;
  color: #ececec;
  font-weight: 300;
}

.banner .item p {
  font-weight: 400;
  font-size: 16px;
  margin: 0;
  color: #ffffff;
  font-weight: 300;
}

.banner .site_btn{
  color: #fff;
  background: #151818;
  width: 240px;
  height: 60px;
  box-shadow: none;
  font-size: 18px;
  font-weight: 400;
  gap: 7px;
}

.banner .site_btn:hover {
  text-decoration: none;
  background: #bb1b21;
}

#content .ind_hd { 
	margin: 0;
	display: flex;
	align-items: flex-start;
	gap: clamp(12px, calc(8px + .625vw), 20px);
	font-size: clamp(32px, calc(24px + 1.25vw), 48px);
	font-weight: 700; 
	line-height: 1.35;
}

#content .ind_hd > img {
	width: clamp(20px, calc(16px + .625vw), 28px);
	height: auto;
	margin-top: clamp(7px, calc(9px + .25vw), 15px);
	flex: 0 0 auto;
}

.ind_A {
  position: relative;
  width: 100%;
  max-width: none;
  min-height: 1070px;
  margin: 0;
  background: #fff url('../images/index/ind_A_bg.png') center top / 100% auto no-repeat;
  color: #333;
  overflow: hidden;
  padding: clamp(70px, 10vw, 135px) 20px clamp(50px, 10vw, 90px) 20px;
}

.ind_A .wrap {
  max-width: 1440px;
  margin: auto;
  position: relative;
}

.ind_A .intro {
  max-width: 760px;
}

.ind_A .intro .ind_hd span {
  white-space: nowrap;
}

.ind_A .txt {
  max-width: 650px;
  margin: 58px 0 48px 46px;
  color: #333;
}

.ind_A .txt p {
  margin: 0 0 18px;
  font-size: 17px;
}

.ind_A .btn {
  margin-left: 46px;
  background: #BA272D;
  color: #fff;
}

.ind_A .category {
  margin-top: 200px;
  text-align: center;
}

.ind_A .category .ind_hd {
  justify-content: center;
  align-items: center;
}

.ind_A .category .ind_hd>img {
  margin-top: 0;
}

.ind_A .category>p {
  width: min(760px, 90%);
  margin: 40px auto 0;
  font-size: 17px;
}

.ind_A .products {
  margin-top: 73px;
}

.ind_A .prod_slider {
  margin: 0 -20px;
}

.ind_A .prod {
  padding: 0 20px;
  text-align: center;
}

.ind_A .prod .box {
  position: relative;
  color: #333;
}

.ind_A .prod .more {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: block;
  font-size: 0;
}

.ind_A .prod .img {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 0;
  padding-bottom: 80.121%;
  margin-bottom: 28px;
}

.ind_A .prod .imgCenter {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.ind_A .prod .imgCenter img {
  width: auto;
  max-width: 100%;
  max-height: 100% !important;
  display: block;
  transition: transform .3s ease;
}

.ind_A .prod h3 {
  margin: 0;
  color: #333;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.5;
}

.ind_A .prod .box:hover .imgCenter img {
  transform: translateY(-6px);
}

.ind_A .prod .box:hover h3 {
  color: #c61e27;
}

.ind_A .prod_foot {
  margin-top: 104px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.ind_A .view {
  background: #BA272D;
  color: #fff;
}

.ind_A .view:hover {
  background: #a9161d;
  color: #fff;
  text-decoration: none;
}

.ind_A .prod_ctrl {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.ind_A .prod_ctrl .control {
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.ind_A .prod_ctrl .control:hover {
  border-color: #c61e27;
}

.ind_A .prod_ctrl .control img {
  width: 12px;
  height: 10px;
  display: block;
  margin: auto;
  object-fit: contain;
  filter: brightness(.45);
}

.ind_A .prod_ctrl .num {
  min-width: 70px;
  margin-left: 10px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #777;
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}

.ind_A .prod_ctrl .cur {
  color: #c61e27;
}

.ind_B { width: 100%; min-height: 831px; overflow: hidden; background: #202020 url('../images/index/ind_B_bg.jpg') center top / cover no-repeat; color: #fff; padding: 0 20px;}
.ind_B .wrap {max-width: 1440px; min-height: 831px; margin: auto; display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: 72px; align-items: center; }
.ind_B .info { padding-top: 30px; }
.ind_B .ind_hd { align-items: center; color: #fff; line-height: 1.2; }
.ind_B .info > p { margin: 42px 0 40px 48px; color: #fff; font-size: 17px; }
.ind_B .site_btn { margin-left: 48px; background: #c61e27; color: #fff; }
.ind_B .apps { min-width: 0; overflow: hidden; padding: 39px 0 21px; }
.ind_B .app_slider { height: 430px; margin: 0 -12px; }
.ind_B .app { width: 324px; height: 430px; padding: 0 12px; box-sizing: border-box; display: flex !important; align-items: center; }
.ind_B .box { position: relative; width: 100%; height: 100%; overflow: hidden; flex: 0 0 auto; border-radius: 5px; clip-path: inset(30px 0); transition: clip-path .55s ease-out; will-change: clip-path; }
.ind_B .slick-current .box { clip-path: inset(0); }
.ind_B .box::after { content: ''; position: absolute; inset: 42% 0 0; z-index: 1; opacity: 1; background: linear-gradient(transparent, rgba(0,0,0,.78)); pointer-events: none; transition: opacity .55s ease; }
.ind_B .slick-current .box::after { opacity: 0; }
.ind_B .box > img { width: 100%; height: 100%!important; display: block; object-fit: cover; transition: all 0.5s ease 0s;}
.ind_B .box:hover img{ transform: scale(1.1);}
.ind_B .box h3 { position: absolute; left: 28px; right: 28px; bottom: 26px; z-index: 2; margin: 0; color: #fff; font-size: 22px; transform: translateY(-30px); transition: transform .55s ease-out;}
.ind_B .slick-current .box h3 { transform: translateY(0); }
.ind_B .box .more { position: absolute; inset: 0; z-index: 3; font-size: 0; }
.ind_B .app_ctrl { margin: 68px 0 0 46px; display: flex; align-items: center; gap: 12px; }
.ind_B .app_ctrl .control { width: 48px; height: 48px; padding: 0; border: 1px solid rgba(255,255,255,.38); border-radius: 50%; background: transparent; cursor: pointer; display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
.ind_B .app_ctrl .control:hover { border-color: #c61e27; background: #c61e27; }
.ind_B .app_ctrl .control img { width: 12px; height: 10px; display: block; margin: auto; object-fit: contain; }
.ind_B .app_ctrl .num { min-width: 70px; margin-left: 10px; display: flex; justify-content: space-between; gap: 10px; color: #aaa; font-size: 16px;}
.ind_B .app_ctrl .cur { color: #c61e27; }

.ind_C { width: 100%; min-height: 678px; background: #eef0f0 url('../images/index/ind_C_bg.jpg') center top / cover no-repeat; color: #333; padding: 70px 20px;display: flex;align-items: center;flex-wrap: wrap;}
.ind_C .wrap { width: 100%; max-width: 1440px; margin: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; }
.ind_C .info { grid-column: 2;}
.ind_C .ind_hd { gap: clamp(18px, 1.31vw, 25px); color: #333; line-height: 1.35; }
.ind_C .ind_hd img { margin-top: clamp(8px, .53vw, 10px); }
.ind_C .info > p { margin: 40px 0 42px 59px; color: #333; font-size: 17px;}
.ind_C .site_btn { margin-left: 59px; background: #c61e27; color: #fff; }


@media (max-width: 1600px) {
  .ind_B .app_slider { height: auto; }
  .ind_B .app_slider .slick-track { display: flex; align-items: center; }
  .ind_B .app { width: auto; height: auto; align-self: stretch; }
  .ind_B .box { max-width: 300px; height: auto; margin: 0 auto; aspect-ratio: 300 / 430; clip-path: inset(6.976744% 0); }
  .ind_B .slick-current .box { clip-path: inset(0); }
}

@media only screen and (max-width:1280px){
    .bannerCA{ font-size: 5rem;}
    .bannerCN { margin-top: 32px;}
	.gallery-top.ind_applic .txtblock{ width: 50%; }
	.gallery-top.ind_applic .txtblock::before { top: -30%; width: 160px; height: 220px;}
	
	.ind_A .intro {width: 55%;}
    .ind_A .intro .ind_hd span {white-space: normal;}
    .ind_A .txt {margin-top: 38px;}
    .ind_A .category {margin-top: 100px;}
    .ind_A .products {min-height: 450px;}
	.ind_B .wrap { grid-template-columns: 330px minmax(0, 1fr); gap: 35px; }
  	.ind_B .info > p, .ind_B .site_btn, .ind_B .app_ctrl { margin-left: 34px; }
	.ind_C { background-position: 44% top; }
    .ind_C .wrap { grid-template-columns: 46% 54%; }
    .ind_C .info { padding-left: 20px; }
    .ind_C .info > p, .ind_C .site_btn { margin-left: 46px; }
}

@media only screen and (max-width:992px){
.banner .slide .wrap {height: 700px;}
.banner .txt {padding-left: 0;}
.banner .hd {font-size: 60px;letter-spacing: -2px;}
.banner .txt p {font-size: 16px;}
.banner .btn {padding: 0 18px;}
.banner .ctrl {top: 610px;}
.banner .grid {grid-template-columns: repeat(2, 1fr);gap: 38px 0;}
.banner .item{gap: 0;}
.banner .item:nth-child(2) {border-right: 0;}
.banner .slide .wrap{grid-template-columns: 1fr 0.7fr;}

.indexA { padding: 0 3%;}

.ind_A {background-size: auto 620px;background-position: 57% top;}
.ind_A::before {content: '';position: absolute;inset: 0;background: rgba(255, 255, 255, .68);pointer-events: none;}
.ind_A .intro {width: 100%;max-width: 100%;}
.ind_A .txt {margin: 32px 0 30px 32px;max-width: 100%;}
.ind_A .btn {margin-left: 32px;}
.ind_A .category {margin-top: 100px;}
.ind_A .category .ind_hd {align-items: flex-start;}
.ind_A .category .ind_hd>img {margin-top: 7px;}
.ind_A .category > p {margin-top: 24px;}
.ind_A .products {margin-top: 40px;}
.ind_A .prod_slider {margin: 0 -10px;}
.ind_A .prod {padding: 0 10px;}
.ind_A .prod_foot {margin-top: 50px;}
.ind_A .prod_ctrl {right: 50%;transform: translateX(50%);}
.ind_A .view{ margin-top: 90px;}
.ind_B .wrap { padding: 90px 0; display: block; }
.ind_B .info { width: min(520px, 100%); padding: 0; }
.ind_B .apps { margin-top: 70px; }
.ind_B .app_slider,
.ind_B .app_slider .slick-list { height: 430px; }
.ind_B .app_slider .slick-track { min-height: 430px; }
.ind_B .app_ctrl { margin-top: 40px; }
}

@media only screen and (max-width:768px){
.gallery-top.ind_applic { height: 50vh;} 
.gallery-top.ind_applic .swiper-slide .images{ overflow: hidden; height: 100%;}
.gallery-top.ind_applic .swiper-slide .images img{
	position: relative;
	width: 400%;
	max-width: initial !important;
	left: 50%;
	transform: translateX(-50%);
}
.gallery-top.ind_applic .txtblock { width: 78%;}
.gallery-top.ind_applic .txtblock::before { top: -0%; width: 100px; height: 164px;}
	
.banner {background-image:linear-gradient(180deg,transparent 0px,#dedede00 65px,#dededeb3 150px,#dededeb3 300px,#dedede00 500px),url(../images/banner/banner-bg01.jpg);background-size: 100% 960px, auto 960px;background-position: center top, 40% top;}
.banner .slide .wrap {height: auto;display: flex;flex-direction: column;align-items: stretch;padding-top: 110px;}
.banner .txt {padding-bottom: 40px;}
.banner .hd {margin-bottom: 12px;}
.banner .txt p {margin-bottom: 20px;}
.banner .pic {height: 350px;padding: 0;justify-content: flex-end;}
.banner .pic img {width: auto;height: 350px;max-height: 100%;}
.banner .ctrl {top: 835px;right: 5%;}
.banner .ctrl .control {width: 36px;height: 36px;}
.banner .cert {padding: 35px 0 45px;}

.ind_C { min-height: 500px; background-position: 35% center; position: relative; }
.ind_C::before { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.68); }
.ind_C .wrap { position: relative; display: flex; align-items: center; }
.ind_C .info { width: 100%; padding: 0; }
.ind_C .info > p { margin: 34px 0 42px 32px; }
.ind_C .site_btn { margin-left: 32px; }
}

@media only screen and (max-width:640px){

}

@media (max-width: 570px) {
  .banner .hd {font-size: clamp(42px, 13.25vw, 52px);}
  .banner .txt p {font-size: clamp(14px, 4vw, 16px);}
  .banner .grid {grid-template-columns: 1fr;}
  .banner .item {padding: 0 10px 35px 10px;border-right: 0;border-bottom: 1px solid #ffffff18;}
  .banner .item:last-child{border-bottom: 0;padding-bottom: 0;}
  .banner .ctrl{top: 810px;}
  .ind_B .wrap { padding: 70px 0; }
  .ind_B .info > p { margin: 30px 0 30px 32px; font-size: 15px; }
  .ind_B .site_btn, .ind_B .app_ctrl { margin-left: 32px; }
}

@media (max-width: 430px) {
  .banner .slide .wrap{width: 100%;}
  .banner .ctrl{top: 795px;}
}