﻿/* デザイン対象外の共通CSSを記載する */

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

/* HKS */
:root {
    --main-width: 1366px;
    --main-width-fhd: 1920px;
    --main-height: 768px;
    --main-font-size: 14px;
    --main-font-family: "ＭＳゴシック", "MS PGothic", sans-serif;
    --main-color: #1fca18;
}

@media screen and (min-width: 1366px) {
    .container-hks {
        width: var(--main-width);
    }
}

@media (min-width: 1920px) {
    .container-hks {
        width: var(--main-width-fhd);
    }
}

.navbar-hks {
    background-color: var(--main-color);
    border-color: #080808;
}

.container-hks {
    /*width: var(--main-width);*/
    font-size: var(--main-font-size);
    font-family: var(--main-font-family);
}

.container-hks-fhd {
    width: var(--main-width-fhd);
    font-family: var(--main-font-family);
}
.screen-title {
    color: #fff;
}

.dialog-hks {
    background-color: var(--main-color);
}

.dialog-hks .ui-dialog-title {
    background-color: var(--main-color);
}

.btn-normal {
    width: 100px;
    font-family: inherit !important;
}

.btn-wide {
    width: 150px;
    font-family: inherit !important;
}

.btn-extra-wide {
    width: 250px;
    font-family: inherit !important;
}

.footer-button-div {
    max-width: var(--main-width);
}

/* メインエリア調整（デザインによるヘッダ横位置固定の対応） */
.hk-main-cont {
    padding-top: 60px !important;	/* #5615対応 値修正*/
}

/* ダイアログ用 */
.ui-dialog {
    font-family: var(--main-font-family) !important;
}

.hk-dialog-main {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    min-height: 200px;
    font-family: var(--main-font-family) !important;
}

.hk-dialog {
    position: relative;
    width: auto;
}
.hk-dialog-content {
    position: relative;
    padding: 15px;
    font-family: var(--main-font-family) !important;
}
.hk-dialog-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
}

/* ダイアログ表示時のヘッダー対策 */
#header.overlay-on {
    z-index: 1;
}

/* 通常ボタン */
.hk-btn-normal {
    font-size: var(--main-font-size);
    font-family: var(--main-font-family);
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px 10px 5px 10px;
    cursor: pointer;
    background-color: #f2f2f2;
    color: #333;
    text-decoration: none !important;
    text-align: center;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
    transition: 0.4s;
}

a.hk-btn-normal {
    line-height: 3;
}

.hk-btn-normal:focus {
    color: #fff;
    background-color: #999;
    border-color: #122b40;
}

.hk-btn-normal:hover {
    color: #fff;
    background-color: #999;
    border-color: #333;
}

.hk-btn-normal:active {
    color: #fff;
    background-color: #333;
    border-color: #204d74;
}

button.hk-btn {
    font-size: 100%;
    font: inherit;
}

/*#6463対応 機材修理依頼登録ボタンの間隔調整CSS*/
button.reginterval {
    font-size: 100%;
    font: inherit;
}

button.hk-btn span {
    display: inline-block;
    text-align: center;
}

.btn100c {
    width: 100px;
    text-align: center;
}

.btn120c {
    width: 120px;
    text-align: center;
}
.btn80c {
    width: 80px;
    text-align: center;
}

/* テキスト */
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}

/* メッセージ */
.hk-message {
    /*padding: 5px;
    margin-bottom: 5px;*/
}

.hk-message li {
    margin: 1px;
}
/*チケット#5411 5615対応　文字を太く、文字サイズを大きく*/
.message-danger {
    /*color: #a94442;
    background-color: #f2dede;*/
    color: #ffffff;
    background-color: #ff0000;
    border-color: #ebccd1;
    font-weight: bold;
    /*font-size: 20px;*/
    font-size: 21px;
}
/*チケット#5411 5615対応　文字を太く、文字サイズを大きく*/
.message-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
    font-weight: bold;
    /*font-size:20px;*/
    font-size: 21px;
}

/* エラー画面用 */
.error_form {
    color: #14854a;
}

.error_form .msg {
    padding: 10px;
}

.error_form .fwb {
    font-weight: bold;
}

a.ul_none {
    text-decoration: none;
}

/* メールプレビュー用 */
.mail_form input {
    font-family: inherit;
}

.mail_form textarea {
    font-family: inherit;
}

.mail_form td {
    padding: 10px;
}

.mail_form_ttl {
    vertical-align: top;
}

.mail_body {
    background-color: #f2f2f2;
}

/* ヘッダ調整 */

/* ロゴなし表示の対応 */
.logo_none .bois_logo {
    background-color: #1fca23 !important;
}

.logo_none .page_ttl {
    box-shadow: none !important;
}

/*--- #5519対応 ローディング表示用 ---*/
.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner {
    width: 50px;
    height: 50px;
    border: 4px #ddd solid;
    border-top: 4px #999 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}

@keyframes sp-anime {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(359deg);
    }
}
