@charset "UTF-8";

/*--------------------------------------------------------------*/
/* CSS and Graphics are released under Creative Commons Licence */
/* https://www.webplus.jp/                                      */
/* Copyright (C) Kiyonobu Horita @ WEBPLUS Inc.                 */
/*--------------------------------------------------------------*/


/* ========================================================

　Grobal Setting

=========================================================== */

*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    height: 100%;
}

html {
    /* ブラウザのルートフォントサイズである16pxを、1rem＝10pxにリセット */
    font-size: 62.5%;
    /* モバイル時に機能するフォントの自動調整を100％に */
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* iOSでリンクタップ時のハイライト表示（枠）を非表示に */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* ========================================================

　body

=========================================================== */

body {
    width: 100%;
    height: 100%;
    color: rgba(85, 85, 85, 1.00);
    font: normal 400 1.6rem/3.0rem 'Noto Sans CJK JP', 'Noto Sans JP', 'メイリオ', 'Meiryo', sans-serif; /* 基本フォント */
    word-wrap: break-word;
    letter-spacing: 0.0625rem;
    overflow-x: hidden;
}

@media only screen and (min-width: 992px) {

    body {
        padding-left: 27.0rem; /* navbarの幅の分、右方へ */
    }

}


/* ========================================================

　Default Link Color

=========================================================== */

a:link,
a:visited {
    color: rgba(0, 105, 195, 1.00); /* ブルー */
    text-decoration: none;
    outline: none;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

a:hover,
a:focus {
    color: rgba(235, 105, 120, 1.00); /* ピンク */
}

a:active,
a.active {
    color: rgba(235, 95, 0, 1.00); /* オレンジ */
}


/* ========================================================

　h1～h6 & Other Text

=========================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    letter-spacing: 0.25rem;
}

h2.none {
    display: none;
}


/* ========================================================

　nav（モバイルとPC共通）

=========================================================== */

#mainNav ul,
#mainNav li {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* 標準キャレット（▼）を非表示に */
#mainNav .dropdown-toggle::after {
    display: none;
}

/*　ログインボックス
----------------------------------------------------------- */
#mainNav #other .nav-item.logIn,
#mainNav #other .nav-item.logOut {
    display: none; /* スマホ時は非表示 */
    max-width: 30.0rem;
    padding: 1.5rem;
}

#mainNav #other .logIn {
    border: 0.3rem dotted rgba(125, 205, 245, 1.00);
}

#mainNav #other .logOut {
    border: 0.3rem dotted rgba(235, 105, 120, 1.00);
}

#mainNav #other li[class*="log"] span {
    display: block;
    margin-bottom: 1.5rem;
    font-size: 1.4rem;
    line-height: 1.8rem;
}

#mainNav #other .logIn span {
    color: rgba(0, 160, 235, 1.00);
}

#mainNav #other .logOut span {
    color: rgba(255, 0, 0, 1.00);
}

#mainNav #other .logOut .nav-link {
    height: 1.6rem;
    padding: 0;
}

#mainNav #other li[class*="log"] {
    margin: 0 2.0rem 2.0rem;
    padding: 1.5rem 0 0;
    border-radius: 0.6rem;
}

#mainNav #other .logIn label {
    color: rgba(0, 0, 0, 1.00);
    font-size: 1.6rem;
}

#mainNav #other .logIn form label:nth-child(3) {
    margin-top: 1.5rem;
}

#mainNav #other .logIn input {
    width: 100%;
    height: 3.0rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border: 0.1rem solid rgba(220, 220, 220, 1.00);
    background-color: rgba(255, 255, 255, 1.00);
    font-size: 1.6rem;
    font-weight: 300;
    line-height: 1.6rem;
}

#mainNav #other .logIn button {
    float: right;
    width: 8.0rem;
    height: 3.0rem;
    margin-top: 0.5rem;
    border: 0.1rem solid rgba(220, 220, 220, 1.00);
    background-color: rgba(255, 255, 240, 1.00);
    font-size: 1.4rem;
    line-height: 1.4rem;
}

/*　検索ボックスエリア
----------------------------------------------------------- */
#mainNav #other .search {
    margin-bottom: 2.0rem;
}

#mainNav #other .search form {
    margin: 0 2.0rem;
    max-width: 30.0rem;
}

#mainNav #other .search input {
    border: 0.1rem solid rgba(220, 220, 220, 1.00);
    font-weight: 300;
}

#mainNav #other .search form input:first-child {
    width: 100%;
    height: 4.0rem;
    padding-left: 3.0rem;
    background: rgba(255, 255, 255, 1.00) url("../images/search.png") left 0.5rem center / 2.0rem auto no-repeat;
}

#mainNav #other .search form input:last-child {
    float: right;
    width: 8.0rem;
    height: 3.0rem;
    margin-top: 0.5rem;
    background-color: rgba(255, 255, 240, 1.00);
    font-size: 1.4rem;
    line-height: 1.4rem;
}


/* ========================================================

　nav（モバイル）

=========================================================== */
@media only screen and (max-width: 991px) {

    #mainNav {
        background-color: rgba(255, 255, 255, 1.00);
    }

    /*　ブランドマーク（モバイルはテキストで表示）
    ----------------------------------------------------------- */
    #mainNav .navbar-brand {
        color: rgba(230, 0, 80, 1.00);
        font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "serif";
        font-size: 2.0rem;
        font-weight: 500;
    }

    /*　ハンバーガーボタン
    ----------------------------------------------------------- */
    #mainNav .navbar-toggler {
        width: 5.0rem;
        height: 5.0rem;
        border: 0.2rem solid rgba(245, 145, 160, 1.00);
        border-radius: 50%;
        background-color: rgba(255, 255, 255, 1.00);
        outline: none; /* タップ時のハイライト表示（枠）を非表示に */
        -webkit-transition: background-color 0.3s ease-in-out;
        -o-transition: background-color 0.3s ease-in-out;
        transition: background-color 0.3s ease-in-out;
    }

    /* メニュークローズ時のアイコン「三」 */
    #mainNav .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(245, 145, 160, 1.00)' stroke-width='3' stroke-linecap='square' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    /* メニューオープン時の背景色 */
    #mainNav .navbar-toggler[aria-expanded="true"] {
        background-color: rgba(245, 145, 160, 1.00);
    }

    /* メニューオープン時のアイコン「✕」 */
    #mainNav .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1.00)' stroke-width='3' stroke-linecap='square' d='M6 6L 24 24M24 6L6 24'/%3E%3C/svg%3E");
    }

    /*　メニューエリア
    ----------------------------------------------------------- */
    #mainNav .navbar-collapse {
        max-height: 100vh; /* フルスクリーン表示 */
        overflow-y: auto;
        -webkit-overflow-scrolling: touch; /* 惰性付きスクロール */
    }

    #mainNav .inner {
        min-height: 100vh; /* フルスクリーン表示 */
        padding-top: 2.0rem;
    }

    #mainNav .inner > ul > li:last-child {
        padding-bottom: 3.0rem; /* 最後のメニュー下の余白 */
    }

    #mainNav .inner > ul:last-child > li:last-child {
        padding-bottom: 20.0rem; /* メニュー領域をスクロールした時に最後のメニューを見やすくするための下余白 */
    }

    /* リンク部分 */
    #mainNav .nav-link {
        padding-left: 2.0rem;
        border-radius: 0.6rem;
        color: rgba(85, 85, 85, 1.00);
        font-size: 1.8rem;
        line-height: 4.0rem;
    }

    /* リンク部分（カレント時） */
    #mainNav .nav-link.active,
    #mainNav .nav-link.current {
        color: rgba(235, 95, 0, 1.00);
        background-color: rgba(240, 240, 240, 1.00);
    }

    /* 行頭のアイコン */
    #mainNav .nav-link i {
        width: 3.0rem;
        margin-right: 0.5rem;
        color: rgba(245, 145, 160, 1.00);
        text-align: center;
    }

    #mainNav .nav-link.active i,
    #mainNav .nav-link.current i {
        color: rgba(235, 95, 0, 1.00);
    }

    #mainNav #other .nav-link {
        font-size: 1.4rem;
    }

    /*　ドロップダウンメニューエリア
    ----------------------------------------------------------- */

    #mainNav .dropdown-menu {
        padding: 1.25rem 2.0rem;
        border-radius: 1.0rem; /* 角丸リセット */
    }

    /* 見出し部分 */
    #mainNav .dropdown-toggle {
        padding: 1.0rem;
    }

    /* 見出し（枠内） */
    #mainNav .dropdown-toggle span {
        display: block;
        width: 100%;
        padding-left: 2.0rem;
        border: 0.1rem solid rgba(255, 255, 255, 1.00);
        font-size: 2.0rem;
        line-height: 6.0rem;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    /* 会員専用メニュー　クローズ時 */
    #mainNav #members .dropdown-toggle[aria-expanded="false"] {
        background: rgba(250, 180, 80, 0.50); /* 背景色 */
    }

    #mainNav #members .dropdown-toggle[aria-expanded="false"] span {
        background: rgba(250, 180, 80, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /* 会員専用メニュー　オープン時 */
    #mainNav #members .dropdown-toggle[aria-expanded="true"] {
        background: rgba(250, 180, 80, 1.00); /* 背景色 */
    }

    #mainNav #members .dropdown-toggle[aria-expanded="true"] span {
        background: rgba(255, 255, 255, 1.00) url("../images/caret_yt.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(250, 180, 80, 1.00);
    }

    /* 理事専用メニュー　クローズ時 */
    #mainNav #director .dropdown-toggle[aria-expanded="false"] {
        background-color: rgba(125, 205, 245, 0.50); /* 背景色 */
    }

    #mainNav #director .dropdown-toggle[aria-expanded="false"] span {
        background: rgba(125, 205, 245, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /* 理事専用メニュー　オープン時 */
    #mainNav #director .dropdown-toggle[aria-expanded="true"] {
        background: rgba(125, 205, 245, 1.00); /* 背景色 */
    }

    #mainNav #director .dropdown-toggle[aria-expanded="true"] span {
        background: rgba(255, 255, 255, 1.00) url("../images/caret_bt.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(125, 205, 245, 1.00)
    }

    /* メニュー部分 */
    #mainNav .dropdown-item {
        margin: 0.75rem 0;
    }

    /* リンク部分 */
    #mainNav .dropdown-menu .nav-link {
        display: block;
        padding-left: 2.0rem;
        border-radius: 0.6rem;
        color: rgba(85, 85, 85, 1.00);
        font-size: 1.8rem;
        line-height: 4.0rem;
    }

    /* リンク部分（カレント時） */
    #mainNav .dropdown-menu .nav-link.active,
    #mainNav .dropdown-menu .nav-link.current {
        color: rgba(235, 95, 0, 1.00);
        background-color: rgba(240, 240, 240, 1.00);
    }

    /* 行頭のアイコン */
    #mainNav .dropdown-menu .nav-link i {
        width: 3.0rem;
        margin-right: 0.5rem;
        text-align: center;
    }

    #mainNav #members .dropdown-menu .nav-link i {
        color: rgba(250, 180, 80, 1.00);
    }

    #mainNav #director .dropdown-menu .nav-link i {
        color: rgba(125, 205, 245, 1.00);
    }

    #mainNav .dropdown-menu .nav-link.active i,
    #mainNav .dropdown-menu .nav-link.current i,
    #mainNav #members .dropdown-menu .nav-link.active i,
    #mainNav #members .dropdown-menu .nav-link.current i,
    #mainNav #director .dropdown-menu .nav-link.active i,
    #mainNav #director .dropdown-menu .nav-link.current i {
        color: rgba(235, 95, 0, 1.00);
    }

}

@media only screen and (min-width: 576px) {

    /*　ブランドマーク
    ----------------------------------------------------------- */
    #mainNav .navbar-brand {
        font-size: 2.4rem;
    }

}

@media only screen and (min-width: 768px) {

    /*　ブランドマーク
    ----------------------------------------------------------- */
    #mainNav .navbar-brand {
        font-size: 3.0rem;
    }

    /* ログインボックスエリア */
    #mainNav #other .nav-item.logIn,
    #mainNav #other .nav-item.logOut {
        display: block; /* タブレット時から表示 */
    }

}


/* ========================================================

　nav（PC）

=========================================================== */
@media only screen and (min-width: 992px) {

    #mainNav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        position: fixed;
        top: 0;
        left: 0;
        width: 27.0rem;
        height: 100vh;
        margin: 0;
        padding: 0;
        border-right: 0.1rem solid rgba(220, 220, 220, 1.00);
        background-color: rgba(255, 255, 255, 1.00);
        line-height: 2.0rem;
    }

    /*　ブランドマーク（PCは画像で表示）
    ----------------------------------------------------------- */
    #mainNav .navbar-brand {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        max-width: 14.0rem;
        max-height: 16.0rem;
        margin: 2.0rem auto;
        -webkit-transition: opacity 0.3s ease-in-out;
        -o-transition: opacity 0.3s ease-in-out;
        transition: opacity 0.3s ease-in-out;
    }

    #mainNav .navbar-brand img {
        width: 100%;
        height: auto;
    }

    /* マウスオーバー時の透過 */
    #mainNav .navbar-brand:hover {
        opacity: 0.7;
    }

    /*　ナビゲーションエリア
    ----------------------------------------------------------- */
    #mainNav .navbar-collapse {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(245, 245, 245, 1.00);
        -webkit-overflow-scrolling: touch; /* 惰性付きスクロール */
        overflow: hidden; /* これが無いと、タブレットのランドスケープのときにメニューが横揺れする */
        overflow-y: scroll;
        /* スクロールバー非表示（IE, Edge） */
        -ms-overflow-style: none;
        /* スクロールバー非表示（Firefox） */
        scrollbar-width: none; /* バリデートでエラーとなるが無視 */
    }

    /* スクロールバー非表示 */
    #mainNav .navbar-collapse::-webkit-scrollbar {
        display: none;
    }

    /* メニュー部分 */
    #mainNav .navbar-nav {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100%;
    }
    
    /* メニューを縦並びに */
    #mainNav .nav-item {
        display: block;
    }

    /* リンク部分 */
    #mainNav .nav-link {
        display: block;
        width: 100%;
        height: 8.0rem;
        padding-left: 5.0rem;
    }

    /* 英字表記 */
    #mainNav .nav-link aside {
        font-size: 1.0rem;
        text-transform: uppercase;
    }

    /*　一般向けメニューエリア
    ----------------------------------------------------------- */
    #mainNav #general .nav-link {
        border-top: 0.1rem solid rgba(250, 210, 210, 1.00);
        background: rgba(255, 255, 255, 1.00) url("../images/caret_p.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(235, 105, 120, 1.00);
    }

    /* リンク部分（カレント時） */
    #mainNav #general .nav-link.active,
    #mainNav #general .nav-link.current {
        background-color: rgba(250, 230, 230, 1.00);
        background-image: none;
        pointer-events: none;
    }

    /* マウスオーバー時 */
    #mainNav #general .nav-link:hover,
    #mainNav #general .nav-link.active:hover,
    #mainNav #general .nav-link.current:hover {
        color: rgba(255, 255, 255, 1.00);
        background: rgba(245, 145, 160, 1.00) url("../images/caret_w.png") right 1.0rem center scroll no-repeat;
    }

    /*　ログインボックスエリア
    ----------------------------------------------------------- */
    #mainNav #other {
        margin-top: 2.0rem;
        margin-bottom: 10.0rem;
    }

    #mainNav #other li[class*="log"] {
        background-color: rgba(255, 255, 255, 1.00);
    }

    /* リンク部分 */
    #mainNav #other .logOut a {
        display: block;
        color: rgba(85, 85, 85, 1.00);
    }

    /* マウスオーバー時 */
    #mainNav #other .logOut a:hover {
        padding-left: 1.0rem;
        color: rgba(235, 105, 120, 1.00);
    }

    /*　ドロップダウントグル
    ----------------------------------------------------------- */

    /* 見出し部分 */
    #mainNav .dropdown-toggle {
        padding: 1.0rem;
    }

    /* 見出し（枠内） */
    #mainNav .dropdown-toggle span {
        display: block;
        width: 100%;
        padding-left: 2.0rem;
        border: 0.1rem solid rgba(255, 255, 255, 1.00);
        font-size: 2.0rem;
        line-height: 8.0rem;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    /* 会員専用メニュー　クローズ時 */
    #mainNav #members .dropdown-toggle[aria-expanded="false"] {
        background: rgba(250, 180, 80, 0.50); /* 背景色 */
    }

    #mainNav #members .dropdown-toggle[aria-expanded="false"] span {
        background: rgba(250, 180, 80, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /* 会員専用メニュー　オープン時 */
    #mainNav #members .dropdown-toggle[aria-expanded="true"] {
        background: rgba(250, 180, 80, 1.00); /* 背景色 */
    }

    #mainNav #members .dropdown-toggle[aria-expanded="true"] span {
        background: rgba(255, 255, 255, 1.00) url("../images/caret_yt.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(250, 180, 80, 1.00);
    }

    /* 会員専用メニュー　マウスオーバー時 */
    #mainNav #members .dropdown-toggle[aria-expanded="false"]:hover {
        background: rgba(250, 180, 80, 1.00); /* 背景色 */
    }

    #mainNav #members .dropdown-toggle[aria-expanded="false"]:hover span {
        background: rgba(250, 180, 80, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /* 理事専用メニュー　クローズ時 */
    #mainNav #director .dropdown-toggle[aria-expanded="false"] {
        background-color: rgba(125, 205, 245, 0.50); /* 背景色 */
    }

    #mainNav #director .dropdown-toggle[aria-expanded="false"] span {
        background: rgba(125, 205, 245, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /* 理事専用メニュー　オープン時 */
    #mainNav #director .dropdown-toggle[aria-expanded="true"] {
        background: rgba(125, 205, 245, 1.00); /* 背景色 */
    }

    #mainNav #director .dropdown-toggle[aria-expanded="true"] span {
        background: rgba(255, 255, 255, 1.00) url("../images/caret_bt.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(125, 205, 245, 1.00)
    }

    /* 理事専用メニュー　マウスオーバー時 */
    #mainNav #director .dropdown-toggle[aria-expanded="false"]:hover {
        background-color: rgba(125, 205, 245, 1.00); /* 背景色 */
    }

    #mainNav #director .dropdown-toggle[aria-expanded="false"]:hover span {
        background: rgba(125, 205, 245, 1.00) url("../images/caret_wb.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(255, 255, 255, 1.00);
    }

    /*　ドロップダウンメニューエリア
    ----------------------------------------------------------- */
    #mainNav .dropdown-menu {
        position: relative;
        top: 0;
        height: auto;
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        /* 左からスライドインさせるアニメーションの設定 */
        -webkit-animation: slideInleft 0.5s ease-in-out;
        animation: slideInleft 0.5s ease-in-out;
    }

    /* メニュー部分 */
    #mainNav .dropdown-menu .nav-item {
        background: none;
    }

    /* リンク部分 */
    #mainNav .dropdown-menu .nav-link {
        display: block;
        width: 100%;
        height: 8.0rem;
        padding-left: 5.0rem;
        border-top: 0.1rem solid rgba(220, 220, 220, 1.00);
        color: rgba(85, 85, 85, 1.00);
        font-size: 1.6rem;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    /* 英字表記 */
    #mainNav .dropdown-menu .nav-link aside {
        font-size: 1.0rem;
        text-transform: uppercase;
    }

    /* 会員専用メニュー */
    #mainNav #members .dropdown-menu .nav-link {
        border-top: 0.1rem solid rgba(250, 205, 160, 1.00);
        background: rgba(250, 245, 225, 1.00) url("../images/caret_y.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(245, 150, 0, 1.00);
    }

    /* 会員専用メニュー　カレント時 */
    #mainNav #members .dropdown-menu .nav-link.active,
    #mainNav #members .dropdown-menu .nav-link.current {
        background-color: rgba(250, 235, 185, 1.00);
        background-image: none;
        pointer-events: none;
    }

    /* 会員専用メニュー　マウスオーバー時 */
    #mainNav #members .dropdown-menu .nav-link:hover,
    #mainNav #members .dropdown-menu .nav-link.active:hover,
    #mainNav #members .dropdown-menu .nav-link.current:hover {
        color: rgba(255, 255, 255, 1.00);
        background: rgba(250, 180, 80, 1.00) url("../images/caret_w.png") right 1.0rem center scroll no-repeat;
    }

    /* 理事専用メニュー */
    #mainNav #director .dropdown-menu .nav-link {
        border-top: 0.1rem solid rgba(190, 230, 250, 1.00);
        background: rgba(230, 250, 255, 1.00) url("../images/caret_b.png") right 2.0rem center scroll no-repeat; /* 背景色とキャレット */
        color: rgba(0, 160, 235, 1.00);
    }

    /* 理事専用メニュー　カレント時 */
    #mainNav #director .dropdown-menu .nav-link.active,
    #mainNav #director .dropdown-menu .nav-link.current {
        background-color: rgba(200, 240, 250, 1.00);
        background-image: none;
        pointer-events: none;
    }

    /* 理事専用メニュー　マウスオーバー時 */
    #mainNav #director .dropdown-menu .nav-link:hover,
    #mainNav #director .dropdown-menu .nav-link:hover,
    #mainNav #director .dropdown-menu .nav-link:hover {
        color: rgba(255, 255, 255, 1.00);
        background: rgba(125, 205, 245, 1.00) url("../images/caret_w.png") right 1.0rem center scroll no-repeat;
    }

}

@-webkit-keyframes slideInleft {

    0% {
        opacity: 0;
        -webkit-transform: translateX(-25%);
        transform: translateX(-25%);
    }

    100% {
        opacity: 1.0;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

}

@keyframes slideInleft {

    0% {
        opacity: 0;
        -webkit-transform: translateX(-25%);
        transform: translateX(-25%);
    }

    100% {
        opacity: 1.0;
        -webkit-transform: translateX(0);
        transform: translateX(0);


    }

}


/* ========================================================

　header

=========================================================== */

/*　トップページ
----------------------------------------------------------- */
header#home {
    width: 100%;
    padding: 10.0rem 0 4.0rem; /* 高さ調整の余白 */
    background: url("../images/heroimage_mb.jpg") center top / cover no-repeat; /* スマホ時はモバイル用画像を表示 */
}

/* メッセージ */
header#home .inner h1 {
    display: none; /* 当面、非表示 */
    font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "serif";
    font-size: 2.0rem;
}

@media only screen and (min-width: 576px) {

    header#home {
        padding: 12.0rem 0 5.0rem; /* 高さ調整の余白 */
    }

}

@media only screen and (min-width: 768px) {

    header#home {
        background-image: url("../images/heroimage.jpg"); /* タブレット～PC時はPC用画像を表示 */
        background-size: 100% auto;
    }

    /* メッセージ */
    header#home .inner h1 {
        font-size: 2.4rem;
    }

}

@media only screen and (min-width: 992px) {

    header#home {
        padding: 12.5rem 0; /* 高さ調整の余白 */
    }

    /* メッセージ */
    header#home .inner h1 {
        font-size: 3.0rem;
    }

}

@media only screen and (min-width: 1200px) {

    header#home {
        padding: 16.5rem 0; /* 高さ調整の余白 */
    }

}

@media only screen and (min-width: 1600px) {

    header#home {
        padding: 20.5rem 0; /* 高さ調整の余白 */
    }

}


/*　下層ページ
----------------------------------------------------------- */
header#low {
    position: relative;
}

header#low source,
header#low img {
    width: 100%;
    height: auto;
}

header .layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.50);
}

header#low .container {
    position: absolute;
    top: 47.5%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

header#low h1,
header#low aside {
    font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "serif";
    text-align: center;
    text-shadow: 0.15rem 0.15rem 0.15rem rgba(255, 255, 255, 1.00), 0 0 0.5rem rgba(255, 255, 255, 1.0), 0 0 0.25rem rgba(255, 255, 255, 1.00);
}

header#low h1 {
    font-size: 3.0rem;
}

.privacy-policy header#low h1 {
    font-size: 2.4rem;
}

header#low aside {
    line-height: 3.0rem;
}

@media only screen and (min-width: 576px) {

    .privacy-policy header#low h1 {
        font-size: 3.0rem;
    }

}

@media only screen and (min-width: 992px) {

    header#low .container {
        top: 25.5%;
    }

    header#low h1 {
        font-size: 3.2rem;
    }

}

@media only screen and (min-width: 1200px) {

    header#low .container {
        top: 40.0%;
    }

}


/* ========================================================

　footer

=========================================================== */

footer {
    padding: 2.0rem 0 6.0rem;
    background-color: rgba(245, 145, 160, 1.00);
    color: rgba(255, 255, 255, 1.00);
    font-size: 1.4rem;
    text-align: center;
}

footer p {
    margin: 0;
}

footer p:last-child {
    display: none;
}

footer a:link,
footer a:visited {
    color: rgba(255, 255, 255, 1.00);
}

footer a:hover,
footer a:focus {
    color: rgba(85, 85, 85, 1.00);
}

@media only screen and (min-width: 768px) {

    footer {
        padding: 3.0rem 0;
    }

    footer p:last-child {
        display: block;
    }

}

/* ========================================================

　Fixed Menu

=========================================================== */

/*　rightFixed
----------------------------------------------------------- */
#rightFixed {
    display: none;
}

@media only screen and (min-width: 768px) {

    #rightFixed {
        display: block;
        position: fixed;
        top: 20.0rem;
        right: 0.5rem;
        padding: 1.0rem 0;
        border-radius: 0.3rem;
        background-color: rgba(0, 0, 0, 0.50);
        text-align: center;
        z-index: 1042;
    }

    #rightFixed p {
        margin: 0;
        color: rgba(255, 255, 255, 1.00);
        font-size: 1.3rem;
        -ms-writing-mode: tb-rl;
        -webkit-writing-mode: vertical-rl;
        writing-mode: vertical-rl;
    }

    #rightFixed a {
        color: rgba(255, 255, 255, 1.00);
        font-size: 1.6rem;
    }

    #rightFixed a:hover {
        color: rgba(255, 240, 0, 1.00);
    }

}

@media only screen and (min-width: 1200px) {

    #rightFixed {
        padding: 1.0rem 0.25rem;
    }

}

/*　モバイル時、ページ下部に固定
----------------------------------------------------------- */
#onMobile {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 100%;
    padding: 0.5rem 0;
    background-color: rgba(0, 0, 0, 0.70);
    color: rgba(255, 255, 255, 1.00);
    z-index: 1024;
}

#onMobile ul {
    margin: 0 auto;
    padding: 0;
    text-align: center;
}

#onMobile li {
    display: inline-block;
}

#onMobile li:nth-child(n+2) {
    margin-left: 2.5rem;
}

#onMobile a {
    color: rgba(255, 255, 255, 1.00);
    font-size: 2.0rem;
}

#onMobile li:nth-child(1) a {
    font-size: 1.6rem;
}

#onMobile li:nth-child(1) a i {
    position: relative;
    top: 0.125rem;
    font-size: 2.0rem;
}

#onMobile li:nth-child(3) a {
    font-size: 2.4rem;
}

#onMobile li:nth-child(2) aside,
#onMobile li:nth-child(3) aside {
    display: none;
}

.privacy-policy #onMobile li.privacy {
    display: none;
}

@media only screen and (min-width: 768px) {

    #onMobile {
        display: none;
    }

}


/* ========================================================

　Scroll to Pagetop

=========================================================== */

.scroll-to-top {
    display: none;
}

@media only screen and (min-width: 768px) {

    .scroll-to-top {
        right: 0.5rem;
        bottom: 0.5rem;
        width: 15.0vw;
        max-width: 6.0rem;
        height: auto;
        opacity: 0.7; /* 通常時は透過70％ */
        -webkit-transition: opacity 0.3s ease-in-out;
        -o-transition: opacity 0.3s ease-in-out;
        transition: opacity 0.3s ease-in-out;
        /* 下からスライドインさせるアニメーションの設定 */
        -webkit-animation: slideInBottom 0.3s;
        animation: slideInBottom 0.3s;
    }

    /* マウスオーバー時の透過 */
    .scroll-to-top:hover {
        opacity: 1.0;
    }

    .scroll-to-top img {
        width: 100%;
        height: auto;
    }

}

@-webkit-keyframes slideInBottom {

    0% {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }

    100% {
        opacity: 1.0;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

}

@keyframes slideInBottom {

    0% {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }

    100% {
        opacity: 1.0;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

}


/* ========================================================

　Modal Window

=========================================================== */

/*　モーダル
----------------------------------------------------------- */
.modal-body {
    padding-top: 6.0rem;
    padding-bottom: 3.0rem;
    font-size: 1.4rem;
    font-weight: 300;
    text-align: center;
    line-height: 2.0rem;
}

.modal-body h2 {
    margin-bottom: 2.0rem;
    height: 6.0rem;
    font-size: 2.2rem;
    background: -o-repeating-linear-gradient(135deg, rgba(145, 195, 30, 0.25), rgba(145, 195, 30, 0.25) 0.5rem, rgba(255, 255, 250, 1.00) 0.5rem, rgba(255, 255, 250, 1.00) 1.0rem);
    background: repeating-linear-gradient(-45deg, rgba(145, 195, 30, 0.25), rgba(145, 195, 30, 0.25) 0.5rem, rgba(255, 255, 250, 1.00) 0.5rem, rgba(255, 255, 250, 1.00) 1.0rem);
}

.modal-body h3 {
    margin: 2.0rem 0;
}

.modal-body p {
    text-align: justify;
}

.modal-body dl {
    margin: 5.0rem 0;
    text-align: left;
}

.modal-body dt {
    margin-bottom: 1.0rem;
}

.modal-body dt:nth-child(n+2) {
    margin-top: 4.0rem;
}

.modal-body dd {
    text-align: justify;
}

.modal-body dd ul {
    margin: 0;
    margin-top: 1.0rem;
    margin-left: 4.0rem;
    margin-bottom: 2.0rem;
    padding: 0;
}

.modal-body .box {
    margin-bottom: 3.0rem;
    padding: 1.0rem;
    border: 0.1rem solid rgba(220, 220, 220, 1.00);
    border-radius: 0.6rem;
}

.privacy-modal .close {
    position: absolute;
    top: 1.0rem;
    right: 1.5rem;
    color: rgba(0, 105, 195, 1.00);
    font-size: 4.0rem;
    line-height: 3rem;
    opacity: 1;
    z-index: 1;
    -webkit-transition: color 0.3s ease-in-out;
    -o-transition: color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out;
}

.privacy-modal .close:hover {
    color: rgba(235, 95, 0, 1.00);
}

/*　button
/*-------------------------------------------*/
.privacy-modal .btn {
    padding-left: 2.0rem;
    padding-right: 2.0rem;
    background-color: rgba(0, 105, 195, 1.00);
    border: none;
    font-size: 1.6rem;
    line-height: 4.0rem;
    outline: none;
    -webkit-transition: background-color 0.3s ease-in-out;
    -o-transition: background-color 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
}

.privacy-modal .btn:hover {
    background-color: rgba(26, 165, 219, 1.00);
}

@media only screen and (min-width: 768px) {

    .modal-body .box {
        padding: 2.0rem;
    }

    .modal-body h2 {
        height: 8.0rem;
        font-size: 3.0rem;
    }

}


/*　iOS以外は背景画像をフィクス
----------------------------------------------------------- */

/* Chrome / Firefox / Opera */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {

    header#home,
    main .divider {
        background-attachment: fixed;
    }

}

/* Edge 1 */
@supports (-ms-ime-align: auto) {

    header#home,
    main .divider {
        background-attachment: fixed;
    }

}

/* Edge 2（バリデートでエラーとなるが無視） */
_:-ms-lang(x)::backdrop,
header#home,
main .divider {
    background-attachment: fixed;
}

/* IE11（バリデートでエラーとなるが無視） */
_:-ms-lang(x)::-ms-backdrop,
header#home,
main .divider {
    background-attachment: fixed;
}


/*　IEハック
----------------------------------------------------------- */
@media all and (-ms-high-contrast: none) {

    /* IEで機能しない display:flex を解除*/
    #mainNav,
    #mainNav .navbar-brand,
    #mainNav .navbar-collapse,
    section {
        display: block;
    }

    #mainNav #other {
        margin-bottom: 30.0rem;
    }

}



/* ---- End of file --------------------------------------- */