/**
 * トップページ専用 - under_pages_02.css から必要なスタイルのみを抽出
 * パフォーマンス改善のため、トップページでは under_pages_02.css の代わりに読み込む
 * 下層ページでは under_pages_02.css をそのまま使用
 */

/* 基本タイポグラフィ */
h2,
h3,
.main-title,
.title_txt {
  font-family: "Noto Sans JP", "ヒラギノ角ゴシック Pro";
}

/* 画像・リンク・段落の基本 */
img {
  max-width: 100%;
}

a {
  color: #333;
}

a:hover {
  color: #dd3b90;
}

p {
  margin-bottom: 10px;
}

/* ボックス系（選ばれる理由・充実の内容セクション等） */
.box_beige,
.box_beige_02,
.box_beige_03,
.box_beige_04 {
  background: #fde5b9;
  text-align: center;
  padding: 5px;
  margin-bottom: 20px;
}

.box_beige_02 {
  text-align: left;
  padding: 20px;
}

/* タイトル・見出し */
.title {
  margin-bottom: 20px;
}

.subtitle,
.subtitle_02 {
  background: #f8b0b8;
  padding: 3px 0 0 35px;
  height: 31px;
  margin-bottom: 20px;
  color: #fff;
  font-size: 18px;
}

@media only screen and (max-width: 767px) {
  .subtitle,
  .subtitle_02 {
    background: #f8b0b8;
    background-image: none;
    padding: 3px 0;
    height: auto;
    text-align: center;
  }
}

/* ユーティリティ */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.ctr {
  text-align: center;
}

.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mb20 { margin-bottom: 20px; }

/* カタログエリア（トップページのデジタルカタログ） */
.catalog_area .catalog_area_ul li a,
.catalog_area .catalog_area_ul li a.pdf {
  text-decoration: underline;
}

.catalog_area .catalog_area_ul li,
.catalog_area .catalog_area_ul li a.pdf {
  background: url("../img/import/img/icon_pdf.png") no-repeat left top/16px 16px transparent;
  padding: 0 0 0 20px;
  line-height: 1.8em;
}

/* お役立ちコンテンツ・リンクスタイル */
.okyakudachi a,
.icon_box a,
.moreLinkText a {
  text-decoration: none;
  color: inherit;
}

.okyakudachi a:hover,
.icon_box a:hover {
  opacity: 0.9;
}

/* 充実の内容セクション（icon_grid内） */
.icon_grid p,
.icon_grid h3 {
  font-family: "Noto Sans JP", "ヒラギノ角ゴシック Pro";
  color: #333;
}

.icon_grid a {
  color: #333;
  text-decoration: none;
}

.icon_grid a:hover {
  color: #dd3b90;
}

/* オプションセクション */
.option_area .title_txt,
.option-text p {
  color: #333;
}

.option_area .moreLinkText a {
  color: #569EBF;
  font-weight: bold;
}