@charset "UTF-8";
/** ************************************************************
    SYSTEM   : gela CMS
    TITLE    : リバーフロースタイルシートの定義
    SHEET    : style.css
    VERSION  : Ver1.4.2
    LANGUAGE : CSS level3
    CODESET  : UTF-8
    EXPLAIN  : サイト共通の色や形状を定義する。
    AUTHOR   : yap
    CREATED  : 2009/01/10  //as Ver1.2.1
    UPDATED  : 2022/04/25  //as Ver1.4.2
    CREDIT   : Copyright 2019 studio yap (http://yap.jp)
***************************************************************/

/***************************************************************
    ページ全体の定義
***************************************************************/

/* 全体の定義 */
* {
    box-sizing: border-box;
}

/* ヘッダ固定高さの定義 */
html {
    scroll-padding-top: 128px;
}

/* 文字色・フォントの定義 */
body, table, input, button, textarea, select {
    margin: 0;
    padding: 0;
    color: #333333;
    font-size: 12pt;
    font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ＭＳ Ｐゴシック', 'MS P Gothic', sans-serif;
    line-height: 1.5em;
}

/* 画像/動画の定義 */
img, video {
    max-width: 100%;
    height: auto;
    vertical-align: top;
    border: none;
}

/* ページ内フレームの定義 */
iframe {
    max-width: 100%;
}

/* テーブルの定義 */
table {
    font-size: 1rem;
}

/* 強調文字の定義 */
em {
    color: #FF6600;
    font-weight: bold;
    font-style: normal;
}

/* 重要文字の定義 */
strong {
    color: #CC0000;
    font-weight: bold;
}

/* リンクの定義 */
a {
    color: #0000CC;
    text-decoration: none;
    outline: none;
    transition-duration: 0.5s;
}

/* リンク画像の定義 */
a img {
    transition-duration: 0.5s;
}

/* リンクマウスオンの定義 */
a:hover {
    text-decoration: underline;
}

/* リンク画像マウスオンの定義 */
a:hover img {
    opacity: 0.75;
}

/***************************************************************
    ヘッダ部の定義
***************************************************************/

/* ラッパー部の定義 */
#gela_wrapper {
    width: 100%;
    min-width: 1000px;
}

/* 冒頭文の定義 */
#gela_headline {
    margin: 0 auto;
    padding: 0 8px;
    width: 1000px;
    color: #999999;
    font-size: 0.8rem;
}

/** ヘッダ部の定義 ********************************************/

/* ヘッダ部(header)の定義 */
#gela_header {
/*    position: fixed;*/
/*    top: 0;*/
    width: 100%;
/*    z-index: 10;*/
    background-color: #FFFFFF;
}

/* ヘッダ部画像の定義 */
#gela_header .gela_picture {
    margin: 0 auto;
    width: 1000px;
}

/* メニューボタン部の定義 */
#gela_menubtn {
    display: none;
}

/* メニュークローズボタン部の定義 */
#gela_menu_closebtn {
    display: none;
}

/* ヘッダグループ部の定義 */
#gela_hgroup {
    margin: 0 auto;
    width: 1000px;
    min-height: 80px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
}

/* サイト部の定義 */
#gela_site {
    padding: 8px;
    flex-grow: 1;
    display: flex;
    align-items: center;
}

/* サイト部リンクの定義 */
#gela_site a {
    color: inherit;
}

/* サイト部リンクマウスオンの定義 */
#gela_site a:hover {
    color: #000000;
    text-decoration: none;
}

/* サイト名部(h1)の定義 */
#gela_sitename {
    margin: 0;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.2em;
}

/** ナビ部の定義 **********************************************/

/* ナビ部リストの定義 */
#gela_navi ul {
    margin: 0;
    padding: 8px;
    font-size: 0.9rem;
    list-style: none;
    display: flex;
    flex-flow: row wrap;
}

/* ナビ部リスト項目の定義 */
#gela_navi li {
    margin: 4px;
}

/* ナビ部リスト項目リンクの定義 */
#gela_navi li a {
    color: inherit;
    text-decoration: none;
}

/* ナビ部リスト項目リンクの定義 */
#gela_navi li a div {
    margin: 0 4px;
    padding: 4px 4px 4px 12px;
    background: url('../images/point_icon.png') left center no-repeat;
    transition-duration: 0.5s;
}

/* ナビ部リスト項目リンク画像の定義 */
#gela_navi li a img {
    padding: 4px 8px;
    filter: grayscale(100%);
    transition-duration: 0.5s;
}

/* ナビ部リスト項目リンクテキストマウスオンの定義 */
#gela_navi li a:hover div {
    color: #000000;
    background-color: #E5E5E5;
}

/* ナビ部リスト項目リンク画像マウスオンの定義 */
#gela_navi li a:hover img {
    opacity: 1;
    filter: grayscale(0);
    transform: scale(1.1);
}

/* ナビ部選択リスト項目リンクの定義 */
#gela_navi li.sel a {
    color: #000000;
    background-color: #F2F2F2;
}

/* ナビボタン部の定義 */
#gela_navibtn {
    display: none;
}

/* ナビクローズボタン部の定義 */
#gela_navi_closebtn {
    display: none;
}

/** メニュー部の定義 ******************************************/

/* メニュー部(nav)の定義 */
#gela_menu {
    width: 100%;
    z-index: 10;
    border-top: solid 1px #CCCCCC;
    border-bottom: solid 1px #CCCCCC;
    background-color: #FFFFFF;
}

/* メニュー部リストの定義 */
#gela_menu ul {
    margin: 0 auto;
    padding: 3px 0;
    width: 1000px;
    list-style: none;
    display: flex;
    flex-flow: row wrap;
    background: url('../images/separator.png') left 4px repeat-y;
}

/* メニュー部リスト項目の定義 */
#gela_menu li {
    padding: 0 4px;
    display: flex;
    align-items: center;
    background: url('../images/separator.png') right top no-repeat;
}

/* メニュー部リスト項目リンクの定義 */
#gela_menu li a {
    padding: 8px 12px;
    color: inherit;
    text-decoration: none;
}

/* メニュー部リスト項目リンクマウスオンの定義 */
#gela_menu li a:hover {
    color: #000000;
    background-color: #E5E5E5;
}

/* メニュー部選択リスト項目リンクの定義 */
#gela_menu li.sel a {
    color: #000000;
    background-color: #F2F2F2;
}

/* メニュー部固定化の定義 */
#gela_menu.fixed {
    position: fixed;
    top: 0;
    left: 0;
}

/* メニュー部隠蔽化の定義 */
#gela_menu.hided {
    transform: translateY(-100%);
}

/***************************************************************
    ボディ部の定義
***************************************************************/

/* コンテンツ部リストの定義 */
#gela_contents {
/*    margin-top: 128px;*/
    padding-bottom: 48px;
    background-color: #FFFFFF;
}

/** トレース部の定義 ******************************************/

/* トレース部の定義 */
#gela_trace {
    background-color: #FFFFFF;
}

/* トレース部リストの定義 */
#gela_trace ul {
    margin: 0 auto;
    padding: 4px 0;
    width: 1000px;
    color: #666666;
    font-size: 0.9rem;
    list-style: none;
    display: flex;
    flex-flow: row wrap;
}

/* トレース部リスト項目の定義 */
#gela_trace li {
    display: flex;
    align-items: center;
}

/* トレース部リスト項目接尾詞の定義 */
#gela_trace li:last-child {
    padding: 4px;
}

/* トレース部リスト項目リンクの定義 */
#gela_trace li a {
    padding: 4px;
    color: inherit;
    text-decoration: none;
}

/* トレース部リスト項目接尾詞の定義 */
#gela_trace li a:after {
    margin-left: 8px;
    content: '＞';
}

/* トレース部リスト項目リンクマウスオンの定義 */
#gela_trace li a:hover {
    color: #000000;
    background-color: #E5E5E5;
}

/* コンテンツ部タイトルエリアの定義 */
#gela_contents .gela_title_area {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url('../images/title_wall.png') repeat;
}

/** コンテンツ部の定義 ****************************************/

/* コンテンツ部タイトル(h2)の定義 */
#gela_contents .gela_title {
    margin: 0 auto;
    padding: 48px 8px;
    width: 1000px;
    color: #666666;
    font-size: 2rem;
    font-weight: bold;
}

/* コンテンツ部セクションの定義 */
#gela_contents .gela_section {
    background-color: #FFFFFF;
    overflow: hidden;
}

/* コンテンツ部セクション見出しエリアの定義 */
#gela_contents .gela_caption_area {
    margin-top: 16px;
    padding: 24px 0;
}

/* コンテンツ部セクション見出し(h3)の定義 */
#gela_contents .gela_caption {
    margin: 0 auto;
    padding: 10px 8px 6px 16px;
    width: 1000px;
    color: #666666;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1em;
    background: url('../images/caption_icon.png') left center no-repeat;
}

/* コンテンツ部概要の定義 */
#gela_contents .gela_summary {
    margin: 16px auto;
    width: 1000px;
}

/* コンテンツ部パラグラフの定義 */
#gela_contents .gela_paragraph {
    margin: 0 auto;
    width: 1000px;
    overflow: hidden;
}

/* コンテンツ部パラグラフ見出しエリアの定義 */
#gela_contents .gela_subject_area {
    padding: 16px 0;
}

/* コンテンツ部パラグラフ見出し(h4)の定義 */
#gela_contents .gela_subject {
    margin: 0 auto;
    padding: 8px 8px 5px 16px;
    width: 1000px;
    color: #666666;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1em;
    background: url('../images/subject_icon.png') left center no-repeat;
}

/* コンテンツ部説明の定義 */
#gela_contents .gela_explain {
    margin: 16px auto;
    width: 1000px;
}

/* コンテンツ部添付エリアの定義 */
#gela_contents .gela_attach_area {
    margin: 0 -16px;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

/* コンテンツ部パラグラフ左段組み添付エリアの定義 */
#gela_contents .gela_article_left .gela_attach_area {
    float: right;
    margin: 0 -16px 0 16px;
}

/* コンテンツ部パラグラフ右段組み添付エリアの定義 */
#gela_contents .gela_article_right .gela_attach_area {
    float: left;
    margin: 0 16px 0 -16px;
}

/* コンテンツ部添付の定義 */
#gela_contents .gela_attach {
    margin: 16px;
    background-color: #FFFFFF;
}

/* コンテンツ部添付リンクの定義 */
#gela_contents .gela_attach a {
    color: inherit;
    text-decoration: none;
    display: block;
}

/* コンテンツ部添付コメントの定義 */
#gela_contents .gela_comment {
    padding: 8px;
    font-size: 0.9rem;
    line-height: 1rem;
}

/* ページトップへ部の定義 */
#gela_pagetop {
    position: fixed;
    bottom: 0;
    right: 0;
    display: none;
    z-index: 210;
}

/* ページトップへ部リンクの定義 */
#gela_pagetop a {
    margin: 16px;
    width: 48px;
    height: 48px;
    display: block;
    opacity: 0.75;
    background: url('../images/pagetop.png') no-repeat;
}

/* ページトップへ部リンクマウスオンの定義 */
#gela_pagetop a:hover {
    opacity: 1;
    transform: scale(1.1);
}

/** イベント情報部の定義 **************************************/

/* イベント情報部セクション見出しエリアの定義(override on style.css) */
#events .gela_caption_area {
    display: none;
}

/* イベント情報部パラグラフの定義(override on style.css) */
#events.gela_paragraph {
    width: 100%;
    margin: 32px 0;
    padding: 16px 0;
    background: url('../images/title_wall.png') repeat;
}

/* イベント情報部パラグラフ見出しエリアの定義(override on style.css) */
#events .gela_subject_area {
    display: none;
}

/* イベント情報部添付エリアの定義(override on style.css) */
#events .gela_attach_area {
    margin: 0 auto;
    width: 1000px;
}

/* イベント情報部添付画像の定義 */
#events .gela_picture {
    transition-duration: 0.5s;
}

/* イベント情報部添付コメントの定義(override on style.css) */
#events .gela_comment {
    transition-duration: 0.5s;
}

/* イベント情報部添付コメントリンクマウスオンの定義 */
#events a:hover .gela_comment {
    color: #000000;
    background-color: #F2F2F2;
}

/** もっと見る部の定義 ****************************************/

/* もっと見る部パラグラフの定義(override on style.css) */
#more.gela_paragraph {
}

/* もっと見る部パラグラフ見出しエリアの定義(override on style.css) */
#more .gela_subject_area {
    display: flex;
    justify-content: flex-end;
}

/* もっと見る部パラグラフ見出し(h4)の定義(override on style.css) */
#more .gela_subject {
    margin: 0;
    padding: 5px 40px 5px 16px;
    font-size: 1rem;
    font-weight: normal;
    display: inline;
    border: solid 1px #999999;
    border-radius: 1.5em;
    background: url('../images/link_icon.png') right center no-repeat;
    transition-duration: 0.5s;
}

/* もっと見る部見出しマウスオンの定義 */
#more .gela_subject:hover {
    color: #000000;
    background-color: #F2F2F2;
}

/* もっと見る部見出しエリアマウスオンの定義 */
#more .gela_subject_area a:hover {
    text-decoration: none;
}

/***************************************************************
    フッタ部の定義
***************************************************************/

/** バナー部の定義 ********************************************/

/* バナー部(nav)の定義 */
#gela_banner {
    width: 100%;
    border-top: solid 1px #CCCCCC;
}

/* バナー部リストの定義 */
#gela_banner ul {
    margin: 0 auto;
    padding: 16px 0;
    width: 1000px;
    list-style: none;
    display: flex;
    flex-flow: row wrap;
}

/* バナー部リスト項目の定義 */
#gela_banner li {
    margin: 8px;
}

/* バナー部リスト項目リンクの定義 */
#gela_banner li a {
    color: inherit;
    text-decoration: none;
    display: block;
    transition-duration: 0.5s;
}

/* バナー部リストリンク項目の定義 */
#gela_banner li div {
    padding: 16px;
    border: solid 1px #999999;
}

/* バナー部リスト項目リンクの定義 */
#gela_banner li a div {
    transition-duration: 0.5s;
}

/* バナー部リスト項目リンクマウスオンの定義 */
#gela_banner li a:hover {
    color: #000000;
    transform: scale(1.1);
}

/* バナー部リスト項目リンク画像マウスオンの定義 */
#gela_banner li a:hover img {
    opacity: 1;
}

/* バナー部リスト項目リンクテキストマウスオンの定義 */
#gela_banner li a:hover div {
    background-color: #E5E5E5;
}

/** フッタ部の定義 ********************************************/

/* フッタ部の定義 */
#gela_footer {
    background-color: #E5E5E5;
}

/* フッタグループ部の定義 */
#gela_fgroup {
    margin: 0 auto;
    padding: 8px;
    width: 1000px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
}

/* 連絡先部の定義 */
#gela_contact {
    padding: 8px 0;
    font-size: 0.9rem;
}

/** リンク部の定義 ********************************************/

/* リンク部リストの定義 */
#gela_link ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* リンク部リスト項目の定義 */
#gela_link li {
    padding: 8px 0;
}

/* リンク部リスト項目接頭詞の定義 */
#gela_link li:before {
    content: url('../images/point_icon.png');
}

/* 著作権表記部の定義 */
#gela_credit {
    padding: 8px;
    color: #666666;
    font-size: 0.9rem;
    text-align: center;
}

/***************************************************************
    表クラスの定義
***************************************************************/

/* 表の定義 */
table.gela_list {
    width: 100%;
    border-collapse: collapse;
}

/* 表見出しの定義 */
th.gela_list {
    padding: 8px;
    color: #000000;
    font-weight: normal;
    white-space: nowrap;
    border: solid 1px #CCCCCC;
    background-color: #E5E5E5;
}

/* 表明細の定義 */
td.gela_list {
    padding: 8px;
    border: solid 1px #CCCCCC;
}

/***************************************************************
    その他クラスの定義
***************************************************************/

/* 非表示の定義 */
.gela_hidden {
    display: none;
}

/* 改行無しの定義 */
.gela_nowrap {
    white-space: nowrap;
}

/* 注釈の定義 */
.gela_remarks {
    color: #999999;
    font-size: 90%;
}

/* 中央寄せの定義 */
.gela_center {
    text-align: center;
}

/* 左寄せの定義 */
.gela_left {
    text-align: left;
}

/* 右寄せの定義 */
.gela_right {
    text-align: right;
}

/* 左段組みの定義 */
.gela_leftcol {
    float: left;
}

/* 右段組みの定義 */
.gela_rightcol {
    float: right;
}

/* 大き目文字の定義 */
.gela_large {
    font-size: 1.2em;
    line-height: 1.2em;
}

/* 特大文字の定義 */
.gela_huge {
    font-size: 1.5rem;
    line-height: 1.5rem;
}

/* 小さ目文字の定義 */
.gela_small {
    font-size: 0.8rem;
    line-height: 0.8rem;
}

/* 段組みクリアの定義 */
.gela_clear {
    clear: both;
}

/***************************************************************
    Google Mapsの定義
***************************************************************/

/* Google Maps説明の定義 */
#google_maps .gela_explain{
    position: relative;
    padding-bottom: 60%;
    height: 0;
    overflow: hidden;
}

/* Google Maps地図の定義 */
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}
