@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

:root {
    --fjcablue: #00008b;
    --ajcdfcolor: #0d6366;
    --dark: #333;
    --light: #fff;
    --gold: #c1ab05;
    --green: #65a30d;
    --emerald: #32A67F;
    --orange: #d97706;
    --darkred: #8B0000;
    --red: #dc2626;
    --pink: #D06D8C;
    --salmon: #FA8072;
    --skyblue: #73aae3;
    --lightblue: #09C;
    --turquoise: #0891B2;
    --purple: #6f42c1;
    --yellow: #f6db35;
    --gray: #666;
}

body {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
}

#side-overlay .content-header,
#sidebar .content-header {
    padding-left: 1rem;
    padding-right: 1rem;
}

.btcolor-01 {
    background-color: #0284c7;
    color: white;
}

.btcolor-02 {
    background-color: var(--orange);
    color: white;
}

.btcolor-03 {
    background-color: var(--green);
    color: white;
}

.btcolor-04 {
    background-color: var(--orange);
    color: white;
}

.btcolor-05 {
    background-color: #6f42c1;
    color: white;
}

.btcolor-06 {
    background-color: #a5c73f;
    color: black;
}

.btcolor-07 {
    background-color: var(--yellow);
    color: black;
}

.btcolor-08 {
    border: none !important;
    background: var(--yellow) !important;
    color: #222;
}

a:hover.btcolor-08 {
    opacity: .8;
    color: #444;
}


/*--mypage-topの指定---------*/
@media (max-width:767.98px) {

    #mypage-top_infomation,
    #mypage-top_entrylist {
        max-height: 400px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    #mypage-top_infomation {
        margin-bottom: 2em;
    }
}

@media (min-width: 768px) {

    #mypage-top_infomation,
    #mypage-top_entrylist {
        max-height: 400px;
        overflow-y: auto;
        overflow-x: hidden;
    }
}


/*----top 新規問い合わせボタン等-----------*/


.entry-title {
    border-bottom: solid 1px #ccc;
    margin-bottom: 1em;
    ;
}

/*--加盟団体カラー--*/
body#fjca-mypage #page-container.sidebar-dark #sidebar {
    background-color: var(--fjcablue);
}

body#fjca-mypage .sidebar-dark .content-side.content-side-user {
    background-color: rgba(0, 0, 0, .2)
}

body#fjca-mypage #page-container {
    background-color: #f9ffff;
}

body#fjca-mypage #page-container.page-header-modern #page-header {
    background-color: #f9ffff;
}

/*--有資格者カラー--*/
body#fjca-member #page-container.sidebar-dark #sidebar {
    background-color: #0099CC;

}

body#fjca-member .sidebar-dark .content-side.content-side-user {
    background-color: #007aa3;
    color: #fff;
}

body#fjca-member #page-container {
    background-color: #ffffef;
}

body#fjca-member #page-container.page-header-modern #page-header {
    background-color: #ffffef;
}


.content-header a {
    color: #fff;
    ;
}

.bg-ajcdf {
    background-color: var(--ajcdfcolor);
}

.bg-fjca {
    background-color: #0284c7;
}


.titlebar {
    background: var(--fjcablue) !important;
    color: #fff;
    ;
}

/*----top タイトルバー-----------*/

body#fjca-member .titlebar {
    background: #0099CC !important;
    color: #fff;
    ;
}

/*----top タイトルバー-----------*/

.dark-mode #main-container .nav-main-link,
.dark-mode #side-overlay .nav-main-link,
.nav-main-dark .nav-main-link,
.page-header-dark #page-header .nav-main-link,
.sidebar-dark #sidebar .nav-main-link {
    color: rgba(228, 231, 237, .95);
}

.nav-main-heading {
    color: #fff;
}


/*--お知らせ--*/
.category_info,
.category_01 {
    background-color: var(--lightblue);
    color: #fff;
}

/*--大会--*/
.category_competition,
.category_02 {
    background-color: var(--green);
    color: #fff;
}

/*--講習会--*/
.category_seminar,
.category_03 {
    background-color: var(--orange);
    color: #fff;
}

/*--資格試験--*/
.category_license,
.category_04 {
    background-color: var(--purple);
    color: #fff;
}

/*--研修会--*/
.category_seminar,
.category_05 {
    background-color: var(--pink);
    color: #fff;
}

/*--国際大会情報--*/
.category_international,
.category_06 {
    background-color: var(--gold);
    color: #fff;
}

.category_other,
.category_07 {
    background-color: var(--dark);
    color: #fff;
}


/*--- ステータス ------------*/
/*-- 未読 --*/
.states-unread {
    background-color: var(--salmon);
    color: #fff;
}

/*-- 既読 --*/
.states-read {
    background-color: var(--skyblue);
    color: #fff;
}

/*-- 新着 --*/
.states-newitem {
    background-color: var(--green);
    color: #fff;
}

/*-- 返信済 --*/
.states-replied {
    background-color: var(--gray);
    color: #fff;
}

/*-- アーカイブ --*/
.states-archive {
    background-color: var(--gray);
    color: #fff;
}

/*-- 返信あり --*/
.states-accepted {
    background-color: var(--pink);
    color: #fff;
}

/*-- 確認中 --*/
.states-pendingreview {
    background-color: var(--yellow);
}

/*-- 申し込み不可 --*/
.states-unavailable {
    background-color: var(--dark);
}

/*-- 未達成 --*/
.states-incomplete {
    background-color: var(--darkred) !important;
}

/*-- 完了 --*/
.states-complete {
    background-color: var(--gray);
}

/*-- エントリー受付中 --*/
.states-entryopen {
    background-color: var(--red);
}

/*-- チケット販売中 --*/
.states-ticketsonsale {
    background-color: var(--purple);
}

/*-- 結果発表 --*/
.states-results {
    background-color: var(--emerald);
}

/*-- 延期 --*/
.states-postponed {
    background-color: var(--orange);
}

/*-- 中止 --*/
.states-canceled {
    background-color: var(--darkred);
}


/*--ユーザーのステータスカラー-------*/

/* ：活動中 */
.status-active {
    color: var(--green);
}

/* ：休止中 */
.status-paused {
    color: var(--yellow);
}

/* ：卒業 */
.status-graduated {
    color: #2196f3;
}

/* ：無効 */
.status-invalid {
    color: var(--dark);
}

/* ：停止 */
.status-suspended {
    color: var(--dark)
}

/* ：除名 */
.status-expelled {
    color: var(--dark)
}

/* ：結合 */
.status-merged {
    color: var(--purple);
}


.card-wrap {
    max-width: 800px;
    margin: auto;
}

.name-wrap {
    border-bottom: 4px solid #ccc;
    padding-bottom: 1em;
}

.expired {
    background: #FFFF00;
}

/*-- フォントカラー --*/
.font-fjcablue {
    color: var(--fjcablue);

}

.font-gold {
    color: var(--gold);
}

input:disabled {
    background-color: #e9ecef !important;
    color: #666 !important;
    border-color: #e9ecef !important;
    cursor: not-allowed;
}

.table-responsive .table thead th {
    white-space: nowrap;
}

a.btn {
    white-space: nowrap;
}

.table-01 {
    @media screen and (width <=800px) {
        width: 800px;
    }

    @media print,
    screen and (width > 800px) {
        width: 100%;
    }
}