@charset "UTF-8";


/*========================= 汎用 ==============================*/
@media (hover: hover) {
  .detail-content a:hover {
    text-decoration: none;
  }
}


/*========================= TOPページ ==============================*/

.top-mv-video {
    position: relative;
}

/*画面拡大時にズレるので↑に移動*/
.top-mv-video-inner {
  position: static;
}

.top-mv-video {
  flex-grow: 4;
}


/*========================= アトムズの強み ==============================*/

/* ロゴサイズ */
.logo-shoa img {
  width: 174px;
}

.logo-otake img {
  width: 280px;
}
.logo-okabe img {
  width: 300px;
}


/*========================= 製品一覧 ==============================*/

/* サムネイルサイズをOGP比率に */
.products-list-link .products-img::before {
  padding-top: calc(100% * (63 / 120));
}


/*========================= 製品詳細 ==============================*/

/* 商品詳細： <h1> 改行調整 */
.products-detail-ttl {
  word-break: keep-all;
}

/* <h2> 複数行への対応 */
.products-detail-section-ttl {
  line-height: 120%;
}

/* 冒頭ボタンエリアのレイアウト変更 */
.products-detail-btn-wrap {
  grid-template-columns: repeat(2, 1fr);
}

.products-detail-btn-wrap .products-catalog-btn {
  grid-column: 1 / 3;
}

/* ノートPC表示対応 */
.products-detail-sticky {
  padding-top: 0;
}

/*「図面を見る (資料ダウンロードページ)」ボタン用
.mdl-btn-2x {
  width: calc(200% + 8px);
} */

@media (min-width: 768px) {
.products-detail-info-block {
  padding: 48px 24px 80px;
}
}

@media (max-width: 767px) {
/* 資料ボタン調整 */
.mdl-btn-icon {
  padding-inline: 12px 32px;
}
}


/* 見出し風 ラベル */
.label-mt {
  background-color: #daeef2;
  padding: 4px 10px;
  display: inline-block;
  border-radius: 6px;
}

.label-epdm {
  background-color: #f1e2d6;
  padding: 4px 10px;
  display: inline-block;
  border-radius: 6px;
}

/* 表の調整 */
.detail-content th {
  line-height: 140%;
  height: 34px;
}

.detail-content td {
  height: 34px;
}

/* 横2段（KC用） */
.detail-flow .listmanual img {
  margin-bottom: 8px;
  width: 100%;
}

@media (min-width: 768px) {
.detail-flow {
  display: flex;
  justify-content: space-between;
}
.detail-flow .listmanual {
  width: calc(50% - 15px);
}
}


/* 本文内の画像幅を制限 */
@media (min-width: 768px) {
.width-50,
.detail-content img.width-50 {
  max-width: 50%;
}
.width-60,
.detail-content img.width-60 {
  max-width: 60%;
}
.width-70,
.detail-content img.width-70 {
  max-width: 70%;
}
.width-80,
.detail-content img.width-80 {
  max-width: 80%;
}
.width-100,
.detail-content img.width-100 {
  width: 100%;
  max-width: 100%;
}
}


/*========================= 資料ダウンロード ==============================*/

/* H2 へのアンカーリンク対策 */
.post-type-archive-download h2 {
  margin-top: -100px;
  padding-top: 100px;
}


/*========================= 共通MV ==============================*/

.mdl-subpage-head::before,
.strengths-head::before {
  background-image: url(../images/common/common_head_bg.webp);
  opacity: .6;
}


/*========================= 社員インタビュー用 ==============================*/

.recruit-head h1 {
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.4), 0 0 12px rgba(255, 255, 255, 0.2);
}

.recruit-schedule-section.recruit-schedule-section-02 {
  background-image: url(../images/recruit/recruit_02_schedule_bg.webp);
}


/*========================= スマホで電話番号の文字色が変わる事への対策 ==============================*/

.footer-address a {
  color: inherit;
  text-decoration: none;
}


/*========================= 採用メッセージ用 ==============================*/

.recruit-message-bg {
  background: url(../images/recruit/recruit_message_bg.webp) no-repeat top center;
  background-size: cover;
  position: relative;
}


/*========================= お知らせ用 ==============================*/

.detail-content-datetime {
  width: 100%;
}


/*========================= スペース調整 ==============================*/

.mt8 {
  margin-top: 8px !important;
}

.mt16 {
  margin-top: 16px !important;
}

.mt24 {
  margin-top: 24px !important;
}

.mt32 {
  margin-top: 32px !important;
}

.mb8 {
  margin-bottom: 8px !important;
}

.mb16 {
  margin-bottom: 16px !important;
}

.mb24 {
  margin-bottom: 24px !important;
}

.mb32 {
  margin-bottom: 32px !important;
}