@charset "UTF-8";

/* ==========================================================================
    pages style
============================================================================= */
:root {
  --font1: "Noto Sans JP", sans-serif;
  --font2: "Afacad", sans-serif;
  --font-icon: "Font Awesome 6 Free";
  --main-color: #003f8e;
  --text-color: #222;
  --line-color: #cacaca;
  --accent-color: #cf0000;
  --font-size-22: clamp(1.8rem, 1.5277vw, 2.2rem);
  --font-size-20: clamp(1.6rem, 1.388vw, 2rem);
  --font-size-18: clamp(1.6rem, 1.25vw, 1.8rem);
  --font-size-16: clamp(1.4rem, 1.111vw, 1.6rem);
  --font-size-14: clamp(1.2rem, 0.9722vw, 1.4rem);
}
  .color-nv{
  color: var(--main-color);
  }
  .txt-attention {
  color: var(--accent-color);
  }
/* ページタイトル */
.page-title {
  background-color: var(--main-color);
  height: 34.722vw;
  max-height: 500px;
  min-height: 400px;
  overflow: hidden;
  position: relative;
}
.page-title__hdg {
  -webkit-animation: tracking-in-expand 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s both;
          animation: tracking-in-expand 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s both;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-weight: bold;
  gap: 10px;
  position: absolute;
  top: 56%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 10;
}
.page-title__hdg .en {
  font-family: var(--font2);
  font-size: clamp(6rem, 6.25vw, 9rem);
  line-height: 1;
}
.page-title__hdg .ja {
  font-size: var(--font-size-16);
  letter-spacing: 0.3em;
}
.page-title__img {
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  width: 100%;
}
.page-title__bg {
  -webkit-animation: fade-in 1s ease-out 1s both;
          animation: fade-in 1s ease-out 1s both;
  color: rgba(255,255,255,0.3);
  font-family: var(--font-2);
  font-size: clamp(8rem, 15.277vw, 22rem);
  font-weight: bold;
  line-height: 1;
  position: absolute;
  right: -14px;
  bottom: -18px;
}
/* 写真 */
.figure img {
  border-radius: 30px;
}
/* ==========================================================================
    Company
============================================================================= */
.philosophy-list > li {
  -webkit-margin-after: 60px;
          margin-block-end: 60px;
}
.map {
  aspect-ratio: 1/0.4;
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
}
.map iframe {
  height: 100%;
  width: 100%;
}
@media (max-width: 767.98px) {
  .map {
    aspect-ratio: 2/1.5;
  }
}
.access-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 100px;
}
/*.sdgs-list > li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 20px;
}
.sdgs-list > li + li {
  -webkit-margin-before: 30px;
          margin-block-start: 30px;
}

.sdgs-list > li .details {
  -ms-flex-preferred-size: calc(100% - 140px);
      flex-basis: calc(100% - 140px);
}
.sdgs-list > li .details .c-heading04 {
  -webkit-margin-after: 15px;
          margin-block-end: 15px;
}*/

.sdgs-list > li .ico {
  margin-top: 30px;
  margin-bottom: 60px;
}
.sdgs-list > li .ico img{
  width: 120px;
}
.c-box .c-box_txt{

}
.c-box .c-box_figure{
  
}
@media (max-width: 767.98px) {
  .sdgs-list > li + li {
    -webkit-margin-before: 50px;
            margin-block-start: 50px;
  }
  .sdgs-list > li .ico {
    width: 80px;
  }
  .sdgs-list > li .details {
    -ms-flex-preferred-size: calc(100% - 100px);
        flex-basis: calc(100% - 100px);
  }
}
/*# sourceMappingURL=maps/pages.css.map */
/* ==========================================================================
    news
============================================================================= */
.c-news{
    padding-top: 150px;
    }
/* ==========================================================================
    service_energy
============================================================================= */
.c-table th.txt-nowrap {
  white-space: nowrap;
  vertical-align: middle;
}
.c-table tbody th.width-equal {
  width: 30%;
}
.c-table tbody td.va-top {
    vertical-align: top;
}
.mv-media {
  position: relative;
  width: 100%;
  max-height: 80vh;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #000;
}
.mv-video {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}
.txt-attention {
  color: var(--accent-color);
  font-size: var(--font-size-14);
}
/* ==========================================================================
    contact
============================================================================= */
    .c-form__item {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 1em;
    margin-bottom:30px;
    }
    .c-form__label{
    font-weight: bold;
    white-space: nowrap;
    }
    .icon-attention {
    color: #fff;
    font-size: 1rem;
    background-color: #CF0000;
    padding: 0px 5px;
    margin-left: 1cqh;
    }
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    textarea,
    select{
    border: 1px solid #cacaca;
    border-radius: 5px;
    padding: 0.3rem 1rem;
    }
    input::placeholder,
    textarea::placeholder {
    color:#cacaca;
    }
    input:focus::placeholder,
    textarea:focus::placeholder {
    color: transparent;
    }
    button[type="submit"]:hover {
    transition: all 0.5s;
    }
    .contact-tel{
    font-size: 2.6rem;
    font-weight: bold;
    color: #003F8E;
    }
    .contact-tel::before {
    content: "";
    display: inline-block;
    background: url(../images/common/ico_free_dial-nv.svg) no-repeat center left / contain;
    -webkit-margin-end: 8px;
    margin-inline-end: 8px;
    height: 19px;
    width: 29px;
    }
    .contact-conf_btnarea {
    display: flex;
    justify-content: center;
    }
    .contact-conf_btnarea .c-button{
    margin: 0 20px;
    }
@media (max-width: 767.98px) {
    .contact-conf_btnarea {
    flex-direction: column;
    }
    .contact-conf_btnarea .c-button{
    margin: 15px 0;
    }
}
/* ==========================================================================
    attempt
============================================================================= */
.attempt-column {
    border: 1px solid #ddd;
    border-radius: 30px;
}
/* .attempt-column a{
    padding: 20px;
} */
.attempt-column a:hover {
    background-color: #f8f8f8;
    border-radius: 30px;
}
.attempt-figure{
    text-align: center;
    margin: 25px auto;
}
.attempt-column .figure{
    text-align: center;
    padding: 30px;
}
.attempt-column .txt{
    padding: 0 30px 30px 30px;
}