@charset "utf-8";

/*
  File Name   : company.css
  Description : 会社案内
*/

.article {
  margin-bottom: 100px;
}

/* intro
============================================================ */
.intro {
  padding: 75px 0 40px;
  text-align: center;
}


/* greeting
============================================================ */
.greeting {
  padding: 100px 0;
  position: relative;
  z-index: 0;
}
.greeting:after {
  content: "";
  position: absolute;
  display: block;
  width: 500%;
  height: 100%;
  left: -250%;
  top: 0;
  background: #f4f3ed;
  z-index: -1;
}
.greeting-header {
  height: 350px;
  background: url(/assets/img/company/bg-greeting-01.jpg) no-repeat center top;
  position: relative;
}
.greeting__ttl {
  position: absolute;
  padding-bottom: 1em;
  top: 50%;
  right: 40px;
  font-size: 25px;
  font-weight: bold;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.greeting__ttl:after {
  content: "";
  position: absolute;
  display: block;
  width: 1.25em;
  height: 0;
  right: 0;
  bottom: 0;
  border-bottom: 1px solid;
}
.greeting__sign {
  position: absolute;
  top: 50%;
  left: 32%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.greeting-inner {
  position: relative;
  margin: 30px 0 0;
}


/* content
============================================================ */
.sec-list > * {
  float: left;
  width: 50%;
  padding: 0 1em;
  text-align: center;
}
.sec-list > :first-child {
  border-right: 1px solid #d7d7d7;
}
.content {
  margin-top: 90px;
}

/* summary
============================================================ */
.summary .content__figure {
  float: left;
  width: 48%;
}
.summary .list-box-01 {
  float: right;
  width: 48%;
}
.summary .list-box-01 .list__item dl > * {
  padding: 1em 0;
}
.summary .list-box-01 .list__item dt {
  width: 90px;
}


/* youtibe
============================================================ */
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}


@media screen and (max-width: 999px) {
/* content
============================================================ */
  .sec-list > * {
    text-align: left;
  }
  .sec-list > * .pc-only {
    display: none;
  }
}


@media screen and (max-width: 767px) {
  .article {
    margin-bottom: 15.625vw;
  }
  
  /* intro
  ============================================================ */
  .intro {
    padding: 3.5em 0 2em;
  }
  .intro__ttl {
    letter-spacing: -.1em;
    white-space: nowrap;
  }
  .intro__desc {
    text-align: left;
  }
  
  /* greeting
  ============================================================ */
  .greeting {
    padding: 7.81vw 0;
  }
  .greeting-header {
    height: 40vw;
    margin: 0 -6.25vw;
    background-size: auto 100%;
  }
  .greeting__ttl {
    padding-bottom: .75em;
    top: 30%;
    right: 6.25vw;
    font-size: 150%;
  }
  .greeting__ttl:after {
    width: 1em;
  }
  .greeting__sign {
    top: 70%;
    left: auto;
    right: 6.25vw;
  }
  .greeting__sign img {
    height: 4em;
    width: auto;
  }
  .greeting-inner {
    margin: 6.25vw 0 0;
  }
  
  
  /* content
  ============================================================ */
  .sec-list > * {
    float: none;
    width: auto;
    padding: 0;
  }
  .sec-list > :first-child {
    border: none;
  }
  .content {
    margin-top: 14.06vw;
  }
  
  
  /* summary
  ============================================================ */
  .summary .content__figure {
    float: none;
    width: auto;
    margin-bottom: 6.25vw;
    text-align: center;
  }
  .summary .list-box-01 {
    float: none;
    width: auto;
  }
  .summary .list-box-01 .list__item dt {
    width: auto;
  }
}