﻿
	/* ページ全体・共通 */

* { margin: 0;  padding: 0;  background-color: ivory;  color: #420101;  line-height: 1.3;  font-family: sans-serif; }

html,
body,
div#all { font-size: medium;  background: url(images/bgi.jpg) 50% fixed; }

div#all { width: 920px;  margin: 0 auto; }

div#all > header,
div#content,
div#all > footer { width: 890px;  padding: 15px;  margin: 25px auto 0;  border-radius: 10px; }

div#all > header { padding-bottom: 20px; }
div#all > footer { margin-bottom: 20px; }

img { border: 1px solid #420101; }


	/* 幅・パディング・マージン */

nav { width: 890px; }

main { width: 620px;  margin: 20px 0 20px 10px; }
aside { width: 220px;  margin: 20px 10px 20px 0; }

h2 { margin-bottom: 5px; }
h3 { margin-bottom: 7px; }

time { margin-right: 1em; }

p,
.border { padding: 0 7px 7px 7px; }

p.border { padding: 15px 14px 14px 14px; }
p.border[alt="setsumei"] { padding: 7px; }

ins p,
.ins { margin: 14px;  padding: 14px; }

h3 + p { margin-top: 10px; }
p + p { margin-top: 7px; }

nav,
div,
article + article,
section + section,
.pagetop,
p#copy { margin-top: 15px; }

main > article + article { margin-top: 40px; }
.border > article + article,
.border > section + section { padding-top: 25px; }

.pagetop { padding: 0 7px 0 0; }

nav ul { width: 870px;  padding: 0 10px; }

nav li { margin-left: 20px; }

nav ul:first-child,
nav li.left { margin-left: 0; }

nav a { width: 158px;  padding: 3px 0; }

article footer { margin: 10px 0;  padding: 0 7px 5px 0; }

div.section { width: 300px;  height: 340px;  margin: 0; }

ul#footer { width: 500px;  margin: 0 auto;  margin-top: 10px; }

div#newyear { margin-top: 20px; }


	/* ボーダー・背景色 */

.border { border: 3px dashed salmon;  border-top: 0;  border-radius: 0 0 5px 5px; }

.border[alt="setsumei"] { border: 0;  border-bottom: 3px dashed salmon;  border-radius: 0; }

h2 { color: ivory;  background-color: salmon;  border-radius: 5px; }
h3,
h3 * { color: firebrick; }

.border article + article,
.border section + section { border-top: 2px dashed salmon; }
article footer { border-bottom: 2px dashed salmon; }

ins p,
.ins { border: 5px double peachpuff; }


	/* アンカー */

a { text-decoration: none; }
nav a { display: block; }

				/* 通常リンク　（字：レンガ→オリーブ） */
a:link { color: firebrick; }
a:visited { color: olive; }

				/* トップナビのリンク　（字：アイボリー、地：サーモン→オレンジ→オリーブ） */
.tnav:link,
.tnav:visited { color: ivory; background-color: salmon;  border-radius: 5px; }
.tnav:hover { color: ivory; background-color: orange;  border-radius: 5px; }
.tnav:focus,
.tnav:active { color: ivory;  background-color: olive;  border-radius: 5px; }

				/* サイドバー、記事内のリンク　（字：オレンジ→オリーブ） */
.nml:hover { color: orange; }
.nml:focus,
.nml:active { color: olive; }

				/* ページトップへのリンク（字：レンガ→オレンジ→オリーブ） */
.pagetop .nml:link,
.pagetop .nml:visited { color: firebrick; }
.pagetop .nml:hover { color: orange; }
.pagetop .nml:focus,
.pagetop .nml:active { color: olive; }

				/* ページトップへのリンク（字：レンガ→オレンジ→オリーブ） */
footer .nml:link,
footer .nml:visited { color: firebrick; }
footer .nml:hover { color: orange; }
footer .nml:focus,
footer .nml:active { color: olive; }

				/* フッターナビのリンク（字：レンガ→オレンジ→オリーブ） */
.fnav:link,
.fnav:visited { color: firebrick; }
.fnav:hover { color: orange; }
.fnav:focus,
.fnav:active { color: olive; }

				/* ギャラリーリスト、サイトマップ、ギャラリートップ目録のリンク　（字：茶→レンガ→オレンジ→オリーブ） */
.lst:link { color: #420101; }
.lst:visited { color: olive; }
.lst:hover { color: orange; }
.lst:focus,
.lst:active { color: olive; }

				/* ロゴ・イラストのリンク　（白地） */
.white:hover,
.white:focus,
.white:active { background-color: ivory; }


	/* 文字サイズ・行間 */

h1 { font-size: x-large; }
h2,
nav ul { font-size: large; }

h2 { line-height: 1.5; }

p#copy { font-size: smaller; }


	/* 文字配置 */

h2,
ul,
div.section,
p#copy,
div#newyear { text-align: center; }

article footer,
p.pagetop,
div.pagetop ul { text-align: right; }

.right { text-align: right; }


	/* 装飾・疑似要素 */

nav ul,
p[alt="title"],
.bold { font-weight: bold; }

ins,
ins * { text-decoration: none; }

*[alt="u-line"] { text-decoration: underline; }

ul { list-style-type: none; }

a[alt="line"]::before,
div.pagetop li::before { content: "|";  color: firebrick;  margin: 0 10px 0 5px; }
div.pagetop li.noline::before { content: "";  margin: 0; }

p.pagetop a::before { content: "↑";  color: firebrick;  margin: 0 5px 0 0; }

a[alt="ya"]::before,
.ya::before { content: "→→";  color: firebrick;  margin: 0 1em 0 0; }
.ins a[alt="ya"]::before { content: "→→";  color: firebrick;  margin: 0 1em; }

.maru::before,
.maru::after,
*[alt="maru"]::before,
*[alt="maru"]::after,
ul#footer li::after,
ul#footer li.left::before { content: "●";  color: peachpuff;  margin: 0 7px; }

.dai-kakko::before { content: "【";  color: #420101;  margin-right: 1em; }
.dai-kakko::after { content: "】";  color: #420101;  margin-left: 1em; }

.kakko::before { content: "（";  color: #420101; }
.kakko::after { content: "）";  color: #420101; }

.kome::before { content: "※";  margin-right: 2px; }
.kome::after { content: "※";  margin-left: 2px; }

.slash::before { content: "／";  margin: 0 0.2em; }


	/* 画像 */

img#logo { width: 100px;  margin: 0 10px 7px;  border: none; }
img#about { width: 250px;  margin-bottom: 18px;  border: none; }
div#newyear img { width:700px; }

img[alt="NEW"] { border: 0;  margin-left: 1em;  height: 16px; }

img.clip { height: 250px;  width: 250px;  margin: 15px 0 10px; }


	/* フロート＆クリアフィクス */

				/* ロゴ */
h1 { float: left; }
nav { clear: both; }

				/* トップナビ＆フッターナビ */
nav li,
ul#footer li { float: left; }

ul { zoom: 1; }
ul::before,
ul::after { display: table;  content: "";  line-height: 0; }
ul::after { clear: both; }

				/* コンテンツ＆サイドバー */
main { float: left; }
aside { float: right; }

div#content { zoom: 1; }
div#content::before,
div#content::after { display: table;  content: "";  line-height: 0; }
div#content::after { clear: both; }

				/* コンテンツ内のフロート */
div.section { float: left; }

div[alt="gallery"] { zoom: 1; }
div[alt="gallery"]::before,
div[alt="gallery"]::after { display: table;  content: "";  line-height: 0; }
div[alt="gallery"]::after { clear: both; }


	/* 上書き他調整 */

div.pagetop li { display: inline; }

