@charset "UTF-8";
/**
 * @fileoverview CSS
 * @package aulta
 * @author takashi shinohara
 * @copyright Copyright (c) 2008, takashi shinohara
 * @link https://aulta.co.jp/
 * @license https://aulta.co.jp/licensed.html
 * @version 9.6.240.48 (2014-12-27 : 2025-02-06)
 * @access public
 */

/***********************************************************************
    overwrite for bootstrap 5
    bootstrapの定義をそのまま上書きする
***********************************************************************/

:root {
    scroll-padding-top: 110px;
    scroll-behavior: auto;
}

/* 説明 */
.badge {
    --bs-badge-font-size: .92em;
}

.form-control {
    border-color: #aaa;
    width: auto;
}

.form-select {
    width: auto;
    font-size: inherit;
    border-color: #aaa;
    display: inline-block;
}

.form-check-input {
    width: 1.3em;
    height: 1.3em;
    margin-top: .05em;
    border-color: #aaa;
}

.form-check-label {
    margin-left: 2px;
}

.page-link {
    font-size: 12px;
}

code {
    font-size: 12px;
}


/***********************************************************************
    拡張
***********************************************************************/

.bg-custom-1 {
    background-color: #e2e3e5;
}

.alert-custom-1 {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

input:checked + label {
    color: #f00;
}

.form-group .choice-group {
    display: block;
    padding-top: 4.75px;
}

.form-group .choice-group-inline {
    display: inline-block;
}

form .require {
    margin-left: .3em;
    color: #c00;
    font-weight: normal;
}

form .horizontal-layout .form-group {
    border-bottom: solid 1px #dadada;
    padding: 10px;
}

#search-form .horizontal-layout .form-group {
    border-bottom-width: 0;
    padding: 5px 10px;
}

/***********************************************************************
    html
***********************************************************************/

textarea {
    resize: auto;
}

html.bootstrap-font-base-12 {
    font-size: 10px;
}

html.bootstrap-font-base-12 .form-control {
    font-size: 12px;
}

html.bootstrap-font-base-12 .btn {
    font-size: 14px;
    padding: 6px 12px;
}

html.bootstrap-font-base-12 .btn-lg {
    font-size: 18px;
    padding: 8px 16px;
}

html.bootstrap-font-base-12 .btn-sm {
    font-size: 12px;
    padding: 4px 8px;
}

html.bootstrap-font-base-12 .btn-mini {
    line-height: 1;
    font-size: 12px;
    padding: 4px 10px;
}

html.bootstrap-font-base-12 .tooltip.show {
    font-size: 12px;
}

.btn-default {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}

/* @todo : hide は bootstrap 4 系の名残りだが、jsで add / remove している可能性があるので簡単には消せない */
.hide {
    display: none;
}

.error-string {
    color: #f00;
}

.invalid-string {
    text-decoration: line-through;
}

.modal-title {
    font-weight: bold;
}

.a-com-input-error.invalid-feedback {
    font-size: 12px;
}

.text-url ,
.form-control-plaintext {
    word-break: break-all;
}

/***********************************************************************
    hands on table
***********************************************************************/

.handsontable .htCore th ,
.handsontable .htCore td {
    vertical-align: middle;
}

/***********************************************************************
    ボタン、ステータス
***********************************************************************/
.btn-status {
    position: relative;
}
.btn-status > [role="status"]{
    display: none;
}

.btn-status:disabled > [role="status"]{
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -1rem;
    margin-left: -1rem;
}


/***********************************************************************
    ナビバー、ボタン
***********************************************************************/
button.navbar-toggle {
    position: absolute;
}
button.navbar-toggle-left {
    display: block;
    left: 10px;
    top: 9px;
    padding: 7px 8px;
    border-radius: 4px;
    background-color: #fafafa;
    border: solid 1px #aaa;
}
button.navbar-toggle .icon-bar {
    display: block;
    background-color: #888;
    width: 20px;
    height: 2px;
    border-radius: 1px;
    margin: 3px 0 0 0;
}
button.navbar-toggle .icon-bar:nth-child(2){
    margin-top: 0;
}

/***********************************************************************
    badge
***********************************************************************/
.btn .badge {
    line-height: 1.3;
}



/***********************************************************************
    clear
***********************************************************************/
.cbox {
    zoom: 100%;
}
.cbox:after {
    content: " ";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}


/***********************************************************************
    全体のスタイル
***********************************************************************/
/*
ここを有効にすると、modal で都合悪い
html {
    overflow-y:scroll;
}
*/
body {
    text-align: left;
    margin: 0;
    padding: 0;
    font-family: 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif;
}

body ,
table {
    font-size: 12px;
}

p, li, th, td, dt, dd {
    line-height:1.6em;
}

/* todo : 非推奨、Firefoxのみ対応、将来的に削除予定 */
input.jpn ,
textarea.jpn {
    ime-mode: active;
}

input.en ,
textarea.en {
    ime-mode:inactive;
}

/* table
*****************************************/
table th,
table td{
    border-top: solid 1px #eee;
    border-bottom: solid 1px #ddd;
    padding: 0.7em 1em;
    vertical-align: top;
    text-align: left;
}
table th{
    background-color: #f5f5f5;
    white-space: nowrap;
}
table td .text-silver{
    color: #999999;
}
table td .margin-left{
    margin-left: 1em;
}
table td .margin-right{
    margin-right: 1em;
}


/* 固定幅 */
table.fiexed{
    table-layout: fixed;
    width: 100%;
}

/* 格子 */
table.lattice,
table.lattice th,
table.lattice td{
    border: solid 0px #ccc;
}

table.lattice{
    border-top-width: 1px;
    border-left-width: 1px;
}

table.lattice th,
table.lattice td{
    border-right-width: 1px;
    border-bottom-width: 1px;
}

/* セル、スペースなし */
.table .table-no-sp-lr{
    padding-left: 0;
    padding-right: 0;
}
.table .table-no-sp-tb{
    padding-top: 0;
    padding-bottom: 0;
}
.table .table-no-sp-l{
    padding-left: 0;
}
.table .table-no-sp-r{
    padding-right: 0;
}
.table .table-no-sp-t{
    padding-top: 0;
}
.table .table-no-sp-b{
    padding-bottom: 0;
}

/* nowrap */
.table-nowrap th ,
.table-nowrap td {
    white-space: nowrap;
}

tr.row-private th ,
tr.row-private td {
    background-color: #eeeeee;
}


/***********************************************************************
    フォーム
***********************************************************************/

/* form
*****************************************/

form input.textbox-error,
form textarea.textbox-error{
    background-color:#f7e9cf;
}
form input.textbox-focus,
form textarea.textbox-focus{
    border-color:#00BFFF;
    background-color:white;
}

form .form-control-inlines .form-control ,
form .form-control-inlines .form-control-plaintext ,
.a-com-datepicker .form-control-plaintext {
    display: inline-block;
    width: auto;
}

form .form-control:disabled,
form .form-control[readonly]{
    border: 0;
}

/*
 *3 .box-group
 */
form .box-group{ display:block;}
form .box-group label.checkbox,
form .box-group label.radiobox{
    float:left;
    margin-right:8px;
    padding:2px;
}
form .box-group-float-none label.checkbox,
form .box-group-float-none label.radiobox{
    float: none;
}
form .box-group .preview{
    margin-right:10px;
}
ul.checkbox-group{
    margin: 0;
    padding: 0;
}
ul.checkbox-group,
ul.checkbox-group ul{
    list-style: none;
}

/*
 *3 .checkbox
 *3 .radiobox
 */
form label.checkbox,
form label.radiobox{
    padding:3px;
    display:inline;
    cursor:pointer;
    white-space:nowrap;
}
label.checkbox-checked,
label.radiobox-checked{
    color: #f00;
}

/*
 *3 span.error-message
 */
form span.error-message{
    clear:both;
    display:block;
    margin: 0.5em 0 0 0;
}
/*
 *3 span.info-message
 */
form span.info-message{
    clear:both;
    display:block;
    margin: 0.5em 0 0 0;
}

/*
 *3 .enable_false
 */
form div.enable_false,
form span.enable_false{
    font-size:1.2em;
    line-height:1.2em;
    font-weight:normal;
    color:black;
    padding:0px 3px;
}
/*
 *3 div.preview
 *
*/
form .before-text{ margin-right: .5em; color: #777;}
form .after-text{ margin:0 0 0 .5em; color: #777;}

form .input-box{
    margin: 0 0 0 1rem;
    display: inline-block;
}
form .input-box:first-child{
    margin: 0;
}

/*
 *3 .submit-buttons
 */
form .submit-buttons{
    margin: 2em 0;
    padding: 0;
    text-align: left;
}
form .submit-buttons input{
    margin: 0 1em;
}

/***********************************************************************
    .form table
***********************************************************************/

/* 未対応の個所にメッセージを出す */
.form table{
    position: relative;
}
.form table:after{
    position: absolute;
    content: '.form table 指定されています。';
    border: solid 1px #f00;
    background-color: #fff;
    color: #f00;
    top: 0;
    left: 0;
    padding: 10px;
    white-space: nowrap;
}

.alt-geo-map table:after {
    content: '';
    display: none;
}

/* 対応できていればメッセージを消す */
.table-default:after,
.table-simple:after,
.form .table:after,
.form table.serch-params:after,
.form table.form-table:after,
.form table.form-sub-table:after,
.form table.sub-table2:after,
.handsontable table:after{
    content: '';
    display: none;
}

.form .table th,
.form .table td,
.form table.serch-params th,
.form table.serch-params td,
.form table.form-table th,
.form table.form-table td{
    border-width: 0;
}

.form table.table-bordered th,
.form table.table-bordered td{
    border-width: 1px;
}

.form .table .file-upload-image-editor,
.form table.serch-params .file-upload-image-editor,
.form table.form-table .file-upload-image-editor{
    display: block;
    margin-top: 0.5em;
}
.form .table .file-upload-image-preview,
.form table.serch-params .file-upload-image-preview,
.form table.form-table .file-upload-image-preview{
    display: block;
}
.form .table .file-upload-image-editor span,
.form .table .file-upload-image-preview span,
.form table.serch-params .file-upload-image-editor span,
.form table.serch-params .file-upload-image-preview span,
.form table.form-table .file-upload-image-editor span,
.form table.form-table .file-upload-image-preview span{
    margin-left: 1em;
}

/* .table-simple   2019-10-16
***********************************************/

.table-simple {
    margin-left: -1em;
}
.table-simple th ,
.table-simple td {
    font-weight: normal;
    background-color: transparent;
    border-width: 0
}


/* .form table background
***********************************************/
.form table tr.bg-silver{
    background-color: #eeeeee;
}

/* .form table line
***********************************************/
.form .line-top th,
.form .line-top td,
.form-read table,
.form-confirm table,
.form-complete table{
    border-top: solid 1px #dddddd;
}
.form .line-bottom th,
.form .line-bottom td,
.form-read table th,
.form-read table td,
.form-confirm table th,
.form-confirm table td,
.form-complete table th,
.form-complete table td{
    border-bottom: solid 1px #dddddd;
}
.form-read table th,
.form-confirm table th,
.form-complete table th{
    color: #555555;
}
.form-read .preview,
.form-confirm .preview,
.form-complete .preview{
    margin-right: 1em;
}

.form .preview-no-select{
    text-decoration : line-through;
    color: #aaaaaa;
}

/* .form-categories
***********************************************/
.form-categories ul{
        list-style: none;
        margin: 0;
        padding: 0 0 0 1.5em;
}
.form-categories ul li{
    line-height: 2em;
}

/* .form .type-address
***********************************************/
.form-editor .type-address td{
    line-height:3em;
}
.form-editor .type-address td .wrap-zipcode{
    margin-left: 2.2em;
}
.form-editor .type-address td .wrap-pref{
    margin-left: 3.7em;
}
.form-editor .type-address td .label-address1,
.form-editor .type-address td .label-address2{
    margin-right: 1em;
}
.form-confirm .type-address td .label-address1,
.form-confirm .type-address td .label-address2{
    display: none;
}

/* .form-editor .multiline
***********************************************/
.form-editor .multiline th,
.form-editor .multiline td{
    line-height: 3em;
}


/***********************************************************************
    アイコン
***********************************************************************/
.icon{
    background-position:8px 6px;
    background-repeat:no-repeat;
    padding-left:50px;
}
.icon16-add{ background-image:url('../images/icon/Add_16.png');}
.icon32-add{ background-image:url('../images/icon/Add_32.png');}
.icon16-address-book{ background-image:url('../images/icon/Address_Book_16.png');}
.icon32-address-book{ background-image:url('../images/icon/Address_Book_32.png');}
.icon16-alert{ background-image:url('../images/icon/Alert_16.png');}
.icon32-alert{ background-image:url('../images/icon/Alert_32.png');}
.icon16-announcement{ background-image:url('../images/icon/Announcement_16.png');}
.icon32-announcement{ background-image:url('../images/icon/Announcement_32.png');}
.icon16-back{ background-image:url('../images/icon/Back_16.png');}
.icon32-back{ background-image:url('../images/icon/Back_32.png');}
.icon16-bin-empty{ background-image:url('../images/icon/Bin_Empty_16.png');}
.icon32-bin-empty{ background-image:url('../images/icon/Bin_Empty_32.png');}
.icon16-bin-full{ background-image:url('../images/icon/Bin_Full_16.png');}
.icon32-bin-full{ background-image:url('../images/icon/Bin_Full_32.png');}
.icon16-box{ background-image:url('../images/icon/Box_16.png');}
.icon32-box{ background-image:url('../images/icon/Box_32.png');}
.icon16-burn{ background-image:url('../images/icon/Burn_16.png');}
.icon32-burn{ background-image:url('../images/icon/Burn_32.png');}
.icon16-cd{ background-image:url('../images/icon/CD_16.png');}
.icon32-cd{ background-image:url('../images/icon/CD_32.png');}
.icon16-calender{ background-image:url('../images/icon/Calender_16.png');}
.icon32-calender{ background-image:url('../images/icon/Calender_32.png');}
.icon16-chat{ background-image:url('../images/icon/Chat_16.png');}
.icon32-chat{ background-image:url('../images/icon/Chat_32.png');}
.icon16-clock{ background-image:url('../images/icon/Clock_16.png');}
.icon32-clock{ background-image:url('../images/icon/Clock_32.png');}
.icon16-close{ background-image:url('../images/icon/Close_16.png');}
.icon32-close{ background-image:url('../images/icon/Close_32.png');}
.icon16-computer{ background-image:url('../images/icon/Computer_16.png');}
.icon32-computer{ background-image:url('../images/icon/Computer_32.png');}
.icon16-contact{ background-image:url('../images/icon/Contact_16.png');}
.icon32-contact{ background-image:url('../images/icon/Contact_32.png');}
.icon16-database{ background-image:url('../images/icon/Database_16.png');}
.icon32-database{ background-image:url('../images/icon/Database_32.png');}
.icon16-delete{ background-image:url('../images/icon/Delete_16.png');}
.icon32-delete{ background-image:url('../images/icon/Delete_32.png');}
.icon16-down{ background-image:url('../images/icon/Down_16.png');}
.icon32-down{ background-image:url('../images/icon/Down_32.png');}
.icon16-edit{ background-image:url('../images/icon/Edit_16.png');}
.icon32-edit{ background-image:url('../images/icon/Edit_32.png');}
.icon16-favorite{ background-image:url('../images/icon/Favorite_16.png');}
.icon32-favorite{ background-image:url('../images/icon/Favorite_32.png');}
.icon16-flag{ background-image:url('../images/icon/Flag_16.png');}
.icon32-flag{ background-image:url('../images/icon/Flag_32.png');}
.icon16-floppy{ background-image:url('../images/icon/Floppy_16.png');}
.icon32-floppy{ background-image:url('../images/icon/Floppy_32.png');}
.icon16-folder{ background-image:url('../images/icon/Folder_16.png');}
.icon32-folder{ background-image:url('../images/icon/Folder_32.png');}
.icon16-folder-open{ background-image:url('../images/icon/Folder_Open_16.png');}
.icon32-folder-open{ background-image:url('../images/icon/Folder_Open_32.png');}
.icon16-forward{ background-image:url('../images/icon/Forward_16.png');}
.icon32-forward{ background-image:url('../images/icon/Forward_32.png');}
.icon16-help{ background-image:url('../images/icon/Help_16.png');}
.icon32-help{ background-image:url('../images/icon/Help_32.png');}
.icon16-home{ background-image:url('../images/icon/Home_16.png');}
.icon32-home{ background-image:url('../images/icon/Home_32.png');}
.icon16-info{ background-image:url('../images/icon/Info_16.png');}
.icon32-info{ background-image:url('../images/icon/Info_32.png');}
.icon16-key{ background-image:url('../images/icon/Key_16.png');}
.icon32-key{ background-image:url('../images/icon/Key_32.png');}
.icon16-lock{ background-image:url('../images/icon/Lock_16.png');}
.icon32-lock{ background-image:url('../images/icon/Lock_32.png');}
.icon16-mail{ background-image:url('../images/icon/Mail_16.png');}
.icon32-mail{ background-image:url('../images/icon/Mail_32.png');}
.icon16-mail-read{ background-image:url('../images/icon/Mail_Read_16.png');}
.icon32-mail-read{ background-image:url('../images/icon/Mail_Read_32.png');}
.icon16-music{ background-image:url('../images/icon/Music_16.png');}
.icon32-music{ background-image:url('../images/icon/Music_32.png');}
.icon16-options{ background-image:url('../images/icon/Options_16.png');}
.icon32-options{ background-image:url('../images/icon/Options_32.png');}
.icon16-paste{ background-image:url('../images/icon/Paste_16.png');}
.icon32-paste{ background-image:url('../images/icon/Paste_32.png');}
.icon16-pictures{ background-image:url('../images/icon/Pictures_16.png');}
.icon32-pictures{ background-image:url('../images/icon/Pictures_32.png');}
.icon16-portfolio{ background-image:url('../images/icon/Portfolio_16.png');}
.icon32-portfolio{ background-image:url('../images/icon/Portfolio_32.png');}
.icon16-rss{ background-image:url('../images/icon/RSS_16.png');}
.icon32-rss{ background-image:url('../images/icon/RSS_32.png');}
.icon16-redo{ background-image:url('../images/icon/Redo_16.png');}
.icon32-redo{ background-image:url('../images/icon/Redo_32.png');}
.icon16-refresh{ background-image:url('../images/icon/Refresh_16.png');}
.icon32-refresh{ background-image:url('../images/icon/Refresh_32.png');}
.icon16-search{ background-image:url('../images/icon/Search_16.png');}
.icon32-search{ background-image:url('../images/icon/Search_32.png');}
.icon16-security{ background-image:url('../images/icon/Security_16.png');}
.icon32-security{ background-image:url('../images/icon/Security_32.png');}
.icon16-speaker{ background-image:url('../images/icon/Speaker_16.png');}
.icon32-speaker{ background-image:url('../images/icon/Speaker_32.png');}
.icon16-stationery{ background-image:url('../images/icon/Stationery_16.png');}
.icon32-stationery{ background-image:url('../images/icon/Stationery_32.png');}
.icon16-stats{ background-image:url('../images/icon/Stats_16.png');}
.icon32-stats{ background-image:url('../images/icon/Stats_32.png');}
.icon16-stop{ background-image:url('../images/icon/Stop_16.png');}
.icon32-stop{ background-image:url('../images/icon/Stop_32.png');}
.icon16-system{ background-image:url('../images/icon/System_16.png');}
.icon32-system{ background-image:url('../images/icon/System_32.png');}
.icon16-tag{ background-image:url('../images/icon/Tag_16.png');}
.icon32-tag{ background-image:url('../images/icon/Tag_32.png');}
.icon16-template{ background-image:url('../images/icon/Template_16.png');}
.icon32-template{ background-image:url('../images/icon/Template_32.png');}
.icon16-{ background-image:url('../images/icon/Thumbs.db');}
.icon16-tip{ background-image:url('../images/icon/Tip_16.png');}
.icon32-tip{ background-image:url('../images/icon/Tip_32.png');}
.icon16-tools{ background-image:url('../images/icon/Tools_16.png');}
.icon32-tools{ background-image:url('../images/icon/Tools_32.png');}
.icon16-tutorial{ background-image:url('../images/icon/Tutorial_16.png');}
.icon32-tutorial{ background-image:url('../images/icon/Tutorial_32.png');}
.icon16-undo{ background-image:url('../images/icon/Undo_16.png');}
.icon32-undo{ background-image:url('../images/icon/Undo_32.png');}
.icon16-up{ background-image:url('../images/icon/Up_16.png');}
.icon32-up{ background-image:url('../images/icon/Up_32.png');}
.icon16-user{ background-image:url('../images/icon/User_16.png');}
.icon32-user{ background-image:url('../images/icon/User_32.png');}
.icon16-web{ background-image:url('../images/icon/Web_16.png');}
.icon32-web{ background-image:url('../images/icon/Web_32.png');}
.icon16-window{ background-image:url('../images/icon/Window_16.png');}
.icon32-window{ background-image:url('../images/icon/Window_32.png');}
.icon16-wizard{ background-image:url('../images/icon/Wizard_16.png');}
.icon32-wizard{ background-image:url('../images/icon/Wizard_32.png');}
.icon16-write{ background-image:url('../images/icon/Write_16.png');}
.icon32-write{ background-image:url('../images/icon/Write_32.png');}


#secondary .widget .widget-title.icon16-add,
#secondary .widget .widget-title.icon16-address-book,
#secondary .widget .widget-title.icon16-alert,
#secondary .widget .widget-title.icon16-announcement,
#secondary .widget .widget-title.icon16-back,
#secondary .widget .widget-title.icon16-bin-empty,
#secondary .widget .widget-title.icon16-bin-full,
#secondary .widget .widget-title.icon16-box,
#secondary .widget .widget-title.icon16-burn,
#secondary .widget .widget-title.icon16-cd,
#secondary .widget .widget-title.icon16-calender,
#secondary .widget .widget-title.icon16-chat,
#secondary .widget .widget-title.icon16-clock,
#secondary .widget .widget-title.icon16-close,
#secondary .widget .widget-title.icon16-computer,
#secondary .widget .widget-title.icon16-contact,
#secondary .widget .widget-title.icon16-database,
#secondary .widget .widget-title.icon16-delete,
#secondary .widget .widget-title.icon16-down,
#secondary .widget .widget-title.icon16-edit,
#secondary .widget .widget-title.icon16-favorite,
#secondary .widget .widget-title.icon16-flag,
#secondary .widget .widget-title.icon16-floppy,
#secondary .widget .widget-title.icon16-folder,
#secondary .widget .widget-title.icon16-folder-open,
#secondary .widget .widget-title.icon16-forward,
#secondary .widget .widget-title.icon16-help,
#secondary .widget .widget-title.icon16-home,
#secondary .widget .widget-title.icon16-info,
#secondary .widget .widget-title.icon16-key,
#secondary .widget .widget-title.icon16-lock,
#secondary .widget .widget-title.icon16-mail,
#secondary .widget .widget-title.icon16-mail-read,
#secondary .widget .widget-title.icon16-music,
#secondary .widget .widget-title.icon16-options,
#secondary .widget .widget-title.icon16-paste,
#secondary .widget .widget-title.icon16-pictures,
#secondary .widget .widget-title.icon16-portfolio,
#secondary .widget .widget-title.icon16-rss,
#secondary .widget .widget-title.icon16-redo,
#secondary .widget .widget-title.icon16-refresh,
#secondary .widget .widget-title.icon16-search,
#secondary .widget .widget-title.icon16-security,
#secondary .widget .widget-title.icon16-speaker,
#secondary .widget .widget-title.icon16-stationery,
#secondary .widget .widget-title.icon16-stats,
#secondary .widget .widget-title.icon16-stop,
#secondary .widget .widget-title.icon16-system,
#secondary .widget .widget-title.icon16-tag,
#secondary .widget .widget-title.icon16-template,
#secondary .widget .widget-title.icon16-tip,
#secondary .widget .widget-title.icon16-tools,
#secondary .widget .widget-title.icon16-tutorial,
#secondary .widget .widget-title.icon16-undo,
#secondary .widget .widget-title.icon16-up,
#secondary .widget .widget-title.icon16-user,
#secondary .widget .widget-title.icon16-web,
#secondary .widget .widget-title.icon16-window,
#secondary .widget .widget-title.icon16-wizard,
#secondary .widget .widget-title.icon16-write {
    padding: 8px 5px 7px 30px;
    background-position: 8px 6px;
}

/***********************************************************************
    カラムのサイズ
***********************************************************************/

/***********************************************************************
    classses
***********************************************************************/

.nowrap{
    white-space: nowrap;
}

.align-center{
    text-align: center;
}
.align-right{
    text-align: right;
}

.button,
a.button{
    border: solid 1px #aaaaaa;
    background-color: #cccccc;
    color: #000000;
    padding: 0.8em 1.5em;
    font-size:14px;
    letter-spacing: 2px;
    margin: 0 1em 0 0;
    border-radius: 3px;
}
.button-hover,
a.button:hover,
.button:hover,
a.button:hover{
    border: solid 1px #aaaaaa;
    background-color: #eeeeee;
    text-decoration: none;
}

.button:last-child,
a.button:last-child{
    margin-right: 0;
}

.button-small,
a.button-small{
    padding: .1em 1em;
}



/* .page-title
*****************************************/
.page-title{
    position: relative;
    line-height: 1.2em;
    margin: 0 0 1em 0;
    background-color:#eaeaea;
    padding:10px 10px;
    border-top:solid 1px silver;
    font-size:26px;
    font-weight:bold;
    color:#555555;
    border-radius: 0 0 5px 5px;
}
.page-title span{
    margin-left:20px;
    font-size:16px;
    color:#777777;
    line-height: 1em;
}
.page-title-icon{
    padding-left:50px;
}

/* .page-sub-title
*****************************************/
.page-sub-title{
    font-size:18px;
    font-weight:bold;
    color:#555555;
    background-color:#eaeaea;
    margin: 0 0 1em 0;
    padding: 0.5em 1.5em;
    line-height: 1em;
    letter-spacing: 2px;
    border-radius: 3px;
}


/* .image-background
*****************************************/
.image-background{
    background-color: #f5f5f5;
}

/* .paging
*****************************************/
.paging{
    list-style:none;
    margin: 2em 0;
}
.paging .info{
    margin:0 0 0.5em 0;
}
.paging ul{
    margin: 0;
    padding: 0;
}
.paging li{
    margin:0;
    display:inline-block;
    line-height: 1em;
    margin: 0 0.5em 0 0;
}

.paging li a,
.paging li span{
    display:inline-block;
    zoom: 1;
    padding:5px 8px;
}
.paging li span a{
    padding: 0;
}

.paging li.current a{
    background-color:orange;
    color:white;
}

/*
 *3 .widget
 */
.widget{
    margin-bottom: 2em;
    background-color: #ffffff;
    border:solid 6px #dadada;
    display:block;
    border-radius: 5px;
}
.widget .widget-title{
    border:0;
    font-size:22px;
    font-weight: bold;
    padding:0 1em 6px 1em;
    margin:0;
    background-color:#dadada;
    letter-spacing: 2px;
    line-height: 1.5;
}
.widget .widget-body{
    margin: 0;
    padding: 0 20px;
}

.widget .widget .widget-title{
    font-size: 18px;
}

/* .widget-form
***************************************/
.widget-form .widget-body{
    background-color: #fafafa;
    padding: 1em;
}
.widget-form .widget-body form{
    margin: 0;
}


/* このページについて
***************************************/
.widget-about-this-page {
    margin: 2em 0;
}
.widget-about-this-page .widget-body{
    padding:0;
}

@media ( min-width : 992px ){

    button.button-slide-menu-left{
        display: none;
    }

    /***********************************************************************
        ヘッダー
    ***********************************************************************/

    #header{
        position:relative;
        background-color:#f1f1f1;
        color:#555555;
        padding: 0;
        margin: 0;
    }

    /***********************************************************************
        グローバルナビ
    ***********************************************************************/
    #header .navi{
        list-style:none;
        padding: 0.1em 0 0.3em 0;
    }
    #header .navi .system-name{
        font-weight: bold;
        font-size: 16px;
        letter-spacing: 1px;
    }
    #header .navi p,
    #header .navi ul,
    #header .navi ul li{
        display: inline;
        margin: 0 0 0 1em;
        padding: 0;
    }
    #header .navi li{
        margin:0 10px;
        padding:0;
        display:inline;
    }
    #header .navi a{
        color:#555555;
        text-decoration:underline;
    }
    #header .navi a:hover{
        text-decoration:underline;
        color:red;
    }

    /***********************************************************************
        タブ
    ***********************************************************************/
    #header .tabs{
        margin:0;
        padding:0 0 0 1em;
    }
    #header .tabs .tab-change{
        float: left;
        margin: 0;
        padding: 0 1em 0 1em;
    }
    #header .tabs .tab-root{
        display: none;
        float: left;
    }
    #header .tabs .tab-root-selected{
        display: block;
    }
    #header .tabs ul{
        margin: 0;
        padding: 0;
    }
    #header .tabs li{
        float:left;
        margin:0;
        display:block;
    }
    #header .tabs li a{
        display:block;
        padding:3px 1em 0 1em;
        text-align:center;
        border:solid 1px #999999;
        border-bottom-width:0;
        margin:0 0 0 5px;
        white-space:nowrap;
        border-radius: 5px 5px 0 0;
        background-color:#c5c5c5;
        color:#555555;
        box-shadow: inset 2px 2px 3px #aaaaaa;
    }
    #header .tabs li a:hover{
        background-color:#5492f4;
        color:#ffffff;
        text-decoration:none;
        box-shadow: inset 2px 2px 3px #5184D2;
    }
    #header .tabs li.color-blue a:hover{
        background-color:#5492f4;
        box-shadow: inset 2px 2px 3px #5184D2;
    }
    #header .tabs li.color-green a:hover{
        background-color:#599549;
        box-shadow: inset 2px 2px 3px #488337;
    }
    #header .tabs li.color-gray a:hover{
        background-color:#767676;
        box-shadow: inset 2px 2px 3px #969696;
    }
    #header .tabs li.selected a{
        background-color:#3A6AAD;
        color:#FFFF66;
        box-shadow: inset 2px 2px 3px #5184D2;
    }

    /* 子リスト */
    #header .tabs  li{
        position: relative;
    }
    #header .tabs .list-1{
        position: absolute;
        top: 25x;
        background-color: #fff;
        margin: 0 0 0 5px;
        padding: 0;
        text-align: left;
        border: solid 1px #aaa;
        border-top: 0;
        z-index: 1;
        display: block;
    }
    #header .tabs .list-1 ul{
        margin: 0;
    }
    #header .tabs .list-1 li{
        width: 100%;
        white-space: nowrap;
        display: block;
        padding: 0;
        margin: 0;
        border-top: dashed 1px #aaa;
    }
    #header .tabs .list-1 li a{
        display: block;
        margin: 0;
        padding: 5px 1em;
        background-color: #fff;
        text-align: left;
        color: #333;
        border: 0;
        box-shadow: none;
        border-radius: 0;
    }
    #header .tabs .list-1 li a:hover{
        background-color:#5492f4;
        color:#ffffff;
    }
    #header .tabs .list-1 li:first-child{
        border-top: 0;
    }
    #header .tabs .list-1 li ul{
        position: absolute;
        top: 0;
        left: 100px;
        background-color: #fff;
        padding: 0;
        margin: 0;
        border: solid 1px #aaa;
    }

    /****/
    #header .tabs .list-1,
    #header .tabs .list-1 ul{
        display: none;
    }


    #header .tabs li:hover > ul{
        display: block;
    }

    /***********************************************************************
        2段目のタブ
    ***********************************************************************/
    .tab-second{
        list-style: none;
        margin: 0;
        padding: 0;
        border-top:solid 8px #3A6AAD;
        background-color: #3A6AAD;
        text-align: center;
    }
    .tab-second li{
        margin: 0;
        padding: 0;
        display: none;
    }
    .tab-second li.item-1{
        display: inline-block;
        padding: 0 1em;
    }
    .tab-second li a{
        color: #fff;
    }
    .tab-second li.selected{
        background-color: #ff5;
        border-radius: 3px;
    }
    .tab-second li.selected a{
        color: #555;
    }

    /***********************************************************************
        3段目のタブ
    ***********************************************************************/
    .tab-third{
        position: relative;
        list-style: none;
        margin: 4px 0 0 0;
        padding: 6px 0 0 0;
        border-top: dashed 1px #aaa;
        background-color: #3A6AAD;
        text-align: center;
    }
    .tab-third:before{
        content: '';
        position: absolute;
        top: -5px;
        left: 0;
        right: 0;
        height: 4px;
        background-color: #3A6AAD;
    }
    .tab-third li{
        margin: 0;
        padding: 0;
        display: none;
    }
    .tab-third li.item-1{
        display: inline-block;
        padding: 0 1em;
    }
    .tab-third li a{
        color: #fff;
    }
    .tab-third li.selected{
        background-color: #ff5;
        border-radius: 3px;
    }
    .tab-third li.selected a{
        color: #555;
    }

}


@media ( min-width : 992px ){

    /***********************************************************************
        container
    ***********************************************************************/
    #container{
        border-top:solid 8px #3A6AAD;
    }

}

/***********************************************************************
    secondary
***********************************************************************/

#secondary {
    background-color: #3A6AAD;
    padding: 0;

    a:not(.btn) {
        text-decoration: none;
        color: #0066CC;

        &:link,
        &:visited {
            text-decoration: none;
            color: #0066CC;
        }

        &:hover {
            color: #f00;
            text-decoration: underline;
        }

        &:active {
            color: orange;
        }

        &.stay {
            color: #ff0000;
        }
    }

    /*
    a,
    a:link ,
    a:visited {
        text-decoration: none;
        color: #0066CC;
    }

    a:hover {
        color: #f00;
        text-decoration: underline;
    }

    a:active {
        color: orange;
    }

    a.stay{
        color: #ff0000;
    }
    */

    .widget {
        border: 0;
        width: calc(100% - 20px);
        margin: 10px 10px;
        padding: 0;
        box-shadow: 3px 3px 3px 0 #aaa inset;
        border-radius: 5px;
        background-color:#fff;
        filter: brightness(0.8);
        transition: box-shadow 0.3s ease, filter 0.3s ease;

        .widget-title {
            border-bottom:solid 1px #d8dfea;
            font-size:14px;
            padding:8px 5px 7px 30px;
            font-weight:bold;
            line-height:1em;
            background-position:8px 6px;
            background-repeat:no-repeat;
            background-color: transparent;
            letter-spacing: 0;
            color:#666666;
            border-radius: 5px 5px 0 0;
            border-bottom: solid 1px #d8dfea;
            font-size: 1em;
            font-size: 16px;
            font-weight: bold;
            line-height: 1;
            margin: 0;
            padding: 8px 5px 7px 10px;
            background-position: 8px 14px;
            background-repeat: no-repeat;
            letter-spacing: 0;
            color: #777;
            border-radius: 5px 5px 0 0;
            white-space: nowrap;
            overflow: hidden;
        }

        .widget-body {
            padding: 0 1em 1px 1em;
            padding: 10px;
            font-size: .82em;
            font-size: 13px;

            > * {
                margin-top: 20px;
                margin-bottom: 0;

                &:first-child {
                    margin-top: 0;
                }

                p ,
                ul {
                    margin: 0;
                }
            }

            ul {
                list-style: none;
                padding: 0 0 0 1em;

                li {
                    padding: 1px 0;
                }
            }

            > ul{
                padding-left: 0;
            }

            > .buttons {
                li {
                    margin-top: 5px;
                    &:first-child {
                        margin-top: 0;
                    }

                    .btn {
                        display: block;
                    }
                }
            }

            > .list1 {
                > li {
                    margin-top: 5px;

                    &:first-child {
                        margin-top: 0;
                    }
                }
            }

            .form-search {

                .textbox{
                    width:120px;
                    margin: 0 0.5em 0 0;
                }

                .submit{
                    margin:0;
                }

                .form-control{
                    margin: 0;
                }

                .btn{
                    padding: .375rem .75rem;
                    font-size: 12px;
                }
            }

            .current{
                color: #cc0000;
            }

            .fa-icon {
                margin-right: .5em;
                color: #777;
                color: #aaa;
            }

            .fa-icon.red {
                color: #d00;
            }

            .fa-icon.limegreen {
                color: #32CD32;
            }

            .fa-icon.forestgreen {
                color: #228B22;
            }

            .fa-icon.green {
                color: #080;
            }

            .fa-icon.orange {
                color: #FFA500;
            }

            .fa-icon.darkorange {
                color: #FF8C00;
            }

            /* ol */
            ol {
                padding-left: 18px;
            }

            ol > li > ul{
                padding-left: 0;
            }

            li.nowrap {
                position: relative;

                a {
                    max-width: 100%;
                    overflow: hidden;
                }

                .item-count {
                    position: absolute;
                    top: 0;
                    right: -10px;
                    display: block;
                    padding: 0 3px;
                    background-color: inherit;
                    color: #aaa;
                }
            }

            li.with-commands .commands {
                display: none;
            }

            li.with-commands:hover .commands {
                display: block;
                position: absolute;
                top: -3px;
                right: -10px;
                z-index: 1;
                background-color: #fff;
                padding: 3px 5px;
                border: solid 1px #aaa;
                border-radius: 5px;
            }
        }

        /* アイコン */
        .fa{
            color: #777;
            width: 13px;
            text-align: center;
        }
    }

    .widget-current {
        margin-right: 0;
        padding-right: 0.8em;
        border-radius: 5px 0 0 5px;
        box-shadow: none;
        width: auto;
        margin-right: 0;
        border-radius: 5px 0 0 5px;
        filter: none;
    }

    .widget:hover {
        box-shadow: none;
        filter: none;
    }

    .widget:first-child{
        margin-top: 0;
    }

    .widget:last-child{
        margin-bottom: 0;
    }
}

@media (max-width: 991px){

    #secondary {
        box-sizing: border-box;
        width: 300px;
        overflow: auto;
        background-color: #fafafa;
        border-radius: 0 9px 0 0;
        border-top: solid 10px #3A6AAD;
        padding: 0;
        height: calc(100dvh - 53px) !important;

        .widget {
            .widget-body {
                a ,
                .accordion-label {
                    background-color: #eee;
                }

                li.nowrap {
                    .item-count {
                        top: 10px;
                        right: 5px;
                    }
                }
            }
        }

        .widget-current {
            margin-left: 0;
            margin-right: 10px;
            border-radius: 0 5px 0 0;
        }
    }
}

/***********************************************************************
    footer
***********************************************************************/
#footer{
    background-color: #3A6AAD;
    padding:80px 15px 50px 15px;
    text-align:left;
}

/***********************************************************************
    primary
***********************************************************************/

#primary .command-buttons input{
    margin-right: 1em;
}

#primary .widget-search-form{
    display: none;
}

.error-message{
    color:#d8251c;
}

.info-message{
    color:#333333;
}

.line-through{
  text-decoration:line-through;
}

.action-message{
    margin: 1em 0;
    border: solid 5px #aaa;
    color: #f00;
    padding: 1em;
}

.position-center{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/***********************************************************************
    フォームメッセージ
***********************************************************************/
form .error-messages{
    color: #f00;
}
form .info-messages{
    color: #080;
}

/***********************************************************************
    フォームボタン上部固定
***********************************************************************/
.form-steps{
    position: relative;
    padding-top: 55px;
    margin-top: 0;
}
.form-view .form-steps{
    margin: 1em 0;
    padding: 0;
}
.form-steps .info-messages,
.form-steps .error-messages{
    margin-top: 0;
}
.submit-buttons-top{
    display: none;
}
.form-steps .submit-buttons-top{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    background-color: #eaeaea;
    margin: 0;
    padding: .5em 0 .5em 0;
    border-radius: 5px;
}
.form-steps .submit-buttons-top .button{
    display: inline-block;
    padding: 0.1em 1.5em;
    min-width: 200px;
    text-align: center;
}

body.manager-submit-button-fixed .form-steps .submit-buttons-top {
    position: fixed;
    top: 51px;
    left: 230px;
    left: 245px;
    padding-left: 12px;
    padding-left: 0;
    padding-top: 0;
    border-radius: 0;
    z-index: 90;
    z-index: 110;  /* hot より上 */
    background-color: #3A6AAD;
}

.form-steps .submit-buttons-bottom{
    width: 100%;
    background-color: #eaeaea;
    margin: 0 0 2em 0;
    padding: .5em 0 .5em 0;
    border-radius: 5px;
}
.form-steps .submit-buttons-bottom .button{
    display: inline-block;
    padding: 0.1em 1.5em;
    min-width: 200px;
    text-align: center;
}

@media (max-width: 991px){
    html.mobile-support {
        .form-steps {
            .submit-buttons-bottom {
                .button {
                    display: block;
                    margin: 30px auto 0 auto;
                }
                .button:first-child {
                    margin-top: 0;
                }
            }
        }

        body.manager-submit-button-fixed .form-steps .submit-buttons-top {
            top: 46px;
            left: 0;
            padding: 5px;
            text-align: center;
            input {
                margin: 0;
            }
        }

    }
}


/***********************************************************************
    ページコンテンツ
***********************************************************************/

.block-page-contents .commands{
    list-style: none;
    margin: 1em 0;
    padding: 0;
}
.block-page-contents .commands li{
    display: inline-block;
}
.block-page-contents .commands li a{
    display: inline-block;
    padding: .3em 1em;
    letter-spacing: 0;
}

.block-page-contents .portlet-placeholder {
    border: 1px dotted black;
    margin: 0 1em 1em 0;
    height: 50px;
    background-color: #FFFFCC;
}

.block-page-contents .content-list .widget-remove{
    border-color: #a9a9a9;
}
.block-page-contents .content-list .widget-remove .widget-title{
    background-color: #a9a9a9;
    text-decoration: line-through;
}
.block-page-contents .content-list .content .widget-title{
    position: relative;
}
.block-page-contents .content-list .content .widget-title:hover{
    cursor: pointer;
}
.block-page-contents .content-list .content .widget-title .portlet-toggle {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -8px;
}

.block-page-contents .content-list .content .params{
    margin: 0 0 1em 0;
}

.block-page-contents .content-list .content .params tr th{
    padding: 0 .5em 0 0;
    vertical-align: middle;
}
.block-page-contents .content-list .content .params tr td{
    padding: 0 1em 0 0;
    vertical-align: middle;
}
.block-page-contents .content-list .content .params .input-name{
    width: 150px;
}
.block-page-contents .content-list .content .params .input-key{
    width: 150px;
}

.block-page-contents .content-list .content .data input.textbox{
    width: 670px;
}

.block-page-contents .content-list .content .data textarea.textbox{
    width: 670px;
    height: 10em;
}

.block-page-contents .content-list .content .data .data-type-gootle-map .params{
    margin: 1em 0 0 0;
}
.block-page-contents .content-list .content .data .data-type-gootle-map .input-map-width,
.block-page-contents .content-list .content .data .data-type-gootle-map .input-map-height{
    width: 4em;
    text-align: center;
    margin-right: .5em;
}
.block-page-contents .content-list .content .data .data-type-gootle-map .map-move-address{
    width: 200px;
}


/***********************************************************************
    フォーム、確認画面
***********************************************************************/
.form-step-confirm .widget-database-edit-form,
.form-step-confirm .widget-database-edit-form .widget-body .widget{
    border-color: #d9c6a3;
}
.form-step-confirm .widget-database-edit-form .widget-title{
    background-color: #d9c6a3;
}
.form-step-input .step-input-execute ,
.form-step-confirm .step-confirm-next {
    background-color: #FFCC66;
}
.form-step-input .step-input-execute:hover ,
.form-step-confirm .step-confirm-next:hover {
    background-color: #FFFFAA;
}

/***********************************************************************
    diff
***********************************************************************/
.diff{
    color:gray
}
.diff ins {color:green;background:#dfd;text-decoration:none}
.diff del {color:red;background:#fdd;text-decoration:none}


/***********************************************************************
    class
***********************************************************************/
.margin-bottom{
    margin-bottom: 2em;
}
.bgcolor-green{
    background-color: #DDFFDD;
}


/***********************************************************************
    アップロードファイル
***********************************************************************/

.upload-file-preview .new,
.upload-file-preview .current{
    float: left;
    margin-right: 1em;
}
.upload-file-preview .new > div{
    margin-top: .5em;
}

/***********************************************************************
    jQuery UI
***********************************************************************/
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year{
    width: auto;
}
.ui-datepicker select.ui-datepicker-month{
    margin-left: .5em;
}

/* ダイアログ */
.ui-front{
    z-index: 1000;
}

/***********************************************************************
    .widget-form .widget-body
***********************************************************************/
.form .widget-form .widget-body{
    padding-top: 0;
    padding-bottom: 0;
}
.form .widget-form .widget-body .widget{
    margin: 2em 0;
}
.form .widget-form .widget-body .widget .widget-body{
    padding: 1em;
}


/***********************************************************************
    .widget-form .widget-body .block
***********************************************************************/
.form .widget-form .widget-body .contents-block {
    box-sizing: border-box;
    border: solid 2px #ccc;
    margin: 5rem 0;
    padding: 0 15px;
    box-shadow: 0 0 10px #aaa;
}

.form .widget-form .widget-body > div > .contents-block > .contents-block {
    margin: 30px 10px;
}

.form .widget-form .widget-body .contents-block:first-child {
    margin-top: 4rem;
}

/***********************************************************************
    form-table
***********************************************************************/
.form table.form-table{
    width: 100%;
    max-width: 100%;
}
.form table.form-table th,
.form table.form-table td{
    border-bottom: solid 1px #dadada;
    padding: 1.5em 1em;
}
.form table.form-table tr:last-child th,
.form table.form-table tr:last-child td{
    border: 0
}

form .horizontal-layout .form-group.bind-to-top {
    border-bottom-width: 0;
    padding-bottom: 0;
}

form .horizontal-layout .form-group.bind-to-bottom {
    padding-top: 0;
}


/***********************************************************************
    form-sub-table
***********************************************************************/
.form table.form-sub-table{
    border: 0;
}
.form table.form-sub-table th{
    border: 0;
    padding: 0 1em .7em 0;
}
.form table.form-sub-table td{
    border: 0;
    padding: 0 1em .7em 1em;
}

.form-sub-table2{
    padding: 1em 0 0 0;
}
.form-sub-table2:last-child{
    padding-bottom: 1em;
}
.form-sub-table2 table{
    border: solid 1px #dadada;
    width: 100%;
}
.form table.form-table .form-sub-table2 table th,
.form table.form-table .form-sub-table2 table td{
    padding: .5em 1em;
}
.form-sub-table2 table thead th{
    background-color: #f0f0f0;
}
.form-sub-table2 table tbody th,
.form-sub-table2 table tbody td{
    background-color: #fff;
}

.form-sub-table2 .sub-table2{
    width: auto;
    margin-left: auto;
    margin-right: auto;
}
.form-sub-table2 .sub-table2 th,
.form-sub-table2 .sub-table2 td{
    border: 0;
}

/***********************************************************************
    text-area
***********************************************************************/
.textarea-max-height-200{
    max-height: 200px;
    overflow: auto;
    border: solid 1px #aaa;
    padding: 1em;
}

.text-center{
    text-align: center;
}

.text-right{
    text-align: right;
}

.line-through{
    text-decoration: line-through;
}

.color-gray{
    color: #aaa;
}

.sortable-handle:hover{
    cursor: pointer;
}

/***********************************************************************
    2016-02-06 パンクズ
***********************************************************************/

.container-breadcrumb,
.container-breadcrumb .breadcrumb{
    background-color: #3A6AAD;
}

.container-breadcrumb .breadcrumb{
    margin: 0;
    padding: 8px 0 0 0;
}

.container-breadcrumb .breadcrumb > li{
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
}
.container-breadcrumb .breadcrumb > li + li:before {
    content: '';
    color: #fff;
    padding: 0;
}
.container-breadcrumb .breadcrumb > li:after {
    content: ' > ';
    color: #fff;
    padding: 0;
}
.container-breadcrumb .breadcrumb > li:last-child:after {
    content: '';
}

.container-breadcrumb .breadcrumb a{
    display: inline-block;
}
.container-breadcrumb .breadcrumb span{
    color: #fff;
    display: inline-block;
    margin: 0;
    padding: 0 5px;
    white-space: nowrap;
}
.container-breadcrumb .breadcrumb > li:hover > a span{
    color: #ff0;
    background-color: #5492f4;
}

.container-breadcrumb .breadcrumb > li ul{
    position: absolute;
    top: 20px;
    left: -3px;
    min-width: 100%;
    list-style: none;
    margin: 0;
    padding: 0 0 0 0;
    box-shadow: 3px 3px 3px #b5b4b3;
    display: none;
    z-index: 1;
}

.container-breadcrumb .breadcrumb > li:hover ul{
    display: block;
}
.container-breadcrumb .breadcrumb > li > ul li{
    background-color: #fff;
    background-color: #3A6AAD;
    border-top: dashed 1px #aaa;
}
.container-breadcrumb .breadcrumb > li > ul li:first-child{
    border-top-width: 0;
}
.container-breadcrumb .breadcrumb > li ul li a{
    width: 100%;
    padding: 5px 10px;
}
.container-breadcrumb .breadcrumb > li ul li a span{
    color: #fff;
    width: 100%;
}
.container-breadcrumb .breadcrumb > li ul li:hover{
    background-color: #5492f4;
}


/***********************************************************************
    2023-03-27 タブ
***********************************************************************/

.nav-tabs-with-border .nav-link {
    font-size: 12px;
    border: 2px solid #ccc;
    border-bottom-width: 0;
    background-color: #eee;
    border: solid 6px #eaeaea;
    border-bottom: 0;
    border: 0;
    border-radius: 6px 6px 0 0;
    color: #333;
}

.nav-tabs-with-border .nav-link.active {
    background-color: #ccc;
    font-weight: bold;
    font-size: 14px;
    color: #000;
    border-color: #ccc;
    background-color: #ccc;
}

.nav-tabs-with-border .nav-link {
    padding: 8px 16px 5px 16px;
}

.tab-content-with-border {
    background-color: #fff;
    border: solid 6px #ccc;
    border-radius: 0 6px 6px 6px;
}

.table-item-list table {
    width: auto;
}


/***********************************************************************
    2016-06-15 レスポンシブ
***********************************************************************/
@media ( max-width : 991px ){

    html{
        font-size: 10px;
    }

    body{
        overflow: hidden;
        font-size: 1.6rem;
    }

    input[type="text"],
    input[type="email"],
    /* select , */
    textarea{
        max-width: 100%;
        font-size: 1.6rem;
    }

    #header{
        z-index: 0;
    }
    #header .navi{
        z-index: 3;
    }
    #header .tabs{
        z-index: 0;
    }

    #footer{
        z-index: 1;
    }

    #header .navi{
        box-sizing: border-box;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 45px;
        color: #fff;
        text-align: center;
        background-color: #3A6AAD;
    }
    #header .navi ul{
        display: none;
    }

    #header .navi .login-user{
        font-size: 12px;
    }

    #header .navi ul{
        list-style: none;
        margin: 0;
        padding: 0;
        border-top: solid 1px #aaa;
    }
    #header .navi ul li{
        border-bottom: solid 1px #aaa;
        padding: 5px 10px;
    }


    #header .tabs,
    #secondary{
        border-right: solid 1px #ddd;
        transition: all 1s;
    }

    #header .tabs {
        opacity: 0;
    }

    body.slide-menu-left #header .tabs,
    body.slide-menu-left #secondary{
        opacity: 1;
        transition: all 0s;
    }

    #secondary{
        height: 80%;
    }

    #header .tabs{
        height: 20%;
    }

    /* メインメニューがON */
    body.slide-menu-left-tabs #secondary{
        height: 20%;
    }
    body.slide-menu-left-tabs #header .tabs{
        height: 80%;
    }

    /* カレントメニューがON */
    body.slide-menu-left-secondary #secondary{
        height: 80%
    }
    body.slide-menu-left-secondary #header .tabs{
        height: 20%;
    }
    body.slide-menu-left-secondary #header .tabs li{
        display: none;
    }
    body.slide-menu-left-secondary #header .tabs li.selected{
        display: block;
    }

    /* カバー */
    body.slide-menu-left-secondary #header .tabs li,
    body.slide-menu-left-tabs #secondary .widget{
        position: relative;
    }

    body.slide-menu-left-secondary #header .tabs li:before,
    body.slide-menu-left-tabs #secondary .widget:before{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #3A6AAD;
        opacity: 0.01;
        z-index: 1;
    }
    /*****/


    #header .tabs{
        box-sizing: border-box;
        position: fixed;
        top: 0;
        left: 0;
        width: 230px;
        background-color: #fafafa;
        background-color: #2b3b52;
        color: #555555;
        padding: 0;
        margin: 0;
        overflow: auto;
    }

    #header .tabs,
    #header .tabs ul,
    #header .tabs ul a{
        background-color: #fafafa;
    }

    #header .tabs > ul{
        position: relative;
    }

    #header .tabs ul{
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #header .tabs > ul{
        border-top: solid 1px #ddd;
    }

    #header .tabs li{
        margin: 0;
        padding: 0;
        border-bottom: solid 1px #ddd;
    }
    #header .tabs li:last-child{
        border-bottom-width: 0;
    }

    #header .tabs > ul ul{
        margin-left: 10px;
        border-top: dashed 1px #aaa;
        border-left: dashed 1px #aaa;
    }

    #header .tabs .selected,
    #header .tabs .selected > a{
        color: #ff0;
        background-color: #3A6AAD;
    }

    .tab-second{
        display: none;
    }

    .tab-third{
        display: none;
    }

    #container{
        margin: 0;
        padding: 0;
    }


    /*
    #primary,
    */
    #header .navi,
    #footer{
        transform: translate3d(0px, 0, 0);
        transition: .2s transform ease-in-out;
    }

    /*
    body.slide-menu-left #primary,
    */
    body.slide-menu-left #header .navi,
    body.slide-menu-left #footer{
        transform: translate3d(230px, 0, 0);
        transition: .2s transform ease-in-out;
    }

    #header .tabs a,
    #secondary a ,
    #secondary .accordion-label {
        position: relative;
        display: block;
        margin: 0;
        padding: 0.7em 10px;
        line-height: 1.6;
    }

    #header .tabs a:hover,
    #secondary a:hover{
        text-decoration: none;
    }

    #header .tabs p,
    #secondary p{
        margin: 0;
        padding: 0 10px;
    }

    #footer{
        position: relative;
    }


    .table-item-list{
        width: 100%;
        overflow: auto;
    }

    .table-item-list table td{
        white-space: nowrap;
    }

}



@media ( max-width : 767px ){

    .widget-form .form-table,
    .widget-form .form-table > thead,
    .widget-form .form-table > tbody,
    .widget-form .form-table > * > tr,
    .widget-form .form-table > * > tr > th,
    .widget-form .form-table > * > tr > td{
        display: block;
    }

    .widget-form .form-table th{
        border-bottom: 0;
    }

    .widget-form .form-table th{
        padding: 10px 0;
    }
    .widget-form .form-table td{
        padding: 0 0 10px 0;
    }

}




/***********************************************************************
  2016-07-01
  ここから新しい方式
  ここより上の定義をここから下に移動しながら作り変えていく
  最終的にスマホファースト、bootstrap4を意識した形にする
  完全にモバイル対応するには、コンポーネント側の対応も必要
  当分はモバイル対応を進めつつ、ビューポートで無効化しておく
***********************************************************************/



/***********************************************************************
  レイアウト
***********************************************************************/

html{
    font-size: 10px;
}

body{
    overflow: hidden;
    font-size: 1.6rem;
}

@media ( min-width : 544px ){
}

@media ( min-width : 768px ){

    body{
        overflow: visible;
        font-size: 1.2rem;
    }
}

@media ( min-width : 992px ){
}

@media ( min-width : 1200px ){
}

@media (max-width: 575.98px) {
    html.mobile-support {

        body {
            overflow: visible;
            padding-bottom: 100px;
        }

        input[type="text"] ,
        input[type="password"] ,
        input[type="tel"] ,
        input[type="email"] ,
        input[type="url"] ,
        input[type="date"] ,
        textarea ,
        select {
            font-size: 16px !important;
        }
    }

    html.page-single.mobile-support {
        body {
            padding-top: 10px;
        }
    }
}

/***********************************************************************
  テーブル
***********************************************************************/


/* --------------------------------------------------------
    タイプ: 格子テーブル
 -------------------------------------------------------- */
.ac-table-type-lattice:after{
    content: '';
    display: none;
}

.ac-table-type-lattice ,
.ac-table-type-lattice th ,
.ac-table-type-lattice td {
    border: solid 1px #ccc;
}

.ac-table-type-lattice {
    border-right-width: 0;
    border-bottom-width: 0;
}

.ac-table-type-lattice th ,
.ac-table-type-lattice td {
    border-left-width: 0;
    border-top-width: 0;
    padding: 3px 10px;
}

.ac-table-type-lattice th {
    background-color: #fafafa;
}

.ac-table-type-lattice td {
    background-color: #fff;
}

/* --------------------------------------------------------
    テーブル幅
 -------------------------------------------------------- */

.ac-table-width-max {
    width: 100%;
}


/* --------------------------------------------------------
    上下位置
 -------------------------------------------------------- */

/* トップ */
.ac-table-vertical-top thead th ,
.ac-table-vertical-top thead td ,
.ac-table-vertical-top tbody th ,
.ac-table-vertical-top tbody td {
    vertical-align: top;
}

.ac-table-vertical-middle thead th ,
.ac-table-vertical-middle thead td ,
.ac-table-vertical-middle tbody th ,
.ac-table-vertical-middle tbody td {
    vertical-align: middle;
}

.ac-table-vertical-bottom thead th ,
.ac-table-vertical-bottom thead td ,
.ac-table-vertical-bottom tbody th ,
.ac-table-vertical-bottom tbody td {
    vertical-align: bottom;
}

.ac-table-vertical-top-middle thead th ,
.ac-table-vertical-top-middle thead td {
    vertical-align: top;
}
.ac-table-vertical-top-middle tbody th ,
.ac-table-vertical-top-middle tbody td {
    vertical-align: middle;
}

.ac-table-vertical-middle-top thead th ,
.ac-table-vertical-middle-top thead td {
    vertical-align: middle;
}
.ac-table-vertical-middle-top tbody th ,
.ac-table-vertical-middle-top tbody td {
    vertical-align: top;
}


/* --------------------------------------------------------
    画像サイズ
 -------------------------------------------------------- */

.img-max-100 {
    max-width: 100px;
    max-height: 100px;
    width: auto;
    height: auto;
}

.img-max-150 {
    max-width: 150px;
    max-height: 150px;
    width: auto;
    height: auto;
}

.img-max-200 {
    max-width: 200px;
    max-height: 200px;
    width: auto;
    height: auto;
}


/***********************************************************************
  コンポーネント
***********************************************************************/
.html-template{
    display: none;
}

/***********************************************************************
  コンポーネント、コンボボックス
***********************************************************************/
.component2-combobox .input-group{
    display: table;
    width: 100%;
}
.component2-combobox .input-group-btn,
.component2-combobox .textbox{
    display: table-cell;
}
.component2-combobox .input-group-btn{
    width: 1%;
    vertical-align: top;
}
.component2-combobox .textbox{
    box-sizing: border-box;
    width: 100%;
    border-left-width: 0;
    border-radius: 0 2px 2px 0;
}

.component2-combobox .input-group-btn .btn{
    white-space: nowrap;
    border-radius: 2px 0 0 2px;
    cursor: pointer;
    outline: none;
    appearance: none;
    padding-top: 5px;
    padding-bottom: 4px;
    line-height: 1;
}

.component2-combobox .dropdown-menu{
    margin: 0;
    padding: 3px 0;
    border: solid 1px #aaa;
    border-radius: 3px;
}

.component2-combobox .dropdown-menu li a{
    display: block;
    padding: 3px 15px;
    color: #555;
    font-size: 12px;
}
.component2-combobox .dropdown-menu{
    max-height: 150px;
    overflow: auto;
}


/***********************************************************************
  コンポーネント、検索ボックス
***********************************************************************/
.component-search-box .input-group{
    display: table;
    width: 100%;
}
.component-search-box .input-group .form-control {
    width: auto;
}
.component-search-box .input-group-btn,
.component-search-box .textbox{
    display: table-cell;
}
.component-search-box .input-group-btn{
    width: 1%;
    vertical-align: top;
}
.component-search-box .textbox{
    box-sizing: border-box;
    width: 100%;
    text-align:center;
    border-left-width: 0;
    border-radius: 0 2px 2px 0;
}

.component-search-box .input-group-btn .btn{
    white-space: nowrap;
    border-radius: 2px 0 0 2px;
    cursor: pointer;
    outline: none;
    appearance: none;
    padding-top: 5px;
    padding-bottom: 4px;
    line-height: 1;
}


/***********************************************************************
  コンポーネント、画像リスト
***********************************************************************/

.compornent-sub-item-dialog .compornent-sub-item-dialog-component_file > .cbox{
    margin-left: 1em;
    margin-right: 1em;
}

.compornent-sub-item-dialog .compornent-sub-item-dialog-component_file .upload-file-preview {
    margin-top: 5px;
}


/***********************************************************************
  カラー設定
  デフォルトカラー #3A6AAD
***********************************************************************/

#container{
    border-color: #3A6AAD;
}

/*
#primary
*/
#header{
    background-color: #fff;
}

#secondary,
#footer{
    background-color: transparent;
}


/* タブ */
#header .tabs > ul > li > a{
    border-color: #999999;
    background-color: #c5c5c5;
    color: #555555;
    box-shadow: inset 2px 2px 3px #aaaaaa;
}

#header .tabs > ul > li > a:hover{
    background-color: #5492f4;
    color: #ffffff;
    text-decoration: none;
    box-shadow: inset 2px 2px 3px #5184D2;
}

#header .tabs > ul > li.selected > a{
    background-color: #3A6AAD;
    color: #FFFF66;
    box-shadow: inset 2px 2px 3px #5184D2;
}


/* 2段目のタブ */
#header .tab-second{
    background-color: #3A6AAD;
    border-color: #3A6AAD;
}


/* 3段目のタブ */
#header .tab-third{
    background-color: #3A6AAD;
    border-color: #aaa;
}


/***********************************************************************
  bootstrap
***********************************************************************/
.alert-default {
  border-color: #dadada;
  color: #333;
}
.alert-default hr {
  border-top-color: #f7e1b5;
}
.alert-default .alert-link {
  color: #66512c;
}



/***********************************************************************
    カスタマイズする場合は、下記を assets/customize.css にコピーして書き換えてください。

#container{
    border-top-color: #767676;
}

#secondary{
    background-color:#767676;
}

#footer{
    background-color:#767676;
}

#header .tabs li.selected > a{
    background-color: #767676;
    color:#FFFF66;
    box-shadow: inset 2px 2px 3px #969696;
}

.tab-second{
    border-top-color: #767676;
    background-color: #767676;
}

.tab-third{
    border-top-color: #767676;
    background-color: #767676;
}


#header .logo{
    position: absolute;
    top: 15px;
    left: 10px;
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-weight: bold;
}

#header .tabs{
    padding-top: 28px;
    padding-left: 220px;
}

***********************************************************************/


/***********************************************************************
   ウィンドウサイズが小さいとき
***********************************************************************/
#window-size-is-small-content {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: none;
}
#window-size-is-small-content:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #aaa;
    opacity: .8;
    z-index: -1;
}

#window-size-is-small-content .message {
    box-sizing: border-box;
    background-color: #fff;
    max-width: 420px;
    margin: 100px auto 0 auto;
    padding: 30px;
    font-size: 16px;
    text-align: center;
}

#window-size-is-small-content .message p:last-child{
    margin-bottom: 0;
}

body.window-size-is-small #window-size-is-small-content{
    display: block;
}

/***********************************************************************
    シングルページ
        ログイン / ログアウト / ログインIDを忘れたかた / パスワードを忘れた方
***********************************************************************/

html.page-single {

    background-color: #3A6AAD;

    p:last-child {
        margin-bottom: 0;
    }

    body {
        background-color: #3A6AAD;
    }

    #primary-wrap  {
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }

    .page-title {
        border-radius: 5px;
    }

    input[type="text"] ,
    input[type="password"] {
        width: 300px !important;
    }

    .submit-buttons-top {
        display: none;
    }

    form.form-connected {
        .widget-database-edit-form {
            margin-bottom: 0;
            border-bottom: 0;
            border-radius: 5px 5px 0 0;
        }
    }

    .widget-body ,
    .form .widget-form .widget-body {
        padding: 15px 10px;
    }

    .submit-buttons-bottom {
        border: solid 6px #dadada;
        border-top-width: 0;
        background-color: #fafafa;
        text-align: center;
        border-radius: 0 0 5px 5px;
        margin: 0;
        padding: 0 20px 20px 20px;
    }

    .form-step-confirm .submit-buttons-bottom {
        border-color: #d9c6a3;
    }

    form .horizontal-layout .form-group {
        border: 0;
    }

    .form-steps {
        padding-top: 0;
    }

    .a-com-step-1 ,
    .a-com-step-2 ,
    .a-com-step-3 {
        margin-top: 30px;
    }

    .global-error {
        background-color: #fff;
        padding: 1em;
        text-align: center;
    }

    .form .table {
        width: auto;
        margin: 0 auto;
    }

    .user-name {
        color: green;
        font-weight: bold;
        margin: 0 .5em;
        display: inline-block;
    }
}


@media (max-width: 575.98px) {

    html.page-single.mobile-support {
        input[type="text"] ,
        input[type="password"] {
            width: 100% !important;
        }
    }
}

/***********************************************************************
    ログイン
***********************************************************************/

html.page-login {
    .submit-buttons-bottom {
        border-width: 0;
        padding-top: 20px;
    }
}


/***********************************************************************
   ログアウト
***********************************************************************/

/***********************************************************************
   ログインIDを忘れたかた
***********************************************************************/

/***********************************************************************
   パスワードを忘れた方
***********************************************************************/