@charset "utf-8";
/* ==========================================================================
   グローバルマーチャンダイジング事業ページ 専用スタイル
   設置場所： public_html/css/md.css
   読み込み： style.css の「後」に読み込むこと（一部プロパティを上書きするため）
   既存の style.css は一切変更していません。
   ========================================================================== */

/* --------------------------------------------------
   コンテンツ全体
   -------------------------------------------------- */
#md_contents {
	padding-bottom: 50px;
}

/* --------------------------------------------------
   大見出し「MERCHANDISING BUSINESS」
   -------------------------------------------------- */
#md_contents .md_catch {
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.12em;
	line-height: 1.4em;
	margin: 40px 0 22px;
	color: #333;
}

/* --------------------------------------------------
   リード文
   ※ style.css の「* { line-height:1.2em }」を上書きして可読性を確保
   -------------------------------------------------- */
#md_contents .md_lead {
	width: 820px;
	margin: 0 auto 40px;
	text-align: center;
	font-size: 13px;
	line-height: 2em;
	color: #333;
}
#md_contents .md_lead strong {
	font-weight: bold;
}
#md_contents .md_lead .md_lead_copy {
	font-size: 15px;
	margin-bottom: 18px;
}

/* --------------------------------------------------
   事業カテゴリ 3カラム
   310px × 3 + 20px × 2 = 970px（#wrapper と同幅）
   -------------------------------------------------- */
#md_cards {
	width: 970px;
	overflow: hidden;   /* float の回り込み解除 */
	margin: 0;
	padding: 0;
}
#md_cards li {
	float: left;
	width: 310px;
	margin-left: 20px;
	list-style-type: none;
}
#md_cards li.first {
	margin-left: 0;
}

/* カード見出し（色ベタの枠）
   ※ 商品写真が用意できたら background-image を指定するか、
     <h3> を <p class="md_card_img"><img src="../images/md/xxx.jpg"></p> に差し替えてください */
#md_cards .md_card_ttl {
	height: 90px;
	padding: 60px 10px 0;
	margin: 0 0 14px;
	background-color: #bed400;
	background-position: center center;
	background-repeat: no-repeat;
	color: #333;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4em;
	letter-spacing: 0.05em;
	text-align: center;
}

/* カード本文 */
#md_cards .md_card_txt {
	font-size: 12px;
	line-height: 1.9em;
	color: #555;
	text-align: left;
}

/* --------------------------------------------------
   バナー（MDページ内の問い合わせ導線／トップページの誘導バナー共通）

   ■2026/09/16 修正
   トップページでバナー右上が白く欠ける事象への対応。
   ・position:relative + z-index で、ピックアップ枠の
     フェード用オーバーレイより前面に出す
   ・width:970px の固定指定をやめ、親（#wrapper）の幅に追従させる
     → 親より広くなってはみ出す事故が原理的に起きない
   ・clear:both で float の影響を受けないようにする
   -------------------------------------------------- */
.md_banner {
	position: relative;
	z-index: 10;
	clear: both;
	display: block;
	width: auto;
	margin: 45px 0 0;
	padding: 0;
	overflow: visible;
}
.md_banner a,
.md_banner a:link,
.md_banner a:visited {
	position: relative;
	z-index: 10;
	display: block;
	padding: 19px 0;
	background-color: #bed400;
	color: #FFF;
	font-size: 17px;
	font-weight: bold;
	letter-spacing: 0.08em;
	line-height: 1.4em;
	text-align: center;
	text-decoration: none;
	-moz-border-radius: 31px;
	-webkit-border-radius: 31px;
	border-radius: 31px;
}
.md_banner a:hover {
	background-color: #111;
	color: #fff;
	text-decoration: none;
}

/* トップページに設置する誘導バナー用の上下マージン調整 */
#index_md_banner {
	margin-top: 30px;
	margin-bottom: 10px;
}