@charset "UTF-8";
 
@media only screen and (orientation: portrait) {

     
#lang_box{
     width: 66%;
     max-width: 500px;
     margin: -9px 12px 0px 0 ;
     float: right;
} 


#maparea {
	width: calc(100% - 18px); 
    max-width: 1200px;
    height: calc(100vh - 122px);
    max-height:960px;
    display: block;
	margin:6px 10px 6px 5px;
	padding:1px 1px 1px 1px;
    background-color:#ABA29C;
	 }	
     
}

/*　▲___________　portrait　____________▲　*/


@media only screen and (orientation: landscape) {
   #lang_box{
   width: 66%;
   max-width: 500px;
   margin: -9px 7px 0px 0 ;
   float: right;

}
    
	#maparea {
    width: calc(100% - 16px); 
    max-width: 1200px;
    height: calc(100vh - 132px);
    max-height: 780px;
	margin:4px 6px 0 6px;
    border: solid 1px #888; 
    background-color:#aaaaaa;
	 }

}

/*　▲____________　landscape　____________▲　*/

/*　ーーーーーーー▼　共通　▼ーーーーーーーー　*/


#top ,#top_en {
    width: calc(100% - 0px);
    height:70px;
    margin:0px auto 0px ;
    border-bottom: solid 1px #ccc;
}

.mark{
    width:128px;
    height:41px;
    position:relative;
    top:20px;
    left:15px;
    background-image:url("../img/header_logo01.png");
    background-size: 100%;
	background-repeat: no-repeat; 
    background-position: left 0px; 
    margin: 0;
}



#title,#title_en{
	 width:400px;
	 height:30px;
	 color:#454545;
	 margin: -41px auto 0px ;
	 padding:12px 0 8px 0;
	 text-align:center;
	 font-size:1.2rem;
	 font-weight:700;
	  
	 }
   

.lang{
   width:30%;
   max-width: 120px;
   background-color: #f20;
   text-align: center;
   float: right;
}

.lang_on{
   width:30%;
   max-width: 120px;
   color:#fff;
   background-color: #858585;
   text-align: center;
   margin: 0 ;
   padding-top: 2px;
   border-bottom: solid 4px #cd303a;
   float: right;
}

   
.lang_space   {
     width:25px;
     float: right;
}



.lang a:link{
   width:100%;
   color:#858585;
   background-color: #eee;
   text-align: center;
   text-decoration:none; 
   padding-top: 2px;
   border-bottom: solid 3px #eee;
   float: right;
}


.lang a:visited {
   color:#858585;
   background-color: #eee;
   text-align: center;
   text-decoration:none;
   border-bottom: solid 3px #eee;
   float: right;
}

.lang a:hover{
   color:#fff;
   background-color: #858585;
   text-align: center;
   text-decoration:none;
   border-bottom: solid 4px #cd303a;
    float: right;
}

.lang_on a:link{
   color:#fff;
   text-decoration:none;
}

.lang_on a:visited{
   color:#fff;
   text-decoration:none;
}

	
/*地図コンテンツ*/	  

 #myContainer {
	 width:auto; 
	 height:100%;
	 }
     
.maparea_sp {
    display: none;
}     

    
/*　凡例　*/

#content{
    max-width: 640px;
    margin:  auto;
}


.hanrei_box	{
    width: 50%;
	margin:0px 0px 10px 0px;
	background-color:#eee;
	}

.hanrei_box	 img {
	width: calc(100% - 1px);
	margin:0 0 0 1px;
	vertical-align: bottom;
	}
	

	
address {
	  text-align:center;
      color:#888888;
	  font-size: 0.8rem; 
      font-style: normal;
	  background-color: #fff; 
      height: 20px;
      padding:5px ;
	  margin-top:0px;
      border-top: solid 1px #ddd;
	  }