@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Montserrat&display=swap);

#nav-drawer,
#sp_foot_contact,
.sp_lay {
    display: none
}

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

    #head #nav-close,
    #head .nav-unshown,
    #head h2,
    #head p,
    #head ul,
    .pc_lay {
        display: none
    }

    body {
        font-family: "Yu Gothic", YuGothic, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
        min-width: auto;
        height: 100%;
        -webkit-text-size-adjust: none
    }

    img {
        height: auto
    }

    .lay {
        width: 100%
    }

    #head {
        position: relative;
        height: 14.0625vw
    }

    #head h1 {
        padding: 8px 0 0 8px
    }

    #head h1 img {
        width: 68.75vw
    }

    #head #nav-drawer {
        display: block
    }

    #head #nav-open {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 14.0625vw;
        height: 14.0625vw;
        vertical-align: middle;
        background: #017ac8
    }

    #head #nav-open span,
    #head #nav-open span:after,
    #head #nav-open span:before {
        position: absolute;
        height: 1.25vw;
        width: 7.8125vw;
        background: #fff;
        display: block;
        content: '';
        cursor: pointer;
        top: 24%;
        left: 23%
    }

    #head #nav-open span:before {
        top: 200%;
        left: 0
    }

    #head #nav-open span:after {
        top: 410%;
        left: 0
    }

    #head #nav-close,
    #head #nav-content {
        position: fixed;
        top: 0;
        height: 100%;
        transition: .3s ease-in-out;
        left: 0;
        width: 100%
    }

    #head #nav-close {
        z-index: 99;
        background: #000;
        opacity: 0
    }

    #head #nav-content {
        overflow: auto;
        z-index: 9999;
        background: #017ac8;
        -webkit-transform: translateX(200%);
        transform: translateX(200%)
    }

    #head #nav-input:checked~#nav-content {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    #head #nav-content label.dli-close {
        display: block;
        position: relative;
        top: auto;
        right: auto;
        width: 14.0625vw;
        height: 14.0625vw;
        background: #004877;
        margin: 0 0 0 auto;
        overflow: hidden
    }

    #head #nav-content label.dli-close span {
        display: inline-block;
        vertical-align: middle;
        color: #fff;
        line-height: 1;
        width: 8.4375vw;
        height: .9375vw;
        background: currentColor;
        position: relative;
        transform: rotate(45deg);
        margin: 43% 3.125vw 0
    }

    #head #nav-content label.dli-close span::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: inherit;
        border-radius: inherit;
        transform: rotate(90deg)
    }

    #head #nav-content ul {
        display: block;
        position: relative;
        top: initial;
        right: initial;
        padding: 0 4.6875vw 4.6875vw
    }

    #head #nav-content ul li {
        float: none;
        font-size: 20px;
        font-size: 6.25vw;
        line-height: 1.2;
        padding: 4.6875vw 0 0;
        background: 0 0
    }

    #head #nav-content ul li a {
        color: #fff;
        font-weight: 700
    }

    #head #nav-content ul li ul {
        padding: 3.125vw 6.25vw 0
    }

    #head #nav-content ul li ul li {
        padding: 0 0 3.125vw
    }

    #head #nav-content ul li ul li a {
        display: block;
        position: relative;
        font-size: 13px;
        font-size: 4.0625vw
    }

    #head #nav-content ul li ul li a:before {
        display: block;
        content: '';
        width: 4.0625vw;
        height: .625vw;
        background: #fff;
        position: absolute;
        left: -7%;
        bottom: 35%
    }

    #head #sp_nav_pic {
        padding: 0 4%;
        overflow: hidden;
        height: auto;
        display: flex;
        flex-wrap: wrap
    }

    #head #sp_nav_pic ul.bxslider {
        position: absolute;
        top: -18%;
        padding: 0
    }

    #head #sp_nav_pic ul.bxslider li {
        padding: 0
    }

    #head #sp_nav_pic div.sp_nav_pic_content {
        position: relative;
        background: #f5f4ef;
        width: 48%;
        margin: 0 4% 4% 0;
        box-sizing: border-box
    }

    #head #sp_nav_pic div.sp_nav_pic_content h3 {
        margin: 0;
        position: relative;
        display: block;
        text-align: left;
        color: #017ac8;
        font-size: 10px;
        font-size: 3.125vw;
        line-height: 1.2;
        font-weight: 700;
        padding: 2.1875vw
    }

    #head #sp_nav_pic div.sp_nav_pic_content h3:before {
        display: block;
        content: '';
        border-bottom: 10px solid transparent;
        border-left: 10px solid #0077c3;
        background: 0 0;
        position: absolute;
        left: 2px;
        top: 2px
    }

    #head #sp_nav_pic div.sp_nav_pic_content p {
        display: block;
        top: auto;
        right: auto;
        font-size: 10px;
        font-size: 3.125vw;
        line-height: 1.2;
        padding: 2.1875vw;
        position: absolute;
        bottom: 0
    }

    #sp_title h3,
    #sp_title p,
    .sub_title,
    .sub_title2,
    .sub_title3 {
        line-height: 1.5
    }

    #head #sp_nav_pic div.sp_nav_pic_content:nth-of-type(2n) {
        margin: 0 0 4%
    }

    .sp_lay {
        display: block
    }

    .sp_lay img {
        width: 100%
    }

    #sp_title {
        padding: 4.6875vw;
        position: relative
    }

    #sp_title p {
        font-size: 12px;
        font-size: 3.75vw
    }

    #sp_title p a {
        color: #010101;
        text-decoration: none
    }

    #sp_title h3 {
        text-align: left;
        font-weight: 700;
        font-size: 18px;
        font-size: 5.625vw;
        margin: 0;
        color: #003252
    }

    #sp_title h3:before {
        display: block;
        content: '';
        width: 3.125vw;
        height: 1.5625vw;
        background: #003252;
        position: absolute;
        left: 0;
        bottom: 35%
    }

    #sp_content {
        padding: 0 3.125vw
    }

    #sp_content p {
        font-size: 12px;
        font-size: 3.75vw;
        line-height: 1.8
    }

    #sp_content a {
        color: #0072c7
    }

    .sub_button1 {
        text-align: center
    }

    .sub_button1 a {
        border: 1px solid #ccc;
        display: block;
        text-decoration: none;
        color: #017ac8;
        font-size: 15px;
        font-size: 4.6875vw;
        line-height: 1.2;
        font-weight: 700;
        padding: 3.75vw 0 3.125vw;
        margin: 0 4.6875vw;
        border-radius: 100px;
        position: relative
    }

    .sub_title,
    .sub_title2 {
        padding: 2.5vw 2.1875vw 2.1875vw
    }

    #sp_foot_contact #sp_foot_contact_btn a:after,
    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main a:before,
    .sub_button1 a:after {
        content: '';
        vertical-align: -15%;
        margin: 0 10px 0 0
    }

    .sub_button1 a:after {
        position: absolute;
        top: 30%;
        right: 1.5625vw;
        display: block;
        background: url(/img/sp/common_arrow_icon.png);
        width: 5vw;
        height: 5vw;
        background-size: 100% 100%
    }

    .sub_title {
        font-size: 13px;
        font-size: 4.0625vw;
        color: #000;
        border-radius: 2.5vw;
        border: 1px solid #c5c0a9;
        font-weight: 700;
        background: #f5f3ed;
        background: -moz-linear-gradient(top, #f5f3ed 0, #e9e4c4 100%);
        background: -webkit-linear-gradient(top, #f5f3ed 0, #e9e4c4 100%);
        background: linear-gradient(to bottom, #f5f3ed 0, #e9e4c4 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f3ed', endColorstr='#e9e4c4', GradientType=0)
    }

    .sub_title2 {
        font-size: 14px;
        font-size: 4.375vw;
        color: #005489;
        font-weight: 700;
        margin-top: 1.5625vw;
        position: relative;
        background: #ccefff;
        background: -moz-linear-gradient(top, #ccefff 0, #fff 11.25vw, #fff 100%);
        background: -webkit-linear-gradient(top, #ccefff 0, #fff 11.25vw, #fff 100%);
        background: linear-gradient(to bottom, #ccefff 0, #fff 11.25vw, #fff 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccefff', endColorstr='#ffffff', GradientType=0)
    }

    .sub_title3,
    .sub_title4 {
        padding: 0 0 0 6.25vw;
        font-weight: 700
    }

    .sub_title2:before {
        display: block;
        content: '';
        width: 100%;
        height: .9375vw;
        background: #0077c8;
        position: absolute;
        left: 0;
        top: -1.5625vw
    }

    .sub_title3 {
        font-size: 14px;
        font-size: 4.375vw;
        color: #017ac8;
        margin: 1.5625vw 0;
        position: relative
    }

    .sub_title3:before {
        display: block;
        position: absolute;
        content: '';
        width: 3.75vw;
        height: 3.75vw;
        border-radius: 50%;
        background: #8bc5ea;
        border: 3px solid #0077c8;
        top: 0;
        left: 0
    }

    .sub_title4 {
        font-size: 13px;
        font-size: 4.0625vw;
        line-height: 1.3;
        margin: 1.5625vw 0;
        position: relative
    }

    .sub_title4:before {
        display: block;
        position: absolute;
        content: '';
        border-top: 6px solid transparent;
        border-left: 12px solid #0077c8;
        border-bottom: 6px solid transparent;
        top: 2px;
        left: 0
    }

    #sp_foot_contact {
        margin-top: 6.25vw;
        display: block
    }

    #sp_foot_contact h5 {
        font-size: 18px;
        font-size: 5.625vw;
        line-height: 1.2;
        text-align: center;
        font-weight: 700;
        color: #000;
        position: relative;
        margin-bottom: 6.25vw
    }

    #sp_foot_contact h5:before {
        display: block;
        content: '';
        width: 14.0625vw;
        height: .9375vw;
        background: #017ac8;
        position: absolute;
        left: 50%;
        top: -90%;
        margin-left: -7.03125vw
    }

    #sp_foot_contact .sp_foot_contact_body {
        position: relative;
        height: 78.125vw
    }

    #sp_foot_contact .sp_foot_contact_body p img {
        width: 100%
    }

    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main {
        position: absolute;
        top: 31.25vw;
        right: 0;
        width: 71.875vw;
        box-sizing: border-box;
        background: rgba(255, 255, 255, .9);
        padding: 3.125vw;
        box-shadow: 0 0 10px 0 #c4c4c4
    }

    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main h6 {
        font-size: 16px;
        font-size: 5vw;
        line-height: 1.2;
        font-weight: 700;
        color: #017ac8
    }

    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main a {
        font-size: 15px;
        font-size: 4.6875vw;
        line-height: 1.2;
        font-weight: 700;
        margin: 1.5625vw 0;
        display: block;
        text-align: center;
        background: #017ac8;
        border-radius: 5px;
        color: #fff;
        text-decoration: none;
        padding: 1.875vw 0 1.5625vw
    }

    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main a:before {
        display: inline-block;
        background: url(/img/sp/common_tel.png);
        width: 4.6875vw;
        height: 4.6875vw;
        background-size: 100% 100%
    }

    #sp_foot_contact .sp_foot_contact_body .sp_foot_contact_main p {
        font-size: 12px;
        font-size: 3.75vw;
        line-height: 1.6
    }

    #sp_foot_contact #sp_foot_contact_btn {
        text-align: center
    }

    #sp_foot_contact #sp_foot_contact_btn a {
        border: 1px solid #ccc;
        display: block;
        text-decoration: none;
        color: #017ac8;
        font-size: 15px;
        font-size: 4.6875vw;
        line-height: 1.2;
        font-weight: 700;
        padding: 3.75vw 0 3.125vw;
        margin: 9.375vw 4.6875vw 0;
        border-radius: 100px;
        position: relative
    }

    #sp_foot_contact #sp_foot_contact_btn a:after {
        position: absolute;
        top: 30%;
        right: 1.5625vw;
        display: block;
        background: url(/img/sp/common_arrow_icon.png);
        width: 5vw;
        height: 5vw;
        background-size: 100% 100%
    }

    #sp_foot_contact .sp_foot_contact_body:nth-of-type(2) {
        height: 87.5vw
    }

    #sp_foot_contact .sp_foot_contact_body:nth-of-type(2) .sp_foot_contact_main {
        top: 40.625vw
    }

    #foot {
        margin: 9.375vw 0 0;
        background: url(/img/sp/common_foot_bg.png) top left;
        background-size: 100% auto;
        padding: 0 1.875vw;
        box-sizing: border-box;
        width: 100%
    }

    #foot p {
        font-size: 0
    }

    #foot p a {
        display: block;
        font-size: 15px;
        font-size: 4.6875vw;
        padding: 2.1875vw 1.875vw 1.875vw;
        line-height: 1.5;
        color: #fff;
        font-weight: 700;
        border-bottom: solid 1px #fff;
        box-sizing: border-box;
        width: 100%
    }

    #foot p a:last-child {
        border: none
    }

    #copyright #upload,
    #foot #pagetop {
        display: none
    }

    #copyright {
        padding: 4.6875vw 0 15.625vw
    }

    #copyright #copy {
        width: 100%;
        font-size: 10px;
        font-size: 3.125vw;
        color: #424242;
        text-align: center;
        padding: 0 0 4.6875vw
    }

    #copyright #upload_banner {
        float: none;
        text-align: center
    }

    .txt_l {
        text-align: left
    }

    .txt_r {
        text-align: right
    }

    .txt_c {
        text-align: center
    }

    .mb10 {
        margin-bottom: 3.125vw !important
    }

    .mb20 {
        margin-bottom: 6.25vw !important
    }

    .mb30 {
        margin-bottom: 9.375vw !important
    }

    .mb40 {
        margin-bottom: 12.5vw !important
    }

    .mb50 {
        margin-bottom: 15.625vw !important
    }

    .mt10 {
        margin-top: 3.125vw !important
    }

    .mt20 {
        margin-top: 6.25vw !important
    }

    .mt30 {
        margin-top: 9.375vw !important
    }

    .mt40 {
        margin-top: 12.5vw !important
    }

    .mt50 {
        margin-top: 15.625vw !important
    }

    .mb0 {
        margin-bottom: 0 !important
    }

    .mt0 {
        margin-top: 0 !important
    }

    .mx0 {
        margin-left: 0 !important;
        margin-right: 0 !important
    }

    .w33 {
        width: 33.3333% !important
    }

    .w50 {
        width: 50% !important
    }

    .w66 {
        width: 66.6666% !important
    }

    .news h5,
    .news_detail .tstyle1 {
        line-height: 1.5
    }

    .calender p#calender_type {
        margin-bottom: 21.875vw
    }

    .calender p#calender_type img {
        width: 6.25vw
    }

    .news_detail {
        margin: 0 0 21.875vw
    }

    .news_detail p {
        margin-bottom: 4.6875vw
    }

    .news_detail .tstyle1 {
        font-size: 4.0625vw
    }

    .news_detail .iframe_wrap {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 64.5%;
        margin-bottom: 2.65625vw
    }

    .news_detail .iframe_wrap iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    .news {
        margin: -6.25vw 0 21.875vw
    }

    .news h5 {
        font-size: 4.0625vw;
        font-weight: 700;
        margin-top: 6.25vw
    }

    .news p {
        font-size: 13px;
        font-size: 4.0625vw;
        line-height: 1.5
    }

    .news p img {
        width: 80%;
        display: block;
        margin: 0 auto
    }

    .sp_img_scroll {
        overflow-x: scroll;
        margin-left: -3.125vw;
        margin-right: -3.125vw;
        text-align: center
    }

    .sp_img_scroll .sp_img_inner {
        width: 154.6875vw
    }

    .sp_img_scroll .sp_img_inner .sp_img {
        width: 148.4375vw
    }
}