#cnt-digit p,#cnt-location,#cnt-m,#timestamp{text-align:center}
#cnt-location { font-size: 16px; color: #0026a0; font-weight: bold; text-align: center; padding-bottom: 5px; border-bottom: dotted 1px; }
#cnt-set { width: 95%; margin:0 auto;position:relative; }
#cnt-str { width: 15%; float: left; padding-top: 40px; font-size: 16px; }
#cnt-digit { width: 70%; background: #000; margin: 0 auto; float: left; }
#cnt-digit>div { padding: 2%; position: relative; }
#cnt-digit p {
	width: 49.5%;
	text-align: center;
	font: 6em/1.1 "ヒラギノ角ゴ ProN W3","HiraKakuProN-W3";
	color: #fff;
	background: #484848;
	background: -webkit-gradient(linear, left top, left bottom, from(#505050), color-stop(20%, #191919), color-stop(49%, #505050), color-stop(50%, #e8e8e8), color-stop(51%, #505050), color-stop(80%, #191919), to(#505050));
	background: -webkit-linear-gradient(top, #505050, #191919 20%, #505050 49%, #e8e8e8 50%, #505050 51%, #191919 80%, #505050);
	background: -moz-linear-gradient(top, #505050, #191919 20%, #505050 49%, #e8e8e8 50%, #505050 51%, #191919 80%, #505050);
	background: -ms-linear-gradient(top, #505050, #191919 20%, #505050 49%, #e8e8e8 50%, #505050 51%, #191919 80%, #505050);
	background: -o-linear-gradient(top, #505050, #191919 20%, #505050 49%, #e8e8e8 50%, #505050 51%, #191919 80%, #505050);
	background: linear-gradient(top, #505050, #191919 20%, #505050 49%, #e8e8e8 50%, #505050 51%, #191919 80%, #505050);
	
}
#cnt-digit p:nth-child(1){float:left;} #cnt-digit p:nth-child(2){float:right;}
#cnt-digit p:after {
	content: "";
	width: 96.5%;
	height: 1px;
	background: #242424;
	position: absolute;
	top: 49.5%;
	left: 2%;
	-moz-box-shadow: 0 0px 2px rgba(0, 0, 0, 0.8);
	-webkit-box-shadow: 0 0px 2px rgba(0, 0, 0, 0.8);
	box-shadow: 0 0px 2px rgba(0, 0, 0, 0.8);
	
}
#cnt-m {width: 15.5%;font-size: 20px;line-height: 40px;text-align: center;color: #fff;position: absolute;bottom: 0;right: 0;
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#505050), color-stop(80%, #191919), to(#505050));
	background: -webkit-linear-gradient(top,#505050,#191919 80%,#505050);
	background: -moz-linear-gradient(top,#505050,#191919 80%,#505050);
	background: -ms-linear-gradient(top,#505050,#191919 80%,#505050);
	background: -o-linear-gradient(top,#505050,#191919 80%,#505050);
}

.cnt-bg-wht { padding: 5px 0px; }
#time-control { padding: 5px; }
#gps-button { padding: 0px; }
#countdown-button { margin: 10px auto 0px; }

#timestamp {
    height: 35px;
    bottom: 20px;
    right: 25px;
    z-index: 5;
    font-size: 13pt;
    font-weight: 700;
    padding: 5px;
    background-color: rgb(30%,30%,30%);
    background-color: rgba(0,0,0,.5);
    border-radius: １px;
}

.obs {
  color: white;
  width: 100px;

}

.fcst {
  color: orange;
  width: 100px;
}

div.leg-container { width: 200px; margin: 0px auto 0px; padding: 5px; background: #f4f4f4; border: dashed 1px #d0d0d0; }
div.leg-container div.leg-radar { padding: 0 0px; line-height: 18px; display: -webkit-box; display: -moz-box; display: box; text-align: center;background: #4b4b4b; color: #fff; }
div.leg-container div.leg-radar p { width: 14.2%; } 
div.leg-container div.leg-radar p:nth-child(2) { color: #fff; text-shadow: 0px 0px 2px #000000; } 
div.leg-container div.leg-radar p:nth-child(3) { color: #00dcea; text-shadow: 0px 0px 2px #000000; } 
div.leg-container div.leg-radar p:nth-child(4) { color: #0005ba; text-shadow: 0px 0px 2px #000000; } 
div.leg-container div.leg-radar p:nth-child(5) { color: #fff100; text-shadow: 0px 0px 2px #000000; } 
div.leg-container div.leg-radar p:nth-child(6) { color: #f50000; text-shadow: 0px 0px 2px #000000; }

.lasted {
    overflow: hidden;
    position: relative;
}

.lasted:after {
    content: ""; display: block;
    width: 100%; height: 100%;
    position: absolute;
    background-color: rgba(0,0,0,0.6);
    top: 0; left: 0;
}

.btn-list > * {
    float: left !important;
}

.btn-list #backbtn, .btn-list #nextbtn {
    width: 85px;
}

.btn-list #timestamp {
    width: 120px;
    height: 25px;
    bottom: 0px;
    right: 25px;
    z-index: 5;
    font-size: 13pt;
    font-weight: 700;
    padding: 0px;
    background: none;
    margin: 0 auto;
    position: static;
}

.btn-01 a {
    text-align: center;
}

[class^=btn].forward>:after {
    border: 8px solid transparent;
    border-left: 0px;
    border-right: 8px solid #fff;
    margin-left: -8px;
}

/* エリア
------------------------------------------*/
.map-parts { padding-top: 5px; background: #333; }
.map-parts > *:not(:last-child) { padding-top: 0; padding-bottom: 5px; border-bottom: 1px solid #fff; margin-bottom: 5px; }

/* 凡例：雨雲レーダー */
.radar-legend { text-align: center; padding: 5px 0; }
.radar-legend * { color: #fff; font-weight: bold; }
.radar-legend li { display: inline; margin: 0px 5px; line-height: 1em; vertical-align: middle; }
.radar-legend li[class^="lv"] { display: inline-block; width: 15px; height: 15px; border: 1px solid #fff; }
.radar-legend li.txt { margin: 0; }
.radar-legend li.lv01 { background: #ffffff; }
.radar-legend li.lv02 { background: #00dcea; }
.radar-legend li.lv03 { background: #0005ba; }
.radar-legend li.lv04 { background: #fff100; }
.radar-legend li.lv05 { background: #f50000; }

/* テキスト白、背景青、ボーダー白 */
/* 2コ・横並びボタン */
.btn-list { max-width: 300px; margin-left: auto; margin-right: auto; overflow: hidden; }
.btn-list > * { width: 49%; }
.btn-list > *:first-child { float: left; }
.btn-list > *:last-child { float: right; }

.btn-03 { width: 100%; background: #0c419a; border: 1px solid #fff; border-radius: 8px; text-align: center; position: relative; }
.btn-03 > * { color: #fff; font-weight: bold; display: block; padding: 5px; }

.btn-03.lasted {
    overflow: hidden;	
    position: relative;
}

.btn-03.lasted:after {
    content: ""; display: block;
    width: 100%; height: 100%;
    position: absolute;
    background-color: rgba(0,0,0,0.6);
    top: 0; left: 0;
}


/* テキスト青、背景白、ボーダー青 */
.btn-01, .btn-06 { /* 押せない時 */ }
.btn-01, .btn-06 { margin-left: auto; margin-right: auto; background: #fff; border: 1px solid #0c419a; border-radius: 4px; text-align: center; padding:7px 0  4px 0; }
.btn-01 img, .btn-06 img { vertical-align: top; }
.btn-01 a, .btn-06 a { display: block; color: #0c419a; font-size: 14px; font-weight: bold; line-height: 1em; padding: 5px 10px; }
.btn-01.close, .close.btn-06 { border: 1px solid rgba(12, 65, 154, 0.3); position: relative; }
.btn-01.close a, .close.btn-06 a { color: rgba(12, 65, 154, 0.3); }
.btn-01.close:after, .close.btn-06:after { content: ""; display: block; width: 100%; height: 24px; position: absolute; top: 0; }
.btn-01 {max-width: 300px;}
.btn-01 img {
    margin-right: 5px;
}
.btn-06 { max-width: 320px;box-shadow: 2px 2px 4px gray;background: -webkit-gradient(linear, left top, left bottom, from(mistyrose), to(#fff)); }
.btn-06 .img { float: left; }
.btn-06 .txt { font-size: 1rem; display: block; }
.btn-06 .txt .txt_small { font-size: 14px; display: block; font-weight: normal; padding-top:10px; }
.txt_title{padding-bottom:10px;}

.btn-06 .txt:after { content: ""; display: block; width: 0; height: 0;bottom: 20px; border: 6px solid transparent; border-left: 8px solid #0c419a; position: relative; left: 99%; margin-right: -8px; }
.btn-06 a{padding:5px 10px 0px 10px !important;}


/* 戻るアロー */
*[class^="btn"].forward > *:after { content: ""; display: block; width: 0; height: 0; text-align: center; border: 8px solid transparent; border-right: 8px solid #fff; position: relative; left: 50%; margin-left: -8px; }

/* 進むアロー */
*[class^="btn"].next > *:after { content: ""; display: block; width: 0; height: 0; text-align: center; border: 8px solid transparent; border-left: 8px solid #fff; position: relative; left: 50%; margin-right: -8px; }

.btn-list #timestamp{margin: 10px auto 0 auto;}

/*commentTitle*/
.comment_area{margin:10px 15px;}
.comment_area #comment-title{font-weight: 700; margin-bottom:10px;}
.comment_area #comment-body{line-height:1.5em; font-size:16px;}

#countdown-button {
    margin: 20px auto;
}