@charset "utf-8";
/* ==========================================================================
   グローバルマーチャンダイジング事業ページ スマホ用スタイル
   設置場所： public_html/css/md_sp.css
   読み込み： md/index.html・md/contact/index.html のみ
             （style.css / md.css はトップページと共有のため変更していません）
   ブレークポイント： 767px 以下
   ========================================================================== */

@media screen and (max-width: 767px) {

/* --------------------------------------------------
   共通レイアウト（style.css の固定幅 970px を解除）
   -------------------------------------------------- */
#wrapper {
	width: auto;
}
img {
	max-width: 100%;
	height: auto;
}

/* ヘッダー：ロゴの下にナビを 3 列で並べる */
#header {
	height: auto;
	overflow: hidden;
}
#header h1 {
	height: 65px;
}
#header #g_navi {
	position: static;
	overflow: hidden;
	border-top: 1px solid #333;
}
#header #g_navi li {
	width: 33.333%;
}
#header #g_navi li img {
	display: block;
	width: 100%;
	max-width: 120px;
	margin: 0 auto;
}

h2 {
	margin-top: 0;
}

/* --------------------------------------------------
   MD ページ本文
   -------------------------------------------------- */
#md_contents {
	padding: 0 16px 40px;
}
#md_contents .md_catch {
	font-size: 20px;
	letter-spacing: 0.08em;
	margin: 28px 0 18px;
}
#md_contents .md_lead {
	width: auto;
	margin-bottom: 30px;
	text-align: left;
}
#md_contents .md_lead .md_lead_copy {
	font-size: 16px;
	line-height: 1.6em;
	text-align: center;
}
#md_contents .md_lead .md_lead_copy2 {
	font-size: 14px;
	line-height: 1.9em;
}
/* PC 用の改行位置はスマホでは不自然になるため無効化 */
#md_contents .md_lead br {
	display: none;
}

#md_cards {
	width: auto;
}
#md_cards li,
#md_cards li.first {
	float: none;
	width: auto;
	margin: 0 0 28px;
}
#md_cards .md_card_ttl {
	height: auto;
	padding: 34px 10px;
	margin-top: 0;
	font-size: 20px;
}
#md_cards .md_card_txt {
	font-size: 14px;
	line-height: 1.8em;
}

.md_banner {
	margin-top: 10px;
}
.md_banner a,
.md_banner a:link,
.md_banner a:visited {
	padding: 16px 12px;
	font-size: 15px;
	letter-spacing: 0.04em;
}
/* 改行位置を「〜事業／についてのお問い合わせ」に揃える */
.md_banner .md_ib {
	display: inline-block;
}

/* --------------------------------------------------
   お問い合わせフォーム（md/contact/）
   ※ フォーム部品の name・action などは変更していません。見た目のみ調整
   -------------------------------------------------- */
#formWrap {
	width: auto;
	margin: 0 16px 40px;
}
#formWrap h3 {
	margin-top: 0;
}
#formWrap input[type="text"],
#formWrap textarea,
#formWrap select {
	display: block;
	width: 100%;
	padding: 8px;
	font-size: 16px;   /* 16px 未満だと iOS で入力時に画面が拡大されるため */
}
#formWrap .required {
	display: inline-block;
	margin-top: 4px;
}
#formWrap input[type="checkbox"] {
	width: 20px;
	height: 20px;
}
#formWrap input[type="submit"],
#formWrap input[type="reset"],
#formWrap input[type="button"] {
	display: block;
	width: 100%;
	height: 44px;
	margin: 0 0 10px;
	font-size: 16px;
}

/* --------------------------------------------------
   フッター：4 列 → 縦積み
   -------------------------------------------------- */
#footer {
	height: auto;
	margin: 0 16px;
}
#footer ul {
	height: auto;
	overflow: hidden;
}
#footer li {
	float: none;
	width: auto;
	height: auto;
	padding: 14px 15px;
	border-right: none;
	border-bottom: 1px solid #ececec;
}
#footer li:last-child {
	border-bottom: none;
}
#footer li dt {
	font-size: 13px;
	margin-bottom: 6px;
}
/* style.css の「* { line-height:1.2em }」が a にも掛かるため a まで指定する */
#footer li dd,
#footer li dd a {
	font-size: 13px;
	line-height: 2.2em;
}
#copyright address {
	width: auto;
	padding: 0 16px 8px;
	font-size: 11px;
}

}