section,
picture {
  display: block;
}
picture.lazy {
  filter: blur(5px);
}
picture img {
  width: 100%;
}
.crm-logo {
  background-repeat: no-repeat;
  background-size: 981px 1000px;
  display: inline-block;
  background-image: url('/sites/zweb/images/jp/crm/customer-new-logo-sprite-2x.png');
}
.crm-logo.c-mitsuba {
  background-position: -701px -11px;
  width: 107px;
  height: 31px;
}
.crm-logo.c-jpsafety {
  width: 200px;
  height: 32px;
  background-position: -261px -10px;
}
.crm-logo.c-plots {
  width: 85px;
  height: 29px;
  background-position: -478px -12px;
}
.crm-logo.c-meiwa {
  background-position: -316px -214px;
  width: 140px;
  height: 25px;
}
.crm-logo.c-camcast {
  background-position: -141px -211px;
  width: 160px;
  height: 33px;
}
.crm-logo.c-valuemanagement {
  background-position: -7px -207px;
  width: 119px;
  height: 33px;
}
.crm-logo.c-linkmotivation {
  background-position: -903px -153px;
  width: 57px;
  height: 35px;
}
.crm-logo.c-too {
  background-position: -517px -208px;
  width: 77px;
  height: 33px;
}
.crm-logo.c-marks {
  background-position: -743px -156px;
  width: 134px;
  height: 30px;
}
.crm-logo.c-skycom {
  background-position: -642px -154px;
  width: 91px;
  height: 32px;
}
.crm-logo.c-cyberuniversity {
  background-position: -525px -152px;
  width: 101px;
  height: 33px;
}
.crm-logo.c-kaien {
  background-position: -408px -154px;
  width: 102px;
  height: 33px;
}
.crm-logo.c-safilo {
  background-position: -824px -12px;
  width: 80px;
  height: 25px;
}
.crm-logo.c-inaba {
  background-position: -308px -152px;
  width: 90px;
  height: 35px;
}
.crm-logo.c-atara {
  background-position: -179px -153px;
  width: 113px;
  height: 34px;
}
.crm-logo.c-hataraba {
  background-position: -121px -161px;
  width: 48px;
  height: 35px;
}
.crm-logo.c-sakai {
  background-position: -7px -153px;
  width: 104px;
  height: 33px;
}
.crm-logo.c-geniusweb {
  background-position: -818px -262px;
  width: 150px;
  height: 32px;
}
.crm-logo.c-eforce {
  background-position: -707px -262px;
  width: 98px;
  height: 32px;
}
.crm-logo.c-rarejob {
  background-position: -616px -259px;
  width: 78px;
  height: 33px;
}
.crm-logo.c-ndk {
  background-position: -520px -257px;
  width: 74px;
  height: 33px;
}
.crm-logo.c-yolo {
  background-position: -449px -256px;
  width: 53px;
  height: 34px;
}
.crm-logo.c-starform {
  background-position: -875px -105px;
  width: 85px;
  height: 33px;
}
.crm-logo.c-hoshinoresort {
  background-position: -305px -257px;
  width: 131px;
  height: 28px;
}
.crm-logo.c-imuraenvelope {
  background-position: -121px -263px;
  width: 162px;
  height: 26px;
}
.crm-logo.c-reskill {
  background-position: -6px -252px;
  width: 93px;
  height: 32px;
}
.crm-logo.c-dcn {
  background-position: -733px -208px;
  width: 195px;
  height: 31px;
}
.crm-logo.c-saraya {
  background-position: -734px -105px;
  width: 118px;
  height: 32px;
}
.crm-logo.c-lrm {
  background-position: -651px -105px;
  width: 68px;
  height: 34px;
}
.crm-logo.c-yuskin {
  background-position: -563px -109px;
  width: 65px;
  height: 33px;
}
.crm-logo.c-biochromato {
  background-position: -7px -61px;
  width: 138px;
  height: 35px;
}
.crm-logo.c-tis {
  background-position: -469px -109px;
  width: 76px;
  height: 33px;
}
.crm-logo.c-yada {
  background-position: -335px -109px;
  width: 118px;
  height: 33px;
}
.crm-logo.c-tajima {
  background-position: -579px -8px;
  width: 105px;
  height: 33px;
}
.crm-logo.c-applied {
  background-position: -167px -111px;
  width: 148px;
  height: 31px;
}
.crm-logo.c-yohana {
  background-position: -278px -307px;
  width: 92px;
  height: 32px;
}
.crm-logo.c-chubu {
  background-position: -114px -107px;
  width: 37px;
  height: 35px;
}
.crm-logo.c-tosaco {
  background-position: -609px -216px;
  width: 110px;
  height: 25px;
}
.crm-logo.c-selectra {
  background-position: -9px -306px;
  width: 132px;
  height: 24px;
}
.crm-logo.c-incudata {
  background-position: -151px -307px;
  width: 118px;
  height: 35px;
}
.crm-logo.c-scroll360 {
  background-position: -7px -107px;
  width: 92px;
  height: 35px;
}
.crm-logo.c-ecbeing {
  background-position: -799px -51px;
  width: 105px;
  height: 32px;
}
.crm-logo.c-kansai {
  background-position: -710px -56px;
  width: 69px;
  height: 29px;
}
.crm-logo.c-growup {
  background-position: -540px -61px;
  width: 150px;
  height: 30px;
}
.crm-logo.c-kms {
  background-position: -404px -61px;
  width: 116px;
  height: 35px;
}
.crm-logo.c-nichicon {
  background-position: -93px -14px;
  width: 152px;
  height: 29px;
}
.crm-logo.c-waken {
  background-position: -162px -71px;
  width: 166px;
  height: 18px;
}
.crm-logo.c-sanei {
  background-position: -14px -12px;
  width: 62px;
  height: 33px;
}
.crm-logo.c-aba {
  background-position: -379px -308px;
  width: 86px;
  height: 34px;
}
.crm-logo.c-garity {
  background-position: -475px -308px;
  width: 53px;
  height: 34px;
}
.crm-logo.c-adtrav {
  background-position: -538px -311px;
  width: 146px;
  height: 29px;
}
.crm-logo.c-minorhotels {
  background-position: -694px -308px;
  width: 99px;
  height: 34px;
}
.crm-logo.c-compasshealth {
  background-position: -804px -308px;
  width: 82px;
  height: 34px;
}
.crm-logo.c-hirano {
  background-position: -9px -350px;
  width: 125px;
  height: 18px;
}
.crm-logo.c-sorabito {
  background-position: -141px -350px;
  width: 128px;
  height: 28px;
}
.crm-logo.c-tiger-rack {
  background-position: -277px -352px;
  width: 129px;
  height: 24px;
}
.crm-logo.c-musashino {
  background-position: -418px -354px;
  width: 137px;
  height: 22px;
}
.crm-logo.c-and-mark {
  background-position: -573px -354px;
  width: 78px;
  height: 21px;
}
.crm-logo.c-kyotosoken {
  background-position: -666px -349px;
  width: 193px;
  height: 34px;
}
.crm-logo.c-toyota_rental_osaka {
  background-position: -9px -400px;
  width: 160px;
  height: 15px;
}
.crm-logo.c-kyotokatuobushi {
  background-position: -184px -391px;
  width: 138px;
  height: 27px;
}
.crm-logo.c-gekka {
  background-position: -341px -388px;
  width: 23px;
  height: 39px;
}
.crm-logo.c-akippa {
  background-position: -381px -397px;
  width: 78px;
  height: 21px;
}
.crm-logo.c-imura {
  background-position: -465px -396px;
  width: 84px;
  height: 26px;
}
.crm-logo.c-ichitogomanufacture {
  background-position: -561px -398px;
  width: 195px;
  height: 17px;
}
.crm-logo.c-asahipowermanagement {
  background-position: -764px -388px;
  width: 109px;
  height: 35px;
}
.crm-logo.c-reds {
  background-position: -884px -398px;
  width: 67px;
  height: 26px;
}
.crm-logo.c-eikokai {
  background-position: -10px -427px;
  width: 141px;
  height: 19px;
}
.crm-logo.c-oiles {
  background-position: -184px -424px;
  width: 89px;
  height: 37px;
}
.crm-logo.c-haun {
  background-position: -287px -429px;
  width: 33px;
  height: 40px;
}
.crm-logo.c-tee {
  background-position: -331px -437px;
  width: 73px;
  height: 17px;
}
.crm-logo.c-hankyu {
  background-position: -413px -433px;
  width: 89px;
  height: 25px;
}
.crm-logo.c-rikuyo {
  background-position: -518px -427px;
  width: 110px;
  height: 32px;
}
.crm-logo.c-valuence {
  background-position: -510px -434px;
  width: 71px;
  height: 25px;
}
.crm-logo.c-jstyle {
  background-position: -593px -437px;
  width: 82px;
  height: 18px;
}
.crm-logo.c-instalimb {
  background-position: -686px -429px;
  width: 83px;
  height: 25px;
}
.campaigns-logo {
  background-repeat: no-repeat;
  background-size: 981px 1000px;
  display: inline-block;
  background-image: url('/sites/zweb/images/jp/campaigns/campaigns-cus-logo-sprite-2x.png');
}
.campaigns-logo.c-link {
  background-position: -14px -11px;
  width: 59px;
  height: 35px;
}
.campaigns-logo.c-gekka {
  background-position: -92px -12px;
  width: 36px;
  height: 68px;
}
.campaigns-logo.c-imura {
  background-position: -147px -17px;
  width: 114px;
  height: 29px;
}
.campaigns-logo.c-seisuikogyo {
  background-position: -281px -15px;
  width: 185px;
  height: 29px;
}
.campaigns-logo.c-kontechs {
  background-position: -486px -11px;
  width: 52px;
  height: 47px;
}
.campaigns-logo.c-surala {
  background-position: -567px -18px;
  width: 101px;
  height: 33px;
}
.campaigns-logo.c-genius {
  background-position: -691px -14px;
  width: 164px;
  height: 39px;
}
.campaigns-logo.c-opnlab {
  background-position: -887px -11px;
  width: 59px;
  height: 61px;
}
.workplace-logo {
  background-repeat: no-repeat;
  background-size: 1050px 750px;
  display: inline-block;
  background-image: url("/sites/zweb/images/jp/workplace/workplace-cus-logo-sprite-2x.png");
}
.workplace-logo.c-telema {
  background-position: -12px -17px;
  width: 96px;
  height: 23px;
}
.workplace-logo.c-ekka {
  background-position: -121px -14px;
  width: 194px;
  height: 28px;
}
.people-logo {
  background-repeat: no-repeat;
  background-size: 1050px 750px;
  display: inline-block;
  background-image: url("/sites/zweb/images/jp/people/people-cus-logo-sprite-2x.png");
}
.people-logo.c-infostellar {
  background-position: -10px -12px;
  width: 129px;
  height: 32px;
}
.people-logo.c-flow {
  background-position: -151px -8px;
  width: 109px;
  height: 40px;
}
.connect-logo {
  background-repeat: no-repeat;
  background-size: 1050px 750px;
  display: inline-block;
  background-image: url("/sites/zweb/images/jp/connect/connect-cus-logo-sprite-2x.png");
}
.connect-logo.c-shibaura {
  background-position: -15px -14px;
  width: 129px;
  height: 24px;
}
.one-logo {
  background-repeat: no-repeat;
  background-size: 600px 280px;
  display: inline-block;
  background-image: url("/sites/zweb/images/jp/one/one-cus-logo-sprite-2x.png");
}
.one-logo.c-instalimb {
  background-position: -300px -8px;
  width: 64px;
  height: 19px;
}
.one-logo.c-jstyle {
  background-position: -142px -9px;
  width: 72px;
  height: 16px;
}
.one-logo.c-comrade {
  background-position: -11px -6px;
  width: 84px;
  height: 19px;
}
.one-logo.c-hinohifuka {
  background-position: -101px -2px;
  width: 36px;
  height: 31px;
}
.one-logo.c-vazinc {
  background-position: -225px -8px;
  width: 68px;
  height: 17px;
}
.desk-logo {
  background-repeat: no-repeat;
  background-size: 500px 500px;
  display: inline-block;
  background-image: url("/sites/zweb/images/jp/desk/desk-customer-logo-2x.png");
}
.desk-logo.c-genius {
  background-position: -9px -15px;
  width: 110px;
  height: 24px;
}
.desk-logo.c-kite {
  background-position: -136px -10px;
  width: 89px;
  height: 33px;
}
.desk-logo.c-vanlinks {
  background-position: -237px -7px;
  width: 54px;
  height: 38px;
}
.desk-logo.c-wbridge {
  background-position: -310px -15px;
  width: 108px;
  height: 23px;
}
.desk-logo.c-eirich {
  background-position: -9px -53px;
  width: 93px;
  height: 25px;
}
.banner-section {
  padding: 80px 0;
}
@media only screen and (max-width: 1199px) {
  .banner-section {
    padding: 70px 0;
  }
}
@media only screen and (max-width: 991px) {
  .banner-section {
    padding: 60px 0;
  }
}
@media only screen and (max-width: 767px) {
  .banner-section {
    padding: 50px 0;
  }
}
@media only screen and (max-width: 480px) {
  .banner-section {
    padding: 40px 0;
  }
}
.banner-section .inner-wrapper {
  position: relative;
  z-index: 1;
  width: 862px;
  max-width: calc(100% - 120px);
  text-align: left;
  margin: 0 auto;
}
@media only screen and (max-width: 767px) {
  .banner-section .inner-wrapper {
    max-width: inherit;
    width: 100%;
    padding: 0px 20px;
  }
}
.banner-section .inner-wrapper h1 {
  text-align: center;
  font-size: 52px;
  font-weight: bold;
  margin-bottom: 6px;
  line-height: 1.4;
}
@media only screen and (max-width: 1199px) {
  .banner-section .inner-wrapper h1 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .banner-section .inner-wrapper h1 {
    font-size: 32px;
  }
}
.banner-section .inner-wrapper h1 span {
  background: -webkit-linear-gradient(45deg, #2627fa, #ff544f 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.banner-section .inner-wrapper .desc {
  font-size: 16px;
  text-align: center;
  line-height: 1.8;
}
.logo-wall-section {
  padding: 0px 0;
}
.logo-wall-section .logo-wall {
  width: 100%;
}
.logo-wall-section .logo-wall .logo-row {
  display: flex;
  flex-wrap: nowrap;
  padding: 0;
  list-style: none;
}
.logo-wall-section .logo-wall .logo-row:last-child {
  margin-bottom: 0;
}
.logo-wall-section .logo-wall .logo-row .logo-tile {
  text-align: center;
  border-right: 0;
  border-bottom: 0;
  flex: 0 0 11.11%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:before {
  content: '';
  padding: 50% 0;
  display: inline-block;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:after {
  content: '';
  min-height: inherit;
  font-size: 0;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-one {
  background: #f3f3f3;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-two {
  background: #e8f6ec;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-three {
  background: #fdf7df;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-four {
  background: #e7f0fb;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-five {
  background: #fde8e8;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-six {
  background: #e8f7e8;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-seven {
  background: #f6f1f9;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-eight {
  background: #fdf3df;
}
.logo-wall-section .logo-wall .logo-row .logo-tile.block-bg-nine {
  background: #e7f3fb;
}
.logo-wall-section .logo-wall .logo-row .logo-tile .wall-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.4);
  animation-duration: 10s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
.logo-wall-section .logo-wall .logo-row .logo-tile .wall-logo:nth-of-type(1) {
  animation-name: logo-zoom-1;
}
.logo-wall-section .logo-wall .logo-row .logo-tile .wall-logo:nth-of-type(2) {
  animation-name: logo-zoom-2;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(1) .wall-logo {
  animation-duration: 9s;
  animation-delay: -0.3s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(2) .wall-logo {
  animation-duration: 10.4s;
  animation-delay: -2.4s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(3) .wall-logo {
  animation-duration: 9.6s;
  animation-delay: -4.3s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(4) .wall-logo {
  animation-duration: 11s;
  animation-delay: -5.5s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(5) .wall-logo {
  animation-duration: 9.2s;
  animation-delay: -1.3s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(6) .wall-logo {
  animation-duration: 10.6s;
  animation-delay: -6.5s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(7) .wall-logo {
  animation-duration: 9.8s;
  animation-delay: -3.5s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(8) .wall-logo {
  animation-duration: 10.5s;
  animation-delay: -7.5s;
}
.logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(9) .wall-logo {
  animation-duration: 9.5s;
  animation-delay: -2.7s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(1) .wall-logo {
  animation-duration: 10.2s;
  animation-delay: -5.8s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(2) .wall-logo {
  animation-duration: 9.3s;
  animation-delay: -1.5s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(3) .wall-logo {
  animation-duration: 10.8s;
  animation-delay: -6.9s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(4) .wall-logo {
  animation-duration: 8.8s;
  animation-delay: -3.8s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(5) .wall-logo {
  animation-duration: 11.2s;
  animation-delay: -2.9s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(6) .wall-logo {
  animation-duration: 9.7s;
  animation-delay: -8s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(7) .wall-logo {
  animation-duration: 10.3s;
  animation-delay: -0.6s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(8) .wall-logo {
  animation-duration: 9.4s;
  animation-delay: -5s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(2) .logo-tile:nth-child(9) .wall-logo {
  animation-duration: 10.6s;
  animation-delay: -4.5s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(1) .wall-logo {
  animation-duration: 11.1s;
  animation-delay: -1.8s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(2) .wall-logo {
  animation-duration: 9.1s;
  animation-delay: -6.3s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(3) .wall-logo {
  animation-duration: 10s;
  animation-delay: -4.1s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(4) .wall-logo {
  animation-duration: 9.7s;
  animation-delay: -1s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(5) .wall-logo {
  animation-duration: 10.5s;
  animation-delay: -6.6s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(6) .wall-logo {
  animation-duration: 9.3s;
  animation-delay: -3.2s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(7) .wall-logo {
  animation-duration: 11s;
  animation-delay: -5.3s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(8) .wall-logo {
  animation-duration: 9.8s;
  animation-delay: -0.5s;
}
.logo-wall-section .logo-wall .logo-row:nth-child(3) .logo-tile:nth-child(9) .wall-logo {
  animation-duration: 10.2s;
  animation-delay: -7.7s;
}
@keyframes logo-zoom-1 {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
  }
  8%,
  42% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(var(--shown-scale, 1));
  }
  50% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
  }
}
@keyframes logo-zoom-2 {
  0%,
  50% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
  }
  58%,
  92% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(var(--shown-scale, 1));
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
  }
}
@media (max-width: 1440px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile {
    flex: 0 0 12.5%;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(n+9) {
    display: none;
  }
}
@media (max-width: 1320px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile .wall-logo {
    --shown-scale: 0.85;
  }
}
@media (max-width: 1199px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile {
    flex: 0 0 14.28571429%;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(n+8) {
    display: none;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile .wall-logo {
    --shown-scale: 0.75;
  }
}
@media (max-width: 991px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile {
    flex: 0 0 16.66666667%;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(n+7) {
    display: none;
  }
}
@media (max-width: 767px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile {
    flex: 0 0 25%;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(n+5) {
    display: none;
  }
}
@media (max-width: 480px) {
  .logo-wall-section .logo-wall .logo-row .logo-tile {
    flex: 0 0 33.33333333%;
  }
  .logo-wall-section .logo-wall .logo-row .logo-tile:nth-child(n+4) {
    display: none;
  }
}
.cus-des-section {
  padding: 80px 0;
  background: #fafafa;
}
.cus-des-section .cus-des-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 30px;
  display: flex;
  align-items: flex-start;
  gap: 40px;
}
.cus-des-section .cus-filter {
  width: 240px;
  flex: 0 0 240px;
  position: sticky;
  top: 80px;
  align-self: flex-start;
}
.cus-des-section .cus-filter .cus-filter-inner {
  background: #fff;
  border-radius: 8px;
  padding: 20px;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-filter .cus-filter-inner {
    padding: 0;
  }
}
.cus-des-section .cus-filter .filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-filter .filter-head {
    background: #000;
    color: #fff;
    padding: 20px;
    border-radius: 8px 8px 0 0;
    margin-bottom: 0;
  }
}
.cus-des-section .cus-filter .filter-head h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
}
.cus-des-section .cus-filter .filter-head .filter-toggle {
  display: none;
  background-image: url("/sites/zweb/images/jp/connect/connect-customer-v1-sprite-2x.png");
  background-position: -17px -17px;
  background-repeat: no-repeat;
  background-size: 981px 321px;
  width: 21px;
  height: 12px;
  transition: 0.3s linear;
  transform: rotate(0);
}
.cus-des-section .cus-filter .filter-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-filter .filter-list {
    background: #ffffff;
    padding: 15px;
    margin-top: 0px!important;
  }
}
.cus-des-section .cus-filter .filter-list li {
  padding: 6px 0;
}
.cus-des-section .cus-filter .filter-list li label {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  font-size: 14px;
  color: #444;
}
.cus-des-section .cus-filter .filter-list li label span:last-child {
  transition: 0.3s linear;
}
.cus-des-section .cus-filter .filter-list li input[type="checkbox"] {
  width: 14px;
  height: 14px;
  accent-color: #0067F6;
}
.cus-des-section .cus-filter .filter-list li .prd-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background-image: url("/sites/zweb/images/commonroot/product-icons.svg");
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: 0 0;
  display: inline-block;
}
.cus-des-section .cus-filter .filter-list li .ico-crm {
  background-position: -160px -1px;
}
.cus-des-section .cus-filter .filter-list li .ico-crmplus {
  background-position: -1px 0px;
}
.cus-des-section .cus-filter .filter-list li .ico-campaigns {
  background-position: -220px 0px;
}
.cus-des-section .cus-filter .filter-list li .ico-analytics {
  background-position: -81px -40px;
}
.cus-des-section .cus-filter .filter-list li .ico-desk {
  background-position: -340px 0px;
}
.cus-des-section .cus-filter .filter-list li .ico-one {
  background-position: -81px -1px;
}
.cus-des-section .cus-filter .filter-list li .ico-workplace {
  background-position: -21px 0px;
}
.cus-des-section .cus-filter .filter-list li .ico-people {
  background-position: -141px -20px;
}
.cus-des-section .cus-filter .filter-list li .ico-mail {
  background-position: -180px -20px;
}
.cus-des-section .cus-filter .filter-list li .ico-connect {
  background-position: -60px -80px;
}
.cus-des-section .cus-filter .filter-list li.is-active span:last-child,
.cus-des-section .cus-filter .filter-list li label:hover span:last-child {
  color: #0067F6;
  font-weight: 600;
}
.cus-des-section .cus-des-main {
  flex: 1;
  min-width: 0;
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-des-main {
    width: 100%;
  }
}
.cus-des-section .cus-des-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
.cus-des-section .cus-des-chips:empty {
  display: none;
}
.cus-des-section .cus-des-chips .chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 14px;
  border: 1px solid #d0d0d0;
  border-radius: 999px;
  background: #fff;
  font-size: 13px;
  color: #222;
  line-height: 1;
}
.cus-des-section .cus-des-chips .chip .chip-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 14px;
  color: #555;
  background: transparent;
  border: 0;
  padding: 0;
}
.cus-des-section .cus-des-chips .chip .chip-x:hover {
  color: #0067F6;
}
.cus-des-section .cus-des-chips .chip-clear {
  font-size: 13px;
  color: #0067F6;
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 4px 6px;
}
.cus-des-section .cus-des-chips .chip-clear:hover {
  text-decoration: underline;
}
.cus-des-section .cus-des-grid {
  min-width: 0;
  position: relative;
}
.cus-des-section .cus-des-grid.is-loading {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  width: 100%;
  justify-content: space-between;
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-des-grid.is-loading {
    gap: 15px;
  }
}
.cus-des-section .cus-des-grid.is-loading .cus-des-card {
  flex: 0 0 calc((100% - 48px) / 3);
  position: static;
  margin: 0;
}
@media (max-width: 1024px) {
  .cus-des-section .cus-des-grid.is-loading .cus-des-card {
    flex: 0 0 calc((100% - 48px) / 2);
  }
}
@media only screen and (max-width: 991px) {
  .cus-des-section .cus-des-grid.is-loading .cus-des-card {
    flex: 0 0 calc((100% - 15px) / 2);
  }
}
@media only screen and (max-width: 767px) {
  .cus-des-section .cus-des-grid.is-loading .cus-des-card {
    flex: 0 0 calc(100% / 1);
  }
}
.cus-des-section .cus-des-card {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0 0 24px;
  break-inside: avoid;
  page-break-inside: avoid;
  -webkit-column-break-inside: avoid;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.08);
  transition: opacity 1s ease, box-shadow 1s ease, transform 1s ease;
}
.cus-des-section .cus-des-card .card-media {
  position: relative;
  aspect-ratio: 1.66666667;
  background: #f1f1f1;
  overflow: hidden;
}
.cus-des-section .cus-des-card .card-media picture {
  display: inline;
}
.cus-des-section .cus-des-card .card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cus-des-section .cus-des-card .card-media .play-ico {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.85) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23222'><path d='M8 5v14l11-7z'/></svg>") no-repeat center / 14px;
}
.cus-des-section .cus-des-card .card-media.bg-pink {
  background: #fdeaea;
}
.cus-des-section .cus-des-card .card-media.bg-green {
  background: #e6f4e6;
}
.cus-des-section .cus-des-card .card-media.bg-blue {
  background: #e7f0fb;
}
.cus-des-section .cus-des-card .card-media.bg-yellow {
  background: #fdf5d8;
}
.cus-des-section .cus-des-card .card-body {
  padding: 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.cus-des-section .cus-des-card .card-brand {
  margin-bottom: 14px;
  min-height: 36px;
  display: flex;
  align-items: center;
}
.cus-des-section .cus-des-card .card-quote {
  font-size: 15px;
  line-height: 1.9;
  color: #222;
  margin: 0 0 16px;
  flex: 1;
}
.cus-des-section .cus-des-card .card-author {
  margin-bottom: 12px;
}
.cus-des-section .cus-des-card .card-author .author-name {
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  margin: 0;
}
.cus-des-section .cus-des-card .card-author .author-role {
  font-size: 12px;
  color: #666;
  margin: 2px 0 0;
  line-height: 1.4;
}
.cus-des-section .cus-des-card .read-more {
  font-size: 13px;
  font-weight: 700;
  color: #111;
  text-decoration: none;
  border-bottom: 1px solid #111;
  align-self: flex-start;
  padding-bottom: 2px;
}
.cus-des-section .cus-des-card .read-more:hover {
  color: #0067F6;
  border-color: #0067F6;
}
.cus-des-section .cus-des-card.card-visual .card-media {
  aspect-ratio: 0.83333333;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cus-des-section .cus-des-card.card-visual .card-brand {
  margin: 0;
  min-height: 0;
}
.cus-des-section .cus-des-card.cus-des-skeleton {
  box-shadow: none;
  pointer-events: none;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-media,
.cus-des-section .cus-des-card.cus-des-skeleton .skel-line {
  background: linear-gradient(90deg, #ececec 0%, #f6f6f6 50%, #ececec 100%);
  background-size: 200% 100%;
  animation: skel-shimmer 1.4s ease-in-out infinite;
  border-radius: 4px;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-media {
  width: 100%;
  aspect-ratio: 1.66666667;
  border-radius: 0;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-line {
  height: 12px;
  margin: 0 0 10px;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-brand {
  width: 40%;
  height: 22px;
  margin-bottom: 16px;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-text {
  width: 100%;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-text.short {
  width: 70%;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-author {
  width: 50%;
  height: 14px;
  margin-top: 8px;
}
.cus-des-section .cus-des-card.cus-des-skeleton .skel-link {
  width: 30%;
  height: 14px;
  margin-top: 8px;
}
@keyframes skel-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
@media (max-width: 1024px) {
  .cus-des-section .cus-des-grid {
    /* JS handles column count via window.innerWidth */
  }
}
@media (max-width: 991px) {
  .cus-des-section .cus-des-wrap {
    flex-direction: column;
    gap: 24px;
    max-width: 768px;
  }
  .cus-des-section .cus-filter {
    width: 100%;
    flex-basis: auto;
    position: static;
  }
  .cus-des-section .cus-filter .cus-filter-inner {
    max-height: none;
  }
  .cus-des-section .cus-filter .filter-head {
    cursor: pointer;
    margin-bottom: 0;
  }
  .cus-des-section .cus-filter .filter-head .filter-toggle {
    display: block;
  }
  .cus-des-section .cus-filter .filter-list {
    display: none;
    overflow: hidden;
    margin-top: 16px;
  }
  .cus-des-section .cus-filter.is-open .filter-head .filter-toggle {
    transform: rotate(180deg);
  }
  .cus-des-section .cus-filter.is-open .filter-list {
    display: block;
    animation: filter-slide-down 0.3s ease;
  }
}
@keyframes filter-slide-down {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 767px) {
  .cus-des-section {
    padding: 40px 0;
  }
  .cus-des-section .cus-des-wrap {
    padding: 0 16px;
    max-width: 340px;
  }
  .cus-des-section .cus-des-grid.is-stacked {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .cus-des-section .cus-des-card {
    margin-bottom: 0;
  }
}
/*# sourceMappingURL=global-jp-customers.css.map */