



/* 横幅が n px以下の時に発動する */
@media screen and (max-width: 499px) {
    #footerParentLeftArea{
        display: none;
    }
}
/*--------------------------------------------------------------------------------------------------------------------*//* ツールチップ適用時のホバーデザイン定義 */
#appGotoMyProfile:hover, #appGotoSearch:hover, #appGotoMessage:hover
,.appHoverChangeIcons:hover{
    /*background: lightgray;  !*rgb(247,247,247)*!*/
    border: 3px white solid;
    border-radius: 20px;
}
.appHoverChangeIcons{
    /*width: 27px; height: 27px; サイズは画面によって異なるので適宜定義すること */
}


#noticeFixedArea {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    /*-webkit-justify-content: center;*/
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    position: sticky;
    bottom: 0;
    left: 0;
    /*--------------------------------------------------*/
    border-radius: 100px;
}


#footer{
    background: rgb(245,245,245);
    text-decoration: none;
}
#footer a{
    color: black;
    text-decoration: none;
}
#footer a:hover{
    color: gray;
}
.footer_title{
    /*font-size: 20px;*/
}
/*--------------------------------------------------------------------------------------------------------------------*//**/
.left_right_parent{
    display: flex;
    justify-content: space-between;
}

.cmn_btn_noBorder_fill{
}
.cmn_btn_noBorder_fill:hover{
    background: rgb(245,245,245);
}

.border_none{
    border: none;
}

.imgImportant1{
    width: 40px;
}

.halfColor{
    background: linear-gradient(-90deg, rgb(108,117,125) 50%, rgb(255,193,7) 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
    white-space: nowrap;
}

.olStyleRice {
    list-style: '※';
    font-size: 11px;
}

.olStyleRiceOnly {
    list-style: '※';
}

/* まず元のリストマーカーを消す */
.olStyleRiceOnlySmall {
    list-style: none;
    padding-left: 10px; /* 必要であれば調整 */
}
/* ::marker をサポートするブラウザ向け */
.olStyleRiceOnlySmall li::marker {
    content: "※";        /* お好きなマーカー文字 */
    /*font-size: 1em;    !* マーカーの大きさを指定 *!*/
    /* color, line-height, margin なども調整可能 */
}
/* ::marker 非対応ブラウザ向けフォールバックとして ::before を併用 */
.olStyleRiceOnlySmall li {
    position: relative;
}
.olStyleRiceOnlySmall li::before {
    /*content: "※";*/
    /*font-size: 1em;*/
    position: absolute;
    left: -1.2em;       /* テキストとの間隔を調整 */
    top: 0;
}
/*--------------------------------------------------------------------------------------------------------------------*//*ToolTips*/
/*show bottom*/
.tooltip-001 {
    display: inline-block;
    position: relative;
}
.tooltip-001 > div {
    cursor: pointer;
}
.tooltip-001 > span {
    display: flex;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    padding: .25em .5em;
    border-radius: 3px;
    background-color: black;
    color: white;
    font-size: .7em;
    white-space: nowrap;
    transition: opacity .3s;
}
.tooltip-001 > span::before {
    position: absolute;
    top: -6px;
    width: 9px;
    height: 6px;
    background-color: inherit;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    content: '';
}
.tooltip-001:hover > span {
    visibility: visible;
    opacity: 1;
}
/*show left*/
.tooltip-004 {
    display: inline-block;
    position: relative;
}
.tooltip-004 > div {
    cursor: pointer;
}
.tooltip-004 > span {
    display: flex;
    align-items: center;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: -86px;
    transform: translateY(-50%);
    padding: .25em .5em;
    border-radius: 3px;
    background-color: black;
    color: white;
    font-size: .7em;
    white-space: nowrap;
    transition: opacity .3s;
}
.tooltip-004 > span::before {
    position: absolute;
    right: -6px;
    width: 6px;
    height: 9px;
    background-color: inherit;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}
.tooltip-004:hover > span {
    visibility: visible;
    opacity: 1;
}
/*--------------------------------------------------------------------------------------------------------------------*//* DRAWER MENU */
.menu-btn,
.menu-btn span {
    box-sizing: border-box;
    display: inline-block;
    transition: all .4s;
}

.menu-btn {
    cursor: pointer;
    display: block;
    height: 36px;
    margin: 20px 0 0 20px;
    position: relative;
    width: 40px;
}

.menu-btn span:nth-of-type(1) {
    top: 0;
}

.menu-btn span:nth-of-type(2) {
    top: 16px;
}

.menu-btn span:nth-of-type(3) {
    bottom: 0;
}

body.open {
    overflow: hidden;
}

.drawer-overlay {
    background: rgba(0,0,0,0.6);
    box-sizing: border-box;
    display: none;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9998;
}

.drawer-overlay.open {
    display: block;
}

.drawer-nav {
    background: #fff;
    box-sizing: border-box;
    right: -300px;
    width:  300px;
    height: 100%;
    overflow-y: scroll;
    position: fixed;
    top: 0;
    transition: all .5s;
    z-index: 9999;
}

.drawer-nav.open {
    right: 0;
    transform: translateZ(0);
}

/*.drawer-nav ul {*/
/*    box-sizing: border-box;*/
/*}*/

/*.drawer-nav ul li {*/
/*    box-sizing: border-box;*/
/*    border-bottom: 1px solid #000;*/
/*}*/

/*.drawer-nav ul li a {*/
/*    box-sizing: border-box;*/
/*    color: #000;*/
/*    display: block;*/
/*    font-size: 18px;*/
/*    line-height: 28px;*/
/*    padding: 5px 10px;*/
/*    text-decoration: none;*/
/*}*/
body.open {
    overflow: hidden;
}
/*--------------------------------------------------------------------------------------------------------------------*//*TABLE RESPONSIVE*/
.responsive_table_wrap {
    overflow-x: scroll;
}
.responsive_table {
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}
/*--------------------------------------------------------------------------------------------------------------------*//**/
/*--------------------------------------------------------------------------------------------------------------------*//**/
/*--------------------------------------------------------------------------------------------------------------------*//**/
/*--------------------------------------------------------------------------------------------------------------------*//* その他 */
.iconCommon{
    /*width: 40px; height: 40px;*/
    /*!*border: 1px gray solid;*!*/
    border-radius: 50px;
    /*padding: 5px;*/
}
.iconCommon:hover{
    background: lightgray;
}

.hiddenTarget{
    display: none;
}

/*作業エリア*/
.garageArea{
    display: none;
}
