@charset "utf-8";
.button {
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  -webkit-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.abswh100 {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.wh100 {
  width: 100%;
  height: 100%;
}
.center {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}
.abscenter {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.hv_center {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
}
.h_center {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
}
.v_center {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.hover_scale {
  transition: all 200ms 0s ease;
}
.hover_scale:hover {
  transform: scale(1.03);
}
/*==============================================================
  ■ (SP)
==============================================================*/
@keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.maincontent {
  position: relative;
  background: url(../img/bg.png);
}
.fixbg {
  display: none;
}
.kv {
  height: 141.02564vw;
}
.kv__logo {
  position: absolute;
  left: 4.10256vw;
  top: 4.10256vw;
  z-index: 2;
}
.kv__logo a {
  display: block;
  width: 28.205vw;
  height: 6.154vw;
  background-image: url("../img/head_logo.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
}
.kv__logo a a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.kv__circle {
  width: 116.41vw;
  height: 116.667vw;
  background-image: url("../img/kv_circle.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: -7.69231vw;
  top: 2.5641vw;
  animation: 30s linear 1s infinite running rot;
}
.kv__circle a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.kv__title {
  width: 84.615vw;
  height: 38.462vw;
  background-image: url("../img/kv_title.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 7.17949vw;
  top: 21.79487vw;
}
.kv__title a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.kv__illust {
  width: 100vw;
  height: 87.179vw;
  background-image: url("../img/kv_illust.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 0vw;
  top: 56.41026vw;
  /*
		&__acc1{
			.bg-vw("../img/kv_il_anime1.svg");
			.abs-vw(-10px,60px);
			animation: 1.5s ease-out 1s infinite running il1;
		}
		&__acc2{
			.bg-vw("../img/kv_il_anime2.svg");
			.abs-vw(206px,250px);
			opacity: 0;
			animation: 4s ease-out 1s infinite running il2;
		}
		&__acc3{
			.bg-vw("../img/kv_il_anime2.svg");
			.abs-vw(300px,180px);
			opacity: 0;
			animation: 4s ease-out 2s infinite running il2;
		}
		&__acc4{
			.bg-vw("../img/kv_il_anime2.svg");
			.abs-vw(360px,200px);
			opacity: 0;
			animation: 4s ease-out 3s infinite running il2;
		}
			*/
}
.kv__illust a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@keyframes il1 {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.1);
    opacity: 0;
  }
}
@keyframes il2 {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    transform: translateY(30px);
    opacity: 0;
  }
}
.concept {
  padding-top: 7.69231vw;
  padding-bottom: 20vw;
}
.concept__pimg {
  width: 46.282vw;
  height: 58.846vw;
  background-image: url("../img/concept_product.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto;
}
.concept__pimg a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.concept__read {
  text-align: center;
  font-feature-settings: 'pwid' on, 'palt' on;
  font-family: "Noto Sans JP";
  font-size: 4.61538vw;
  font-weight: 700;
  line-height: 222.222%;
  letter-spacing: 0.02em;
  margin-top: 16.41026vw;
}
.concept__read p {
  margin-bottom: 10.25641vw;
  text-align: center;
}
.concept__read p span {
  color: #006341;
}
.special {
  width: 100%;
  background: #B6FF56;
  border-radius: 10.25641vw;
  padding: 12.05128vw 8.20513vw 10.25641vw;
}
.special__title {
  width: 66.154vw;
  height: 19.231vw;
  background-image: url("../img/special_title.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto;
}
.special__title a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.special__catch {
  text-align: center;
  font-size: 4.61538vw;
  font-weight: bold;
  line-height: 155%;
  margin-top: 7.69231vw;
}
.special__prof {
  width: 74.231vw;
  height: 14.359vw;
  background-image: url("../img/special_prof.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 8.20513vw auto 0;
}
.special__prof a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.special__img {
  margin-top: 2.5641vw;
}
.special__read {
  font-weight: 700;
  font-size: 5.12821vw;
  line-height: 170%;
  letter-spacing: 0.02em;
  margin-top: 4.10256vw;
}
.special__topic1 {
  width: 83.59vw;
  height: 45.128vw;
  background-image: url("../img/special_topic1.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 4.10256vw auto 0;
}
.special__topic1 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.special__topic2 {
  width: 83.59vw;
  height: 45.128vw;
  background-image: url("../img/special_topic2.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 8.20513vw auto 0;
}
.special__topic2 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.special .spbtn {
  position: relative;
  width: 73.33333vw;
  height: 16.41026vw;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto 0;
  border-radius: 8.20513vw;
  background-color: white;
}
.special .spbtn .arrow {
  position: absolute;
  right: 0;
  top: 0;
  width: 16.41026vw;
  height: 16.41026vw;
  background-color: #008033;
  border-radius: 25.64103vw;
  transition: all 300ms 0s ease;
}
.special .spbtn .arrow::before {
  content: '';
  width: 8.205vw;
  height: 8.205vw;
  background-image: url("../img/column/btn_arrow.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(180deg);
}
.special .spbtn .arrow::before a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.special .spbtn p {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  font-size: 5.64103vw;
  font-weight: 700;
  color: #008033;
  padding-left: 14.35897vw;
}
.special .spbtn1 {
  margin-top: 2.05128vw;
}
.special .spbtn2 {
  margin-top: 2.05128vw;
}
.collab {
  width: 100%;
  background: #B6FF56;
  border-radius: 10.25641vw;
  padding: 12.05128vw 8.20513vw 10.25641vw;
}
.collab__title {
  width: 61.538vw;
  height: 19.231vw;
  background-image: url("../img/collab_title.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto 8.46154vw;
}
.collab__title a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.collab__catch {
  font-weight: 700;
  font-size: 4.61538vw;
  line-height: 155%;
  text-align: center;
  letter-spacing: 0.02em;
}
.collab__img {
  margin-top: 7.69231vw;
}
.collab__subcontainer {
  display: -ms-flexbox;
  display: flex;
  margin-top: 6.15385vw;
}
.collab__subcontainer__img {
  width: 33.33333vw;
}
.collab__subcontainer__img img {
  width: 100%;
  height: auto;
}
.collab__subcontainer__txt {
  width: 50.25641vw;
  padding-left: 3.58974vw;
  padding-top: 0vw;
}
.collab__subcontainer__txt__areatag {
  display: inline-block;
  height: 7.69231vw;
  font-size: 3.58974vw;
  font-weight: bold;
  line-height: 7.69231vw;
  padding: 0 2.5641vw;
  border: 1px solid black;
  border-radius: 25.64103vw;
}
.collab__subcontainer__txt__name {
  font-size: 4.61538vw;
  font-weight: bold;
  line-height: 155%;
  margin-top: 3.58974vw;
}
.collab__subcontainer__txt__date {
  font-size: 3.58974vw;
  line-height: 185%;
  margin-top: 2.05128vw;
}
.collab__detailbtn {
  position: relative;
  width: 63.07692vw;
  height: 12.30769vw;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  border-radius: 12.30769vw;
  background-color: white;
  margin-top: 8.20513vw;
}
.collab__detailbtn .arrow {
  position: relative;
  width: 12.30769vw;
  height: 12.30769vw;
  background-color: #008033;
  border-radius: 25.64103vw;
  transition: all 300ms 0s ease;
  position: absolute;
  right: 0vw;
  top: 0vw;
}
.collab__detailbtn .arrow::before {
  content: '';
  width: 8.205vw;
  height: 8.205vw;
  background-image: url("../img/column/btn_arrow.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(180deg);
}
.collab__detailbtn .arrow::before a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.collab__detailbtn p {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  font-size: 4.61538vw;
  font-weight: 700;
  color: #008033;
  letter-spacing: 0.1em;
  padding-left: 15.38462vw;
}
.acc1 {
  position: relative;
  padding: 13.84615vw 0 13.84615vw;
}
.acc1__ticker {
  width: 100%;
  height: 7.69231vw;
  background: url(../img/ticker1.png) top left / contain repeat-x;
  animation: 10s linear 1s infinite running xloop;
}
@keyframes xloop {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -76.92308vw 0;
  }
}
.column {
  width: 100%;
  background: #B6FF56;
  border-radius: 10.25641vw;
  padding-top: 12.05128vw;
  padding-bottom: 12.30769vw;
}
.column__title {
  width: 66.667vw;
  height: 19.231vw;
  background-image: url("../img/column_title.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto;
}
.column__title a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.column__read {
  text-align: center;
  font-size: 4.61538vw;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-top: 8.97436vw;
}
.column__list__item__img {
  width: 83.58974vw;
  height: 55.64103vw;
  margin: 9.23077vw auto 0;
}
.column__list__item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.column__list__item__txt {
  width: 83.58974vw;
  font-size: 5.64103vw;
  font-weight: 700;
  line-height: 145%;
  margin: 4.10256vw auto 0;
}
.column__moreinfo {
  text-align: center;
  margin-top: 12.82051vw;
}
.column__moreinfo__e {
  font-family: "Krona One", "Noto Sans JP", "游ゴシック体", 'Yu Gothic', "YuGothic", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', "メイリオ", "Meiryo", "Osaka", 'ＭＳ Ｐゴシック', 'MS PGothic', "sans-serif";
  font-weight: 400;
  font-size: 4.61538vw;
}
.column__moreinfo__j {
  font-size: 4.10256vw;
  font-weight: 700;
  margin-top: 2.05128vw;
}
@keyframes smk1 {
  0% {
    transform: scale(0.5) rotate(30deg) translateY(100px);
    opacity: 0;
    filter: blur(2px);
  }
  25% {
    opacity: 1;
  }
  50% {
    transform: scale(1) rotate(0deg) translateY(0);
    filter: blur(10px);
  }
  75% {
    opacity: 1;
  }
  100% {
    transform: scale(1.4) rotate(-30deg) translateY(-100px);
    opacity: 0;
    filter: blur(40px);
  }
}
@keyframes smk2 {
  0% {
    transform: scale(0.5) rotate(-80deg) translateY(100px);
    opacity: 0;
    filter: blur(2px);
  }
  25% {
    opacity: 1;
  }
  50% {
    transform: scale(1) rotate(0deg) translateY(0);
    filter: blur(10px);
  }
  75% {
    opacity: 1;
  }
  100% {
    transform: scale(3) rotate(80deg) translateY(-100px);
    opacity: 0;
    filter: blur(40px);
  }
}
@keyframes smk3 {
  0% {
    transform: scale(0.5) rotate(30deg) translateY(400px);
    opacity: 0;
    filter: blur(2px);
  }
  25% {
    opacity: 1;
  }
  50% {
    transform: scale(1) rotate(0deg) translateY(0);
    filter: blur(10px);
  }
  75% {
    opacity: 1;
  }
  100% {
    transform: scale(1.4) rotate(-30deg) translateY(-200px);
    opacity: 0;
    filter: blur(40px);
  }
}
@keyframes smk4 {
  0% {
    transform: scale(0.5) rotate(-30deg) translateY(400px);
    opacity: 0;
    filter: blur(2px);
  }
  25% {
    opacity: 1;
  }
  50% {
    transform: scale(1) rotate(0deg) translateY(0);
    filter: blur(10px);
  }
  75% {
    opacity: 1;
  }
  100% {
    transform: scale(1.4) rotate(30deg) translateY(-400px);
    opacity: 0;
    filter: blur(40px);
  }
}
.smoke1 {
  width: 77.692vw;
  height: 69.103vw;
  background-image: url("../img/smoke1.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: -33.33333vw;
  top: 10.25641vw;
  opacity: 0;
  animation: 8s linear 2s infinite running smk1;
  pointer-events: none;
}
.smoke1 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.smoke2 {
  width: 68.974vw;
  height: 104.872vw;
  background-image: url("../img/smoke2.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: -33.33333vw;
  top: 51.28205vw;
  opacity: 0;
  animation: 8s linear 5s infinite running smk2;
  pointer-events: none;
}
.smoke2 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.smoke3 {
  width: 74.103vw;
  height: 76.923vw;
  background-image: url("../img/smoke3.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: -33.33333vw;
  top: 112.82051vw;
  opacity: 0;
  animation: 8s linear 5s infinite running smk3;
  pointer-events: none;
}
.smoke3 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.smoke4 {
  width: 72.308vw;
  height: 72.308vw;
  background-image: url("../img/smoke4.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: -33.33333vw;
  top: 307.69231vw;
  opacity: 0;
  animation: 8s linear 5s infinite running smk4;
  pointer-events: none;
}
.smoke4 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
