/* CSS Document */
.mainZone {
  position: relative;
  background-position: center top;
  background-repeat: no-repeat;
  height: 866px;
}

@media screen and (max-width: 767px) {
  .mainZone {
    height: auto;
  }
}

.mainZone .mainInner {
  display: flex;
  width: 1000px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner {
    display: block;
    width: 100%;
  }
}

.mainZone .mainInner .ph {
  width: 584px;
  box-sizing: border-box;
  position: relative;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner .ph {
    width: 100%;
  }
}

.mainZone .mainInner .ph .txt {
  position: absolute;
  width: 226px;
  left: -50px;
  top: 60px;
  transition-delay: 0.5s;
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner .ph .txt {
    width: 39.74359vw;
    left: 5.12821vw;
  }
}

.mainZone .mainInner .ph .txt.show-anime {
  top: 20px;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner .ph .txt.show-anime {
    top: 5.12821vw;
  }
}

.mainZone .mainInner .ph img {
  position: relative;
  left: 50px;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner .ph img {
    left: 0px;
  }
}

.mainZone .mainInner .img {
  flex-shrink: 0;
  transition-delay: 0.3s;
}

.mainZone .mainInner .img h1 {
  width: 289px;
  margin: 70px 0 0 128px;
}

@media screen and (max-width: 767px) {
  .mainZone .mainInner .img h1 {
    width: 89.48718vw;
    margin: -5.12821vw auto 0 auto;
    position: relative;
    z-index: 3;
  }
}

@media screen and (max-width: 767px) {
  .mainZone nav {
    padding-bottom: 15.38462vw;
  }
}

.mainZone nav ul {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 38px;
}

@media screen and (max-width: 767px) {
  .mainZone nav ul {
    flex-wrap: wrap;
  }
}

.mainZone nav ul li {
  flex-shrink: 0;
  position: relative;
  box-sizing: border-box;
  padding: 0 10px;
}

@media screen and (max-width: 767px) {
  .mainZone nav ul li {
    padding: 0px;
    margin-top: 2vw;
  }
}

.mainZone nav ul li img {
  width: 179px;
}

@media screen and (max-width: 767px) {
  .mainZone nav ul li img {
    width: 33vw;
  }
}

.mainZone nav ul li:first-of-type {
  padding-left: 0px;
}

.mainZone nav ul li:last-of-type {
  padding-right: 0px;
}

.mainZone nav ul li:last-of-type:after {
  display: none;
}

@media screen and (max-width: 767px) {
  .mainZone nav ul li:nth-of-type(5) {
    padding-left: 2vw;
  }
  .mainZone nav ul li:nth-of-type(4) {
    padding-right: 2vw;
  }
  .mainZone nav ul li:nth-of-type(3)::after {
    display: none;
  }
  .mainZone nav ul li:nth-of-type(2)::after {
    right: -1vw;
  }
  .mainZone nav ul li:nth-of-type(1)::after {
    right: 0.5vw;
  }
}

.mainZone nav ul li:after {
  content: "";
  width: 1px;
  display: inline-block;
  height: 33px;
  background-color: #707070;
  position: absolute;
  right: -1px;
  top: 3px;
  transform: rotate(27deg);
}

@media screen and (max-width: 767px) {
  .mainZone nav ul li:after {
    height: 7vw;
    right: 0vw;
    top: 0px;
  }
}

.introZone {
  background-position: center top;
  background-repeat: no-repeat;
  height: 884px;
}

@media screen and (max-width: 767px) {
  .introZone {
    height: auto;
  }
}

.introZone .in {
  background-image: url("../img/intro/bg.jpg");
  background-size: cover;
  background-position: center;
  height: 768px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .introZone .in {
    background-image: url("../img/intro/bg_sp.jpg");
    height: 230vw;
    box-sizing: border-box;
    padding: 15.38462vw 5.12821vw;
  }
}

.introZone .in .txt {
  width: 375px;
  position: absolute;
  left: 60%;
  top: 10%;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .introZone .in .txt {
    position: static;
    width: 100%;
    margin: 0 auto;
  }
}

.introZone .in .txt h2 {
  margin-bottom: 40px;
  top: 30px;
  position: relative;
}

.introZone .in .txt h2.show-anime {
  top: 0px;
}

.introZone .in .txt .box {
  top: 30px;
  position: relative;
  transition-delay: .3s;
}

@media screen and (max-width: 767px) {
  .introZone .in .txt .box {
    height: 180vw;
  }
}

.introZone .in .txt .box.show-anime {
  top: 0px;
}

.introZone .in .txt .logo {
  width: 225px;
  position: absolute;
  left: 0px;
  bottom: 0px;
}

@media screen and (max-width: 767px) {
  .introZone .in .txt .logo {
    width: 55.12821vw;
  }
}

.introZone .in .txt .item {
  text-align: right;
}

.introZone .in .txt .item img {
  width: 118px;
}

@media screen and (max-width: 767px) {
  .introZone .in .txt .item img {
    width: 28.20513vw;
    position: absolute;
    right: -3vw;
    bottom: 0px;
  }
}

.pointsZone {
  background-position: center top;
  background-repeat: no-repeat;
  width: 100%;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .pointsZone {
    width: 100vw;
    overflow: hidden;
  }
}

.pointsZone .sec {
  margin-bottom: 142px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec {
    margin-bottom: 15.38462vw;
  }
}

.pointsZone .secMain {
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .secMain {
    padding: 10.25641vw 5.12821vw 0vw 5.12821vw;
  }
}

.pointsZone .secMain .mainPhoto {
  transition: 0.8s;
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .secMain .mainPhoto {
    transition-delay: 0.5s;
  }
}

.pointsZone .secMain h2,
.pointsZone .secMain .txtIn {
  position: relative;
  top: 30px;
  transition: 0.5s;
  opacity: 0;
  transition-delay: 0.3s;
}

.pointsZone .secMain.show-anime h2,
.pointsZone .secMain.show-anime .txtIn {
  top: 0px;
  opacity: 1;
}

.pointsZone .secSub {
  position: relative;
  top: 30px;
}

.pointsZone .secSub.show-anime {
  top: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .secSub {
    padding: 7.69231vw 5.12821vw 0vw 5.12821vw;
  }
}

.pointsZone .secSub .notes {
  font-size: 1rem;
}

.pointsZone .secSub .in {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .secSub .in {
    width: 100%;
  }
}

.pointsZone .secSub .in .cap {
  position: absolute;
}

@media screen and (max-width: 767px) {
  .pointsZone .secSub .in .cap {
    position: static;
    width: auto;
  }
}

.pointsZone .secSub .in .cap strong {
  font-weight: bold;
}

.pointsZone .secSub .subTitle {
  width: 20px;
  position: absolute;
  left: 20px;
}

@media screen and (max-width: 1200px) {
  .pointsZone .secSub .subTitle {
    display: none;
  }
}

.pointsZone .txtCatch {
  font-weight: bold;
  font-size: 2rem;
  color: #007e77;
}

.pointsZone .txtCatch.red {
  color: #f1000d;
}

.pointsZone .txtCatch em {
  font-size: 1.4rem;
  display: block;
  margin-bottom: 5px;
}

.pointsZone .txt1 {
  font-size: 1.6rem;
  padding-top: 15px;
  line-height: 1.8;
  color: #000;
}

.pointsZone .txt2 {
  font-size: 1.4rem;
  padding-top: 15px;
  line-height: 1.6;
  color: #000;
}

.pointsZone .bgs {
  position: absolute;
}

.pointsZone .bgs img {
  width: 47vw;
}

@media screen and (max-width: 767px) {
  .pointsZone .bgs img {
    width: 85vw;
  }
}

.pointsZone .bgs.bgTL {
  left: 0px;
  top: 0px;
}

.pointsZone .bgs.bgTR {
  right: 0px;
  top: 0px;
}

.pointsZone .bgs.bgBR {
  right: 0px;
  bottom: 0px;
}

.pointsZone .sec1 .secMain .txts {
  position: absolute;
  left: 50%;
  margin-left: -520px;
  top: 142px;
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secMain .txts {
    position: static;
    margin-left: 0px;
  }
}

.pointsZone .sec1 .secMain .txts h2 {
  width: 365px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secMain .txts h2 {
    width: 87.94872vw;
  }
}

.pointsZone .sec1 .secMain .txts .txtIn {
  width: 281px;
  padding-left: 20px;
  padding-top: 90px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secMain .txts .txtIn {
    width: auto;
    padding: 10.25641vw 5.12821vw;
  }
}

.pointsZone .sec1 .secMain .txts .txtIn .txt1 {
  padding-bottom: 40px;
}

.pointsZone .sec1 .secMain .mainPhoto {
  text-align: right;
}

@media screen and (min-width: 1900px) {
  .pointsZone .sec1 .secMain .mainPhoto {
    overflow: hidden;
    margin-right: 5%;
  }
  .pointsZone .sec1 .secMain .mainPhoto img {
    border-radius: 20px;
  }
}

@media screen and (max-width: 1560px) {
  .pointsZone .sec1 .secMain .mainPhoto {
    margin-right: -100px;
  }
}

@media screen and (max-width: 1280px) {
  .pointsZone .sec1 .secMain .mainPhoto {
    margin-right: -200px;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secMain .mainPhoto {
    margin-right: 0px;
  }
  .pointsZone .sec1 .secMain .mainPhoto img {
    margin-top: 0px;
  }
}

.pointsZone .sec1 .secMain .mainPhoto img {
  width: 962px;
  margin-top: 45px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secMain .mainPhoto img {
    width: 94.87179vw;
  }
}

.pointsZone .sec1 .secSub {
  margin-top: 100px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub {
    margin-top: 0px;
  }
}

.pointsZone .sec1 .secSub .txtCatch {
  position: relative;
  z-index: 3;
}

.pointsZone .sec1 .secSub .subTitle {
  top: 100px;
}

.pointsZone .sec1 .secSub .new {
  width: 50px;
  position: absolute;
  left: -60px;
  top: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .new {
    width: 12.82051vw;
    height: 12.82051vw;
    left: auto;
    right: 9vw;
  }
}

.pointsZone .sec1 .secSub .in .img1 {
  width: 412px;
  margin: 0 auto;
  position: relative;
  left: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .img1 {
    width: 74.35897vw;
    position: static;
    margin: 7.69231vw 0 7.69231vw auto;
  }
}

.pointsZone .sec1 .secSub .in .img1 span {
  font-size: 1rem;
  position: absolute;
  right: 65px;
  bottom: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .img1 span {
    position: static;
    display: block;
    text-align: right;
  }
}

.pointsZone .sec1 .secSub .in .cap1 {
  left: 740px;
  top: 0px;
}

.pointsZone .sec1 .secSub .in .img2 {
  width: 270px;
  position: absolute;
  left: 0px;
  bottom: 31px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .img2 {
    position: static;
    width: 69.23077vw;
    margin: 3.84615vw auto 7.69231vw;
  }
}

.pointsZone .sec1 .secSub .in .cap2 {
  left: 0px;
  top: 85px;
  width: 270px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .cap2 {
    width: auto;
  }
}

.pointsZone .sec1 .secSub .in .img3 {
  width: 260px;
  position: absolute;
  right: 0px;
  bottom: -50px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .img3 {
    position: static;
    width: 100vw;
    margin-top: 8.97436vw;
    margin-left: -5.12821vw;
  }
}

.pointsZone .sec1 .secSub .in .cap3 {
  left: 740px;
  top: 236px;
  width: 270px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec1 .secSub .in .cap3 {
    position: static;
    width: auto;
  }
}

.pointsZone .sec2 .bgs {
  bottom: -40px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .bgs {
    bottom: auto;
    top: 120vw;
  }
}

.pointsZone .sec2 .mainPhoto {
  text-align: left;
  padding-top: 45px;
}

@media screen and (min-width: 1900px) {
  .pointsZone .sec2 .mainPhoto {
    overflow: hidden;
    margin-left: 5%;
  }
  .pointsZone .sec2 .mainPhoto img {
    border-radius: 20px;
  }
}

@media screen and (max-width: 1560px) {
  .pointsZone .sec2 .mainPhoto {
    margin-left: -100px;
  }
}

@media screen and (max-width: 1280px) {
  .pointsZone .sec2 .mainPhoto {
    margin-left: -180px;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .mainPhoto {
    padding-top: 27vw;
    margin-left: -5.12821vw;
  }
}

.pointsZone .sec2 .mainPhoto img {
  width: 962px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .mainPhoto img {
    width: 100%;
  }
}

.pointsZone .sec2 .secMain .txts {
  position: absolute;
  left: 54%;
  top: 142px;
  z-index: 2;
}

@media screen and (max-width: 1560px) {
  .pointsZone .sec2 .secMain .txts {
    left: 56%;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secMain .txts {
    position: static;
  }
}

.pointsZone .sec2 .secMain .txts h2 {
  width: 453px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secMain .txts h2 {
    width: 89.74359vw;
  }
}

.pointsZone .sec2 .secMain .txts .img1 {
  position: absolute;
  width: 234px;
  left: -30px;
  top: 260px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secMain .txts .img1 {
    width: 48.20513vw;
    left: auto;
    right: 4vw;
    top: 100vw;
  }
}

.pointsZone .sec2 .secMain .txts .img2 {
  position: absolute;
  width: 93px;
  right: 15px;
  top: 235px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secMain .txts .img2 {
    width: 23.84615vw;
    right: 5.12821vw;
    top: 60.25641vw;
  }
}

.pointsZone .sec2 .secMain .txts .txtIn {
  z-index: 3;
  position: absolute;
  right: 20px;
  width: 209px;
  top: 310px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secMain .txts .txtIn {
    position: static;
    margin: 10.25641vw 5.12821vw;
    width: auto;
  }
}

.pointsZone .sec2 .secSub {
  margin-top: 100px;
  background-image: url(../img/points/s2_nami.svg);
  background-repeat: no-repeat;
  background-position: center 95%;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub {
    margin-top: 10.25641vw;
    background-position: center 120vw;
  }
}

.pointsZone .sec2 .secSub .subTitle {
  top: 190px;
}

.pointsZone .sec2 .secSub .notes {
  display: block;
  padding-top: 25px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub .notes {
    text-align: left;
  }
}

.pointsZone .sec2 .secSub h3 {
  font-size: 2rem;
  color: #007e77;
  font-weight: bold;
  text-align: center;
}

.pointsZone .sec2 .secSub h3 em {
  font-size: 3rem;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub h3 em {
    display: block;
  }
}

.pointsZone .sec2 .secSub .img1 {
  width: 509px;
  margin: 40px auto 0 auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub .img1 {
    width: 62.5641vw;
    margin: 8.20513vw auto 0 auto;
  }
}

.pointsZone .sec2 .secSub .cap {
  width: 260px;
  position: absolute;
  top: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub .cap {
    position: static;
    width: auto;
    margin-top: 11.53846vw;
  }
}

.pointsZone .sec2 .secSub .cap .img2 {
  width: 150px;
  margin: 0 auto 20px auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub .cap .img2 {
    width: 30.76923vw;
    float: right;
    margin-left: 3vw;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec2 .secSub .cap .tBox .txtCatch {
    position: relative;
    white-space: nowrap;
  }
}

.pointsZone .sec2 .secSub .cap.cap1 {
  left: 40px;
}

.pointsZone .sec2 .secSub .cap.cap2 {
  left: 700px;
}

.pointsZone .sec3 {
  margin-bottom: 30px;
}

.pointsZone .sec3 .mainPhoto {
  width: 560px;
  margin: 0px auto 0 auto;
  position: relative;
  z-index: 3;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .mainPhoto {
    width: 84.61538vw;
  }
}

.pointsZone .sec3 .mainPhoto img {
  margin-top: 45px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .mainPhoto img {
    margin-top: -20vw;
  }
}

.pointsZone .sec3 .secMain h2 {
  width: 425px;
  left: 50%;
  position: absolute;
  margin-left: -495px;
  z-index: 4;
  margin-top: 100px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secMain h2 {
    width: 73.33333vw;
    left: 0px;
    position: relative;
    margin: 0px;
  }
}

.pointsZone .sec3 .secMain .txtIn {
  position: absolute;
  width: 200px;
  left: 50%;
  margin-left: 330px;
  top: 45px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secMain .txtIn {
    position: static;
    margin: 0px;
    padding: 10.25641vw 5.12821vw 0vw 5.12821vw;
    display: flex;
    flex-direction: row-reverse;
  }
}

.pointsZone .sec3 .secMain .txtIn .img1 {
  width: 121px;
  margin: 0 auto 55px auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secMain .txtIn .img1 {
    width: 24.35897vw;
    flex-shrink: 0;
    margin-left: 4.87179vw;
    position: static;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secMain .txtIn {
    width: auto;
    position: static;
  }
}

.pointsZone .sec3 .secSub {
  margin-top: 100px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub {
    margin-top: 0px;
    padding-top: 0px;
  }
}

.pointsZone .sec3 .secSub .subTitle {
  top: 70px;
}

.pointsZone .sec3 .secSub .bgBL {
  bottom: -30px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .bgBL {
    left: 0px;
    width: 50vw;
  }
  .pointsZone .sec3 .secSub .bgBL img {
    width: 100%;
  }
}

.pointsZone .sec3 .secSub .in {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in {
    display: block;
  }
}

.pointsZone .sec3 .secSub .in .txt2 {
  padding-top: 10px;
}

.pointsZone .sec3 .secSub .in .col1 {
  width: 480px;
  border: 1px solid #007e77;
  border-radius: 40px;
  box-sizing: border-box;
  padding: 40px 40px 30px 40px;
  background-color: #fff;
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 {
    width: auto;
    padding: 5.12821vw 5.12821vw 3.84615vw 5.12821vw;
    margin-bottom: 5.12821vw;
  }
}

.pointsZone .sec3 .secSub .in .col1 .txtCatch {
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .txtCatch {
    font-size: 1.9rem;
    text-align: center;
  }
  .pointsZone .sec3 .secSub .in .col1 .txtCatch .spSpace {
    display: inline-block;
    width: 9vw;
  }
}

.pointsZone .sec3 .secSub .in .col1 .txtCatch em {
  margin-bottom: 2px;
}

.pointsZone .sec3 .secSub .in .col1 .tokkyo {
  display: inline-block;
  width: 40px;
  vertical-align: top;
  position: relative;
  top: -5px;
  left: 10px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .tokkyo {
    position: absolute;
    right: -5px;
    top: 5vw;
    left: auto;
  }
}

.pointsZone .sec3 .secSub .in .col1 .img1 {
  text-align: center;
  margin: 10px auto 0 auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .img1 {
    margin-top: 3.84615vw;
  }
}

.pointsZone .sec3 .secSub .in .col1 .img1 img {
  width: 247px;
  margin-right: 15px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .img1 img {
    width: 63.07692vw;
    margin: 0 auto;
  }
}

.pointsZone .sec3 .secSub .in .col1 .img1 .notes {
  text-align: right;
  display: block;
}

.pointsZone .sec3 .secSub .in .col1 .new {
  width: 50px;
  position: absolute;
  right: 56px;
  top: -4px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .new {
    right: auto;
    left: -8vw;
    top: -8vw;
  }
}

.pointsZone .sec3 .secSub .in .col1 .cols {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .cols {
    display: block;
    position: relative;
  }
}

.pointsZone .sec3 .secSub .in .col1 .cols .arrow {
  margin-top: 13px;
}

.pointsZone .sec3 .secSub .in .col1 .cols .col {
  width: 180px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .cols .col {
    width: 100%;
    flex-direction: row;
    margin-top: 5.12821vw;
  }
  .pointsZone .sec3 .secSub .in .col1 .cols .col .txt2 {
    padding-top: 0px;
  }
}

.pointsZone .sec3 .secSub .in .col1 .cols .col .img {
  width: 160px;
  margin: 25px auto 0 auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec3 .secSub .in .col1 .cols .col .img {
    width: 31.28205vw;
    flex-shrink: 0;
    margin: 0 0 0 2.82051vw;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .bgTR {
    width: 50vw;
  }
  .pointsZone .sec4 .bgTR img {
    width: 100%;
  }
}

.pointsZone .sec4 .mainPhoto {
  text-align: right;
  padding-top: 125px;
  position: relative;
  max-width: 1366px;
}

@media screen and (min-width: 1366px) {
  .pointsZone .sec4 .mainPhoto {
    margin: 0 auto;
  }
  .pointsZone .sec4 .mainPhoto img {
    border-radius: 20px;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .mainPhoto {
    padding-top: 0px;
    margin-top: 10.25641vw;
  }
}

.pointsZone .sec4 .mainPhoto img {
  width: 720px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .mainPhoto img {
    width: 94.87179vw;
  }
}

.pointsZone .sec4 .txtCatch {
  position: relative;
}

.pointsZone .sec4 .txtCatch.new:after {
  content: "";
  display: inline-block;
  width: 50px;
  height: 50px;
  background-image: url(../img/points/new.svg);
  position: absolute;
  right: -30px;
  top: 0px;
}

.pointsZone .sec4 .txtCatch.new.new2:after {
  width: 30px;
  height: 30px;
  background-size: 100%;
  right: 67px;
  top: 27px;
}

.pointsZone .sec4 .secMain .txts {
  position: absolute;
  left: 50%;
  margin-left: -520px;
  top: 123px;
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secMain .txts {
    position: static;
    margin-left: 0px;
    width: 84.61538vw;
  }
}

.pointsZone .sec4 .secMain .txts h2 {
  width: 365px;
  position: relative;
  left: 10px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secMain .txts h2 {
    left: 0;
    margin-left: 2.5641vw;
    width: 82.05128vw;
  }
}

.pointsZone .sec4 .secMain .txts .txtIn {
  width: 275px;
  padding-left: 20px;
  padding-top: 110px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secMain .txts .txtIn {
    width: auto;
    padding-top: 8.97436vw;
    padding-left: 5.12821vw;
  }
  .pointsZone .sec4 .secMain .txts .txtIn .txtCatch.new:after {
    right: 5vw;
  }
}

.pointsZone .sec4 .secMain .txts .txtIn .img1 {
  position: absolute;
  left: 270px;
  bottom: -10px;
  width: 283px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secMain .txts .txtIn .img1 {
    position: static;
    width: 80vw;
    margin-top: -14vw;
  }
}

.pointsZone .sec4 .secSub {
  margin-top: 100px;
  background-color: #e5f2f1;
  padding-bottom: 35px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secSub {
    margin-top: 15.38462vw;
    padding-bottom: 5vw;
  }
}

.pointsZone .sec4 .secSub .subTitle {
  top: 70px;
}

.pointsZone .sec4 .secSub .in {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secSub .in {
    flex-direction: column;
  }
}

.pointsZone .sec4 .secSub .in .txt {
  padding: 70px 0 0 50px;
  box-sizing: border-box;
  width: 413px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secSub .in .txt {
    width: auto;
    padding: 0;
  }
}

.pointsZone .sec4 .secSub .in .txt .txtCatch {
  position: relative;
  display: inline-block;
}

.pointsZone .sec4 .secSub .in .txt .txtCatch em {
  font-size: 1.6rem;
}

.pointsZone .sec4 .secSub .in .txt .img1 {
  width: 183px;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secSub .in .txt .img1 {
    width: 25.64103vw;
    position: absolute;
    right: 0vw;
    top: 15vw;
  }
}

.pointsZone .sec4 .secSub .in .img2 {
  width: 570px;
  padding-top: 40px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec4 .secSub .in .img2 {
    width: 103%;
    padding-top: 10.25641vw;
  }
}

.pointsZone .sec4 .secSub .in .img2 .notes {
  display: block;
  text-align: right;
  padding: 27px 111px 0 0;
}

.pointsZone .sec5 .mainPhoto {
  text-align: left;
  padding-top: 30px;
  max-width: 1366px;
}

@media screen and (min-width: 1366px) {
  .pointsZone .sec5 .mainPhoto {
    margin: 0 auto;
  }
  .pointsZone .sec5 .mainPhoto img {
    border-radius: 20px;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .mainPhoto {
    padding-top: 10.25641vw;
    margin-left: -6.41026vw;
  }
}

.pointsZone .sec5 .mainPhoto img {
  width: 680px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .mainPhoto img {
    width: 94.87179vw;
  }
}

.pointsZone .sec5 .secMain {
  max-width: 1366px;
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .pointsZone .sec5 .secMain .mainPhoto img {
    position: relative;
    margin-left: -50px;
  }
}

@media screen and (max-width: 1280px) and (max-width: 767px) {
  .pointsZone .sec5 .secMain .mainPhoto img {
    margin-left: 0px;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain {
    padding-top: 5.12821vw;
  }
}

.pointsZone .sec5 .secMain .txts {
  position: absolute;
  left: 60%;
  top: 30px;
  z-index: 2;
}

@media screen and (max-width: 1024px) {
  .pointsZone .sec5 .secMain .txts {
    left: 57%;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts {
    width: auto;
    position: static;
  }
}

.pointsZone .sec5 .secMain .txts h2 {
  width: 412px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts h2 {
    width: 80.51282vw;
    margin-left: 5.12821vw;
  }
}

.pointsZone .sec5 .secMain .txts .imgs {
  position: absolute;
  width: 160px;
  right: -60px;
  bottom: 0px;
  text-align: center;
  transition-delay: 0.5s;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts .imgs {
    position: static;
    display: flex;
    justify-content: space-between;
    width: 80vw;
    margin: 0 auto;
  }
  .pointsZone .sec5 .secMain .txts .imgs .img1 {
    width: 48%;
  }
}

.pointsZone .sec5 .secMain .txts .imgs .notes {
  font-size: 1rem;
  display: block;
  color: #000;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts .imgs .notes {
    margin-top: 1em;
  }
}

.pointsZone .sec5 .secMain .txts .imgs img {
  width: 129px;
}

.pointsZone .sec5 .secMain .txts .imgs .img1 {
  margin-bottom: 10px;
  position: relative;
}

.pointsZone .sec5 .secMain .txts .imgs .img1 .new img {
  position: absolute;
  width: 50px;
  height: 50px;
  left: -27px;
  top: 0px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts .imgs .img1 .new img {
    left: 0px;
  }
}

.pointsZone .sec5 .secMain .txts .txtIn {
  margin-top: 60px;
  width: 260px;
  margin-left: 10px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts .txtIn {
    width: auto;
    margin: 0px;
    padding: 7.69231vw 5.12821vw;
  }
}

.pointsZone .sec5 .secMain .txts .txtIn .txt1 {
  line-height: 1.95;
}

.pointsZone .sec5 .secMain .txts .btn {
  text-align: left;
  padding-top: 25px;
}

.pointsZone .sec5 .secMain .txts .btn .c-btn1.arrow {
  box-sizing: border-box;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secMain .txts .btn .c-btn1.arrow {
    margin: 0 auto;
  }
}

.pointsZone .sec5 .secSub {
  margin-top: 100px;
  padding-bottom: 1px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub {
    margin-top: 2.5641vw;
  }
}

.pointsZone .sec5 .secSub .subTitle2 {
  width: 226px;
  margin: 0 auto 20px auto;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .subTitle2 {
    width: 57.94872vw;
    margin-bottom: 10.25641vw;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .wayImg {
    width: 79.48718vw;
    margin: 0 auto;
  }
}

.pointsZone .sec5 .secSub .icons {
  width: 1000px;
  margin: 45px auto 0 auto;
}

.pointsZone .sec5 .secSub .icons .btn {
  padding: 45px 0 0 0;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons .btn {
    width: 60vw;
    margin: 0 auto;
  }
  .pointsZone .sec5 .secSub .icons .btn a {
    width: 100%;
    box-sizing: border-box;
  }
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons {
    width: 100%;
  }
}

.pointsZone .sec5 .secSub .icons ul {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul {
    display: block;
  }
}

.pointsZone .sec5 .secSub .icons ul li {
  width: 180px;
  position: relative;
  top: 30px;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul li {
    width: 100vw;
    margin-left: -5.3vw;
    background-image: url("../img/points/s5_ph01.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: left top;
    box-sizing: border-box;
    height: 86vw;
    position: relative;
  }
  .pointsZone .sec5 .secSub .icons ul li .img {
    position: absolute;
    right: 5vw;
    top: 52vw;
    width: 28.20513vw;
    height: 28.20513vw;
  }
  .pointsZone .sec5 .secSub .icons ul li .img.ev {
    right: auto;
    left: 5vw;
  }
  .pointsZone .sec5 .secSub .icons ul li p {
    position: absolute;
    left: 5.12821vw;
    top: 59vw;
    width: 50vw;
    line-height: 1.7;
  }
  .pointsZone .sec5 .secSub .icons ul li p.ev {
    left: auto;
    text-align: right;
    right: 5.12821vw;
  }
}

.pointsZone .sec5 .secSub .icons ul li:nth-of-type(2) {
  transition-delay: 0.1s;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul li:nth-of-type(2) {
    background-image: url("../img/points/s5_ph02.jpg");
  }
}

.pointsZone .sec5 .secSub .icons ul li:nth-of-type(3) {
  transition-delay: 0.2s;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul li:nth-of-type(3) {
    background-image: url("../img/points/s5_ph03.jpg");
  }
}

.pointsZone .sec5 .secSub .icons ul li:nth-of-type(4) {
  transition-delay: 0.3s;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul li:nth-of-type(4) {
    background-image: url("../img/points/s5_ph04.jpg");
    height: 92vw;
  }
}

.pointsZone .sec5 .secSub .icons ul li:nth-of-type(5) {
  transition-delay: 0.4s;
}

@media screen and (max-width: 767px) {
  .pointsZone .sec5 .secSub .icons ul li:nth-of-type(5) {
    background-image: url("../img/points/s5_ph05.jpg");
  }
  .pointsZone .sec5 .secSub .icons ul li:nth-of-type(5) p {
    width: 70vw;
  }
}

.pointsZone .sec5 .secSub .icons ul li.show-anime {
  top: 0;
}

.pointsZone .sec5 .secSub .icons ul .img {
  width: 150px;
  margin: 0 auto 34px auto;
}

.pointsZone .sec5 .secSub .icons ul p {
  font-size: 1.4rem;
  color: #000;
}

.easybeltZone:before {
  content: "";
  display: block;
  background: url("../img/easybelt/main_img.jpg") center top no-repeat;
  background-size: cover;
}

@media screen and (min-width: 768px) {
  .easybeltZone:before {
    background-attachment: fixed;
    height: 38.79941vw;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone:before {
    background-image: url("../img/easybelt/main_img_sp.png");
    height: 56.41026vw;
  }
}

.easybeltZone figure {
  margin: 0;
}

.easybeltZone ul {
  list-style: none;
}

.easybeltZone .spSlick {
  padding: 0vw 0 7.69231vw;
  width: 100%;
  overflow: hidden;
}

.easybeltZone .spSlick .slick-arrow.slick-disabled {
  opacity: 0;
}

.easybeltZone .spSlick .slick-prev {
  position: absolute;
  width: 25.89744vw;
  height: 14.87179vw;
  transform: rotate(-180deg);
  text-indent: -9999px;
  background: url("../img/easybelt/main_step_arw_r.svg") 0 0 no-repeat;
  left: 10vw;
  top: 46vw;
  z-index: 5;
}

.easybeltZone .spSlick .slick-next {
  position: absolute;
  width: 25.89744vw;
  height: 14.87179vw;
  text-indent: -9999px;
  background: url("../img/easybelt/main_step_arw_r.svg") 0 0 no-repeat;
  right: 10vw;
  top: 46vw;
  z-index: 5;
}

.easybeltZone .spSlick li {
  width: 58.97436vw;
  color: #000000;
  outline: 0px;
  opacity: .3;
}

.easybeltZone .spSlick li.slick-current {
  opacity: 1;
}

.easybeltZone .spSlick li dl {
  position: relative;
  width: 47.17949vw;
  margin: 0 auto;
}

.easybeltZone .spSlick li dt {
  padding-top: 12.82051vw;
}

.easybeltZone .spSlick li dt:after {
  content: "";
  display: inline-block;
  width: 15.38462vw;
  height: 15.38462vw;
  background: url("../img/easybelt/main_step_img01_txt.svg") 0 0 no-repeat;
  background-size: 100%;
  position: absolute;
  bottom: 12vw;
  left: 0;
}

.easybeltZone .spSlick li dd {
  padding-top: 5.12821vw;
}

.easybeltZone .spSlick li.s2 dt:after {
  background: url("../img/easybelt/main_step_img02_txt.svg") 0 0 no-repeat;
  left: -3vw;
  bottom: auto;
  top: 7vw;
  width: 16.92308vw;
  height: 9.74359vw;
  background-size: contain;
  transform: rotate(-40deg);
}

.easybeltZone .spSlick li.s2 dd {
  width: 17.94872vw;
  margin: 0 auto;
}

.easybeltZone .spSlick li.s3 dt:after {
  background: url("../img/easybelt/main_step_img03_txt.svg") 0 0 no-repeat;
  background-size: 100%;
  left: auto;
  right: 0px;
}

.easybeltZone .secMain {
  text-align: center;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain {
    padding: 100px 50px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain {
    padding: 14.61538vw 0 15.64103vw;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .u-inner:not(.spPd0) {
    padding-left: 5.12821vw;
    padding-right: 5.12821vw;
  }
}

.easybeltZone .secMain h2 {
  position: relative;
  top: 30px;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 {
    margin-bottom: 7.94872vw;
  }
}

.easybeltZone .secMain h2 figure {
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 figure {
    width: 521px;
    margin-bottom: 32px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 figure {
    width: 79.48718vw;
    margin-bottom: 4.10256vw;
  }
}

.easybeltZone .secMain h2 strong {
  display: block;
}

.easybeltZone .secMain h2 strong span {
  font-weight: bold;
  position: relative;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span {
    display: inline-block;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span {
    display: block;
  }
}

.easybeltZone .secMain h2 strong span:before, .easybeltZone .secMain h2 strong span:after {
  content: "";
  display: block;
  background: url("../img/easybelt/main_ttl_deco01.png") 0 0 no-repeat;
  background-size: 100% 100%;
  position: absolute;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span:before, .easybeltZone .secMain h2 strong span:after {
    width: 178px;
    height: 86px;
    top: -30px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span:before, .easybeltZone .secMain h2 strong span:after {
    width: 20.51282vw;
    height: 9.9359vw;
    top: 6.15385vw;
  }
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span:before {
    left: -187px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span:before {
    left: 0.25641vw;
  }
}

.easybeltZone .secMain h2 strong span:after {
  transform: scale(-1, 1);
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span:after {
    right: -179px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span:after {
    right: 0.25641vw;
  }
}

.easybeltZone .secMain h2 strong span small {
  display: block;
  color: #000;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span small {
    font-size: 16px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span small {
    font-size: 3.07692vw;
    line-height: 1.66667;
  }
}

.easybeltZone .secMain h2 strong span em {
  display: block;
  color: #007E77;
  font-weight: inherit;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain h2 strong span em {
    font-size: 24px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain h2 strong span em {
    font-size: 4.61538vw;
  }
}

.easybeltZone .secMain h2.show-anime {
  top: 0;
}

.easybeltZone .secMain .lead {
  line-height: 1.71429;
  position: relative;
  top: 30px;
  transition-delay: 0.1s;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .lead {
    margin-bottom: 70px;
    font-size: 14px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .lead {
    margin-bottom: 0.25641vw;
    font-size: 3.58974vw;
  }
}

.easybeltZone .secMain .lead.show-anime {
  top: 0;
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .spScrlXWrap {
    margin-bottom: 5.38462vw;
    position: relative;
    overflow: hidden;
  }
  .easybeltZone .secMain .spScrlXWrap:after {
    content: "";
    display: block;
    background: url("../img/easybelt/main_step_grad_r.png") 0 0 no-repeat;
    background-size: 100% 100%;
    width: 32.82051vw;
    height: 82.69231vw;
    position: absolute;
    top: -5.12821vw;
    right: -4.61538vw;
    transition: 0.3s;
  }
  .easybeltZone .secMain .spScrlXWrap.on:after {
    opacity: 0;
    visibility: hidden;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .spScrlX {
    overflow-x: scroll;
  }
}

.easybeltZone .secMain .step {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step {
    margin-bottom: 35px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step {
    width: 156.92308vw;
    padding: 12.82051vw 24.10256vw 3.84615vw;
    box-sizing: content-box;
  }
}

.easybeltZone .secMain .step > li {
  position: relative;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li {
    width: 200px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li {
    width: 47.17949vw;
    padding-left: 2.5641vw;
    padding-right: 2.5641vw;
    box-sizing: content-box;
  }
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li + li {
    margin-left: 65px;
  }
}

.easybeltZone .secMain .step > li + li:before {
  content: "";
  display: block;
  background: url("../img/easybelt/main_step_arw_r.svg") 0 0 no-repeat;
  position: absolute;
  z-index: 1;
  opacity: 0;
  transition: 0.5s;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li + li:before {
    width: 99px;
    height: 50px;
    top: 116px;
    left: -120px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li + li:before {
    background-size: 100% 100%;
    width: 26.15385vw;
    height: 13.33333vw;
    top: 36.66667vw;
    left: -25.64103vw;
  }
}

.easybeltZone .secMain .step > li dl {
  position: relative;
  top: 30px;
  opacity: 0;
  transition: 0.5s;
}

.easybeltZone .secMain .step > li dt {
  position: relative;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li dt {
    margin-bottom: 9px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li dt {
    margin-bottom: 5.38462vw;
  }
}

.easybeltZone .secMain .step > li dt:after {
  content: "";
  position: absolute;
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li dt:after {
    background-size: contain !important;
  }
}

.easybeltZone .secMain .step > li dt img {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li dd {
    font-size: 14px;
    line-height: 1.71429;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li dd {
    font-size: 3.07692vw;
    line-height: 1.66667;
  }
}

.easybeltZone .secMain .step > li:nth-child(1) dt:after {
  background: url("../img/easybelt/main_step_img01_txt.svg") 0 0 no-repeat;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li:nth-child(1) dt:after {
    width: 60px;
    height: 60px;
    top: 141px;
    left: -20px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li:nth-child(1) dt:after {
    width: 15.38462vw;
    height: 15.38462vw;
    top: 35.64103vw;
    left: 0vw;
  }
}

.easybeltZone .secMain .step > li:nth-child(2):before {
  transition-delay: 0.1s;
}

.easybeltZone .secMain .step > li:nth-child(2) dl {
  transition-delay: 0.2s;
}

.easybeltZone .secMain .step > li:nth-child(2) dt:after {
  background: url("../img/easybelt/main_step_img02_txt.svg") 0 0 no-repeat;
  transform: rotate(-30deg);
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li:nth-child(2) dt:after {
    width: 67px;
    height: 39px;
    top: -22px;
    left: -12px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li:nth-child(2) dt:after {
    width: 17.17949vw;
    height: 10vw;
    top: -8.46154vw;
    left: 0.30769vw;
  }
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li:nth-child(2) dd {
    padding-top: 3px;
  }
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li:nth-child(2) dd img {
    width: 77px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li:nth-child(2) dd img {
    width: 17.4359vw;
  }
}

.easybeltZone .secMain .step > li:nth-child(3):before {
  transition-delay: 0.3s;
}

.easybeltZone .secMain .step > li:nth-child(3) dl {
  transition-delay: 0.4s;
}

.easybeltZone .secMain .step > li:nth-child(3) dt:after {
  background: url("../img/easybelt/main_step_img03_txt.svg") 0 0 no-repeat;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step > li:nth-child(3) dt:after {
    width: 60px;
    height: 60px;
    top: 141px;
    right: -21px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step > li:nth-child(3) dt:after {
    width: 15.38462vw;
    height: 15.38462vw;
    top: 35.64103vw;
    right: 0vw;
  }
}

.easybeltZone .secMain .step.show-anime > li + li:before {
  opacity: 1;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .step.show-anime > li + li:before {
    left: -82px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secMain .step.show-anime > li + li:before {
    left: -17.17949vw;
  }
}

.easybeltZone .secMain .step.show-anime > li dl {
  top: 0;
  opacity: 1;
}

.easybeltZone .secMain .movBox {
  margin: auto;
  position: relative;
  top: 30px;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secMain .movBox {
    max-width: 771px;
  }
}

.easybeltZone .secMain .movBox:before {
  content: "";
  display: block;
  padding-top: 56.29053%;
}

.easybeltZone .secMain .movBox iframe {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.easybeltZone .secMain .movBox.show-anime {
  top: 0;
  opacity: 1;
}

.easybeltZone .secFeature {
  background-color: rgba(0, 126, 119, 0.1);
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature {
    padding: 80px 50px 75px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature {
    padding: 10.76923vw 0 9.74359vw;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature .u-inner {
    padding-left: 10.25641vw;
    padding-right: 10.25641vw;
  }
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
  }
}

.easybeltZone .secFeature ul li {
  position: relative;
  top: 30px;
  opacity: 0;
  transition: 0.5s;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li {
    width: 31.4%;
    margin-right: 2.9%;
  }
  .easybeltZone .secFeature ul li:nth-child(3n) {
    margin-right: 0;
  }
  .easybeltZone .secFeature ul li:nth-child(n + 4) {
    margin-top: 3.5%;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li + li {
    margin-top: 8.97436vw;
  }
}

.easybeltZone .secFeature ul li figure {
  position: relative;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li figure {
    margin-bottom: 7px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li figure {
    margin-bottom: 3.33333vw;
  }
}

.easybeltZone .secFeature ul li figure img {
  width: 100%;
}

.easybeltZone .secFeature ul li figure.new:before {
  content: "";
  display: block;
  background: url("../img/easybelt/feature_icn_new.svg") 0 0 no-repeat;
  position: absolute;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li figure.new:before {
    width: 50px;
    height: 50px;
    top: 10px;
    left: 10px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li figure.new:before {
    background-size: contain;
    width: 12.82051vw;
    height: 12.82051vw;
    top: 2.5641vw;
    left: 2.5641vw;
  }
}

.easybeltZone .secFeature ul li h3 {
  color: #007E77;
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li h3 {
    margin-bottom: 13px;
    font-size: 18px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li h3 {
    margin-bottom: 3.33333vw;
    font-size: 4.61538vw;
  }
}

.easybeltZone .secFeature ul li p {
  line-height: 1.57143;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li p {
    font-size: 14px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li p {
    font-size: 3.58974vw;
  }
}

.easybeltZone .secFeature ul li p sup {
  font-size: 0.57143em;
}

.easybeltZone .secFeature ul li p small {
  display: block;
  line-height: 1.5;
}

@media screen and (min-width: 768px) {
  .easybeltZone .secFeature ul li p small {
    font-size: 10px;
  }
}

@media screen and (max-width: 767px) {
  .easybeltZone .secFeature ul li p small {
    margin-top: 1.53846vw;
    font-size: 2.5641vw;
  }
}

.easybeltZone .secFeature ul li:nth-child(2) {
  transition-delay: 0.1s;
}

.easybeltZone .secFeature ul li:nth-child(3) {
  transition-delay: 0.2s;
}

.easybeltZone .secFeature ul li:nth-child(4) {
  transition-delay: 0.3s;
}

.easybeltZone .secFeature ul li:nth-child(5) {
  transition-delay: 0.4s;
}

.easybeltZone .secFeature ul li:nth-child(6) {
  transition-delay: 0.5s;
}

.easybeltZone .secFeature ul.show-anime > li {
  top: 0;
  opacity: 1;
}

.specZone {
  padding-bottom: 80px;
}

.specZone .inner {
  width: 1000px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .specZone .inner {
    width: 100%;
  }
}

.specZone .inner .partCont {
  padding: 70px 0 60px;
  color: #1A1311;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont {
    padding: 15.38462vw 0 12.82051vw;
    width: 89.74359vw;
    margin: 0 auto;
  }
}

.specZone .inner .partCont.acc {
  padding-bottom: 0px;
}

.specZone .inner .partCont h2 {
  position: relative;
  top: 30px;
  text-align: center;
  font-size: 45px;
  color: #007e77;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont h2 {
    margin-bottom: 5.12821vw;
  }
}

.specZone .inner .partCont h2 .sub {
  display: block;
  font-size: 20px;
  font-weight: bold;
  color: #000;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont h2 .sub {
    font-size: 1.8rem;
    letter-spacing: 2px;
  }
}

.specZone .inner .partCont h2.show-anime {
  top: 0;
}

.specZone .inner .partCont .colorCar {
  display: flex;
  justify-content: space-between;
  padding: 0 110px;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .colorCar {
    padding: 0px;
    display: block;
  }
}

.specZone .inner .partCont .colorCar .colorDiv {
  width: 50%;
  text-align: center;
  transition-delay: 0.3s;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .colorCar .colorDiv {
    width: 100%;
    margin: 0 auto;
  }
  .specZone .inner .partCont .colorCar .colorDiv + .colorDiv {
    margin-top: 10.25641vw;
  }
}

.specZone .inner .partCont .colorCar .colorDiv .cName {
  margin: 0 0 16px;
}

.specZone .inner .partCont .colorCar .colorDiv .cName figcaption {
  padding-top: 10px;
  font-size: 1.2rem;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup {
  position: relative;
  display: flex;
  justify-content: center;
  width: 270px;
  margin: 0 auto 40px;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img {
  width: 70px;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img img {
  width: 50px;
  margin-bottom: 10px;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img figure {
  position: relative;
  margin: 0;
  text-align: center;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img figure figcaption {
  font-size: 8px;
  color: #a48374;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:first-of-type, .specZone .inner .partCont .colorCar .colorDiv .cLineup .img:last-of-type {
  position: absolute;
  top: 0;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:first-of-type {
  left: 0;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:nth-child(2) figure {
  position: relative;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:nth-child(2) figure figcaption {
  position: absolute;
  left: -2em;
  width: 10em;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:last-of-type {
  right: 0;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:last-of-type figure {
  position: relative;
}

.specZone .inner .partCont .colorCar .colorDiv .cLineup .img:last-of-type figure figcaption {
  position: absolute;
  left: -3em;
  width: 13em;
}

.specZone .inner .partCont .colorCar .colorDiv .carImg {
  padding-top: 20px;
}

.specZone .inner .partCont .colorCar .colorDiv .carImg img {
  width: 188px;
}

.specZone .inner .partCont .VehicleType {
  position: relative;
  top: 30px;
  text-align: center;
  font-weight: bold;
  transition-delay: 0.3s;
  color: #1a1311;
}

.specZone .inner .partCont .VehicleType .logo {
  margin-bottom: 40px;
}

.specZone .inner .partCont .VehicleType .name {
  font-size: 18px;
}

.specZone .inner .partCont .VehicleType .price {
  font-size: 14px;
}

.specZone .inner .partCont .VehicleType.show-anime {
  top: 0;
}

.specZone .inner .partCont .systemCar {
  width: 560px;
  margin: 60px auto 0;
  display: flex;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .systemCar {
    width: auto;
    padding: 0px;
    margin-top: 9.48718vw;
  }
}

.specZone .inner .partCont .systemCar .systemDiv {
  width: 50%;
  text-align: center;
  transition-delay: 0.3s;
}

.specZone .inner .partCont .systemCar .systemDiv .img {
  margin-bottom: 50px;
}

.specZone .inner .partCont .systemCar .systemDiv .img img {
  width: 162px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .systemCar .systemDiv .img img {
    width: 41.53846vw;
  }
}

.specZone .inner .partCont .systemCar .systemDiv .name {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.3;
  height: 50px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .systemCar .systemDiv .name {
    height: auto;
  }
}

.specZone .inner .partCont .systemCar .systemDiv .name .sub {
  display: block;
  font-size: 14px;
  font-weight: 500;
}

.specZone .inner .partCont .systemCar .systemDiv .price {
  font-size: 14px;
  font-weight: bold;
}

.specZone .inner .partCont .accessoryCar {
  display: flex;
  margin-bottom: 100px;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .accessoryCar {
    width: auto;
    flex-wrap: wrap;
    margin-bottom: 20.51282vw;
  }
}

.specZone .inner .partCont .accessoryCar .accessoryDiv {
  text-align: center;
  width: 25%;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .accessoryCar .accessoryDiv {
    width: 50%;
    margin-bottom: 5vw;
  }
}

.specZone .inner .partCont .accessoryCar .accessoryDiv .img {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 244px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .accessoryCar .accessoryDiv .img {
    height: auto;
  }
}

.specZone .inner .partCont .accessoryCar .accessoryDiv .img img {
  width: 244px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .partCont .accessoryCar .accessoryDiv .img img {
    width: 41.53846vw;
  }
}

.specZone .inner .partCont .accessoryCar .accessoryDiv .name {
  margin-top: 15px;
  font-size: 18px;
  font-weight: bold;
}

.specZone .inner .partCont .accessoryCar .accessoryDiv .name .sub {
  display: block;
  font-size: 14px;
  font-weight: 500;
}

.specZone .inner .partCont .accessoryCar .accessoryDiv .price {
  margin-top: 5px;
  font-size: 14px;
  font-weight: bold;
}

.specZone .inner .partCont + .partCont {
  border-top: 2px dotted #126c64;
}

.specZone .inner .specTable table {
  width: 100%;
  border-collapse: collapse;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table {
    margin: 0 auto;
    width: 85.12821vw;
  }
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table tr {
    display: flex;
    flex-wrap: wrap;
  }
  .specZone .inner .specTable table tr:last-of-type {
    border-bottom: 1px solid #707070;
  }
}

.specZone .inner .specTable table th,
.specZone .inner .specTable table td {
  border: 1px solid #707070;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table th,
  .specZone .inner .specTable table td {
    border-bottom: 0px;
  }
}

.specZone .inner .specTable table th {
  width: 140px;
  font-size: 12px;
  font-weight: bold;
  padding: 25px 0 25px 15px;
  box-sizing: border-box;
  background: #f4f4f4;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table th {
    width: 25.64103vw;
    border-right: 0px;
    font-size: 11px;
    padding: 3.33333vw 1.53846vw;
  }
}

.specZone .inner .specTable table td {
  font-size: 12px;
  padding: 15px 0 15px 20px;
  box-sizing: border-box;
  width: 320px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table td {
    width: 59.48718vw;
    padding: 3.33333vw 1.53846vw;
    font-size: 11px;
  }
}

.specZone .inner .specTable table td .sub {
  display: block;
  font-size: 11px;
}

.specZone .inner .specTable table td strong {
  font-size: 18px;
  font-weight: bold;
}

.specZone .inner .specTable table td .en {
  font-size: 14px;
  padding-left: 0.05em;
}

.specZone .inner .specTable table td .day {
  font-size: 14px;
}

.specZone .inner .specTable table td .alert {
  font-size: 14px;
  color: #f00;
}

.specZone .inner .specTable table td .note {
  font-size: 10px;
  display: block;
}

.specZone .inner .specTable table .icons {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 30px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table .icons {
    display: block;
  }
}

.specZone .inner .specTable table .icons .img img {
  width: 161px;
}

.specZone .inner .specTable table .codeBox {
  display: flex;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table .codeBox {
    display: block;
  }
}

.specZone .inner .specTable table .codeBox .code + .code {
  margin-left: 50px;
}

@media screen and (max-width: 767px) {
  .specZone .inner .specTable table .codeBox .code + .code {
    margin-left: 0px;
    margin-top: 10px;
  }
}

#container {
  min-width: 1100px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #container {
    min-width: 100%;
  }
}

.set-anime {
  transition: .5s;
  opacity: 0;
}

.set-anime.show-anime {
  opacity: 1;
}

.footNavi {
  position: sticky;
  bottom: 0px;
  left: 0px;
  z-index: 10;
  display: none;
  background-color: #FFF;
  padding-bottom: calc(env(safe-area-inset-bottom));
}

.footNavi.show {
  display: block;
}

nav.navs {
  background-color: #002F71;
}

nav.navs ul {
  display: flex;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  border-right: 1px solid #FFF;
}

@media screen and (max-width: 767px) {
  nav.navs ul {
    flex-wrap: wrap;
  }
}

nav.navs ul li {
  width: 25%;
  border-left: 1px solid #FFF;
}

@media screen and (max-width: 767px) {
  nav.navs ul li {
    width: 50%;
    border-bottom: 1px solid #FFF;
  }
}

nav.navs ul li a {
  display: flex;
  height: 100%;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  padding: 10px 0;
}

nav.navs ul li img {
  height: 37px;
}

@media screen and (max-width: 767px) {
  nav.navs ul li img {
    height: 32px;
  }
}

nav.navs ul li img.nav04 {
  height: 18px;
}

.specZone img {
  width: auto;
}

/*# sourceMappingURL=../../../../../../../srcmap/products/babycar/detail/3wheel/smooove_precious/common/css/style.css.map */