/*
Theme Name: legs-order-tools
Theme URI: https://panolabollc.com/
Author: Kenichiro Numa.
Author URI: https://panolabollc.com/
Description: legs-order-tools
Version: 1.02
License: Don't use.
*/


@import url("https://www.panolabollc.com/common/uikit-3.3.0/css/uikit.css");
@import url("https://www.panolabollc.com/common/uikit-plusa-1.0.3/css/uikit-plusa.min.css");

.button_div input[type="submit"] {
    padding: 0;
    font-size: 16px;
    color: #fff;
    background-color: #007bff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.uk-position-top {
    top: 0;
    left: 0;
    right: 0;
    position: fixed;
    background-color: rgba(0, 0, 0, 1);
}

#main {
    width: 100%;
    margin: 5rem auto;
    padding: 0;
}



/*  button css /*

/* BUTTON
-------------------------------------------------------------- */
.uk-button-default {
    color: #ffffff;
    background-color: #9e9e9e;
    border: 1px solid transparent;
}

.uk-button-default:hover,
.uk-button-default:focus {
    color: #ffffff;
    background-color: #757575;
    border: 1px solid transparent;
}

.uk-button-default:active,
.uk-button-default.uk-active {
    color: #ffffff;
    background-color: #616161;
    border: 1px solid transparent;
}

.uk-button-primary {
    color: #ffffff;
    background-color: #2196f3;
    border: 1px solid transparent;
}

.uk-button-primary:hover,
.uk-button-primary:focus {
    color: #ffffff;
    background-color: #1976d2;
    border: 1px solid transparent;
}

.uk-button-primary:active,
.uk-button-primary.uk-active {
    color: #ffffff;
    background-color: #0d47a1;
    border: 1px solid transparent;
}

.uk-button-secondary {
    color: #ffffff;
    background-color: #673ab7;
    border: 1px solid transparent;
}

.uk-button-secondary:hover,
.uk-button-secondary:focus {
    color: #ffffff;
    background-color: #512da8;
    border: 1px solid transparent;
}

.uk-button-secondary:active,
.uk-button-secondary.uk-active {
    color: #ffffff;
    background-color: #311b92;
    border: 1px solid transparent;
}

.uk-button-danger {
    color: #ffffff;
    background-color: #f44336;
    border: 1px solid transparent;
}

.uk-button-danger:hover,
.uk-button-danger:focus {
    color: #ffffff;
    background-color: #d32f2f;
    border: 1px solid transparent;
}

.uk-button-danger:active,
.uk-button-danger.uk-active {
    color: #ffffff;
    background-color: #b71c1c;
    border: 1px solid transparent;
}

.uk-button-success {
    color: #ffffff;
    background-color: #4caf50;
    border: 1px solid transparent;
}

.uk-button-success:hover,
.uk-button-success:focus {
    color: #ffffff;
    background-color: #388e3c;
    border: 1px solid transparent;
}

.uk-button-success:active,
.uk-button-success.uk-active {
    color: #ffffff;
    background-color: #1b5e20;
    border: 1px solid transparent;
}

.uk-button-warning {
    color: #ffffff;
    background-color: #ff9800;
    border: 1px solid transparent;
}

.uk-button-warning:hover,
.uk-button-warning:focus {
    color: #ffffff;
    background-color: #f57c00;
    border: 1px solid transparent;
}

.uk-button-warning:active,
.uk-button-warning.uk-active {
    color: #ffffff;
    background-color: #e65100;
    border: 1px solid transparent;
}

.uk-button-default-outline {
    background-color: transparent !important;
    color: #9e9e9e;
    border: 1px solid #9e9e9e;
}

.uk-button-default-outline:hover,
.uk-button-default-outline:focus {
    color: #757575;
    border: 1px solid #757575;
}

.uk-button-default-outline:active,
.uk-button-default-outline.uk-active {
    color: #616161;
    border: 1px solid #616161;
}

.uk-button-primary-outline {
    background-color: transparent !important;
    color: #2196f3;
    border: 1px solid #2196f3;
}

.uk-button-primary-outline:hover,
.uk-button-primary-outline:focus {
    color: #1976d2;
    border: 1px solid #1976d2;
}

.uk-button-primary-outline:active,
.uk-button-primary-outline.uk-active {
    color: #0d47a1;
    border: 1px solid #0d47a1;
}

.uk-button-secondary-outline {
    background-color: transparent !important;
    color: #673ab7;
    border: 1px solid #673ab7;
}

.uk-button-secondary-outline:hover,
.uk-button-secondary-outline:focus {
    color: #512da8;
    border: 1px solid #512da8;
}

.uk-button-secondary-outline:active,
.uk-button-secondary-outline.uk-active {
    color: #311b92;
    border: 1px solid #311b92;
}

.uk-button-danger-outline {
    background-color: transparent !important;
    color: #f44336;
    border: 1px solid #f44336;
}

.uk-button-danger-outline:hover,
.uk-button-danger-outline:focus {
    color: #d32f2f;
    border: 1px solid #d32f2f;
}

.uk-button-danger-outline:active,
.uk-button-danger-outline.uk-active {
    color: #b71c1c;
    border: 1px solid #b71c1c;
}

.uk-button-success-outline {
    background-color: transparent !important;
    color: #4caf50;
    border: 1px solid #4caf50;
}

.uk-button-success-outline:hover,
.uk-button-success-outline:focus {
    color: #388e3c;
    border: 1px solid #388e3c;
}

.uk-button-success-outline:active,
.uk-button-success-outline.uk-active {
    color: #1b5e20;
    border: 1px solid #1b5e20;
}

.uk-button-warning-outline {
    background-color: transparent !important;
    color: #ff9800;
    border: 1px solid #ff9800;
}

.uk-button-warning-outline:hover,
.uk-button-warning-outline:focus {
    color: #f57c00;
    border: 1px solid #f57c00;
}

.uk-button-warning-outline:active,
.uk-button-warning-outline.uk-active {
    color: #e65100;
    border: 1px solid #e65100;
}


.flex-container {
    display: flex;
    flex-wrap: wrap;
    /* 項目が多い場合に折り返す */
    justify-content: space-between;
    /* 各項目間のスペースを均等に配分 */
}

.flex-item {
    flex: 1 1 10%;
    /* すべての項目が等しい幅で伸縮 */
    padding: 10px;
    /* 内部のスペース */
    box-sizing: border-box;
    /* パディングを含む幅の計算 */
    min-width: 105px; 
    /* 最小幅を設定 */
    text-align: center;
    /* テキストを中央揃え */
}

.uk-list-divider>li {
    display: block;
    /* リストアイテムをブロックレベルで表示 */
    margin-bottom: 10px;
    /* リストアイテム間のマージン */
}


/* CSS */
@media (min-width: 320px) and (max-width: 767px) {
    #left-col {
        display: block;
        /* スマートフォンで表示させる */
    }
}

@media (min-width: 768px) {
    #left-col {
        display: block;
        /* PCサイズでも表示させる */
    }
}