/* 共通 (*/

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow: hidden;
    background-color: #f2f8fd;
}
body {
    display: flex;
    flex-direction: column;
    background-color: #f2f8fd;
}
input,
select,
textarea {
    background-color: #FFFFFF;
    padding: 3px;
    outline: none;
    border: 1px solid #666666;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 14px;
}
input[type="file"]{ border: 1px solid #FFFFFF; }
input[type="text"]:disabled{ background:#DCDCDC; }
input[type="password"]:disabled,
input[type="tel"]:disabled{ color:#000000; }
textarea {
    width: 80%;
    height: 100px;
}
select:focus,
input:focus,
textarea:focus {
    box-shadow: 0 0 3px rgb(0,153,225);
    border: 1px solid rgb(0,153,225);
}
button{
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}
input[type="submit"],
input[type="button"] {
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}
a{ cursor: pointer; }

/* アカウント情報の設定 */
.acount-name{
    width: 100%;
    height: auto;
    min-height: 40px;
    text-align: right;
    font-size: 18px;
    margin: 5px 0;
    padding: 5px 0;
    background-color: #f2f8fd;
}
/* ログアウトボタン */
.logout-btn{
    color: rgb(0,153,225);
    border: 1px solid rgb(0,153,225);
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    background-color: #FFFFFF;
    padding: 5px;
    border-radius: 4px;
    margin: 3px;
    width: 80px;
    transition: background-color 0.2s, color 0.2s;
}
.logout-btn:hover {
    background-color: rgb(0,153,225);
    color: #FFFFFF;
}
/* フォーカスがあたっている場合 */
.logout-btn:focus {
    border: solid 2px rgb(125,202,240);
    border-radius: 4px;
    padding: 4px;
}
/* ヘッダー・フッターの設定 */
.rwd { height: 160px; flex-shrink: 0; }
.push { display: none; }
.wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    background-color: #f2f8fd;
}
footer.rwd {
    flex-shrink: 0;
}
header.rwd {
    height: auto;
    flex-shrink: 0;
}
header.rwd .background,
header.rwd .dev-background {
    height: auto;
}

#content{
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 20px;
    padding-bottom: 30px;
    background-color: #f2f8fd;
}
.background{
    width: 100%;
    height: 100%;
    background-color: rgb(10,154,225);
}
.dev-background{
    width: 100%;
    height: 100%;
    background-color: rgb(10,154,225);
}
.left{ float: left; }
.right{ float: right; }
.img-none{ display: none; }
.logo-position{ padding-top: 30px; }
.header-img{ padding-top: 47.5px; }
.side{
    height: 45px;
    width: 100%;
    line-height: 45px;

}
.side div {
	width: 100%;
	height: auto;
}
.contact{
    text-align: right;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
    /*規約対応*/
    /*padding-top: 42px;*/
    padding-top: 20px;
}
.img-wid img{ width: 100%; }

a.color-white {
    color: #FFFFFF;
    font-size: 13px;
    font-weight: bold;
    text-decoration:none;
}

/* 見出し(水色) */
.heading{
    color: rgb(0,120,190);
    font-size: 22px;
    font-weight: bold;
    letter-spacing: 0.03em;
}

/* 共通の青いボタン */
.common-btn {
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    background: linear-gradient(180deg, rgb(30,175,250) 0%, rgb(0,135,210) 100%);
    padding: 7px 22px;
    border-radius: 5px;
    margin: 0 3px;
    box-shadow: 0 2px 5px rgba(0,100,180,0.3);
    transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
    letter-spacing: 0.02em;
}
.common-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, rgb(55,195,255) 0%, rgb(10,155,230) 100%);
    box-shadow: 0 4px 10px rgba(0,100,180,0.4);
    transform: translateY(-1px);
}
/* 使用不可で見た目は共通のボタンの場合 */
.disable-common-btn,
.disable-common-btn:disabled {
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    background: linear-gradient(180deg, rgb(30,175,250) 0%, rgb(0,135,210) 100%);
    padding: 7px 22px;
    border-radius: 5px;
    margin: 0 3px;
}
/* 使用不可の場合 */
.common-btn:disabled {
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    background: linear-gradient(180deg, rgb(200,198,198) 0%, rgb(160,158,158) 100%);
    padding: 7px 22px;
    border-radius: 5px;
    margin: 0 3px;
    box-shadow: none;
    cursor: not-allowed;
}
/* フォーカスがあたっている場合 */
.common-btn:focus {
    outline: 2px solid rgb(125,202,240);
    outline-offset: 2px;
}

/* 件数の色 */
.count-color{
    color: rgb(0,204,102);
    font-size: 17px;
    margin: 0 5px;
    font-weight: bold;
}

.btm-mgn{ margin-bottom: 10px; }

.error-color{
    color: rgb(255,80,80);
    font-size: 15px;
}
.error{ color: #FF0000; }

.wait-cursor{
    position: relative;
    cursor: wait;
}

@media screen and (min-width:0px) and ( max-width:544px) {
    .tel{
        color: #FFFFFF;
        font-size: 20px;
        font-weight: bold;
        padding-right: 25px;
    }
    .tel a {
        color: #FF0000;
        text-decoration:none;
    }

    .side div img{
        width: 45px;
        height: 35px;
        margin-right: 10px;
    }

    /* フローの設定 */
    .rwd-flow{
         height: 35px;
         line-height: 35px;
         font-size: 16px;
     }
    .rwd-flow-wid{ width: 30%; }

    .menu li {
        display: inline-block;  /* 横に並べる */
        list-style-type: none;
        text-transform: uppercase;
        /* padding: 0.3em; */
    }

}
@media screen and (min-width:545px) and ( max-width:992px) {
    .tel{
        color: #FFFFFF;
        font-size: 25px;
        font-weight: bold;
        margin-right: 35px;
    }
    .tel a {
        color: #FF0000;
        text-decoration:none;
    }

    .side div img{ margin-right: 20px; }

    /* フローの設定 */
    .rwd-flow{
         height: 35px;
         line-height: 35px;
         font-size: 14px;
    }
    .rwd-flow-wid{ width: 20%; }

    .menu li {
        display: list-item;  /* 縦に並べる */
        list-style-type: none;
        text-transform: uppercase;
        /* padding: 0.3em; */
    }

}
@media screen and (min-width:993px) {
    .img-none{ display: inline; }

    .tel{
        color: #FFFFFF;
        font-size: 25px;
        font-weight: bold;
        margin-right: 35px;
    }
    .tel a {
        color: #FF0000;
        text-decoration:none;
    }

    .side div img{ margin-right: 20px; }

    /* フローの設定 */
    .rwd-flow{
         height: 35px;
         line-height: 35px;
         font-size: 14px;
    }
    .rwd-flow-wid{ width: 18%; }

    .menu li {
        display: list-item;  /* 縦に並べる */
        list-style-type: none;
        text-transform: uppercase;
        /* padding: 0.3em; */
    }

}


