@charset "utf-8";

#wrapper {
    position: relative;
    overflow: hidden;
}

body {
    background: #EFD153;
    color: #524409;

    font-family: 'M PLUS 1p', sans-serif;

    font-size: 15px;
    line-height: 1.4em;

}

.en {
    font-family: 'Roboto Condensed', sans-serif;
}

img {
    width: 100%;
}



a {
    color: #524409;
}




@keyframes anm-bln {
    0% {
        transform: rotate(-5deg);
    }

    50% {
        transform: rotate(5deg);
    }

    100% {
        transform: rotate(-5deg);
    }
}


.staticpage .balloons .bln span {
    animation-name: anm-bln;
    animation-duration: 2000ms;
    animation-iteration-count: infinite;
    transform-origin: center bottom;
}

.about .staticpage .balloons .bln.bln1 span {
    background-image: url(/assets/img/about_1.png);
}

.about .staticpage .balloons .bln.bln2 span {
    background-image: url(/assets/img/about_2.png);
}

.about .staticpage .balloons .bln.bln3 span {
    background-image: url(/assets/img/about_3.png);
}

.business .staticpage .balloons .bln.bln1 span {
    background-image: url(/assets/img/business_1.png);
}

.business .staticpage .balloons .bln.bln2 span {
    background-image: url(/assets/img/business_2.png);
}

.business .staticpage .balloons .bln.bln3 span {
    background-image: url(/assets/img/business_3.png);
}


.staticpage .balloons .bln.bln1 span {
    animation-delay: -200ms;
}

.staticpage .balloons .bln.bln2 span {}

.staticpage .balloons .bln.bln3 span {
    animation-delay: -400ms;
}





body {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: 100%;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}




header {
    background-image: url(../img/hd.png);
    background-size: 100vw auto;
    background-position: center bottom;
    padding-top: 6vw;
    background-repeat: no-repeat;
    margin-bottom: 6vw;
}



header h1 a {
    display: block;
    background-image: url(../img/logo.png);
    background-size: 100% 100%;
    width: 76vw;
    height: calc(76vw / 667 * 238);
    text-indent: -9999px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}



footer .inner {
    padding: 6vw;
    background-color: #524409;
    color: #fff;
}

footer .logo a {
    display: block;
    background-image: url(../img/logo_w.png);
    background-size: 100% 100%;
    width: 50vw;
    height: calc(50vw / 366 * 131);
    text-indent: -9999px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3vw;
}

footer ul.menu {
    margin-top: 12vw;
    margin-bottom: 12vw;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

footer ul.menu li a {
    font-size: 11px;
    display: block;
    background-image: url(../img/arrow_w.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: calc(27px / 2 * 0.5) calc(46px / 2 * 0.5);
    color: #fff;
    text-decoration: none;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 18px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
}

footer .copyright a {
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 10px;
    text-align: center;
    margin-top: 6vw;
}




footer .sns {
    display: flex;
    justify-content: center;
    margin-top: 6vw;
    margin-bottom: 6vw;
}

footer .sns li a {
    display: block;
    width: 8vw;
    height: 8vw;
    text-indent: -9999px;
    overflow: hidden;
    background-size: 100% 100%;
    margin-left: 3vw;
    margin-right: 3vw;
}

footer .sns li a.tw {
    background-image: url(../img/sns_tw.png);
}

footer .sns li a.fb {
    background-image: url(../img/sns_fb.png);
}

footer .sns li a.ln {
    background-image: url(../img/sns_ln.png);
}



.contents {}





.contents .item {
    position: relative;

    padding: 30px 40px;
}





.contents .item .hd {
    margin-bottom: 20px;
}

.contents .item .more a {
    display: block;
    background-image: url(../img/acc_open.png);
    background-repeat: no-repeat;
    background-size: calc(46px / 2) calc(27px / 2);
    background-position: center center;
    height: calc(27px / 2);
}

.contents .item.open .more a {
    background-image: url(../img/acc_close.png);
}

.contents .slidearea {
    margin-bottom: 20px;
    position: relative;
}

.contents .pages {
    position: relative;
    overflow: hidden;
    width: calc(100vw - 80px);
}

.contents .pages>div {
    position: relative;
    display: flex;
    width: 99999px;
    /* align-items: center; */
}

.contents .pages>div .page {
    width: calc(100vw - 80px);
    background-color: #f00;
}

.contents .pages>div .page iframe {
    display: block;
    width: calc(100vw - 80px);
    height: calc((100vw - 80px) / 16 * 9);
    width: 100%;
    height: 100%;
}




.contents .item a {
    text-decoration: none;
    color: #524409;

}

.contents .item .texts {
    margin-top: 6vw;
}

.contents .item .texts .title {
    font-size: 21px;
    line-height: 1.35em;
    font-weight: 700;
}

.contents .item .texts .lead {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.35em;
    font-weight: 700;
}

.contents .item .texts .body {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.75em;
}



.contents .item .btn a {
    margin-top: 20px;
    font-size: 18px;

}

.contents .item .next {
    display: block;
    background-image: url(../img/next.png);
    background-size: 100% 100%;
    width: calc(27px / 2);
    height: calc(46px / 2);
    position: absolute;
    right: -30px;
    top: calc(50% - 46px / 2 / 2);
}

.contents .item .prev {
    display: block;
    background-image: url(../img/prev.png);
    background-size: 100% 100%;
    width: calc(27px / 2);
    height: calc(46px / 2);
    position: absolute;
    left: -30px;
    top: calc(50% - 46px / 2 / 2);
}



.btn a {

    display: block;
    background-color: #524409;
    color: #fff !important;
    font-weight: 700;
    font-size: 20px;
    line-height: 1em;
    border-radius: 10px;
    padding: 20px;
    text-decoration: none;
    background-image: url(../img/arrow_w.png);
    background-size: calc(27px / 2) calc(46px /2);
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) center;
}



.ShinobiReviews {
    margin-top: 40px;
}


#review {
    margin-top: 40px;
}

#review table {
    width: 100%;
}

#review table th,
#review table td {
    padding-bottom: 10px;
}


#review .wpcr3_respond_2 input[type='text'] {
    min-width: auto !important;
    width: 100%;
}

#review .wpcr3_respond_2 textarea {
    width: 100%;
    height: 100px !important;
    min-width: auto !important;
}

.backtop {
    margin-top: 40px;
}

.backtop a {


    display: block;
    background-color: #524409;
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    text-align: center;
    line-height: 1em;
    border-radius: 10px;
    padding: 20px;
    text-decoration: none;
    background-image: url(../img/arrow_w_r.png);
    background-size: calc(27px / 2) calc(46px /2);
    background-repeat: no-repeat;
    background-position: calc(20px) center;
}



.staticpage {
    margin-top: 40px;
    margin-left: 40px;
    margin-right: 40px;
    margin-bottom: 12vw;
}


.staticpage h2 {
    text-align: center;
    font-size: 21px;
    line-height: 1.35em;
    font-weight: 700;
    margin-bottom: 20px;
}

.staticpage h3 {
    text-align: center;
    font-size: 18px;
    line-height: 1.35em;
    font-weight: 700;
    margin-bottom: 10px;
}

.staticpage .box {
    margin-bottom: 30px;
}

.staticpage .box p {
    line-height: 1.75em;
}

.staticpage ul {
    margin-bottom: 20px;
}

.staticpage ul li {
    text-indent: -1em;
    margin-left: 1em;
    line-height: 1.75em;
    margin-bottom: 10px;
}




.wpcf7-form {
    margin-top: 6vw;
    margin-bottom: 6vw;
}

.wpcf7-form p {
    margin-bottom: 20px;
    margin-top: 20px;
}

.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form textarea {
    width: 100%;
}

.wpcf7-form input[type=submit] {
    display: block;
    margin-top: 6vw;
    margin-left: auto;
    margin-right: auto;
}



@media print,
screen and (min-width: 813px) {

    .sp {
        display: none !important;
    }


    header {
        background-image: url(../img/hd.png);
        background-size: calc(750px / 2) calc(540px / 2);
        background-repeat: repeat-x;
        background-position: center top;
        padding-top: 20px;
        margin-bottom: 20px;
    }



    header h1 a {
        display: block;
        background-image: url(../img/logo.png);
        background-size: 100% 100%;
        width: calc(667px * 0.75);
        height: calc(238px * 0.75);
        text-indent: -9999px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        margin-top: 2vw;
    }


    .staticpage {
        margin-top: 40px;
        margin-bottom: 40px;
        width: 820px;
        margin-left: auto;
        margin-right: auto;
    }


    .staticpage .balloons {
        position: relative;
        display: flex;
        justify-content: center;
    }

    .staticpage .balloons .bln {
        width: calc(483px / 2);
        height: calc(235px / 2);
    }

    .staticpage .balloons .bln span {
        display: block;
        background-size: 100% 100%;
        width: calc(483px / 2);
        height: calc(235px / 2);
    }



    .staticpage .balloons .bln.bln2 {
        margin-top: 60px;
    }





    footer .img {
        background-image: url(../img/ft.png);
        background-size: calc(750px / 2) calc(360px / 2);
        background-repeat: repeat-x;
        background-position: center bottom;
        height: calc(360px / 2);
        text-indent: -9999px;
        overflow: hidden;
    }





    footer .inner {
        padding: 0;
        padding-top: 40px;
        padding-bottom: 40px;
        background-color: #524409;
        color: #fff;
    }

    footer .logo a {
        width: calc(366px);
        height: calc(131px);
        margin-top: 20px;
    }

    footer ul.menu {
        margin-top: 40px;
        margin-bottom: 40px;
    }




    footer .sns {
        display: flex;
        justify-content: center;
        margin-top: 40px;
        margin-bottom: 40px;
    }


    footer .sns li a {
        width: 30px;
        height: 30px;
        margin-left: 10px;
        margin-right: 10px;
    }


    footer .copyright a {
        margin-top: 0;
    }


    .btn a {

        width:320px;
        box-sizing: border-box;
        margin-left: auto;
        margin-right: auto;
    }


    .wpcf7-form {
        margin-top: 40px;
        margin-bottom: 40px;
        width: 540px;
        margin-left: auto;
        margin-right: auto;
    }



    .contents {
        margin-left: auto;
        margin-right: auto;
        width: 820px;
    }

    .more {
        display: none;
    }

    #review {
        margin-left: auto;
        margin-right: auto;
    }


    .contents .item .texts {
        margin-top: 20px;
    }


}



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


    .pc {
        display: none !important;
    }


    .staticpage .balloons {
        position: relative;
        display: block;
    }

    .staticpage .balloons .bln {
        width: calc(60vw);
        height: calc(60vw / 483 * 235 );
        margin-left: -6vw;
    }

    .staticpage .balloons .bln span {
        display: block;
        background-size: 100% 100%;
        width: calc(60vw);
        height: calc(60vw / 483 * 235 );
    }

    .staticpage .balloons .bln:nth-child(2) {
        margin-left: auto;
        margin-right: -6vw;
    }





}