@charset "utf-8";

/* 
Theme Name: happy
Theme URL: https://shibukawa-massage-happy.com/
Description: 渋川市の整体院
Author: ryota ono
Version: 0.1
Tags: shibukawa,massage,happy,
*/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500&display=swap');

/* base---------------------------------------------- */
* {
    box-sizing: border-box;
    /* font-family: 'M PLUS 1p', sans-serif; */
    font-family: 'Shippori Mincho', serif;
    font-weight: 700;
    font-style: normal;
    list-style: none;
    margin: 0;
    padding: 0;
}
h2 {
    font-size: 25px;
}

body {
    color: #67696A;
    overflow-x: hidden;
}
span {
    display: inline-block;
    vertical-align: bottom;
}
img {
    width: 100%;
    text-align: center;
}
a {
    text-decoration: none;
    color: #67696A;
    list-style-type: none;
    display: inline-block;
}
/* base 終了-------------------------------------------- */
.is_mt30 {
	margin-top:30px;
}
.is_mb50 {
	margin-bottom:50px;
}
.is_mt70 {
	margin-top:70px;
}
.is_padding10 {
	padding:10px;
}
.is_padding20 {
	padding:20px;
}
.is_pl20 {
	padding-left:20px;
}
.is_pr20 {
	padding-right:20px;
}



/* ヘッダー要素----------------------------------------*/
header {
    margin-bottom: 30px;
}

.title{
    text-align: center;
    background-color: #66ff00;
    color: #fff;
    font-size: 15px;
    line-height: 30px;
    height: 30px;
}
.headerLogoText {
    position: absolute;
    top: 40px;
    left: 10px;
    font-size: 0.8rem;
    line-height: 13px;
    text-align: left;
}
#header-pc_wrapper {
    display: none;
}
.nav-wrapper_hover {
    display: none;
}
.nav-wrapper-pc {
    display: none;
}
.scroll-header {
    display: none;
}


@media screen and (min-width: 648px) {
    header {
        width: 100%;
        height: 140px;
    }
    #header-pc_wrapper {
        display: block;
        width: 100%;
        height: 100px;
        background-color: #2ffc00;
    }
    .header-pc_wrapper {
        width: 100%;
        max-width: 948px;
        height: 125px;
        margin: 0 auto;
        border-left: 1px solid #fff;
        border-right: 1px solid #fff;
        display: flex;
        justify-content: space-between;
        padding: 0 5px;
    }
    .header-pc_wrapper_img_left {
        margin-top:4px;
        margin-bottom:6px;
        width: 100%;
        width: 320px;
    }
    .header-pc_wrapper_left_text {
        width: 317px;
        padding: 1px;
        transform: translateY(-8px);
        font-size: 8px;
        border: 1px solid rgba(255,255,255,0.6);
        border-radius: 3px;
        margin-left: 3px;
        text-align: center;
    }
    

    .header-pc_wrapper_img_right {
        margin-top: 3px;
        max-width: 400px;

    }
    

    .scroll-header {
        display: block;
        width: 100%;
        height: 110px;
        background-color: rgba(47, 252, 0, 0.9);
        z-index: 101;
        opacity: 0;
        visibility: hidden;
        /* 最後に追加 */
        position: fixed;
        top: 0;
        left: 0;
    }
    /* 管理バー表示時は上端の見切れを防ぐ（body_class / :has 両対応） */
    .admin-bar .scroll-header,
    body:has(#wpadminbar) .scroll-header {
        top: 32px;
    }
    @media screen and (max-width: 782px) {
        .admin-bar .scroll-header,
        body:has(#wpadminbar) .scroll-header {
            top: 46px;
        }
    }
    .scroll-header_section {
        width: 100%;
        max-width: 948px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        height: 100%;
        padding: 4px 0;
    }



    .scroll-header_img {
        width: 250px;
        padding: 0 30px;
    }
    .scroll-header_text {
        padding: 0 40px;
        font-size: 0.6rem;
        line-height: 1.4;
        transform: translateY(-5px);
        white-space: nowrap;
    }





    .scroll-header_wrapper_right {
        padding-right: 10px;
        flex: 1;
        max-width: 520px;
        text-align: center;
    }
    .scroll-header_wrapper_right_img {
        margin-top: 3px;
        width: 100%;
        max-width: 500px;
    }
    .scroll-header_list_wrapper01 {
        border-bottom: 1px solid rgba(0,0,0,0.2);
        padding-bottom: 2px;
        margin-bottom: 2px;
    }

    .scroll-header_list_wrapper {
        width: 100%;
        max-width: 500px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        align-items: center;
        font-size: 10px;
        font-weight: normal;
        transform: none;
        padding: 0;
        margin: 0 auto;
        list-style: none;
    }
    .scroll-header_list_wrapper02 {
        grid-template-columns: repeat(2, 1fr);
        max-width: 500px;
        margin: 0 auto;
    }
    .scroll-header_list_wrapper li {
        min-width: 0;
        height: auto;
        line-height: 1.35;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        position: relative;
        padding: 2px 4px;
    }
    .scroll-header_list_wrapper01 li:not(:last-child)::after,
    .scroll-header_list_wrapper02 li:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 70%;
        background: rgba(0,0,0,0.2);
    }
	
    .scroll-header_list {
        padding: 2px 4px;
        display: block;
        white-space: normal;
        text-align: center;
        height: auto;
        line-height: 1.35;
        cursor: pointer;
        width: 100%;
    }
    .scroll-header_list_wrapper  {
        cursor: pointer;
    }


    .scroll-header_list:hover {
        cursor: pointer;
        color: white;
    }
    .scroll-header_list__hover {
        cursor: default;
    }
    .scroll-header_list__hover:hover {
        cursor: default;
        color: #67696A;
    }
    .scroll-header_list--reserve {
        position: relative;
    }
    .scroll-header_reserve-note {
        display: block;
        margin-top: 2px;
        font-size: 9px;
        line-height: 1.2;
        white-space: nowrap;
        color: #67696A;
        cursor: default;
    }
    .scroll-header_list_span {
        display: none;
    }




    

    .js-header_fixed {
        opacity: 1;
        visibility: visible;
        transition: 0.8s;
    }
    .js-header_wrapper01 {
        opacity: 1;
        transition: 0.8s;
        animation: js-header_wrapper01 1s;
    }
    @keyframes js-header_wrapper01 {
        0%{
            transform: translateY(-200%);
        }
        100% {
            transform: translateY(0);
        }
        
    }
    .js-header_wrapper02 {
        animation: js-header_wrapper02 1s;
    }
    @keyframes js-header_wrapper02 {
        0%{ opacity: 0.8;
            transform: translateX(-30%);
        }
        50% {
            opacity: 0.5;
            transform: translateY(-15px);
        }
        100% {
            transform: translateY(0);
        }
        
    }


 

    .sample01_wrapper{
        transform: translateY(-60px);
        padding-top: 20px;
        width: 100%;
        height: 100px;
        opacity: 0;
        transition: 0.5s;
        display: flex;
        justify-content: space-around;
        background-color: royalblue;
    }
    .sample01_wrapper:hover {
        opacity: 1;
        margin-top: 5px;
        height: 200px;
        transform: translateY(-60px);
        transform: translateX(-50%);
        min-width: 948px;
    }
    .sample {
        border-right: 1px solid rgba(0,0,0,0.2);
        text-align: center;
    }
    .sample01_list {
        width: 100px;
        position: relative;
    }
    .smartslider3 {
		max-width:948px;
		width:100%;
		margin: 0 auto;
        padding-top: 45px;
	}





/* グローバルナビゲーション */



.nav-wrapper_hover {
    display: block;
    height: 50px;
    background-color: rgba(0, 0, 0, 0.02);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}


.nav-wrapper-pc {
    display: block;
    position: relative;
    width: 100%;
    height: 50px;
    max-width: 948px;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
    white-space: nowrap;
    transform: translateY(-50px);
}
.nav-wrapper-pc li:last-child {
    border-right: 1px solid rgba(0, 0, 0, 0.2);
}

.nav-wrapper_list {
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-left: 1px solid rgba(0, 0, 0, 0.2);
}

.nav-wrapper_link{
    display: block;
}

.nav-wrapper_link:hover {
    color: #999;
}
.nav-wrapper_link_text:hover {
    color: #999;
}

.nav-wrapper_list02 {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
}
.nav-wrapper_list01 {
    width: 100%;
}
.nav-wrapper_list01_text {
    border-right: 1px solid rgba(0, 0, 0, 0.3);
    border-left: 1px solid rgba(0, 0, 0, 0.3);
}



.nav-wrapper_list:hover {
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: all .5s;
    transition: all .5s;
}
.nav-wrapper_link_text {
    display: block;
    width: 100%;
}






/* ベース -------------------------------------------- */

/* 下矢印 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 15px;
    border-right: 1px solid rgba(0, 0, 0, 0.7);
    border-bottom: 1px solid rgba(0, 0, 0, 0.7);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/* グローバルナビゲーション */


.cellList {
    display: none;
}

    .close-menu {
        display: none;
    }
    .ll {
        display: none;
    }
    #sp-img {
        display: none;
    }
    .footerNav {
        display: none;
    }
   
    
}


/* ヘッダー要素----------------------------------------*/



/* バナー */
.front__price {
    position:relative;
    margin-top: 10%;
}
.front__price-top {    
    position: absolute;
    top: -5px;
    left: -300px;
    z-index: -1;
    background: #fff116;
    height: 29vw;
    width: 200%;
    transform: rotate(3deg);
    max-height: 250px;
}
@media screen and (min-width: 800px) {
    .front__price-top {
        top:35px;
    }
}

.front__price-bottom {
    max-width: 800px;
    margin: 0 auto;
    padding-bottom: 50px;
}

.front__counseling {
    max-width: 800px;
    margin: 0 auto 30px;
    padding: 0 20px;
}

@media screen and (min-width: 648px) {
    .front__counseling {
        margin-top: 50px;
    }
}

.front__counseling-img {
    display: block;
    width: 100%;
    border-radius: 8px;
}




/* sec 1--------------------------------------------*/


.secTitle {
    padding-top: 30px;
    font-size: 15px;
    text-align: center;
}

.sec{
    width: 100%;
    max-width: 648px;
    margin: 0 auto;
    padding: 20px 0;
    border-bottom: 1px solid #e0e0e0;
}

.sec-text{
    text-align: center;
    font-size: 0.3rem;
}
.sec2{
    width: 100%;
    max-width: 648px;
    margin: 0 auto;
    padding-top: 30px;
    border-bottom: 1px solid #e0e0e0;
}
.fv-title {
    width: 100%;
    max-width: 948px;
    text-align: center;
    padding: 20px 0;
}

.secH2 {
    display: block;
    width: 90%;
    max-width: 400px;
    height: 80px;
    margin: 15px auto 25px;
    text-align: center;
    font-size: 20px;
    line-height: 60px;
    font-weight: bold;
    border-radius: 40px;
    background-color: orange;
    color: #fff;
    box-shadow: 5px 5px 5px 0 rgb(209, 209, 209) ;
    background-image: url("images/button01.png");
    background-repeat: no-repeat;
    background-position: center bottom 10px;
    background-size: 6%;
    letter-spacing: 4px;
}
.secH2Span{
    font-size: 10px;
}
.sec-h2_text_wrapper {
    height: auto;
    padding: 10px 0 10px;
    margin: 10px 15px 30px 15px;
    border-left: 2px solid #eedcb3;
    border-right: 2px solid #eedcb3;
}
.sec-h2_text {
    font-size: 16px;
    margin: 15px;
}
.sec-h2_text02 {
    font-size: 16px;
    padding: 15px;
    display: none;
}
.sec-h2_text03 {
    font-size: 15px;
    padding: 15px 20px;
}
.sec-h2_text03span {
    display: block;
    text-align: center;
}
.sec-h2_text04 {
    line-height: 26px;
}

.healthy {
    text-align: center;
    width: 100%;
    max-width: 368px;
    border-radius: 30px;
    box-shadow: 5px 5px 5px 0 rgb(209, 209, 209) ;
}


/* sec 終了------------------------------------- */
/* sec3----------------------------------------- */
.sec3 {
    margin: 40px 5px 5px 5px;
    border: 3px solid #eedcb3;
    border-radius: 5px;
}
.sec3-img_wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sec3-img {
    margin-top: -40px;
    width: 80%;
}
.sec3-text {
    padding: 15px 20px 15px 60px;
}
.sec3-text01 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/1111.png) ;
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 5px center;
}
.sec3-text02 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/2222.png) ;
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 5px center;
}
.sec3-text03 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/3333.png) ;
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 5px center;
}
.sec3-text04 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/4444.png) ;
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 5px center;
}
.sec3-text05 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/5555.png) ;
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 5px center;
}

.sec3-text_span {
    padding: 0 3px;
    margin: 0 auto;
    margin-bottom: 10px;
    text-align: center;
}
.sec3-text_span02 {
    border-bottom: 4px solid #ffddff;
    font-size: 8px;
}
.sec3-img_time01 {
    width: 60%;
    padding-bottom: 15px;
}
.sec3-text_01 {
    padding: 5px 15px 20px 15px;
    font-size: 12px;
}
.sec3-time {
    height: 50px;
    background-color: #fcf8ae;
}
.sec3-text_button {
    display: block;
    color: #555555;
    width: 90%;
    height: 80px;
    line-height: 80px;
    font-size: 25px;
    background-color: yellow;
    box-shadow: gray;
    border-radius: 6px;
    text-align: center;
    margin: 25px auto;
    border: 1px solid rgb(226, 226, 226);
    box-shadow: 5px 5px 5px 0 rgb(209, 209, 209) ;
    text-shadow: 2px 2px 4px #fff, 9px 3px 8px rgba(255,255,255,0.2);
    letter-spacing: 6px;
}
.a1 {
    display: flex;
    justify-content: center;
}
.a1-img {
    width: 25px;
    height: 100%;
}
@media screen and (min-width: 648px) {
    .sec3 {
        max-width: 800px;
        padding: 30px;
        margin: 100px auto;
        margin-bottom: 30px;
    }    
    
    .sec3-img_wrapper {
        background-color: #fff;
        transform: translateY(-30px);
    }
    .a1 {
        transform: translateY(-20px);
    }
    .a1-img {
        width: 40px;
    }
    .feature-sec_title {
        font-size: 22px;
        height: 45px;
    }
    .sec3-text {
        font-size: 20px;
    }
    .sec3-text01 {
        line-height: 50px;
        background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/1111.png) ;
        background-repeat: no-repeat;
        background-size: 10%;
        background-position: -8px center;
        white-space: nowrap;
        padding-left: 80px;
    }
    .sec3-text02 {
        background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/2222.png) ;
        background-repeat: no-repeat;
        background-size: 10%;
        background-position: -3px center;
        padding-left: 80px;
        margin: 30px 0;
    }
    .sec3-text03 {
        background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/3333.png) ;
        background-repeat: no-repeat;
        background-size: 10%;
        background-position: -3px center;
        padding-left: 80px;
        margin: 30px 0;
    }
    .sec3-text04 {
        background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/4444.png) ;
        background-repeat: no-repeat;
        background-size: 10%;
        background-position: -3px center;
        padding-left: 80px;
        margin: 30px 0;
    }
    .sec3-text05 {
        background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/5555.png) ;
        background-repeat: no-repeat;
        background-size: 10%;
        background-position: -3px center;
        padding-left: 80px;
        margin: 30px 0;
    }
    .sec3-text_span02 {
        font-size: 14px;
    }
    

}

/* sec 終了------------------------------------- */





/* sec4----------------------------------------- */
.sec4 {
    text-align: center;
    margin: 20px 10px 30px;
}

.sec4 div {
    max-width: 648px;
    width: 100%;
    margin: 0 auto;
    padding: 20px;
    border: 2px dotted #67696A;
    border-radius: 5px;
}
.sec4Text {
    padding: 0　15px　15px;
    margin-bottom: 10px;
    text-align: center;
}


/* sec2-------------------------------------------- */









/* sec4 予約票-------------------------------------------*/
.time {
    width: 100%;
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #fcf8ae;
}
/* #time {
    margin: 20px 0 20px;
} */
.time1 {
    display: block;
    width: 90%;
    max-width: 368px;
    height: 80px;
    border-radius: 50px;
    color: #fff;
    background-color: #ff9b02;
    margin: 0 auto;
    text-align: center;
    padding-top: 10px;/* 
    line-height: 28px; */
    font-size: 1.8rem;
    box-shadow: 5px 5px 5px 0 rgb(209, 209, 209) ;
    cursor: default;
    opacity: 0.8;
}
/* .time1 a {
    display: inline-block;
    width: 368px;
    height: 80px;
    color: #fff;
} */
.time-text {
    position: relative;
}
.time-text_span {
    display: inline-block;
    margin: 0 auto;
    font-size: 13px;
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    color: #fff;
    white-space: nowrap;
}


/* sec4 予約票終了-----------------------------------------*/
/* フロントページpcページ--------------------------------------------- */
@media screen and (min-width: 648px ) {
    .time {
        margin-top: 30px;
        background-color: #fff;

    }
    
    .sec4>div {
        max-width: 600px;
    }
}






/* フロントページpcページ終了--------------------------------------------- */












/* footer--------------------------------------------------- */

.footer {
    width: 100%;
    height: auto;
    border-top: 1px solid #67696A;
    border-bottom: 1px solid #67696A;
    text-align: center;
}
.footerListSpan {
    display: block;
    width: 230px;
    height: 15px;
    line-height: 13px;
    font-size: 10px;
    text-align: left;
    margin: 0 auto;
    padding-left: 8px;
}
.footer-list {
    letter-spacing: 2px;
}
.arrow {
    margin-left: 10px;
    width: 40px;
    height: 21px;
    position: absolute;
    transform: translateY(-30%);
    top: 50%;
    opacity: 0.8;
    background: url(images/arrowright.png) no-repeat;
    background-size: 43%;
}
.arrow:hover {
    opacity:0.5;
}

.footer-list li {
    border-bottom: 1px dotted #67696A;
    margin-left: 0;
    height: auto;
    min-height: 65px;
    font-size: 18px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.footer-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 65px;
    height: auto;
    padding: 12px 8px;
    transition: 1s;
    box-sizing: border-box;
}
.footer-list li a:hover {
    color: #FF7C00;
    transition: 0.5s;
}

.footer-text {
    padding: 10px 0 ;
    margin-bottom: 80px;
    font-size: 10px;
}

#footerNav {
    margin: 0 auto;
    width: 100%;
    height: 60px;
    position: fixed;
    z-index: 9999999999;
    bottom: 0;
    font-size: 11px;
    display: inline-block;
    background-color: orange;
    opacity: 0.9;
}
.footerNav {
    display: flex;
    justify-content: center;
}


.footerNavList a {
    padding: 15px 20px 0 0;
    vertical-align: middle;
    color: #fff;
    font-size: 13px;
    width: 100%;
    height: 60px;
    opacity: 1;
}
.footernav {
    width: 375px;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}
.footernav a {
    width: 120px;
    height: 80px;
    text-align: center;
    line-height: 80px;
}
.footer-pc_section {
    display: none;
}



/* footer 終了------------------------------------------------*/
@media screen and (min-width: 648px ) {
    .footer-list {
        display: none;
    }
    #footerNav {
        display: none;
    }
    .footer-pc_section {
        max-width: 948px;
        width: 100%;
        height: 190px;
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        font-size: 14px;
        letter-spacing: 1px;
        margin-top: 10px;
        margin-bottom: 15px;
        border-left: 1px solid rgba(0,0,0,0.2);
        border-right: 1px solid rgba(0,0,0,0.2);
    }
    .footer-pc_wrapper {
        width: 300px;
        height: 190px;
        border-right: 1px solid rgba(0,0,0,0.2);
        padding: 0 15px;
        position: relative;
        
    }
    .footer-pc_wrapper_img {
        background-color: #66ff00;
        border-radius: 3px;
        margin-top: 5px;
        min-width: 255px;
        max-width: 255px;
        position: absolute;
        top: 7px;
        left: 11px;
    }

    .footer-pc_wrapper_list01 {
        width: 100%;
        height: 47.5px;
        line-height: 47.5px;
        border-bottom: 1px solid rgba(0,0,0,0.2);
        white-space: nowrap;
    }
    .footer-pc_wrapper_list01:hover {
        color: orange;
        transition: 1s;
        background-color: rgba(255, 166, 0, 0.10);
        transform: translate(2px,2px);
    }
    .footer-pc_wrapper_course {
        margin-top: 40px;
        padding-bottom: 13px;
        border-bottom: 1px solid rgba(0,0,0,0.2);
    }
    .footer-pc_wrapper_list02 {
        width: 100%;
        height: 47.5px;
        line-height: 47.5px;
        border-bottom: 1px solid rgba(0,0,0,0.2);
        white-space: nowrap;
    }
    .footer-pc_wrapper_list02:hover {
        color: orange;
        transition: 1s;
        background-color: rgba(255, 166, 0, 0.10);
        transform: translate(2px,2px);
    }

    .footer-pc_wrapper_list02>span {
        letter-spacing: 0;
    }

    .footer-pc_wrapper01 {
        flex-shrink: 2;
        height: 190px;
        margin: 0 15px;
        border-bottom: 1px solid rgba(0,0,0,0.2);

    }
    .footer-pc_wrapper01_text {
        font-size: 11px;
        letter-spacing: none;
        text-align: left;
        white-space: nowrap;
    }
    .footer-pc_wrapper01_img {
        padding-left: 10px;
        background-color: #66ff00;
        border-radius: 5px;
    }
    
    .footer-pc_wrapper01_access {
        display: block;
        width: 100%;
        max-width: 183px;
        min-width: 183px;
        line-height: 50px;
        height: 80px;
        border: 1px solid rgba(0,0,0,0.2);
        border-radius: 3px;
        margin: 3px;
        font-size: 18px;
        cursor: default;
    }
    .footer-pc_wrapper01_access:hover {
         /* color: orange; */
       /*  transition: 1s; */
        /* background-color: rgba(255, 166, 0, 0.10); */
        /* transform: translate(2px,2px); */
        cursor: default;
    }

    .footer-text {
        margin-bottom: 0;
    }

}






/* SP nav ----------------------------------------------------*/

/* SP nav 終了-------------------------------------------------*/














/*メニューボタンを追加する-----------------------------------------*/
.drawer-menu {
    box-sizing: border-box;
    position: fixed;
    z-index: 100;
    top: 0px;
    right: 0;
	width: 100%;/*メニューの横幅*/
	height: 100%;/*メニューの縦幅*/
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: /* perspective(500px)  */translate(105%);
    transform: /* perspective(500px) */ translate(105%);
    opacity: 0.7;
	/*↓メニュー枠線のデザイン。ご自由に*/
    background: #fff;
	box-shadow: 0 0 0 5px rgb(207, 207, 207);
    border: 1px dashed #ccc;
    margin-left: 15px;
    color: #454545;
    background-color: white;
	/*↑メニュー枠線のデザイン*/
}

/*ボタンを押したときの左側の黒い部分*/
.close-menu {
    position: fixed;
    top: 0;
    width: 1200px;
    height: 1200px;
    background: rgba(0,0,0,0.2);
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .1s;
    transition-duration: .1s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    /* visibility: hidden; */
    /* opacity: 0; */
}

.bar {
    position: absolute;
    top: 5px;
    left: 5px;
    display: block;
	width: 30px;/*横線の幅*/
	height: 2px;/*横線の太さ*/
	background: #888;/*ボタンの色*/
    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

.bar.middle {
    top: 13px;
    opacity: 1;
}

.bar.bottom {
    top: 21px;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
}

.menu-btn {
    position: fixed;
    display: block;
	top: 3px;/*ボタンの場所。右上にしたければtop: 10px*/
    right: 4px;
	width: 40px;
	height: 40px;
    font-size: 5px;
    text-align: center;
    cursor: pointer;
		color: #888;
    z-index: 2147483647;/*重なり順を一番上に*/
}
.ll {
    width: 40px;
    height: 40px;
    padding-top: 10px;
    border: 1px solid #888;
    border-radius: 5px;
    background-color: white;/* 
    opacity: 0.8; */
}

.check:checked ~ .drawer-menu {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    z-index: 2147483646;
}

.check:checked ~ .contents {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateX(-250px);
    -ms-transform: translateX(-250px);
    transform: translateX(-250px);
}

.check:checked ~ .menu-btn .menu-btn__text {
    visibility: hidden;
    opacity: 0;
    
}

.check:checked ~ .menu-btn .bar.top {
    width: 43px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.check:checked ~ .menu-btn .bar.middle {
    opacity: 0;
}

.check:checked ~ .menu-btn .bar.bottom {
    width: 44px;
    top: 35px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.check:checked ~ .close-menu {
    -webkit-transition-duration: 2s;
    transition-duration: 2s;
    -webkit-transition-delay: 2.1s;
    transition-delay: 2.1s;
    background: rgba(0,0,0,.5);
    visibility: visible;
    opacity: 1;
	z-index: 2147483647;/*重なり順を一番上に*/
}

.menu-btn:hover .bar {
    background: #888;
}

.menu-btn:hover .menu-btn__text {
    color: #888;
}

.menu-btn__text {
    position: absolute;
    bottom: 0px;
    left: 2px;
    right: 0;
    margin: auto;
    color: #888;
    -webkit-transition: all .1s;
    transition: all .1s;
    display: block;
    visibility: visible;
    opacity: 1;
	font-size:10px;
}

.check {
    display: none;
}

.drawer-menu ul {
    position:relative;
	width:100%;
	list-style: none;
}

.drawer-menu li {
    text-align: center;
    border-bottom: 1px dotted #CCC;/*各メニューリストの下線*/
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 70px;
}

.drawer-menu li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
	height: auto;
    min-height: 70px;
    padding: 10px 8px;
    font-size: 15px;
    -webkit-transition: all .8s;
    transition: all .8s;
    box-sizing: border-box;
    line-height: 1.35;
}

.navMenu {
    letter-spacing:2px;
}

.navMenu ul li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    height: auto;
    min-height: 70px;
    margin-top: 0;
} 

.navMenu ul li a:hover {
    font-size: 20px;
    color: orange;
} 
.drawer-menu-sns {
    padding: 15px 30px 0 20px ;
    margin: 0 auto;
    width: 200px;
    height: 100px;
    display: flex;
    justify-content: space-around;
}
.drawer-menu-sns img {
    width: 60px;
    height: 60px;
}

.span {
    font-size: 10px;
    padding-bottom: 0;
    margin-top: 2px;
    color: #2ffc00;
    opacity: 0.6;
}

.drawer-menu__reserve {
    cursor: default;
}

.drawer-menu__reserve-note {
    color: inherit;
    opacity: 1;
}
/*メニューボタンここまで-------------------------------------*/














/* オーナーページ------------------------------------------ */
#greeting-sec{
    padding: 5px;
    margin: 0 auto;
    height: auto;
    margin-bottom: 5vw;
}
.greeting-sec {
    max-width: 948px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    border: 3px solid #eedcb3;
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
}
.greeting-wrapper-title_img {
    text-align: center;
}
.greeting-title_img {
    margin-top: -50px;
    width: 80%;
}
.greeting-img {
    width: 100%;
    padding: 5px;
    border-radius: 5px;
}

.greeting-sec_h2 {
    text-align: center;
    padding: 20px;
}

.greeting-sec_wrapper {
    margin: 0 5px;
}
.greeting-sec_h3 {
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
}
#greeting-sec_h3 {
    font-size: 16px;
    padding-left: 5px;
}

.greeting-sec_wrapper_text {
    font-size: 14px;
    margin-top: 35px;
    margin-bottom: 30px;
    padding: 0 20px 20px;
}
@media screen and (min-width: 648px ) {
    #greeting-sec {
        height: auto;
    }
    .greeting-sec {
        transform: translateY(60px);
        max-width: 800px;
    }
}




/* オーナーページ--終了---------------------------------------- */



/* 
投球障害--------------------------------
野球選手ケア------------------------------
リラクゼーション --------------------------
*/
.care-sec_text {
    font-size: 12px;
    padding: 0 15px 10px;
    line-height: 14px;
    letter-spacing: 2px;
}



/* 
投球障害--------------------------------
野球選手ケア------------------------------
リラクゼーション --------------------------
*/





/* リラクゼーションコースページ------------------------------------------ */
.relaxation-sec {
    max-width: 948px;
    width: 99%;
    margin: 0 auto;
    padding-right: 4px;
    padding-left: 4px;
}
.relaxation-sec__top {
    border:1px solid lightgrey;
    border-radius:5px;
    height: 32vw;
    margin-bottom: 4%;
    position: relative;
    max-width: 100vw;
    max-height: 258px;
}
.relaxation-sec__top::before {
    position: absolute;
    content: "";
    border:1px solid lightgrey;
    border-radius:50%;
    height: 29%;
    width: 10%;
    top: -15%;
    right: -1%;
    background:white;
    z-index: 100;
    background-image: url("images/care.png");
    background-size: 110%;
    background-repeat: no-repeat;
}
.relaxation-sec__top::after {
    content: "";
    transform:translate(1%,1.2%);
    border:1px solid lightgrey;
    border-radius:5px;
    height: 32vw;
    display: block;
    background: url(images/67massage.png) center;
    background-size: contain;
    background-repeat: no-repeat;
    max-height: 258px;

}


.relaxation-sec_wrapper p {
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 0 4%;
}
.relaxation-sec_wrapper {
    border: 1px solid #eedcb3;
    margin-top: 4%;
    margin-bottom: 4%;
}
@media screen and (min-width:648px ) {
    .relaxation-sec {
        max-width: 800px;
        margin-top: 70px;
        margin-bottom: 30px;
    }
}
/* リラクゼーションコースページ-終了----------------------------------------- */


/* 小顔整体 */
.page_ttl {
	font-size:2.5rem;
	color:#fa6422;
	text-align:center;
	padding-bottom:1rem;
}
.facecare-sec {
    width: 100%;
}
.facecare-sec__top {
    border:1px solid lightgrey;
    border-radius:5px;
    height: 36vw;
    margin-bottom: 4%;
    position: relative;
    max-width: 100vw;
    max-height: 258px;
}
.facecare-sec__top::before {
    position: absolute;
    content: "";
    border: 1px solid lightgrey;
    height: 18%;
    width: 7%;
    top: -11%;
    right: -1%;
    background: white;
    z-index: 100;
    background-image: url(images/face.png);
    background-size: 120%;
    background-repeat: no-repeat;
    background-position-y: 25%;
    background-position-x: 38%;
}
.facecare-sec__top::after {
    content: "";
    transform:translate(1%,1.2%);
    border:1px solid lightgrey;
    border-radius:5px;
    height: 36vw;
    display: block;
    background: url(images/67face.png)center;
    background-size: contain;
    background-repeat: no-repeat;
    max-height: 258px;

}






/* 投球障害コースページ------------------------------------------ */
/* .pitching-sec {
    max-width: 948px;
    width: 100%;
    margin: 0 auto;
}

.pitching-sec_wrapper p {
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 0 10px;
}
.pitching-sec_wrapper {
    border: 3px solid #eedcb3;
    border-radius: 5px;
    margin: 5px;
}
@media screen and (min-width:648px ) {
    .pitching-sec {
        max-width: 800px;
        margin-top: 70px;
        margin-bottom: 30px;
    }
} */
/* 投球障害コースページ-終了----------------------------------------- */






/* 野球ケアコースページ------------------------------------------ */
/* .care-sec {
    max-width: 948px;
    width: 100%;
    margin: 0 auto;
}


.care-sec_wrapper p {
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 0 20px;
}
.care-sec_wrapper {
    border: 3px solid #eedcb3;
    border-radius: 5px;
    margin: 5px;
}
@media screen and (min-width:648px ) {
    .care-sec {
        max-width: 800px;
        margin-top: 70px;
        margin-bottom: 30px;
    }
} */
/* 野球ケアコースページ-終了----------------------------------------- */









/* 選ばれる5つの理由ページ------------------------------------------ */


.feature-sec_title {
    line-height: 20px;
    padding-top: 10px;
    padding-left: 10px;
    border-bottom: 2px dotted yellowgreen;
}

.feature-sec_text {
    margin: 15px 10px 15px;
    padding: 20px 30px 30px;
    font-size: 14px;
    line-height: 20px;
    background-color: #fff5df;
    border-radius: 10px 40px 30px 40px / 5px 40px 10px 100px;
    font-weight: 540;
}

.features-page__ttl {
    font-size: 1.4rem;
    line-height: 1.5;
    padding: 0 12px 1.5rem;
}

.features-banner-ttl {
    color: #fa6422;
    text-align: center;
    font-size: 1.4rem;
    line-height: 1.45;
    font-weight: 700;
    margin: 1.2rem 12px 1.2rem;
    display: block;
}

.features-banner-ttl__icon {
    display: none;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}

.features-banner-ttl__text {
    text-align: center;
    line-height: 1.45;
}

@media screen and (min-width: 648px) {
    .features-banner-ttl {
        font-size: 1.85rem;
        margin: 0 20px 1.5rem;
    }
    .features-banner-ttl__icon {
        width: 48px;
        height: 48px;
    }
}

/* 長いナビ文言の改行対応 */
.nav-wrapper_list .nav-wrapper_link {
    line-height: 1.25;
    padding: 6px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    white-space: normal;
}

.footer-pc_wrapper_list02 {
    white-space: normal !important;
    height: auto !important;
    min-height: 47.5px;
    line-height: 1.3 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 6px 0;
}

.footer-list li a {
    white-space: normal;
    line-height: 1.4;
    text-align: center;
}

.footer-list__reserve {
    padding-bottom: 22px;
}

.footer-list__reserve-link {
    cursor: default;
    position: relative;
}

.footer-list li a .footer-list__note {
    position: absolute;
    left: 50%;
    bottom: 4px;
    top: auto;
    transform: translateX(-50%);
    font-size: 12px;
    white-space: nowrap;
    line-height: 1.2;
}

.features-page .sec3-text {
    display: flex;
    align-items: center;
    min-height: 48px;
    line-height: 1.5;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
}

.features-page .sec3-text01,
.features-page .sec3-text02,
.features-page .sec3-text03,
.features-page .sec3-text04,
.features-page .sec3-text05 {
    background-position: 5px center;
}

@media screen and (min-width: 648px) {
    .features-page .sec3-text {
        font-size: 22px;
    }

    .features-page .sec3-text01,
    .features-page .sec3-text02,
    .features-page .sec3-text03,
    .features-page .sec3-text04,
    .features-page .sec3-text05 {
        background-position: left center;
        line-height: 1.5;
        white-space: normal;
        margin: 30px 0;
    }
}

/* 選ばれる5つの理由ページ終了------------------------------------------ */

/* コンテンツページ共通------------------------------------------ */
.content-page p {
    margin-top: 12px;
    margin-bottom: 12px;
    line-height: 1.8;
    font-size: 14px;
}

.content-page__heading {
    margin: 2rem 4% 1rem;
    padding-bottom: 0.5rem;
    font-size: 1.15rem;
    line-height: 1.6;
    color: #fa6422;
    border-bottom: 2px dotted #eedcb3;
}

.content-page__heading--features {
    text-align: center;
    font-size: 1.35rem;
}

@media screen and (min-width: 648px) {
    .content-page__heading--features {
        font-size: 1.55rem;
    }
}

.content-page__heading-icon {
    display: none;
}

.content-page__subheading {
    margin: 1.5rem 4% 0.5rem;
    font-size: 1rem;
    color: #67696A;
}

.content-page__lead {
    font-weight: 700;
    text-align: center;
}

.content-page__list {
    margin: 0.5rem 8% 1rem;
    padding-left: 1.2rem;
    list-style: disc;
}

.content-page__list li {
    list-style: disc;
    margin-bottom: 0.35rem;
    font-size: 14px;
    line-height: 1.6;
}

.content-page__img-wrap {
    margin: 1.5rem 4%;
    border-radius: 8px;
    overflow: hidden;
}

.content-page__img {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border-radius: 8px;
}

.bodycare-page > .relaxation-sec > .content-page__img-wrap {
    margin: 0 4% 1rem;
}

.bodycare-page .relaxation-sec_img02,
.page-bodycare .relaxation-sec_img02,
.bodycare-page .content-page__img,
.page-bodycare .content-page__img,
#bodycare-photo-1,
#bodycare-photo-2,
#bodycare-photo-3,
#bodycare-photo-4 {
    border-radius: 8px;
    padding: 0;
    width: 100%;
    display: block;
}

.content-page__signature {
    margin-top: 2rem !important;
    text-align: right;
    line-height: 1.8;
}

.greeting-page__ttl {
    padding-top: 1rem;
}

/* 初めての方へ：左揃え＋左右paddingで縦位置を揃える */
.page-greeting .greeting-sec_wrapper,
.greeting-page .greeting-sec_wrapper {
    margin: 0;
    padding: 0 4%;
}

.page-greeting .content-page,
.page-greeting .content-page p:not(.content-page__signature),
.page-greeting .content-page__lead,
.page-greeting .content-page__heading,
.page-greeting .content-page__list,
.greeting-page .content-page,
.greeting-page .content-page p:not(.content-page__signature),
.greeting-page .content-page__lead,
.greeting-page .content-page__heading,
.greeting-page .content-page__list {
    text-align: left;
}

.page-greeting .content-page__heading,
.greeting-page .content-page__heading {
    margin-left: 0;
    margin-right: 0;
}

.page-greeting .content-page__list,
.greeting-page .content-page__list {
    margin-left: 1.2rem;
    margin-right: 0;
}

.page-greeting .content-page__img,
.greeting-page .content-page__img,
.page-greeting .greeting-img,
.greeting-page .greeting-img {
    display: block;
    width: calc(100% - 40px);
    max-width: none;
    margin: 1.5rem auto;
    padding: 0;
    border-radius: 8px;
}

.page-greeting .content-page p.content-page__signature,
.greeting-page .content-page p.content-page__signature {
    text-align: right;
}

/* 整体ページは左揃え（先頭見出しは除く） */
.page-bodycare .page_ttl,
.page-bodycare .content-page,
.page-bodycare .content-page p,
.page-bodycare .content-page__lead,
.page-bodycare .content-page__heading:not(.content-page__heading--features),
.page-bodycare .content-page__subheading,
.page-bodycare .content-page__list,
.bodycare-page .page_ttl,
.bodycare-page .content-page,
.bodycare-page .content-page p,
.bodycare-page .content-page__lead,
.bodycare-page .content-page__heading:not(.content-page__heading--features),
.bodycare-page .content-page__subheading,
.bodycare-page .content-page__list {
    text-align: left;
}

@media screen and (min-width: 648px) {
    .content-page p,
    .content-page__list li {
        font-size: 16px;
    }
    .content-page__heading {
        font-size: 1.35rem;
    }
}
/* コンテンツページ共通終了------------------------------------------ */




















/* アクセスページ------------------------------------------ */

.maps-text {
    font-size: 12px;
    padding: 10px;
}
.maps-title {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/mapsicon.png);
    background-repeat: no-repeat;
    background-size: contain;
    padding-left: 50px;
    display: inline-block;
    margin: 0 0 20px 20px;
    
}
.maps-text {
    max-width: 948px;
    margin: 0 auto;
}

.maps span {
    border-bottom: 6px solid orange;
    display: inline-block;
}
.maps-img {
    margin-top: 10px;
    margin-bottom: 10px;
}
@media screen and (min-width: 648px ) {
    
    .maps-title {
        display: block;
        width: 100%;
        max-width: 948px;
        height: 50px;
        padding: 3px 0 10px 60px;
        margin: 0 auto;
        margin-bottom: 20px;
        margin-top: 7%;
    }
    .maps-text {
        margin-top: 10px;
        margin-bottom: 30px;
        font-size: 14px;
    }
    .maps-img {
        max-width: 948px;
        margin: 0 auto;
    }
    .maps-img_wrapper {
        max-width: 948px;
        margin: 0 auto;
    }
    .maps {
        max-width: 948px;
        margin: 0 auto;
    }
}

/* アクセスページ-終了----------------------------------------- */






/* ネット予約ページ------------------------------------------ */
.reservation-sec {
    max-width: 948px;
    width: 100%;
    padding-left: 5px;
    margin: 0 auto;
}
.reservation-sec h2 {
    background-image: url(https://shibukawa-massage-happy.com/wp-content/uploads/2021/07/reservation.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 20px;
    margin-bottom: 10px;
}
.reservation-sec span {
    margin-left: 50px;
    border-bottom: 5px solid orange;
}

#reservation-sec_wrapper {
    width: 100%;
    max-width: 948px;
    margin: 0 auto;
}
.reservation-sec_wrapper {
    width: 100%;
    max-width: 648px;
    margin: 20px auto 50px;
    background-color: #fff;
    border-radius: 5px;
}

.reservation-sec_wrapper p {
    margin-bottom: 10px;
    padding-left: 20px;
    font-size: 12px;
}
.reservation-sec_wrapper h3 {
    padding-left: 10px;
}
@media screen and (min-width: 648px ) {
    .relaxation-sec_wrapper {
        max-width: 948px;
    }
    
    .reservation-sec {
        padding: 50px;
    }
    }

/* ネット予約ページ-終了----------------------------------------- */

/* 固定ページ------------------------------------------ */
#page-sec {
    max-width: 948px;
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
.page-sec {
    max-width: 948px;
    width: 100%;
    margin-top: 20px;
    padding: 5px;
}
/* 固定ページ-終了----------------------------------------- */
/* シングルページ------------------------------------------ */
#single-sec {
    max-width: 948px;
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
.single-sec {
    max-width: 948px;
    width: 100%;
    margin-top: 20px;
    padding: 5px;
}
/* シングルページ-終了----------------------------------------- */


