/* 共通のパーツ */
*:not(i) {
    color: #0000008a;
    font-family: "NotoSansJP", sans-serif !important;
    font-size: 100%;
    font-weight: 900 !important;
    font-size: 14px;
    line-height: 40px;
}
ol,
ul {
    padding-left: 0px !important;
}
main{
    padding:30px;
}
body {
    font-size: 14px;
}
.system_logo{
    width:200px;
    margin:0 auto;
}
.b-btn{
    background-color: #473e57;
    padding: 0px 30px;
    border-radius: 30px;
    border-style: none;
    color: #fff;
    font-size: 14px;
    border: 2px solid #473e57;
    letter-spacing: 3px;
}
.b-btn:hover{
   background-color: #fff;
   border:2px solid #473e57;
   color:#473e57;
}
.g-btn{
    background-color: #473e57;
    padding: 0px 30px;
    border-radius: 30px;
    border-style: none;
    color: #fff;
    font-size: 14px;
    border: 2px solid #473e57;
    letter-spacing: 3px;
}
.g-btn:hover{
   background-color: #fff;
   border:2px solid #473e57;
   color:#473e57;
}

.bg-title {
    background-color: #04befe;
}

.page-title {
    color: #fff;
    font-size: 18px;
    margin-bottom: 0;
    padding-left:30px;
}

.heightsettingbtn {
    color: #333;
    margin: 10px 0px;
    font-weight: 900;
    text-align: left;
    font-size: 13px;
}

.customeform-title {
    background: #555;
    color: #fff;
    line-height: 30px;
    margin-bottom: 10px;
    margin: 12px !important;
}

a,
.side-menu li,
.stetas-box,
.file-item {
    cursor: pointer;
}
body {
    background-color: #F4F9Fc !important;
}

header {
    background-color: #fff !important;
}

.flex-between {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.flex {
    display: flex;
}

.flex-box {
    display: flex;
    width: 100%;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.box-shadow {
    box-shadow: 4px 4px 4px 4px rgb(0 0 0 / 20%);
}

img {
    width: 100%;
    max-width: 100%;
}

.gap-10 {
    gap: 10px;
}

.flex-50 {
    width: 50%;
}

.w-8 {
    width: 8% !important;
}

.w-10 {
    width: 10% !important;
}

.w-15 {
    width: 15% !important;
}

.w-20 {
    width: 20% !important;
}

.w-25 {
    width: 25% !important;
}

.w-30 {
    width: 30% !important;
}

.w-33 {
    width: 33% !important;
}

.f-18 {
    font-size: 18px;
}

.row_scroll {
    display: block;
    overflow-x: scroll;
    width: 100%;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}
/* 保存結果 */
.result_success{
    background: #ffa500;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    color: #fff;
    box-shadow: 4px 4px 4px 4px rgb(0 0 0 / 20%);
    margin-bottom: 20px;
}

/* 余白 */

.pt-30 {
    padding: 30px 0;
    box-sizing: border-box;
}


/* 全体にpadding */

.pa-30 {
    padding: 30px;
    box-sizing: border-box;
}

.pa-10 {
    padding: 10px;
    box-sizing: border-box;
}

.mt-30 {
    margin-top: 30px;
}


/* 全体のレイアウト構成 */


/* .range-left {
    width: 15%;
} */

.range-right {
    margin-left: 225px;
    /* padding: 25px 0px; */
    padding-bottom: 25px;
    margin-left: 225px;
}


/* タイトル */

.public-title {
    font-size: 25px;
    border-bottom: 2px solid #0069A2;
    margin-bottom: 30px;
}


/* table　横border */

.br-hover:hover {
    border-left: 5px solid #0d6efd;
}

.bg-color {
    background-color: #0069A2 !important;
}
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* ヘッダーメニューバー */

.header-pt {
    width: 98%;
    margin: 0 auto;
    padding: 5px;
}

.mypage-link {
    align-items: center;
    gap: 10px;
}

.mypage-link p {
    margin-bottom: 0 !important;
}

.dropdown-item {
    padding: 10px !important;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */

.bg-h{
    background-color: #473e57;
    color: #fff;
}



/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* 請求・入金　タブ */

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    background: #473e57 !important;
}

.nav-tabs .nav-link {
    color: #ffff !important;
    text-align: center;
    font-weight: bold;
    font-size: 1rem;
    background: #d3d3d3!important;
    border: 1px solid #fff !important;
    border-radius: 0!important;
    width:150px;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* ダッシュボード */

.width-98 {
    width: 98%;
    margin: 0 auto;
}

.width-90 {
    width: 90%;
    margin: 0 auto;
    padding: 30px 0;
}

.width-80 {
    width: 80%;
    margin: 0 auto;
}

.main-contents {
    display: flex;
    justify-content: center;
    /* grid-template-columns: repeat(4, 25%); */
    width: 100%;
    gap: 10px;
    /* text-align: center; */
    margin: 0 auto;
    /* overflow-x: auto;
    white-space: nowrap; */
}

.flex-box-25 {
    background-color: #fff;
    color: #154878;
    padding: 30px;
    width: 25%;
    position: relative;
}

.color-C7D5ED {
    background-image: linear-gradient( 15deg, #C7D5ED 0%, #ffff 100%);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20px;
}

.color-E2F0D9 {
    background-image: linear-gradient( 15deg, #E2F0D9 0%, #F6FAF4 100%);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20px;
}

.color-FFF2CC {
    background-image: linear-gradient( 15deg, #FFF2CC 0%, #FFFAEF 100%);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20px;
}

.color-FFB7B7 {
    background-image: linear-gradient( 15deg, #FFB7B7 0%, #FFF5F5 100%);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20px;
}

.custom-file-label::after {
    display: none !important;
}
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* 受信一覧 */

.reception-area {
    /* border: 1px solid #ccc; */
    /* margin-bottom: 30px; */
}

.rp-list-pa li {
    padding: 10px;
}

.grid-stetas {
    display: grid;
    grid-template-columns: 100px 100px 100px 100px 100px;
    /* grid-template-rows: repeat(5,60px); */
}

.stetas-box {
    background-color: #fff;
    color: #0069A2;
    padding: 10px;
    width: 100px;
    text-align: center;
    font-weight: bold;
}

.stetas-box:hover {
    background-image: linear-gradient( 15deg, #00529C, #0095DC 100%);
    color: #fff;
}

.stetas-box:hover {
    background-color: #F4F9Fc !important;
    border: 1px solid #fff;
    padding: 10px;
}

.stetas-box span {
    font-size: 15px;
}

.mail-body p {
    /* overflow: scroll; */
    height: 400px;
    /* margin-top: 5px; */
    overflow-y: scroll;
}


/* .memo-area {
    text-align: center;
    border: 1px solid #13547a;
} */

.gap-10 {
    gap: 10px;
}

.gap-20 {
    gap: 20px;
}

.gap-30 {
    gap: 30px;
}

.br-bottom {
    border-bottom: 1px solid #afeeee;
}

.reception-area ul li p {
    margin-bottom: 0 !important;
}

.reception-area ul {
    line-height: 30px;
}


/* hover */

#already_read:hover {
    background: #f5f5f5;
}

#browsing:hover {
    background: #e0ffff;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* ------------------------ */

.icon-area a {
    color: #13547a !important;
}

.mail-conteiner p {
    margin-bottom: 0 !important;
}

.mail-conteiner li {
    border-bottom: 1px solid #0069A2;
    padding: 10px 0px 5px 0px;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* 添付ファイル */

.grid-file {
    display: grid;
    grid-template-columns: repeat(2, 30%);
}

.file-box {
    background-color: #13547a;
    color: #fff;
    padding: 20px;
    text-align: center;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */


/* ファイル一覧 */

.grid-conteiner {
    display: grid;
    grid-template-columns: repeat(6, 16%);
    /* grid-template-rows: 150px; */
    width: 100%;
    justify-items: center;
    align-items: center;
    gap: 10px;
}

.file-item i {
    font-size: 50px;
}

.file-item span {
    font-size: 12px;
}


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */

.dropdown-menu {
    right: -81px !important;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    border-style: none !important;
}


/* -------------------------------------------------------- */

.back-radio {
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

.f-25 {
    font-size: 25px;
}