/*=======================================================
==========================================================
　　　　　　　　　　　　　ABOUT CSS
==========================================================
========================================================*/

/* mainのz-indexを上書き */
main {
  z-index: 1 !important;
}

/* ヘッダーロゴ（左上） */
.header__inner h1 a {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  text-decoration: none;
  color: inherit;
}
.header__logo {
  display: block;
  width: auto;
  height: 40px;
}
.header__logo-text {
  font-family: 'en';
  letter-spacing: .1em;
}

/* 代表メッセージ */
.message-block {
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 188, 30, 0.3);
  border-radius: 8px;
  padding: 3rem 3.5rem;
  margin-top: 2rem;
}

.message-lead {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 2.4rem;
  color: #FFBC1E;
  text-align: center;
  margin: 0 0 2.5rem;
  line-height: 1.5;
  letter-spacing: .08em;
}

.message-body {
  max-width: 800px;
  margin: 0 auto;
}

.message-body p {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.5rem;
  color: #fff;
  line-height: 2;
  margin: 0 0 1.8rem;
  letter-spacing: .04em;
}

.message-body p:last-child {
  margin-bottom: 0;
}

.message-sign {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.4rem;
  color: #B5B5B5;
  text-align: right;
  margin: 3rem 0 0;
  letter-spacing: .05em;
}

.message-name {
  font-size: 2rem;
  font-weight: 700;
  color: #fff;
  margin-left: .5em;
}

/* 会社概要 */
.company-block {
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 188, 30, 0.3);
  border-radius: 8px;
  padding: 2.5rem 3rem;
  margin-top: 2rem;
  display: flex;
  flex-direction: row;
  gap: 3rem;
  align-items: flex-start;
}
.company-table,
.business-table {
  flex: 1;
  min-width: 0;
  width: 100%;
  border-collapse: collapse;
}
.company-table tr,
.business-table tr {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.company-table tr:last-child,
.business-table tr:last-child {
  border-bottom: none;
}
.company-table th,
.business-table th {
  color: #FFBC1E;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 1.4rem;
  text-align: left;
  padding: 1em .8em 1em 0;
  white-space: nowrap;
  vertical-align: top;
  width: 6em;
}
.company-table td,
.business-table td {
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.4rem;
  padding: 1em 0;
  line-height: 1.7;
  vertical-align: top;
}

/* 事業案内 */
.business-block {
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 188, 30, 0.3);
  border-radius: 8px;
  padding: 2.5rem 3rem;
  margin-top: 2rem;
}

/* 沿革タイムライン */
.history-block {
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 188, 30, 0.3);
  border-radius: 8px;
  padding: 2.5rem 3rem;
  margin-top: 2rem;
}
.history-list {
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
}
.history-list::before {
  content: '';
  position: absolute;
  left: 11em;
  top: 1.6em;
  bottom: 1.6em;
  width: 2px;
  background: rgba(255, 188, 30, 0.35);
}
.history-list li {
  display: flex;
  align-items: flex-start;
  padding: 1.3em 0;
  position: relative;
}
.history-list li::before {
  content: '';
  position: absolute;
  left: calc(11em - 6px);
  top: 1.8em;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #FFBC1E;
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.45), 0 0 10px rgba(255, 188, 30, 0.6);
  z-index: 1;
}
.history-date {
  flex: 0 0 11em;
  color: #FFBC1E;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1.8;
  padding-right: 1.5em;
  letter-spacing: .04em;
}
.history-content {
  flex: 1;
  padding-left: 2em;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1em;
}
.history-badge {
  display: inline-block;
  background: #FFBC1E;
  color: #000;
  font-family: 'en', 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: .15em;
  padding: .35em .8em;
  border-radius: 3px;
  line-height: 1;
}
.history-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.4rem;
  color: #fff;
  margin: 0;
  line-height: 1.6;
  letter-spacing: .04em;
}
.company-map {
  flex: 1;
  min-width: 0;
  border-radius: 6px;
  overflow: hidden;
}
.company-map iframe {
  display: block;
  width: 100%;
  height: 320px;
  border-radius: 6px;
}


/*=======================================================
==========================================================
　　　　　　　　　　　　　PC only
==========================================================
========================================================*/
@media screen and (min-width:1023px) {

/* PC: ハンバーガー非表示 */
.drawer__button { display: none !important; }

}/*=======================================================
==========================================================
  　　　　　　　　　　　　SP only
==========================================================
========================================================*/
@media screen and (max-width:768px) {

/* SP: ヘッダーロゴ */
.header__logo {
  height: 38px;
}
.header__inner h1 {
  font-size: 18px;
}

.message-block {
  padding: 2rem 1.5rem;
}
.message-lead {
  font-size: 1.8rem;
  margin: 0 0 1.8rem;
}
.message-body p {
  font-size: 1.3rem;
  line-height: 1.9;
  margin: 0 0 1.4rem;
}
.message-sign {
  font-size: 1.2rem;
  margin: 2rem 0 0;
}
.message-name {
  font-size: 1.7rem;
}

/* SP: 会社概要・事業案内・沿革 */
.company-block {
  flex-direction: column;
  padding: 1.8rem 1.5rem;
  gap: 1.5rem;
}
.business-block,
.history-block {
  padding: 1.8rem 1.5rem;
}
/* SP: 沿革タイムラインを縦積みに */
.history-list::before {
  left: 6px;
}
.history-list li {
  flex-direction: column;
  padding: 1em 0 1em 2.2em;
}
.history-list li::before {
  left: 0;
  top: 1.4em;
  width: 12px;
  height: 12px;
}
.history-date {
  flex: none;
  padding-right: 0;
  padding-bottom: .3em;
  font-size: 1.2rem;
}
.history-content {
  padding-left: 0;
  gap: .7em;
}
.history-text {
  font-size: 1.25rem;
}
.history-badge {
  font-size: 1rem;
  padding: .3em .6em;
}
.company-table th,
.business-table th {
  font-size: 1.2rem;
  width: 5em;
  padding: .8em .5em .8em 0;
}
.company-table td,
.business-table td {
  font-size: 1.2rem;
  padding: .8em 0;
}
.company-map iframe {
  height: 240px;
}

}/*=======================================================
==========================================================
  　　　　　　　　　　　　Ipad only
==========================================================
========================================================*/
@media screen and (min-width:768px) and ( max-width:1023px) {

.message-block {
  padding: 2.5rem 2.5rem;
}
.message-lead {
  font-size: 2.2rem;
}

/* iPad: 会社概要・事業案内・沿革 */
.company-block {
  padding: 2rem 2.2rem;
  gap: 2rem;
}
.business-block,
.history-block {
  padding: 2rem 2.2rem;
}
.company-map iframe {
  height: 280px;
}
.history-list::before { left: 9em; }
.history-list li::before { left: calc(9em - 6px); }
.history-date { flex: 0 0 9em; }

}/*=======================================================
==========================================================
　　　　　　　　　　　　　共通コード
==========================================================
========================================================*/