html {
  -webkit-text-size-adjust: none;
}

.video {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9; /* モダンな縦横比指定 */
  overflow: hidden;
}

.video iframe,
.video embed,
.video object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;       /* 余白防止 */
}




/* デスクトップ */
@media (min-width: 1281px) {

.logomark { width: 40%; }
.features {  width: 60%; }
.feature { width: 20%; }
.logomark02 { width: 20%; }
}


/* ノートPC */
@media (min-width: 1025px) and (max-width: 1280px) { 

.logomark { width: 50%; }
.features {  width: 70%; }
.feature { width: 20%; }
.logomark02 { width: 30%; }
}



/* 中型タブレット */
@media (min-width: 769px) and (max-width: 1024px) { 

.logomark { width: 80%; }
.features {  width: 80%; }
.feature { width: 25%; }
.logomark02 { width: 40%; }
}



/* 大型スマホ・小型タブレット */
@media (min-width: 481px) and (max-width: 768px) { 

.logomark { width: 96%; }
.features {  width: 80%; }
.feature { width: 60%; }
.logomark02 { width: 60%; }
  .subject,
  .subject02 {
    font-size: 32px;
  }

  .hero .subtitle { font-size: 16px; }
  .feature h3 { font-size: 1.2rem; }
  .section { font-size: 16px; }
}




/* スマホ */
@media (max-width: 480px) { 

.logomark { width: 96%; }
.features {  width: 96%; }
.feature { width: 25%; }
.logomark02 { width: 70%; }

 }