

/*****************************
　ポップアップ表示など
*****************************/
.ol-popup { display: none; position: absolute; background-color: #ffffe0;
 -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
 -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
 filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
 padding: 5px; border-radius: 10px; border: 1px solid #cccccc; bottom: 24px; left: -51px; }
.ol-popup:after, .ol-popup:before { top: 100%; border: solid transparent; content: " ";
								   height: 0; width: 0; position: absolute; pointer-events: none; }
.ol-popup:after  { border-top-color: white;   border-width: 10px; left: 48px; margin-left: -10px; }
.ol-popup:before { border-top-color: #cccccc; border-width: 11px; left: 48px; margin-left: -11px; }
.ol-popup-closer { text-decoration: none; position: absolute; top: 2px; right: 8px; }
.ol-popup-closer:after { content: " ✖ "; }

.ol-mouse-position {
    top: 10px;
    right: 100px;
    font-size: 13px;
    color: white;
    background-color: rgba(0,60,136,0.5);
    padding: 2px 10px;
    border-radius: 5px;
    -webkit-border-radius: 5px; /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */      
        }
.pointname{
    width:80%;
    padding:1px 4px;
    background-color: #800000;
    color:#fff;
    font-weight:bold;
    
    border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px; /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */      
        
}
.p_spot .pointname{
    background-color: #013301;

    
    
}
.p_shisetsu .pointname{
    background-color: #380063;

    
    
}
.introduction , .location{
    margin:3px;
    padding:2px;
    color:#424242;
    line-height: 1.2em;
    border-bottom: dotted #e4e4bd 1px;
}
.map_photo1{
    max-height: 100px;
    max-width: 90px;
    float:left;
    margin:3px;
}

.place{
    margin:0px 0px 0px 0px;
    border-bottom:2px solid #999;
    background-color: #f6f6f6;
    padding:15px 0px;
}


.m_anchor a,
.m_anchor a:link,
.m_anchor a:visited 
{
    text-decoration: none;
    display: block;
    width:80px;
    text-align: center;
    font-weight: bold;
    padding:3px 5px;
    color:#fff;

    border-radius: 5px;
    -webkit-border-radius: 5px; /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */      
    float: right;
    margin: 5px 10px 5px 0px;
    
    background-color: #333377;
    background: -moz-linear-gradient(top, #444492, #333377);
    background: linear-gradient(to bottom, #444492, #333377);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444492', endColorstr='#333377', GradientType=0);
    background: -webkit-gradient(linear, left top, left bottom, from(#444492), to(#333377));
    
    
}
.m_anchor a:hover
{
 
    
    background-color: #191970;
    background: -moz-linear-gradient(top, #444492, #191970);
    background: linear-gradient(to bottom, #444492, #191970);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444492', endColorstr='#191970', GradientType=0);
    background: -webkit-gradient(linear, left top, left bottom, from(#444492), to(#191970));
    
    
}






.m_pointName{
    
    width:62%;
    margin:10px;
    padding:5px 10px;
    background-color: #800000;
    color:#fff;
    font-size:1.1em;
    font-weight:bold;
    float:right;
    border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px; /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */
    
}
.m_pointName.shisetsu{
    background-color: #380063;
}
.m_pointName.spot{
    background-color: #013301;
}
.device-smartphone .m_pointName{
    width: 95%;
    margin:10px auto;
    float: none;
}
.m_introduction {
    width:62%;
    float:right;
    padding:5px;

    /*    background-color: #fff;
    border-right:1px solid #727272;*/
}
.device-smartphone .m_introduction {
    width:100%;
    float:none;
}
.m_access ,.m_location ,.m_parking{
    
    margin:3px;
    padding:2px 5px;
    color:#424242;
    line-height: 1.2em;
    border-bottom: dotted #e4e4bd 1px;
}
.m_location{
    margin-top: 15px;
    
}
.p_confirmation_area a,
.p_confirmation_area a:link,
.p_confirmation_area a:visited 
{
    text-decoration: none;
    display: block;
    width:150px;
    text-align: center;
    font-weight: bold;
    padding:10px 15px;
    color:#fff;

    border-radius: 5px;
    -webkit-border-radius: 5px; /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */      
    margin: 5px auto;
    
    
    background-color: #2f4f4f;
    background: -moz-linear-gradient(top, #6b9292, #2f4f4f);
    background: linear-gradient(to bottom, #6b9292, #2f4f4f);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9292', endColorstr='#2f4f4f', GradientType=0);
    background: -webkit-gradient(linear, left top, left bottom, from(#6b9292), to(#2f4f4f));
    
    
}
.p_confirmation_area a:hover
{
 
    
    background-color: #0d3636;
    background: -moz-linear-gradient(top, #6b9292, #0d3636);
    background: linear-gradient(to bottom, #6b9292, #0d3636);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9292', endColorstr='#0d3636', GradientType=0);
    background: -webkit-gradient(linear, left top, left bottom, from(#6b9292), to(#0d3636));
    
    
}
.m_photoArea{
    width:200px;
    margin:10px;
    float:left;
    text-align: center;
}
.device-smartphone .m_photoArea{
    width:100%;
    margin:10px 0px;
    float:none;

}
.m_photo1{
    max-height: 200px;
    max-width: 200px;
    margin:0px auto;
    
}

#icon_txt{
    margin:10px 0px 0px 0px;
    text-align:right;
}
.device-smartphone #icon_txt{
    text-align:left;
}
#icon_txt img{
    width:20px;
    
}

.j_title{
    margin-top: 15px;
    padding:5px 10px;
    border-left: 15px solid #708090; 
    border-bottom: 2px solid #708090; 
    font-weight: bold;
    
}
#myLocation{
    text-align: right;
    padding:0px 10px;
}


.groumet{
    margin:15px 15px 15px 0px;
    background-color: #fefefe;
    padding:10px 2px 10px 10px;
    
    
    
}
.g_title {
    font-weight:bold;
    color:#e2004e;
}
.groumet .g_item{
    font-size: 0.8em;
    margin:5px;
    border: 1px dotted #ffc0cb;
    background-color: #fce5f1;
    color: #e6348f;
    width:46%;
    float:left;
    text-align: center;
    
}
.groumet .g_name{
    
    text-align: center;
    padding:5px 0px;
}
.groumet .g_item a{
    color: #e6348f;
    
     text-align: center;
}

/*マップメニュー*/
#mapMenu {
    width: 100%;
    margin-top: 20px;
    padding:0px;
    
}

#mm {
    width: 100%;
    
}
#mm li{
    width:33%;
    margin:0px 0px;
    paddign:0px;
        float: left;
}
#mm li a ,
#mm li a:link ,
#mm li a:visited
{
    display: inline-block;
    width: 100%;
    height: 35px;
    text-decoration: none;
    text-align: center;
    background-color: #ebfaeb;
    border-bottom: 3px solid #8fbc8f;
    border-right: 1px solid #8fbc8f;
    padding: 8px 10px 0px 10px;
    font-size: 15px;
    vertical-align: middle;
    color:#5f9ea0;
    font-weight: bold;
    
    border-radius: 8px 8px 0px 0px;
    -webkit-border-radius:  8px 8px 0px 0px; /* Safari,Google Chrome用 */  
    -moz-border-radius:  8px 8px 0px 0px;   /* Firefox用 */      
}
#mm li a:hover {
    background-color: #5f9ea0;
    border-bottom: 3px solid #2f4f4f;
    color:#fff;
    
}

#mm li a.map_menu_select {
    background-color: #008080;
    border-bottom: 3px solid #2f4f4f;
    color:#fff;
    
}