/*common*/
.main-area img{
  width: 100%;
}
.main-area{
  min-width: auto;
  margin: 0 auto;
  text-align: center;
  width: 1200px;
  overflow-x: hidden;
}
.box_inner{
  max-width: 1200px;
  margin: 0 auto;
}
.main_inner .credit {
  font-family: 'Abhaya Libre', serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  margin: 10px auto 0;
}
.all_item_btn {
    margin: 8.333333% auto 130px;
    display: block;
    font-size: 22px;
    letter-spacing: 0.08em;
    border: 4px double;
    width: 27.333333%;
    padding: 1.6% 0;
    font-family: 'Abhaya Libre', serif;
}
.all_item_btn a{
  display: block;
}
/*common*/
/*mainTTL*/
.main-area.lp .mainTTL h2 {
  width: 400px;
  margin: 6% auto 1.8%;
}
.main-area.lp .mainTTL > p.eng {
  font-family: 'Abhaya Libre', serif;
  font-size: 16px;
  letter-spacing: 0.08em;
  line-height: 32px;
}
.main-area.lp .mainTTL > p.jpn {
  font-size: 13px;
  letter-spacing: 0.08em;
  line-height: 24px;
  margin: 1.5% auto 6%;
}
/*mainTTL*/
/*box*/
.box,
.box_inner{
  position: relative;
}
.box .bg{
  position: absolute;
  z-index: -1
}
.box div{
 display: flex;
 flex-wrap: wrap;
}
.box._01 .bg{
  background-color: #f9f0ea;
        top: 21.666667%;
    width: 320px;
    height: 808px;
    margin-left: 896px;
    width: 1200px
}
.box._01 .bg2{
  background-color: #f2f2f2;
  top: 5.6666667%;
  width: 320px;
  height: 808px;
  margin-left: 1145px;
}
.jpn{
  font-size: 13px;
    letter-spacing: 0.08em;
    line-height: 24px;
    margin: 3.333% auto 6%;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
}
.jpn span,
.jpn3 span,
.jpn5 span,
.jpn7 span,
.jpn4 span{
  font-family: 'Nunito Sans';
}
h3 img{
  width: 394px;
}
.bigbox{
  background-color: #f2f2f2;
}
.unit{
  margin: 0 auto;
}
.jpn3{
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 24px;
    width: 360px;
    margin-left: -162px;
}
.jpn7{
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 24px;
    width: 335px;
    margin-left: -169px;
}
.jpn4{
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 24px;
    width: 400px;
    margin-left: 560px;
    margin-top: -259px;
}
.jpn5{
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 24px;
    width: 448px;
        padding-left: 34%;
    margin-top: 18px;
    margin-bottom: 100px;
}
.main-area.lp strong{
  font-size: 15px;
  letter-spacing: 0.08em;
    line-height: 64px;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.box._01 .div01{
  width: 450px;
  margin-left: 84px;
  /*margin-left: 11.666667%;*/
  /*margin-top: 13.33333%;*/
}
.box._01 .div02{
  width: 22%;
  margin-left: -1.6666667%;
  height: 100%;
}
.box._01 .div03{
  width: 360px;
  position: absolute;
  top: 60%;
  left: 55%;
}
.box._01 .div03 figure{
  width: 50%;
}
.box._01 .div03 figure.right{
  margin-top: 22%;
}
.box._01 .div03 .hover{
  max-width: 180px;
}
.box._02{
  margin-top: 95px;
}
.box._02 .div01{
  width: 29.166667%;
  margin-left: 30px;
  margin-top: 0px;
  margin-right: 30px;
}
.box._02 .div02{
  width: 25%;
  position: absolute;
  left: 31.833333%;
  top: -78px;
}
.box._02 .div03{
  width: 37.5%;
  /*margin-left: 26.25%;*/
}
.box._02 .div04{
  max-width: 380px;
  width: 31.666667%;
  margin-top: 40px;
  margin-left: 21.75%;
}
.box._02 .div04 figure{
  max-width: 180px;
  width: 47.368421%;
}
.box._02 .div04 figure.left{
  margin-right: 1.6666667%;
}
.box._02 .bg{
     background-color: #f9f0ea;
    
    height: 1000px;
    margin-top: -466px;
    
    width: 1200px;
    margin-left: -968px;
}
.box._02 .div04 .credit{
  margin-top: 20px;
}
.box._02 .div05{
  max-width: 330px;
  width: 27.5%;
  margin-top: 40px;
  margin-left: 3.166667%;
}
.box._02 .div05 figure{
  max-width: 164px;
  width: 49.69697%;
}
.box._02 .div05 figure.right{
  margin-top: 30.3030303%;
}
.box._03{
  margin-top: 120px;
}
.box._03 .div01{
  max-width: 380px;
  width: 32.166667%;
  margin-left: 15%;
}
.box._03 .div01 figure {
  max-width: 168px;
  width: 44%;
  margin-right: 5.714286%;
}
.box._03 .div01 .credit{
  margin-top: 20px;
}
.box._03 .div02{
  max-width: 380px;
  width: 32.166667%;
  margin-left: 11.6666667%;
}
.box._03 .div02 figure {
  max-width: 168px;
  width: 44%;
  margin-right: 5.714286%;
}
.box._03 .div02 .credit{
  margin-top: 20px;
}
.box._04{
  margin-top: 60px;
  z-index: 10;
}
.box._04 .div01{
  max-width: 380px;
  width: 32.166667%;
  margin: auto;
 /* margin-left: 780px;*/
}
.box._04 .div01 figure {
  max-width: 168px;
  width: 44%;
  margin-right: 5.714286%;
}
.box._04 .div01 .credit{
  margin-top: 20px;
}
.box._05{
  margin-top: -26px;
  z-index: 5;
}
.box._05 .div01{
  max-width: 330px;
  width: 27.5%;
  margin-left: 5.8333333%;
  margin-top: 4%;
}
.box._05 .credit{
  /*margin-top: 20px;*/
  margin-left: 133px;
    line-height: 32px;
    letter-spacing: 0.08em;
}
.box._05 .div02{
  max-width: 330px;
  width: 25%;
  margin-left: 36.166667%;
}
.box._06 .div01{
  max-width: 302px;
  width: 25.16667%;
  margin-left: 24.5%;
  margin-top: 6.33333%;
}
.box._06 .credit{
  margin-top: 20px;
}
.box._06 .div02{
  max-width: 300px;
  width: 25%;
  margin-left: 9.166667%;
}
.box._06 .div02 .credit{
  margin-top: -70px;
  z-index: 100;
}
.box._07{
  margin-top: 10px;
  z-index: 10;
}
.box._07 .div01{
  max-width: 230px;
  width: 19.166667%;
  margin-left: 11.666667%;
}
.box._07 .credit{
  margin-top: 20px;
}
.box._07 .div02{
  max-width: 320px;
  width: 26.6666667%;
  margin-left: 23.75%;
}
.box._07 .div02 .credit{
  margin-top: -23px;
  z-index: 100;
}
.box._08{
  margin-top: -20px;
  z-index: 5;
}
.box._08 .div01{
  max-width: 350px;
  width: 29.166667%;
  margin-left: 24.5%;
  margin-top: 13.33333%;
}
.box._08 .credit{
  margin-top: 20px;
}
.box._08 .div02{
  max-width: 300px;
  width: 25%;
  margin-left: 15.833333%;
}
/*box*/
/*hover*/
.main_inner .box figure a{
  opacity: 1;
}
.main_inner .box figure{
  position: relative;
}
.main_inner .box .hover{
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.main_inner .box figure:hover .hover{
  opacity: 1;
  transition: 0.8s; 
}
.main_inner .box figure:hover .img{
  opacity: 0;
  transition: 0.8s; 
}

#ie .credit{
  margin-top: 230px;
}

@supports (-ms-ime-align: auto) {
  #ie .credit{
    margin-top: 260px !important; /* IE10以上 */
  }
  .credit.ie{
    margin-top: 20px !important;
  }
}
_:-ms-lang(x)::backdrop, #ie .credit {
    margin-top: 260px !important; /* IE10以上 */
}
_:-ms-lang(x)::backdrop, .credit.ie {
    margin-top: 20px !important; /* IE10以上 */
}







/*hover*/