@charset "UTF-8";
/* CSS Document */
@media screen and (min-width: 0px) and (max-width: 768px) {
    html, body {
        font-size: 16px;
    }
    .pc-no {
        display: inline;
    }
    .sp-no {
        display: none;
    }
    .header {
        position: fixed;
        top: 0;
        left: 0;
        border-top: solid 10px #62BB46;
        background-color: #FFF;
        z-index: 10;
        -webkit-box-shadow: 0px 3px 5px 0px rgba(176, 176, 176, 0.5);
        -moz-box-shadow: 0px 3px 5px 0px rgba(176, 176, 176, 0.5);
        box-shadow: 0px 3px 5px 0px rgba(176, 176, 176, 0.5);
    }
    .hdr-wrap {
        width: 98%;
        margin: 0 auto;
        padding: 10px 0;
        position: relative;
        overflow: hidden;
    }
    .hdr-top .logo {
        width: 50%;
        max-width: 500px;
    }
    /***MAIN***/
    .main {
        width: 100%;
        margin: 60px 0 0;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .main-img, .bot-img {
        width: 100%;
        margin: 0 auto;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .bot-img {
        margin: 0 auto;
    }
    .sub-img {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto 60px;
        padding: 0;
        position: relative;
        overflow: hidden;
        line-height: 100%;
    }
    .main-wrap {
        width: 98%;
        min-height: 500px;
        margin: 0 auto;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .pankuzu {
        width: 98%;
        margin: 0 auto;
        padding: 0;
        position: relative;
        overflow: hidden;
        font-size: 80%;
        color: #9f9f9f;
    }
    .pankuzu a {
        color: #077c84;
        border-bottom: solid 1px #077c84;
        transition: all 0.3s;
    }
    .pankuzu a:hover {
        opacity: 0.5;
        border-bottom: solid 1px transparent;
    }
    h1 {
        width: 98%;
        margin: 0 auto;
        padding: 30px 1%;
        position: relative;
        overflow: hidden;
        font-size: 200%;
        line-height: 110%;
        text-align: left;
        color: #61bb45;
        ;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        letter-spacing: 0.1em;
    }
    h1:before {
        content: "";
        display: inline-block;
        width: 10px;
        height: 40px;
        background-color: #61bb45;
        margin: 0 10px 0 0;
    }
    h2 {
        width: 100%;
        margin: 0;
        padding: 0;
        position: relative;
        overflow: hidden;
        font-size: 140%;
        text-align: left;
        color: #36831E;
    }
    h3 {
        width: 100%;
        margin: 0 0 10px;
        padding: 0 0 0 23px;
        position: relative;
        overflow: hidden;
        font-size: 120%;
        text-align: left;
        color: #36831E;
        display: block;
    }
    h3:before {
        content: "";
        width: 15px;
        height: 15px;
        position: absolute;
        top: 10px;
        left: 0;
        display: inline-block;
        background-color: #62BB46;
        margin: 0 10px 0 0;
    }
    .main-sec {
        width: 100%;
        margin: 0;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .sec-wrap {
        padding: 30px 0;
    }
    .flex {
        display: block;
    }
    .sub-wrap {
        width: 98%;
        max-width: 1000px;
        margin: 0 auto;
        padding: 30px 0;
        position: relative;
        overflow: hidden;
    }
    /***HOURS***/
    .sp-hours {
        width: 90%;
        margin: 0 auto;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    table.hours {
        width: 100%;
        margin: 0 0 10px;
        padding: 0;
        position: relative;
        overflow: hidden;
        background-color: #3B3C3E;
        text-align: center;
        border-spacing: 1px;
        line-height: 150%;
        font-size: 70%;
    }
    table.hours th, table.hours td {
        padding: 8px;
        background-color: #FFF;
    }
    table.hours th {
        background-color: #FFD868;
        font-weight: 500;
    }
    table.hours td .time {
        font-size: 110%;
    }
    .hours-memo {
        width: 100%;
        margin: 0 0 20px;
        font-size: 67%;
        line-height: 180%;
        text-align: center;
    }
    .hours-memo .orange {
        font-size: 110%;
        color: #EE7800;
    }
    .hours-memo .tel {
        color: #EE7800;
        font-size: 210%;
    }
    .hours-memo .tel a {
        color: #EE7800;
    }
    /***NEWS***/
    ul.news-list {
        width: 100%;
        margin: 0;
        padding: 8px;
        position: relative;
        overflow: hidden;
        list-style: none;
    }
    ul.news-list li {
        width: 98%;
        margin: 0 auto;
        padding: 10px 1%;
        position: relative;
        overflow: hidden;
        border-bottom: solid 1px #dbdbdb;
    }
    ul.news-list li a {
        width: 100%;
        margin: 0;
        padding: 0%;
        display: block;
        color: #292929;
        transition: all 0.3s;
    }
    ul.news-list li a:hover {
        background-color: #f8f8f8;
    }
    ul.news-list li .n-left {
        width: 100%;
        font-size: 80%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    ul.news-list li .n-left .date {
        width: auto;
        margin: 0 10px 0 0;
    }
    ul.news-list li .n-left .cat {
        width: 15%;
        background-color: #61bb45;
        color: #FFF;
        text-align: center;
        padding: 5px 1%;
        font-size: 80%;
        line-height: 100%;
        letter-spacing: 0.2em;
    }
    ul.news-list li .n-left .c-ippan {
        background-color: #61bb45;
    }
    ul.news-list li .n-left .c-imp {
        background-color: #ff6464;
    }
    ul.news-list li .n-right {
        width: 100%;
        font-size: 90%;
        font-family: "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "Helvetica", Arial, "メイリオ", Meiryo, sans-serif;
    }
    /***FOOTER***/
    .pagetop {
        width: 15%;
        max-width: 100px;
        position: fixed;
        right: 10px;
        bottom: 2%;
        z-index: 5;
        line-height: 0%;
        opacity: 1.0;
        transition: all 0.5s;
    }
    .sticky {
        position: fixed;
        bottom: 2%;
    }
    img.vert-move {
        -webkit-animation: mover 1s infinite alternate;
        -moz-animation: mover 1s infinite alternate;
        animation: mover 1s infinite alternate;
    }
    .pagetop:hover {
        cursor: pointer;
    }
    /*
img.vert-move:hover {
	-webkit-animation: wiggle 0.1s infinite alternate;
    animation: wiggle 0.1s infinite alternate;
}
*/
    img.vert-move:hover {
        -webkit-animation: none;
        -moz-animation: none;
        animation: none;
    }
    .footer {
        width: 100%;
        margin: 0;
        padding: 60px 0 20px;
        position: relative;
        overflow: hidden;
    }
    .footer a {
        color: #292929;
        transition: all 0.3s;
    }
    .footer a:hover {
        opacity: 0.5;
    }
    .ftr-wrap {
        width: 98%;
        max-width: 1000px;
        margin: 0 auto;
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .ftr-nav {
        display: none;
    }
    .footer .ppolicy {
        display: none;
    }
    .footer .ppolicy a {
        color: #595757;
    }
    .footer .ftr-bot {
        width: 100%;
        margin: 0 0 30px;
        padding: 0;
        position: relative;
        overflow: hidden;
        text-align: center;
        font-size: 80%;
    }
    .footer .ftr-bot .ftr-logo {
        width: 80%;
        margin: 0 auto 10px;
    }
    .footer .number {
        font-size: 9px;
        margin: -10px auto 0;
    }
    .footer .copyright {
        font-size: 60%;
        color: #595757;
        text-align: center;
    }
}