#japan-map div div.area div {
    border: 1px #ffffff solid;
    text-align: center !important;
    font-size: 14px;
    display: flex;
    display: -webkit-flex;
    align-items: center; /* 縦方向中央揃え */
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    border-radius: 6px;
    -webkit-border-radius: 6px;
    position: absolute;
    box-sizing: border-box;
    transition: 0.2s;
}
#japan-map div div.area div p{
    text-align: center!important;
}
#japan-map div div.area div:hover {
    opacity: 0.5;
    transition: 0.2s;
}

#japan-map {
    display: block;
    width: 777px;
    height: 430px;
    background-color: transparent;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
#japan-map p.area-title {
    display: none;
}

/* 北海道・東北 */

#hokkaido-touhoku {
    width: 136px;
    display: block;
    height: 265px;
    position: absolute;
    left: 495px;
}
#hokkaido-touhoku div.area div {
    background-color: #2189bf/*#7478c2*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}

#hokkaido-touhoku div.area div#hokkaido {
    width: 90px;
    height: 45px;
}
#hokkaido-touhoku div.area div#aomori {
    width: 90px;
    left: 0;
    top: 45px;
}
#akita {
    /*width: 67px;
    height: 42px;*/
    left: 0;
    top: 85px;

}
#iwate {
    /*width: 67px;
    height: 42px;*/
    left: 45px;
    top: 85px;
}
#yamagata {
    /*width: 67px;
    height: 42px;*/
    top: 125px;
    left: 0;
}
#miyagi {
    /*width: 67px;
    height: 42px;*/
    top: 125px;
    left: 45px;
}
#hokkaido-touhoku div.area div#fukushima {
    width: 90px;
    top: 165px;
    left: 0;
}

/* 関東 */

#kantou {
    display: block;
    /*width: 158px;
    height: 174px;*/
    position: absolute;
    top: 205px;
    left: 450px;
    z-index: 2;
}
#kantou div.area div {
    background-color: #00b84c/*#31beca*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#gunma {
    /*width: 50px;
    height: 42px;*/
    top: 0;
    left: 0;
}
#kanagawa {
    /*width: 67px;
    height: 42px;*/
    top: 80px;
    left: 0;
}
#tochigi {
    /*width: 50px;
    height: 42px;*/
    top: 0;
    left: 45px;
}
#saitama {
    /*width: 100px;
    height: 43px;*/
    top: 40px;
    left: 45px;
}
#tokyo {
    /*width: 100px;
    height: 42px;*/
    top: 80px;
    left: 45px;
}
#ibaraki {
    /*width: 52px;
    height: 85px;*/
    top: 0;
    left: 90px;
}
#kantou div.area div#chiba {
    /*width: 52px;
    height: 84px;*/
    height: 80px;
    top: 40px;
    left: 90px;
}



/* 中部 */

#tyubu {
    /*width: 270px;
    height: 211px;*/
    position: absolute;
    left: 315px;
    top: 125px;
}
#tyubu div.area div {
    background-color: #a5d100/*#4ab969*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#tyubu div.area div#ishikawa {
    /*width: 50px;
    height: 57px;*/
    height: 80px;
    top: 0;
    left: 0;
}
#fukui {
    /*width: 68px;
    height: 42px;*/
    top: 80px;
    left: 0;
    z-index: 2;
}
#toyama {
     /*width: 50px;
     height: 42px;*/
    top: 40px;
    left: 45px;
}
#tyubu div.area div#gifu {
    /*width: 50px;
    height: 55px;*/
    height: 80px ;
    top: 80px;
    left: 45px;

}
#aichi {
    /*width: 50px;
    height: 57px;*/
    top: 160px;
    left: 45px;
}

#tyubu div.area div#nigata {
    /*width: 85px;
    height: 42px;*/
    width: 90px ;
    top: 40px;
    left: 90px;
}

#tyubu div.area div#nagano {
    /*width: 50px;
    height: 85px;*/
    height: 80px;
    top: 80px;
    left: 90px;
}
#yamanashi {
    /*width: 50px;
    height: 42px;*/
    top: 120px;
    left: 135px;
    z-index: 3;
}

#shizuoka {
    /*width: 50px;
    height: 42px;*/
    top: 160px;
    left: 90px;
}

/* 近畿 */

#kinki {
    /*width: 135px;
    height: 120px;*/
    position: absolute;
    left: 225px;
    top: 245px;
}
#kinki div.area div {
    background-color: #ecc000/*#b0b72f*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#kinki div.area div#hyougo {
    /*width: 51px;
    height: 98px;*/
    height: 80px;
    top: 0;
    left: 0;
}

#kyoto {
    /*width: 51px;
    height: 84px;*/
    top: 0;
    left: 45px;
}
#osaka {
    /*width: 51px;
    height: 85px;*/
    top: 40px;
    left: 45px;
}
#shiga {
    /*width: 68px;
    height: 42px;*/
    top: 0;
    left: 90px;
}
#nara {
    /*width: 34px;
    height: 85px;*/
    top: 40px;
    left: 90px;
}
#mie {
    /*width: 34px;
    height: 85px;*/
    top: 80px;
    left: 90px;
}
#wakayama {
    /*width: 97px;
    height: 42px;*/
    /*width: 68px !important;*/
    top: 80px;
    left: 45px;
}

/* 中国 */

#tyugoku {
    width: 151px;
    height: 98px;
    position: absolute;
    left: 90px;
    top: 245px;
}
#tyugoku div.area div {
    background-color: #fb9601/*#ef9f27*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#tottori {
    /*width: 50px;
    height: 49px;*/
    top: 0;
    left: 90px;
}
#okayama {
    /*width: 50px;
    height: 49px;*/
    top: 40px;
    left: 90px;
}
#shimane {
    /*width: 51px;
    height: 49px;*/
    top: 0;
    left: 45px;
}
#hiroshima {
    /*width: 51px;
    height: 49px;*/
    top: 40px;
    left: 45px;
}
#yamaguchi {
    /*width: 50px;
    height: 98px;*/
    left: 0;
    top:40px
}

/* 四国 */

#shikoku {
    width: 90px;
    height: 80px;
    position: absolute;
    left: 135px;
    top: 365px;
}
#shikoku div.area div {
    background-color: #ff8355/*#d08f68*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#kagawa {
    /*width: 50px;
    height: 42px;*/
    right: 0;
    top: 0;
}
#ehime {
    /*width: 50px;
    height: 42px;*/
    left: 0;
    top: 0;
}
#tokushima {
    /*width: 50px;
    height: 42px;*/
    right: 0;
    bottom: 0;
}
#kouchi {
    /*width: 50px;
    height: 42px;*/
    left: 0;
    bottom: 0;
}

/* 九州・沖縄 */

#kyusyu {
    width: 90px;
    height: 240px;
    position: absolute;
    left: 0;
    top: 205px;
}
#kyusyu div.area div {
    background-color: #e05981/*#ff7575*/;
    color: #ffffff;

    width: 45px;
    height: 40px;
}
#fukuoka {
    /*width: 50px;
    height: 50px;*/
    left: 45px;
    top: 80px;
}
#saga {
    /*width: 50px;
    height: 50px;*/
    left: 0;
    top: 80px;
}
#nagasaki {
    /*width: 50px;
    height: 50px;*/
    left: 0;
    top: 120px;
}
#oita {
    /*width: 50px;
    height: 50px;*/
    left: 45px;
    top: 120px;
}
#kumamoto {
    /*width: 50px;
    height: 50px;*/
    left: 0px;
    top: 160px;
}
#miyazaki {
    /*width: 50px;
    height: 50px;*/
    left: 45px;
    top: 160px;
}
#kyusyu div.area div#kagoshima {
    /*width: 68px;
    height: 49px;*/
    width: 90px;
    left: 0;
    top: 200px;
}
#okinawa {
    /*width: 50px;
    height: 50px;*/
    left: 0;
    top: 0;
}


/****************************************
	レスポンシブ

****************************************/
/*
@media screen and (max-width: 776px) {
   #japan-map {
       display: flex;
       width: 100%;
       flex-wrap: wrap;
       justify-content: space-around;
   }
   #japan-map p.area-title {
       display: inline-block;
       width: 100%;
       font-size: 15px;
       text-align: center;
       margin-top: 1.5em;
       margin-bottom: 1em;
       color: #000000;
   }
   #hokkaido-touhoku, #kantou, #tyubu, #kinki, #tyugoku, #shikoku, #kyusyu {
       display: block;
       position: static;
       margin: 0 1em 0 1em;
   }
   #japan-map div div.area {
       display: block;
       position: relative;
   }

   #hokkaido-touhoku {
       height: calc(265px + 4.5em);
   }
   #kantou {
       height: calc(174px + 4.5em);
   }
   #tyubu {
       height: calc(211px + 4.5em);
   }
   #kinki {
       height: calc(211px + 4.5em);
   }
   #tyugoku {
       height: calc(98px + 4.5em);
   }
   #shikoku {
       height: calc(84px + 4.5em);
   }
   #kyusyu {
       height: calc(247px + 4.5em);
   }

} レスポンシブ max-776px */

@media screen and (max-width: 1049px) {
    #japan-map {
        display: block;
        width: 100%;
        height: auto;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    #japan-map p.area-title {
        display: inline-block;
        width: 100%;
        font-size: 15px;
        text-align: center;
        margin-top: 1.5em;
        margin-bottom: 1em;
        color: #826238;
    }
    #hokkaido-touhoku, #kantou, #tyubu, #kinki, #tyugoku, #shikoku, #kyusyu {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        height: auto !important;
        position: static;
        margin: 0;
    }
    #japan-map div div.area {
        font-size: 14px;
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        position: relative;
    }

    #japan-map div div.area a {
        height: auto;
        width: 25%;
    }
    #japan-map div div.area div {
        display: block;
        border-radius: 0;
        position: static;
        height: auto !important;
        font-size: 16px;
        width: 100% !important;
        padding: 0.5em 0.3em 0.5em 0.3em;
    }
}  /*レスポンシブ max-500px */

@media screen and (min-width: 768px) and (max-width: 1049px) {
    #japan-map {
        margin-top: 2rem;
    }
}
