@charset "UTF-8";
/* ----------------------------------------------------------------------------------------------------
*  基本情報
* --------------------------------------------------------------------------------------------------*/
html,body {
    /* height: 100%; */
    counter-reset: number 0;
    scroll-behavior: smooth;
}

html.login ,.login body {
    height: 100%;
}

html {
    font-size: 62.5%;
    /* overflow-y: scroll; */
}

body,h1,h2,h3,h4,h5,h6,p,address,ul,ol,li,dl,dt,dd,table,th,td,img,form {
    margin: 0;
    padding: 0;
    border: none;
    line-height: 100%;
    list-style-type: none;
    font-style: normal;
    /*font-weight: 500;*/
    font-weight: normal;
    font-family:'Segoe UI', Meiryo,sans-serif;
    color: #222;
    font-size: 16px;
    font-size: 1.6rem;
    font-feature-settings: "palt";
}

body {
    /* min-width: 980px; */
    background: #FFF;
}

img {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
:root {
    --main-color: #0084c1;
    --sub-color: #169d7a;
    --accent-color: #e6002d;
}

.contents {
    height: 100%;
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-flow: column;}

header,main,footer {
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

a,
a:hover,
a:active,
a:focus {
    color: #222;
    text-decoration: none;
}

a , input[type=button] , button {
    -webkit-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out;
}

a:hover , input[type=button]:hover , button:hover {
    opacity: 0.5;
}

input[type="submit"],
input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
    display: none;
}

input[type="submit"]::focus,
input[type="button"]::focus {
    outline-offset: -2px;
}

.pc {
    display: block;
}
.sp {
    display: none !important;
}

/* 基本情報 */
.wrap {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* header --------------------------------------------*/
.shadow-hider {
    height: 123px; 
    position: fixed;
    z-index: 2;
    width: 100%;
    top: 0px;
    box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.3);
    background: rgb(255, 255, 255);
}
header {
    background: url("../images/item_wave_pc.svg") repeat-x #FFF;
    background-size: auto 58px;
    background-position:left 26vw top;
    position: -webkit-sticky; /* Safari対応 */
    position: sticky;
    top: 0;
    z-index: 5;
    align-self: flex-start;
}
header .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    gap: .5em;
}
header .header_main {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 4px;
    z-index: 5;
    padding-bottom: 5px;
}
header a {
    display: block;
}
header h1 {
    line-height: 1;
    display: flex;
    align-items: center;
    max-width: 205px;
    margin-top: 8px;
}
header h1 a ,
header h1 span,
header p.logo {
    height: 0;
    width: 100%;
    min-width: 205px;
    padding-top: 82px;
    overflow: hidden;
    background-image: url("../images/logo.svg") ;
    background-repeat: no-repeat;
    background-position: center bottom ;
    background-size: 100% auto ;
}
header p.title {
    color: #0093DF;
    background: #FFF;
    padding: 5px ;
    border-radius: 3px;
    text-align: center;
    width: 100%;
    max-width: 184px;
    box-sizing: border-box;
    border: 1px solid #0093DF;
    font-size: 12px;
    font-weight: bold;
}
/* header admin */
header.admin {
    background-image: url("../images/item_wave_g.svg");
}
header.admin p.title {
    color: #009d7a;
    border-color: #009d7a;
}

/* nav_set ---*/
.nav_set {
    padding-top: 20px;
    width: 100%;
}
.nav-unshown {
    display: none; 
}
.btn-trigger {
    display: none; 
}

/* nav ---*/
.nav {
    display: flex;
    justify-content: space-between;
    padding-top: 22px;
    max-width: 595px;
    width: 100%;
    gap: 1em;
    margin: 0 auto;
}
.nav li a {
    box-sizing: border-box;
    font-weight: bold;
    font-size: 1.5rem;
    white-space: nowrap;
    padding-bottom: 2px;
    display: flex;
    gap: 8px;
    align-items: center;
    font-feature-settings: "palt";
}
.nav li a:before {
    content: "";
    width: 40px;
    height: 40px;
    background: url("../images/icon_top.png") no-repeat center center #E8F7FF;
    border-radius: 20px;
    display: inline-block;
    border: 1px solid #0093DF;
    box-sizing: border-box;
}
.nav li.n02 a:before {
    background-image: url("../images/icon_login.png") ;
}
.nav li.n04 a:before {
    background-image: url("../images/icon_site.png") ;
}
/*.nav li a[target="_blank"] {
    padding-right: 1.2em;
    background: url("../images/icon_nw.svg") no-repeat right center;
}*/
.nav li.active a {
    color: var(--main-color);
}

/* nav_pc ---*/
.nav_pc {
    padding-top: 36px;
}
.nav_pc a ,
.nav li.n03 a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #FFF;
    background: #252525;
    min-width: 103px;
    height: 22px;
    border-radius: 22px;
    box-sizing: border-box;
    border: none;
}
.nav_pc a:before ,
.nav li.n03 a:before {
    content: "";
    width: 13px;
    height: 13px;
    background: url("../images/icon_logout.png") no-repeat center center;
    display: inline-block;
    margin-right: 3px;
}

/* nav_y ---*/
.nav_y {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
}
.nav_y p.img_gg {
    padding: 6px 0 0;
    max-width: 124px;
}
.nav_y p.img_gg img {
    width: 100%;
    max-width: 124px;
}
.nav_y p.img_yc {
    padding: 0 1.25em;
}
.nav_y p.img_yc a {
    display: inline-block;
    background: #FFF;
    padding: 8px 15px;
    border-radius: 0 0 5px 5px;
    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.12);
}
.nav_y p.img_yc a img {
    width: 100%;
    max-width: 156px;
}
/* main -------------------------------------- */
main {
    position: relative;
}
main::before {
    content: "";
    position: absolute;
    width: calc(100% + 30px);
    height: 10px;
    background: #ffffff;
    top: 0;
    left: -30px;
    z-index: 3;
}
/* footer -------------------------------------- */
footer {
    background: #e2f5ff;
    position: relative;
}
footer::before {
    content: "";
    display: block;
    width: 100%;
    height: 15px;
    position: absolute;
    left: 0;
    top: -15px;
    background: url("../images/item_wave_footer.svg") repeat-x ;
    background-size: auto 15px;
    background-position:left 26vw top;
}
footer .wrap {
    padding: 36px 20px;
    max-width: 920px;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    gap: 30px;
}
footer .wrap > div {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

footer h3 {
    display: flex;
    font-size: 1.4rem;
    font-size: 14px;
    font-weight: 700;
    width: 100%;
    max-width: 125px;
    background: #0093DF;
    color: #FFF;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    height: 24px;
}
footer h4 {
    font-size: 2.0rem;
    font-size: 20px;
    font-weight: 700;
    color: #0093DF;
}
footer ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}
footer ul.info_set {
    flex-flow: column;
    gap: 12px;
}
footer ul.info_set li {
    display: flex;
    gap: 8px;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
}
footer ul.info_set li p {
    width: 100%;
}
footer ul.btn_set li a {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    font-size: 16px;
    font-weight: bold;
    border: 1px solid #0093DF;
    border-radius: 2em;
    height: 36px;
    padding: 0 15px;
    box-sizing: border-box;
}
footer ul.btn_set li a:before {
    content: "";
    width: 20px;
    height: 20px;
    background: url("../images/icon_tel.png") no-repeat center center;
    display: inline-block;
    margin-right: 5px;
}
footer ul.btn_set li a.mail:before {
    background-image: url("../images/icon_mail.png") ;
}


footer h5 {
    font-weight: 700;
    padding-right: 8px;
    border-right: 1px solid #0093DF;
    min-width: 4em;
}

footer h5 ,
footer p ,
footer a ,
footer a:hover {
    line-height: 1.4;
    font-size: 1.4rem;
    font-size: 14px;
    color: #0093DF;
    text-decoration: none;
}
footer p small {
    font-size: 1.0rem;
    font-size: 10px;
    color: #0093DF;
}
footer .wrap > p {
    text-align: center;
}

/* gototop -------------------------------------- */
#gototop {
    position: fixed;
    width: 48px;
    right: 30px;
    bottom: 80px;
    z-index: 4;
}

#gototop a {
    display: block;
    border-radius: 5px;
    width: 48px;
    height: 0;
    padding-top: 48px;
    overflow: hidden;
    background-color: var(--main-color);;
    position: relative;
}

#gototop a::before {
    content: "";
    display: block;
    position: absolute;
    width: 14px;
    height: 14px !important;
    border-top: 3px solid #FFF;
    border-right: 3px solid #FFF;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 50%;
    top: 50%;
    margin: -4px 0 0 -8px;
    border-radius: 3px;
}

/* 基本情報　スマホ --------------*/
@media only screen and (max-width:886px){
    header,main,footer {
        width: 100%;
        padding: 0 3vw;
        box-sizing: border-box;
    }
    .pc {
        display: none !important;
    }
    .sp {
        display: block !important;
    }
    /* header --------------------------------------------*/
    .shadow-hider {
        height: 16.77vw;
    }
    header {
        padding: 0;
    }
    header .wrap {
        padding:2vw 0;
        align-items: center;
    }
    header h1 {
        height: auto;
        margin-top: 0;
    }
    header h1 a ,
    header h1 span {
        width: 31.94vw;
        min-width: inherit;
        max-width: 205px;
        padding-top: 12.77vw;
        background-position: center center;
    }

    header .header_main {
        gap: 3vw;
        flex-flow: row;
        padding: 0;
    }
    header .header_main::after {
        content: "";
        width: 100%;
        height: 16.77vw;
        position: absolute;
        top: 0;
        left: 0;
        background: url("../images/item_wave_pc.svg") repeat-x #FFF;
        z-index: -1;
        background-size: auto 8vw;
    }
    header.admin .header_main::after {
        background-image: url("../images/item_wave_g.svg");
        background-size: auto 8vw;
    }
    header p.title {
        margin-top: 1vw;
        padding: .3em 1.2em;
        font-size: 15px;
    }
    header p.title span {
        display: block;
    }
    /* nav_pc ---*/
    .nav_pc {
        display: none;
    }


    /* nav_y ---*/
    .nav_y.sp {
        position: relative;
    }
    .nav_y p.img_gg {
        max-width: 186px;
        text-align: center;
    }
    .nav_y p.img_gg img {
        margin: 0 auto;
    }
    .nav_y p.img_yc {
        padding: 0;
    }
    .nav_y p.img_yc a {
        display: inline-block;
        background: #FFF;
        padding: 8px 15px;
        border-radius: 0 0 5px 5px;
        box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.12);
    }
    header .nav_set_a p.logo {
        max-width: 72vw;
        padding-top: 29.25vw;
    }
    header .nav_set_a p.title {
        max-width: 64.69vw;
        font-size: 15px;
    }
    header p.title.sp span {
        display: inline;
    }
    

    /* ハンバーガーボタンの見た目 */
    .btn-trigger {
        display: block;
        position: absolute;
        width: 54px;
        height: 54px;
        cursor: pointer;
        z-index: 101;
        background: #FFF;
        border: 2px solid var(--main-color);
        border-radius: 60px;
        top: 3vw;
        right: 3vw;
    }

    .btn-trigger span {
        position: absolute;
        left: 14px;
        top: 15px;
        width: 50%;
        height: 2px;
        background-color: var(--main-color);
        border-radius: 4px;
        transition: all 0.3s;
    }

    .btn-trigger span:nth-of-type(1) { top: 15px; }
    .btn-trigger span:nth-of-type(2) { top: 25px; }
    .btn-trigger span:nth-of-type(3) { top: 36px; }


    /* メニュー本体（初期状態は右に隠す） */
    .nav_set {
        position: fixed;
        right: 0;
        width: 100%;
        height: 100vh;
        background-color: var(--main-color);
        transition: all 0.4s;
        top: -100vh;
        margin: 0;
        border-top: 1px solid #cacaca;
        box-sizing: border-box;
        z-index: 90;
        padding: 0 3vw 5vw;
        display: grid;
        gap: 1vw;
        grid-template-rows: 80px auto;
        }
    .nav_set_a {
        background: #FFF;
        border-radius: 20px;
        display: flex;
        flex-flow: column;
        height: 100%;
        align-items: center;
        padding: 4vw 8vw;
        box-sizing: border-box;
        overflow-y: auto;
        }
    .nav_set_a ul.nav {
        min-width: inherit;
        flex-flow: column;
        border: none;
        padding: 0;
        gap: 1em;
        margin-top: 8vw;
    }
    .nav li {
        display: block;
    }
    .nav li a,
    .nav li.close label {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: flex-start;
        padding: 1em 2em;
        font-size: 1.5rem;
        box-sizing: border-box;
        background-color: #E8F7FF;
        border-radius: 50px;
        color: #0093DF;
        border: 1px solid #0093DF;
        position: relative;
    }
    .nav li a[target="_blank"] {
        background-position: right 1.5em center;
        background-color: #E8F7FF;
    }
    .nav li a .sp span {
        font-size: 1.2rem;
        padding-bottom: 5px;
    }
    .nav li.logout ,
    .nav li.close {
        border: none;
        margin: 30px 1em 0;
    }
    .nav li.logout a ,
    .nav li.close a ,
    .nav li.close label {
        position: relative;
        background: #e5ecf4;
        padding-left: 40px;
        border-radius: 4px;
        justify-content: center;
        padding: 1.5em 2em;
        cursor: pointer;
    }
    .nav li.close label {
        background: var(--main-color);;
        color: #FFF;
        font-weight: normal;
    }
    .nav li.logout a {
        font-weight: normal;
        height: 3em;
        padding: 0 2em;
        font-size: 1.6rem;
    }
    .nav li.logout a:before {
        content: "";
        display: block;
        width: 21px;
        height: 20px;
        margin-right: 15px;
        background: url("../images/icon_logout.png") no-repeat center center;
        background-size: 100% auto;
        font-weight: normal;
    }
    .nav li.close label:before {
        content: "";
        display: block;
        width: 1em;
        height: 1em;
        margin-right: 16px;
        background: url("../images/icon_close.png") no-repeat center center;
        background-size: 100% auto;
    }
    .nav li a:before {
        width: 24px;
        height: 24px;
        background-size: 100% auto;
        border: none;
        border-radius: 0;
    }
    .nav li a:after {
        content: "";
        width: 1em;
        height: 1em;
        border-radius: 1em;
        background: url("../images/icon_arrow.png") no-repeat left 5.5px center #0093DF;
        position: absolute;
        right: 1.5em;
        top: 50%;
        margin-top: -.5em;
    }
    .nav li.n03 a {
        max-width: 47.6vw;
        height: 30px;
        border-radius: 30px;
        margin: 5vw auto 0;
    }
    .nav li.n03 a::after {
        content: none;
    }

      /* チェックが入ったらメニューをスライドイン */
    #nav-input:checked ~ .nav_set {
        top: 0;
    }

    /* チェックが入ったら三本線を「×」にする */
    #nav-input:checked ~ .btn-trigger span:nth-of-type(1) {
        transform: translateY(11px) rotate(45deg);
    }
    #nav-input:checked ~ .btn-trigger span:nth-of-type(2) {
        opacity: 0;
    }
    #nav-input:checked ~ .btn-trigger span:nth-of-type(3) {
        transform: translateY(-11px) rotate(-45deg);
    }

    /* 背景固定（メニューが開いている間はスクロールさせない工夫） */
    #nav-input:checked ~ body {
        overflow: hidden;
    }
  
    /* footer -------------------------------------- */
    footer {
        padding: 0;
    }
    footer::before {
        height: 8px;
        top: -8px;
        background-size: auto 8px;
    }
    footer .wrap {
    padding: 8vw 3vw 14vw;
    gap: 5vw;
}
    footer .wrap > div {
        gap: 1em;
    }

    footer h3 {
        font-size: 1.3rem;
        font-size: 13px;
        max-width: 118px;
        height: 24px;
    }
    footer h4 {
        font-size: 1.5rem;
        font-size: 15px;
        text-align: center;
        line-height: 1.4;
    }
    footer h4 span {
        display: block;
    }
    footer ul ,
    footer ul.info_set ,
    footer ul.info_set li {
        flex-flow: column;
        gap: 7px;
    }
    footer ul.info_set li {
        gap: 0;
    }
    footer ul.info_set li p {
        text-align: center;
    }
    footer ul.btn_set li {
        width: 100%;
    }
    footer ul.btn_set li a {
        font-size: 1.4rem;
        font-size: 14px;
        height: 29px;
    }
    footer ul.btn_set li a:before {
        width: 15px;
        height: 15px;
        background-size: 100% auto;
    }

    footer h5 {
        font-weight: 700;
        padding-right: 8px;
        border: none;
    }
    footer h5 ,
    footer p ,
    footer a ,
    footer a:hover {
        font-size: 1.2rem;
        font-size: 12px;
    }

    /* gototop -------------------------------------- */
    #gototop {
        right: 3vw;
        bottom: 125px;
    } 
}
@media only screen and (max-width:640px){
    header p.title {
        font-size: 3.3vw;
    }
}

/* ----------------------------------------------------------------------------------------------------
*  main 各ページ別 
* --------------------------------------------------------------------------------------------------*/

/* main全ページ共通 -------------------------------------- */
main {
    padding-top: 30px;
    padding-bottom: 60px;
    flex: 1;
}
main.main_sec {
    padding-top: 18px;
}
main section {
    width: 100%;
    display: flex;
    flex-flow: column;
    background: #FFF;
}

/* parts -------------*/
.main_area .cate { /*parts only*/
    display: inline-block;
    margin: 3em auto 0 0;
    padding: .5em 2em;
    background: #999;
    color: #FFF;
    position: relative;
}
.main_area .cate:first-of-type { /*parts only*/
    margin:0 auto 0 0;
}
.main_area .cate + div { /*parts only*/
    margin-top:42px;
}

/* h1, h2, h3, M-01, M-S-01, TXT-01  他共通 */
.main_area .h1 , 
.main_area .h2 , 
.main_area .h3 { 
    font-weight: 600;
    text-align: left;
    padding: 0.5em 1em;
    line-height: 1;
}
.main_area .h1 { 
    font-size: 2.6rem;
    color: #FFF;
    background: var(--main-color);
}
.main_area .h2 { 
    font-size: 2.4rem;
    border-left: 8px solid var(--main-color);
    padding: 0.5em;
}
.main_area .h3 {
    font-size: 2.0rem;
    padding: .5em 1em .5em .3em;
    border-bottom: 2px solid var(--main-color);
}
.main_area .m-01 {
    font-size: 1.8rem;
    font-weight: bold;
    padding: 0;
    color:var(--main-color);
}
.main_area .m-s-01 {
    text-align: center;
    border: none;
    color: #222;
    position: relative;
    padding-bottom: 1em;
    line-height: 1.2;
}
.main_area .m-s-01:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 0%);
    width: 30vw;
    max-width: 120px;
    background: #CCC;
    height: 5px;
    border-radius: 3px;
}

.main_area > * + .h1 ,
.main_area > * + .h2 ,
.main_area > * + .h3 ,
.main_area > * + .m-01 ,
.main_area > * + p ,
.main_area > * + ul ,
.main_area > * + ol,
.main_area > * + table ,
.main_area > * + div {
    margin-top: 28px;
    scroll-margin-top: 123px;
}

.main_area .red {
    color: #e6002d;
}
.main_area .black {
    color: #222;
}

.main_area .strong {
    font-weight: bold;
}

.main_area p ,
.main_area li {
    font-size: 1.6rem;
    line-height: 1.4;
    word-break: break-all;
}
.main_area p a ,
.main_area li a ,
.main_area table a {
    color: #4c79b7;
    text-decoration: underline;
    word-break: break-all;
}
.main_area .t_left {
    text-align: left;
}
.main_area .t_center {
    text-align: center;
}
.main_area .t_right {
    text-align: right;
}
.main_area ul.t_center li ,
.main_area ul.t_right li {
    display: inline-block;
}

/* main_area margin */
.main_area .mg_t20 { margin-top: 20px;}
.main_area .mg_t30 { margin-top: 30px;}
.main_area .mg_t40 { margin-top: 40px;}
.main_area .mg_t50 { margin-top: 50px;}
.main_area .mg_t60 { margin-top: 60px;}
.main_area .mg_t70 { margin-top: 70px;}
.main_area .mg_t80 { margin-top: 80px;}
.main_area .mg_t90 { margin-top: 90px;}
.main_area .mg_t100 { margin-top: 100px;}

.main_area .mg_b20 { margin-bottom: 20px;}
.main_area .mg_b30 { margin-bottom: 30px;}
.main_area .mg_b40 { margin-bottom: 40px;}
.main_area .mg_b50 { margin-bottom: 50px;}
.main_area .mg_b60 { margin-bottom: 60px;}
.main_area .mg_b70 { margin-bottom: 70px;}
.main_area .mg_b80 { margin-bottom: 80px;}
.main_area .mg_b90 { margin-bottom: 90px;}
.main_area .mg_b100 { margin-bottom: 100px;}

/* txt-02 , txt-03 , txt-04共通 */
.main_area .txt-02 li ,
.main_area .txt-03 li ,
.main_area .txt-04 li {
    padding-left: 1.3em;
    position: relative;
}
.main_area .txt-02 li + li ,
.main_area .txt-03 li + li ,
.main_area .txt-04 li + li {
    margin-top: .5em;
}
.main_area .txt-02 li:before ,
.main_area .txt-03 li:before ,
.main_area .txt-04 li:before {
    content: "";
    display: block;
    position: absolute;
    left: .5em;
    top: 0;
}


/* txt-02 */
.main_area .txt-02 li:before {
    width: 5px;
    height: 5px;
    background: #222;
    top: .72em;
    transform: translateY(-50%);
    border-radius: 3px;
}

/* txt-03 */
.main_area .txt-03 {
    counter-reset: my-counter;
}
.main_area .txt-03 li:before {
    content: counter(my-counter) ".";
    counter-increment: my-counter;
    left: .3em;
}

/* txt-04 */
.main_area .txt-04 li:before {
    content: "※";
    left: 0;
}

/* TXT-BLC-03 , TXT-BLC-04 */
.main_area .txt-blc-03 p ,
.main_area .txt-blc-04 p ,
.main_area .txt-blc-03 li ,
.main_area .txt-blc-04 li {
    font-size: 1.4rem;
}
.main_area .txt-blc-03 li + li ,
.main_area .txt-blc-04 li + li{
    margin-top: .3em;
}
.main_area .txt-blc-03 p + p ,
.main_area .txt-blc-04 p + p {
    margin-top: 1em;
}
.main_area * li.red:before {
    color: #e6002d;
    background: #e6002d;
}
.main_area p.big ,
.main_area li.big ,
.main_area strong.big ,
.main_area span.big {
    font-size: 1.8rem;
}

/* TXT-BLC-03 */
.main_area .txt-blc-03 {
    background: #ffdee4;
    border: 1px solid #ff869e;
    padding: 1.3em 1.5em;
}

/* TXT-BLC-04 */
.main_area .txt-blc-04 {
    background: #f1f1f1;
    border: 1px solid #cecece;
    padding: 1.3em 1.5em;
}

/* TXT-BLC-06 */
.main_area .txt-blc-06 {
    display: table;
    align-items: center;
}
.main_area .txt-blc-06 .title {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    max-width: 20%;
    background: #525252;
    color: #FFF;
    padding: 1.6em 1.8em;
    border: 1px solid #525252;
    font-size: 1.4rem;
    box-sizing: border-box;
}
.main_area .txt-blc-06 p.text {
    margin-top: 0;
    width: 100%;
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    background: #f1f1f1;
    border: 1px solid #cecece;
    font-size: 1.4rem;
    padding: 1.6em 1.8em;
    box-sizing: border-box;
}

/* txt-blc-07 */
.main_area .txt-blc-07 {
    background: #fff;
    border: 1px solid #cecece;
    padding: 1.3em 1.5em;
}
.main_area .txt-blc-07 iframe ,
.main_area iframe.txt-blc-07 {
    width: 100%;
}

/* btn-cv-01 */
.main_area .btn_box {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 1em;
    box-sizing: border-box;
}
.main_area .btn_box.left {
    justify-content: flex-start;
}
.main_area .btn_box.right {
    justify-content: flex-end;
}
.main_area .btn_box.gray {
    background: #f5f5f5;
    padding: 1em;
}
.main_area a.btn ,
.main_area button.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1em 1.5em;
    background: #dfdfdf;
    color: #222;
    text-decoration: none;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid #CCC;
}


/* btn_l */
.main_area .btn.btn_l {
    background: #00644f;
    border: none;
    border-bottom: solid 4px #013d30;
    color: #fff;
}
.main_area .btn.btn_l.gray {
    background: #8d8d8d;
    border-bottom: solid 4px #4b4b4b;
    color: #FFF;
}
.main_area .btn.btn_l.disable {
    border-bottom: solid 4px #bdbdbd;
}
.main_area .btn.btn_l:active {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}

 /* bnt_m */
.main_area .btn.btn_m {
    padding:1em 5em;
}
.main_area .btn.disable {
    background: #d4d4d4 !important;
    color: #bdbdbd !important;
    pointer-events: none;
}

 /* bnt_s */
.main_area .btn.btn_s {
    background: #f7f7f7;
    font-size: 1.4rem;
}

.main_area .btn.btn_moni {
    padding:1em 5em;
    min-width: 480px;
}


/* link-01 , link-03 */
.main_area .link-01 li ,
.main_area .link-03 li {
    padding-left: 1.3em;
    position: relative;
}
.main_area .link-01 li + li ,
.main_area .link-03 li + li {
    margin-top: .5em;
}
.main_area .link-01 li:before ,
.main_area .link-01 li:after ,
.main_area .link-03 li:before ,
.main_area .link-03 li:after {
    content: "";
    display: block;
    position: absolute;
}
/* link-01  */
.main_area .link-01 li:before {
    left: 0;
    top: .3em;
    width: .8em;
    height: .8em;
    background: var(--main-color);
    border-radius: 3px;
}
.main_area .link-01 li:after {
    top: .55em;
	left: 3px;
	width: 3px;
	height: 3px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
/* link-03  */
.main_area .link-03 li:before {
    width: 0.65em;
    height: 0.65em;
    border: 0.1em solid var(--main-color);
    border-top: 0;
    border-right: 0;
    transform: rotate(-45deg);
    transform-origin: bottom left;
    left: 0.8em;
    bottom: 0.2em;
    box-sizing: border-box;
}
.main_area .link-03 li:after {
    width: 0.1em;
    height: 1em;
    background: var(--main-color);
    left: 0.72em;
    bottom: 0.23em;
}

/* link-03.mypage-btn */
.main_area .link-03.mypage-btn {
    display: flex;
    gap: 2em;
    align-items: center;
    justify-content: center;
}
.main_area .link-03.mypage-btn li {
    padding-left: 0;
    width: 100%;
}
.main_area .link-03.mypage-btn li + li {
    margin-top: 0;
}
.main_area .link-03.mypage-btn li:before ,
.main_area .link-03.mypage-btn li:after {
    content: none;
}
.main_area .link-03.mypage-btn li a:before ,
.main_area .link-03.mypage-btn li a:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 50%;
}
.main_area .link-03.mypage-btn li a {
    display: block;
    font-size: 1.8rem;
    width: 100%;
    box-sizing: border-box;
    padding: 1.0em 1.0em 1.0em 2.0em;
    background: #E8F7FF;
    border: 1px solid #0093DF;
    border-radius: 5px;
    position: relative;
    text-decoration: none;
    text-align: left;
    font-weight: bold;
}
.main_area .link-03.mypage-btn li a span {
    font-size: 1.4rem;
    display: inline-block;
    padding-left: .5em;
}
.main_area .link-03.mypage-btn li a:after {
    width: 0.4em;
    height: 0.4em;
    border: 0.1em solid #FFF;
    border-top: 0;
    border-right: 0;
    transform: rotate(-45deg);
    transform-origin: bottom left;
    left: 1.31em;
    box-sizing: border-box;
    margin-bottom: -.2em;
}
.main_area .link-03.mypage-btn li a:before {
    width: 1em;
    height: 1em;
    background: #0093DF;
    border-radius: 1em;
    left: 0.8em;
    margin-bottom: -.5em;
}
.main_area .link-03.mypage-btn.login {
    justify-content: flex-start;
}
.main_area .link-03.mypage-btn.login li {
    width: auto;
}
.main_area .link-03.mypage-btn.login li a {
    font-size: 1.4rem;
    border-radius: 2em;
    padding: .5em 1.5em .5em 2.5em;
    display: inline-block;
    font-weight: normal;
}
.main_area .link-03.mypage-btn.login li a:after {
    margin-bottom: -.2em;
}

/* tbl */
.tbl-01 + .tbl-01 {
    margin-top: 1.5em;
}
.tbl-flow {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.main_area .tbl {
    width: 100%;
    border: 1px solid #cecece;
    border-collapse: collapse;
}
.tbl-flow .tbl.tbl400 {
    width: 400%;
}
.tbl-flow .tbl.tbl300 {
    width: 300%;
}
.tbl-flow .tbl.tbl200 {
    width: 200%;
}
.main_area .tbl.tbl70 {
    width: 70%;
}
.main_area .tbl td,
.main_area .tbl th {
    padding: 1em;
    border: 1px solid #cecece;
    font-size: 14px;
    text-align: center;
    vertical-align: center;
    line-height: 1.5;
}
.main_area .tbl td *,
.main_area .tbl th * {
    font-size: 14px;
}
.main_area .tbl.tbl02 td,
.main_area .tbl th.left {
    text-align: left;
}
.main_area .tbl th.center {
    text-align: center;
}
.main_area .tbl th.right {
    text-align: right;
}
.main_area .tbl th {
    background: #f1f1f1;
}
.main_area .tbl.tbl02 th {
    width: 25%;
    text-align: left;
    line-height: 1.3;
}
.main_area .tbl.tbl03 thead th {
    background: #555252;
    color: #FFF;
}
.main_area .tbl.tbl03 tbody th {
    width: 15%;
}
.main_area .tbl tr.emp th ,
.main_area .tbl tr.emp td {
    background: #ffd4d4;
}
.main_area .tbl tr.emp th {
    font-weight: bold;
}
.main_area .tbl.tbl_left th,
.main_area .tbl.tbl_left td {
    text-align: left;
}

/* FRM-01 */
.main_area form{
    font-size: 1.4rem;
}
.main_area input,
.main_area select ,
.main_area textarea {
    font-size: 1.4rem;
    color: #555;
    background: #FFF;
    border: 1px solid #dcdcdc;
    padding: .6em;
    line-height: 1;
    border-radius: 4px;
    box-sizing: border-box;
    width: 100%;
    resize: vertical;
}
.main_area input[type=text] ,
.main_area select {
    min-height: 37px;
}
.main_area select.size_s ,
.main_area input.size_s {
    width: 170px;
    min-width: 170px;
}
.main_area input[type=radio] ,
.main_area input[type=checkbox] {
    display: inline-block;
    width: auto;
}
.main_area input[type=file]{
    border: none;
}
.main_area label {
    cursor: pointer;
}


.main_area .frm-01 + .frm-01 {
    margin-top: .5em;
}
.main_area .frm-01 .info {
    display: inline-block;
    font-size: 11px;
    color: #fff;
    background: #e6002d;
    line-height: 1;
    padding: .3em 1em;
    margin-left: 1.5em;
}

.main_area input.i_m ,
.main_area select.i_m {
    width: 300px;
}
.main_area input.i_s ,
.main_area select.i_s {
    width: 80px;
    margin-right: 1em;
}
.main_area input.i_m + input.i_m ,
.main_area input.i_s + input.i_s ,
.main_area select.i_m + select.i_m ,
.main_area select.i_s + select.i_s {
    margin-left: 1em;
}

/* radio_l */
.main_area .radio_l {
    display: flex;
    flex-flow: wrap;
    align-items: center;
    gap: 2em;
    font-size: 1.4rem;
    line-height: 1.4;
}

/* checkbox_l */
.main_area .checkbox_l {
    display: flex;
    flex-flow: wrap;
    align-items: center;
    gap: 2em;
    font-size: 1.4rem;
    line-height: 1.4;
}

.main_area .radio_l li ,
.main_area .checkbox_l li ,
.main_area .radio_l span ,
.main_area .checkbox_l span ,
.main_area .radio_l label ,
.main_area .checkbox_l label {
    margin-right: 1em;
    font-size: 1.4rem;
}

/* btn_d */
.main_area .btn_d {
    display: inline-flex;
    font-size: 1.2rem !important;
    padding: 0;
    padding-left: 12px;
    width: 58px;
    height: 21px;
    background: url(../images/icon_trash.png) no-repeat left 9px center #777;
    color: #FFF;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    text-decoration: none;
    box-sizing: border-box;
    margin-left: 20px;
    border: none;
}
/* btn_d */
.main_area .btn_a {
    display: flex;
    width: auto;
    padding: .5em 1em;
    background: #999;
    color: #FFF;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    text-decoration: none;
    box-sizing: border-box;
    border: none;
    margin-top: .5em;
}

/* frm-box */
.frm-box {
    display: flex;
    flex-flow: column;
    gap: .6em;
}
.frm-box p.title ,
.frm-box div.title {
    font-weight: bold;
    margin-bottom: .6em;
}
.frm-box p.title + .input {
    margin-top: 1em;
}
.frm-box * + p.title ,
.frm-box * + div.title {
    margin-top: .5em;
}
.frm-box .flex {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
}
.frm-box .flex > div {
    width: calc(50% - 0.5em);
}
.frm-box .btn_box {
    text-align: center;
    margin-top: 1.5em;
}
.frm-box > div + div {
    margin-top: 1em;
}








/* login-01 */
.main_area .login-01 {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 1em;
    max-width: 450px;
    margin: 2em auto;
}
.main_area .login-01 .btn_area {
    margin-top: 1em;
}
.main_area .login-01 p {
    width: 100%;
}
.main_area *.fm120 ,.main_area *.fm300 ,.main_area *.fm450 ,.main_area *.fm500 {box-sizing: border-box;}
.main_area *.fm120 , .main_area input.fm120 {width: 120px;}
.main_area *.fm300 , .main_area input.fm300 {width: 300px;}
.main_area *.fm450 , .main_area input.fm450 {width: 450px;}
.main_area *.fm500 , .main_area input.fm500 {width: 500px;}
@media only screen and (max-width:767px){
/* login-01 */
    .main_area .login-01 {
        max-width: none;
    }
    .main_area *.fm120 ,.main_area *.fm300 ,.main_area *.fm450 ,.main_area *.fm500 {width: 100%;}
    .main_area .link-01.t_center {
        text-align: left;
    }
}
/*　current　*/
.main_area ul.current {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-content: center;
    margin-bottom: 50px;
}
.main_area ul.current li {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    position: relative;
    background: #ececec;
    color: #999;
    height: 45px;
}
.main_area ul.current li + li {
    margin-left: 20px;
}
.main_area ul.current.f14 li {
    font-size: 1.4rem;
    padding: 0 0 0 0.5em;
}
.main_area ul.current li:before {
    content: "";
    width: 20px;
    height: 100%;
    position: absolute;
    top: 0;
    right: -20px;
    background: linear-gradient(to bottom left, #FFF 50%, #ececec 50%) top left/ 100% 50% no-repeat, linear-gradient(to top left, #FFF 50%, #ececec 50%) bottom left / 100% 50% no-repeat;
}
.main_area ul.current li.active {
    background: #cde9f7;
    color: var(--main-color);
    font-weight: bold;
}
.main_area ul.current li.active:before {
    background: linear-gradient(to bottom left, #FFF 50%, #cde9f7 50%) top left/ 100% 50% no-repeat, linear-gradient(to top left, #FFF 50%, #cde9f7 50%) bottom left / 100% 50% no-repeat;
}
.main_area ul.current li:last-child ,
.main_area ul.current li.active:last-child {
    padding-right: .5em;
}
.main_area ul.current li:last-child:before ,
.main_area ul.current li.active:last-child:before {
    content: none;
}
@media only screen and (max-width:767px){
    .main_area ul.current {
        margin-bottom: 5vw;
    }
    .main_area ul.current li {
        height: 40px;
    }
    .main_area ul.current li {
        font-size: 1.2rem;
    }
    .main_area ul.current.f14 li {
        font-size: 1.0rem;
    }
    .main_area ul.current li:last-child ,
    .main_area ul.current li.active:last-child {
        padding-right: 0;
    }
}

footer a[href^="https"]:after ,
main.main_sec a[href^="http"]:after ,
main.main_sec a[href^="https"]:after ,
main.main_sec a[target="_blank"]:after {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url("../images/window.svg") no-repeat center center;
    background-size: 100% auto;
    margin:0 .2em 0 .3em;
}
main.main_sec .no_ow a[href^="http"]:after ,
main.main_sec .no_ow a[href^="https"]:after ,
main.main_sec .no_ow a[target="_blank"]:after {
    content: none;
}
footer a[href^="http"]:after ,
footer a[href^="https"]:after {
    background-image: url("../images/window_w.svg") ;
}

@media only screen and (max-width:886px){
.main_area > * + .h1 ,
.main_area > * + .h2 ,
.main_area > * + .h3 ,
.main_area > * + .m-01 ,
.main_area > * + p ,
.main_area > * + ul ,
.main_area > * + ol,
.main_area > * + table ,
.main_area > * + div {
    scroll-margin-top: 16.77vw;
}
}



@media only screen and (max-width:767px){
     /* main全ページ共通 -------------------------------------- */
    main , .main_all {
        padding-top: 3vw;
        padding-bottom: 47px;
    }
   main .main_box {
        padding: 3vw;
    }
    main section + section {
        margin-top: 3vw;
    }
    main.main_sec section + section {
        margin-top: 0;
    }
    main h2 ,
    main h2.h1_tit {
        font-size: 2.0rem;
    }
    main span.cate {
        margin-right: .5em;
        padding: .3em .8em;
    }    
    main.main_sec span.cate {
        margin-bottom: .3em;
    }    
    main span.date {
        margin-right: .5em;
    }    
    main.main_sec p ,
    main.main_sec li ,
    main.main_sec th ,
    main.main_sec td ,
    main.main_sec a {
        font-size: 1.4rem;
    }
    main.main_sec *.mt50 {
        margin-top: 5vw;
    }
    /* table */
    .tbl-01 , .frm-01 {
        width: 100%;
        overflow: auto;
    }
    .tbl-01 table, .frm-01 table {
        min-width: 700px;
    }
    /* tbl02 */
    .main_area .frm-01 table.tbl02 {
        min-width: auto;
        border-bottom: none;
    }
    .main_area .frm-01 table.tbl02 th ,
    .main_area .frm-01 table.tbl02 td {
        display: block;
        border: none;
        border-bottom: 1px solid #cecece;
        width: 100%;
        box-sizing: border-box;
    }
    /* form */
    .main_area .radio_l ,
    .main_area .checkbox_l {
        display: block;
    }
    .main_area .radio_l li ,
    .main_area .checkbox_l li ,
    .main_area .radio_l span ,
    .main_area .checkbox_l span ,
    .main_area .radio_l label ,
    .main_area .checkbox_l label {
        display: inline-block;
        margin-right: 1em;
        font-size: 1.4rem;
    }
    .frm-box .flex {
        flex-flow: nowrap column;
    }
    .frm-box .flex > div {
        width: auto;
    }
    .main_area input.i_m, .main_area select.i_m {
        width: 100%;
        /* max-width: 300px; */
    }
    .main_area .i_m + .i_m {
        margin-top: .5em;
    }
    .main_area input.i_m + input.i_m, .main_area input.i_s + input.i_s, .main_area select.i_m + select.i_m, .main_area select.i_s + select.i_s {
        margin-left: 0;
    }
    /* btn */
    .main_area .btn_box {
        flex-flow: column;
    }
    .main_area a.btn, .main_area button.btn {
        display: flex;
        width: 100%;
    }
    .main_area .btn.btn_m {
        padding: 1em;
    }
    /* モニタリングのボタン */
    .main_area .btn.btn_moni {
    padding:1em 5em;
    min-width: 364px;
    }

    /* link-03.mypage-btn */
    .main_area .link-03.mypage-btn {
        gap: 1em;
        flex-flow: column;
    }

}






