@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

body {
  width: 100%;
  line-height: 2;
  transition: all 1.6s ease 0s;
  background-color: #fff;
  line-height: 1.9 !important;
  font-feature-settings: "palt";
  letter-spacing: 1.3px;
  font-size: 12px;
  text-align: justify;
  font-family: "area-normal", sans-serif;
  font-weight: 400;
  font-style: normal;
}
@media screen and (min-width: 769px) {
  body {
    margin: 0 auto !important;
  }
}

img {
  display: block;
  width: 100%;
}

a:hover {
  opacity: 0.6;
  transition: 0.6s;
}

@media screen and (min-width: 769px) {
  .spNone {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .spNone {
    display: none !important;
  }
}

@media screen and (min-width: 769px) {
  .pcNone {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .pcNone {
    display: block;
  }
}

/* フェードイン(初期値) */
.js-fade {
  opacity: 0; /* 最初は非表示 */
  transform: translate(0, 10%);
  transition: 1.5s;
}

.js-fade.is-inview {
  transform: translate(0, 0);
  opacity: 1;
}

#bg-loading {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100dvh;
  background: #fff;
  z-index: 99;
  transition: opacity 0.3s ease-out 0.1s;
}

#bg-loading.hide {
  opacity: 0;
  pointer-events: none;
}

#main {
  position: relative;
  height: 180vw;
  background: #fff;
}
@media screen and (min-width: 769px) {
  #main {
    height: 62vw;
  }
}
#main p, #main div, #main h1 {
  position: absolute;
}
#main h1 {
  font-weight: 700;
  text-align: center;
  width: 78.9333333333vw;
  position: absolute;
  left: 50%;
  transform: translate(-50%, 74.266667vw);
  white-space: nowrap;
  letter-spacing: -1px;
  font-size: 7.2vw;
}
@media screen and (min-width: 769px) {
  #main h1 {
    font-size: 3.2638888889vw;
    transform: translate(-50%, 25vw);
    width: 37.5vw;
    top: 3.3vw;
  }
}
#main .art {
  font-size: 3.8vw;
  font-weight: 700;
  text-align: center;
  position: absolute;
  left: 50%;
  transform: translate(-50%, 89vw);
  white-space: nowrap;
  letter-spacing: 0px;
}
@media screen and (min-width: 769px) {
  #main .art {
    font-size: 1.5833333333vw;
    transform: translate(-50%, 35vw);
  }
}
#main .nen {
  font-size: 3.3333333333vw;
  font-weight: 700;
  left: 10vw;
  top: 63vw;
  letter-spacing: 0px;
}
@media screen and (min-width: 769px) {
  #main .nen {
    font-size: 1.4vw;
    left: 30.8vw;
    top: 24vw;
  }
}
#main .dis {
  font-size: 2.1333333333vw;
  top: 64vw;
  left: 24vw;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: 0;
}
@media screen and (min-width: 769px) {
  #main .dis {
    font-size: 0.6944444444vw;
    left: 36vw;
    top: 24.5vw;
    letter-spacing: -0.1px;
  }
}
#main .logo {
  width: 15.4666666667vw;
  left: 75vw;
  top: 47vw;
}
@media screen and (min-width: 769px) {
  #main .logo {
    width: 7.8472222222vw;
    top: 2.7777777778vw;
    right: 2.5694444444vw;
    left: auto;
  }
}
#main .fv_b {
  left: 50%;
  transform: translate(-50%, 160vw);
  font-size: 2vw;
  letter-spacing: 0px;
}
@media screen and (min-width: 769px) {
  #main .fv_b {
    font-size: 0.7vw;
    font-weight: 600;
    transform: translate(-50%, 57.5vw);
    width: 14vw;
  }
}
@media screen and (min-width: 769px) {
  #main .main_img {
    display: flex;
  }
  #main .main_img img {
    width: 50%;
    margin-right: -1px;
  }
}

#read {
  background: #fff;
  padding-bottom: 95px;
  font-feature-settings: "palt";
}
@media screen and (min-width: 769px) {
  #read {
    padding: 3.4722222222vw 0 5.4166666667vw;
  }
}
#read p {
  font-size: 3.3333333333vw;
  text-align: center;
  font-family: "dnp-shuei-gothic-kin-std", sans-serif;
  font-weight: 400;
  font-style: normal;
}
@media screen and (min-width: 769px) {
  #read p {
    font-size: 1.1805555556vw;
  }
}
#read p span {
  font-family: "area-normal", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: 0px;
}
#read p span:nth-child(1) {
  font-weight: 600;
}
@media screen and (min-width: 769px) {
  #read p span {
    font-size: 1.0416666667vw;
  }
}

.bac_img {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  background-position: center center;
  background-size: cover;
}
@media screen and (min-width: 769px) {
  .bac_img {
    background-image: url(../images/pc_1.jpg);
  }
}
@media screen and (max-width: 768px) {
  .bac_img {
    background-image: url(../images/com_9.jpg);
  }
}
@media screen and (min-width: 769px) {
  .bac_img.active02 {
    background-image: url(../images/pc_3.jpg);
  }
}
@media screen and (max-width: 768px) {
  .bac_img.active02 {
    background-image: url(../images/na_20.jpg);
  }
}

.series {
  background: #fff;
  padding-bottom: 25.2vw;
}
@media screen and (min-width: 769px) {
  .series {
    padding-bottom: 7.7777777778vw;
  }
}
.series h3 {
  font-size: 6vw;
  margin: 0 auto 34px;
  letter-spacing: 0px;
}
@media screen and (max-width: 768px) {
  .series h3 {
    width: 80vw;
  }
}
@media screen and (min-width: 769px) {
  .series h3 {
    font-size: 2.4305555556vw;
    position: absolute;
    left: 23.125vw;
    top: 16.6666666667vw;
    margin: 0 !important;
  }
}
.series h3 span {
  font-size: 2.4vw;
  margin-right: 14vw;
}
@media screen and (min-width: 769px) {
  .series h3 span {
    font-size: 0.8333333333vw;
  }
}
.series .series_sub {
  letter-spacing: 0;
}
@media screen and (min-width: 769px) {
  .series .series_sub {
    position: absolute;
    left: 19.5138888889vw;
    top: 12.5vw;
  }
}
.series .text {
  margin: 0 auto 65px;
  width: 80vw;
  font-family: "dnp-shuei-gothic-kin-std", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.w_500 {
  width: 66.6666666667vw;
  margin: 5px auto;
}

.credit {
  font-size: 2.9333333333vw;
  text-align: center;
  margin-top: 5px;
  line-height: 1.4;
  letter-spacing: 0px;
}
@media screen and (min-width: 769px) {
  .credit {
    font-size: 0.8333333333vw;
  }
}
.credit span {
  font-weight: 600;
  margin-right: 5px;
}

.te_l {
  text-align: left !important;
}

@media screen and (min-width: 769px) {
  .te_r_pc {
    text-align: right !important;
  }
}

.ml_15 {
  margin-left: 15px;
}
@media screen and (min-width: 769px) {
  .ml_15 {
    margin-left: 39px;
    margin-top: 8px;
  }
}

.mt_140 {
  margin-top: 18.6666666667vw;
}

.w_300 {
  width: 40vw;
  margin: 20.2666666667vw 0 0 52.8vw;
  position: absolute;
  z-index: 2;
}

.posi {
  position: relative;
  height: 271vw;
}
.posi .credit {
  text-align: left;
  margin-left: 15px;
  line-height: 1.5;
  margin-top: 5px;
}

.mt_910 {
  position: absolute;
  margin: 121.3333333333vw auto 24.8vw;
}

.mt_14 {
  margin: 193.3333333333vw 0 24.8vw 52.8vw;
}

.move-img-wrap {
  width: 100%;
  overflow: hidden;
}

.move-img-inner {
  padding: 0 0 0 0;
  overflow: hidden;
}
@media screen and (min-width: 769px) {
  .move-img-inner .move-img {
    width: 259vw;
    display: flex;
  }
}

@media only screen and (max-width: 767px) {
  .move-img-inner {
    width: 158vw;
    padding: 0 0 0 0;
  }
  .move-img {
    width: 234vw;
  }
}
@media only screen and (min-width: 768px) {
  .move-img-wrap {
    overflow: visible;
  }
}
.en {
  text-align: center;
  font-family: "egizio-urw", serif;
  font-weight: 400;
  font-style: italic;
  font-size: 3.2vw;
  margin-top: 30px;
  line-height: 1.3;
  letter-spacing: 0px;
}
@media screen and (min-width: 769px) {
  .en {
    font-size: 1.0416666667vw;
    margin-top: 50px;
  }
}

#category_02 {
  margin-top: 167.8666666667vw;
  padding: 17.7333333333vw 0 0;
}
@media screen and (min-width: 769px) {
  #category_02 {
    margin-top: 62.7777777778vw;
    padding: 0;
  }
}
#category_02 .series {
  padding: 17.7333333333vw 0;
}
@media screen and (min-width: 769px) {
  #category_02 .series {
    padding: 0 0 14.4444444444vw 0;
  }
}
#category_02 h3 span {
  margin-right: 25vw;
}
#category_02 .text {
  margin-bottom: 11.0666666667vw;
}
#category_02 .posi {
  height: 87vw;
}
#category_02 .w_500 .credit {
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  #category_02 .w_500 {
    margin: 28.4vw auto 0;
  }
}
#category_02 .w_500 img:nth-child(2) {
  margin-top: 8px;
}
#category_02 .w_500 .te_l {
  margin-left: 0;
}
@media screen and (min-width: 769px) {
  #category_02 .series_sub {
    top: 29.4444444444vw;
    left: 15.4861111111vw !important;
  }
  #category_02 h3 {
    top: 33.6805555556vw;
    left: 23.6805555556vw !important;
  }
  #category_02 .text {
    top: 39.5138888889vw;
    left: 15.4861111111vw !important;
  }
  #category_02 .posi {
    height: 19vw;
  }
  #category_02 .posi .w_650 {
    width: 41.6666666667vw;
  }
}

@media screen and (min-width: 769px) {
  .pc_posi {
    position: relative;
    height: 120vw;
  }
  .pc_posi2 {
    position: relative;
    height: 140vw;
  }
  .pc_cre {
    position: absolute;
    top: 84.7222222222vw;
    left: 52.0833333333vw;
  }
  .pc_01 {
    width: 31.25vw;
    right: 16.4583333333vw;
    position: absolute;
    top: 0;
  }
  .pc_02 {
    width: 31.25vw;
    right: 16.4583333333vw;
    position: absolute;
    top: 42.2222222222vw;
  }
  .pc_02 .credit {
    text-align: left;
  }
  .pc_03 {
    width: 38.8888888889vw;
    position: absolute;
    top: 59.4444444444vw;
    left: 0;
    margin-top: 0;
  }
  .pc_04 {
    width: 11.875vw;
    position: absolute;
    top: 74.4444444444vw;
    right: 0;
  }
  .pc_05 {
    width: 19.4444444444vw;
    position: absolute;
    top: -42vw;
    right: 10.4166666667vw;
  }
  .pc_05 img {
    margin-top: -1px;
  }
  .pc_06 {
    width: 61.1111111111vw;
    top: 11.1805555556vw;
    left: 19.4444444444vw;
    margin: 0;
  }
  .pc_07 {
    width: 19.4444444444vw;
    top: 40.625vw;
    right: 10.4166666667vw;
    margin: 0;
  }
  .pc_08 {
    position: absolute;
    width: 41.6666666667vw;
    top: 9.9305555556vw;
    left: 49.5833333333vw;
    margin: 0;
  }
  .pc_09 {
    position: absolute;
    width: 30.9722222222vw !important;
    top: 79.0972222222vw;
    left: 55.1388888889vw;
    margin: 0 !important;
  }
  .pc_10 {
    position: absolute;
    width: 26.3888888889vw !important;
    top: 54.4444444444vw;
    left: 13.5416666667vw;
    margin: 0 !important;
  }
  .pc_10 .mb_10 {
    margin-bottom: 10px;
  }
  .pc_11 {
    display: flex;
    justify-content: space-between;
    width: 68.0555555556vw;
    margin-top: 14.2361111111vw;
  }
  .pc_11 a img {
    width: 33.6111111111vw;
  }
  .pc_12 {
    width: 42.3611111111vw !important;
    margin: 9.2361111111vw auto 0 45.9722222222vw !important;
  }
  .pc_13 {
    width: 29.1666666667vw !important;
    margin: -16vw auto 11.8055555556vw 11.5277777778vw !important;
  }
  .pc_14 {
    width: 12.1527777778vw;
    margin-left: 0;
  }
  .pc_15 {
    width: 39.375vw;
    margin: 0 auto auto 46.7361111111vw;
  }
  .pc_16 {
    width: 37.5vw !important;
    margin: -14vw auto auto 13.8888888889vw !important;
  }
  .pc_17 {
    width: 25vw !important;
    margin: -21vw auto auto 57.7777777778vw !important;
  }
  .posi {
    height: 79vw;
  }
  .text {
    position: absolute;
    top: 22.5694444444vw;
    left: 19.5138888889vw;
    font-size: 0.9027777778vw;
    width: 23vw !important;
  }
  .pc_cre02 {
    position: absolute;
    top: 120.8333333333vw;
    left: 55.1388888889vw;
    margin-left: 0vw !important;
  }
  .ml_0 {
    margin-left: 0px !important;
  }
}
.pc_05 img {
  margin-top: -1px;
}

.w_717 {
  width: 80vw;
  margin: 17.3333333333vw auto 0;
}

.ml_10 {
  margin-left: 10vw;
}

.w_380 {
  width: 50.6666666667vw;
  margin: 18.5333333333vw auto 18.5333333333vw 13.3333333333vw;
}

.w_650 {
  width: 86.6666666667vw;
  margin: 0 auto;
}
.w_650 .credit {
  margin-left: 0;
}

.t_w {
  color: #fff;
}

.series02 {
  margin-top: 167.4666666667vw;
  background: #fff;
  padding-top: 20px;
}
@media screen and (min-width: 769px) {
  .series02 {
    margin-top: 62.7777777778vw;
  }
}

@media screen and (max-width: 768px) {
  .mb_10 {
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 768px) {
  .w_468 {
    width: 62.4vw;
    margin: 0 0 15px 32.9333333333vw;
  }
}

.w_680 {
  width: 90.6666666667vw;
  margin: 0 auto;
}

.w_450 {
  width: 60vw;
  margin: 23.2vw auto 33.6vw;
}

.w_550 {
  width: 73.3333333333vw;
  margin: 24.6666666667vw auto;
}
@media screen and (min-width: 769px) {
  .w_550 {
    width: 43.75vw;
    margin: 8.3333333333vw auto 11.0416666667vw;
  }
}

.slide01 {
  width: 90.6666666667vw;
  margin: 39.4666666667vw auto 10.2666666667vw;
}
@media screen and (min-width: 769px) {
  .slide01 {
    width: 45.1388888889vw;
    margin: 16.9444444444vw auto 11.0416666667vw;
  }
}

.mt_77 {
  margin: 10.2666666667vw auto 36vw !important;
}
@media screen and (min-width: 769px) {
  .mt_77 {
    margin: 42px auto 200px !important;
  }
}

footer {
  text-align: center;
  background: #fff;
  letter-spacing: 0px;
}
footer .f_title {
  font-weight: 600;
}
@media screen and (min-width: 769px) {
  footer .f_title {
    margin-top: -1vw;
  }
}
footer .f_title p:nth-child(1) {
  font-size: 2.6666666667vw;
  margin-bottom: 6vw;
}
@media screen and (min-width: 769px) {
  footer .f_title p:nth-child(1) {
    font-size: 0.9027777778vw;
    margin-top: -59vw;
    margin-bottom: 1vw;
  }
}
footer .f_title p:nth-child(2) {
  font-size: 3.4666666667vw;
  font-weight: 800;
}
@media screen and (max-width: 768px) {
  footer .f_title p:nth-child(2) {
    margin-bottom: 6vw;
  }
}
@media screen and (min-width: 769px) {
  footer .f_title p:nth-child(2) {
    font-size: 1.1111111111vw;
    margin-bottom: 1vw;
  }
}
footer .relative {
  position: relative;
  height: 10vw;
}
@media screen and (max-width: 768px) {
  footer .relative {
    height: 102vw;
  }
}
footer .relative div {
  position: absolute;
}
footer .relative div:nth-child(1) {
  margin-top: 17vw;
}
@media screen and (min-width: 769px) {
  footer .relative div:nth-child(1) {
    margin-top: 0;
  }
}
footer .sta_cre {
  font-size: 2.2666666667vw;
  display: flex;
  justify-content: center;
  left: 49.1%;
  transform: translate(-50%, 0);
  width: 100%;
  width: 64vw;
  font-weight: 600;
}
@media screen and (min-width: 769px) {
  footer .sta_cre {
    font-size: 0.6944444444vw;
    width: 18.9583333333vw;
  }
}
footer .sta_cre ul:nth-child(1) {
  text-align: right;
  line-height: 2.23;
}
@media screen and (min-width: 769px) {
  footer .sta_cre ul:nth-child(1) {
    line-height: 2.08;
  }
}
footer .sta_cre ul:nth-child(2) {
  font-size: 2.6666666667vw;
  text-align: left;
  margin-left: 15px;
}
@media screen and (min-width: 769px) {
  footer .sta_cre ul:nth-child(2) {
    font-size: 0.7638888889vw;
  }
}
footer .btn {
  font-size: 3.4666666667vw;
  display: flex;
  justify-content: space-between;
  white-space: nowrap;
  width: 90%;
  margin: 0 auto;
  font-weight: 600;
}
@media screen and (min-width: 769px) {
  footer .btn {
    font-size: 0.9722222222vw;
    margin-top: 2vw;
    width: 28vw;
  }
}
footer .btn a {
  width: 48%;
}
footer .btn a p {
  border: 1px solid gray;
  border-radius: 30px;
  padding: 2vw 0;
}
@media screen and (min-width: 769px) {
  footer .btn a p {
    padding: 0.6vw 0;
  }
}
footer .ico {
  display: flex;
  width: 40vw;
  justify-content: space-between;
  margin: 20vw auto;
}
@media screen and (min-width: 769px) {
  footer .ico {
    width: 10vw;
    margin: 27vw auto;
  }
}
footer .ico a {
  width: 7.0666666667vw;
}
@media screen and (min-width: 769px) {
  footer .ico a {
    width: 2.1527777778vw;
  }
}
footer .top img {
  width: 7.0666666667vw;
  margin-left: 89vw;
  margin-top: -27vw;
}
@media screen and (min-width: 769px) {
  footer .top img {
    width: 2vw;
    margin-left: 93vw;
    margin-top: -28vw;
  }
}
footer .copy {
  font-size: 9px;
  margin: 50px auto 0;
  padding-bottom: 20px;
}
@media screen and (min-width: 769px) {
  footer .copy {
    margin: 20px auto 0;
  }
}/*# sourceMappingURL=style.css.map */