@charset "UTF-8";
:root {
  --rem: 1000vw / 750;
}
@media screen and (min-width: 768px) {
  :root {
    --rem: 1000vw / 1030;
  }
}
@media screen and (min-width: 1031px) {
  :root {
    --rem: 10px;
  }
}

#dwc-content *,
#dwc-content *::before,
#dwc-content *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#future .slider {
  padding: calc(2.4 * var(--rem)) 0 0;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
#future .slider > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
#future .slider > div a {
  display: block;
  width: calc(32 * var(--rem));
  position: relative;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}
#future .slider > div a .back {
  position: relative;
  opacity: 0;
  -webkit-transition: 4s;
  transition: 4s;
}
#future .slider > div a .thumb {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  -webkit-transition: 4s;
  transition: 4s;
}
#future .slider > div a.on .back {
  opacity: 1;
}
#future .slider > div a.on .thumb {
  opacity: 0;
}
#future .slider #slide01,
#future .slider #slide03 {
  -webkit-animation: marqueeLeft 40s linear infinite;
          animation: marqueeLeft 40s linear infinite;
}
#future .slider #slide02 {
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start;
  -webkit-animation: marqueeRightFromEnd 30s linear infinite;
          animation: marqueeRightFromEnd 30s linear infinite;
}
#future .slider.for_pc > div a {
  width: calc(20 * var(--rem));
}
#future .slider #slide_pc01 {
  -webkit-animation: marqueeLeft 48s linear infinite;
          animation: marqueeLeft 48s linear infinite;
}
#future .slider #slide_pc02 {
  -webkit-animation: marqueeRightFromEnd 40s linear infinite;
          animation: marqueeRightFromEnd 40s linear infinite;
}
@-webkit-keyframes marqueeLeft {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@keyframes marqueeLeft {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@-webkit-keyframes marqueeRightFromEnd {
  0% {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes marqueeRightFromEnd {
  0% {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@media screen and (min-width: 768px) {
  #future {
    border: calc(4.5 * var(--rem)) solid #EDF3FB;
    border-bottom: 0;
    padding: calc(4 * var(--rem)) 0 calc(2 * var(--rem));
    position: relative;
  }
  #future h2 {
    margin-inline: calc(-4.5 * var(--rem));
  }
  #future .slider {
    margin-inline: calc(-4.5 * var(--rem));
  }
}

#program-list ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: calc(2.8 * var(--rem));
  padding: calc(2.8 * var(--rem)) 0 0;
}
#program-list ul .item {
  width: calc(50% - 1.4 * var(--rem));
}

@media screen and (min-width: 768px) {
  #program {
    border: calc(4.5 * var(--rem)) solid #EDF3FB;
    border-top: 0;
  }
  #program h2 {
    margin: calc(0 * var(--rem)) calc(-4.5 * var(--rem)) 0;
  }
  #program #program-list {
    padding: 0 calc(2.8 * var(--rem));
  }
  #program #program-list ul {
    gap: calc(1.2 * var(--rem));
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: calc(2.4 * var(--rem));
  }
  #program #program-list ul .item {
    width: calc(33.3333333333% - 0.8 * var(--rem));
  }
}
#link-list {
  padding-bottom: calc(4 * var(--rem));
}
#link-list ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: calc(1.5 * var(--rem));
  width: calc(43.5 * var(--rem));
  margin-inline: auto;
}
#link-list ul li {
  width: 100%;
}
@media screen and (min-width: 768px) {
  #link-list ul {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: calc(4 * var(--rem));
    width: auto;
  }
  #link-list ul li {
    width: calc(33.3333333333% - 2.6666666667 * var(--rem));
  }
}

#popup-program,
#popup-future {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 10000;
  overflow-y: auto;
  padding: 0;
  padding-top: calc(8 * var(--rem));
}
#popup-program.is-active,
#popup-future.is-active {
  display: block;
}
#popup-program::after,
#popup-future::after {
  content: "";
  display: block;
  height: calc(16 * var(--rem));
}

.popup-program__item {
  display: none;
  background: #F0F0E6;
  border-radius: calc(6 * var(--rem));
  position: relative;
  padding-bottom: calc(20 * var(--rem));
  width: 90%;
  margin-inline: auto;
}
.popup-program__item.is-active {
  display: block;
}
@media screen and (min-width: 768px) {
  .popup-program__item {
    border-radius: calc(1 * var(--rem));
    width: min(80%, 600px);
    margin-inline: auto;
    padding-bottom: calc(12 * var(--rem));
  }
}
.popup-program__item .popup-program__body p {
  margin: calc(4 * var(--rem)) calc(6 * var(--rem)) 0;
  text-align: justify;
  font-size: calc(2.6 * var(--rem));
}
@media screen and (min-width: 768px) {
  .popup-program__item .popup-program__body p {
    font-size: calc(1.8 * var(--rem));
  }
}
.popup-program__item .popup-program__body p.img {
  margin: 0 calc(2 * var(--rem));
}
@media screen and (min-width: 768px) {
  .popup-program__item .popup-program__body p.img {
    margin: 0 calc(6 * var(--rem));
  }
}
@media screen and (min-width: 768px) {
  .popup-program__item .popup-program__body p.btn {
    margin-inline: auto;
    width: calc(28.5 * var(--rem));
  }
}
.popup-program__item .close1 {
  display: block;
  width: calc(8 * var(--rem));
  position: absolute;
  top: 0;
  right: 0;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
  border-radius: 100vmax;
}
@media screen and (min-width: 768px) {
  .popup-program__item .close1 {
    width: calc(5 * var(--rem));
    top: calc(1.5 * var(--rem));
    right: calc(1.5 * var(--rem));
  }
}
.popup-program__item .close2 {
  display: block;
  width: calc(13.2 * var(--rem));
  border-radius: 100vmax;
  position: absolute;
  bottom: calc(4 * var(--rem));
  inset-inline: 0;
  margin: auto;
}
@media screen and (min-width: 768px) {
  .popup-program__item .close2 {
    width: calc(8 * var(--rem));
    bottom: calc(2.5 * var(--rem));
  }
}

.popup-future__item {
  display: none;
  background: #F0F0E6;
  border-radius: 100vmax;
  position: relative;
  padding-bottom: calc(20 * var(--rem));
  width: 90%;
  margin-inline: auto;
}
.popup-future__item.is-active {
  display: block;
}
@media screen and (min-width: 768px) {
  .popup-future__item {
    border-radius: calc(1 * var(--rem));
    width: min(80%, 600px);
    margin-inline: auto;
    padding: calc(6 * var(--rem)) calc(6 * var(--rem));
    padding-bottom: calc(14 * var(--rem));
  }
}
.popup-future__item .popup-future__body h4 {
  margin: 0 calc(6 * var(--rem)) 0.5em;
}
@media screen and (min-width: 768px) {
  .popup-future__item .popup-future__body h4 {
    margin: 0 0 0.5em;
  }
}
.popup-future__item .popup-future__body p {
  margin: 0 calc(7.2 * var(--rem)) 1em;
  text-align: justify;
  font-size: calc(2.6 * var(--rem));
}
.popup-future__item .popup-future__body p.img {
  margin: 0 calc(3 * var(--rem));
}
.popup-future__item .popup-future__body p .note {
  font-size: calc(2.2 * var(--rem));
  text-indent: -2em;
  margin-left: 2em;
  margin-top: -1.5em;
  display: block;
}
.popup-future__item .popup-future__body p .note::before {
  content: "(※) ";
}
@media screen and (min-width: 768px) {
  .popup-future__item .popup-future__body p .note {
    font-size: calc(1.6 * var(--rem));
  }
}
@media screen and (min-width: 768px) {
  .popup-future__item .popup-future__body p {
    font-size: calc(1.8 * var(--rem));
    margin: 1em 0;
  }
  .popup-future__item .popup-future__body p.img {
    margin: 0 0 3em;
  }
}
.popup-future__item .popup-future__body .pickup {
  background: #fff;
  margin: calc(4 * var(--rem)) calc(3 * var(--rem)) 0;
  padding-top: 1px;
  padding-bottom: 1px;
}
@media screen and (min-width: 768px) {
  .popup-future__item .popup-future__body .pickup {
    margin: calc(2 * var(--rem)) calc(-2.4 * var(--rem)) 0;
  }
}
.popup-future__item .popup-future__body .pickup h4 {
  margin-inline: calc(2 * var(--rem));
  margin-top: calc(-4 * var(--rem));
}
.popup-future__item .popup-future__body .pickup p {
  margin: 0 calc(3 * var(--rem)) 1em;
}
.popup-future__item .popup-future__body .pickup p.btn {
  margin-bottom: calc(2 * var(--rem));
}
.popup-future__item .close1 {
  display: block;
  width: calc(8 * var(--rem));
  position: absolute;
  top: 0;
  right: 0;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
  border-radius: 100vmax;
}
@media screen and (min-width: 768px) {
  .popup-future__item .close1 {
    width: calc(5 * var(--rem));
    top: calc(1.5 * var(--rem));
    right: calc(1.5 * var(--rem));
  }
}
.popup-future__item .close2 {
  display: block;
  width: calc(13.2 * var(--rem));
  border-radius: 100vmax;
  position: absolute;
  bottom: calc(4 * var(--rem));
  inset-inline: 0;
  margin: auto;
}
@media screen and (min-width: 768px) {
  .popup-future__item .close2 {
    width: calc(8 * var(--rem));
    bottom: calc(2.5 * var(--rem));
  }
}

@media screen and (min-width: 768px) {
  .for_sp {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .for_pc {
    display: none !important;
  }
}/*# sourceMappingURL=style.css.map */