#page.in.shupatto {
  margin: 120px 0 85px 0;
  font-weight: 400;
  color: #0e0e0e;
}
#page.in.shupatto .wrap {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
}
#page.in.shupatto .mv {
  width: 100%;
  margin-bottom: 20px;
}
#page.in.shupatto .mv img {
  width: 100%;
}
#page.in.shupatto .breadcrumb-wrap {
  margin-bottom: 65px;
}
@media screen and (max-width: 1200px) {
  #page.in.shupatto {
    margin: 80px 0 85px 0;
  }
  #page.in.shupatto .wrap {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #page.in.shupatto {
    margin: 80px 0 100px 0;
  }
  #page.in.shupatto .mv {
    margin-bottom: 40px;
  }
  #page.in.shupatto .breadcrumb-wrap {
    margin-bottom: 65px;
  }
}
#page.in.shupatto .about {
  text-align: center;
  margin-bottom: 185px;
}
#page.in.shupatto .about .about-ttl {
  font-family: "Shippori Mincho", serif;
  font-size: 38px;
  letter-spacing: 0.08em;
  line-height: 1;
  margin-bottom: 50px;
  font-weight: 400;
}
#page.in.shupatto .about .about-text {
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 2.0625;
  margin-bottom: 65px;
  font-weight: 500;
}
#page.in.shupatto .about .about-logo {
  width: 100%;
  max-width: 380px;
  margin: 0 auto 70px auto;
}
#page.in.shupatto .about .about-link-wr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 30px;
}
#page.in.shupatto .about .about-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 280px;
  width: 100%;
  font-size: 14px;
  text-align: center;
  border: 1px solid #0e0e0e;
  border-radius: 50px;
  padding: 12px 24px 12px 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  position: relative;
}
#page.in.shupatto .about .about-link::after {
  content: "";
  background: url(../img/shupatto/kaibu.png) no-repeat;
  background-size: cover;
  display: block;
  width: 18px;
  height: 14px;
  position: absolute;
  right: 30px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media screen and (max-width: 767px) {
  #page.in.shupatto .about {
    text-align: center;
    margin-bottom: 140px;
  }
  #page.in.shupatto .about .about-ttl {
    font-size: 28px;
    letter-spacing: unset;
    line-height: 1.7142857143;
    margin-bottom: 40px;
  }
  #page.in.shupatto .about .about-text {
    font-size: 15px;
    line-height: 1.6666666667;
    margin-bottom: 50px;
    text-align: left;
    letter-spacing: 0.04em;
  }
  #page.in.shupatto .about .about-logo {
    max-width: 314px;
    margin: 0 auto 58px auto;
  }
  #page.in.shupatto .about .about-link-wr {
    gap: 30px;
  }
  #page.in.shupatto .about .about-link {
    max-width: 210px;
    font-size: 11px;
    border-radius: 15px;
    padding: 9px 22px 9px 0;
  }
  #page.in.shupatto .about .about-link::after {
    width: 13px;
    height: 10px;
    right: 20px;
  }
}
@media (hover: hover) {
  #page.in.shupatto .about .about-link:hover {
    background-color: #0e0e0e;
    color: #fff;
  }
  #page.in.shupatto .about .about-link:hover::after {
    -webkit-filter: brightness(0) saturate(100%) invert(99%) sepia(100%) saturate(1%) hue-rotate(45deg) brightness(102%) contrast(101%);
            filter: brightness(0) saturate(100%) invert(99%) sepia(100%) saturate(1%) hue-rotate(45deg) brightness(102%) contrast(101%);
  }
}
#page.in.shupatto .collaboration {
  margin-bottom: 160px;
}
#page.in.shupatto .collaboration .collaboration-ttl {
  font-family: "Cinzel Decorative", serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1;
  letter-spacing: 0.07em;
  margin-bottom: 70px;
  text-align: center;
}
#page.in.shupatto .collaboration .collaboration-logo {
  width: 100%;
  max-width: 194px;
  margin: 0 auto 20px auto;
}
#page.in.shupatto .collaboration .collaboration-wr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5px;
  margin-bottom: 16px;
}
#page.in.shupatto .collaboration .collaboration-item {
  width: 100%;
  max-width: 276px;
}
#page.in.shupatto .collaboration .collaboration-detail {
  font-size: 10px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  text-align: center;
}
@media (hover: hover) {
  #page.in.shupatto .collaboration .shop-add-text a:hover {
    opacity: 0.7;
  }
  #page.in.shupatto .collaboration .shop-web:hover {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
    opacity: 0.7;
  }
}
@media screen and (max-width: 1200px) {
  #page.in.shupatto .collaboration {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  #page.in.shupatto .collaboration {
    margin-bottom: 90px;
    padding: 0;
  }
  #page.in.shupatto .collaboration .collaboration-ttl {
    font-size: 25px;
    letter-spacing: 0.09em;
    margin-bottom: 55px;
  }
  #page.in.shupatto .collaboration .collaboration-logo {
    max-width: 144px;
    margin: 0 auto 23px auto;
  }
  #page.in.shupatto .collaboration .collaboration-wr {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    gap: 4px;
    margin-bottom: 20px;
    overflow-x: auto;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  #page.in.shupatto .collaboration .collaboration-item {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 44.27%;
            flex: 0 0 44.27%;
    max-width: unset;
  }
  #page.in.shupatto .collaboration .collaboration-detail {
    line-height: 1.6;
    letter-spacing: 0.04em;
  }
}