/*↓ フォント指定 ↓*/ /* ヘッダー */ .header { font-size: 36px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #A0A09F; /* 文字色 */ letter-spacing: 1px; /* 文字間隔 */ } /* フッター(お問い合わせ) */ .footer1 { font-size: 13px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #A0A09F; /* 文字色 */ } /* フッター(コピーライト) */ .footer2 { font-size: 10px; /* 文字サイズ */ font-family: Arial,Helvetica; /* フォント */ color: #555555; /* 文字色 */ } /* トップページ(画像部分) */ .top { font-size: 34px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /* トップページ(ボタン) */ .button { font-size: 18px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /* 商品ページ(タイトル) */ .tent1 { font-size: 27px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ } /* 商品ページ(倉庫/開閉式/移動式テント・説明文) */ .tent2 { font-size: 19px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ letter-spacing: -2px; /* 文字間隔 */ } /* 商品ページ(開閉式/移動式/新型ジャバラ式テント/全天候型全開閉ドーム・枠内タイトル1) */ .tent3 { font-size: 27px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ font-weight: bold; /* 文字装飾・太字 */ color: #605E5E; /* 文字色 */ } /* 商品ページ(開閉式/移動式テント・枠内タイトル2) */ .tent4 { font-size: 22px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ font-style: italic; /* 文字装飾・斜体 */ font-weight: bold; /* 文字装飾・太字 */ color: #605E5E; /* 文字色 */ } /* 商品ページ(新型ジャバラ式テント・枠内サブタイトル) */ .tent5 { font-size: 19px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ } /* 商品ページ(全天候型全開閉ドーム・枠内タイトル2) */ .tent6 { font-size: 27px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ font-weight: bold; /* 文字装飾・太字 */ color: #DE5021; /* 文字色 */ } /* 商品ページ(BLUE-SKY・説明文) */ .tent7 { font-size: 15px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ letter-spacing: -2px; /* 文字間隔 */ } /* 商品ページ(ルーフシェード・説明文1) */ .tent8 { font-size: 26px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #207EA9; /* 文字色 */ } /* 商品ページ(ルーフシェード・説明文2) */ .tent9 { font-size: 16px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ } /* 商品ページ(ルーフシェード・説明文3) */ .tent10 { font-size: 16px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #18A837; /* 文字色 */ } /* 商品ページ(ルーフシェード・説明文4) */ .tent11 { font-size: 15px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ letter-spacing: -1px; /* 文字間隔 */ } /* 商品ページ(ルーフシェード・説明文5) */ .tent12 { font-size: 16px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #DE5021; /* 文字色 */ } /* 会社概要ページ(会社概要・項目名) */ .company1 { font-size: 23px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /* 会社概要ページ(会社概要・項目名) */ .company2 { font-size: 18px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #605E5E; /* 文字色 */ } /*↑ フォント指定 ↑*/ /* ------------------------------------------------------------------------------------------------------------ */ /*↓ ヘッダー・フッター関連 ↓*/ /*↓ 画像と文を並べる ↓*/ .headfoot { text-align: center; /* 幅を中央揃えにする */ vertical-align: middle; /* 高さを中央揃えにする */ } /*↑ ヘッダー・フッター関連 ↑*/ /* ------------------------------------------------------------------------------------------------------------ */ /*↓ トップページ関連 ↓*/ /*↓ トップ画像と文 ↓*/ .photo { width: 100%; /* 画像幅 */ position: relative; /* 相対位置指定 */ } .text { width: 100%; /* 文幅 */ font-size: 34px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ text-align: center; /* 中央揃えにする */ bottom: 250px; /* 文字の位置(画像下端から計測) */ margin: 0; /* 余白の指定 */ position: absolute; /* 絶対位置指定 */ } /*↓ ボタン(緑) ↓*/ .button1 { padding: 10px 30px; /* 余白を指定 */ background-color: #01B1AF; /* 背景色を指定 */ border-style: none; /* ボーダーを指定 */ -moz-border-radius: 5px; /* 角丸の指定 */ -webkit-border-radius: 5px; /* 角丸の指定 */ border-radius: 5px; /* 角丸の指定 */ font-size: 18px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /*↓ ボタン(青) ↓*/ .button2 { padding: 10px 30px; /* 余白を指定 */ background-color: #2B6CA3; /* 背景色を指定 */ border-style: none; /* ボーダーを指定 */ -moz-border-radius: 5px; /* 角丸の指定 */ -webkit-border-radius: 5px; /* 角丸の指定 */ border-radius: 5px; /* 角丸の指定 */ font-size: 18px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /*↓ ボタン(紺) ↓*/ .button3 { padding: 10px 30px; /* 余白を指定 */ background-color: #002E5D; /* 背景色を指定 */ border-style: none; /* ボーダーを指定 */ -moz-border-radius: 5px; /* 角丸の指定 */ -webkit-border-radius: 5px; /* 角丸の指定 */ border-radius: 5px; /* 角丸の指定 */ font-size: 18px; /* 文字サイズ */ font-family: Meiryo; /* フォント */ color: #ffffff; /* 文字色 */ } /*↓ ボタン配置 ↓*/ #wrapper { width: 1180px; /* .boxのwidth×2+margin-right×2がここの値 */ margin: 0 auto; /* ブラウザの中央に配置 */ } .container { width: 100%; /* boxが横に並ぶだけの幅を確保 */ overflow: hidden; /* wrapperからはみ出る部分を非表示にする */ } .box { width: 570px; /* 内容領域の幅。下の左右のpaddingを合わせてボックスが570pxになります。 */ float: left; /* 横並びにしています */ margin-right: 20px; /* 各ボックスの右側に20pxの外余白 */ } /*↑ トップページ関連 ↑*/ /* ------------------------------------------------------------------------------------------------------------ */ /*↓ 商品ページ関連 ↓*/ /*↓ 画像下の文字配置(倉庫テント/移動式テント) ↓*/ #c1 { text-align: center; /* 文をブラウザの中央に配置 */ } #c2 { text-align: left; /* 文頭を左に揃える */ margin-left: auto; /* 左側余白 */ margin-right: auto; /* 右側余白 */ width: 940px; /* 入力スペース幅 */ } /*↓ メインコンテンツ枠(開閉式テント/移動式テント) ↓*/ .back { background-color: #FFF9DB; /* 背景色 */ width: 940px; /* 入力スペース幅 */ } /*↓ メインコンテンツ枠内画像配置(開閉式テント/移動式テント) ↓*/ div.imagebox { background-color: #FFF9DB; /* 背景色 */ width: 470px; /* 入力スペース幅 */ float: left; /* 左に回り込む */ } p.image, p.caption { text-align: center; /* 中央寄せ */ margin: 5px; /* 余白・間隔 */ } /*↓ メインコンテンツ枠内画像配置(BLUE-SKY) ↓*/ .skyphoto { height: 595px; /* 画像高さ */ position: relative; /* 相対位置指定 */ } .skytext { height: 595px; /* 画像高さ */ text-align: left; /* 左揃えにする */ bottom: -532; /* 文字の位置(画像下端から計測) */ margin: 0; /* 余白の指定 */ position: absolute; /* 絶対位置指定 */ } /*↓ メインコンテンツ文字枠(ルーフシェード1) ↓*/ .shadebox1 { width: 320px; /* 枠幅 */ border: 4px double #207EA9; /* 枠線の太さと色 */ margin: 2em 0; /* 余白指定 */ } /*↓ メインコンテンツ文字枠(ルーフシェード2) ↓*/ .shadebox2 { width: 495px; /* 枠幅 */ height: 510px; /* 枠高さ */ border: 4px double #207EA9; /* 枠線の太さと色 */ margin: 2em 0; /* 余白指定 */ text-align: center; /* 中央揃えにする */ } /*↓ メインコンテンツ枠内画像配置(ルーフシェード) ↓*/ div.shadeimagebox { width: 370px; /* 入力スペース幅 */ float: left; /* 左に回り込む */ } p.shadeimage, p.shadecaption { text-align: center; /* 中央寄せ */ margin: 15px; /* 余白・間隔 */ } /*↓ メインコンテンツ文字枠(ルーフシェード3) ↓*/ .shadebox3 { width: 260px; /* 枠幅 */ border: 4px double #207EA9; /* 枠線の太さと色 */ margin: 2em 0; /* 余白指定 */ text-align: center; /* 中央揃えにする */ } /*↓ メインコンテンツ文字枠(ルーフシェード4) ↓*/ .shadebox4 { width: 160px; /* 枠幅 */ border: 4px double #207EA9; /* 枠線の太さと色 */ margin: 2em 0; /* 余白指定 */ } /*↓ 文字の中央配置(ルーフシェード) ↓*/ #s1 { text-align: center; /* 文をブラウザの中央に配置 */ } #s2 { text-align: left; /* 文頭を左に揃える */ margin-left: auto; /* 左側余白 */ margin-right: auto; /* 右側余白 */ width: 580px; /* 入力スペース幅 */ } /*↓ メインコンテンツ表(会社概要) ↓*/ table.type02 { border-collapse: separate; border-spacing: 0; line-height: 1.5; border-top: 1px solid #A0A09F; /* 枠線幅と色 */ border-left: 1px solid #A0A09F; /* 枠線幅と色 */ } table.type02 th { width: 120px; /* 枠幅 */ padding: 30px; /* 枠内上側の余白 */ text-align: center; /* 中央揃えにする */ vertical-align: top; border-right: 1px solid #A0A09F; /* 枠線幅と色 */ border-bottom: 1px solid #A0A09F; /* 枠線幅と色 */ background: #30BDFF; /* 背景色 */ } table.type02 td { width: 620px; /* 枠幅 */ padding: 30px; /* 枠内上側の余白 */ text-align: ledt; /* 左揃えにする */ vertical-align: top; border-right: 1px solid #A0A09F; /* 枠線幅と色 */ border-bottom: 1px solid #A0A09F; /* 枠線幅と色 */ } /*↑ 商品ページ関連 ↑*/