@import url("https://fonts.googleapis.com/css?family=Barlow+Condensed:300,400,500,600,700,800,900|Noto+Sans+JP:100,300,400,500,700,900|Noto+Serif+JP:200,300,400,500,600,700,900&display=swap");
@import url("https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap");
.innerA {
    display: table;
    width: 100%;
    table-layout: fixed
}

.innerA .left,
.innerA .right {
    width: 48%;
    float: left
}

@media all and (max-width: 639px) {
    .innerA .left,
    .innerA .right {
        width: 100%;
        float: none
    }
}

.innerA .right {
    margin-left: 4%
}

@media all and (max-width: 639px) {
    .innerA .right {
        margin-left: 0;
        margin-top: 15px
    }
}

.innerA .left_s {
    width: 30%;
    float: left
}

.innerA .right_l {
    width: 66%;
    float: left;
    margin-left: 4%
}

.innerB {
    display: table;
    width: 100%;
    table-layout: fixed
}

@media all and (max-width: 639px) {
    .innerB {
        display: block
    }
}

.innerB .left,
.innerB .right {
    width: 48%;
    float: left
}

@media all and (max-width: 639px) {
    .innerB .left,
    .innerB .right {
        width: 100%;
        float: none
    }
}

.innerB .right {
    margin-left: 4%
}

@media all and (max-width: 639px) {
    .innerB .right {
        margin-left: 0;
        margin-top: 15px
    }
}

.innerB .left_s {
    width: 30%;
    float: left
}

@media all and (max-width: 639px) {
    .innerB .left_s {
        width: 100%;
        float: none
    }
}

.innerB .right_l {
    width: 66%;
    float: left;
    margin-left: 4%
}

@media all and (max-width: 639px) {
    .innerB .right_l {
        margin-left: 0;
        margin-top: 15px;
        width: 100%;
        float: none
    }
}

#entry {
    margin-top: 50px;
    padding-bottom: 100px
}

@media all and (max-width: 800px) {
    #entry {
        padding-bottom: 50px
    }
}

#entry .entry__cotent {
    background: #fff;
    padding: 30px;
    font-family: "YakuHanJP", "Noto Sans JP"
}

@media all and (max-width: 800px) {
    #entry .entry__cotent {
        padding: 15px
    }
}

#entry .entry__cotent .data span {
    background: #f2f2f2;
    padding: .3em .5em
}

#entry .entry__cotent .entry__title {
    border-bottom: 1px solid #36f;
    margin-bottom: 15px;
    margin-top: 15px;
    color: #36f;
    font-family: "YakuHanJP", "Noto Sans JP";
    font-weight: 500;
    font-size: 20px;
    font-size: 1.25rem;
    letter-spacing: .1em;
    font-weight: 900
}

#entry .entry__cotent .entry__cotent__text {
    font-family: "YakuHanJP", "Noto Sans JP";
    font-weight: 500;
    font-size: 14px;
    font-size: .875rem;
    letter-spacing: .1em
}

#phonemenuA {
    display: none;
    padding: 0;
    margin: 0
}

.smartphone img {
    display: none
}

.w100 {
    max-width: 100%;
    height: auto;
    text-align: center;
    margin: 0 auto
}

.map {
    width: 100%;
    height: 400px
}

.flexbox {
    display: flex;
    display: -webkit-flex
}

#humberger,
#meanmenu {
    display: none
}

#humberger {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 600;
    width: 25px;
    padding: 17px 10px 10px;
    cursor: pointer;
    background: #666
}

@media screen and (max-width: 800px) {
    #navi {
        display: none
    }
    #humberger {
        display: block
    }
}

@media screen and (max-width: 800px) {
    .midashi {
        font-size: 17px
    }
    body {
        font-size: 12px
    }
    #head .logo {
        width: 300px
    }
    .fleft0,
    .fleft1,
    .fleft2,
    .fright0,
    .fright1,
    .fright2 {
        float: none
    }
    .fleft0,
    .fleft1,
    .fleft2,
    .fright0,
    .fright1,
    .fright2,
    #singlepage p img,
    #main p img {
        display: block;
        margin-left: auto;
        margin-right: auto
    }
    .juicysliderimg img {
        display: table-cell;
        vertical-align: top;
        text-align: center;
        margin: 0 auto;
        z-index: 600;
        width: 90%
    }
    .flexbox {
        display: block;
        display: -webkit-block
    }
    .none,
    .desktop,
    #nav-f,
    #menuA,
    #seoA,
    #pankuzu,
    #navi,
    .seo,
    #fmenu,
    #fmenu-lg,
    #tnavi,
    .tbnr {
        display: none
    }
    #head,
    #footer,
    #wrap,
    #nav,
    #wrapA,
    #seo,
    #title {
        width: 100%
    }
    #containar {
        width: 100%;
        height: auto;
        padding: 0;
        margin: 0
    }
    #wrap {
        padding: 15px 0 80px;
        margin: 0
    }
    #main {
        float: none;
        width: 95%;
        margin: 0 auto 20px
    }
    #side {
        float: none;
        width: 98%;
        margin: 0 auto;
        height: auto;
        padding: 0
    }
    img {
        max-width: 100%;
        height: auto
    }
    .smartphone img {
        display: block;
        max-width: 100%;
        height: auto
    }
    header {
        padding: 0;
        margin: 0;
        z-index: 3;
        top: 0
    }
    #headA {
        background: #fff;
        padding: 0px 0 0 3px
    }
    #head {
        height: 40px
    }
    .logo-f {
        width: 250px;
        text-align: center;
        margin: 0 auto
    }
    .tel {
        float: none;
        text-align: center;
        display: none
    }
    .yajirusi {
        font-size: 15px
    }
    #main h1 {
        width: 100%;
        height: auto
    }
    #title {
        padding: 90px 0 40px;
        margin: 0px 0 0
    }
    #title h2 {
        font-size: 18px;
        width: 100%
    }
    #seo h1 {
        font-size: 10px
    }
    .lmain,
    .rmain,
    .lsingle,
    .rsingle {
        float: none;
        width: 100%
    }
    #singlepage {
        padding: 0 0 280px
    }
    #singlepage section {
        width: 100%;
        margin: 0 auto;
        padding: 25px 0
    }
    .single {
        width: 95%;
        margin: 0 auto;
        padding: 25px 0px
    }
    .textwrap {
        width: 90%;
        margin: 0 auto;
        font-size: 12px;
        padding: 10px
    }
    .textwrap2 {
        width: 90%;
        margin: 0 auto 20px;
        font-size: 12px;
        padding: 0px
    }
    .news_box {
        width: 100%
    }
    .news-bl {
        width: 100%
    }
    .news-bl dt {
        float: none;
        width: 90%;
        text-align: center;
        margin: 0 auto 10px
    }
    .news-bl dd {
        padding: 0;
        font-size: 13px
    }
    .news {
        margin-bottom: 15px;
        overflow: hidden;
        font-size: 12px
    }
    .news dt {
        float: none;
        width: 8em;
        padding-top: 10px;
        line-height: 1.3;
        font-weight: normal
    }
    .news dd {
        padding-left: 0;
        padding-bottom: 10px;
        padding-top: 5px;
        line-height: 1.8;
        border-bottom: dotted 1px #b6ae83
    }
    .news dd span {
        font-size: 11px;
        padding: 1px 20px;
        margin-right: 10px
    }
    .news dd span.gr {
        color: #fff;
        background: #15ad27
    }
    .list-check2 {
        max-width: 100%
    }
    .list-check2 li {
        width: 100%;
        padding-left: 0.5em
    }
    .list-check2 li:before {
        left: 1em
    }
    .list-check {
        font-size: 13px
    }
    .listFlow h4 {
        font-size: 17px;
        border-bottom: solid 1px #ccc;
        margin-bottom: 5px;
        overflow: hidden
    }
    .listFlow dl {
        display: block;
        width: 100%
    }
    .listFlow dl dt {
        display: block;
        padding: 5px 0;
        width: 100%;
        border: none
    }
    .listFlow dl dt .num {
        display: block
    }
    .listFlow dl dd {
        display: block;
        padding: 15px 10px;
        border: 1px solid #c8c8c8
    }
    .photo li {
        width: calc((100% - 50px) / 2);
        box-sizing: content-box;
        margin: 0 10px 20px
    }
    .photo li:nth-child(2n) {
        margin-right: 0
    }
    .cost {
        width: 100%;
        height: auto
    }
    .slider1 .overview li {
        width: 300px;
        float: left;
        margin-right: 5px;
        margin-left: 5px;
        text-align: center;
        vertical-align: middle;
        display: table;
        z-index: 99999;
        overflow: hidden;
        margin-bottom: 5px;
        margin-top: 3px;
        padding: 5px;
        font-weight: bold;
        color: #dc5e72
    }
    .slider1 .viewport {
        width: 100%;
        margin: 0 auto;
        height: 230px;
        overflow: hidden;
        position: relative
    }
    .slider1 img {
        max-width: 100%;
        padding-bottom: 5px;
        vertical-align: middle;
        text-align: center
    }
    #juicysliderbox {
        position: relative
    }
    #swiffycontainer {
        max-width: 800px;
        width: 95%;
        max-height: 253px;
        height: auto
    }
    .flashimg {
        width: 100%;
        height: 50%;
        z-index: 1
    }
    #flash {
        height: auto;
        padding-top: 53px
    }
    video {
        position: static;
        z-index: 1;
        display: none
    }
    #top_image {
        padding: 250px 0
    }
    .tbox2 {
        width: 100%;
        margin: 0 auto;
        padding: 40px 0;
        text-align: center
    }
    footer {
        margin: 0;
        height: 100px
    }
    #footer {
        padding: 20px 0;
        margin: 0 auto 0
    }
    .map {
        width: 100%
    }
    .flogo {
        width: 90%;
        margin: 0 auto 20px
    }
    .flexbox {
        display: flex;
        display: -webkit-flex
    }
    .sidebox {
        width: 100%;
        height: auto;
        box-shadow: none
    }
    .form dl {
        margin: 10px 0
    }
    .form dt {
        float: none;
        width: 100%;
        height: 20px;
        line-height: 20px;
        padding-top: 10px
    }
    .form dd {
        width: 100%;
        padding-left: 0;
        padding-bottom: 10px;
        padding-top: 10px;
        border-bottom: 0px solid #eee
    }
    .form dd:last-child {
        border-bottom: 0px;
        margin-bottom: 0px
    }
    .textarea,
    textarea {
        width: 93%;
        font-size: 16px
    }
    .dropdown {
        font-size: 16px
    }
    .fm-text {
        text-align: left
    }
    .card {
        height: auto
    }
    .tab li {
        width: 28%;
        padding: 5px;
        margin: 0 5px 0 0
    }
    .tab li:last-child {
        margin: 0
    }
    .fb-like-box {
        display: none
    }
    .fb-like-box span,
    .fb-like-box iframe[style] {
        display: none
    }
    .facebook {
        display: none
    }
    .picup-3 {
        width: 100%;
        width: 100%;
        min-width: 100%;
        padding: 0px 0
    }
    .picup-3 ul {
        overflow: hidden
    }
    .picup-3 ul li {
        width: 33.3%;
        float: left;
        width: 99%;
        float: none;
        height: 160px;
        overflow: hidden;
        position: relative
    }
    .picup-3 ul li:first-child {
        width: 33.4%
    }
    .picup-3 ul li a {
        display: block;
        text-align: center
    }
    .picup-3 ul li a .logo {
        padding: 35px 0
    }
    .picup-3 ul li a .logo img {
        width: 90%;
        height: auto
    }
    .picup-3 ul li a .bg {
        width: 100%;
        height: 100%
    }
    .picup-3 ul li:first-child {
        width: 99%
    }
    figure.snip1384 h3 {
        left: 0%
    }
    .mtitle-big {
        float: none;
        text-align: center;
        margin: 0
    }
    .mtitle3 {
        font-size: 15px
    }
    .timeline>li {
        overflow: hidden;
        margin: 0;
        position: relative
    }
    .timeline-date {
        width: 10em;
        float: left;
        text-align: left;
        margin-top: 10px
    }
    .timeline-content {
        width: 50%;
        float: left;
        border-left: 3px #ccc solid;
        padding: 10px 0 20px 20px
    }
    .timeline-content:before {
        content: "";
        width: 12px;
        height: 12px;
        background: #009944;
        position: absolute;
        left: 9.6em;
        top: 17px;
        border-radius: 100%
    }
    .picup-2 {
        min-width: 100%
    }
    .picup-2 ul {
        overflow: hidden;
        background-color: #fff
    }
    .picup-2 ul li {
        width: 100%;
        float: none;
        display: table
    }
    .picup-2 ul li a .logo {
        position: relative;
        min-height: 0px;
        max-height: 350px;
        height: 100%;
        max-width: 600px;
        width: 100%;
        text-align: center;
        vertical-align: middle;
        float: none;
        margin: auto
    }
    .picup-2 ul li a .bg {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #fff
    }
    .picup-2 ul li .linkbtn li.linkbtn2 {
        width: 300px
    }
    #phonemenu li a:link,
    #phonemenu li a:visited,
    #phonemenu li a:hover {
        color: #111;
        text-decoration: none
    }
    #phonemenuA {
        display: block;
        width: 100%;
        height: 50px;
        box-shadow: rgba(0, 0, 0, 0.2) 0 3px 2px;
        background: #ff464c;
        z-index: 99999;
        top: 0;
        left: 0;
        padding: 0
    }
    #phonemenu {
        margin: 0 auto;
        z-index: 3;
        color: #fff
    }
    #phonemenu ul {
        position: relative
    }
    #phonemenu li {
        font-family: "FontAwesome";
        width: 12%;
        float: left;
        padding: 5px 0;
        margin: 0;
        display: inline;
        text-align: center;
        font-size: 20px;
        cursor: pointer;
        vertical-align: middle
    }
    #phonemenu li:hover {
        opacity: 0.5
    }
    #phonemenu .lg {
        width: 50%;
        padding: 3px 0 0;
        z-index: 99999
    }
    #phonemenu .lg img {
        max-height: 45px
    }
    #dmenu1 {
        display: none;
        position: absolute;
        top: 0;
        width: 100%;
        font-size: 11px
    }
    #dmenu1 li {
        overflow: hidden;
        width: 100%;
        background: rgba(0, 0, 0, 0.8);
        box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px 1px
    }
    #dmenu1 li a {
        display: block;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff
    }
    #dmenu1 li a:link,
    #dmenu1 li a:visited,
    #dmenu1 li a:hover {
        color: #fff;
        text-decoration: none;
        text-align: left;
        font-size: 12px;
        padding: 0px 0;
        text-indent: 1em
    }
    #dmenu1 li a:before {
        font-family: "FontAwesome";
        content: "\f054";
        margin-right: 5px
    }
    #dmenu2,
    #dmenu3 {
        display: none;
        position: absolute;
        top: 50px;
        width: 100%;
        z-index: 1000;
        font-size: 11px
    }
    #dmenu2 li,
    #dmenu3 li {
        overflow: hidden;
        width: 100%;
        background: rgba(0, 0, 0, 0.8);
        box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px 1px
    }
    #dmenu2 li a,
    #dmenu3 li a {
        display: block;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff
    }
    #dmenu2 li a:before,
    #dmenu3 li a:before {
        content: url(../img/icon_w.png);
        margin-right: 3px
    }
    .flink0,
    .flink1,
    .flink2 {
        width: 100%;
        margin-bottom: 20px
    }
    .flink0 ul,
    .flink1 ul,
    .flink2 ul {
        margin-right: 0;
        margin-bottom: 0
    }
    .flink0 li,
    .flink1 li,
    .flink2 li {
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 15px
    }
    .flink0 li img,
    .flink1 li img,
    .flink2 li img {
        display: block;
        margin-left: auto;
        margin-right: auto
    }
    figure figcaption img {
        display: block;
        width: 100%;
        margin: 0 auto
    }
    #fmenuA {
        width: 100%
    }
    #fmenu {
        width: 100%;
        list-style-type: none;
        font-size: 11px
    }
    #fmenu ul {
        border-top: 1px solid #eee
    }
    #fmenu li {
        float: left;
        width: 33%;
        border-bottom: 1px solid #eee;
        border-right: 1px solid #eee
    }
    #fmenu li a {
        display: block;
        width: 100%;
        min-width: 20px;
        height: 30px;
        line-height: 30px;
        text-align: left;
        font-weight: normal;
        background: #ffeac8;
        text-indent: 10px
    }
    #fmenu li a:before {
        font-family: "FontAwesome";
        content: "\f054";
        margin-right: 3px;
        color: #555
    }
    #fmenu a:link,
    #fmenu a:visited {
        color: #555;
        text-decoration: none
    }
    #fmenu a:hover {
        color: #555;
        text-decoration: none;
        background: #faf4eb
    }
    .mtitle-sp {
        font-size: 18px;
        line-height: 1.6
    }
    .mtitle-cline {
        font-size: 22px;
        letter-spacing: 1px;
        color: #e50311;
        line-height: 1;
        margin: 20px auto;
        letter-spacing: 1px
    }
    .mtitle-cline span {
        font-size: 13px;
        color: #555
    }
    .mtitle-cline2 {
        font-size: 22px;
        letter-spacing: 1px;
        color: #fff;
        line-height: 1;
        margin: 20px auto
    }
    .mtitle-cline2 span {
        font-size: 12px;
        color: #ddd
    }
    h2 {
        font-size: 13px
    }
    .mtitle-point {
        font-size: 13px
    }
    .mtitle-point span {
        margin-right: 5px
    }
    .mtitle-check {
        font-size: 14px
    }
    .crbtn a {
        font-size: 14px;
        width: 80%
    }
    .flex-wrap {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 100%
    }
    .flex-wrap .service {
        width: 33%;
        box-sizing: border-box;
        padding: 5px
    }
    .flex-wrap .service:nth-child(3n) {
        margin-right: 0
    }
    .flex-wrap .service img {
        width: 100%;
        border-radius: 20px 20px 0 0
    }
    .flex-wrap .service h3 {
        padding: 5px;
        border-radius: 0 0 20px 20px
    }
    .flex-wrap .flow {
        width: 44%;
        padding: 5px;
        border-radius: 10px;
        margin-bottom: 15px;
        text-align: center
    }
    .flex-wrap .flow h3 {
        position: absolute;
        margin-top: 10px;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80%;
        border-radius: 5px;
        padding: 3px 0;
        color: #fff;
        font-size: 12px
    }
    .flex-wrap .flow img {
        width: 95%;
        border-radius: 5px;
        margin: 0 auto;
        padding-top: 10px
    }
    .flex-wrap .flow p {
        padding: 30px 5px 5px;
        color: #fff
    }
    .bg-1 {
        padding: 20px 0
    }
    .tab {
        width: 95%;
        margin: 0 auto
    }
    .tab li {
        float: none;
        margin: 0 0 1px;
        width: 100%;
        padding: 0
    }
    .tab li a {
        width: 100%;
        padding: 3px 0;
        text-indent: 1em
    }
    .mtitle-x {
        font-size: 18px;
        text-align: center;
        color: #484848;
        margin: 20px 0 5px
    }
    .mtitle4 {
        font-size: 16px
    }
    .mtitle5 {
        font-size: 16px;
        padding-left: 10px
    }
    #contentwrap {
        width: 100%
    }
    .text1 {
        text-align: center;
        font-size: 13px;
        color: #fff;
        font-weight: bold;
        padding: 10px 0
    }
    .rss {
        width: 90%;
        margin: 0 auto;
        padding: 10px 0 25px
    }
    .rhalf,
    .hotel {
        display: none
    }
    .rhalf {
        float: none
    }
    .lhalf {
        float: none;
        width: 100%;
        height: 100%;
        display: table;
        margin: 0;
        padding: 0
    }
    .lhalf h2 {
        font-size: 18px;
        letter-spacing: 2px;
        text-align: center
    }
    .lhalf-img {
        float: none
    }
    .twrap {
        margin: 0 auto;
        padding: 35px 20px;
        display: block
    }
    .hotel {
        display: none
    }
    .sp {
        display: block
    }
    .contactbx {
        text-align: center;
        margin-bottom: 30px
    }
    .contactbx.bx2 li {
        font-size: 15px;
        width: 90%
    }
    .contactbx li {
        display: inline-block;
        background: #fff;
        font-size: 15px;
        width: 90%;
        max-width: 90% !important;
        min-width: 90% !important;
        font-weight: bold;
        padding: 10px 0;
        border-radius: 30px;
        margin: 0 0px 10px;
        height: 30px;
        line-height: 30px
    }
    .contactbx a {
        width: 100%;
        display: block
    }
}

@media screen and (max-width: 480px) {
    #head .logo {
        width: 220px
    }
    #wrapper {
        overflow: hidden
    }
    .photo {
        width: 99%;
        margin: 0 auto
    }
    .photo ul {
        margin-right: 0px;
        margin-bottom: 0px;
        text-align: center
    }
    .photo li {
        float: none;
        display: inline-block;
        margin-right: 5px;
        margin-bottom: 5px
    }
    .photo li a {
        width: 110px;
        height: 110px;
        line-height: 110px
    }
    .photo li p {
        width: 110px
    }
    .photo li img {
        max-width: 110px;
        max-height: 110px
    }
    .mt1 img {
        width: 200px
    }
    .list-check2,
    .mtitle-big {
        font-size: 15px
    }
    .img768 {
        width: 100%
    }
    .mtitle {
        font-size: 18px
    }
    .list-check2 {
        overflow: hidden
    }
    .list-check2 li {
        font-size: 14px;
        width: 100%
    }
    .list-check2 li:before {
        left: 0.5em
    }
    .phone {
        display: block
    }
    .picup-2 ul li a .logo {
        position: relative;
        min-height: 0px;
        max-height: 350px;
        height: 100%;
        width: 100%;
        text-align: center;
        vertical-align: middle;
        float: none;
        margin: auto
    }
    .picup-2 ul li .linkbtn li.linkbtn2 {
        width: 300px;
        height: 50px;
        line-height: 1.5
    }
}

#page {
    padding: 0;
    position: relative;
    z-index: 2;
    left: 0;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1)
}

#drawernav {
    position: fixed;
    top: 0;
    right: -50%;
    width: 50%;
    height: 100%;
    background: #666;
    color: #fff;
    z-index: 500;
    padding-top: 40px;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1)
}

@media all and (max-width: 639px) {
    #drawernav {
        right: -240px;
        width: 240px
    }
}

#drawernav ul {
    list-style: none;
    padding: 0
}

#drawernav ul li a {
    color: #fff;
    display: block;
    padding: 10px 20px;
    font-size: 13px;
    text-decoration: none;
    font-family: "YakuHanJP", "Noto Sans JP";
    border-bottom: 1px solid #ddd
}

#drawernav ul li a:hover {
    color: #fff;
    background: rgba(34, 34, 34, 0.4)
}

#drawernav ul li a:before {
    font-family: "FontAwesome";
    content: "\f0da";
    margin-right: 10px
}

#drawernav ul li.phone a {
    color: #fff;
    display: block;
    padding: 5px 10px;
    text-decoration: none;
    border: 1px solid #111;
    border-radius: 10px;
    margin: 10px auto;
    width: 200px;
    text-align: center;
    font-size: 15px;
    color: #111;
    background: #fff;
    font-weight: bold
}

#drawernav ul li.phone a:before {
    font-family: "FontAwesome";
    content: "\f098";
    margin-right: 10px
}

#drawernav ul li.phone a:hover {
    background: #d97223
}

#drawernav ul li.map a {
    color: #fff;
    display: block;
    padding: 5px 10px;
    text-decoration: none;
    border: 1px solid #111;
    border-radius: 10px;
    margin: 10px auto;
    width: 200px;
    text-align: center;
    font-size: 15px;
    color: #111;
    background: #fff;
    font-weight: bold
}

#drawernav ul li.map a:before {
    font-family: "Font Awesome 5 Free";
    content: "\f3c5";
    font-weight: 900;
    margin-right: 10px
}

#drawernav ul li.map a:hover {
    background: #d97223
}

#drawernav img {
    display: block;
    width: 90%;
    padding: 5px 0;
    margin: 0 auto
}

#drawernav h4 {
    padding: 0 15px
}

.icon-bar {
    height: 2px;
    background: #fff;
    display: block;
    margin-bottom: 6px;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1)
}

.fixed-content {
    right: inherit;
    width: 100%;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1)
}

#overlay {
    z-index: -1;
    opacity: 0;
    background: #000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
    transition: all 400ms cubic-bezier(1, 0, 0, 1);
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1)
}

.drawer-opened #page {
    left: -240px;
    box-shadow: 1px 0 2px #000;
    -webkit-box-shadow: 1px 0 2px #000
}

.drawer-opened .fixed-content {
    left: -240px
}

.drawer-opened #drawernav {
    right: 0
}

.drawer-opened #humberger .icon-bar {
    background: #fff
}

.drawer-opened #humberger :nth-child(1) {
    transform: translate(0, 8px) rotate(45deg);
    -webkit-transform: translate(0, 8px) rotate(45deg)
}

.drawer-opened #humberger :nth-child(2) {
    transform: translate(-20px, 0);
    -webkit-transform: translate(-20px, 0);
    opacity: 0
}

.drawer-opened #humberger :nth-child(3) {
    transform: translate(0, -8px) rotate(-45deg);
    -webkit-transform: translate(0, -8px) rotate(-45deg)
}

.drawer-opened #overlay {
    opacity: 0.3;
    left: -240px;
    position: fixed
}


/*# sourceMappingURL=smartphone.css.map */