body {
    font-size: 62.5%;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif;
    line-height: 1.135;
}
h1 {
    text-shadow: 2px 2px 1px #d4d9dc;
    background: whitesmoke;/*背景色*/
    border-top: double 7px #4ec4d3;/*左線*/
    border-bottom: double 7px #4ec4d3;/*右線*/
    width: 31.5em;
    color: #017e84;
    text-align: center;
}
.ui-widget-content.ui-widget,
.ui-widget-header,
.ui-widget-content,
.ui-widget-header .ui-state-active,
.ui-widget-header .ui-state-default {
    border: 1px solid #017e84;
}

#map {
    padding: .1em;
    width: 86em; /* 画面の表示領域の幅 */
    background: #ffffff; /* 画面内のコンテンツ表示部以外の背景色 */
}

#menu {
    width: 17.5em;
}

#menu-list {
    padding: .2em .1em .2em .2em; /* タブの内側の余白 */
    float: left; /* 文字の左寄せ */
    width: 17em; /* タブの幅 */
    background: #ffffff; /* タブの背景色 */
}

#menu li {
    clear: left; /* タブの垂直並べ */
    width: 100%; /* 各タブの幅 */
    height: 2.3em;
    border-bottom-width: 1px !important; /* 各タブの下線幅 */
    border-right-width: 0 !important; /* 各タブの右線幅 */
    margin: 0 -1px .2em 0; /* 各タブの外側の余白 */
    font-size: 1.2em; /* 各タブ文字サイズ */
    white-space:nowrap;
}
#menu li a {
    width: 12em; /* 各タブの幅 */
    display:block; /* タブの垂直並び指定 */
    padding: .5em 1em;
}
#menu li.ui-state-active {
    padding-bottom: 0; /* 選択中タブの下部の内側の余白 */
    margin-bottom: .2em; /* 選択中タブの下部の外側の余白 */
    padding-right: .1em; /* 選択中タブの右部の内側の余白 */
    border-right-width: 1px; /* 選択中タブの右線幅 */
}
#menu li:hover {
    background: #e6f5f4; /* カーソルをあわせたタブの背景色 */
}
#menu .panel {
    float: left; /* タブ内の左寄せ */
    padding: 1em; /* タブ内の内側の余白 */
    background: #ffffff; /* タブ内のコンテンツ表示部の背景色 */
}

#contents {
    float: left;
    padding: 1em;
    background: #ffffff;
    display:block;
    border-width:0
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-state-active .ui-state-focus {
    background: #017e84 !important; /* 選択済みタブの背景色 */
}
.ui-state-default,
.ui-widget-content .ui-state-default{
    background: #cce9e7; /* 非選択タブの背景色 */
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited{
    color: #ffffff !important; /* 選択済みタブの文字色 */
    background: #017e84 !important; /* カーソルをあわせた選択済みタブの背景色 */
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited{
    color: #000000; /* 非選択タブの文字色 */
}

.right {
    float: right;
}
.left {
    float: left;
}
.cl {
    clear: left;
}
.cr {
    clear: right;
}
.cb {
    clear: both;
}
.contents {
    float: right;
}
.rightArea {
    width: 10em;
    margin-left: 2em;
    margin-right: 2.5em;
}
.middleArea {
    width: 45em;
    margin-right: 3.5em;
}
.mapImg {
    float: right;
    margin-top: 3em;
    margin-bottom: 2em;
}
.mapImg img {
    border: 1px solid;
    width: 495px;
    height:310px;
}
.valArea-top,
.valArea-middle,
.valArea-bottom {
    border: 1px solid;
    border-collapse: collapse;
    padding: .3em .1em .2em .2em;
    height: 1.5em;
    width: 10.5em;
    font-size: 1.2em;
    text-align: center;
    background: #FFFFFF;
}
.valArea-top {
    background: #cce9e7;
}
.valArea-middle {
    border-top: none;
}
.valArea-bottom {
    border-top: none;
    margin-bottom: 1em;
}
.valArea-12 {
    border: 1px solid;
    border-top: none;
    border-collapse: collapse;
    padding: .3em .1em .2em .2em;
    margin-bottom: 1em;
    height: 3em;
    width: 10.5em;
    text-align: center;
    font-size: 1.2em;
    background: #FFFFFF;
}
.valArea-wind {
    border: 1px solid;
    border-top: none;
    border-collapse: collapse;
    padding: .3em .1em .2em .2em;
    height: 5.5em;
    width: 10.5em;
    text-align: center;
    font-size: 1.2em;
    background: #FFFFFF;
}
.valArea-wind img {
    width: 5.5em;
    height: 5.5em;
}
.textArea {
    border: 1px solid;
    padding: .3em .1em .3em .3em;
    width: 11.4em;
    height: 4.5em;
    font-size: 1.1em;
    background: #ffffea;
}
.QA {
    border: 1px solid;
    padding: .3em .1em .3em .3em;
    position: absolute;
    top: 600px;
    left: 18px;
    width: 13.5em;
    text-align: center;
    height: 1.2em;
    font-size: 1.2em;
    background: #cce9e7;
    cursor: pointer;
}
.QA_MP {
    border: 1px solid;
    padding: .3em .1em .3em .3em;
    position: absolute;
    top: 490px;
    left: 18px;
    width: 13.5em;
    text-align: center;
    height: 1.2em;
    font-size: 1.2em;
    background: #cce9e7;
    cursor: pointer;
}
.QA:hover,.QA_MP:hover {
    background: #e6f5f4;
    font-weight: bold;
}
.MP_LINK {
    border: 1px solid;
    padding: .3em .1em .3em .3em;
    position: absolute;
    top: 520px;
    left: 18px;
    width: 16.3em;
    text-align: left;
    height: 8.8em;
    font-size: 1.0em;
    background: #cce9e7;
}
.MP_LINK a {
    color: blue;
}
.message {
    border: 1px solid;
    border-radius: 3px 3px 3px 3px;
    padding: .3em .1em .2em .2em;
    width: 39.7em;
    height: 10em;
    font-size: 1.2em;
    overflow-y: scroll;
    background: #ffffea;
}

.valButton {
    cursor: pointer;
}

.dt {
    width: 43em;
    font-weight: bold;
    font-size: 16px;
}
.almMsg {
    font-size: 1.2em;
    font-weight: bold;
    color: #1e90ff;
    display: inline;
}
.normalText{
    font-size: 1.2em;
    padding: .5em;
}
.legend {
    position: relative;
    margin: 2em 0;
    padding: 1.5em 1em;
    left: -15px;
    width: 13.0em;
    height: 11em;
    border: solid 3px #62c1ce;
}
.legend .box-title {
    position: absolute;
    display: inline-block;
    top: -1.5em;
    left: 3em;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 1.2em;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 5px 5px;
}
.description {
    border: 1px solid;
    position: relative;
    padding: .2em .2em .4em .4em;
    margin: 0.2em;
    font-size: 1.2em;
    cursor: pointer;
    display: inline-block;
    background: #cce9e7

}
.tooltip {
    display: none;
    position: absolute;
    padding: 10px;
    font-size: 12px;
    line-height: 1.6em;
    color: #fff;
    border-radius: 5px;
    background: #62c1ce;
    width: 20em;
}

.description:hover .tooltip{
    display: inline-block;
    font-size: 1.2em;
    top: 0px;
    left: 70px;
}