@font-face {
  font-family: OptimaLTStd;
  src: url("../fonts/OptimaLTStd.woff") format("woff")
}
.fade {
  -webkit-transition-duration: 2s;
  transition-duration: 2s;
  opacity: 0;
  -webkit-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px)
}
.fade.onView {
  opacity: 1;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0)
}
.main, .main_inner {
  color: #000;
  font-family: toppan-bunkyu-mincho-pr6n, serif;
  font-style: normal;
  font-weight: normal;
  padding: 0 calc(55 * (100vw / 750))
}
@media only screen and (min-width: 560px) {
  .main, .main_inner {
    padding: 0
  }
}
.main img, .main_inner img {
  width: 100%
}
.content_wrap {
  width: 100%;
  margin: 0 auto
}
a {
  text-decoration: none
}
h1, h2, h3, h4, h5, h6 {
  font-weight: normal
}
ul, li {
  list-style: none
}
.sp-component {
  display: block
}
@media only screen and (min-width: 560px) {
  .sp-component {
    display: none
  }
}
.pc-component {
  display: none
}
@media only screen and (min-width: 560px) {
  .pc-component {
    display: block
  }
}
.title-txt {
  color: #343434;
  font-style: normal;
  text-align: center
}
.desc-txt {
  color: #343434;
  font-size: calc(25 * (100vw / 750));
  letter-spacing: calc(2.25 * (100vw / 750));
  line-height: 2;
  margin: calc(65 * (100vw / 750)) -5% 0;
  text-align: center
}
.color {
  font-family: OptimaLTStd;
  font-size: calc(40 * (100vw / 750));
  font-style: normal;
  font-weight: normal;
  letter-spacing: calc(2.8 * (100vw / 750));
  line-height: 1;
  text-align: center
}
.credit {
  color: #656565;
  font-size: calc(22 * (100vw / 750));
  letter-spacing: calc(2.5 * (100vw / 750))
}
.sec-style {
  display: block
}
.sec-style .title-txt {
  font-family: OptimaLTStd;
  font-size: calc(40 * (100vw / 750));
  font-weight: normal;
  letter-spacing: calc(2.8 * (100vw / 750));
  line-height: 1
}
.buy__btn {
  margin-left: calc(20 * (100vw / 750));
  margin-bottom: calc(8 * (100vw / 750));
  vertical-align: middle
}
.item__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: auto
}
.item {
  text-align: center;
  width: calc(280 * (100vw / 750))
}
.img__wrapper {
  display: block;
  margin: auto
}
.heading-title {
  font-size: calc(30 * (100vw / 750));
  letter-spacing: calc(4.5 * (100vw / 750));
  line-height: 2.2;
  margin-top: calc(50 * (100vw / 750));
  margin: calc(50 * (100vw / 750)) -5% 0
}
.heading-desc {
  margin-top: calc(34 * (100vw / 750));
  margin: calc(34 * (100vw / 750)) -5% 0
}
.heading .en {
  letter-spacing: calc(1.2 * (100vw / 750))
}
.heading-img__container {
  margin-top: calc(74 * (100vw / 750))
}
.heading-img__container .img1 {
  margin-left: 0;
  width: calc(450 * (100vw / 750))
}
.heading-img__container .img2 {
  margin-top: calc(34 * (100vw / 750));
  margin-right: 0;
  width: calc(500 * (100vw / 750))
}
.heading-item-credit {
  text-align: center
}
.heading-item__container {
  position: relative;
  left: calc(10 * (100vw / 750));
  margin-top: calc(124 * (100vw / 750));
  margin-bottom: calc(56 * (100vw / 750));
  width: calc(598 * (100vw / 750))
}
.heading .item1 {
  width: calc(162 * (100vw / 750))
}
.heading .item2 {
  margin-top: calc(4 * (100vw / 750));
  margin-left: calc(10 * (100vw / 750));
  width: calc(168 * (100vw / 750))
}
.heading .item3 {
  width: calc(167 * (100vw / 750))
}
.sec1 {
  margin-top: calc(182 * (100vw / 750))
}
.sec1 .desc-txt {
  margin-top: calc(36 * (100vw / 750))
}
.sec1-img__container {
  margin-top: calc(64 * (100vw / 750))
}
.sec1 .img1 {
  margin-right: 0;
  margin-left: auto;
  width: calc(500 * (100vw / 750))
}
.sec1 .img2 {
  margin-top: calc(44 * (100vw / 750));
  margin-right: auto;
  margin-left: 0;
  width: calc(400 * (100vw / 750))
}
.sec2 {
  margin-top: calc(192 * (100vw / 750))
}
.sec2 .desc-txt {
  margin: calc(38 * (100vw / 750)) -5% 0
}
.sec2-img__container {
  margin-top: calc(68 * (100vw / 750))
}
.sec2 .img1 {
  width: calc(640 * (100vw / 750))
}
.sec2 .img2 {
  margin-top: calc(45 * (100vw / 750));
  margin-right: calc(36 * (100vw / 750));
  margin-left: auto;
  width: calc(450 * (100vw / 750))
}
.sec2 .img3 {
  margin-top: calc(50 * (100vw / 750));
  margin-right: auto;
  margin-left: calc(35 * (100vw / 750));
  width: calc(500 * (100vw / 750))
}
.sec3 {
  margin-top: calc(172 * (100vw / 750));
  text-align: center
}
.sec3-item__container {
  margin-top: calc(52 * (100vw / 750));
  margin-bottom: calc(80 * (100vw / 750))
}
.sec3 .item {
  text-align: center;
  width: calc(270 * (100vw / 750))
}
.sec3 .item1 .color {
  color: #ccbf8d
}
.sec3 .item2 {
  margin-right: calc(12 * (100vw / 750))
}
.sec3 .item2 .color {
  color: #aea4d3
}
.sec3 .item3 {
  margin: 30px auto 0
}
.sec3 .item3 .color {
  color: #ba805b
}
.sec3 .img__wrapper {
  margin-bottom: calc(56 * (100vw / 750))
}
.sec3 .img1 {
  width: calc(114 * (100vw / 750))
}
.sec3 .img2 {
  margin-top: calc(10 * (100vw / 750));
  padding-left: calc(20 * (100vw / 750));
  width: calc(132 * (100vw / 750))
}
.sec3 .img3 {
  margin-bottom: calc(44 * (100vw / 750));
  width: calc(112 * (100vw / 750))
}
.sec3 .desc-txt {
  margin-top: calc(18 * (100vw / 750))
}
.viewall__btn {
  margin: calc(200 * (100vw / 750)) auto 0
}
@media only screen and (min-width: 768px) {
  .desc-txt {
    font-size: calc(15 * (100vw / 1600));
    letter-spacing: calc(2.25 * (100vw / 1600));
    line-height: 2;
    margin-top: calc(50 * (100vw / 1600))
  }
  .color {
    font-size: calc(20 * (100vw / 1600));
    letter-spacing: calc(1.4 * (100vw / 1600))
  }
  .credit {
    font-size: calc(12 * (100vw / 1600));
    letter-spacing: calc(1.2 * (100vw / 1600))
  }
  .sec-style .title-txt {
    font-size: calc(26 * (100vw / 1600));
    letter-spacing: calc(1.8 * (100vw / 1600))
  }
  .buy__btn {
    margin-left: calc(7 * (100vw / 1600));
    margin-bottom: calc(4 * (100vw / 1600))
  }
  .item {
    width: calc(200 * (100vw / 1600))
  }
  .heading-img {
    position: relative;
    display: block;
    margin: auto;
    width: calc(1102 * (100vw / 1600))
  }
  .heading-img__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: calc(112 * (100vw / 1600)) auto 0;
    width: calc(1020 * (100vw / 1600))
  }
  .heading-img__container .img1 {
    width: calc(500 * (100vw / 1600))
  }
  .heading-img__container .img2 {
    margin-top: calc(30 * (100vw / 1600));
    margin-right: 0;
    width: calc(500 * (100vw / 1600))
  }
  .heading-item-credit {
    display: block;
    margin: auto;
    text-align: right;
    width: calc(810 * (100vw / 1600))
  }
  .heading-item__container {
    left: 0;
    margin-top: calc(104 * (100vw / 1600));
    margin-bottom: calc(38 * (100vw / 1600));
    width: calc(748 * (100vw / 1600))
  }
  .heading .item1 {
    width: calc(197 * (100vw / 1600))
  }
  .heading .item2 {
    margin-top: calc(3 * (100vw / 1600));
    margin-left: calc(2 * (100vw / 1600));
    width: calc(204 * (100vw / 1600))
  }
  .heading .item3 {
    width: calc(203 * (100vw / 1600))
  }
  .sec1 {
    margin-top: calc(120 * (100vw / 1600))
  }
  .sec1 .desc-txt {
    letter-spacing: calc(.9 * (100vw / 1600));
    margin: calc(43 * (100vw / 1600)) auto 0
  }
  .sec1-img__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: calc(45 * (100vw / 1600)) auto 0;
    width: calc(1020 * (100vw / 1600))
  }
  .sec1 .img1 {
    margin-right: auto;
    margin-left: 0;
    width: calc(600 * (100vw / 1600))
  }
  .sec1 .img2 {
    margin-top: calc(75 * (100vw / 1600));
    margin-right: 0;
    margin-left: auto;
    width: calc(400 * (100vw / 1600))
  }
  .sec2 {
    margin-top: calc(116 * (100vw / 1600))
  }
  .sec2 .desc-txt {
    letter-spacing: calc(.9 * (100vw / 1600));
    margin: calc(44 * (100vw / 1600)) auto 0
  }
  .sec2-img__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: calc(51 * (100vw / 1600)) auto 0;
    width: calc(920 * (100vw / 1600))
  }
  .sec2 .img1 {
    width: calc(500 * (100vw / 1600))
  }
  .sec2 .img2 {
    margin-top: calc(190 * (100vw / 1600));
    margin-right: 0;
    margin-left: auto;
    width: calc(400 * (100vw / 1600))
  }
  .sec2 .img3 {
    margin: calc(21 * (100vw / 1600)) auto 0;
    width: calc(500 * (100vw / 1600))
  }
  .sec3 {
    margin-top: calc(111 * (100vw / 1600))
  }
  .sec3-item__container {
    margin-top: calc(50 * (100vw / 1600));
    width: calc(860 * (100vw / 1600))
  }
  .sec3 .item {
    text-align: center;
    width: calc(190 * (100vw / 1600))
  }
  .sec3 .item .desc-txt {
    letter-spacing: calc(-1.1 * (100vw / 1600));
    line-height: 1.7;
    margin-top: calc(16 * (100vw / 1600))
  }
  .sec3 .item2 {
    margin: 0
  }
  .sec3 .item2 .desc-txt {
    letter-spacing: calc(-.9 * (100vw / 1600))
  }
  .sec3 .item3 {
    margin: 0
  }
  .sec3 .item3 .desc-txt {
    letter-spacing: calc(-.9 * (100vw / 1600))
  }
  .sec3 .img__wrapper {
    margin-bottom: calc(30 * (100vw / 1600))
  }
  .sec3 .img1 {
    width: calc(68 * (100vw / 1600))
  }
  .sec3 .img2 {
    margin: calc(3 * (100vw / 1600)) auto calc(34 * (100vw / 1600)) calc(61 * (100vw / 1600));
    padding-left: 0;
    width: calc(78 * (100vw / 1600))
  }
  .sec3 .img3 {
    margin: calc(-2 * (100vw / 1600)) auto calc(30 * (100vw / 1600)) calc(61 * (100vw / 1600));
    width: calc(67 * (100vw / 1600))
  }
  .sec3 .desc-txt {
    letter-spacing: calc(1.9 * (100vw / 1600));
    line-height: 1.8;
    margin-top: calc(15 * (100vw / 1600))
  }
  .viewall__btn {
    margin-top: calc(197 * (100vw / 1600))
  }
}
@media only screen and (min-width: 1200px) {
  .desc-txt {
    font-size: 15px;
    letter-spacing: 2.25px;
    margin-top: 50px
  }
  .ls {
    margin-right: -4px
  }
  .en {
    letter-spacing: 1.6px
  }
  .color {
    font-size: 20px;
    letter-spacing: 1.4px
  }
  .credit {
    font-size: 12px;
    letter-spacing: 1.2px
  }
  .sec-style .title-txt {
    font-size: 26px;
    letter-spacing: 1.8px
  }
  .buy__btn {
    margin-left: 7px;
    margin-bottom: 4px
  }
  .item {
    width: 200px
  }
  .heading-img {
    width: 1102px
  }
  .heading-img::after {
    background-image: url("../imgs/heading_pc.jpg");
    height: 472px;
    width: 630px
  }
  .heading-img__container {
    margin: 112px auto 0;
    width: 1020px
  }
  .heading-img__container .img1 {
    width: 500px
  }
  .heading-img__container .img2 {
    margin-top: 30px;
    width: 500px
  }
  .heading-item-credit {
    width: 810px
  }
  .heading-item__container {
    margin-top: 104px;
    margin-bottom: 38px;
    width: 748px
  }
  .heading .item1 {
    width: 197px
  }
  .heading .item2 {
    margin-top: 3px;
    margin-left: 2px;
    width: 204px
  }
  .heading .item3 {
    width: 203px
  }
  .sec1 {
    margin-top: 120px
  }
  .sec1 .desc-txt {
    letter-spacing: .9px;
    margin: 43px auto 0
  }
  .sec1 .paragraph1 {
    padding-left: 5px
  }
  .sec1 .paragraph2 {
    letter-spacing: .5px;
    padding-left: 2px
  }
  .sec1 .paragraph2 .ls {
    margin-right: -5px
  }
  .sec1 .paragraph2-2 {
    letter-spacing: 1.1px
  }
  .sec1 .paragraph3 {
    letter-spacing: 1.3px;
    padding-left: 5px
  }
  .sec1 .paragraph4 {
    padding-left: 4px
  }
  .sec1 .paragraph5 {
    letter-spacing: 2.4px;
    padding-left: 8px
  }
  .sec1 .paragraph5 .ls {
    margin-right: -10px
  }
  .sec1 .paragraph5-2 {
    letter-spacing: .3px
  }
  .sec1 .paragraph6 {
    letter-spacing: 2.1px;
    padding-left: 9px
  }
  .sec1 .paragraph6 .ls {
    margin-left: -5px
  }
  .sec1-img__container {
    margin: 45px auto 0;
    width: 1020px
  }
  .sec1 .img1 {
    margin-right: auto;
    margin-left: 0;
    width: 600px
  }
  .sec1 .img2 {
    margin-top: 75px;
    margin-right: 0;
    margin-left: auto;
    width: 400px
  }
  .sec2 {
    margin-top: 116px
  }
  .sec2 .desc-txt {
    letter-spacing: .9px;
    margin: 44px auto 0
  }
  .sec2 .paragraph1 {
    letter-spacing: 1.7px;
    padding-left: 15px
  }
  .sec2 .paragraph1 .ls {
    margin-right: -6px
  }
  .sec2 .paragraph2 {
    letter-spacing: 1.8px;
    padding-left: 5px
  }
  .sec2 .paragraph2 .ls {
    margin-right: -6px
  }
  .sec2 .paragraph2-2 {
    letter-spacing: .9px
  }
  .sec2 .paragraph3 {
    padding-left: 4px
  }
  .sec2 .paragraph3-2 {
    letter-spacing: 1.5px
  }
  .sec2 .paragraph3-3 {
    letter-spacing: 1.5px
  }
  .sec2 .paragraph4 {
    letter-spacing: 1.2px;
    padding-left: 7px
  }
  .sec2 .paragraph4 .ls {
    margin-right: -6px
  }
  .sec2 .paragraph4-2 {
    letter-spacing: 1.6px
  }
  .sec2-img__container {
    margin: 51px auto 0;
    width: 920px
  }
  .sec2 .img1 {
    width: 500px
  }
  .sec2 .img2 {
    margin-top: 190px;
    margin-right: 0;
    margin-left: auto;
    width: 400px
  }
  .sec2 .img3 {
    margin: 21px auto 0;
    width: 500px
  }
  .sec3 {
    margin-top: 111px
  }
  .sec3-item__container {
    margin-top: 50px;
    width: 860px
  }
  .sec3 .item {
    width: 190px
  }
  .sec3 .item .desc-txt {
    letter-spacing: .9px;
    line-height: 1.8;
    margin-top: 19px
  }
  .sec3 .img__wrapper {
    margin-bottom: 30px
  }
  .sec3 .img1 {
    width: 68px
  }
  .sec3 .img2 {
    margin: 3px auto 34px 61px;
    width: 78px
  }
  .sec3 .img3 {
    margin: -2px auto 30px 61px;
    width: 67px
  }
  .sec3 .desc-txt {
    font-size: 13px;
    letter-spacing: 1.9px;
    line-height: 1.8;
    margin-top: 15px
  }
  .viewall__btn {
    margin-top: 198px
  }
}
.bredlist.lp {
  font-size: calc(20 *(100vw / 750));
  line-height: calc(40 *(100vw / 750));
  margin: calc(25 *(100vw / 750)) auto;
  padding: 0;
  text-align: left;
  /*width: 92.592%*/
}
figure{
  margin: 0;
}
@media only screen and (min-width: 560px) {
  .bredlist.lp {
    color: #000;
    font-size: 12px;
    line-height: 12px;
    margin: 60px auto 20px;
    width: 1102px
  }
  .bredlist.lp > a {
    color: #000
  }
}
.buy__btn {
  display: inline-block;
  height: calc(37 * (100vw / 750));
  width: calc(82 * (100vw / 750))
}
@media only screen and (min-width: 768px) {
  .buy__btn {
    height: calc(19 * (100vw / 1600));
    width: calc(41 * (100vw / 1600))
  }
}
@media only screen and (min-width: 1200px) {
  .buy__btn {
    height: 19px;
    width: 41px
  }
}
.viewall__btn {
  display: block;
  width: calc(460 * (100vw / 750))
}
@media only screen and (min-width: 768px) {
  .viewall__btn {
    width: calc(460 * (100vw / 1600))
  }
}
@media only screen and (min-width: 1200px) {
  .viewall__btn {
    width: 460px
  }
}
/*# sourceMappingURL=mainStyle.min.css.map */