/*-- About --*/
.about_wrapper {
  background-color: var(--color-white);
  padding: var(--hspace-sp) 0;
  margin-bottom: var(--hspace-sp);
}

.about_wrapper h2 {
  font-size: 2.6rem;
  font-weight: 700;
  line-height: var(--lineheight-tight);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-primary);
  margin: 0 var(--space-sp) 30px;
}

.about_image {
  margin-bottom: 60px;
}

.about_image img {
  height: 110px;
  object-fit: cover;
}

.about_image img.entrance {
  object-position: 50% 40%;
}

.about_matrix {
  margin: 0 var(--space-sp);
}
img.logo_isms {
  width: 200px;
}
.about_wrapper.access {
  background-color: initial;
  padding-top: 0;
  padding-bottom: 0;
}

.access_text {
  margin: 0 var(--space-sp) 40px;
}
.access_text p {
  margin-bottom: 30px;
}
.access_map iframe {
  width: 100%;
  aspect-ratio: 16/9;
}

.about_image img.building {
  object-position: 50% 33%;
}

.matrix th small {
  font-size: 1.2rem;
  font-weight: 400;
  margin-left: 1rem;
}

.about_wrapper.iso {
  background-color: initial;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0 var(--space-sp) 0;
}

.about_wrapper.iso h2 {
  margin-left: 0;
}

.about_wrapper.iso h3 {
  font-size: 2.2rem;
  font-weight: 700;
  margin: 40px 0 30px;
}
.iso_detail {
  background-color: var(--color-white);
  padding: 40px 20px 10px;
  margin-bottom: 40px;
}

.link_text a {
  margin-bottom: 0;
}





/*------------------------------------------*/
/* tablet(portrait) & smartphone(landscape) */
/*------------------------------------------*/

@media print, screen and (min-width: 560px) {

  /*-- About --*/
  .about_wrapper {
    padding: var(--hspace-tb) 0;
    margin-bottom: var(--hspace-tb);
  }

  .about_wrapper h2 {
    font-size: 3.6rem;
    margin: 0 var(--space-tb) 40px;
  }

  .about_image {
    margin-bottom: 60px;
  }

  .about_image img {
    height: 240px;
  }

  .about_image img.entrance {
    object-position: 50% 40%;
  }

  .about_matrix {
    margin: 0 var(--space-tb);
  }

  .access_text {
    margin: 0 var(--space-tb) 40px;
  }

  .matrix th small {
    display: block;
    margin-left: 0;
  }
  .about_wrapper.iso {
    margin: 0 var(--space-tb) 0;
  }
  
  .about_wrapper.iso h3 {
    font-size: 2.8rem;
    margin: 40px 0;
  }
  .iso_detail {
    padding: 60px 40px;
    margin-bottom: 80px;
  }
}

/*------------------------*/
/* tablet(landscape) & pc */
/*------------------------*/

@media print, screen and (min-width: 960px) {
 
  /*-- About --*/
  .about_wrapper {
    padding: var(--hspace-pc) var(--space-pc);
  }

  .about_inner {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr max-content;
    max-width: var(--width-pc);
  }

  .about_wrapper h2 {
    font-size: 4.2rem;
    margin: 0 0 80px;
    grid-row: 1 / 2;
    grid-column: 1 / 3;
  }

  .about_image {
    width: 320px;
    margin-bottom: 0;
    grid-row: 2 / 3;
    grid-column: 2 / 3;
  }

  .about_image img {
    height: 600px;
  }

  .about_image img.entrance {
    object-position: 50% 40%;
  }

  .about_matrix {
    margin: 0 80px 0 0;
  }

  .about_wrapper.access {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .access_text h2 {
    grid-row: 1 / 2;
    grid-column: 1 / 3;
  }

  .access_text {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
    margin: 0 80px 0 0;
  }

  .access_map {
    width: 580px;
    grid-row: 2 / 3;
    grid-column: 2 / 3;
  }
  .access_map iframe {
    width: 100%;
    aspect-ratio: 16/9;
  }

  .about_image img.building {
    object-position: 50% 33%;
  }

  .matrix th small {
    font-size: 1.4rem;
    margin-left: 0;
    display: block;
  }

  .about_inner2 {
    margin: 0 auto;
    max-width: var(--width-pc);
  }
  .about_wrapper.iso h3 {
    font-size: 3.4rem;
    margin: 60px 0;
  }
  .iso_detail {
    padding: 100px;
    margin-bottom: 80px;
  }
}

@media screen and (min-width: 1280px) {
  .access_map {
    width: 760px;
    grid-row: 2 / 3;
  }
}
