
/* 地形 */
    .container1{
        position: relative;
        border: solid 0px;
/*
        height:710px;
        width:1204px;
*/
        width:95%;
        right: 0;
        left: 0;
        margin: 0 auto;
        /* font-size: 90%; */
    }
    .container1 img{
        width:100%;
/*        
        width:1200px;
*/
        margin: 0% 0% 0% 0%;
    }

/* 凡例 */
    .legend1 img{
        position: absolute;
        width: 30%;
        bottom: 72%;
        left:   0%;
    }

/* 一覧表 */
    .info table{
        border-collapse:  collapse;
        background-color: #ffffff;
        position: absolute;
        text-align: center;
        padding:0;
        margin:0;

        width: 130px;
        font-size: 10px;
    }
@media (min-width: 768px) {
    .info table{
        width: 138px;
        font-size: 11px;
    }
}
@media (min-width: 840px) {
    .info table{
        width: 148px;
        font-size: 12px;
    }
}
@media (min-width: 970px) {
    .info table{
        width: 168px;
        font-size: 14px;
    }
}
@media (min-width: 1080px) {
    .info table{
        width: 186px;
        font-size: 16px;
    }
}
    .info th{
        border: solid 2px;
        padding: 2px;
    }
    .info td{
        border: solid 1px;
        padding: 0px;
    }

/* 引き出し線 */
    .line div{
        position: absolute;
    }

/* アイコン */
    .p_buoy img{
        position: absolute;
        width: 3.2%; /* width:40px; */
        text-align: center;
    }
    .p_buoy img:hover {
        width: 4%;
    }
    .p_wave img{
        position: absolute;
        width: 5.8%; /* width:70px; */
    }
    .p_arrow img{
        position: absolute;
        width: 4%; /* width:50px; */
    }

/* リンク先 */
    .i_link table{
        position: absolute;
        border-collapse:  collapse;
        background-color: #7FFF00;
        padding:0;
        margin:0;
        text-align: center;
        font-size: 10px;
        width:116px;
    }
@media (min-width: 768px) {
    .i_link table{
        font-size: 11px;
        width:124px;
    }
}
@media (min-width: 840px) {
    .i_link table{
        font-size: 12px;
        width:132px;
    }
}
@media (min-width: 970px) {
    .i_link table{
        font-size: 14px;
        width:150px;
    }
}
@media (min-width: 1080px) {
    .i_link table{
        font-size: 16px;
        width:172px;
    }
}
    .i_link th{
        border: solid 2px;
        padding: 1px;
    }
    .i_link td{
        border: solid 1px;
        padding: 0px;
    }

/* 各ページへの移動 */
    .t_page a {
        display: inline-block;
        padding: 0.3em 1em;
        text-decoration: none;
        color: #0059a4;
        border: solid 3px #0059a4;
        font-weight: bold;
        transition: .4s;
    }
    .t_page a:hover { /* マウスが領域に入ったとき*/
        background: #0059a4;
        color: #fff;
    }

/* 高浜沖 */
    .info01 table{
        bottom: 36%;
        left:  0%;
    }
    .p_buoy01 img{
        top: 65%;
        left: 11%;
    }
    .p_wave01 img{
        bottom: 28.5%;
        left:  4.5%;
    }
    .p_arrow01 img{
        top: 71%;
        left: 11%;
    }

/* 越前沖 */
/*
    .info02 table{
        top:  4%;
        right: 46%;
    }
    .p_buoy02 img{
        top: 15%;
        left: 62%;
    }
    .p_wave02 img{
        bottom: 85%;
        left: 55%;
    }
    .p_arrow02 img{
        top:  16%;
        left: 56%;
    }
*/

/* 米ノ */
    .info02 table{
        top: 39%;
        right: 32%;
    }
    .line02 {
        top: 39%;
        left: 68%;
        width: 17%;
        height: 11%;
    }
    .p_buoy02 img{
        top: 47%;
        left: 83%;
    }
    .p_wave02 img{
        bottom: 48%;
        left: 69%;
    }
    .p_arrow02 img{
        top: 52.5%;
        left: 70%;
    }

/* 越前地区（小樟） */
/*
    .info11 table{
        top: 34%;
        right: 27%;
    }
    .p_buoy11 img{
        top: 38%;
        left: 81%;
    }
    .p_wave11 img{
        bottom: 60%;
        left: 74%;
    }
    .p_arrow11 img{
        top: 41%;
        left: 75%;
    }
*/
    .info11 table{
        top: 1%;
        right: 35%;
    }
    .line11 {
        top: 1%;
        left: 65%;
        width: 16%;
        height: 38.5%;
    }
    .p_buoy11 img{
        top: 38%;
        left: 81%;
    }
    .p_wave11 img{
        bottom: 73%;
        left: 66%;
    }
    .p_arrow11 img{
        top:  27.5%;
        left: 67%;
    }
    
/* 南越前地区（糠） */
    .info12 table{
        top: 69%;
        right: 17%;
    }
    .p_buoy12 img{
        top: 56%;
        left: 86%;
    }
    .p_wave12 img{
        bottom: 34%;
        left: 79%;
    }
    .p_arrow12 img{
        top: 62.5%;
        left: 86%;
    }

/* 美浜若狭小浜地区（日向） */
    .info13 table{
        top: 69%;
        left: 44%;
    }
    .line13 {
        top: 55%;
        left: 40%;
        width: 4%;
        height: 14%;
    }
    .p_buoy13 img{
        top: 53%;
        left: 39%;
    }
    .p_wave13 img{
        bottom: 48.5%;
        left: 39%;
    }
    .p_arrow13 img{
        top: 53%;
        left: 43.5%;
    }

/* おおい・高浜地区地区（大島） */
    .info21 table{
        bottom: 36%;
        left: 19%;
    }
    .p_buoy21 img{
        top: 73%;
        left: 19%;
    }
    .p_wave21 img{
        bottom: 28.5%;
        left: 19%;
    }
    .p_arrow21 img{
        top: 72%;
        left: 23.5%;
    }

/* 福井地区（茱崎） */
    .info22 table{
        top: 1%;
        left: 86%;
    }
    .p_buoy22 img{
        top: 16%;
        left: 82%;
    }
    .p_wave22 img{
        bottom: 85.5%;
        right: 15%;
    }
    .p_arrow22 img{
        top: 15.5%;
        right: 19.5%;
    }

/* 高浜沿岸 */
    .info31 table{
        top: 85%;
        left: 9.5%;
    }
    .p_buoy31 img{
        top: 79%;
        left: 9.5%;
    }

/* リンク先 */
    .i_link01 table{
        background-color: #AFEEEE;
        bottom: 63%;
        right: 85%;
    }
    .i_link02 table{
        bottom: 63%;
        left: 15%;
    }
    .i_link03 table{
        top: 79%;
        left: 85%;
    }
    .i_link04 table{
        top: 29%;
        left: 85%;
    }

