/**
 * body共通
 * @version 4.1.0
 * @date 20160901
 *
 * Safari : ch の単位は対応していないため、使用不可
 * !important : 直接jsに書いてあるものを上書きする際に必要
 * IE : calc(%)が小さくなりすぎるため、vwのみでfont-size指定
 *
 * ベンダープレフィックス
 * -moz- Firefox
 * -webkit- Google Chrome, Safari
 * -o- Opera
 * -ms- Internet Explorer
 */

/* 全体 */
html, body {
    height: 100%;
    width: 100%;
}
body {
    padding-bottom:10px;
    /*user-select:none;
    -moz-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;*/
}

h1 {
    font-size: 3.2em;
    padding-top: .5em;
    padding-bottom: .5em;    
}
h2 {
    font-size: 2.4em;
    padding-top: .5em;
    padding-bottom: .2em;
    border-bottom: 3px double #ccc;
}
h3 {
    font-size: 1.6em;
    padding-top: .5em;    
    padding-bottom: .2em;
    border-bottom: 1px solid #ccc;
}
table	{
    border-collapse: collapse;	border-spacing: 0;
    width: 100%;
    margin-bottom: 30px;
}
th, td	{
    padding: 5px 20px;
    color: #3e6990;
}
th {
    border-bottom: 2px solid #3e6990;
}
td {
    border-bottom: 1px solid #ccc;
}
li {
    margin-bottom: 0.2em;
}

input::-ms-clear
{
    display:none;
    visibility:hidden;
}
a,input,button {
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:0;
}
.sweet-alert > h2 {
    font-size: 22px !important;
    border: none !important;
}
/* bootstrapをコンテンツエリア（白枠）から外す */
.container-fluid {
    padding-left: 0px;
    padding-right: 0px;
}
/* ログイン、ログアウトボタン、新規登録ボタン */
.hoverButton:hover, .tapButton {
    background-color: #5487b5 !important;
}
/* menuタブ */
@media screen and (max-width:1060px) {
    .ContentsMenu {
        background: #aabd8c;
        height: auto !important;
    }
}
/* #login@public */
@media screen and (max-width:400px) {
    .Panel {
        font-size: 5.5vw !important;
    }
    .footer {
        font-size: 4.0vw !important;
    }
}

/* stationData@main */
/* HeaderArea */
@media screen and (max-width:540px) {
    .Header {
        height: 50px !important;
    }
    .Logout {
        width: 50px !important;
        padding: 0 8px !important;
        font-size: 9px !important;
    }
    .Name {
        float: left !important;
        height: 14px !important;
        width: 100% !important;
        margin-bottom: 4px;
        padding-left: 10px !important;
        font-size: 10px !important;
        line-height: 14px !important; 
    }
}
/* LatestDataArea */
/* 3列幅狭表示 */
@media screen and (max-width:1039px) {
    .LatestDataArea {
        width: 888px !important;
    }
    .EachData {
        width: 290px !important;
    }
}
/* 2列表示 */
@media screen and (max-width:927px) {
    .LatestDataArea {
        width: 666px !important;
    }
    .TitleArea {
        height: 54px !important;
    }
    .Expiration {
        padding-top: 6px !important;
        height: 24px !important;
    }
    .EachData {
       width: 327px !important;
    }
}
/* 2列幅狭表示 */
@media screen and (max-width:705px) {
    .LatestDataArea {
        width: 592px !important;
    }
    .EachData {
       width: 290px !important;
    }
}
/* 1列表示 */
@media screen and (max-width:632px) {
    .LatestDataArea {
        width: 333px !important;
    }
    .TitleArea {
        height: 74px !important;
    }
    .PastTitleArea {
        padding-top: 4px !important;
        padding-left: 0px !important;
        height: 20px !important;
    }
    .EachData {
       width: 327px !important;
    }
}
/* 1列表示 */
@media screen and (max-width:372px) {
    .LatestDataArea {
        width: 296px !important;
    }
    .EachData {
       width: 290px !important;
    }
}
/* historyData@main */
/* カレンダーボタン・エリア調整ボタンのマウスオーバー、タップ */
.hover:hover, .tap {
    background-color: #a7c1d9 !important;
    border-color: #9ebbd5 !important;
}

@media screen and (max-width:527px) {
    .CalButtonArea {
        float: none !important;
        margin-top: 5px;
        width: 216px !important;
    }
    .CalButton {
        padding: 0 12px !important;
    }
}
/* カレンダー */
.hasDatepicker {
    -webkit-appearance: textfield !important;
    font-size: 18px !important;
    width: 130px;
    vertical-align: bottom;
    border-radius: 0 !important;
}
@media screen and (max-width:500px) {
    .hasDatepicker {
        width: 100px !important;
        font-size: 16px !important;
    }
}
@media screen and (max-width:420px) {
    .hasDatepicker {
        width: 42% !important;
    }
}
#ui-datepicker-div {
    z-index: 100 !important; /* デフォルトは z-index: 1; canvas(data graph) の z-index: 2; */
}
.ui-datepicker-trigger {
    height: 30px;
    padding: 0 5px;
    background: #f6f6f6;
    box-sizing: border-box;
    border-style: none;
    border: 1px solid #dddddd;
    font-size: 12px;
}
.ui-datepicker-trigger {
    outline: none;
}
.ui-datepicker-current {
    display: none !important; /* ｢今日｣のボタンは日付選択ではなく、｢今日を含むその月を表示｣でややこしい */
}
th.ui-datepicker-week-end {
	color: #00f;
}
th.ui-datepicker-week-end:first-child {
	color: #f00;
}
@media screen and (max-width:767px) {
    .ui-datepicker {
	margin: auto;
	overflow: hidden;
    }
}

/* マスタメンテ共通 */
@media screen and (max-width:976px) {
    .List {
        margin-right: 0px !important;
        margin-bottom: 10px;
        width: 100% !important;
    }
}
@media screen and (max-width:686px) {
    .Main {
        width: 100% !important;
    }
    .styledForm, .textForm {
        margin-bottom: 5px !important;
        padding-top: 0px !important;
    }
}
@media screen and (max-width:516px) {
    .styledForm, .textForm {
        width: 70vw !important;
    }
    .dataLabel {
        width: 100% !important;
        text-align: left !important;
    }
    .dataList, .dataForm {
        width: 35vw !important;
    }
}
/* 削除ボタン */
.hoverDelete:hover, .tapDelete {
    background: #777777 !important;
}
/* ヒントボタン */
.hoverHints:hover, .tapHints {
    background: #f39b6d !important;
}
/* maintenance@setting */
@media screen and (max-width:417px) {
    .ReloadArea {
        margin-top: 3px !important;
    }
    .ConditionsArea {
        height: 63px !important;
    }
}