@charset "UTF-8";
/* ¥¢¥Ë¥á©`¥·¥ç¥ó
=========================================================== */
/* ¥Õ¥§©`¥É¥¤¥ó
????????????????????????????????? */
.inview__anim--fade-in {
  opacity: 0;
  will-change: opacity;
  transition: opacity .8s ease 0s;
}

.inview__complete .inview__anim--fade-in, .inview__anim--fade-in.inview__complete {
  opacity: 1;
}

/* ¥Õ¥§©`¥É¥¤¥ó¥¢¥Ã¥×
????????????????????????????????? */
.inview__anim--fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  will-change: opacity, transform;
  transition: opacity .8s ease 0s, transform .8s ease 0s;
}

.inview__complete .inview__anim--fade-in-up, .inview__anim--fade-in-up.inview__complete {
  opacity: 1;
  transform: translateY(0);
}

/* ¥Õ¥§©`¥É¥¤¥ó X
????????????????????????????????? */
.inview__anim--fade-in-x {
  opacity: 0;
  transform: translateX(-30px);
  will-change: opacity, transform;
  transition: opacity .8s ease 0s, transform .8s ease 0s;
}

.inview__complete .inview__anim--fade-in-x, .inview__anim--fade-in-x.inview__complete {
  opacity: 1;
  transform: translateX(0);
}

/* ¥Õ¥§©`¥É¥¤¥ó XX
????????????????????????????????? */
.inview__anim--fade-in-xx {
  opacity: 0;
  transform: translateX(30px);
  will-change: opacity, transform;
  transition: opacity .8s ease 0s, transform .8s ease 0s;
}

.inview__complete .inview__anim--fade-in-xx, .inview__anim--fade-in-xx.inview__complete {
  opacity: 1;
  transform: translateX(0);
}

/* ¥¹¥±©`¥ë¥¤¥ó
????????????????????????????????? */
.inview__anim--scale-in {
  opacity: 0;
  transform: scale(1.08);
  will-change: opacity, transform;
  transition: opacity .8s ease 0s, transform .8s ease 0s;
}

.inview__complete .inview__anim--scale-in, .inview__anim--scale-in.inview__complete {
  opacity: 1;
  transform: scale(1);
}

/* ¥¹¥±©`¥ëY
????????????????????????????????? */
.inview__anim--scale-y {
  transform: scaleY(0);
  will-change: transform;
  transition: transform .8s ease 0s;
  transform-origin: center top;
}

.inview__complete .inview__anim--scale-y {
  transform: scale(1);
}

/* ¥¹¥é¥¤¥É¥¤¥ó
????????????????????????????????? */
/* ÎÄ×Ö
????????????????????????????????? */
/* ¥¿¥¤¥Ô¥ó¥°
????????????????????????????????? */
/* ==========================================================================
   ¥È¥Ã¥×¥Ú©`¥¸ÓÃ¥¹¥¿¥¤¥ë
   ========================================================================== */
#contents {
  padding-bottom: 90px;
  padding-top: 0;
}

@media screen and (max-width: 767px) {
  #contents {
    padding-bottom: 20px;
  }
}

.main-ttl-lv1 {
  font-family: "Roboto", "Open Sans", "YakuHanJPs", "¥Ò¥é¥®¥Î½Ç¥´ ProN W3", "Hiragino Kaku Gothic ProN", "¥á¥¤¥ê¥ª", Meiryo, sans-serif !important;
  font-weight: 500 !important;
}

/* ¥á¥¤¥ó¥Ó¥¸¥å¥¢¥ë
   ========================================================================== */
.main-visual {
  margin-bottom: -96px;
  position: relative;
  top: -96px;
}

#main-visual-copy {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 29%;
  left: 0;
  z-index: 5;
  font-family: 'Vollkorn', serif;
  color: #FFF;
  font-size: 2.8vw;
  font-weight: 500;
  line-height: 1.52em;
  text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
}

#main-visual-copy li {
  -webkit-transition: opacity 1.5s ease;
  transition: opacity 1.5s ease;
  -webkit-backface-visibility: hidden;
  position: absolute;
  width: 100%;
  top: 0;
}

#main-visual-copy li.hidden {
  opacity: 0;
}

#main-visual-copy li.current {
  opacity: 1;
}

#main-visual-lead {
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 5;
  top: 50.5%;
  color: #FFF;
  font-size: 1vw;
  line-height: 1.95em;
  text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
}

/* ¥¹¥é¥¤¥É¥·¥ç©`¥Ð©`¥¸¥ç¥ó */
#main-visual-slide li {
  height: 100%;
  width: 100%;
  overflow: hidden;
  -webkit-transition: opacity 3s ease;
  transition: opacity 3s ease;
}

#main-visual-slide li:nth-child(2) {
  position: absolute;
  left: 0;
  top: 0;
}

#main-visual-slide li.hidden {
  opacity: 0;
}

#main-visual-slide li.current {
  z-index: 1;
}

#main-visual-slide img {
  height: auto;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .main-visual {
    overflow: hidden;
    margin-bottom: 0;
    top: 0;
  }
  #main-visual-copy {
    top: 16%;
    z-index: 5;
    font-size: 4.55vw;
    line-height: 1.55em;
  }
  #main-visual-lead {
    top: 45%;
    font-size: 2vw;
    line-height: 1.65em;
  }
  #main-visual-slide img {
    height: auto;
    max-width: inherit;
    width: 130%;
    position: relative;
    left: -15%;
  }
}

/* animation */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media screen and (min-width: 768px), print {
  #main-visual-copy {
    -webkit-animation: fadeIn 2s ease both 1.5s;
    animation: fadeIn 2s ease both 1.5s;
  }
  #main-visual-lead {
    -webkit-animation: fadeIn 2s ease both 2.5s;
    animation: fadeIn 2s ease both 2.5s;
  }
  #main-visual-slide {
    -webkit-animation: fadeIn 1.5s ease;
    animation: fadeIn 1.5s ease;
  }
  #main-visual-movie {
    -webkit-animation: fadeIn 1.5s ease;
    animation: fadeIn 1.5s ease;
  }
}

@media screen and (max-width: 767px) {
  #main-visual-copy,
  #main-visual-lead,
  #main-visual-slide,
  #main-visual-movie {
    -webkit-animation: fadeIn 1.5s ease;
    animation: fadeIn 1.5s ease;
  }
}

.cmn-cattop-sub-list {
  margin-top: 85px;
  padding-right: 0;
}

.cmn-cattop-sub-list li {
  width: 32%;
}

.cmn-cattop-sub-list li a {
  font-family: "Roboto", "Open Sans", "YakuHanJPs", "¥Ò¥é¥®¥Î½Ç¥´ ProN W3", "Hiragino Kaku Gothic ProN", "¥á¥¤¥ê¥ª", Meiryo, sans-serif !important;
  font-weight: 500 !important;
  padding-top: 1.2em;
  padding-bottom: 1.2em;
}

.cmn-cattop-sub-list li:last-child {
  margin-right: 0;
}

.main-center {
  margin-bottom: 0;
}

.solution-container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row-reverse;
  margin-top: 80px;
}

.solution-container-text {
  width: 40%;
  text-align: center;
}

.solution-container-text p + p {
  margin-top: 30px;
}

.solution-container-img {
  width: 40%;
}

.solution-heading {
  font-family: "Roboto", "Open Sans", "YakuHanJPs", "¥Ò¥é¥®¥Î½Ç¥´ ProN W3", "Hiragino Kaku Gothic ProN", "¥á¥¤¥ê¥ª", Meiryo, sans-serif !important;
  font-weight: 500 !important;
  font-size: 1.6vw;
  margin-bottom: 18px;
}

.solution-note {
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .cmn-cattop-sub-list {
    margin-top: 40px;
    padding-right: 0;
  }
  .cmn-cattop-sub-list li {
    width: 100%;
  }
  .cmn-cattop-sub-list li a {
    font-size: 15px;
    font-size: 1.5rem;
    padding-top: 0.8em;
    padding-bottom: 0.8em;
  }
  .cmn-cattop-sub-list li:last-child {
    margin-right: 0;
  }
  .solution-container {
    display: block;
    margin-top: 35px;
  }
  .solution-container-text {
    width: 100%;
    text-align: left;
    padding: 0 2.5%;
  }
  .solution-container-text p + p {
    margin-top: 20px;
  }
  .solution-container-img {
    width: 100%;
    margin: 30px auto 0 auto;
    padding: 0 2.5%;
  }
  .solution-heading {
    font-size: 17px;
    font-size: 1.7rem;
    margin-bottom: 14px;
  }
  .solution-note {
    margin-bottom: 20px;
  }
}

/*# sourceMappingURL=style.css.map */