@charset "utf-8";
/*
Theme Name: RC
Theme URI: https://bsc-ltd.com/
Description: ロータリークラブ用のテーマ
Version: 1.0
Author: 株式会社ビーエスシー
Author URI: https://bsc-ltd.com/
*/

/* ――――――――――――――――――――――――――――――――――――― */
/* ▼ 共通 */
/* ――――――――――――――――――――――――――――――――――――― */
html, body {background-color: #9db1d0;color: #000;}
a, a:visited { text-decoration: none; }

body img{ max-width: 100%; height: auto; }

body iframe{width: 100%;}

.bg_menu    { background: #5b77a4;}
.bg_title   { background: #062048;}
.bg_rc      { background: #452d89;}

form textarea { width: 100%; }

ul{ list-style-type: none; }
/* -- flex ------------------------------------------------------------------ */
ul.disp-flex {
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-pack:justify;
    -moz-box-pack:justify;
    -webkit-flex-pack:justify;
    -moz-flex-pack:justify;
    -ms-flex-pack:justify;
    -webkit-justify-content:space-between;
    -moz-justify-content:space-between;
    justify-content:space-between;
    -webkit-box-align:stretch;
    -moz-box-align:stretch;
    -ms-flex-align:stretch;
    -webkit-align-items:stretch;
    -moz-align-items:stretch;
    align-items:stretch;
}
 
 ul.disp-flex.flex-wrap{
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap; 
}
 
 
ul.disp-flex.flex-middle li{
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-align:center;
    -moz-box-align:center;
    -webkit-align-items:center;
    -moz-align-items:center;
    align-items:center;
}

ul.disp-flex.flex-middle > li:first-child > *{ margin-right: 1em; }
ul.disp-flex.flex-middle > li:not(:first-child) > *{ margin-left: 1em; }

ul.disp-flex.flex-middle > li.not(.bar_mypage) {
    -webkit-box-flex:1;
    -moz-box-flex:1;
    -webkit-flex-grow:1;
    -moz-flex-grow:1;
    flex-grow:1;
}

#flex-frontpage > li{ margin-bottom: 1em; }
#flex-frontpage > li section{ padding: .5em; }
/* -- フォーム -------------------------------------------------------------- */
form input[type="text"], 
form input[type="password"], 
form input[type="number"], 
form input[type="date"], 
form input[type="time"], 
form textarea, form select {
    border: 1px solid #666;
    background: #fff;
}

form input[type="text"], 
form input[type="password"], 
form input[type="number"],
form textarea, 
form select {
    width: 99.5%;
}

form input[type="radio"],
form input[type="checkbox"]{
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    margin: 4pt;
    padding: 10pt 0;
    width: 16pt;
    height: 16pt;
    vertical-align: -25%;
}

form input[type="submit"],
form input[type="reset"],
form input[type="button"],
p.button,
form .button {
    display: block;
    margin: 2pt 5pt;
    padding: 5pt 15pt;
    border:2px #000 solid;
    border-collapse: separate !important;
    border-radius: 10px;                        /* CSS3草案 */ 
    -webkit-border-radius: 10px;        /* Safari,Google Chrome用 */    
    -moz-border-radius: 10px;               /* Firefox用 */ 
    font-weight: bold;
}
    form input[type="submit"], 
    p.button,
    form .button{
        background: #000; color: #fff;
    }
    
    form input[type="reset"], 
    .button.back, form .back{
        background: #fff; color: #000;
    }
    
    form input[type="submit"]:hover,
    p.button:hover,
    form .button:hover,
    form input[type="reset"]:hover,
    form .back:hover{ 
        border:2px #ff8c00 solid;
    }
    
    p.button,
    form .button {display: inline-block;margin: 0 auto !important;text-indent: 0 !important;}

/* ――――――――――――――――――――――――――――――――――――― */
/* ▼ ヘッダー・フッター・ラッパー */
/* ――――――――――――――――――――――――――――――――――――― */
/* コンテンツベースサイズ */
.size{margin: 0 auto;border-collapse: collapse;}

#container {
    position: relative;
    width: 100%;
    min-height: 100%;
    height: auto !important;
    height: 100%;
}

#container > footer{
    position: absolute;
    bottom: 0;
    min-height: 12em;
}

#container > header,
#container > #wrapper,
#container > footer{ width: 100%; }
#container > #wrapper { padding: 0 0 350pt; }

#container header a { color: #000; }
#container #wrapper a { color: #4169e1; }
#container #wrapper a.rc_mark_bg { color: #d8bfd8; }
#container footer a { color: #e6e6fa; }

#container header a:hover,
#container footer a:hover,
#container #wrapper a.rc_mark_bg:hover { color: #ffa500; }

#container #wrapper a:hover { color: #ff8c00; }

#container header a:hover,
#container header nav a:hover { color: #f0e68c;}

#container a:hover { text-decoration: underline; }


.subheader ul li.page_item a{ display: block; padding: .25rem !important;}
/* -- header ---------------------------------------------------------------- */
header { background: #062048; color: #fff;}
ul#header.disp-flex.flex-middle li:first-child > *{ color: #fff;}
header #header a.mypage{ background: #ea638c; }

header #header .login,
header #header .logout{ background: #999; }
header #header .login,
header #header .mypage,
header #header .logout{
    padding: .5em .5em .5em 3em;
    width: 100%;
    
    background-repeat:no-repeat;
    background-position: .5em center;
    -moz-background-size: 2rem auto;
    background-size: 2rem auto;
}

a.mypage{ padding: .5em 1em !important; }
a.login:not(body){background-image:url("img/icon_login.png") !important;}
a.logout{background-image:url("img/icon_logout.png") !important;}

/* -- footer --------------------------------------------------------------- */
footer { background: #262626; color: #fff; margin-top: 1em;}
footer #footer { padding-top: 1em; }

/* 右矢印 */
footer #footer > ul:not(#about_rc) > li{
    width: 25%;
    margin-bottom: 1em;
}

footer #footer dt.triangle { position: relative; display: block; padding-left: 1.3em;}
footer #footer dt.triangle:after{
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    width: .7em;
    height: .7em; 
    border-top: .25em solid #f1c40f;
    border-right: .25em solid #f1c40f;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: '';
}

footer #footer > *:not(#totop) { padding-bottom: 1em !important; }
footer #footer #sitemap { margin-bottom: 20pt; }
footer #footer #sitemap dl {font-size: .9rem; }
footer #footer #about_rc li { margin-right: 1em; }
footer #footer #about_rc #name_rc { min-width: 20em; margin: 0 auto; }
footer #footer #about_rc #name_rc .cell:first-child img{ max-width: 10em; }
footer #footer #about_rc #address { max-width: 32em; margin: 0 auto; }

/* ――――――――――――――――――――――――――――――――――――― */
/* ▼ CSS開閉 */
/* ――――――――――――――――――――――――――――――――――――― */
/* clickで表示 */
label.click { display: block; font-weight: bold;padding: 0; margin: 0;}

body input[type="checkbox"] + label.click > h3:hover,
body input[type="checkbox"] + label.click > h4:hover { cursor: pointer; background-color: rgba( 0, 0, 0, 0.80 ) !important; }


body input[type="checkbox"] + label.click > h3:after,
body input[type="checkbox"] + label.click > h4:after{ margin-left: 10pt; letter-spacing: -.1em; font-size: .8rem; content: '[クリックで開く]';}

body input[type="checkbox"]:checked + label.click > h3:after,
body input[type="checkbox"]:checked + label.click > h4:after{ font-size: .8rem; content: '[クリックで閉じる]';}

input[type="checkbox"].on-off {display: none;}

label.click + .click_open{
        height: 0;
        overflow: hidden;
        padding: 0 !important;
}

input[type="checkbox"].on-off:checked + .click + .click_open{ height: auto;}
input[type="checkbox"].on-off:checked + .click + .click_open .bg-white{ padding: 5pt !important;}
/* ――――――――――――――――――――――――――――――――――――― */
/* ▼ リストタグ */
/* ――――――――――――――――――――――――――――――――――――― */
.checkmark li{
    position: relative;
    left: 1.2rem;
    width: 90%;
    
}

.checkmark li::after {
    display: block;
    content: '';
    position: absolute;
    top: .4rem;
    left: -1rem;
    width: 10px;
    height: 6px;
    border-left: 2px solid #f00;
    border-bottom: 2px solid #f00;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

#edit_admin2 ~ section .bg-white .checkmark{ margin-bottom:.2em;}

.kome li{
    position: relative;
    left: 1.2em;
}
.kome li::after {
    display: block;
    content: '※';
    position: absolute;
    top: 0;
    left: -1.2em;
    color: red;
}

/* == ▼基本 =============================================================== */
/* dd用マーク：・
#wrapper #sidebar dl.menu dd:not(.square):before,
footer #footer > #sitemap dd:not(.square):before{
    display: inline-block;
    margin: 0 11pt 3pt 7pt;
    content: '';
    width: 3pt;
    height: 3pt;
    background: #fff;
} */

/* ------------------------------------------------------------------------- */
/* nav */

nav { background: #5b77a4; }
/* body nav .current-page-parent, body nav .current_page_item { background: #9db1d0; }*/

nav #menu_main{
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
}

nav #menu_main > li{
    width: 25%;
    height: 5em;
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-flex:1;
    -moz-box-flex:1;
    -webkit-flex-grow:1;
    -moz-flex-grow:1;
    flex-grow:1;
    -webkit-box-align:center;
    -moz-box-align:center;
    -webkit-align-items:center;
    -moz-align-items:center;
    align-items:center;
    text-align:center;
    
    z-index: 9999;
    position: relative;
    letter-spacing: .1em;
}
#container header nav a { color:#fff; width: 100%; display: block; }

nav #menu_main li:hover{ background-color: rgba( 255, 255, 255, 0.50 ); }
nav ul.sub-menu > li:not(.no_highlight):hover{ background-color: rgba( 0, 0, 0, 0.50 ); }
nav #menu_main > li{ border-left: 2px dashed #fff; }
nav #menu_main > li:last-child { border-right: 2px dashed #fff; }

/*

nav .pc #menu_main > li{ border-left: 2px dashed #fff; }
nav .pc #menu_main > li:last-child { border-right: 2px dashed #fff; }

/* 親メニュー - Parent nav
nav .table > li { display: table-cell; vertical-align: middle;}


nav .pc #menu_main li{
}*/

/* 子メニュー - .sub-menu */
nav #menu_main ul.sub-menu {
    position: absolute;
    border: 0;
    background-color: rgba( 91, 119, 164, 0.80 );
    display: none;
    font-size: .85rem;
    width: 100%;
    top: 5rem;
    left: 0;
}
nav #menu_main ul.sub-menu li{ font-size: .8rem; text-align:left; }

nav #menu_main ul.sub-menu li > a,
nav #menu_main ul.sub-menu ul > * > a,
nav #menu_main ul.sub-menu dl > dt,
nav #menu_main ul.sub-menu dl > dd > a{
    padding: .5em .2em;
    width: 100%;
}

nav #menu_main ul.sub-menu li+li { border-top: 2px dashed #fff; }
nav #menu_main ul.sub-menu li { background: rgba( 0, 0, 0, 0.20 ); color: #fff;}

/* ホバー＆フォーカスで子メニュー表示 */
/* Display sub menu by hover & focus */
nav #menu_main .menu-item-has-children:hover ul.sub-menu,
nav #menu_main .menu-item-has-children ul.sub-menu.focused { display: block; }

nav #menu_main > li > a{
    display: block;
    padding: 1em 0;
    background-repeat: no-repeat;
    background-position: center center;
    -moz-background-size: 35% auto;
    background-size: 35% auto;
    text-align: center;
}

nav #menu_main li.home > a{ background-image:url("img/menu_home_trans50.png"); }
nav #menu_main li.about > a{ background-image:url("img/menu_about_trans50.png");
    -moz-background-size: 25% auto;
    background-size: 25% auto;
}
nav #menu_main li.club > a{ background-image:url("img/menu_club_trans50.png"); }
nav #menu_main li.yotei > a{ background-image:url("img/menu_yotei_trans50.png"); }
nav #menu_main li.member > a{
    background-image:url("img/menu_member_trans50.png");
    -moz-background-size: 50% auto;
    background-size: 50% auto;
}
nav #menu_main li.katsudou > a{ background-image:url("img/menu_katsudou_trans50.png"); }
/* ------------------------------------------------------------------------- */
/* img */
.img_bg{
    width: 100%;
    background-repeat:no-repeat;
    background-position: center top;
    -moz-background-size:100% auto;
    background-size:100% auto;
}

.img_bg.top{ height: 320px;}
/*.img_bg.slogan{ height: 280px; background-image:url("img/img_rc_slogan.png");}*/
    .img_bg.subheader:not(.mypage){ 
        background-position: center 30%;
        background-image:url("img/top001.jpg");
    }
    .img_bg.subheader.mypage{
        background-position: left 30%;
        background-color: #fff;
        background-image:url("img/bg_mypage.jpg");
        -moz-background-size:auto 100%;
        background-size:auto 100%;
        height: 250px;
    }
    .img_bg.subheader.mypage .cell{ padding-bottom: 1em; }
    
    .img_bg.subheader.mypage .rc_title{
        padding: 2pt;
        color: #fff;
        background: -moz-linear-gradient(left, rgba(255,255,255,0), #000);
        background: -webkit-gradient(linear, left center, right center, from(rgba(255,255,255,0)), to(#000));
        background: -o-linear-gradient(left, rgba(255,255,255,0), #000);
        background: linear-gradient(left, rgba(255,255,255,0), #000);
        text-align: right;
        width: 15em;
    }
    
        #about          .img_bg.subheader{ background-image:url("img/top001.jpg"); }
        #yakuin-riji    .img_bg.subheader{ background-image:url("img/top002.jpg"); }
        #yotei          .img_bg.subheader{ background-image:url("img/top003.jpg"); }
        #member         .img_bg.subheader{ background-image:url("img/top004.jpg"); }
        #katsudou-list  .img_bg.subheader{ background-image:url("img/top005.jpg"); }
        #syuhou-list    .img_bg.subheader{ background-image:url("img/top006.jpg"); }

    
#wrapper #sidebar ul.margin1em li+li{margin-top: 1em;}

/* ========================================================================= */
.table.schedule .num { text-align: right; }
.table.schedule .red { color: #d7003a; }
.table.schedule .wine { color: #9a493f; }
.table.schedule .blue { background-color: #e0f2f9 !important; color: #2a83a2; }
.table.schedule .green { color: #028760; }
.table.schedule .yellow { background-color: #fbffad !important; }
.table.schedule .orange { background-color: #ffdcb3 !important; }
.table.schedule .row:not(.th) > div{ background-color: rgba( 255, 255, 255, 0.40 );}
 
.table.schedule .non_res_table .row > div { padding: 5pt;}

.table.schedule .row+.row > div { border-top:1px solid #333;}
.table.schedule .non_res_table .row+.row > div { border-top:1px dotted #666;}

.diagonal{
    background-image:url("img/tb_diagonal.png");
    background-repeat:no-repeat;
    background-position:center center;
    -moz-background-size: 100% 100%;
    background-size: 100% 100%;
}

/* -- contents ------------------------------------------------------------- */
#wrapper > * , #sidebar > *, #sidebar > .pc > .present { margin-bottom: 1em !important; } 

#contents section.bg-white{ padding: 5pt; }
#contents section > p:not(.no-indent):not(.align-center):not(.align-right):not(.align-left),
#contents p.indent{ text-indent: 1em; }

#contents section > p { padding: .5em 0; }
#contents section > p+p,
#contents section section+p { padding-top: 5pt; }
#contents section:not(.section_list) > ul:not(.inline_b):not(.checkmark),
#contents section:not(.section_list) > ol:not(.inline_b),
#contents section:not(.section_list) > dl:not(.inline_b) { padding-top: .5em; padding-bottom: .5em; }

#contents .space_button{margin: 10pt auto 0;}

#contents .line { height: 1px; border-top: 1px dashed #666;margin: .5em 0; }

#contents .section_list .thumbnail {
    border: 1px solid #000;
    background-repeat:no-repeat;
    background-position:center center;
}
    #contents #news .section_list .thumbnail {
        width: 150px;
        height: 104px;
        -moz-background-size: auto 120%;
        background-size: auto 120%;
    }
    #contents #syuhou .section_list .thumbnail {
        width: 100px;
        height: 80px;
        -moz-background-size: 120% auto;
        background-size: 120% auto;
    }
    #contents #syuhou .row { border-bottom: 1px dashed #666; }


#contents .table+.table{ margin-top: 1em; }
/* -- wrapper -------------------------------------------------------------- */
#contents .gallery{ text-align:center; margin: auto; }
#contents *:not(.gallery-item) img{ padding: 5pt; }

#home #wrapper .cell h2,
#wrapper #page h3, #wrapper #page h4{ margin-left: -5pt; margin-right: -5pt; }

#home #wrapper .cell h2{ margin-top: -5pt;margin-bottom: 5pt; }

#wrapper h2 { padding-top: .8rem; padding-bottom: .8rem; letter-spacing: .1em;}

#wrapper h3 {background: #492f92;color: #fff;}
    #wrapper #contents h3 {
        padding: 5pt 5pt 5pt 2.5em;
        background-repeat:no-repeat;
        background-position: .5em center;
        -moz-background-size: 1.5em auto;
        background-size: 1.5em auto;
        background-image:url("img/mark_rotary_white.png");
    }
    section+h2{ margin-top: 2em; }
    
    #wrapper #sidebar h3 { padding: .2rem .5rem; }
    #wrapper #contents > h2 + .bg-white > h3:first-child {margin-top:-5pt;}

#wrapper #contents section+section{margin-top: 20pt;}
#wrapper #contents section+h5{margin-top: 10pt;}

#sidebar > div {margin-bottom: 1em;}
#sidebar dl:not(.menu) dt~dd{ margin-left: 1em; }
#sidebar .disp-flex > li {margin-bottom: 1em;}
/*
    #contents #news .section_list h4:before, #sidebar h3 + dl dt > h4:before {content: '【';}
    #contents #news .section_list h4:after, #sidebar h3 + dl dt > h4:after {content: '】';}
*/
    
    
    body #contents .row > dd > h4:first-child { margin-top: -1pt !important;}

body #tbl_member > div.row:nth-child(2){
    display:none !important;
}
/* -- icon ----------------------------------------------------------------- */

section+.h2{margin-top: 20pt;}

h2{
    position: relative;
    margin: 0;
    padding: .5rem 0 .5rem 2.5em;
    font-size: 1.143em;
    font-weight: bold;
    display: block;
    width: auto;
    background: #062048;
    color: #fff;
}
h2:before{
    position: absolute;
    display: block;
    content: '';
    width: 1.5em;
    height: 1.5em;
    top: 0;
    left: .5em;
    bottom: 0;
    margin: auto;
    background-repeat:no-repeat;
    -moz-background-size: auto 100%;
    background-size: auto 100%;
    background-image:url("img/mark_rotary_white.png");
}
#info h2:before{ background-image:url("img/icon_info.png"); }
#news h2:before{ background-image:url("img/icon_news.png"); }
#facebook h2:before{ background-image:url("img/icon_facebook.png"); }
#syuhou h2:before{ background-image:url("img/icon_syuhou.png"); }


/* -- #link ---------------------------------------------------------------- */

#link .banner {
    display: block;
    width: 100%;
    height: 60px;
}
#link div.banner {
    padding: 5pt;

    background-repeat:no-repeat;
    background-position:center center;
    -moz-background-size:10% auto;
    background-size:100% auto;
}
    #link .rotary2840 .non_res_table {
        border: 1px solid #b31428; background: #fff;
    }
        #link .rotary2840 .banner {
            background-position:95% center;
            -moz-background-size:60px auto;
            background-size:60px auto;
            background-image:url("img/mark_gunma.png");
        }
    #link .surfers .banner {
        color: #fff;
        border: 1px solid #000;
        background-position:center 80%;
        background-image:url("img/banner_surfers.jpg");
    }

    #link .kanazawa .non_res_table {
        /* Webkit系 */  background: -webkit-gradient(linear, left top, right top, from(#005197), to(#000000));
        /* Mozilla系 */ background: -moz-linear-gradient(left, #005197, #000000);
        /* IE10+ */     background: -ms-linear-gradient(left, #005197, #000000);
        /* IE8-9 */     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#005197', endColorstr='#000000', GradientType=0)";
        /* IE5.5-7 */   /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#005197', endColorstr='#000000', GradientType=0); */
        color: #fff;
    }
        #link .kanazawa .banner{
            background-position:5pt center;
            background-image:url("img/mark_rotary_yellow.png");
            -moz-background-size:50px auto;
            background-size:50px auto;
        }
    #link li > img{
        width: 100%;
        height: auto;
    }
/* -- 固有エリア ----------------------------------------------------------- */
#wrapper #contents p.button a{ color: #fff; }
.bar_mypage ~ .button{ padding: .5em 5pt !important; }
from .button{ padding: 1em 5pt; }


/* bar_mypage */
.bar_mypage{
    background: #000;
    color: #fff;
    border-bottom: 0;
}
article .bar_mypage{ margin-top: -1em; }
.bar_mypage .button .cell{ padding: .25rem 0 .25rem 2.2rem; }
#sidebar .bar_mypage .button .cell{ padding: .5rem 0 .5rem 3.2rem; }

.bar_mypage .button.login,
.bar_mypage .button.logined,
.bar_mypage .button.logout{
    background-repeat:no-repeat;
    background-position:5pt center;
    -moz-background-size: 2.2rem auto;
    background-size: 2.2rem auto;
    
}
.pc .bar_mypage{
    border:10pt solid #000;
    border-bottom:5pt solid #000;
    border-right:10pt solid #000;
}
#sidebar .pc .bar_mypage{ margin-bottom: 15pt; }
#sidebar .present img{ display: block !important; }


.pc .bar_mypage .button{
    border-top:10pt solid #000;
    border-bottom:10pt solid #000;
}
.bar_mypage .cell a{color: #fff !important;font-weight: bold;}


/* front-page */

#info .square:before{ background: #000;}
#flex-frontpage #info{
    background-repeat:no-repeat;
    background-position:90% 99%;
    background-size:380px auto;
    background-image:url("img/mark_rotary_white.png");
}

/* == ▼装飾 =============================================================== */
/* ■ */
.square:before{
    position: absolute;
    margin: .35em auto auto;
    content: '';
    top: 0;
    bottom: 0;
    left: .2rem;
    width: .5rem;
    height: .5rem;
    background: #fff;
}

.square{ position: relative; display: block; padding-left: 1.2rem;}

.icon_bg{
    width: 100%;
    background-repeat:no-repeat;
    background-position:center center;
    -moz-background-size:80% auto;
    background-size:80% auto;
}

.banner{
    background-repeat:no-repeat;
    display: table-cell !important;
    width: 100%;
    height: auto;
    vertical-align: middle !important;
}

.fotorama_rc{ background-color: rgba( 255, 255, 255, 0.40 ); }

/* == ▼ページトップに戻る ================================================= */

#totop {
    z-index:2147483647;
    display: none;
    position: fixed;
    bottom: 2em;
    right:0;
}

#totop a {
    margin: 1.5em 0;
    padding:0 .5em 0 1em;
    display: block;
    height: 50px;
    line-height: 50px;
    background-color: #000;
    text-align: center;
    color: #fff;
    text-decoration: none;
    
    border-radius: 20px 0 0 20px;               /* CSS3草案 */  
    -webkit-border-radius: 20px 0 0 20px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 20px 0 0 20px;      /* Firefox用 */
}

#totop a:hover{
        -webkit-filter: opacity(0.7);
        -moz-filter: opacity(0.7);
        -o-filter: opacity(0.7);
        -ms-filter: opacity(0.7);
        filter: opacity(0.7);
}



/*Pagenation*/
.pagenation { display: block; margin: 1em 0; text-align: center;}

.pagenation li+li{ margin-left: 5pt;}

.pagenation .active {
    background-color: #000;
    color: #FFFFFF;
}
.pagenation li a {
    background: #fff;
    color: #FFFFFF;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.pagenation li .active,
.pagenation li a {
    display: block;
    padding: 10px 20px;
    height: auto;
    border: 2px solid #000;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}
.pagenation li a:hover {
    background-color: #999;
    color: #FFFFFF;
    opacity: 0.8;
    transition-duration: 200ms;
    transition-property: all;
    transition-timing-function: ease;
}
/* == ▼活動報告用 ================================================================ */
/*

▽4つ区切りで画像を表示
<ul class="katsudou-flex quarter">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽3つ区切りで画像を表示　※画像の高さを300までにする
<ul class="katsudou-flex quarter height300">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽3つ区切りで画像を表示
<ul class="katsudou-flex">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽3つ区切りで画像を表示　※画像の高さを300までにする
<ul class="katsudou-flex height300">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽2つ区切りで画像を表示
<ul class="katsudou-flex harf">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽2つ区切りで画像を表示　※画像の高さを300までにする
<ul class="katsudou-flex harf height300">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽フレックスじゃないけど横に並べる
<ul class="katsudou-table">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

▽フレックスじゃないけど横に並べる　※画像の高さを300までにする
<ul class="katsudou-table">
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
    <li>[img url="クリック画像URL" thumb="表示する画像" align="center"]</li>
</ul>

*/


.contain {
    display: inline-block;
    background-color: #ccc;
    background-position: center center;
    background-repeat: no-repeat;
    width: 250px;
    height: 250px;
    border: 1px solid #ccc;
    background-size: contain !important;
}

.katsudou-table{ display: table; width: 100%; }
.katsudou-table > li{ display: table-cell; padding: 0 !important; }

.katsudou-flex{
    list-style-type:none;
    
    width: 100%;
    margin: auto;
    padding: 0;
    
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-flex-pack: center;
    -moz-flex-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
.katsudou-flex li{
    width: 33%;
    height:auto;
    margin: 0 !important;
    padding: 0 .25rem !important;
}
.katsudou-flex.harf li{ width: 50% !important; }
.katsudou-flex.quarter li{ width: 25% !important; }
.height300 img{ max-height: 300px !important; }

/* == ▼RCマークリンク ====================================================== */


#wrapper .rc_mark_bg{ background: #492f92;color: #fff; }
#wrapper .rc_mark_bg.lr{/* left to right */
    /* Webkit系 */  background: -webkit-gradient(linear, left top, right top, from(#492f92), to(#000000));
    /* Mozilla系 */ background: -moz-linear-gradient(left, #492f92, #000000);
    /* IE10+ */     background: -ms-linear-gradient(left, #492f92, #000000);
    /* IE8-9 */     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#492f92', endColorstr='#000000', GradientType=0)";
    /* IE5.5-7 */   /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#492f92', endColorstr='#000000', GradientType=0); */
}

#wrapper .rc_mark_bg.tb{/* top to bottom */
    /* Webkit系 */  background: -webkit-gradient(linear, left top, left bottom, from(#492f92), to(#000000));
    /* Mozilla系 */ background: -moz-linear-gradient(top, #492f92, #000000);
    /* IE10+ */     background: -ms-linear-gradient(top, #492f92, #000000);
    /* IE8-9 */     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#492f92', endColorstr='#000000', GradientType=0)";
    /* IE5.5-7 */   /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#492f92', endColorstr='#000000', GradientType=0); */
}

#wrapper .rc_mark_bg{ display: block; }
#wrapper .rc_mark_bg .img_bg.rc_mark{ padding: 5pt; }
#wrapper .rc_mark_bg.lr .img_bg.rc_mark{
    background-image:url("img/mark_rotary_yellow.png");
    background-size:contain !important;
    font-size: .85em;
    padding-right: 45px;
    color: #fff;
}
#wrapper .rc_mark_bg.lr.kikin {
    /* Webkit系 */  background: -webkit-gradient(linear, left top, right top, from(#2e519a), to(#000000));
    /* Mozilla系 */ background: -moz-linear-gradient(left, #2e519a, #000000);
    /* IE10+ */     background: -ms-linear-gradient(left, #2e519a, #000000);
    /* IE8-9 */     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#2e519a', endColorstr='#000000', GradientType=0)";
    /* IE5.5-7 */   /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2e519a', endColorstr='#000000', GradientType=0); */
}
#wrapper .rc_mark_bg.lr.kikin .img_bg.rc_mark{
    color: #ffbe00;
    font-weight: bold;
}
#wrapper #contents .rc_mark_bg.lr .img_bg.rc_mark{
    background-position: right -5%;
    -moz-background-size: 100px auto;
    background-size: 100px auto;
}
#wrapper #sidebar .rc_mark_bg.lr .img_bg.rc_mark{
    background-position: right center;
    -moz-background-size: 45px auto;
    background-size: 45px auto;
}

#wrapper .rc_mark_bg.tb .img_bg.rc_mark{
    background-image:url("img/mark_rotary_yellow_trans50.png");
    background-position: 5pt 5pt;
    -moz-background-size:100px auto;
    background-size:100px auto;
}
#wrapper .rc_mark_bg+p{margin-top: 1em;}


/* == phase3 ================================================================ */
#area_shusseki .table .row .shusseki_title{ width: 5.5em; }

#area_shusseki .disp-flex{
    -webkit-box-align:center;
    -moz-box-align:center;
    -ms-flex-align:center;
    -webkit-align-items:center;
    -moz-align-items:center;
    align-items:center;
}

#area_shusseki .disp-flex li{
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-align:center;
    -moz-box-align:center;
    -ms-flex-align:center;
    -webkit-align-items:center;
    -moz-align-items:center;
    align-items:center;
}

#area_shusseki .disp-flex li .shusseki_button{/* 名前 */
    display: block;
    width: 100%;
    margin: .5em;
    padding: .5em .1em;
    -webkit-border-radius: .25em;/* for Safari and Chrome */
    -moz-border-radius: .25em; /* for Firefox */
    -o-border-radius: .25em; /* for opera */
    border-radius: .25em;
}

.shusseki_button{ border: 2px solid #aaa; background: #ddd; }
.shusseki_button.delete{ border-color: red !important; }
input[type="checkbox"]:checked + label.shusseki_button{ border: 2px solid #EDB305; background: #EDB305; }
.shusseki_button:hover{ border: 2px solid #000 ! important; background: #fff ! important; cursor: pointer; }

#area_shusseki .disp-flex .flex-item.is_empty{
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}

#area_shusseki .shusseki_headfoot{
    padding: 1em .5em;
    background: #754CAA;
    color: #fff;
}

#area_shusseki #area_all .inline_b li+li{ margin-left: 1em; }

/* == ▼画面サイズの小さい設定 ============================================== */


@media screen and (max-width: 1035px){
    body .size{ width: 100% !important;}
}

@media screen and (max-width: 320px){
    html body #contents .section_list .thumbnail {
        -moz-background-size: auto 120% !important;
        background-size: auto 120% !important;
    }
    body .img_bg.subheader.mypage{ height: 80px; }
    body header .sp .non_res_table.full.bar_mypage .cell.per80.ver-middle{ width: auto !important;}
    body header .sp .non_res_table.full.bar_mypage .cell.per20.ver-middle{ width: 10em !important;}
}

@media screen and (max-width: 480px){
    #area_shusseki .disp-flex li{ width: 50%; }
    
    body .img_bg.subheader.mypage{ height: 150px; }
    body .img_bg.subheader:not(.mypage){
            -moz-background-size:100% auto  !important;
            background-size: 100% auto !important;
    }
}

@media screen and (min-width: 321px) and (max-width: 640px){
    #area_shusseki .disp-flex li{ width: 33.3%; }
    body header .sp .non_res_table.full.bar_mypage .cell.per80.ver-middle{ width: 70% !important;}
    body header .sp .non_res_table.full.bar_mypage .cell.per20.ver-middle{ width: 30% !important;}
}

@media screen and (max-width: 640px){ /* スマホ表示開始 */
    body header .sp > .bar_mypage > *:first-child{ padding-left: .5rem; }
    
    body #header .disp-flex {
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    body #header .disp-flex > .flex-item:nth-child(1) { width: 50%; }
    body #header .disp-flex > .flex-item:nth-child(3) { width: 100%; }
    body #header .disp-flex > .flex-item:nth-child(3) a {
        margin: 0;
        width: 100%;
    }
    body #header .disp-flex > .flex-item:nth-child(3) a br { display: none; }
    body header #header .login_button{
        padding: 1em 0 1em 3rem;
        border: 0;
    }

    .subheader ul li.page_item+li.page_item{ margin-top: .5rem;}
    body #container #contents section *:not(.non_res_table) ~ img{ margin:0; width: 90% !important; width: auto !important; }
    body #footer #about_rc #address { width: auto !important; }
    body #info .section_list{ height: 26em !important; overflow: auto; }

    .checkmark li::after {
        top: .4rem;
        left: -1.2rem;
        width: 8px;
        height: 5px;
        border-left: 2px solid #f00;
        border-bottom: 2px solid #f00;
    }
    
    #menu_sub{
        -webkit-box-direction:normal;
        -moz-box-direction:normal;
        -webkit-box-orient:vertical;
        -moz-box-orient:vertical;
        -webkit-flex-direction:column;
        -moz-flex-direction:column;
        flex-direction:column;
    }
    #menu_sub li{
        width: 100% !important;
        margin: 0;
        border-top: 1px #fff dashed;
        border-left: 0 !important;
        border-right: 0 !important;
    }
    
    body #footer > ul > li{ width: 100% !important; }
    
    form input[type="text"], form input[type="password"], form input[type="number"], form input[type="date"], form input[type="time"], form textarea, form select {
        -webkit-appearance:none;
    }
    body #wrapper #contents #page .size_s{ max-width: 280px; max-height: 250px; }
    body #wrapper #contents #page .size_m{ max-width: 320px; max-height: 300px; }
    body #wrapper #contents #page .size_l{ max-width: 450px; max-height: 320px; }
    
    html body #link .banner { height: 45px;}
    
    .katsudou-flex.harf li{ width: 100% !important; }
    .katsudou-flex.quarter li{
        width: 50% !important;
        /*
        -webkit-box-direction:normal;
        -moz-box-direction:normal;
        -webkit-box-orient:vertical;
        -moz-box-orient:vertical;
        -webkit-flex-direction:column;
        -moz-flex-direction:column;
        flex-direction:column;
        */
    }
    
    #flex-frontpage,#flex-mypage{
        -webkit-box-direction:normal;
        -moz-box-direction:normal;
        -webkit-box-orient:vertical;
        -moz-box-orient:vertical;
        -webkit-flex-direction:column;
        -moz-flex-direction:column;
        flex-direction:column;
    }
    #flex-frontpage > li,
    #flex-mypage > li{width: 100% !important;}
    
    #flex-mypage li:nth-child(4){
        -webkit-box-ordinal-group:3;
        -moz-box-ordinal-group:3;
        -webkit-flex-order:3;
        -moz-flex-order:3;
        -webkit-order:3;
        -moz-order:3;
        order:3;
    }
    
    #flex-mypage li:nth-child(2){
        -webkit-box-ordinal-group:2;
        -moz-box-ordinal-group:2;
        -webkit-flex-order:2;
        -moz-flex-order:2;
        -webkit-order:2;
        -moz-order:2;
        order:2;
    }
    #sidebar .disp-flex > li{ width: 100%; }
}

@media screen and (max-width: 480px){
    #header.disp-flex li{ margin: 0; width: 100%; }
}

@media screen and (min-width: 481px) and (max-width: 640px){
    #header.disp-flex li{ margin: 0; width: 100%; }
    #header.disp-flex li:nth-child(3),
    #header.disp-flex li:nth-child(4){ width: 50%; }
    #header.disp-flex li:nth-child(4){ border-left: 1px solid #000; }
}

@media screen and (max-width: 640px){
    #header.disp-flex li{ border-bottom: 1px solid #000; }
    #header.disp-flex {
        display:-webkit-box;
        display:-moz-box;
        display:-webkit-flexbox;
        display:-moz-flexbox;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #header.disp-flex.flex-middle li:not(:first-child) > *{ margin-left: 0; }
}

@media screen and (min-width: 641px){ /* PC表示開始 */
    body .img_bg.subheader:not(.mypage){ min-height: 150px;}
    #wrapper .rc_mark_bg.lr .img_bg.rc_mark { min-height: 4em; }
    
    ul#header.disp-flex.flex-middle li:first-child > *{ margin-right: 1em; }
    ul#header.disp-flex.flex-middle li:not(:first-child) > *{ margin-left: 1em; }
}

@media screen and (min-width: 641px) and (max-width: 960px){
    #area_shusseki .disp-flex li{ width: 25%; }
    
    body #footer > ul > li{ width: 50% !important; }
    
    body .img_bg.subheader{ background-position: center 20%;}
    body .img_bg.subheader #sub_navigation ul li:nth-child(odd){border-right: 1px #fff dashed;}
    body .img_bg.subheader #sub_navigation ul li:nth-child(n+3){border-top: 1px #fff dashed;}
    body #footer > ul > li{ width: 33.3%; }
    body #contents+#sidebar{margin-top: 15pt;}
    body #header .login_button { width: 10em; }
}
@media screen and (max-width: 960px) {
    body #container > #wrapper { padding-bottom: 0; }
    body #container > footer { position: static; }
    body article{ padding-right: 0;}
    body #contents,
    body #sidebar {display: block !important; width: 100% !important;}
    body #sidebar .present{ margin: 30pt 0 !important; }
    body #sidebar br { display : none;}
    body header > .pc,
    body #contents span.pc,
    body #sidebar .pc{ display: none !important; height: 0 !important;}
    body header > .sp,
    body #sidebar .sp { display: block !important;height: auto !important; }
    /*  body #sidebar .sp .img_bg.slogan { max-width: 150px;height: 200px;background-position:right top; }*/
    body #sidebar .sp .non_res_table{margin-bottom:10pt !important;}
    
    body #contents span.sp{display: inline !important;height: auto !important;}
    
    nav #menu_main{
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        border-top: dashed 1px #fff;
    }
    nav #menu_main li{
        width: 33.3%;
        border-bottom: dashed 1px #fff;
        border-left: 0 !important;
        border-right: 0 !important;
    }
    nav #menu_main li+li:not(:nth-child(4)){border-left: dashed 1px #fff !important;}
    nav #menu_main li   .sub-menu{ display: none !important; }
    
    #menu_sub{
        display:-webkit-box;
        display:-moz-box;
        display:-webkit-flexbox;
        display:-moz-flexbox;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    
    #menu_sub > li{
        width: 50%;
        display:-webkit-box;
        display:-moz-box;
        display:-webkit-flexbox;
        display:-moz-flexbox;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-flex:1;
        -moz-box-flex:1;
        -webkit-flex-grow:1;
        -moz-flex-grow:1;
        flex-grow:1;
        -webkit-box-align:center;
        -moz-box-align:center;
        -webkit-align-items:center;
        -moz-align-items:center;
        align-items:center;
        
        letter-spacing: .1em;
        background-color:rgba( 255, 255, 255, 0.60 );
    }

    nav #menu_main > li > a{
        -moz-background-size: 25% auto;
        background-size: 25% auto;
    }
    nav #menu_main li.member > a{
        -moz-background-size: 35% auto;
        background-size: 35% auto;      
    }

    body .img_bg.subheader:not(.mypage){ margin-bottom: 0; }
    body .img_bg.subheader #sub_navigation.sp {
        display: block !important;
        height: auto !important;
    }
    body .img_bg.subheader #sub_navigation ul li a:before{ content: '≫';margin-left: .5em;margin-right: .5em;color: #ff8c00;}
    
    
    #slides, #slides img{ height: auto; }
    
    body #wrapper .pc,
    body #wrapper .pc ~ .cell_1em{ display: none !important;}
    body #wrapper .sp,
    body .table,
    body .table > .row,
    body .table > .cell,
    body .table > .row > .cell{display: block !important;width: 100% !important;}
    body:not(#katsudou-list_old) #wrapper .table > .cell:not(.cell-th),
    body:not(#katsudou-list_old):not(#event_shousai_shusseki) #wrapper .table > .row > .cell:not(.cell-th){margin-bottom: 10pt;}
    
    body #header .login_button{
        border-top: 0;
        border-bottom: 0;
        -moz-background-size: 2em auto;
        background-size: 2em auto;
        padding-left:3em;
    }
    body#home #container > #wrapper { padding-top:0; }
    
    body #footer { padding-bottom: 3em;}
    body #footer #address { text-align: center;}
    
    body #totop { bottom: 0; right:2em; }

    body #totop a {
        margin: 0 1rem;
        padding: 0 1rem;
        font-size: 1.5rem;
        border-radius: 20px 20px 0 0;
        -webkit-border-radius: 20px 20px 0 0;
        -moz-border-radius: 20px 20px 0 0;
    }
    
    body .table.border .row > dt,
    body .table.schedule > .row > div:first-child {text-align: left !important;padding: .1em .5em;}
    body .table.border .row > * { border:0 !important; }
    
    body #flex-frontpage #info{ background-size: 50% auto; }
    
    body .img_bg.subheader.mypage{
        background-position: center 10%;
        -moz-background-size: 100% auto;
        background-size: 100% auto;
    }
}


@media screen and (min-width: 961px){
    #area_shusseki .disp-flex li{ width: 20%; }
    
    body #container #wrapper{ margin-top:15pt;}
    body #container article+aside,
    body #container aside+article { padding-left: 1em; }
    #slides, #slides img{ height: 400px; }
    #sidebar .disp-flex > li{ width: 100%; }
    body #header .login_button { width: 13em; }
}

@media screen and (min-width: 1036px){
    body .size{ width: 1024px !important; }
}

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

p.button:hover,
form .button:hover,
html body input[type="submit"]:hover, html body input[type="button"]:hover{
    cursor: pointer;
}

#system_option{
    display: block;
    padding: 0 .25rem;
    background: #262626;
    color: #fff;
}

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

body #area_kifukingaku h4{ background: #000 !important; }
#area_kifukingaku{
    width: 100%;
    background: rgba( 0,0,0,0.5 );
    color: #fff;
}
#area_kifukingaku dl.table{ font-size: .9em; }
#area_kifukingaku dl.table dt{ width: 18em; }
#area_kifukingaku dl.table dd{ text-align:right; }

/* C001 -------------------------------------------------------------------- */
body .before_konnendo,
body .before_ruikei{
    display: inline-block;
    position: relative;
    height: auto;
}
.before_konnendo:before{
    position: absolute;
    display: block;
    content: '今年度：';
    left: 1em;
}
.before_ruikei:before{
    position: absolute;
    display: block;
    content: '累計：';
    left: 2em;
}
/* ------------------------------------------------------------------------- */

@media screen and (min-width: 641px) and (max-width: 960px){
    #flex-mypage{ margin-top: 20px; }
}

@media screen and (max-width: 960px) {
    #flex-mypage{ padding: 0 !important; }
    #flex-mypage > li{ margin-top: 1px; padding: .5rem; }
    
    body #area_kifukingaku dl.table{ padding: 0 !important; }
    body #area_kifukingaku dl.table > .row > *{ margin: 0 !important; }
    body #area_kifukingaku dl.table > .row > dd{ background: rgba(255,255,255,0.2); }
    #area_kifukingaku dl.table > .row > *{ padding: .25rem .5rem !important; }
}

@media screen and (min-width: 961px){
    #flex-mypage > li{ margin-top: 1rem; }
    
    #area_kifukingaku dl.table > .row+.row{ border-top: 1px solid rgba(255,255,255,0.5); }
    body #area_kifukingaku dl.table > .row > *+*{ border-left: 1px solid rgba(255,255,255,0.5); }
    body #area_kifukingaku dl.table > .row > dd{ background: rgba(255,255,255,0.2); }
    #area_kifukingaku dl.table > .row > *{ padding: .5rem !important; }
}