@charset "utf-8";

/* for Common & Smartphone*/

.mv{
  position: relative;
  width: 100%;
  padding: 50px 0 0 0;
}
.mv > .bg {
    top: auto;
    bottom: 0;
    height: calc(100% - 110px);
    z-index: -1;
}
.mv > .bg::before {
    background: #f0f1ed;
}


.mv .txtWrap{
  padding: 30px 0;
  text-align: center;
}
.mv .txtWrap .fEn{
  margin: 0 0 20px 0;
  font-size:clamp(calc(4.2rem * 0.7), calc(42vw * 3.75), 4.2rem);/*42 / 88*/
  line-height: 1.0;
  color: #1b2a64;
}
.mv .txtWrap h1{
  margin: 0 0 30px 0;
  padding: 0 0 0 0.1em;
  font-size:clamp(calc(1.8rem * 0.7), calc(18vw * 3.75), 1.8rem);/*18 / 20*/
  text-align: center;
  color: #1b2a64;
  line-height: 1.0;
  letter-spacing: 0.1em;
}
.mv .txtWrap p:not(.fEn){
  font-size:clamp(calc(1.4rem * 0.7), calc(14vw * 3.75), 1.4rem);/*14 / 16*/
  text-align: center;
  line-height: 1.8;
}

/* for pc*/
@media print, screen and (min-width:768px) {
  
  .mv{}
  .mv > .bg {
    height: 75%;
  }
  .mv > .bg::before {}


  .mv .txtWrap{
    padding: 100px 0 80px 0;
  }
  .mv .txtWrap .fEn{
    margin: 0 0 20px 0;
    font-size:clamp(calc(8.8rem * 0.7), calc(88vw * 10.80), 8.8rem);/*42 / 88*/
  }
  .mv .txtWrap h1{
    margin: 0 0 50px 0;
    padding: 0 0 0 0.2em;
    font-size:clamp(calc(2.0rem * 0.7), calc(20vw * 10.80), 2.0rem);/*18 / 20*/
    letter-spacing: 0.2em;
  }
  .mv .txtWrap p:not(.fEn){
    font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 10.80), 1.6rem);/*14 / 16*/
  }
}


.avBlock{
  padding: 60px 0;
}
/* for sp*/
@media screen and (max-width:767px) {
  .avBlock .copy02{
    font-size:clamp(calc(1.7rem * 0.7), calc(17vw * 3.75), 1.7rem);
  }
}

.avH{
  position: relative;
  width: 70%;
  max-width: 400px;
  margin: 0 auto 40px auto;
  border-left: 1px solid rgba(27,42,100,0.7);
  border-right: 1px solid rgba(27,42,100,0.7);
  color: #1b2a64;
  text-align: center;
}
.avH::after{
  padding: 0 0 0 0.1em;
  font-family: 'Cormorant Infant', serif;
  font-weight: 400;
  font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 3.75), 1.6rem);/*16 / 18*/
  line-height: 1.0;
  letter-spacing: 0.1em;
}
.avH .num{
  position: relative;
  display: inline-block;
  margin: 0 0 15px 0;
  padding: 0 0 15px 0;
  font-size:clamp(calc(3.0rem * 0.7), calc(30vw * 3.75), 3.0rem);/*30 / 50*/
  line-height: 1.0;
}
.avH .num::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  display: block;
  width: 100%;
  height: 3px;
  background: #1b2a64;
  transform: translate(-50%,0);
}
.avH h2{
  margin: 0 0 15px 0;
  padding: 0 0 0 0.4em;
  font-size:clamp(calc(4.5rem * 0.7), calc(45vw * 3.75), 4.5rem);/*45 / 70*/
  line-height: 1.0;
  letter-spacing: 0.4em;
}

.avH + h3{
  margin-bottom: 40px;
}

/* for pc*/
@media print, screen and (min-width:768px) {
  .avBlock{
    padding: 100px 0;
  }
  .avH{
    margin: 0 auto 80px auto;
  }
  .avH::after{
    font-size:clamp(calc(1.8rem * 0.7), calc(18vw * 10.80), 1.8rem);/*16 / 18*/
  }
  .avH .num{
    margin: 0 0 25px 0;
    padding: 0 0 25px 0;
    font-size:clamp(calc(5.0rem * 0.7), calc(50vw * 10.80), 5.0rem);/*30 / 50*/
  }
  .avH .num::after{}
  .avH h2{
    margin: 0 0 20px 0;
    font-size:clamp(calc(4.5rem * 0.7), calc(45vw * 3.75), 4.5rem);/*45 / 70*/
  }

  .avH + h3{
    margin-bottom: 80px;
  }
}




/* for tablet*/
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2){
/*横向きのみの記述*/

}


/*av01
--------------------------------- */
.av01{
  position: relative;
}
.av01 .avH::after{
  content: "ASSET VALUE";
}
.av01 .av0101{}
.av01 .av0101 figure{
  max-width: 750px;
  margin: 0 auto;
}
.av01 .av0101 .merit{}
.av01 .av0101 .merit li{
  margin: 0 0 10px 0;
  padding: 20px 0 25px 0;
  background: #1b2a64;
  color: #fff;
  text-align: center;
}
.av01 .av0101 .merit li p:nth-of-type(1){
  margin: 0 0 20px 0;
  font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 3.75), 1.6rem);/*16 / 18*/
  line-height: 1.0;
}
.av01 .av0101 .merit li p:nth-of-type(1)::before{
  content: "merit";
  margin: 0 0.5em 0 0;
}
.av01 .av0101 .merit li p:nth-of-type(2){
  margin: 0 0 15px 0;
  padding-left: 0.1em;
  font-size:clamp(calc(1.4rem * 0.7), calc(14vw * 3.75), 1.4rem);/*14 / 16*/
  line-height: 1.0;
  letter-spacing: 0.1em;
}
.av01 .av0101 .merit li p:nth-of-type(3){
  padding-left: 0.1em;
  font-size:clamp(calc(2.0rem * 0.7), calc(20vw * 3.75), 2.0rem);/*20 / 23*/
  line-height: 1.0;
  letter-spacing: 0.1em;
}


.av01 .av0102{
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}
.av01 .av0102 figure{
  max-width: 546px;
  margin: 0 auto;
}

/* for pc*/
@media print, screen and (min-width:768px) {
  .av01{}
  .av01 .avH::after{}
  .av01 .av0101{}
  .av01 .av0101 figure{}
  .av01 .av0101 .merit{
    display: flex;
    justify-content: space-between;
  }
  .av01 .av0101 .merit li{
    width: calc((340 / 1080) * 100%);
    margin: 0;
    padding: 30px 0 35px 0;
  }
  .av01 .av0101 .merit li p:nth-of-type(1){
    margin: 0 0 25px 0;
    font-size:clamp(calc(1.8rem * 0.7), calc(18vw * 10.80), 1.8rem);/*16 / 18*/
  }
  .av01 .av0101 .merit li p:nth-of-type(1)::before{
    content: "merit";
    margin: 0 0.5em 0 0;
  }
  .av01 .av0101 .merit li p:nth-of-type(2){
    font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 10.80), 1.6rem);/*14 / 16*/
  }
  .av01 .av0101 .merit li p:nth-of-type(3){
    font-size:clamp(calc(2.3rem * 0.7), calc(23vw * 10.80), 2.3rem);/*20 / 23*/
  }
  .av01 .av0102{}
  .av01 .av0102 figure{}
}

/*av02
--------------------------------- */
.av02{
  position: relative;
}
.av02 > .bg {
  top: 0;
  height: 100%;
  z-index: -1;
}
.av02 > .bg::before {
  background: #f0f1ed;
}

.av02 .avH::after{
  content: "ENJOY MEAL";
}

.av02 .av0201{}
.av02 .av0201 .shopList{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.av02 .av0201 .shopList li,
.av02 .av0201 .shopList::after{
  width: 48.5%;
}
.av02 .av0201 .shopList::after{
  content: "";
  display: block;
  height: 1px;
}
.av02 .av0201 .shopList li{
  margin: 0 0 20px 0;
  text-align: left;
}
.av02 .av0201 .shopList li div{
  display: flex;
  justify-content: space-between;
  margin: 10px 0 0 0;
}
.av02 .av0201 .shopList li div .num{
  display: block;
  width: 22px;
  height: 22px;
  line-height: 22px;
  background: #222;
  border-radius: 50%;
  color: #fff;
  font-size:clamp(calc(1.3rem * 0.7), calc(13vw * 3.75), 1.3rem);/*13 / 20*/
  text-align: center;
  /*font-weight: bold;*/
  letter-spacing: -0.2em;
  text-indent: -0.2em;
}
.av02 .av0201 .shopList li div p{
  width: calc(100% - 30px);
  font-size:clamp(calc(1.4rem * 0.7), calc(14vw * 3.75), 1.4rem);/*14 / 16*/
  line-height: 1.6;
  text-align: left;
}
.av02 .av0201 .shopList li div p span{
  font-size:clamp(calc(1.1rem * 0.7), calc(11vw * 3.75), 1.1rem);/*11 / 12*/
}

.av02 .av0202{}
.av02 .av0202 figure{
  max-width: 910px;
  margin: 0 auto;
}



/* for pc*/
@media print, screen and (min-width:768px) {
  .av02{}
  .av02 > .bg {
    width: 100% !important;
  }
  .av02 > .bg::before {}
  .av02 .avH::after{}

  .av02 .av0201{}
  .av02 .av0201 .shopList{}
  .av02 .av0201 .shopList li,
  .av02 .av0201 .shopList::after{
    width: calc((262 / 1080) * 100%);
  }
  .av02 .av0201 .shopList::after{}
  .av02 .av0201 .shopList li{
    margin: 0 0 25px 0;
  }
  .av02 .av0201 .shopList li div{}
  .av02 .av0201 .shopList li div .num{
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size:clamp(calc(2.0rem * 0.7), calc(20vw * 10.80), 2.0rem);/*13 / 20*/
  }
  .av02 .av0201 .shopList li div p{
    width: calc(100% - 50px);
    font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 10.80), 1.6rem);/*14 / 16*/
  }
  .av02 .av0201 .shopList li div p span{
    font-size:clamp(calc(1.2rem * 0.7), calc(12vw * 10.80), 1.2rem);/*11 / 12*/
  }
  .av02 .av0202{}
  .av02 .av0202 figure{}
}


/*av03
--------------------------------- */
.av03{
  position: relative;
}

.av03 .avH::after{
  content: "CENTER AREA";
}

.av03 .av0301{}
.av03 .av0301 figure{
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
}

.av03 .av0302{}
.av03 .av0302 .shopList{
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}
.av03 .av0302 .shopList li{
  margin: 0 0 20px 0;
}
.av03 .av0302 .shopList li:last-of-type{
  margin-bottom: 0;
}
.av03 .av0302 .shopList li > div{
  display: flex;
  justify-content: space-between;
  /*align-items: center;*/
}
.av03 .av0302 .shopList li > div p{
  margin: 10px 0 0 0;
  font-size:clamp(calc(1.4rem * 0.7), calc(14vw * 3.75), 1.4rem);/*14 / 16*/
  text-align: left;
  line-height: 1.4;
}
.av03 .av0302 .shopList li > div div{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 90px;
  height: 90px;
  margin: -45px 5px 0 0;
  background: #1b2a64;
  border-radius: 50%;
  color: #fff;
  text-align: center;
}
.av03 .av0302 .shopList li > div div dl{}
.av03 .av0302 .shopList li > div div dl dt{
  font-size:clamp(calc(1.3rem * 0.7), calc(14vw * 3.75), 1.4rem);/*14 / 15*/
  line-height: 1.0;
}
.av03 .av0302 .shopList li > div div dl dd{
  font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 3.75), 1.6rem);/*18 / 20*/
  line-height: 1.0;
}
.av03 .av0302 .shopList li > div div dl dd strong{
  font-size: calc((50 / 20) * 100%);
  line-height: 1.0;
}

/* for pc*/
@media print, screen and (min-width:768px) {
  .av03{}
  .av03 .avH::after{}
  .av03 .av0301{}
  .av03 .av0301 figure{}

  .av03 .av0302{}
  .av03 .av0302 .shopList{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }
  .av03 .av0302 .shopList li{
    width: calc((320 / 1080) * 100%);
    margin: 0 0 35px 0;
  }
  .av03 .av0302 .shopList li:nth-last-of-type(-n+3){
    margin-bottom: 0;
  }
  .av03 .av0302 .shopList li > div{}
  .av03 .av0302 .shopList li > div p{
    margin: 10px 0 0 0;
    font-size:clamp(calc(1.6rem * 0.7), calc(16vw * 10.80), 1.6rem);/*14 / 16*/
  }
  .av03 .av0302 .shopList li > div div{
    width: 100px;
    height: 100px;
    margin: -50px 5px 0 0;
  }
  .av03 .av0302 .shopList li > div div dl{}
  .av03 .av0302 .shopList li > div div dl dt{
    margin: 0 0 5px 0;
    font-size:clamp(calc(1.5rem * 0.7), calc(15vw * 10.80), 1.5rem);/*14 / 15*/
    line-height: 1.0;
  }
  .av03 .av0302 .shopList li > div div dl dd{
    font-size:clamp(calc(2.0rem * 0.7), calc(20vw * 10.80), 2.0rem);/*18 / 20*/
    line-height: 1.0;
  }
  .av03 .av0302 .shopList li > div div dl dd strong{
    margin: 0 2px;
    font-size: calc((40 / 20) * 100%);
  }
}



/*av04
--------------------------------- */
.av04{
  position: relative;
}
.av04 > .bg {
  top: 0;
  height: 100%;
  z-index: -1;
}
.av04 > .bg::before {
  background: #f0f1ed;
}

.av04 .avH::after{
  content: "RESILIENCE";
}
.av04 .av0401{
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

/* for pc*/
@media print, screen and (min-width:768px) {
  .av04{}
  .av04 > .bg {
    width: 100% !important;
  }
  .av04 > .bg::before {}
  .av04 .avH::after{}
  .av04 .av0401{}
}


/* for tablet*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
/*縦向きのみの記述*/  
}

/* for tablet*/
/*@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation:landscape)*/
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2){
/*横向きのみの記述*/
}


/*set aos
--------------------------------- */

/* for sp*/
@media screen and (max-width: 767px) {}

/* for pc*/
@media print, screen and (min-width:768px) {
  
  
  
  
}