[data-ani] {
  --ani-delay: 0s;
  --ani-duration: 1s;
  pointer-events: none;
}
[data-ani].is-animated-done {
  pointer-events: auto;
}

.ani-width {
  width: 0;
  transition: width var(--ani-duration) cubic-bezier(0.42, 0, 0.58, 1) var(--ani-delay);
}
.ani-width.is-animated {
  width: 100%;
}

.ani-fade, .ani-fade-left, .ani-fade-right, .ani-fade-down-full, .ani-fade-down, .ani-fade-up {
  opacity: 0;
  transition: opacity var(--ani-duration) cubic-bezier(0.42, 0, 0.58, 1) var(--ani-delay), transform var(--ani-duration) cubic-bezier(0.42, 0, 0.58, 1) var(--ani-delay);
}
.ani-fade.is-animated, .is-animated.ani-fade-left, .is-animated.ani-fade-right, .is-animated.ani-fade-down-full, .is-animated.ani-fade-down, .is-animated.ani-fade-up {
  opacity: 1;
}
.ani-fade-up {
  transform: translateY(30px);
}
.ani-fade-up.is-animated {
  transform: translateY(0);
}
.ani-fade-down {
  transform: translateY(-10px);
}
.ani-fade-down.is-animated {
  transform: translateY(0);
}
.ani-fade-down-full {
  transform: translateY(-100%);
}
.ani-fade-down-full.is-animated {
  transform: translateY(0);
}
.ani-fade-right {
  transform: translateX(-10px);
}
.ani-fade-right.is-animated {
  transform: translateX(0);
}
.ani-fade-left {
  transform: translateX(10px);
}
.ani-fade-left.is-animated {
  transform: translateX(0);
}

.ani-scale {
  transform: scale(0.6);
  transform-origin: center;
  transition: opacity var(--ani-duration) cubic-bezier(0.42, 0, 0.58, 1) var(--ani-delay), transform var(--ani-duration) cubic-bezier(0.42, 0, 0.58, 1) var(--ani-delay);
}
.ani-scale.is-animated {
  transform: scale(1);
}

.ani-zoom {
  transform: scale(1.2);
  transform-origin: center;
  transition: transform var(--ani-duration) cubic-bezier(0.07, 0.09, 0.09, 0.62) var(--ani-delay);
}
.ani-zoom.is-animated {
  transform: scale(1);
}

.ani-clip, .ani-clip-full {
  clip-path: inset(0 100% 0 0);
  opacity: 0;
  transition: all var(--ani-duration) ease-in-out var(--ani-delay);
  will-change: clip-path;
}
@media (max-width: 768px) {
  .ani-clip-full {
    transition: all calc(var(--ani-duration) / 2) cubic-bezier(0.07, 0.09, 0.09, 0.62) calc(var(--ani-delay) / 2);
  }
}
.ani-clip.is-animated, .is-animated.ani-clip-full {
  opacity: 1;
  clip-path: inset(0);
}

.c-imgBox__cap {
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 1.1rem;
    color: #fff;
    text-shadow: 0 0 3px #000, 0 0 3px #000, 0 0 5px #000, 0 0 5px #000;
    line-height: 1.2;
    padding: 4px 4px;
    letter-spacing: .05em;
    text-align: right;
    z-index: 10;
}

.u-secLead {
    font-size: clamp(20px,18.0740740741px + 0.4938271605vw,24px);
    text-align: center;
    margin-bottom: clamp(24px,18.2222222222px + 1.4814814815vw,36px);
    line-height: 1.8
}

/* ------------------------- 打ち消し ------------------------- */
.u-inner{
  background: transparent;
}

.u-note{
  margin: 30px 0;
  line-height: 1.6;
  font-size: 10px;
  letter-spacing: 0;
}

.c-contents .u-inner{
  width: 90%;
  margin: auto;
  padding: 0;
}

.u-secLead{
  margin: 0;
}

.c-imgBox{
  position: relative;
}

.c-pageMv{
  overflow: hidden;
}

.c-pageMv picture{
  display: block;
}

.u-cap{
  margin-top: 1.0em;
  font-size: .8em;
  line-height: 1.8;
}

/* -------------------------------------------------- */

.c-contents {
  padding: clamp(50px, 25.9259259259px + 6.1728395062vw, 100px) 0 clamp(40px, 20.7407407407px + 4.9382716049vw, 80px);
}

.txtSpc {
  letter-spacing: 0.025em;
}

.iotSec {
  position: relative;
  overflow: hidden;
  background-color: #c8e2e2;
}
.iotSec::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("../../img/iot/bg_patt.svg");
  background-repeat: repeat;
  background-position: 0 0;
  opacity: 0.35;
  pointer-events: none;
}

.con {
  margin: clamp(90px, 46.6666666667px + 11.1111111111vw, 180px) 0 clamp(60px, 40.7407407407px + 4.9382716049vw, 100px);
}
.con .conHead {
  display: grid;
  grid-template-columns: 2fr 3.25fr;
  gap: clamp(30px, 15.5555555556px + 3.7037037037vw, 60px) clamp(0px, -57.7777777778px + 14.8148148148vw, 120px);
}
@media (max-width: 768px) {
  .con .conHead {
    grid-template-columns: 1fr;
  }
}
.con .conTtl__sub {
  display: block;
  color: #1d6344;
  border-left: solid 4px #1d6344;
  line-height: 1;
  padding-left: 12px;
  font-size: clamp(16px, 15.037037037px + 0.2469135802vw, 18px);
  font-weight: 700;
  letter-spacing: 0.075em;
}
.con .conTtl__main {
  display: block;
  font-size: clamp(20px, 18.0740740741px + 0.4938271605vw, 24px);
  font-weight: 500;
  line-height: 1.75;
  margin: clamp(18px, 15.1111111111px + 0.7407407407vw, 24px) 0;
}
.con .conTxt {
  font-size: clamp(13px, 12.5185185185px + 0.1234567901vw, 14px);
  line-height: 1.7;
}
.con .conItem {
  max-width: 995px;
  margin-top: clamp(44px, 34.3703703704px + 2.4691358025vw, 64px);
}
@media (max-width: 768px) {
  .con .conItem {
    max-width: 460px;
    margin: auto;
    margin-top: clamp(44px, 34.3703703704px + 2.4691358025vw, 64px);
  }
}
.con.con04 {
  display: grid;
  grid-template-columns: 2.0fr 1fr;
  gap: clamp(30px, 15.5555555556px + 3.7037037037vw, 60px) 5%;
}

.con.con04 .conItem{
  display: flex;
  align-items: flex-end;
}
@media (max-width: 768px) {
  .con.con04 {
    grid-template-columns: 1fr;
  }
  .con.con04 .conItem {
    margin: 0 8%;
  }
}
.con.con04 .conHead {
  grid-template-columns: 1fr;
  gap: 30px 0;
}/*# sourceMappingURL=iot.css.map */