@media screen and (max-width:3000px){

.bg01{background:url("../img/bg01_LL.jpg") no-repeat;background-size:cover;aspect-ratio:3000/1688;}
.bg02{background:url("../img/bg02_LL.jpg") no-repeat;background-size:cover;aspect-ratio:3000/1688;}
.bg03{background:url("../img/bg03_LL.jpg") no-repeat;background-size:cover;aspect-ratio:3000/1688;}
.bg04{background:url("../img/bg04_LL.jpg") no-repeat;background-size:cover;aspect-ratio:3000/1688;}
.bg05{background:url("../img/bg05_LL.jpg") no-repeat;background-size:cover;aspect-ratio:3000/1688;}

.bg-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /*コメント */
}

.bg-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none; /* ”w?i???C???[??‘??????W?°?????????E */
}

/* ?I?[?o?[???C??’C‰A */
.bg-layer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3); /* ????”?“§???I?[?o?[???C (30% ?s“§??“x) */
  pointer-events: none; /* ?I?[?o?[???C??‘??????W?°?????????E */
}

/* ?K?v?E‰??¶?A?I?[?o?[???C???F?a?s“§??“x?????X???≪?U?・ */
.bg-layer::before {padding:8% 0;
  background-color: rgba(255, 255, 255, 0.2); /* ”’??”?“§???I?[?o?[???C (20% ?s“§??“x) */
}

/* ?A?N?e?B?u??”w?i???\?| */
.bg-layer.active {
  opacity: 1;
  transition: opacity 0.5s ease-out;
}

/* ?Z?N?V?‡?“???X?^?C?? */
.my-section {
  min-height: 110vh;
  /*padding: 100px 0px;*/
  /*display: flex;
  flex-direction: column;*/
  /*justify-content: center;
  align-items: center;*/
  position: relative;
}

.my-section:nth-child(odd) {
  background: rgba(255, 255, 255, 0.4);
}

.my-section:nth-child(even) {
  background: rgba(255, 255, 255, 0.4);
}

}

@media screen and (max-width:767px){
.bg01{background:url("../img/bg01_s.jpg") no-repeat;background-size:cover;aspect-ratio:800/1000;}
.bg02{background:url("../img/bg02_s.jpg") no-repeat;background-size:cover;aspect-ratio:800/1000;}
.bg03{background:url("../img/bg03_s.jpg") no-repeat;background-size:cover;aspect-ratio:800/1000;}
.bg04{background:url("../img/bg04_s.jpg") no-repeat;background-size:cover;aspect-ratio:800/1000;}
.bg05{background:url("../img/bg05_s.jpg") no-repeat;background-size:cover;aspect-ratio:800/1000;}

.bg-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* ”w?i?????e?E”z’u */
}

.bg-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none; /* ”w?i???C???[??‘??????W?°?????????E */
}

/* ?I?[?o?[???C??’C‰A */
.bg-layer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3); /* ????”?“§???I?[?o?[???C (30% ?s“§??“x) */
  pointer-events: none; /* ?I?[?o?[???C??‘??????W?°?????????E */
}

/* ?K?v?E‰??¶?A?I?[?o?[???C???F?a?s“§??“x?????X???≪?U?・ */
.bg-layer::before {padding:8% 0;
  background-color: rgba(255, 255, 255, 0.2); /* ”’??”?“§???I?[?o?[???C (20% ?s“§??“x) */
}

/* ?A?N?e?B?u??”w?i???\?| */
.bg-layer.active {
  opacity: 1;
  transition: opacity 0.5s ease-out;
}

/* ?Z?N?V?‡?“???X?^?C?? */
.my-section {
  min-height: 110vh;
  /*padding: 100px 0px;*/
  /*display: flex;
  flex-direction: column;*/
  /*justify-content: center;
  align-items: center;*/
  position: relative;
}

.my-section:nth-child(odd) {
  background: rgba(255, 255, 255, 0.4);
}

.my-section:nth-child(even) {
  background: rgba(255, 255, 255, 0.4);
}

}