@charset "utf-8";


/*リセットCSS（sanitize.css）の読み込み
---------------------------------------------------------------------------------------------*/
@import url("https://unpkg.com/sanitize.css");

/*Font Awesomeの読み込み
---------------------------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css");


/* 全体の設定 
---------------------------------------------------------------------------------------------*/
html,body {
    margin: 0; padding: 0;
    font-size: 16px;    /*基準となるフォントサイズの上書き*/
}
/*-- 画面幅900px以下の追加指定 -------------------------------------*/
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    html, body {
        font-size: 14px;    /*基準となるフォントサイズ */
    }
}

body {
    font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;    /*フォント種類*/
    -webkit-text-size-adjust: none;
    background: #daf7f0;    /*背景色*/
    color: #000000;        /*全体の文字色*/
    line-height: 180%;        /*行間*/
    overflow-x: hidden;
}

/*リセット*/
figure {margin: 0;}
dd {margin: 0;}
nav {margin: 0; padding: 0;}

/*table全般の設定*/
table {border-collapse: collapse;}

/*画像全般の設定*/
img {border: none; max-width: 100%; height: auto; vertical-align: middle;}

/*iframeタグ*/
iframe {width: 100%;}

/*ul,olタグ*/
ul, ol {margin-bottom: 30px;}


/*リンクテキスト全般の設定
---------------------------------------------------------------------------------------------*/
a {
    color: #0000ff;    /*文字色*/
    transition: 0.3s;
    word-break: break-all;
}
a:hover {
    color: #ff3399;
}
a:active  { color: #0000ff; }
a:visited { color: #0000ff; }


/*その他
---------------------------------------------------------------------------------------------*/
.clearfix::after {content: "";display: block;clear: both;}
.fontS {font-size: 90%; line-height: 130%;}
.fontMM {font-size: 1.4em; line-height: 160%;}




/* PC/SP
---------------------------------------------------------------------------------------------*/
.pcBox{
    display: block;
    margin: 0px; padding: 0px;
}
.spBox{
    display: none;
}
.pc_br{
    display: inline-block;
}
.sp_br{
    display: none;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    .pcBox{
        display: none;
    }
    .spBox{
        display: block;
        margin: 0px; padding: 0px;
    }
    .pc_br{
        display: none;
    }
    .sp_br{
        display: inline-block;
    }
}


/* containerブロック ---------------------------------------------------------*/
#container {
    margin: 0 auto;
    width: 90%;
    max-width: 1400px;    /*最大幅。これ以上広がらない。*/
    background: #ffffff;
}
@media screen and (max-width:840px) {
    /* 画面幅800px未満の追加指定 */
    #container {
        margin: 0px;
        width: 100%;
        background: #ffffff;
    }
}

/* header（ロゴなどが入った最上段のブロック）
---------------------------------------------------------------------------------------------*/
header {
    margin: 0px; padding: 0px;
    position: flex;
    border-bottom: 5px solid;
    border-image: linear-gradient(to right, #1e458d, #96a8ca, #1e458d) 1;
    background-color: #ffffff;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    header {
        position: fixed !important;  /* ヘッダーを固定 */
        top: 0px; left: 0px;
        margin: 0px; padding: 0px;
        width: 100%; 
        z-index: 100; 
    }
}
/* flex子要素 */
#headL {
    margin: 0px; padding: 0px;
    flex-basis: 50%; /* width と同じ */
}
#headR {
    margin: 0px; padding: 0px;
    flex-basis: 50%; /* width と同じ */
}
@media screen and (max-width:800px) {
    #headL {
        margin: 0px; 
        padding: 0px 0px 0px 0px;
        flex-basis: 100%;
        height: 70px;
    }
    #headR {
        display: none;
    }
}

/* タイトルロゴ画像 */
#headL h1{
    margin: 0px 0px 0px 0px; 
    padding: 30px 0px 0px 130px; 
    background-image: url('../image/logo.jpg');
    background-size: contain;
    height: 80px;
    font-size: 260%; 
    color: #000000;
}
@media screen and (max-width:800px) {
    #headL h1{
        margin: 0px 0px 0px 0px; 
        padding: 25px 0px 0px 110px; 
        height: 70px;
        font-size: 160%; 
    }
}

#head_tel{
    padding: 10px 20px 0px 50px; 
    text-align: right;
    font-size: 180%;
}
#head_txt{
    padding: 10px 20px 0px 0px; 
    text-align: right;
    font-size: 100%;
}


/* ▼▼ スマホ用ハンバーガーメニュー ▼▼
---------------------------------------------------------------------------------------------*/
#menu_btn{ 
    display: none; 
}
@media screen and (max-width:800px) {
    #menu_btn{ 
        display: block;
        position: fixed;
        top: 15px; right: 10px;
        min-width: 40px; 
        z-index: 200; 
    }
    /* ハンバーガーメニュー */
    #nav-drawer {
        position: relative;
    }
    /*チェックボックス等は非表示に*/
    .nav-unshown {
        display: none;
    }
    /*アイコンのスペース*/
    #nav-open {
        display: inline-block; 
        margin: 0px 0px 0px 0px; padding: 5px 5px 5px 5px;
        width: 40px; height: 35px; 
        vertical-align: middle;
        background-color:rgba(255, 255, 255, 0.5);    /* 透過の設定 */
        z-index: 100;
    }
    /*ハンバーガーアイコンをCSSだけで表現*/
    #nav-open span, #nav-open span:before, #nav-open span:after {
        position: absolute; display: block;
        height: 3px; /*線の太さ*/
        width: 27px; /*長さ*/
        border-radius: 3px; background: #042f87;
        content: ''; cursor: pointer;
    }
    #nav-open span:before {
        bottom: -10px;
    }
    #nav-open span:after {
        bottom: -20px;
    }
    /*閉じる用の薄黒カバー*/
    #nav-close {
        display: none; /*はじめは隠しておく*/
        position: fixed; z-index: 101;
        top: 0; /*全体に広がるように*/
        left: 0; width: 100%; height: 100%;
        background: black; opacity: 0;
        transition: .3s ease-in-out;
    }
    /*中身*/
    #nav-content {
        overflow: auto; position: 
        fixed; top: 0; left: 0;
        z-index: 99999;     /* 最前面に */
        width: 90%;        /* 右側に隙間を作る（閉じるカバーを表示） */
        max-width: 330px;  /* 最大幅（調整してください） */
        height: 100%;
        background: #c4d4f4;  /* 背景色 */
        transition: .3s ease-in-out;    /* 滑らかに表示 */
        -webkit-transform: translateX(-105%);
        transform: translateX(-105%);   /* 左に隠しておく */ 
    }
    /*チェックが入ったらもろもろ表示*/
    #nav-input:checked ~ #nav-close {
        display: block; /*カバーを表示*/
        opacity: .5;
    }
    
    #nav-input:checked ~ #nav-content {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);  /*中身を表示（右へスライド）*/
        box-shadow: 6px 0 25px rgba(0,0,0,.15);
    }
    
    ul#spmenu{
        list-style: none; width: 100%; margin-top: 20px; 
    }
    ul#spmenu li{
        list-style: none; margin: 0px 0px 0px 0px; padding: 0px; 
        border-bottom: 2px solid #000000; 
    }
    ul#spmenu li a{ 
        display: block; margin: 0px; padding: 12px 0px 10px 15px; 
        background-color: #c4d4f4;
        color: #000000; text-decoration:none; 
        font-size: 22px; font-weight: bold;
    }
    ul#spmenu li a:hover{ 
        background-color: #b3f4d2;
    }
    ul#spmenu li a.current{ 
        display: block; margin: 0px; padding: 12px 0px 10px 15px;
        background-color: #042f87;
        color: #ffffff; text-decoration:none; 
        font-size: 22px; font-weight: bold;
    }
    ul#spmenu li a:hover.current{ 
        background-color: #042f87;
    }
    
    .spheadtxt{
        margin: 0px; padding: 0px 15px 10px 20px; 
        color: #000000;
        font-size: 16px; line-height: 180%;
    }
}
/* ▲▲ スマホ用ハンバーガーメニュー ▲▲
---------------------------------------------------------------------------------------------*/


/* nav (header 下のメニュー) 
---------------------------------------------------------------------------------------------*/
#header-menu {
    margin: 5px 0px 10px 0px; 
    padding: 0px;
    position: -webkit-sticky;
    position: sticky;
    top: 0; 
    z-index: 100;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    #header-menu{
        display: none;
    }
}

#header-menu ul {
    margin: 0px; padding: 0px;
    display: flex;    /*flexボックスを使う指定*/
    justify-content: space-between;    /*並びかたの種類の指定*/
    list-style-type: none;
    width: 100%;
}
#header-menu ul li{
    margin: 0; padding: 0;
    width: -webkit-calc( 100% / 5 ) ;
    width: calc( 100% / 5 ) ;
    border-right: 1px solid #ffffff; 
}
#header-menu ul li a {
    display: block;
    background: #305496; color: #ffffff;
    text-decoration: none;
    font-size: 16px; font-weight :bold;
    line-height: 50px; text-align: center;
    font-family: 'Lato',sans-serif;
}
#header-menu ul li a:hover {
    background: #83a4f3;
}

#header-menu ul li a.current {
    background: #83a4f3;
}

/*フッターメニュー設定
---------------------------------------------------------------------------------------------*/
footer {
    padding: 10px 40px 10px 40px;
    font-size: 1.0em;        /*文字サイズ*/
    background: #9ad8ea;    /*背景色*/
    color: #000000;            /*文字色*/
}
footer .foot_copy {
    text-align: right;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    footer .foot_copy {
        text-align: center;
    }
}

/* mainブロック設定 
---------------------------------------------------------------------------------------------*/
section {
    margin: 0px;
    padding: 0px 0px 20px 0px;
}

.main_top {
    margin: 0px;
    padding: 10px 30px 20px 30px;
    background: #ffffff;
    width : 100%;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    .main_top {
        margin: 0px 0px 0px 0px;
        padding: 0px 10px 20px 10px;
        background: #ffffff;
        width : 100%;
    }
}

.main_page {
    margin: 0px;
    padding: 10px 30px 20px 30px;
    background: #ffffff;
    width : 100%;
}
@media screen and (max-width:800px) {
    /* 画面幅800px未満の追加指定 */
    .main_page {
        margin: 0px 0px 0px 0px;
        padding: 80px 10px 20px 10px;
        background: #ffffff;
        width : 100%;
    }
}


/* Flexboxの設定
---------------------------------------------------------------------------------------------*/
/* 親要素 */
.flexBox_main {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around; /* 両端の子要素も含め、均等に間隔 */
    align-content: stretch; /* 複数行にした時の揃え */
}

.flexBox_base {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around; /* 両端の子要素も含め、均等に間隔 */
    margin: 0px 20px 0px 20px; 
    padding: 0px;
}

.flexBox_nowrap {
    display: flex;
    flex-flow: row nowrap;
}


.flexBox_nowrap_mem {
    display: flex;
    flex-flow: row nowrap;
    margin: 0px 20px 0px 70px; 
    justify-content: space-around; /* 両端の子要素も含め、均等に間隔 */
}
@media screen and (max-width:800px) {
    .flexBox_nowrap_mem {
        display: flex;
        flex-flow: row nowrap;
        margin: 0px 10px 0px 10px; 
        justify-content: space-around; /* 両端の子要素も含め、均等に間隔 */
    }
}

/* 子要素 */
.flex_item_half {
    margin: 0px; padding: 0px;
    flex-basis: 49%; /* width と同じ */
}
.flex_item_three {
    flex-basis: 33%;
}
.flex_item_90 {
    margin: 0px; padding: 0px;
    flex-basis: 90%;
}
.flex_item_70 {
    margin: 0px; padding: 0px;
    flex-basis: 70%;
}
.flex_item_20 {
    margin: 0px; padding: 0px;
    flex-basis: 20%;
}
.flex_item_60 {
    margin: 0px; padding: 0px;
    flex-basis: 60%;
}
.flex_item_40 {
    margin: 0px; padding: 0px;
    flex-basis: 40%;
}
.flex_item_30 {
    margin: 0px; padding: 0px;
    flex-basis: 30%;
}
.flex_item_formA{
    margin: 0px; padding: 0px;
    flex-basis: 110px;
}
.flex_item_formB{
    margin: 0px; padding: 0px;
    flex-basis: calc( 100% - 110px ) ;
}

.flex_item_pxL {
    margin: 0px; padding: 0px;
    flex-basis: 30px;
}

.flex_item_pxR {
    margin: 0px; padding: 0px;
    flex-basis: calc( 100% - 35px ) ;
}

@media screen and (max-width:700px) {
    .flex_item_half {
        margin: 0px; padding: 0px;
        flex-basis: 90%;
    }
    .flex_item_60 {
        margin: 0px 0px 10px 0px; 
        padding: 0px;
        flex-basis: 90%;
    }
    .flex_item_40 {
        margin: 0px; padding: 0px;
        flex-basis: 90%;
    }
    .flex_item_30 {
        margin: 0px; padding: 0px;
        flex-basis: 50%;
    }
}

/* TOP サービスflex枠*/
.flex_service{
    display: flex;
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
    border: 1px solid #000000;
    width: 49%;
}
.flex_service_img {
    margin: 0px; padding: 0px;
    flex-basis: 40%;
}
.flex_service_txt {
    margin: 0px; 
    padding: 10px;
    flex-basis: 58%;
}
.flex_service_txt h4{
    margin: 0px; 
    padding: 0px 0px 10px 0px;
    color: #a46501;
}
.flex_service_txt p{
    margin: 0px; 
    padding: 0px 0px 0px 0px;
}
@media screen and (max-width:640px) {
    .flex_service{
        display: flex;
        flex-wrap: nowrap;
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 0px 0px;
        border: 1px solid #000000;
        width: 98%;
    }
    .flex_service_img {
        margin: 0px; padding: 0px;
        flex-basis: 40%;
    }
    .flex_service_txt {
        margin: 0px; 
        padding: 5px;
        flex-basis: 58%;
    }
    .flex_service_txt h4{
        margin: 0px; 
        padding: 0px 0px 5px 0px;
        color: #a46501;
    }
    .flex_service_txt p{
        margin: 0px; 
        padding: 0px 0px 0px 0px;
    }

}


/* 見出しの設定
---------------------------------------------------------------------------------------------*/
/* TOPの上線の見出し用 */
.balloon{
    position: relative;
    background: #042f87;
    padding: 5px;
}
.balloon:after{
    content: "";
    position: absolute;
    right: 0;
    bottom: -20px;
    left: 0;
    width: 0px; height: 0px;
    margin: auto;
    border-style: solid;
    border-color: #042f87 transparent transparent transparent;
    border-width: 20px 20px 0 20px;
}
h2.topline{
    margin: 25px 0px 25px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    font-size: 180%; color: #042f87;
}
@media screen and (max-width:800px) {
    h2.topline{
        margin: 25px 0px 25px 0px;
        padding: 0px 0px 0px 0px;
        text-align: center;
        font-size: 160%; color: #042f87;
    }
}

h3.type1{
    margin: 30px;
    padding: 0.7em 1.5em;
    border: 1px solid #333;
    position: relative;
    color: #333;
}
h3.type1::before,
h3.type1::after {
    content: "";
    display: block;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 1px solid #333;
    box-sizing: border-box;
}
h3.type1::before {
    left: -8px;
    top: -8px;
}
h3.type1::after {
    right: -8px;
    bottom: -8px;
}
@media screen and (max-width:800px) {
    h3.type1{
        margin: 30px 20px 30px 20px;
        padding: 0.7em 1.5em;
        border: 1px solid #333;
        position: relative;
        color: #333;
    }
}

h3.type2 {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 40px;
    font-size: 140%;
    font-weight: bold;
    color: #042f87;
    background: url(../image/title_point.png) no-repeat 0px 4px;
}

h4.type3 {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 120%;
    color: #042f87;
}

h4.type4 {
    margin: 0px 20px 10px 20px;
    padding: 0px 0px 0px 0px;
    font-size: 120%;
    color: #042f87;
    border-bottom: solid 1px #042f87;
}

/* 各BOX 設定
---------------------------------------------------------------------------------------------*/
/* TOP　イメージ画像表示枠 */
#top_img {
    margin: 0px 0px 20px 0px;
    padding: 0px;
    width: 100%;
}
@media screen and (max-width:800px) {
    #top_img {
        margin: 0px 0px 20px 0px;
        padding: 80px 0px 0px 0px;
        width: 100%;
    }
}
/* TOP　お知らせ表示枠 */
#box_news {
    margin: 0px 0px 10px 0px;
    padding: 0px 20px 10px 20px;
    text-align: left;
}
#box_news h2{
    position: relative; 
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 10px;
    font-size: 1.4em; line-height: 120%;
    text-align: left; color: #305496; 
    border-bottom: #305496 solid 2px;
}
.newsBox{
    margin: 0px 10px 10px 10px;
    padding: 0px 10px 0px 10px;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    font-size: 16px;
    line-height: 160%;
}
.itemData{
    padding: 0px 0px 0px 0px;
    width: 150px;
}
.itemData::before{
    content: "・";
}
.itemTxt{
    padding: 0px 0px 0px 0px;
    width: calc( 100% - 160px ) ;
}
@media screen and (max-width:800px) {
    #box_news {
        margin: 0px 0px 15px 0px;
        padding: 0px 10px 0px 10px;
    }
    .newsBox{
        margin: 0px 10px 15px 10px;
        padding: 0px 0px 0px 0px;
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-start;
        font-size: 16px;
        line-height: 160%;
    }
    .itemData{
        padding: 0px 0px 5px 0px;
        flex-basis: 120px;
    }
    .itemTxt{
        padding: 0px 0px 5px 0px;
        flex-basis: calc( 100% - 130px ) ;
    }
}

/* 共通Box枠 */
.base_box {
    margin: 0px auto 30px auto;
    padding: 0px;
    width: 90%;
}
.margin_box {
    margin: 0px 0px 20px 0px;
    padding: 0px;
}
.other_box {
    margin: 100px 0px 0px 0px;
    padding: 0px 0px 20px 0pxx;
    height: 400px;
    text-align: center;
    font-size: 180%;
}
.line_box {
    margin: 0px 0px 20px 0px;
    padding: 10px;
    border: #000000 1px solid;
}
.error_box {
    margin: 0px auto 10px auto;
    padding: 0px;
    width: 90%;
    text-align: center;
    color: #ff0000;
}
.login_box {
    margin: 20px auto 20px auto;
    padding: 0px 0px 20px 0px;
    width: 80%;
    height: 480px;
}
.login_error {
    padding: 0px 0px 10px 0px;
    text-align: center;
    color: #ff0000;
    height: 80px;
}
@media screen and (max-width:800px) {
    .login_box {
        margin: 20px auto 20px auto;
        padding: 0px 0x 20px 0px;
        width: 90%;
        height: 550px;
    }
    .login_error {
        padding: 0px 0px 10px 0px;
        text-align: center;
        color: #ff0000;
        height: 80px;
    }
}

/* テキストBox枠 */
.text_box {
    margin: 0 auto 10px auto;
    padding: 5px 5x 10px 5px;
    width: 95%;
    font-size: 100%;
}

.text_height {
    margin: 0 auto 0 auto;
    padding: 5px 5x 10px 5px;
    width: 95%;
    height: 450px;
    font-size: 100%;
}

/* 画像表示枠 */
.img_box {
    margin: 0 auto 0 auto;
    padding: 0px 0px 10px 0px;
    width: 90%;
    text-align: center;
}

/* 地図表示Box枠 */
.GmapBox {
    margin: 0 auto 0 auto;
    padding: 0px 0px 10px 0px;
    width: 90%;
}
.GmapBox iframe {
    width: 100%; height: 450px;
}
@media screen and (max-width:800px) {
    .GmapBox {
        margin: 0 auto 0 auto;
        padding: 0px 0px 10px 0px;
        width: 98%;
    }
}

/* TOP 下部メニュー用 ui
---------------------------------------------------------------------------------------------*/
ul#foot_menu  {
    margin: 0px; padding: 0px;
    display: flex;
    justify-content: space-between;    /*並びかたの種類の指定*/
    list-style-type: none;
    width: 100%;
}
ul#foot_menu li{
    margin: 0; padding: 0;
    width: -webkit-calc( 100% / 4 ) ;
    width: calc( 100% / 4 ) ;
    border-right: 1px solid #ffffff; 
}
ul#foot_menu li a {
    display: block;
    padding: 10px 0px 10px 0px;
    text-decoration: none;
    font-size: 16px; font-weight :bold;
    color: #000000; text-align: center;
    line-height: 130%; 
    font-family: 'Lato',sans-serif;
    border: #000000 1px solid;
    width: 90%;
}
ul#foot_menu li a:hover {
    background: #83a4f3;
}
@media screen and (max-width:800px) {
    ul#foot_menu li a {
        display: block;
        padding: 10px 0px 10px 0px;
        text-decoration: none;
        font-size: 16px; font-weight :bold;
        color: #000000; text-align: center;
        line-height: 130%; 
        font-family: 'Lato',sans-serif;
        border: #000000 1px solid;
        width: 97%;
    }

}

/* list */
ul.listA{
    margin: 0px; padding: 0px;
    justify-content: space-between;    /*並びかたの種類の指定*/
    list-style-type: "＊";
    width: 100%;
}

ul.listB{
    margin: 0px 0px 0px 20px;
    padding: 0px 0px 0px 0px;
    justify-content: space-between;    /*並びかたの種類の指定*/
    list-style-type: "➡";
}

ol.listC{
    margin: 0px 0px 0px 30px;
    padding: 0px 0px 0px 0px;
    justify-content: space-between;    /*並びかたの種類の指定*/
    width: 100%;
    list-style-type: decimal;
    list-style-position: outside;
}

/* table 設定
---------------------------------------------------------------------------------------------*/
table.timetbl {
    margin: 0px 0px 0px 0px; 
    border-collapse: collapse; 
    border: 1px solid #808080; background-color: #ffffff; 
    width: 100%;
}
table.timetbl th.w1 {
    padding: 2px 0px 2px 5px; 
    text-align: center; vertical-align: middle; 
    border: 1px solid #808080;
    font-weight: bold; background-color: #efece5; 
    width: 20%;
}
table.timetbl th.w2 {
    padding: 2px 0px 2px 5px; 
    text-align: center; vertical-align: middle; 
    border: 1px solid #808080;
    font-weight: bold; background-color: #efece5; 
    width: 10%;
}
table.timetbl th.w2sat {
    padding: 2px 0px 2px 5px; 
    text-align: center; vertical-align: middle; 
    border: 1px solid #808080;
    font-weight: bold; background-color: #efece5; 
    width: 10%;
    color: #1e90ff;
}
table.timetbl th.w2sun {
    padding: 2px 0px 2px 5px; 
    text-align: center; vertical-align: middle; 
    border: 1px solid #808080;
    font-weight: bold; background-color: #efece5; 
    width: 10%;
    color: #ff0000;
}
table.timetbl td.title{
    padding: 2px 0px 2px 5px; text-align: center; 
    vertical-align: middle; 
    border: 1px solid #808080; 
    background-color: #efece5;
}
table.timetbl td.base{
    padding: 2px 0px 2px 5px; text-align: center; 
    vertical-align: middle; 
    border: 1px solid #808080; 
}
table.timetbl td.sat{
    padding: 2px 0px 2px 5px; text-align: center; 
    vertical-align: middle; 
    border: 1px solid #808080; 
    color: #1e90ff;
}
table.timetbl td.sun{
    padding: 2px 0px 2px 5px; text-align: center; 
    vertical-align: middle; 
    border: 1px solid #808080; 
    color: #ff0000;
}

table.noline {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 95%;
}
table.noline td.col2_type1_l{
    padding: 2px 5px 2px 5px; 
    text-align: right; vertical-align: top; 
    width: 80px;
    font-size: 1.2em;
}
table.noline td.col2_type1_r{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: calc(100% - 80px);
    font-size: 1.2em;
}
table.noline td.col2_type2_l{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: 80px;
    font-size: 1.0em;
}
table.noline td.col2_type2_r{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: calc(100% - 80px);
    font-size: 1.0em;
}
table.noline td.col2_type3_l{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: 100px;
    font-size: 1.0em;
}
table.noline td.col2_type3_r{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: calc(100% - 100px);
    font-size: 1.0em;
}
@media screen and (max-width:800px) {
    /* （SP用）画面幅800px未満の追加指定 */
    table.noline {
        margin: 0 auto 20px auto; border-collapse: collapse; 
        width: 95%;
    }
    table.noline td.col2_type1_l{
        padding: 2px 0px 2px 5px; 
        text-align: left; vertical-align: top; 
        width: 80px;
        font-size: 1.2em;
    }
    table.noline td.col2_type1_r{
        padding: 2px 0px 2px 5px; 
        text-align: left; vertical-align: top; 
        width: calc(100% - 80px);
        font-size: 1.2em;
    }
}


table.noline_campain {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 95%;
}
table.noline_campain td.col2_type1_l{
    padding: 2px 5px 2px 5px; 
    text-align: right; vertical-align: top; 
    width: 150px;
    font-size: 1.0em;
}
table.noline_campain td.col2_type1_r{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: calc(100% - 150px);
    font-size: 1.0em;
}

table.noline_campain2 {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 70%;
}
table.noline_campain2 td{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: 50%;
    font-size: 1.0em;
}


table.linetbl {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 95%;
    border-top: #000000 1px solid;
}
table.linetbl td.w1{
    padding: 3px 10px 3px 10px; 
    text-align: left; vertical-align: top; 
    border-bottom: #000000 1px solid;
    width: 210px;
}
table.linetbl td.w2{
    padding: 3px 10px 3px 10px; 
    text-align: left; vertical-align: top; 
    border-bottom: #000000 1px solid;
    width: calc(100% - 210px);
}
@media screen and (max-width:800px) {
    table.linetbl td.w1{
        padding: 3px 10px 3px 10px; 
        text-align: left; vertical-align: top; 
        border-bottom: #000000 1px solid;
        width: 140px;
    }
    table.linetbl td.w2{
        padding: 3px 10px 3px 10px; 
        text-align: left; vertical-align: top; 
        border-bottom: #000000 1px solid;
        width: calc(100% - 140px);
    }
}

table.boxtbl {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 80%;
    border: #000000 1px solid;
}
table.boxtbl th{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: 50%;
    background: #bcd4f8;
    border: #000000 1px solid;
}
table.boxtbl td{
    padding: 2px 5px 2px 5px; 
    text-align: left; vertical-align: top; 
    width: 50%;
    border: #000000 1px solid;
}

table.formtbl {
    margin: 0 auto 20px auto; border-collapse: collapse; 
    width: 95%;
    border-top: #000000 1px solid;
}
table.formtbl th{
    padding: 5px 10px 5px 10px; 
    text-align: left; vertical-align: top; 
    border-bottom: #000000 1px solid;
    width: 210px;
    background: #bcd4f8;
}
table.formtbl td{
    padding: 5px 10px 5px 10px; 
    text-align: left; vertical-align: top; 
    border-bottom: #000000 1px solid;
    width: calc(100% - 210px);
}
@media screen and (max-width:640px) {
    table.formtbl {
        margin: 0 auto 20px auto; border-collapse: collapse; 
        width: 95%;
        border-top: #000000 1px solid;
    }
    table.formtbl th{
        display: block;
        width: 100%;
        padding: 5px 10px 5px 10px; 
        text-align: left; 
        background: #bcd4f8;
        border-bottom: none;
    }
    table.formtbl td{
        display: block;
        width: 100%;
        padding: 5px 10px 5px 10px; 
        text-align: left; 
        border-bottom: #000000 1px solid;
    }
}

table.logintbl{
    margin: 20px auto 30px auto; 
    border-collapse: collapse; 
    width: 560px; 
    font-size: 20px;
}
table.logintbl th{
    padding: 10px 0px 10px 0px; 
    text-align: right; vertical-align: middle; 
    font-weight: bold; 
}
table.logintbl td{
    padding: 10px 0px 10px 0px; 
    text-align: left; vertical-align: middle; 
}
table.logintbl td.btnBox{
    padding: 10px 0px 10px 0px; 
    text-align: center; vertical-align: middle; 
    height: 80px;
}
@media screen and (max-width:640px) {
    table.logintbl{
        margin: 0px auto 0px auto; 
        border-collapse: collapse; 
        width: 90%; 
        font-size: 20px;
    }
}

/* ===form設定　共通============ */
.txtzen{
    ime-mode: active;   /* 全角モード */
    width: 80%;
}
.txthan{
    ime-mode: inactive; /* 半角モード */
    width: 80%;
}
@media screen and (max-width:640px) {
    .txtzen{
        ime-mode: active;   /* 全角モード */
        width: 95%;
    }
    .txthan{
        ime-mode: inactive; /* 半角モード */
        width: 95%;
    }
}

.input_txt{
    padding: 3px; width: 200px;
    font: 18px sans-serif;
    box-sizing: border-box;
}
.btn_submit{
    padding: 5px 20px 5px 20px; 
    font: 18px sans-serif;
}




ul.formlist{
    margin: 0px; padding: 0px;
    display: flex;    /*flexボックスを使う指定*/
    flex-flow: row wrap;
    justify-content: flex-start;    /*並びかたの種類の指定*/
    list-style-type: none;
    width: 100%;
}
ul.formlist li{
    margin: 0; padding: 0;
    width: 250px;
}

span.required{
    padding: 0px 0px 0px 10px; 
    font-size: 80%;
    color: #ff0000;
}



.btnBox{
    margin: 0px; 
    padding: 30px 0px 30px 0px; 
    text-align: center;
}

/* ボタン */
.btn-submit{
    margin: 0px 10px 0px 10px;
    padding: 5px 0px 5px 0px; 
    width: 210px; height: 40px;
    border-radius:10px;
    background-color: #bcd4f8;
    border: #8c8d8d 1px solid;
}

/* ---- 会員ページ ------------------------------- */
/* ---- ↓↓　タブ切り替え ------ */
.tab-wrap {
    display: flex;
    flex-wrap: wrap;
    margin:20px 0;
}
.tab-wrap:after {
    content: '';
    width: 100%;
    height: 3px;
    background: DeepSkyBlue;
    display: block;
    order: -1;
}
.tab-label {
    color: White;
    background: LightGray;
    font-weight: bold;
    text-shadow: 0 -1px 0 rgba(0,0,0,.2);
    white-space: nowrap;
    text-align: center;
    padding: 10px .5em;
    order: -1;
    position: relative;
    z-index: 1;
    cursor: pointer;
    border-radius: 5px 5px 0 0;
    flex: 1;
}
.tab-label:not(:last-of-type) {
    margin-right: 5px;
}
.tab-content {
    width: 100%;
    height: 0;
    overflow: hidden;
    opacity: 0;
}
/* アクティブなタブ */
.tab-switch:checked+.tab-label {
    background: DeepSkyBlue;
}
.tab-switch:checked+.tab-label+.tab-content {
    height: auto;
    overflow: auto;
    padding: 15px;
    opacity: 1;
    transition: .5s opacity;
    box-shadow: 0 0 3px rgba(0,0,0,.2);
    min-height: 60vh;
}
/* ラジオボタン非表示 */
.tab-switch {
    display: none;
}
/* ---- ↑↑　タブ切り替え ------ */

.text_jyunbi {
    margin: 0px 0px 0px 0px;
    padding: 50px 0px 50px 0px; 
    font-size: 20px;
    text-align: center;
}

.memberNewsBox {
    margin: 10px 20px 10px 20px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
    line-height: 160%;
}
.memberNewsBox h3 {
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 20px;
    font-weight: bold;
}
.memberNewsBox ul li {
    margin: 0px 60px 15px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
}
@media screen and (max-width:800px) {
    .memberNewsBox {
        margin: 10px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 16px;
        line-height: 160%;
    }
    .memberNewsBox h3 {
        margin: 0px 0px 15px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 20px;
        font-weight: bold;
    }
    .memberNewsBox ul li {
        margin: 0px 60px 15px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 16px;
    }
}

h3.headingA {
    display: inline-block;
    position: relative;
    padding: .5em .7em;
    border-radius: 50px 0 0 50px;
    background-color: #2589d0;
    color: #fff;
}
h3.headingA::before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 13px;
    border-radius: 50%;
    background: #fff;
}
@media screen and (max-width:800px) {
    h3.headingA {
        display: inline-block;
        position: relative;
        padding: .5em .7em;
        border-radius: 50px 0 0 50px;
        background-color: #2589d0;
        color: #fff;
        font-size: 14px;
    }
}

.infoBox {
    margin: 10px 20px 10px 50px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
    line-height: 160%;
}
@media screen and (max-width:800px) {
    .infoBox {
        margin: 10px 20px 10px 10px;
        padding: 0px 0px 0px 0px;
        font-size: 16px;
        line-height: 160%;
    }
}