@charset "EUC-JP";
/* 雀 */

@import url("../common.css");

/*
h1.title, h1.mt, div#navii, div#navir, div#navil, div#header, div#body { border: 1px solid red; }
*/

/* ヘッダ(トップメニュー) */
#navir a.prev:before { content: '≪'; }
#navir a.next:after { content: '≫'; }

/* ヘッダ(ページのヘッダ) */
h1.title, h1.mt {
	text-align: center;
	clear: both;
	margin: 0;
}
h1.title { margin: 0; }
h1.mt { margin-top: 1em; }

span.aka { font-size: 70%; }
span.aka:before { content: '('; }
span.aka:after { content: ')'; }

/* #header採用後は#cheaderは廃止 */
#cheader span.mt,
#header span.mt {
	font-size: 150%;
	display: block;
	margin-top: 1em;
	font-weight: bold;
}

#cheader span.cs,
#header span.cs {
	font-size: 80%;
	display: block;
	margin-top: 1em;
}

#cheader span.cs:before { content: '(' }
#cheader span.cs:after { content: ')' }

#header span.cs:before { content: '(' }
#header span.cs:after { content: ')' }

#cheader span.date,
#header span.date {
	font-size: 80%;
	display: block;
	margin-top: 1em;
	margin-bottom: 1.5em;
}

/* 本文(preamble, postscriot) */
/* p.preambleはdiv.preambleに置き換え後に削除 */
p.preamble {
	margin: 0 0 0.2em 0;
	font-size: 95%;
}

p.preamble,

div.preamble,
div.postscript {
	border-radius: 0.5em;
	font-size: 95%;
	/*
	border: 2px solid #da70d6;
	border: 2px solid #ee82ee;
	*/
	border: 2px solid #dda0dd;
	padding: 0.2em;
}

div.preamble { margin: 0 0 0.2em 0; }
div.postscript { margin: 0.2em 0 0 0; }

div.preamble p,
div.postscript p {
	/* border: 1px solid red; */
	margin: 0;
	padding: 0.2em;
	line-height: 1.5em;
}

/* 本文(h2) */
h2.dw, h2.ds, h2.dh {
	text-align: center;
	border-radius: 0.3em 0.3em 0 0;
	margin: 0;
	padding: 0.3em 0 0.1em 0;
	background-color: #ffcb8a;
	font-size: 130%;
	margin-top: 0.1em;
}

h2.dw { color: #000000; }
h2.ds { color: #0000ff; }
h2.dh { color: #ff0000; }

div.dc {
	border: solid 2px #ffcb8a;
	border-radius: 0 0 0.2em 0.2em;
	font-family: serif; /* Midori(WebKit対応) */
	padding: 0 0.5em;
}

/* 本文(ログ, h3) */
div.log {
	border: groove 3px #dcdcdc;
	border-radius: 0.2em;
	padding: 0.2em;
	margin-bottom: 0.2em;
}

h3.cs, h3.c-time, h3.t-log {
	border-radius: 0.2em 0.2em 0 0;
	padding: 0.2em 0 0 0.5em;
	margin: 0;
	color: #ffffff;
}

h3.cs { background: #62c1ce; }
h3.c-time, h3.t-log { background: #6eb7ff; }

div.cc {
	border: solid 2px #62c1ce;
	border-radius: 0 0 0.2em 0.2em;
	padding: 0 0.5em;
}

div.c-time, div.t-log {
	border: solid 2px #6eb7ff;
	font-family: serif; /* Midori(WebKit対応) */
	border-radius: 0 0 0.2em 0.2em;
}

div.cc, div.c-time { margin-bottom: 0.2em; }

div.t-log { padding: 0.2em; }

/* コースタイム(中身) */
div.c-time {
	line-height: 180%;
	padding: 0.3em 0.5em;
}

span.sub:before { content: '〔'; }
span.sub:after { content: '〕'; }

span.attr:before { content: '('; }
span.attr:after { content: ')'; }

div.c-time span.s,
div.c-time span.g,
div.c-time span.pt,
div.c-time span.pt2,
div.c-time span.pt3,
div.c-time span.pt4,
div.c-time span.mt,
div.c-time span.mt2,
div.c-time span.lt,
div.c-time span.at {
	border: 1px solid #093;
	padding-top: 0.1em;
}

.c-time span.blk { white-space: nowrap; }

.c-time span.s, .c-time span.g {
	background-color: #ff7f50;
	color: #ffffff;
}

div.c-time span.mt, div.c-time span.mt2
{
	background-color: #4682b4;
	color: #ffffff;
}

div.c-time span.pt, div.c-time span.pt2 {
	/*
	background-color: #4682b4;
	background-color: #808090;
	background-color: #2f4f4f;
	background-color: #3f5f5f;
	background-color: #778899;
	background-color: #4682b4;
	*/
	background-color: #4f6f5f;
	color: #ffffff;
}

div.c-time span.pt3,
div.c-time span.pt4 {
	background-color: #808080;
	color: #ffffff;
}

div.c-time span.mt, div.c-time span.mt2,
div.c-time span.s, div.c-time span.g, div.c-time span.pt, div.c-time span.at, div.c-time span.lt {
	padding-left: 0.5em;
	padding-right: 0.5em;
}

div.c-time span.lt, div.c-time span.pt2, div.c-time span.mt2, div.c-time span.pt4 {
	border-radius: 0 0.8em 0.8em 0;
	margin-right: 0.5em;
}

div.c-time span.pt2 {
	padding-right: 0.5em;
	padding-left: 0.5em;
}

/* トラックログ(KML & GPX ICONS) */
img.preload-icons {
	width: 0;
	height: 0;
	display: none;
}

/* トラックログ(地図とグラフ) */
div#map_and_chart p.caution, div#map_and_chart p.caution_s, div#map_and_chart p.notes, div#map_and_chart2 p.caution, div#map_and_chart2 p.caution_s, div#map_and_chart2 p.notes {
	margin: 0 0.5em 0;
	font-size: 90%;
}

div#map_and_chart p.caution:before, div#map_and_chart p.caution_s:before, div#map_and_chart p.notes:before,
div#map_and_chart2 p.caution:before, div#map_and_chart2 p.caution_s:before, div#map_and_chart2 p.notes:before {
	content: "※ ";
}

div#map_and_chart p.caution,
div#map_and_chart2 p.caution {
	color: red;
	font-weight: bold;
}

#map_and_chart, #map_and_chart2 { border: solid 1px #000; }

#map, #map2 {
	width: 100%;
	height: 360px;
	z-index: 0;
}

#chart, #chart2 { ; }

#chart-wrap, #chart2-wrap {
	width: 100%;
	height: 150px;
}

#map_table, #map_table2 {
	width: 100%;
}

div.area_info,
div.sat_info {
	text-align: center;
	font-size: 70%;
}

div.sat_info:after { content: "※ 国土地理院 空中写真　データソース：Landsat8画像(GSI,TSIC,GEO Grid/AIST), Landsat8画像(courtesy of the U.S. Geological Survey), 海底地形(GEBCO)" }
div.area_info:after { content: "※ 県境データは国土数値情報(行政区域データ)(国土交通省)(https://nlftp.mlit.go.jp/ksj/gml/datalist/KsjTmplt-N03-v2_4.html)を加工して作成" }

/* トラックログ(table) */
div.t-log td {
	border: 1px #000 solid;
	vertical-align: middle;
}

div.t-log td.o { text-align: center; }
div.t-log td.d { text-align: center; }

/* トラックログ(地図: leaflet関連) */
/* leafletのマーカーのコンテンツの設定 */
.leaflet-popup-content h2 { margin-bottom: 0.2em; }

div.leaflet-popup-content div.cta{ text-align: center; }
div.leaflet-popup-content button.pb {
	/* type: button; */
	padding: 0 0.2em;
	margin: 0.3em;
}

/*
 * leafletのマーカーのコンテンツの写真表示用
 * map.jsで設定
 */
/* Galaxy note 20 Android 11		412x915
 * Galaxy note 20 Super Android 11	412x883
 * Galaxy note S10/S10+ Android 11	360x760
 * Galaxy note S20 Android 11		360x800
 * Galaxy note S20 Ultra Android 11	412x915
 * Galaxy note S20+ Android 11		384x854
 * iPad iPadOS 14.7.1			810x1080
 * iPhone11 Pro iOS 14.6		375x812
 * iPhone11 Pro Max iOS 14.6		414x896
 * iPhone12/13+ Pro Max iOS 14.6	390x844
 * iPhone12/13 mini iOS 14.6		375x812
 * iPhone12/13 mini iOS 14.6		375x812
 * iPhone12/13 Pro Max iOS 14.6		428x926
 * iPhone SE 2nd gen iOS 14.6		375x667
 * Kindle Fire HDX Linux		800x1280
 */

/*
 *	default
 *	#map, #map { height: 360px; }
 */

/* debug */
/*
div.leaflet-popup-content { border: 3px solid blue; }
div.leaflet-popup-content div.cta{ border: 2px solid red; }
div.leaflet-popup-content img.h,
div.leaflet-popup-content img.v,
div.leaflet-popup-content img.hl,
div.leaflet-popup-content img.vl { border: 2px solid black; }
*/

div.leaflet-popup-content img.h,
div.leaflet-popup-content img.v,
div.leaflet-popup-content img.hl,
div.leaflet-popup-content img.vl {
	object-fit: contain;
}

/* 8KHD(7640x4320 */
/* 4KHD(3840x2160 */
div.leaflet-popup-content img.h {
	width: 120px;
	height: 90px;
}

div.leaflet-popup-content img.hl {
	width: 400px;
	height: 300px;
}

div.leaflet-popup-content img.v {
	width: 90px;
	height: 120px;
}

div.leaflet-popup-content img.vl {
	width: 300px;
	height: 400px;
}

div.leaflet-popup-content img.s {
	width: 90px;
	height: 90px;
}

div.leaflet-popup-content img.sl {
	width: 300px;
	height: 300px;
}

/* 2KHD(1920x1080) */
@media screen and (max-width: 1920px) {
	div.leaflet-popup-content img.hl {
		width: 360px;
		height: 270px; 
	}
	div.leaflet-popup-content img.vl {
		width: 270px;
		height: 360px;
	}
	div.leaflet-popup-content img.sl {
		width: 270px;
		height: 270px;
	}
}

/* XGA(1024x768) */
@media screen and (max-width: 1024px) {
	div.leaflet-popup-content img.hl {
		width: 200px;
		height: 150px; 
	}
	div.leaflet-popup-content img.vl {
		width: 150px;
		height: 200px; 
	}
	div.leaflet-popup-content img.sl {
		width: 150px;
		height: 150px; 
	}
}

/* VGA(640x480) */
@media screen and (max-width: 640px) {
	div.leaflet-popup-content img.hl {
		width: 120px; 
		height: 90px;
	}
	div.leaflet-popup-content img.vl {
		width: 90px;
		height: 120px; 
	}
	div.leaflet-popup-content img.sl {
		width: 90px;
		height: 90px; 
	}
}

@media screen and (max-width: 360px) { 
	#map, #map2 { height: 300px; }

	div.leaflet-popup-content img.h {
		width: 84px;
		height: 63px;
	}
	div.leaflet-popup-content img.hl {
		width: 168px;
		height: 126px;
	}
	div.leaflet-popup-content img.v {
		width: 63px;
		height: 84px;
	}
	div.leaflet-popup-content img.vl {
		width: 126px;
		height: 168px;
	}
	div.leaflet-popup-content img.s {
		width: 63px;
		height: 63px;
	}
	div.leaflet-popup-content img.sl {
		width: 126px;
		height: 126px;
	}
}


/* QVGA(320x240) */
@media screen and (max-width: 320px) {
	div.leaflet-popup-content img.h {
		width: 68px;
		height: 51px;
	}
	div.leaflet-popup-content img.hl {
		width: 136px;
		height: 102px;
	}
	div.leaflet-popup-content img.v {
		width: 51px;
		height: 68px;
	}
	div.leaflet-popup-content img.vl {
		width: 102px;
		height: 136px;
	}
	div.leaflet-popup-content img.s {
		width: 51px;
		height: 51px;
	}
	div.leaflet-popup-content img.sl {
		width: 102px;
		height: 102px;
	}
}

/* 本文中の写真など */
.photo { text-align: center; }

.photo img {
	max-width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.photo span {
	font-size: 80%;
	margin-top: 0.1em;
	padding: 0;
}

.panorama-360 {
	max-width: 100%;
	text-align: center;
	margin: 0 auto;
}

/* イメージデータの重ね合わせに使用 */
div.photo-overlay {
	margin: 0 auto;
	position: relative;
	text-align: center;
	margin-top: 1.5em;
}

div.photo-overlay span { font-size: small; }

div.photo-overlay div.over {
	position: absolute;
	top: 0; left: 0;
}