@charset "utf-8";
/* CSS Document */


@media only screen and (max-width: 768px) {

}


/* #page_ttl
----------------------------------------- */
#conWrap #page_ttl {
    position: static;
}
#page_ttl .bg {
    top: 8rem;
    height: auto;
    aspect-ratio: 1366 / 588;
}
#page_ttl h1.page_ttl .en {
    color: #000000;
}
#page_ttl h1.page_ttl .jp {
    color: #000000;
}
#page_ttl h1.page_ttl::before {
    content: '';
    display: block;
    width: 43.2rem;
    height: 0.5rem;
    background: url(../images/ttl_line_blk.svg) no-repeat center center / contain;
}

@media screen and (max-width: 768px) {
#page_ttl .bg {
    top: 4rem;
    height: auto;
    aspect-ratio: 375 / 300;
}
#page_ttl h1.page_ttl::before {
    content: '';
    display: block;
    width: 30rem;
    height: 0.33rem;
    background: url(../images/ttl_line_blk.svg) no-repeat center center / contain;
}

}


/* #message
----------------------------------------- */
#message {
}

#message .inner {
    padding-top: 8rem;
    padding-bottom: 14rem;
}

#message .layout {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 6rem 0;
}
#message .layout .ttl {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 3rem;
}
#message .layout .ttl span {
    display: block;
    font-size: 2.3rem;
    letter-spacing: 0.1em;
	line-height: calc(40/23);
    font-weight: 400;
    text-align: center;
}
#message .layout .txt {
    font-size: 1.6rem;
    letter-spacing: 0.02em;
	line-height: calc(47/16);
    font-weight: 700;
    text-align: center;
}

#message .image_slider {
    width: 100%;
    overflow: hidden;
}
#message .image_slider .swiper-wrapper {
    transition-timing-function: linear;
}
#message .image_slider .swiper-slide {
    /*width: 30vw;*/
    width: auto;
    height: auto;
    flex-shrink: 0;
}
#message .image_slider .img {
    width: auto;
    height: 28rem;
}
#message .image_slider .img img {
    width: auto;
    height: 100%;
    display: block;
}


#message .loop_slider {
  overflow: hidden;
}

#message .loop_slider .loop_track {
  display: flex;
  width: max-content;
  animation: loop 30s linear infinite;
}

#message .loop_slider .slide {
  flex-shrink: 0;
}

#message .loop_slider .slide img {
  height: 28rem;
  width: auto;
}

@keyframes loop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-33.333%);
  }
}


@media screen and (max-width: 768px) {
#message .inner {
    padding-top: 4rem;
    padding-bottom: 8rem;
}

#message .layout {
    gap: 4rem 0;
}
#message .layout .ttl {
    gap: 2rem;
}
#message .layout .ttl span {
    font-size: 2.0rem;
}
#message .layout .txt {
    font-size: 1.4rem;
}

#message .image_slider {
    width: 100%;
    overflow: hidden;
}
#message .image_slider .swiper-wrapper {
    transition-timing-function: linear;
}
#message .image_slider .swiper-slide {
    /*width: 30vw;*/
    width: auto;
    height: auto;
    flex-shrink: 0;
}
#message .image_slider .img {
    width: auto;
    height: 28rem;
}
#message .image_slider .img img {
    width: auto;
    height: 100%;
    display: block;
}


#message .loop_slider {
  overflow: hidden;
}

#message .loop_slider .loop_track {
  display: flex;
  width: max-content;
  animation: loop 30s linear infinite;
}

#message .loop_slider .slide {
  flex-shrink: 0;
}

#message .loop_slider .slide img {
  height: 20rem;
  width: auto;
}
}

