/* ページ全体地図 */
 html, body {
    width: 100%;
    height: 100%;
    margin: 0;
font-weight:500;
}


.utmCodeText{
font-size:14px;
text-align:left;
  color: #000;
border:0px solid #fbbf08;
  text-shadow: 2px 2px 0 #fff,
               -2px 2px 0 #fff,
               2px -2px 0 #fff,
               -2px -2px 0 #fff;
}

.img_syo{width:20px;}
.img_basyo{width:20px;}
.shisetu_no{text-align:center;}

.topLogo1{width:42px;height:40px;}
.topLogo2{width:420px;height:36px;}



/*右側へのメニュー用*/
#paletteArea {
    order: 2;
    height: 100%;
    background-color: #f7f7f7;
    border-left: 0px solid #cccccc;
}


.palettePanel .paletteButton .button_example{
border:1px solid #fbbf08; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #a7cfdf; background-image:
 -webkit-gradient(linear, left top, left bottom, from(#a7cfdf), to(#23538a));
 background-image: -webkit-linear-gradient(top, #a7cfdf, #23538a);
 background-image: -moz-linear-gradient(top, #a7cfdf, #23538a);
 background-image: -ms-linear-gradient(top, #a7cfdf, #23538a);
 background-image: -o-linear-gradient(top, #a7cfdf, #23538a);
 background-image: linear-gradient(to bottom, #fef1b3, #ffcc31);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#a7cfdf, endColorstr=#23538a);

color:#000;
font-weight:400;
	width:120px;
cursor:pointer;

}

.palettePanel .paletteButton .button_example2{
border:1px solid #fbbf08; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #ffcc31; background-image:
 -webkit-gradient(linear, left top, left bottom, from(#ffcc31), to(#ff9600));
 background-image: -webkit-linear-gradient(top, #ffcc31, #ff9600);
 background-image: -moz-linear-gradient(top, #ffcc31, #ff9600);
 background-image: -ms-linear-gradient(top, #ffcc31, #ff9600);
 background-image: -o-linear-gradient(top, #ffcc31, #ff9600);
 background-image: linear-gradient(to bottom, #ffcc31, #ff9600);
 filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffcc31, endColorstr=#ff9600);
 color:#000;
 font-weight:400;
 width:120px;
 cursor:pointer;
}

/*
.palettePanel .paletteButton .button_example:hover,
.palettePanel .paletteButton .button_example:hover input:enabled,
.palettePanel .paletteButton .button_example:hover input:checked{

 border:1px solid #fbbf08;
 background-color: #82bbd1; background-image: -webkit-gradient(linear, left top, left bottom, from(#82bbd1), to(#193b61));
 background-image: -webkit-linear-gradient(top, #82bbd1, #193b61);
 background-image: -moz-linear-gradient(top, #82bbd1, #193b61);
 background-image: -ms-linear-gradient(top, #82bbd1, #193b61);
 background-image: -o-linear-gradient(top, #82bbd1, #193b61);
 background-image: linear-gradient(to bottom, #fef1b3, #e5ac00);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#82bbd1, endColorstr=#193b61);
}
*/

#paletteArea.buttonMode {
    width: 151px;
	background-color: #294083;
}
/*
.palettePanel .paletteButton input:disabled,
.palettePanel .paletteButton input:enabled + label {
	display: block;
	box-sizing: border-box;
	height: 30px;
	padding: 9px 9px 9px 22px;
	border: 1px solid #f7f7f7;
	cursor: pointer;

	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	
	-webkit-border-radius: 5px;
	border-radius: 5px;
	display: table-cell;
	vertical-align: middle;

	background-color: rgba(160,210,255,1);

	border: 1px solid #cccccc;
	width:150px;

}
*/
/*
.palettePanel .paletteButton input:enabled + label:hover,
.palettePanel .paletteButton input:checked + label {
	background-color: rgba(255,255,255,0.1);
	border: 1px solid #cccccc;
}
*/


/*上部メニュー用*/
.gnav {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  background: #34ad66;
}
.gnav .nav {
  width: 300px;
  height: 40px;
  margin: 0 auto;
  padding: 0;
  display: flex;
}
.gnav .nav li {
  position: relative;
  list-style: none;
  box-sizing: border-box;
  border-left: 0px solid #eee;
}
.gnav .nav li a {
  display: block;
  width: 60px;
  height: 40px;
  text-align: center;
  color: #000;
  font-size: 12px;
  line-height: 3.2;
  background: #9eefbb;
  box-sizing: border-box;
  text-decoration: none;

}
.gnav .nav li:first-child {
  border-left: 0px solid #eee;
}
.gnav .nav li:last-child {
  border-right: 0px solid #eee;
}
.gnav .nav > li:hover > a {/*layer-1*/
  color: #000;
  background: #afc6e2;
}
.gnav .nav > li li:hover > a {/*layer-2*/
  color: olive;
  background: #afc6e2;
}
.gnav .nav li ul {
  top: 40px;
  left: 0px;
  position: absolute;
}
.gnav .nav li ul li {
  overflow: hidden;
  height: 0;
}
.gnav .nav li ul li a {
  border-top: 1px solid #eee;
}
.gnav .nav li:hover > ul > li {
  overflow: visible;
  height: 40px;
}
  .gnav .nav li ul li ul {
    top: 0;
    left: 20px;
  }
  .gnav .nav li ul li ul:before {/*layer-2▷*/
    position: absolute;
    content: "";
    top: 15px;
    left: 30px;
    border: 5px solid transparent;
    border-left: 5px solid #fff;
  }
  .gnav .nav li ul li ul li:hover > a {/*layer-3*/
    color: pink;
    background: #afc6e2;
  }
  .gnav .nav li ul li ul.left {
    top: 0;
    left: -100px;
  }
  .gnav .nav li ul li ul.left:before,/*layer-2-left▷*/
  .gnav .nav li ul li ul li ul.left:before {/*layer-3-left▷*/
    position: absolute;
    content: "";
    top: 15px;
    left: 100px;
    border: 5px solid transparent;
    border-right: 5px solid #fff;
  }
  .gnav .nav li ul li ul.left li:hover > a {/*layer-2-left*/
    color: pink;
    background: #afc6e2;
  }
  .gnav .nav li ul li ul li ul.left li:hover > a {/*layer-3-left*/
    color: purple;
    background: #afc6e2;
  }
.content {
  width: 100%;
  min-height: 200px;
  background: #eee;
  margin: 0 auto;
  padding: 10px;
  text-align: left;
  box-sizing: border-box;
}
@media (min-width: 769px) {
.gnav {
  overflow: visible;
}
.gnav .nav {
  width: 500px;
}
.gnav .nav li {
  box-sizing: border-box;
}
.gnav .nav li a {
  display: block;
  width: 100px;
  height: 40px;
  font-size: 14px;
  line-height: 2.8;
}
.gnav .nav li:first-child {
  border-left: 0px solid #eee;
}
.gnav .nav li:last-child {
  border-right: 0px solid #eee;
}
  .gnav .nav li ul li ul {
    top: 0;
    left: 110px;
  }
  .gnav .nav li ul li ul:before {/*layer-2▷*/
    left: 30px;
  }
  .gnav .nav li ul li ul.left {
    left: -190px;
  }
  .gnav .nav li ul li ul.left:before,/*layer-2-left▷*/
  .gnav .nav li ul li ul li ul.left:before {/*layer-3-left▷*/
    left: 190px;
  }
.content {
  width: 755px;
}
/* ** */}
/*上部メニュー用ここまで*/


/*資料*/
#dataSiryo{
display:none;
position:absolute;
right:10px;
top:0px;
height:350px;
z-index:2000;
}

.subMenuSiryo  li {
  width: 240px;
  height: 40px;
  text-align: left;
  padding:0 0 0 5px;
  color: #000;
  font-size: 12px;
  line-height: 3.2;
  background: #294083;
  box-sizing: border-box;
  text-decoration: none;
  border-top: 1px solid #aaa;
}

.subMenuSiryo li:hover {
    background: #afc6e2;
}

/*凡例*/
#dispHanrei{
display:none;
position:absolute;
right:151px;
top:0px;
height:490px;
width:240px;
}

#img_hanrei{
width:290px;
}

/*拡大縮小ボタン*/
.leaflet-control-zoom-in,.leaflet-control-zoom-out{

background-color:#ccc;
border: solid 0px #999;
color:#fff;

}

/*マーカーポップアップ*/
/*.popupTable{width:300px;}*/
.subTitle		{background-color:#ffffff	;padding:2px;border:0px;width:70px;white-space: nowrap;}
.popupTable td	{background-color:#ffffff	;padding:2px;border:0px;white-space: nowrap;}
.popuptitle		{background-color:#ffffff	;padding:5px;font-size:16px;border:0px;white-space: nowrap;}
.subTitle_sym		{background-color:#ffffff	;padding:2px;border:0px;height:30px;width:70px;vertical-align:top;}

a.leaflet-popup-close-button{display:none;}

.maru {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  flex-flow: column; 
  vertical-align: top;
}
/* 円の大きさ */
.size_normal{
  width: 25px;
  height: 25px;
}
/* 文字の大きさ */
.letter3 {
  font-size: 0.8em;
  line-height: 0.8em;
}
/* 円と文字の色 */
.pink1 {
  color: #fff;
background-color:#ff0000;
}




/*地図切り替えメニュー*/
.palettePanelBox{
display:none;
position:absolute;
right:10px;
top:5px;
	background-color:#fff;
}
#dataselect{
font-size:16px;
	background-color:#294083;
color:#fff;


	}

.mapListTitle{font-size:14px;
border-bottom: solid 1px #999;
padding:10px 0 0 0; 
}


#srcShisetu{
display:none;
position:absolute;
right:10px;
top:5px;
height: calc(100% - 61px);
width:300px;
}

#srcShisetuMain{
overflow: auto;
height: calc(100% - 61px);
}


/*避難所一覧*/
table.type06{
height:250px;
}
table.type06, th, td {
  border-collapse: collapse;
  border: 1px solid #ccc;
  line-height: 1.5;
}

table.type06 th {
  padding: 10px;
  font-weight: bold;
  vertical-align: middle;
font-size:12px;
color:#000;
}
table.type06 th.th1 {
width:50px;
}
table.type06 th.th3 {
width:50px;
}
table.type06 th.th2 {
width:200px;
}
table.type06 td {
  padding: 5px;
  vertical-align: middle;
font-size:12px;
color:#000;
cursor:pointer;
 }

table.type06 tr:nth-child(even) {
  background: #d9d9d9;
 }
 


/*モーダルメッセージ用*/
.modal-Back{
  position: absolute;
	width:100%;height:100%;
	opacity: .80;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	-khtml-opacity: .80;
	-moz-opacity: .80;
	background-color:#333;
	z-index:1000;
	left:0px;
	top:0px;
	display:none;
pointer-events: auto;
}
.dialog {
  overflow: hidden;
  position: absolute;
  top: 30%;
  width: 300px;
  border:1px solid #aaa;
  z-index:1001;
	display:none;
pointer-events: auto;
}

.dialog-header {
  border: 1px solid #aaa;
  background: #cccccc;
  color: #222222;
  font-weight: bold;
  overflow: hidden;
  padding:5px;
}
.dialog-title {
  float: left;
}
.dialog-close {
  float: right;
  border: 1px solid #d3d3d3;
  background: #e6e6e6;
  font-weight: normal;
  color: #555555;
}
.dialog-back, .dialog-next {
  border: 1px solid #d3d3d3;
  background: #e6e6e6;
  font-weight: normal;
  color: #555555;
}
.dialog-content {
  position: relative;
  border: 0;
  padding: .5em 1em;
  background: #fff;
  overflow: auto;
font-size:12px;
color:#000;
  width: auto;
  height: auto;
}

/* 地図メニュー
---------------------------------------------------------------------- */
.menu_btn {
	
	opacity: .90;
	filter: alpha(opacity=90);
	-ms-filter: "alpha(opacity=90)";
	-khtml-opacity: .90;
	-moz-opacity: .90;
	
	display:block;
	background-color:#333;
	padding: 0.4em 18px;
	color:#ffffff;
	cursor: pointer;
	border:solid 1px #222;
	font-size:110%;
	text-decoration:none;
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	behavior: url(border-radius.htc);
	
	box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 2px 1px  rgba(0, 0, 0, 0.3); /* Firefox */
	-webkit-box-shadow: 0px 0px 2x 1px  rgba(0, 0, 0, 0.3); /* Chrome, Safari */
	
	
}


.menu_btn.left{
	left:10px;
}

.menu_btn.right{
	right:10px;
}

.yearList {
    width: 60px;
    height: 20px;
    margin-top: -5px;
    padding: 2px 2px 2px 4px;
    border: 1px solid #888888;
    background-color: #fff;
    font-size: 1.2rem;
    color: #333;
}

.dayList {
	width: 50px;
	height: 20px;
margin-top:-5px;
	padding: 2px 2px 2px 4px;
	border: 1px solid #888888;
	background-color: #fff;
	font-size: 1.2rem;
	color: #333;

}



.my-icon {
  border-radius: 100%;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  color: white;
}

.icon-dc {
  background: #3bb2d0;
}

.icon-sf {
  background: #3bb2d0;
}

/*作図ツールバーの位置*/
.leaflet-draw{position:absolute;left:306px;top:40px;}

.leaflet-draw-draw-polyline	{position:absolute;left:59px;top:-43px;background: #3bb2d0;}
.leaflet-draw-draw-polygon	{position:absolute;left:88px;top:-43px;background: #3bb2d0;}
.leaflet-draw-draw-circle	{position:absolute;left:117px;top:-43px;background: #3bb2d0;}
.leaflet-draw-draw-rectangle{position:absolute;left:146px;top:-43px;background: #3bb2d0;}
.leaflet-draw-draw-marker	{position:absolute;left:175px;top:-43px;background: #3bb2d0;}

.leaflet-draw-draw-circlemarker{position:absolute;left:-16px;top:-143px;background: #3bb2d0;display:none;}


.leaflet-draw-edit-edit		{position:absolute;left:204px;top:-59px;background: #3bb2d0;}
.leaflet-draw-edit-remove	{position:absolute;left:233px;top:-59px;background: #3bb2d0;}


#map{position:absolute;top:0px;left:0px;}
#subMap{position:absolute;top:-42px;left:50%;}

#map_select		{position:absolute;top:0px;left:0px;pointer-events: none;}
#subMap_select	{position:absolute;top:0px;left:50%;pointer-events: none;}
#mapSelectBar		{position:absolute;top:0px;left:50%;pointer-events: none;}

#mapBorderBlank{position:absolute;top:0px;left:0px;
    width:100%;height:100%;
    opacity: 0.0;background: #3bb2d0;
}


#mapBorderSelectObj{

position:absolute;
left:20px;
top:45%;
width:40px;
height:40px;
border-radius: 50%;/*角丸*/
cursor:move;
/*background-color: #fff;*/
background-image: url(../img/crl_icon2.png);
pointer-events: auto;
}



.leaflet-control-mapbox-geocoder{top:42px;}
/*.leaflet-draw-section{display:none;}*/

.currentPlace{width:110px;}
.utmPoint{width:90px;}
.zoomSize{width:20px;}
.scaleSize{width:160px;}

/*メタデータ検索系*/
/*検索メイン*/
#metaSrcMain{}
/*検索結果*/
#metaSrcResult{display:none;}
/*検索条件保存*/
#metaSrcSavePanel{display:none;}
/*検索条件読み込み*/
#metaSrcReadPanel{display:none;}

#srcCondsListArea{
	overflow: auto;

	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: stretch;
	height: 100%;
	max-height: 180px;
	border: 1px solid #dddddd;
	-webkit-border-radius: 3px;
	border-radius: 3px;

}
/*未対応項目を薄くする*/
#src1,#src3,#src5,#src6 {
	opacity: 0.3;
}
/*不明なものを非表示に*/
.mapDispStatus{display:none;}

/*検索結果の画面のスクロールバー制御*/
#searchMetaDataResultListArea{
	overflow: auto;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: stretch;
	height: 100%;
	border: 1px solid #dddddd;
	-webkit-border-radius: 3px;
	border-radius: 3px;

}
#metaSearchSelectArea{overflow: auto;}


/*検索結果の画像の位置変更*/
.scrollBox ul.listBox li label.hasRadioThumb .thumbColor {
	position: absolute;
	left: 10px;
	top: 6px;
}

/*メタデータ表示用のテーブル*/
.metaDataTable{
  width:380px;margin:10px 0 10px 0;
  border-collapse: separate;
  border-spacing: 0px 5px;
  margin: 0 auto;
}
.metaDataTable td,th{
  padding: 2px;
}
.metaDataTable th{
  background: #666;
  color: #fff;
}
.metaDataTable td{
  background: #f1fafe;
}
.metaDataTable{width:380px;text-align:center;padding:10px 0 10px 0;
  background-color: #ffffff;
}
.metaImageArea{width:380px;text-align:center;padding:10px 0 10px 0;
  background-color: #ffffff;object-fit: cover;
}

.metaDataTable .metaHeader {text-align: center;}
.metaDataTable .metaTitle{width:100px;}
.metaDataTable .metaDispData{width:280px;padding-left:10px;}
.metaErrMsg{display:none;}

.btnDisabled {opacity:0.3;}

/* アップロード、ロード中 */
#overlay {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    display: none;
    background: rgba(0,0,0,0.6);
}

.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #2e93e6 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}

@keyframes sp-anime {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(359deg);
    }
}

.is-hide {
    display: none;
}

/*
.fig{opacity: 0.1;Visibility:hidden;pointer-events: none;}
*/
/*
.fileSystem{background-color: #535353;}
.toolBox{background-color: #535353;}
.toolIcon{background-color: #535353;}
*/


#timerOption{
    padding: 0px 0px 0px 20px;
}

.timerInterval {
    width: 50px;
    height: 20px;
    margin-top: -5px;
    padding: 2px 2px 2px 4px;
    border: 1px solid #888888;
    background-color: #fff;
    font-size: 1.2rem;
    color: #333;
}
.timerBtn{
    width: 40px;
    height: 20px;
    margin-top: -5px;
    margin-left: 10px;
    padding: 0px 0px 0px 0px;
}

#tellus_logo1{position:absolute;top:0px;left:0px;pointer-events: none;}
#tellus_logo2{position:absolute;top:0px;left:0px;pointer-events: none;display:none;}

#sakura_logo1{position:absolute;top:0px;left:0px;pointer-events: none;}
#sakura_logo2{position:absolute;top:0px;left:0px;pointer-events: none;display:none;}

.metaImage{max-width: 350px;max-height: 350px;}



@media screen and (min-width:1000px) {
	#menuImg {
		display:none;
	}


}


/* 記述例 */
@media screen and (min-width:100px) and (max-width:1000px) {
	#header {
		min-width: 100px;
height:40px;
	}

	.logo{text-align: left;float: right;}
	#logo_png {
	    width: 28px;
	    height: 28px;
	}
	#title_png {
	    width: 230px;
	    height: 28px;
		margin-top:3px;
	}
#tblTopMenu{min-width: 100px;}
	.listMenu {
		display:none;
	}


	#menuImg {
	    width: 30px;
	    height: 24px;
		
padding:0px 0px 0 0;
	}

#workArea {
    min-width: 300px;
    height: calc(100% - 40px);
}



#paletteArea{display:none;}


.palettePanelBox,#srcShisetu,#dataSiryo,#dispHanrei {
    right: 10px;
}

.subMenuSiryo li {height:30px;}

#logomenu1{width:40px;height:30px;background-color: transparent;margin:0px;padding:0px;}
#logomenu2{width:420px;height:30px;background-color: transparent;margin:0px;padding:0px;}