body {background-color:#ffffcc;}
h1 { font-size: 120%; font-family:sans-serif; font-weight:bold; clear:none;}
h2 { margin-top:1em; padding-top:1em; font-size: 120%; clear:left;}
.top { position:fixed; top:0; right:0}
.button { margin:1px; border:2px solid; background-color:#ffd; border-color: #ccc #777 #777 #ccc; border-radius:4px}
.button a { display:block; font-size:100%; font-weight:bold; text-align:center; font-family:sans-serif; line-height:2em; text-decoration:none; color: #444}
.button a:hover { background-color:rgba(0,0,0,0.1)}
.link-year {width:4em; float:left}
.link-to-yamato { width: 10em; line-height: 1.2em; }
.link-to-top { width:3em; }
.link-to-prev { width:3em;}
.link-to-next { width:3em;}
.navigation .button {float:left}
#yearindex {clear:both;}
.index {clear:left;}
.bottom_menu { position:fixed; bottom:0; width:100%; margin:0}
.bottom_menu .button {min-width:4em; background-color:rgba(0,0,0,0.5); float:right}
.bottom_menu .button a {color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.5);}
.bottom_menu .button a:hover { background-color:rgba(255,255,255,0.5);}
.bottom_menu .link-to-prev {float:left}

.table {display:table}
.row {display: table-row; line-height:1.2em}
.row div {display:table-cell; padding:0.2em;}

.summary { font-size:100%; min-height: 8.4em /* 1.2em * 7lines */; margin:0.5em;}
.summary .table {font-size:80%; background-color:#ffd; box-shadow:1px 1px 1px 1px rgba(0,0,0,0.3)}
.num {text-align:right}
.summary .class {font-weight:bold}
#main {margin-bottom: 3em}

table { font-size: 100%; border:none; border-collapse: collapse; margin: 0px; width:100% }

@media (min-width:640px) {
	table { background-color:#fff; box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.3); border:1px solid black}
	th { line-height: 1.5em; text-align: center; background-color:#79c;color:white; border-left:1px solid navy}
	.date { width:10%;}
	.member { width:20%}
	.area { width:10%; }
	.route { width:20%; }
	.type { width:10%; }
	.comment { max-width:400px;}
	td { min-height: 30px; border: 1px solid black; text-align: left;}
	td:last-child {font-family:serif}	/* comment */

	/* 形態毎の背景色 */
	.hike { background-color:#99ff99;}	/* ハイク */
	.trekking { background-color:#99ff99;}	/* 縦走 */
	.sawa { background-color:#99ffff; }	/* 沢 */
	.rock { background-color:#d3d3d3; }	/* 岩 */
	.sawa_and_rock { background-color:#add8e6; }	/* 沢＋岩 */
	.scree { background-color:#deb887; }	/* 崩壊 */
	.free { background-color:#ffffb0 }	/* フリー */
	.rock_training { background-color:#ffffcc; }	/* 岩トレ */
	.snow { background-color:#f0fff0; }	/* 雪 */
	.ice { background-color:#c0e0ff; }	/* アイス */
	.snow_climb { background-color:#f0e68c; }	/* 雪攀 */
	.ski { background-color:#ffffff; }	/* スキー */
	.climb_and_ride { background-color:#f5f5f5;} /* 雪攀+スキー */
	.others { } /* その他、山以外など  */
}

@media (max-width:640px) {
	table {border:none}
	th {display:none }
	td {width:100%; line-height:1.2em; min-height:0; height:auto; display:list-item; background-color:white; border-top:thin dashed #bbb; box-shadow:1px 1px 1px 1px rgba(0,0,0,0.3);}
	td:first-child { background-color:#c0e0ff;border-radius:5px 5px 0px 0px; border:none; }
	td:last-child { border-radius:0px 0px 5px 5px; font-family:serif}	/* comment */

	/* 山域セルの改行を除去 */
	td:nth-child(3) br {display:none;}

	/* 形態セルの改行を除去 */
	td:nth-child(5) br {display:none;}
}