.mainimg figure {
  height: calc(53vw - 106px);
  min-height: 750px;
}
/*
.dark-mmt::before{
  height: calc(100% - 575px);
}*/
#title1 {
  position: absolute;
  z-index: 2;
  
  top: 180px;
  
  padding: 0 5% 0 46%;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}
#title1 img {
  max-width: 563px;
  max-height: 430px;
  min-height: inherit;
}
#title2 {
  text-align: center;
  margin-top: -140px;
}

ul.airdogs { margin-top: 75px;}
ul.airdogs li > a { pointer-events: none;}
ul.airdogs .myBtn { text-align: left;}

.pb250 { padding-bottom: 250px;}
@media only screen and (max-width: 782px) {
  .mainimg {
    height: 150vw;
  }
  .mainimg figure {
    height: 100vw;
    min-height: inherit;
  }
  #title1 {
    position: absolute;
    z-index: 2;

    top: 60vw;
    bottom: 35vw;

    padding: 0 10%;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  #title1 img {
    max-width: inherit;
    max-height: inherit;
    min-height: inherit;
    object-fit: contain;
  }
  #title2 {
    text-align: center;
    margin-top: -25vw;
  }
  ul.airdogs .myBtn.small a { width: 90px;}
  ul.airdogs .myBtn.oneline a span.jp { padding-left: 0; text-align: center;}
}
@media only screen and (max-width: 480px) {
  ul.airdogs .myBtn.small a .arrow { display: none;}
}
.points dl { color: #262253;}
.mitumori { color: inherit;}

.cyanbox {
  margin: 50px auto 0;
  padding: 50px 0 120px;
  border: #38a4b6 1px solid;
  border-radius: 10px;
  text-align: center;
  width: 1040px;
  position: relative;
  color: #fff;
}
.cyanbox dt {
  display: flex;
  justify-content: center;
}
.cyanbox dt .small .white {
  line-height: 1;
  display: block;
  letter-spacing: -0.12rem;
}
.cyanbox dt .small .yellow {
  line-height: 1;
  display: block;
  color: #fff100;
  letter-spacing: 0.05rem;
  margin-top: 5px;
}
.cyanbox dt strong {
  font-size: 34px;
  font-weight: bold;
  margin-left: 10px;
  line-height: 1;
  letter-spacing:0;
}
.cyanbox dd img { max-width: 90%; margin-top: 50px;}
.cyanbox dd .large { font-size: 36px;}
.cyanbox dd .large + p { font-size: 20px;}
@media only screen and (min-width: 1280px) and (max-width: 1540px) {
  .cyanbox { width: 100%;}
  .cyanbox dt .small { font-size: 1vw}
  .cyanbox dt strong { font-size: 2.2vw; margin-left: 0.5vw;}
  .cyanbox dd .large { font-size: 2.3vw;}
  .cyanbox dd .large + p { font-size: 1.3vw; margin-top: 15px;}
}
@media only screen and (max-width: 1280px) {
  .cyanbox { width: 100%;}
  .cyanbox dt .small { font-size: 12px}
  .cyanbox dt strong { font-size: 28px; margin-left: 0.5vw;}
  .cyanbox dd .large { font-size: 29px;}
  .cyanbox dd .large + p { font-size: 12px; margin-top: 15px;}
}
.cyan { color: #41bdce; font-weight: bold;}

.cyanbox .myBtn {
  position: absolute;
  left: calc(50% - 240px);
  bottom: -60px;
  padding: 0 80px 0 0px;
  background: #090508;
  text-align: left;
}

@media only screen and (max-width: 782px) {
  .cyanbox {
    margin: 5vw auto 0;
    padding: 25px 0 70px;
    border-radius: 5px;
    width: auto;
  }
  .cyanbox dt {
    display: block;
  }
  .cyanbox dt strong { font-size: 22px; margin-left: 0; line-height: 1.3; display: block; margin-top: 15px;}
  .cyanbox dd img { max-width: 90%; margin-top: 5vw;}
  .cyanbox dd .large { font-size: 20px;}
  .cyanbox dd .large + p { font-size: 12px;}
  .cyanbox .myBtn.icon a { width: 280px; }
  .cyanbox .myBtn.icon a span.jp,
  .cyanbox .myBtn.icon a span.en { padding-left: 90px;}
  .cyanbox .myBtn.icon {
    left: calc(50% - 140px);
    bottom: auto;
    padding: 0 50px 0 0;
    width: auto;
  }
  .cyanbox .myBtn.icon .icon { bottom: auto;}
  .cyanbox dd .myBtn.icon img { margin: 0;}
}
@media only screen and (max-width: 480px) {
  .cyanbox .myBtn.icon a { width: 240px; }
  .cyanbox .myBtn.icon a span.jp,
  .cyanbox .myBtn.icon a span.en { padding-left: 70px;}
  .cyanbox .myBtn.icon a span.jp { font-size: 100%;}
  .cyanbox .myBtn.icon {
    left: calc(50% - 130px);
    padding: 0 35px 0 0;
    width: auto;
  }
  .myBtn.icon a .icon { width: 55px;}
}

figure.models {
  margin-top: -120px;
  text-align: center;
}
.h3models {
  margin-top: 3rem;
  text-align: center;
  font-weight: bold;
  line-height: 1.4;
}
.h3models .small { font-size: 200%; display: block;}
.h3models .large { font-size: 240%; display: block; letter-spacing: 0;}
.h3models .large .en { font-weight: 700; position: relative; display: inline-block; font-size: 150%; letter-spacing: -1px; padding: 0 3px;}
.h3models .large .en .ruby {
  position: absolute;
  right: 5px;
  top: 5px;
  font-size: 10px;
  letter-spacing: 0;
}

@media only screen and (max-width: 782px) {
}

.model-flex {
  display: flex;
  margin-top: 70px;
  justify-content: space-between;
}
.model-flex .figs {
  width: 360px;
}
.model-flex .text {
  width: calc(100% - 420px);
}


@media only screen and (max-width: 782px) {
  .model-flex {
    display: block;
    margin-top: 30px;
  }
  .model-flex .figs {
    margin-top: 5vw;
    width: auto;
  }
  .model-flex .text {
    width: auto;
  }
}
.model-flex .figs li + li { margin-top: 20px;}
.model-flex .figs img { border-radius: 10px;}
.model-flex .text p:first-child { margin-top: 0;}
.model-flex .text p.small { font-size: 86%;}

.model-flex .priceText { margin: 6rem 0;}
.model-flex .mitumori { 
  font-size: 22px;
  padding: 25px 25px 10px;
}
.model-flex .mitumori::after {
  height: 50px;
  left: 30px;
  top: -20px;
}
.model-flex .mitumori dd .tel { 
  padding-left: 50px;
  background-size: 37px auto;
}
.model-flex .mitumori dd .available { padding-left: 50px;}

@media only screen and (max-width: 782px) {
  .model-flex .mitumori::after {
    width: 200px;
    height: 40px;
    left: 10px;
    top: -14px;
  }
}
#feature {
  background: #000 url("../img/airdog/feature-bg-base@2x.jpg") repeat-x left bottom / 1600px auto;
  position: relative;
  border-radius: 0 0 60px 60px;
  z-index: 1;
}
#feature::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: url("../img/airdog/feature-bg@2x.jpg") no-repeat center bottom / 1600px auto;
  border-radius: 0 0 60px 60px;
}
@media only screen and (max-width: 782px) {
  #feature { border-radius: 0 0 40px 40px;}
  #feature::after { display: none;}
}
#feature > * { position: relative; z-index: 3;}
#feature main { padding-top: 120px; color: #fff;}
#feature main .text { min-height: 1100px; padding-top: 120px;padding-bottom: 30px; box-sizing: border-box; padding-left: 580px;}
@media only screen and (max-width: 782px) {
  #feature main { padding-top: 60px;}
  #feature main .text { min-height: inherit; padding-top: 60px;padding-bottom: 30px; padding-left: 0px;}
}
#feature .full { text-align: center;}
#feature h3 {
  font-weight: bold;
  font-size: 40px;
  line-height: 1.4;
  letter-spacing: 0;
}
#feature h4 {
  font-size: 145%;
  font-weight: bold;
  margin: 3rem 0 0 0;
  line-height: 1.4;
}
#feature h4 span.en:first-child {
  display: inline-flex;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
  background: #41bdce;
  font-weight: 600;
  font-size: 80%;
  margin-right: 10px;
  border-radius: 50%;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
}
#feature p { line-height: 1.8;}
#feature p.small { font-size: 86%; margin-top: 0;}
#feature .circle,
#feature .icon_tpa {
  position: relative;
}
#feature .icon_tpa img {
  position: absolute;
  left: -110px;
  margin-top: 10px;
}
#feature .circle img {
  position: absolute;
  left: -220px;
}
#feature .large { font-size: 22px; font-weight: bold;}
#feature .large .en { font-size: 25px; font-weight: 700; position: relative;}
#feature .large .en .ruby {
  position: absolute;
  right: -15px;
  bottom: -10px;
  font-size: 10px;
  transform: scale(0.8);
}

@media only screen and (max-width: 782px) {
  #feature h3 {font-size: 20px; padding-left: 65px;}
  #feature .icon_tpa img { left: 0px; width: 50px;margin-top: 0px;}
  #feature .circle { text-align: center; margin-top: 10px;}
  #feature .circle img { left: 0; width: 80px;}
  #feature .circle + p { margin-left: 95px;}
}

table.spec td { text-align: center;}

#models {
  background: #000;
  position: relative;
  border-radius: 0 0 60px 60px;
  color: #fff;
  padding-top: 100px;
  padding-bottom: 60px;
 
}
#modelsIntro { }
#modelsIntro .flex {
  display: flex;
  align-items: flex-end;
  margin-bottom: 6rem;
}
#modelsIntro .flex .text { width: max(490px, calc(100% - 620px)); margin-left: 40px;}
#modelsIntro .flex figure { width: min(calc(100% - 490px),580px); text-align: center;}
#modelsIntro h2 {
  font-size: 80px;
  line-height: 1.2;
  white-space: nowrap;
}
#modelsIntro h3 { margin-top: 20px; font-size: 145%; font-weight: bold;}
#modelsIntro h3.hasIcon {
  display: flex;
  align-items: center;
}
#modelsIntro h3.hasIcon figure {
  margin: 0 0 0 20px;
  width: 122px;
}
#modelsIntro p { margin-top: 10px;}

@media only screen and (max-width: 782px) {
  #modelsIntro .flex { display: block;}
  #modelsIntro .flex .text { width: auto; margin-left: 0px;}
  #modelsIntro .flex figure { width: auto; margin: 20px 0 0 0;}
  #modelsIntro h2 { font-size: 40px; white-space: normal;margin-top: -80px;}
  table.spec td { text-align: left;}
  #modelsIntro h3.hasIcon figure {
    margin-left: 10px;
    width: 70px;
  }
}

#models article {
  margin-top: 120px;
}
#models article > figure {
  position: relative;
  z-index: 1;
}
#models article > figure img { border-radius: 40px;}
#models article .flex {
  display: flex;
  margin: -120px 0 0 0;
  position: relative;
  z-index: 2;
  align-items: flex-start;
}
#models article .flex > figure { width: calc(100% - 740px); text-align: center;}
#models article .flex .text { width: 740px; position: relative;}
#models article .flex .text figure.icon {
  position: absolute;
  right: 40px;
  top: -20px;
}
#models article h2 { margin-top: 45px;}
#models article h2 .small { font-size: 20px; font-weight: bold; display: block;}
#models article h2 .en { font-size: 80px; font-weight: 700; letter-spacing: 0; line-height: 1.3; display: block;}
#models article h3 { margin-top: 10px; line-height: 1.5; font-size: 145%; font-weight: bold;}
#models article.x8pro h3 { color:#f08300;}
#models article.x5d h3 { color:#57c5f9;}
#models article.x3d h3 { color:#fabf13;}
#models article h4 { margin-top: 10px; line-height: 1.4; font-size: 114%; font-weight: bold;}
#models article h4 .small { font-size: 75%;line-height: 1.5; }
#models article table { margin-top: 40px;}
#models article table th { font-weight: normal; text-align: left; padding-right: 10px;}
#models article .myBtn { text-align: right; margin: 40px 40px 0 0;}
#models article .myBtn a { text-align: left;}

@media only screen and (max-width: 782px) {
  #models article {
    margin-top: 60px;
  }
  #models article > figure {
    position: relative;
    z-index: 1;
    width: calc(100% + 15vw);
    margin-left: -7.5vw;
  }
  #models article > figure img { border-radius: 20px;}
  #models article .flex {
    display: block;
    margin: -60px 0 0 0;
    position: relative;
    z-index: 2;
    align-items: flex-start;
  }
  #models article .flex > figure { display: none;}
  #models article .flex .text { width: auto; position: relative;}
  #models article .flex .text figure.icon {
    position: absolute;
    right: -3vw;
    top: -40px;
  }
  #models article .flex .text figure.icon img { width: 90px;}
  #models article h2 { margin-top: 22px;}
  #models article h2 .small { font-size: 11px;}
  #models article h2 .en { font-size: 40px; line-height: 1.2;}
  #models article h3 { margin-top: 10px; line-height: 1.5; font-size: 125%; font-weight: bold;}
  #models article.x8pro h3 { color:#f08300;}
  #models article.x5d h3 { color:#57c5f9;}
  #models article.x3d h3 { color:#fabf13;}
  #models article h4 { margin-top: 20px; line-height: 1.4; font-size: 114%; font-weight: bold;}
  #models article h4 .small { font-size: 75%;line-height: 1.5; }
  #models article table { margin-top: 40px;}
  #models article table th { font-weight: normal; text-align: left; padding-right: 10px;}
  #models article .myBtn { text-align: center; margin: 20px 0px 0 0;}
  #models article .myBtn a { text-align: left;}

}


