@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap");
.pc {
  display: block;
}

.sp {
  display: none;
}

.sticky-box{
position:sticky;
top:60px;}

.sans{
font-family:"source-han-sans-japanese", sans-serif}

@media (max-width: 933px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}



html {
  scroll-behavior: smooth;
  font-size: 10px;
  background: #fff;
}
html body {
  font-family: "fot-tsukuaoldmin-pr6n", serif;
  font-weight: 300;
  font-style: normal;
  color: #fff;
  text-align: center;
}
html body section {
  width: 100%;
  padding: min(5.2083333333vw, 100px) min(0vw, 0px) min(5.2083333333vw, 100px) min(0vw, 0px);
  overflow-x:hidden;
}
html body .contents {
  margin: 0 auto;
}
html body .bold {
  font-weight: bold;
}
html body .ao {
  color: #00499a;
}
html body .kuro {
  color: #333;
}
html body .siro {
  color: #fff;
}
html body img {
  width: 100%;
  height: auto;
}
html body .t-left {
  text-align: left;
}
html body .main-h2 {
  font-size: clamp(8px, 2.586953125vw, 49.6695px);
  line-height: 1.6;
}
html body h2 {
  font-size: clamp(8px, 1.9270833333vw, 37px);
  line-height: min(3.612203125vw, 69.3543px);
  color: #00499a;
}

.en-page h2,.en-page h3,.en-page p{
  font-family: "source-han-sans-japanese", sans-serif;}


html body .w-h2 {
  font-size: clamp(8px, 2.0833333333vw, 40px);
  color: #fff;
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 100;
  font-style: normal;
  letter-spacing: min(0.2604166667vw, 5px);
}
html body h3 {
  font-size: clamp(12px, 1.3541666667vw, 26px);
  line-height: min(1.1811041667vw, 22.6772px);
}
html body h4 {
  font-size: clamp(8px, 1.0416666667vw, 20px);
  line-height: min(1.1811041667vw, 22.6772px);
  border-bottom: 1px solid #00499a;
  padding-bottom: min(0.78125vw, 15px);
  margin-bottom: min(1.0416666667vw, 20px);
}
html body p {
  font-size: clamp(11px, 1.3020833333vw, 25px);
  line-height: min(2.8830364583vw, 55.3543px);
}
html body .p-card {
  font-size: clamp(8px, 0.9375vw, 18px);
  line-height: min(1.7798541667vw, 34.1732px);
}
html body a {
  text-decoration: none;
  font-size: clamp(8px, 1.0416666667vw, 20px);
}
html body li {
  list-style: none;
  font-size: clamp(8px, 0.8333333333vw, 16px);
  line-height: min(2.6041666667vw, 50px);
}
html body footer {
  width: 100%;
}
@media (max-width: 933px) {
  html body .contents {
    margin: 0 auto;
  }
  html body section {
    width: 100%;
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  html body .main-h2 {
    font-size: 7.2vw;
    line-height: 1.2;
  }
  html body h2 {
    font-size: 4.8vw;
    line-height: 8.9356vw;
  }
  html body .w-h2 {
  font-size: clamp(18px, 3.3vw, 28px);
    letter-spacing: 0.6666666667vw;
    margin-top: 10.6666666667vw;
    font-weight: 400;
        line-height: 1.6;
  }
  html body h3 {
  font-size: clamp(17px, 3vw, 26px);
    line-height: 1.6;
  }
  html body h4 {
    font-size: 3.7333333333vw;
    line-height: 5.07872vw;
    border-bottom: 1px solid #fff;
    padding-bottom: 2.6666666667vw;
    margin-bottom: 3.2vw;
  }
  html body .p-main {
    font-size: 3.7333333333vw;
    line-height: 8.3917866667vw;
  }
  html body p {
  font-size: clamp(14px, 2.4vw, 22px);
    line-height: 1.6;
  }
  html body .p-kuro {
    font-size: 3.4666666667vw;
    line-height: 7.29448vw;
  }
  html body .p-card {
    color: ;
 font-size: clamp(11px, 3.4666666vw, 18px);
    line-height: 1.8;
    font-weight: 200;
  }
}

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

*, *::before, *::after {
  box-sizing: border-box;
}

body {
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
  letter-spacing: 0.05em;
  color: #000;
  font-feature-settings: "palt";
  font-family: "游ゴシック体", YuGothic, "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 400;
  line-height: 1.6;
  /* background: $col-black; */
}

img {
  vertical-align: bottom;
  width: 100%;
  height: auto;
}

/* iOSでのデフォルトスタイルをリセット */
input[type=submit],
input[type=button],
input[type=date] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  -moz-appearance: button;
       appearance: button;
  border: none;
  box-sizing: border-box;
}
input[type=submit]:-webkit-search-decoration,
input[type=button]:-webkit-search-decoration,
input[type=date]:-webkit-search-decoration {
  display: none;
}
input[type=submit]:focus,
input[type=button]:focus,
input[type=date]:focus {
  outline-offset: -2px;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.nunito {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.tsuku-oldmin {
  font-family: "fot-tsukuaoldmin-pr6n", serif;
  font-weight: 300;
  font-style: normal;
}

/* Light */
.shs-light {
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 200;
  font-style: normal;
}

/* Normal */
.shs-normal {
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 300;
  font-style: normal;
}

/* Regular */
.shs-regular {
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.futura {
  font-family: "Futura", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.system__img {
  width: min(24.6484166667vw, 473.2496px);
  height: min(13.260578125vw, 254.6031px);
}

.system__img2 {
  width: min(13.2779114583vw, 254.9359px);
  height: min(6.6389583333vw, 127.468px);
}

.intel__img1 {
  width: min(9.2063802083vw, 176.7625px);
  height: min(6.4470364583vw, 123.7831px);
}

.intel__img2 {
  width: min(7.93528125vw, 152.3574px);
  height: min(6.21596875vw, 119.3466px);
}

.exclusive__img1 {
  width: min(13.2374947917vw, 254.1599px);
}

.exclusive__img2 {
  width: min(6.715296875vw, 128.9337px);
}

.exclusive__img3 {
  width: min(15.3014375vw, 293.7876px);
}

.exclusive__img4 {
  width: min(11.783171875vw, 226.2369px);
}

.color-variation__img {
  width: min(15.1385052083vw, 290.6593px);
}

.full-slide__img1 {
  width: min(13.6004791667vw, 261.1292px);
  height: min(9.1541666667vw, 175.76px);
}

.full-slide__img2 {
  width: min(23.47125vw, 450.648px);
}

.full-slide__img3 {
  width: min(18.7934791667vw, 360.8348px);
}

@media (max-width: 933px) {


  .system__img {
    width: 88.2466133333vw;
    height: auto;
    background-color: #fff;
    padding: 2.6666666667vw;
  }
  .system__img2 {
    width: 88.75416vw;
    height: auto;
  }
  
  .system__img3{
      width:100%
  }
  
  .full-slide__img1 {
    width: 100%;
    height: auto;
    margin-top: 5.3333333333vw;
  }
  .full-slide__img2 {
    width: 100%;
    height: auto;
    margin-top: 5.3333333333vw;
  }
  .full-slide__img3 {
    width: 100%;
    height: auto;
  }
  .exclusive__img1 {
    width: 45%;
  }
  .exclusive__img2 {
    width: 31%;
  }
  .exclusive__img3 {
    width: 48%;
    margin-top: 5.3333333333vw;
  }
  .exclusive__img4 {
    width: 48%;
    margin-top: 5.3333333333vw;
  }
  .color-variation__img {
    width: 26.13504vw;
  }
}
.button {
  display: inline-block;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  color: #fff;
  background-color: black;
  border: none;
  border-radius: 0.25rem;
  cursor: pointer;
  text-align: center;
  transition: background-color 0.3s;
}
.button--primary {
  background-color: black;
}
.button--primary:hover {
  background-color: black;
}
.button--secondary {
  background-color: black;
}
.button--secondary:hover {
  background-color: rgb(25.5, 25.5, 25.5);
}
.button--disabled {
  background-color: #666666;
  color: black;
  cursor: not-allowed;
}

.w-box {
  margin: min(2.0833333333vw, 40px) min(0vw, 0px) min(1.5625vw, 30px) min(0vw, 0px);
  padding: min(0.8333333333vw, 16px) min(1.4583333333vw, 28px) min(0.8333333333vw, 16px) min(1.4583333333vw, 28px);
  border: 1px #fff solid;
  display: inline-block;
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 100;
  font-style: normal;
  letter-spacing: 1.5px;
  line-height:1.6
}

.card {
  background-color: #fff;
  padding: min(1.3541666667vw, 26px) min(1.0416666667vw, 20px) min(1.3541666667vw, 26px) min(1.0416666667vw, 20px);
  display: block;
}

@media (max-width: 933px) {
  .w-box {
    margin: 8vw 0vw 8vw 0vw;
    padding: 2.1333333333vw 2.1333333333vw 2.1333333333vw 2.1333333333vw;
    font-size: 3.4666666667vw;
    letter-spacing: 1px;
  }
  .card {
    background-color: transparent;
    padding: 0;
    display: block;
  }
}
.main-header-inner {
  padding: 0;
}

.fv {
  padding: 0;
}
.fv__contents {
  position: relative;
}
.fv__txtarea {
  text-align: center;
  position: absolute;
  top: 10%;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  right: 0;
  left: 0;
}
.fv__ttl {
  font-size: clamp(8px, 6.3020833333vw, 121px);
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  font-style: normal;
  margin-top: min(2.6041666667vw, 50px);
  background: linear-gradient(180deg, #00aeef 5%, #00499a 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.fv__ttl--sub {
  font-size: clamp(8px, 4.2708333333vw, 82px);
  display: block;
}
.fv__ttl .tm {
  font-size: 0.5em;
  vertical-align: super;
}
.fv__logo {
  width: min(11.270203125vw, 216.3879px);
  height: min(3.7072083333vw, 71.1784px);
  margin: 0 auto;
}
@media (max-width: 933px) {
  .fv__contents {
    position: relative;
  }
  .fv__txtarea {
    text-align: left;
    position: absolute;
    top: 5%;
    display: flex;
    flex-flow: column;
    align-items: baseline;
    justify-content: center;
    margin: 0 auto;
    width: 90%;
  }
  .fv__ttl {
    line-height: 16.2666666667vw;
    font-size: 14.7034133333vw;
    font-family: futura-pt, sans-serif;
    font-weight: 500;
    font-style: normal;
    margin-top: 16vw;
    background: linear-gradient(180deg, #00aeef 5%, #00499a 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .fv__ttl--sub {
    line-height: 10.6666666667vw;
    font-size: 8.9631466667vw;
    display: block;
    margin-bottom: 8vw;
  }
  .fv__logo {
    width: 31.4289333333vw;
    height: 10.3382133333vw;
    margin: 0 auto;
  }
}

.main {
  background: url(../../chronos2025/images/main_bg.webp) no-repeat;
  background-size: cover;
  padding: min(7.8125vw, 150px) min(0vw, 0px) min(5.8854166667vw, 113px) min(0vw, 0px);
}
.main__ttl {
  margin-bottom: min(4.6875vw, 90px);
}
.main__img-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: min(53.3333333333vw, 1024px);
  margin: min(3.6458333333vw, 70px) auto min(0vw, 0px) auto;
}
.main__img {
  width: min(10.3957760417vw, 199.5989px);
  height: min(10.4477552083vw, 200.5969px);
}
@media (max-width: 933px) {
  .main {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
    text-align: left;
    background: url(../../chronos2025/images/main_bg_sp.webp) no-repeat;
    background-size: cover;
    padding-top: 13.3333333333vw;
    height: 282.4770133333vw;
  }
  .main__contents {
    width: 91.7333333333vw;
  }
  .main__img-area.pc {
    display: none;
  }
}

.imgarea__movie {
  width: min(49.6262291667vw, 952.8236px);
  height: min(27.9095104167vw, 535.8626px);
}
@media (max-width: 933px) {
  .imgarea .imgarea {
    text-align: center;
  }
  .imgarea .imgarea__movie-area {
    padding-top: 16vw;
    width: 90%;
    margin: 0 auto;
  }
  .imgarea .imgarea__movie {
    width: 100%;
    height: 50.6666666667vw;
  }
}

.challenge {
  background: url(../../chronos2025/images/challenge_bg.webp) no-repeat;
  background-size: cover;
}
.challenge__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .challenge {
    background: url(../../chronos2025/images/challenge_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 154.6666666667vw;
  }
}

.system {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.system__ttl {
  position: relative;
  z-index: 2;
}
.system__ttl::after {
  z-index: -1;
  position: absolute;
  content: "High Resolution Engineering System";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}


.system__grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: min(3.6979166667vw, 71px) auto min(0vw, 0px) auto;
  width: min(63.5387135417vw, 1219.9433px);
}
.system__card {
  width: min(30.2213697917vw, 580.2503px);
  height: min(29.7517552083vw, 571.2337px);
}

.system__card2{
width:100%!important;
height:100%!important}

.intel__card2{
width:100%!important;
height:100%!important}

.system__card--blue {
  text-align: center;
  width: min(13.57309375vw, 260.6034px);
  background-color: #00499a;
  padding: min(0.2604166667vw, 5px) min(0vw, 0px) min(0.2604166667vw, 5px) min(0vw, 0px);
  display: block;
  margin: min(1.0416666667vw, 20px) auto min(0vw, 0px) auto;
}
.system__img--area {
  text-align: center;
  margin-top: min(0.5208333333vw, 10px);
}
.system__img--flex {
  display: flex;
  justify-content: space-between;
  margin-top: min(5.2083333333vw, 100px);
}
@media (max-width: 933px) {
  .system {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .system__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "High Resolution \a Engineering System";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 6.6666666667vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .system__txt {
    font-weight: 200;
  }
  .system__grid {
    flex-flow: column;
    width: 92.8vw;
  }
  
  .card{
      padding:1.2em}

  .system__card {
          margin-top: 8vw;
    width: 100%;
    height: auto;
  }
  .system__subttling {
    text-align: center;
  }
  .system__img--area {
    margin-top: 2.6666666667vw;
  }
  .system__img--flex {
    flex-flow: column;
    margin-top: 5.3333333333vw;
  }
  .system__img--flex img {
    margin-bottom: 4vw;
  }
}

.technology {
  background: url(../../chronos2025/images/technology_bg.webp) no-repeat;
  background-size: cover;
}
.technology__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .technology {
    background: url(../../chronos2025/images/technology_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 186.5201333333vw;
  }
}

.full-slide {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.full-slide__ttl {
  position: relative;
  z-index: 2;
}
.full-slide__ttl::after {
  z-index: -1;
  position: absolute;
  content: "Drawer system Designed for Peace";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}
.full-slide__grid {
  display: flex;
  justify-content: space-between;
  margin-top: min(3.6979166667vw, 71px);
}
.full-slide__contents {
  width: min(83.2815104167vw, 1599.005px);
}
.full-slide__card {
  width: min(26.0754166667vw, 500.648px);
  height: min(23.1242291667vw, 443.9852px);
}
.full-slide__card--blue {
  text-align: center;
  width: min(13.57309375vw, 260.6034px);
  background-color: #00499a;
  padding: min(0.2604166667vw, 5px) min(0vw, 0px) min(0.2604166667vw, 5px) min(0vw, 0px);
  display: block;
  margin: min(1.0416666667vw, 20px) auto min(0vw, 0px) auto;
}
.full-slide__img1 {
  position: relative;
}
.full-slide__img1::after {
  content: "";
  background: url(../images/full-slide_img1.webp) no-repeat;
  background-size: contain;
  width: min(13.6004791667vw, 261.1292px);
  height: min(9.1541666667vw, 175.76px);
  display: inline-block;
  position: absolute;
  bottom: min(1.0416666667vw, 20px);
  right: min(1.0416666667vw, 20px);
}
.full-slide__img--area {
  text-align: center;
}
@media (max-width: 933px) {
  .full-slide {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .full-slide .full-slide__img1::after {
    display: none;
  }
  .full-slide__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "Drawer system \a Designed for Peace";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 0vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .full-slide__contents {
    width: 92.8vw;
  }
  .full-slide__grid {
    flex-flow: column;
    margin-top: 13.3333333333vw;
  }
  .full-slide__card {
    width: 100%;
    height: auto;
    margin-bottom: 9.3333333333vw;
  }
  .full-slide__card--blue {
    text-align: center;
    width: 69.49424vw;
    padding: 0vw;
    display: block;
    margin: 5.3333333333vw auto 0vw auto;
  }
  .full-slide__subttling {
    text-align: center;
  }
  .full-slide__img--area {
    background-color: #fff;
  }
}

.worthy {
  background: url(../../chronos2025/images/worthy_bg.webp) no-repeat;
  background-size: cover;
}
.worthy__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .worthy {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
    background: url(../../chronos2025/images/worthy_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 134.10288vw;
  }
  .worthy__ttl {
    /* 中身は透明にすることで縁のみ見せる */
    text-shadow: 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 5px white;
  }
}

.incubator {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.incubator__ttl {
  position: relative;
  z-index: 2;
}
.incubator__ttl::after {
  z-index: -1;
  position: absolute;
  content: "Optimized Incubator System";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}
.incubator__card {
  width: min(36.4859791667vw, 700.5308px);
  margin: min(2.6041666667vw, 50px) auto min(0vw, 0px) auto;
}
@media (max-width: 933px) {
  .incubator {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .incubator__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "Optimized \aIncubator System";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 0vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .incubator__contents {
    width: 92.8vw;
  }
  .incubator .w-box {
    font-size: 2.8533333333vw;
    padding: 2.1333333333vw 2.1333333333vw 2.1333333333vw 2.1333333333vw;
    letter-spacing: 0;
  }
  .incubator__card {
    width: 100%;
    margin: 9.3333333333vw 0vw 9.3333333333vw 0vw;
  }
  .incubator__card h4 {
    text-align: center;
  }
}

.future {
  background: url(../../chronos2025/images/future_bg.webp) no-repeat;
  background-size: cover;
}
.future__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .future {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
    background: url(../../chronos2025/images/future_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 125.3333333333vw;
  }
  .future__ttl {
    /* 中身は透明にすることで縁のみ見せる */
    text-shadow: 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 5px white;
  }
  .future__txt {
    margin-top: 5.3333333333vw;
  }
}

.intel {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.intel__ttl {
  position: relative;
  z-index: 2;
}
.intel__ttl::after {
  z-index: -1;
  position: absolute;
  content: "Updated Astec Image Intelligence";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}
.intel__grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: min(3.6979166667vw, 71px);
}
.intel__contents {
  width: min(66.98615625vw, 1286.1342px);
}
.intel__card {
  width: min(32.3113765625vw, 620.37843px);
  height: min(18.6082447917vw, 357.2783px);
}
.intel__card--flex {
  display: flex;
  justify-content: space-between;
}
.intel__img--area {
  text-align: center;
  display: flex;
  align-items: center;
  flex-flow: column;
}
.intel__img--area img {
  margin-bottom: min(0.5208333333vw, 10px);
}
@media (max-width: 933px) {
  .intel {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .intel__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "Updated Astec \aImage Intelligence";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 0vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .intel__contents {
    width: 92.8vw;
  }
  .intel .w-box {
    font-size: 2.8533333333vw;
    padding: 2.1333333333vw 2.1333333333vw 2.1333333333vw 2.1333333333vw;
    letter-spacing: 0;
  }
  .intel__grid {
    flex-flow: column;
  }
  .intel__card {
    width: 100%;
    margin-top: 8vw;
    height: auto;
  }
  .intel__card h4 {
    text-align: center;
  }
  .intel__card--flex {
    flex-flow: column;
  }
  .intel__img--area {
    flex-flow: row;
  }
  .intel__img--area img {
    width: 100%;
    height: auto;
    margin-top: 3.4666666667vw;
  }
}

.reson {
  background: url(../../chronos2025/images/reson_bg.webp) no-repeat;
  background-size: cover;
}
.reson__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .reson {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
    background: url(../../chronos2025/images/reson_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 170.3274133333vw;
  }
}

.exclusive {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.exclusive__ttl {
  position: relative;
  z-index: 2;
}
.exclusive__ttl::after {
  z-index: -1;
  position: absolute;
  content: "Dedicated Dish “suregrip™”“EmbryoPod”";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}
.exclusive__card {
  width: min(63.0990416667vw, 1211.5016px);
  margin: min(1.5625vw, 30px) auto min(0vw, 0px) auto;
}
.exclusive__card--flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.exclusive__card--txt {
  width: 60%;
}
.exclusive__card--txt.no-img {
  width: 100%;
}
.exclusive__card--txt h4 {
  width: min(30.118765625vw, 578.2803px);
}
.exclusive__card--img {
  width: 45%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 933px) {
  .exclusive {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .exclusive__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "Dedicated Dish \a“suregrip™”“EmbryoPod”";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 0vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .exclusive__contents {
    width: 92.8vw;
  }
  .exclusive .w-box {
    display: block;
  }
  .exclusive__grid {
    flex-flow: column;
  }
  .exclusive__card {
    width: 100%;
    margin-top: 8vw;
    height: auto;
  }
  .exclusive__card h4 {
    text-align: center;
    width: 100%;
  }
  .exclusive__card--flex {
    flex-flow: column;
  }
  .exclusive__card--txt {
    width: 100%;
  }
  .exclusive__card--img {
    width: 100%;
  }
  .exclusive__img--area {
    flex-flow: row;
  }
  .exclusive__img--area img {
    width: 100%;
    height: auto;
    margin-top: 3.4666666667vw;
  }
}

.harmony {
  background: url(../../chronos2025/images/harmony_bg.webp) no-repeat;
  background-size: cover;
}
.harmony__ttl {
  margin-bottom: min(3.6458333333vw, 70px);
}
@media (max-width: 933px) {
  .harmony {
    padding: 12vw 0vw 13.3333333333vw 0vw;
    background: url(../../chronos2025/images/harmony_bg_sp.webp) no-repeat;
    background-size: cover;
    height: 127.1678666667vw;
  }
  .harmony__ttl {
    /* 中身は透明にすることで縁のみ見せる */
    text-shadow: 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 5px white;
  }
  .harmony__txt {
    margin-top: 5.3333333333vw;
    text-shadow: 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 5px white;
  }
}

.color-variation {
  background: linear-gradient(135deg, #1ba2de, #00499a);
}
.color-variation__ttl {
  position: relative;
  z-index: 2;
}
.color-variation__ttl::after {
  z-index: -1;
  position: absolute;
  content: "Available in 5 Different Colors";
  font-size: clamp(8px, 3.3854166667vw, 65px);
  color: rgba(29, 73, 154, 0.4);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  top: max(-1.3020833333vw, -25px);
  left: 0;
  right: 0;
  letter-spacing: min(0.0520833333vw, 1px);
}
.color-variation__img-area {
  margin: 2.6666666667vw 0vw 1.3333333333vw 0vw;
}
.color-variation__dis {
  font-size: clamp(8px, 1.0416666667vw, 20px);
  font-weight: 100;
  letter-spacing: 2px;
}
.color-variation__table-area {
  display: flex;
  justify-content: space-between;
  flex-flow: wrap;
  width: min(54.8349010417vw, 1052.8301px);
  margin: min(2.6041666667vw, 50px) auto min(0vw, 0px) auto;
}
.color-variation__table--baiyou {
  width: min(23.21734375vw, 445.773px);
}
.color-variation__table--satuei {
  width: min(28.1924895833vw, 541.2958px);
}
.color-variation__table--hukki {
  width: min(31.92384375vw, 612.9378px);
  margin-top: min(1.8229166667vw, 35px);
}
.color-variation__table--denneyoku {
  width: min(19.485984375vw, 374.1309px);
  margin-top: min(1.8229166667vw, 35px);
}
.color-variation__table {
  width: 100%;
}
.color-variation__table td,
.color-variation__table th {
  border: solid 1px #fff;
  padding: min(0.15625vw, 3px) min(0vw, 0px) min(0.15625vw, 3px) min(0vw, 0px);
  font-size: clamp(8px, 0.9375vw, 18px);
}
.color-variation__table td {
  padding-left: min(1.0416666667vw, 20px);
  border-right: none;
}
.color-variation__table th {
  border-left: none;
}
.color-variation__table-ttl {
  font-size: clamp(8px, 0.9375vw, 18px);
  display: block;
  margin-bottom: min(0.5208333333vw, 10px);
}
.color-variation__table-ttl.gas {
  display: block;
  margin-top: min(1.6145833333vw, 31px);
}
@media (max-width: 933px) {
  .color-variation {
    padding: 13.3333333333vw 0vw 13.3333333333vw 0vw;
  }
  .color-variation__ttl::after {
    text-align: left;
    z-index: -1;
    position: absolute;
    content: "Available in \a 5 Different Colors";
    white-space: pre;
    font-size: 6.6666666667vw;
    top: -10.6666666667vw;
    left: 0vw;
    letter-spacing: 0.2666666667vw;
    line-height: 7.5528vw;
  }
  .color-variation__contents {
    width: 92.8vw;
  }
  .color-variation .w-box {
    font-size: 2.8533333333vw;
    padding: 2.1333333333vw 2.1333333333vw 2.1333333333vw 2.1333333333vw;
    letter-spacing: 0;
  }
  .color-variation__table-area {
    width: 90.6666666667vw;
    flex-flow: column;
  }
  .color-variation__dis {
    font-size: 1.86624vw;
    letter-spacing: normal;
  }
  .color-variation__table th, .color-variation__table td {
	font-size:clamp(15px, 2.3vw, 20px);
    padding: 1.3333333333vw 0vw 1.3333333333vw 0vw;
  }
  .color-variation__table td {
    padding-left: 2.1333333333vw;
    border-right: none;
  }
  .color-variation__table--baiyou {
    width: 100%;
  }
  .color-variation__table--satuei {
    width: 100%;
  }
  .color-variation__table--hukki {
    width: 100%;
    margin: 0;
  }
  .color-variation__table--denneyoku {
    width: 100%;
    margin: 0;
  }
  .color-variation__table-ttl {
    font-size: 2.9333333333vw;
    display: block;
    margin: 5.3333333333vw 0vw 1.3333333333vw 0vw;
  }
  .color-variation__table-ttl.gas {
    margin: 5.3333333333vw 0vw 1.3333333333vw 0vw;
  }
}

.contact {
  padding-bottom: min(7.8125vw, 150px);
}
.contact__download {
  display: inline-block;
  font-size: clamp(8px, 1.4458697917vw, 27.7607px);
  width: min(23.6962083333vw, 454.9672px);
  height: min(4.6859427083vw, 89.9701px);
  box-sizing: border-box;
  background: linear-gradient(135deg, #1ba2de, #00499a);
  display: flex;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  color: #fff;
  letter-spacing: min(0.15625vw, 3px);
  position: relative;
  transition: all 1.3s;
}
.contact__download::after {
  content: ">";
  font-size: clamp(8px, 1.4458697917vw, 27.7607px);
  font-family: "fot-tsukuaoldmin-pr6n";
  position: absolute;
  top: min(0.9375vw, 18px);
  right: min(1.3020833333vw, 25px);
  transform: scaleY(2);
  font-weight: 100;
}
.contact__download:hover {
  background: #000;
}
.contact__ttl {
  margin: min(6.25vw, 120px) min(0vw, 0px) min(1.5625vw, 30px) min(0vw, 0px);
  background: linear-gradient(180deg, #00aeef 5%, #00499a 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.contact__txt {
  margin-bottom: min(4.4270833333vw, 85px);
}
.contact__btn {
  display: inline-block;
  width: min(16.71875vw, 321px);
  height: min(4.0104166667vw, 77px);
  font-size: clamp(8px, 1.4458697917vw, 27.7607px);
  display: flex;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  letter-spacing: min(0.15625vw, 3px);
  position: relative;
  transition: all 0.3s;
  background: linear-gradient(180deg, #00aeef 5%, #00499a 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  border: 2px solid transparent;
  /* まず透明で確保 */
  -o-border-image: linear-gradient(180deg, #00aeef 5%, #00499a 90%) 1;
     border-image: linear-gradient(180deg, #00aeef 5%, #00499a 90%) 1;
  font-family: auto;
  font-weight: bold;
}
.contact__btn::after {
  content: ">";
  font-size: clamp(8px, 1.4458697917vw, 27.7607px);
  font-family: "fot-tsukuaoldmin-pr6n";
  position: absolute;
  top: min(0.3125vw, 6px);
  right: min(1.3020833333vw, 25px);
  transform: scaleY(2);
  background: linear-gradient(180deg, #00aeef 5%, #00499a 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.contact__btn:hover {
  background: linear-gradient(135deg, #1ba2de, #00499a);
  -webkit-text-fill-color: #fff;
  border: #fff solid 2px;
}
.contact__btn:hover::after {
  -webkit-text-fill-color: #fff;
}
@media (max-width: 933px) {
  .contact {
    padding: 13.3333333333vw 0vw 21.3333333333vw 0vw;
    background: linear-gradient(180deg, transparent 75%, #cacaca 100%);
  }
  .contact__ttl {
    margin: 26.6666666667vw 0vw 13.3333333333vw 0vw;
    font-size: 11.7333333333vw;
    font-family: futura-pt, sans-serif;
    font-weight: 500;
    background: linear-gradient(180deg, #00aeef 0%, #00499a 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .contact__txt {
    font-size: 3.89544vw;
    margin-bottom: 13.3333333333vw;
    line-height: 8.6990933333vw;
    font-weight: 400;
  }
  .contact .contact__btn {
    width: 55.4666666667vw;
    height: 12.8vw;
    font-size: 3.89544vw;
  }
  .contact .contact__btn::after {
    content: ">";
    position: absolute;
    top: 1.3333333333vw;
    right: 7.7333333333vw;
    font-size: 14.6079px;
  }
  .contact .contact__download::after {
    content: ">";
    position: absolute;
    top: 3.2vw;
    right: 7.7333333333vw;
    font-size: 14.6079px;
  }
  .contact .contact__download {
    font-size: 4.8vw;
    width: 78.6666666667vw;
    height: 15.5564vw;
  }
}