#main {
    /*padding-top: 181px;*/
    /*padding-top: 81px;*/
    padding-top: 80px;
}

@media only screen and (max-width: 1250px) {
    #main {
        /*padding-top: 120px;*/
        padding-top: 80px;
    }
}

@media only screen and (max-width: 750px) {
    #main {
        /*padding-top: 100px;*/
        padding-top: 0px;
    }
}

#bath .pc {
    display: block !important;
}

#bath .sp {
    display: none !important;
}

#bath .caption0 {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

#bath section {
    width: 100%;
    position: relative;
    box-sizing: border-box;
}

#bath section .secin {
    font-family: 'Noto Serif JP', serif;
    color: #002538;
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding: 60px;
}

#bath section .secin figure {
    position: relative;
    box-sizing: border-box;
}

#bath section .secin figure img {
    display: block;
    vertical-align: bottom;
    width: 100%;
}

#bath section .secin figure .flrico {
    width: 120px;
    position: absolute;
    background-color: #002538;
    text-align: center;
    color: #fff;
    font-size: 18px;
    box-sizing: border-box;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    left: -20px;
    top: 10%;
}

@media only screen and (max-width: 750px) {
    #bath section .secin figure .flrico {
        width: 70px;
        padding: 6px;
        font-size: 14px;
        top: 6%;
    }
}

#bath section .secin h3 {
    text-align: center;
    font-size: 32px;
    margin-bottom: 60px;
}

#bath section .secin h3 span {
    color: rgba(0, 37, 56, 0.5);
    font-family: trajan-pro-3, serif;
    font-size: 18px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (max-width: 750px) {
    #bath section .secin h3 {
        font-size: 4.6vw;
        margin-bottom: 30px;
    }

    #bath section .secin h3 span {
        font-size: 2.3vw;
    }
}

#bath section .secin h4 {
    text-align: center;
    font-size: 20px;
    margin-bottom: 20px;
}

@media only screen and (max-width: 750px) {
    #bath section .secin h4 {
        font-size: 4vw;
    }
}


@media only screen and (max-width: 750px) {
    #bath section .secin {
        padding: 40px;
        padding-left: 10px;
        padding-right: 10px;
    }
    #bath section.sec1 .secin {
        padding-bottom: 8vw;
    }
}

#bath section.ptit {
    background-size: cover;
    background-position: center center;
    background-image: url("../img/onsenspa/main_02.jpg");

}

#bath section.ptit .secin {
    padding-top: 160px;
    padding-left: 20px;
}
#bath section.ptit .secin {
    padding-top: 100px;
    padding-left: 0px;
    padding-bottom: 100px;
}
#bath section.ptit .secin h2 {
    text-align: left;
    font-size: 42px;
    color: #989188;
    line-height: 1.2em;
    color: #fff;
    margin-bottom: 30px;

    text-align: center;

    margin: 0;
    line-height: 1;
    text-shadow:0px 0px 1px rgba(0,0,0,0.5),
    0px 0px 2px rgba(0,0,0,0.5),
    0px 0px 3px rgba(0,0,0,0.5),
    0px 0px 4px rgba(0,0,0,0.5),
    0px 0px 5px rgba(0,0,0,0.5),
    0px 0px 6px rgba(0,0,0,0.5),
    0px 0px 12px rgba(0,0,0,0.5);
}

#bath section.ptit .secin p.lead {
    font-size: 1.4em;
    color: #fff;
    text-align: left;
}
p.h2t{
    font-size: 42px;
    letter-spacing: 4px;
    text-align: center;
    color: #786d5e;
    font-family: 'Noto Serif JP', serif;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 40px;
}
@media only screen and (max-width: 750px) {
    p.h2t{
        font-size: 7vw;
        padding-bottom: 3vw;
        margin-bottom: 6vw;
    }
}
p.h2t::before{
    width: 100px;
    height: 1px;
    content: "";
    background-color: #786d5e;
    position: absolute;
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%) ;
    -moz-transform: translateX(-50%) ;
    -ms-transform: translateX(-50%) ;
    transform: translateX(-50%) ;
}
p.p1{
    font-size: 18px;
    text-align: center;
    color: #786d5e;
    font-family: 'Noto Serif JP', serif;
}

@media only screen and (max-width: 750px) {
    p.p1{
        font-size: 4.5vw;
        line-height: 1.6;
    }
    #bath section.ptit {
        /*height: 62vh;*/
        background-image: url("../img/onsenspa/main_01@sp.jpg");
    }

    #bath section.ptit .secin {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    #bath section.ptit .secin h2 {
        text-align: center;
        font-size: 7vw;
        letter-spacing: 4px;
    }
    #bath section.ptit .secin p.lead {
        font-size: 4vw;
        text-align: center;
    }
}

#bath section.sec1 {
    /*background: radial-gradient(circle at 24.1% 68.8%, rgb(50, 50, 50) 50%, rgb(0, 0, 0) 90.4%);*/
    /*background-color: #fffaf0;*/
   background-color: #f1e5cd;
}

#bath section.sec1 .secin .sec1a {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec1 .secin .sec1a {
        max-width: 200px;
        margin-bottom: 20px;
    }
}
#bath section.sec1 .secin .sec1c {
    position: relative;
    text-align: center;
    max-width: 900px;
    width: 100%;
    /*height: 450px;*/
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    margin-bottom: 0px;
    /*box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;*/
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
#bath section.sec1 .secin .sec1c figure{
    position: relative;

}
#bath section.sec1 .secin .sec1c figure .note{
        position: absolute;
            right: 5px;
            bottom: 5px;
    z-index: 3;
font-size: 12px;
    font-feature-settings : "palt";
    letter-spacing: 0;
    color: #fff;
    right: 24px;
    bottom: 10px;
}
#bath section.sec1 .secin .sec1c img{
    z-index: 2;
    /*border-radius:40px;*/
    /*border: 4px solid #FFFFFF;*/
    position: relative;
    display: block;
}
/*#bath section.sec1 .secin .sec1c::before {*/
/*    content: '';*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    background-image: radial-gradient(#4c9ac0 8%, transparent 16%), radial-gradient(#4c9ac0 8%, transparent 16%);*/
/*    background-position: 0 0, 14px 14px;*/
/*    background-size: 24px 24px;*/
/*    position: absolute;*/
/*    top: -30px;*/
/*    left: 30px;*/
/*    z-index: 1;*/

/*    border-radius:40px;*/
/*}*/
/*#bath section.sec1 .secin .sec1c::after {*/
/*    content: '';*/
/*    background-color: #4c9ac0;*/
/*    !*background: repeating-linear-gradient( -45deg, #4c9ac0, #4c9ac0 5px, #ffffff 5px, #ffffff 10px );*!*/
/*    background: repeating-linear-gradient( -45deg, #ffcf27, #ffcf27 2px, #ffffff 2px, #ffffff 10px );*/

/*    width: 100%;*/
/*    height: 100%;*/
/*    position: absolute;*/
/*    top: 30px;*/
/*    left: -30px;*/
/*    z-index: 1;*/

/*    border-radius:40px;*/
/*}*/
#bath section.sec1 .secin .sec1c .mainc {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    z-index: 5;
    width: 100%;
    max-width: 500px;
}
@media screen and (max-width: 584px){
    #bath section.sec1 .secin .sec1c {
        width: 100vw;
        margin-left: calc(-1 * (100vw - 100%) / 2);
        margin-bottom: 8vw;
        /*margin-top: 20px;*/
        /*width: 100%;*/
        /*height: 33vh;*/
    }
    #bath section.sec1 .secin .sec1c figure .note{
        font-size: 2.5vw;
        position: absolute;
        right: auto;
        bottom: 5px;
        left: 5px;
        text-align: left;
    }
    #bath section.sec1 .secin .sec1c .mainc  {
        width: 80%;
        max-width: 140px;
    }
}
#bath section.sec1 .secin .sec1c iframe{
    width: 100%;
    left: 0%;
    top: 0%;

}
#bath section.sec1 .secin .sec1b {
    position: relative;
    text-align: center;
}

#bath section.sec1 .secin .sec1b li {
    width: 30%;
    display: inline-block;
    float: none !important;
    margin-right: 1%;
    margin-left: 1%;
    background-color: #786d5e;
    padding-bottom: 10px;
    vertical-align: top;
}

#bath section.sec1 .secin .sec1b li h3 {
    color: #002538;
    border-bottom: 2px solid #002538;
    margin-bottom: 10px;
    font-size: 22px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#bath section.sec1 .secin .sec1b li p {
    color: #002538;
    min-height: 80px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec1 .secin .sec1b li {
        width: 90%;
        margin: 0;
        margin-bottom: 10px;
        margin-left: auto;
        margin-right: auto;
    }

    #bath section.sec1 .secin .sec1b li:last-child {
        margin-bottom: 0;
    }
}

#bath section.sec2 {
    background-color: #002538;

    padding-bottom: 40px;
}

#bath section.sec2 .bg {
    position: relative;
    display: block;
    vertical-align: bottom;
    width: 100%;
}

#bath section.sec2 .mainimg {
    position: relative;
    margin-bottom: 40px;
}

#bath section.sec2 .mainimg .mimg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
}

#bath section.sec2 .mainimg .mimg li {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    opacity: 0;
    z-index: 4;
}

#bath section.sec2 .mainimg .mimg li img {
    display: block;
    vertical-align: bottom;
    width: 100%;
    z-index: 12;
}

#bath section.sec2 .mainimg .mimg li .note {
    font-weight: 500;
    position: absolute;
    right: 10px;
    bottom: 45px;
    font-size: 12px;
    z-index: 12;
    line-height: 1.4em;
    color: #786d5e;
    font-feature-settings: "pwid";
    letter-spacing: 0px;
    text-align: right;
    text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5), 0px 0px 2px rgba(0, 0, 0, 0.5), 0px 0px 3px rgba(0, 0, 0, 0.5), 0px 0px 4px rgba(0, 0, 0, 0.5), 0px 0px 5px rgba(0, 0, 0, 0.5), 0px 0px 6px rgba(0, 0, 0, 0.5), 0px 0px 12px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 750px) {
    #bath section.sec2 .mainimg .mimg li .note {
        bottom: 15px;
    }
}

#bath section.sec2 .mainimg .mainsldt {
    position: absolute;
    left: 50%;
    bottom: 20px;
    z-index: 322;
    text-align: center;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

#bath section.sec2 .mainimg .mainsldt li {
    display: inline-block;
    width: 40px;
    margin-right: 4px;
    margin-left: 4px;
    height: 4px;
    background-color: #fff;
    box-sizing: border-box;
    cursor: pointer;
    float: none !important;
}

@media only screen and (max-width: 750px) {
    #bath section.sec2 .mainimg .mainsldt {
        width: 100%;
        bottom: 10px;
    }

    #bath section.sec2 .mainimg .mainsldt li {
        height: 2px;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.sec2 .mainimg {
        margin-bottom: 10px;
    }
}
#bath section.sec2.act7 .mainimg .mimg li.s7,
#bath section.sec2.act2 .mainimg .mimg li.s2, #bath section.sec2.act3 .mainimg .mimg li.s3, #bath section.sec2.act4 .mainimg .mimg li.s4, #bath section.sec2.act5 .mainimg .mimg li.s5, #bath section.sec2.act6 .mainimg .mimg li.s6, #bath section.sec2.act1 .mainimg .mimg li.s1 {
    opacity: 1;
    -webkit-transition: 2s;
    -moz-transition: 2s;
    -o-transition: 2s;
    transition: 2s;
    z-index: 8;
}
#bath section.sec2.act7 .mainimg .mainsldt li.s7,
#bath section.sec2.act2 .mainimg .mainsldt li.s2, #bath section.sec2.act3 .mainimg .mainsldt li.s3, #bath section.sec2.act4 .mainimg .mainsldt li.s4, #bath section.sec2.act5 .mainimg .mainsldt li.s5, #bath section.sec2.act6 .mainimg .mainsldt li.s6, #bath section.sec2.act1 .mainimg .mainsldt li.s1 {
    background-color: #002538;
}

#bath section.sec2 #thumb {
    position: relative;
    width: 100%;
    text-align: center;
}

#bath section.sec2 #thumb li {
    display: inline-block;
    width: 13%;
    max-width: 180px;
    height: auto;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
    background-color: #fff;
    margin-right: 0.5%;
    margin-left: 0.5%;
    float: none !important;
}

#bath section.sec2 #thumb li img {
    display: block;
    vertical-align: bottom;
    width: 100%;
    opacity: 0.7;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

#bath section.sec2 #thumb li:hover img, #bath section.sec2 #thumb li.thumbnail-current img {
    opacity: 1;
}

@media only screen and (max-width: 750px) {
    #bath section.sec2 #thumb li {
        width: 22%;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.sec2 #thumb {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
    }

p.caption {
padding-right: 0;
    padding-left: 0;
        }
    .caption0 p.caption {
        padding-right:10px;
        padding-left: 10px;

    }

}

#bath section.sec3 {
    background-color: #786d5e;
    text-align: center;

}
#bath section.sec3 .secin h3 {
    text-align: center;
    font-size: 26px;
    margin-bottom: 30px;
    color: #fff;
    position: relative;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 15px;
    border-bottom: 4px dotted #fff;
}
@media screen and (max-width: 584px) {
    #bath section.sec3 .secin h3 {
        width: 100%;
        font-size: 5vw;
        margin-bottom: 4vw;
        padding-bottom: 10px;
    }
}
#bath section .sec3a {
    width: 100%;
    max-width: 840px;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
    font-family: sans-serif;

}

#bath section .sec3at {
    padding: 10px;
    background-color: #fff;
    margin-bottom: 20px;
    font-family: sans-serif;
    color: #786d5e;
}
@media screen and (max-width: 584px) {
    #bath section .sec3a {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }
    #bath section .sec3at {
        padding: 0px;
    }
}
#bath section .sec3a table {
    text-align: center;
    width: 100%;
    position: relative;
    /*background-color: #fff;*/
}

#bath section .sec3a table tr th {
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(128, 128, 128, 0.5);
    background-color: #002538;
    color: #786d5e;
    font-size: 16px;
    text-align: center;
}

#bath section .sec3a table tr th.sty2 {
    background-color: #786d5e;
    color: #786d5e;
    font-size: 16px;
    border-top: 1px solid #808080;
}

#bath section .sec3a table tr th.sty3 {
    border-left: 1px solid rgba(128, 128, 128, 0.5);
    font-size: 30px;
}

#bath section .sec3a table tr th.sty3 span {
    font-size: 18px;
}

@media only screen and (max-width: 750px) {
    #bath section .sec3a table tr th {
        font-size: 12px;
    }

    #bath section .sec3a table tr th.sty2 {
        font-size: 12px;
    }

    #bath section .sec3a table tr th.sty3 {
        width: 50%;
        font-size: 14px;
    }

    #bath section .sec3a table tr th.sty3 span {
        font-size: 12px;
    }
}

#bath section .sec3a table tr td {
    font-size: 14px;
    padding-top: 6px;
    padding-bottom: 6px;
    box-sizing: border-box;

}

#bath section .sec3a table tr td:first-child {

}

#bath section .sec3a table tr td span {
    font-size: 12px;
}

@media only screen and (max-width: 750px) {
    #bath section .sec3a table tr td {
        font-size: 12px;
    }
}

#bath section.sec4 {
    background-color: #786d5e;
}

#bath section.sec4 ul.spec {
    position: relative;
    text-align: center;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
}

#bath section.sec4 ul.spec li {
    float: none !important;
    display: inline-block;
    width: 30%;
    margin-left: 1%;
    margin-right: 1%;
    background-color: #425F6C;
    color: #786d5e;
    padding-top: 6px;
    padding-bottom: 6px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec4 ul.spec {
        margin-bottom: 20px;
    }
}

#bath section.sec4 ul.sec4a {
    position: relative;
    text-align: center;
    width: 100%;
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 60px;
}

#bath section.sec4 ul.sec4a li {
    display: inline-block;
    float: none !important;
    width: 48%;
    margin-right: 4%;
    text-align: left;
    margin-bottom: 40px;
}

#bath section.sec4 ul.sec4a li:nth-child(2n) {
    margin-right: 0;
}

#bath section.sec4 ul.sec4a li h5 {
    font-size: 18px;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec4 ul.sec4a li h5 {
        font-size: 4vw;
    }
}

#bath section.sec4 ul.sec4a li p {
    font-size: 16px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec4 ul.sec4a li p {
        font-size: 3.5vw;
        text-align: left;
    }
}

#bath section.sec4 ul.sec4a li .note {
    background-color: #002538;
    color: #786d5e;
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    padding: 6px;
}

#bath section.sec4 ul.sec4a li figure.bdr {
    border: 1px solid #A9A9A9;
}

@media only screen and (max-width: 750px) {
    #bath section.sec4 ul.sec4a {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20px;
    }

    #bath section.sec4 ul.sec4a li {
        width: 100%;
        margin-right: 0%;
    }
}

#bath section.sec5 {
    background-color: #002538;
}

#bath section.sec5 .sec5a {
    margin-bottom: 40px;
}

#bath section.sec5 .sec5a figure {
    float: right;
    width: 48%;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5a figure {
        width: 90%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
    }
}

#bath section.sec5 .sec5a .info {
    float: left;
    width: 48%;
    color: #786d5e;
    text-align: right;
}

#bath section.sec5 .sec5a .info .dtime {
    display: inline-block;
    background-color: #847E71;
    width: 100%;
    max-width: 200px;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 16px;
    margin-bottom: 10px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5a .info .dtime {
        font-size: 14px;
    }
}

#bath section.sec5 .sec5a .info p {
    text-align: left;
    font-size: 18px;
}

#bath section.sec5 .sec5a .info p.sty2 {
    margin-top: 20px;
    border: 1px solid #ccc;
    padding: 12px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5a .info p {
        font-size: 14px;
    }
}

#bath section.sec5 .sec5a .info h4 {
    text-align: right;
    border-bottom: 1px solid #FFFFFF;
    padding-bottom: 10px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5a .info h4 {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5a .info {
        width: 90%;
        float: none;
        margin-left: auto;
        margin-right: auto;
    }
}

#bath section.sec5 .sec5b {
    margin-bottom: 40px;
}

#bath section.sec5 .sec5b figure {
    float: left;
    width: 48%;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5b figure {
        width: 90%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
    }
}

#bath section.sec5 .sec5b .info {
    float: right;
    width: 48%;
    color: #786d5e;
}

#bath section.sec5 .sec5b .info .dtime {
    background-color: #847E71;
    width: 100%;
    max-width: 200px;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 16px;
    margin-bottom: 10px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5b .info .dtime {
        font-size: 14px;
    }
}

#bath section.sec5 .sec5b .info p {
    text-align: left;
    font-size: 18px;
}

#bath section.sec5 .sec5b .info p.sty2 {
    margin-top: 20px;
    border: 1px solid #ccc;
    padding: 12px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5b .info p {
        font-size: 14px;
    }
}

#bath section.sec5 .sec5b .info h4 {
    text-align: left;
    padding-bottom: 10px;
    border-bottom: 1px solid #FFFFFF;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5b .info h4 {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .sec5b .info {
        width: 90%;
        float: none;
        margin-left: auto;
        margin-right: auto;
    }
}

#bath section.sec5 .moreb {
    margin-top: 30px;
    background-color: #FFFFFF;
    height: 50px;
}

#bath section.sec5 .moreb a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

#bath section.sec5 .moreb a p {
    position: absolute;
    width: 100%;
    max-width: 200px;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    text-align: center !important;
    padding-left: 20px;
    padding-right: 20px;
}

#bath section.sec5 .moreb a p::after {
    content: "";
    position: absolute;
    left: 0px;
    top: 10px;
    z-index: 1;
    width: 8px;
    height: 8px;
    margin: auto;
    border-top: #002538 solid 2px;
    border-right: #002538 solid 2px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#bath section.sec5 .moreb a p::before {
    width: 20px;
    height: 20px;
    position: absolute;
    background-size: cover;
    background-position: center center;
    background-image: url("../img/onsenspa/ico_01.png");
    content: "";
    z-index: 3;
    right: 0;
    top: 4px;
}

#bath section.sec5 .moreb:hover {
    opacity: 0.7;
}

@media only screen and (max-width: 750px) {
    #bath section.sec5 .moreb {
        margin-top: 20px;
        background-color: #FFFFFF;
        height: 40px;
    }
}

#bath section.sec6 .moreb {
    margin-top: 30px;
    background-color: #002538;
    height: 50px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

#bath section.sec6 .moreb a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

#bath section.sec6 .moreb a p {
    color: #fff;
    position: absolute;
    width: 100%;
    max-width: 200px;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    text-align: center !important;
    padding-left: 20px;
    padding-right: 20px;
}

#bath section.sec6 .moreb a p::after {
    content: "";
    position: absolute;
    left: 0px;
    top: 10px;
    z-index: 1;
    width: 8px;
    height: 8px;
    margin: auto;
    border-top: #fff solid 2px;
    border-right: #fff solid 2px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#bath section.sec6 .moreb a p::before {
    width: 20px;
    height: 20px;
    position: absolute;
    background-size: cover;
    background-position: center center;
    background-image: url("../img/onsenspa/ico_01.png");
    content: "";
    z-index: 3;
    right: 0;
    top: 4px;
}

#bath section.sec6 .moreb:hover {
    opacity: 0.7;
}

@media only screen and (max-width: 750px) {
    #bath section.sec6 .moreb {
        margin-top: 20px;
        height: 40px;
    }
}

#bath section.sec6 .sec6c {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}

#bath section.sec6 .sec6c a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

#bath section.sec6 .sec6c img {
    display: block;
    vertical-align: bottom;
    width: 100%;
}

#bath section.sec6 .sec6c:hover {
    opacity: 0.7;
}

#bath section.sec6 .sec6a {
    width: 100%;
    max-width: 840px;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
}

#bath section.sec6 .sec6a .sec6at {
    padding: 10px;
    background-color: #fff;
    margin-bottom: 20px;
}

#bath section.sec6 .sec6a table {
    text-align: center;
    width: 100%;
    position: relative;
    background-color: #fff;
}

#bath section.sec6 .sec6a table tr th {
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(128, 128, 128, 0.5);
    background-color: #002538;
    color: #fff;
    font-size: 16px;
    text-align: center;
}

#bath section.sec6 .sec6a table tr th.sty2 {
    background-color: #fff;
    color: #002538;
    font-size: 16px;
    border-top: 1px solid #808080;
}

#bath section.sec6 .sec6a table tr th.sty3 {
    border-left: 1px solid rgba(128, 128, 128, 0.5);
    font-size: 30px;
}

#bath section.sec6 .sec6a table tr th.sty3 span {
    font-size: 18px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec6 .sec6a table tr th {
        font-size: 12px;
    }

    #bath section.sec6 .sec6a table tr th.sty2 {
        font-size: 12px;
    }

    #bath section.sec6 .sec6a table tr th.sty3 {
        width: 50%;
        font-size: 14px;
    }

    #bath section.sec6 .sec6a table tr th.sty3 span {
        font-size: 12px;
    }
}

#bath section.sec6 .sec6a table tr td {
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(128, 128, 128, 0.5);
}

#bath section.sec6 .sec6a table tr td:first-child {
    border-right: 1px solid rgba(128, 128, 128, 0.5);
}

#bath section.sec6 .sec6a table tr td span {
    font-size: 12px;
}

@media only screen and (max-width: 750px) {
    #bath section.sec6 .sec6a table tr td {
        font-size: 12px;
    }
}

#bath section.sec6 .sec6b {
    position: relative;
    width: 100%;
}

#bath section.sec6 .sec6b li {
    position: relative;
    width: 64%;
    float: none !important;
}

#bath section.sec6 .sec6b li img {
    display: block;
    vertical-align: bottom;
    width: 100%;
}

#bath section.sec6 .sec6b li:nth-child(2) {
    position: absolute;
    width: 34%;
    height: 48%;
    right: 0;
    top: 0;
    background-size: cover;
    background-position: center center;
    background-image: url("../img/onsenspa/img_10.jpg");
}

#bath section.sec6 .sec6b li:nth-child(3) {
    position: absolute;
    width: 34%;
    height: 48%;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
    background-image: url("../img/onsenspa/img_11.jpg");
}

@media only screen and (max-width: 750px) {
    #bath section.sec6 .sec6b li {
        width: 100%;
        margin-bottom: 10px;
    }

    #bath section.sec6 .sec6b li:nth-child(2) {
        position: relative;
        width: 48%;
        height: 120px;
        right: auto;
        top: auto;
        float: left !important;
    }

    #bath section.sec6 .sec6b li:nth-child(3) {
        position: relative;
        width: 48%;
        height: 120px;
        right: auto;
        bottom: auto;
        float: right !important;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.sec6 .sec6b {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (max-width: 750px) {
    #bath p.note {
        font-size: 12px;
    }

    #bath .pc {
        display: none !important;
    }

    #bath .sp {
        display: block !important;
    }
}

#bath section.ptit {
    margin-bottom: 100px;
}

/*#bath section.ptit {
  padding: 70px 0;
  height: auto;
  background: #333;
}

#bath section.ptit .secin {
  padding: 0;
  width: 94%;
}*/

#bath section.sec2 .sec2b,
#bath section.sec3 .sec3b {
    margin-bottom: 20px;
}

#bath section.sec2 .sec2b + .lead,
#bath section.sec3 .sec3b + .lead {
    padding: 0 3% 40px;
    line-height: 1.7;
    font-size: 20px;
}

#bath section.sec2 .sec2a li figure {
    margin-bottom: 20px;
}

#bath section.sec2 .sec2c li figure {
    margin-bottom: 20px;
}

/*#bath section.sec1 .secin .sec1b li:nth-child(3) {*/
    /*position: relative;*/
    /*top: -11px;*/
    /*padding-bottom: 21px;*/
/*}*/

/*#bath section.sec1 .secin .sec1b li:nth-child(3) p {*/
    /*padding-top: 11px;*/
/*}*/

#bath section .sec3a table tr th.sty3 span.emphasis {
    font-size: 120%;
}

@media only screen and (min-width: 751px) {
    #bath section .sec3a table tr th.sty3 span.spSpace {
        display: none;
    }
}

@media only screen and (max-width: 750px) {
    #bath section.ptit {
        margin-bottom: 60px;
    }

    /*#bath section.ptit {
      padding: 50px 0;
      height: auto;
      background-image: none;
    }*/
    #bath section.sec1 .secin .sec1b li {
        width: 80%;
        max-width: 360px;
    }

    #bath section.sec1 .secin .sec1b li h3 {
        padding: 5px 0;
        font-size: 18px;
    }

    #bath section.sec1 .secin .sec1b li p {
        font-size: 12px;
    }

    #bath section.sec1 .secin .sec1b li:nth-child(3) {
        top: 0;
        padding-bottom: 10px;
    }

    #bath section.sec1 .secin .sec1b li:nth-child(3) p {
        padding-top: 0;
    }

    #bath section .sec3a table tr th.sty3 span.slash {
        display: none;
    }

    #bath section.sec5 .sec5a .info,
    #bath section.sec5 .sec5b .info {
        position: relative;
    }

    #bath section.sec5 .sec5a .info h4,
    #bath section.sec5 .sec5b .info h4 {
        text-align: left;
        font-size: 16px;
    }

    #bath section.sec5 .sec5a .info .dtime,
    #bath section.sec5 .sec5b .info .dtime {
        position: absolute;
        top: 2px;
        right: 0;
        margin-bottom: 0;
        padding: 3px 5px;
        width: auto;
        font-size: 10px;
    }
}
#bath section .sec3a table{
    /*border-spacing: 5px;*/
    /*border-collapse: separate;*/
}


#bath section .sec3a table tr th{
    background-color: #9e8e76;
    border: none;
    color: #fff;
    border-bottom: 1px solid #9e8e76;
    box-sizing: border-box;
    margin-bottom: 4px;
    font-size: 16px;
}
#bath section .sec3a table tr th p{
    font-size: 16px;
}
@media screen and (max-width: 584px) {
    #bath section .sec3a table tr th p{
        font-size: 3.5vw;
    }
}
#bath section .sec3a table tr th.w160{
    width: 200px;
}

#bath section .sec3a table tr td >dl {
    border-bottom: 1px solid #9e8e76;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    padding: 6px;
    margin-left: 20px;
    color: #786d5e
}

#bath section .sec3a table tr td >dl {
font-size: 16px;

}
#bath section .sec3a table tr td >dl dt{
    width: 30%;
}
#bath section .sec3a table tr td >dl dt.sty2{
    text-align: left;
}
#bath section .sec3a table tr td >dl dd{
    width: 70%;
}
#bath section .sec3a table tr td >dl dd.sty2{
    padding-left: 40px;
    text-align: left;
}
#bath section .sec3a table tr td >dl dl{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding: 4px 6px;
    margin-left: 60px;
    gap: 10px;
}
#bath section .sec3a table tr td >dl dl dd{
    width: 50%;
}

@media screen and (max-width: 750px) {
    #bath section .sec3a table tr td >dl dd.sty2{
        padding-left: 0;
    }
    #bath section .sec3a table tr td >dl dl{
        margin-left: 10px;
        padding: 2px 6px;
    }
    #bath section .sec3a table tr td >dl dl dt{
        width: 50%;
    }
}

@media screen and (max-width: 584px) {
    #bath section .sec3a table tr th.w160{
        width: 80px;
    }
    #bath section .sec3a table tr td >dl {
        font-size: 12px;
        padding: 0px;
        margin-left: 10px;

        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #bath section .sec3a table tr td >dl dt{
        /*width: 100%;*/
        /*background-color: #4ab7c1;*/
        /*color: #fff;*/
        /*margin-bottom: 6px;*/
    }
    #bath section .sec3a table tr td >dl dd{
        /*width: 100%;*/
        /*color: #fff;*/
    }
}
#bath section .sec3a table.sty2{
    margin-bottom: 4px;
}
#bath section .sec3a table.sty2 tr td{

    color: #fff;
}
@media screen and (max-width: 584px) {
    #bath section .sec3a table.sty2 tr th{
        width: 100%;
        padding-top: 4px;
        padding-bottom: 4px;
        display: block;
    }
    #bath section .sec3a table.sty2 tr td{
        width: 100%;
        padding-top: 4px;
        padding-bottom: 4px;
        display: block;
    }
    #bath section .sec3a table.sty2 tr td>dl{
        margin-top: 4px;
        padding-bottom: 4px;
    }
}
#bath section .sec3c{
    /*background-color: #fff;*/
    box-sizing: border-box;
    padding: 20px;
    margin-top: 40px;
    border: 3px double #FFFFFF;
}

#bath section .sec3c h4{
    /*background-color: #4AB7C1;*/
    color: #fff;
}
#bath section .sec3c p{
    font-size: 18px;
    color: #fff;
    text-align: center;
}


#bath section .btnset {
    position: relative;
    width: 100%;
    height: 50px;
    /*border-top: 1px solid #002538;*/
    margin-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    max-width: 400px;
    	margin-left: auto;
    		margin-right: auto;
    box-sizing: border-box;
}


#bath section .btnset a {
	display: block;
		width: 100%;
		height: 100%;
		position: relative;
    margin-right: 2%;


    background-color: #fff;
    border: 1px solid #4AB7C1;
    box-sizing: border-box;
}

#bath section .btnset a p {
    font-size: 16px;
    text-align: center;
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media only screen and (max-width: 750px) {
    #bath section .btnset a p {
        font-size: 3.5vw;
    }
}

#bath section .btnset a.rsv {
    margin-right: 0%;
    background-color: #4AB7C1;
}

#bath section .btnset a.rsv p {
    color: #fff;
}

#bath section .btnset a:hover {
    opacity: 0.7;
    background-color: #4AB7C1;
}

#bath section .btnset a:hover p {
    color: #fff;
}

@media only screen and (max-width: 750px) {
    #bath section .btnset {
        padding-left: 0;
        padding-right: 0;
    }
}




#bath section .btnset2 {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;

    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;

    margin-top: 10px;



    z-index: 3;
    margin: 60px auto;
}
@media only screen and (max-width: 750px) {
    #bath section .btnset2 {
        margin-bottom: 6vw;

    }
    #bath section .btnset2.sty3 {
        margin-top: 6vw;
        margin-bottom: 3vw;
    }
}
#bath section .btnset2.sty2 {
    margin-top: 0px;
}
#bath section .btnset2.sty3 {
    margin-bottom: 40px;
}

#bath section .btnset2{
    display: flex;
    justify-content: space-between;
    align-items: center;

    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;

    /*margin-bottom: 60px;*/
}
#bath section .btnset2 a {
    height: 90px;
    padding-left: 10px;
    padding-right: 10px;/* max-width: 400px; */
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    font-family: sans-serif;
    width: 48%;
    display: block;
    position: relative;
    z-index: 2;
    /* width: 100%; */
    /*height: 100%;*//*margin-right: 2%;*//*background-color: #caa47d;*//*border: 1px solid #caa47d;*/
    background-color: #002538;
    border: 1px solid #002538;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
#bath section .btnset2 a::before {
    content: "";
    position: absolute;
    right: 20px;
    top: 44%;
    z-index: 3;
    width: 10px;
    height: 10px;
    margin: auto;
    border-top: #FFFFFF solid 2px;
    border-right: #fff solid 2px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
#bath section .btnset2 a p {
    font-size: 16px;
    text-align: center;
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    color: #fff;
    line-height: 1;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
#bath section .btnset2 a p span{
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-size: 13px;
    line-height: 1;
    margin-top: 6px;
}
#bath section .btnset2 .btnset2_row2 {
    display: block;
    max-width: 600px;
    width: 48%;
    margin: 0 auto;
    font-family: sans-serif;
    box-sizing: border-box;
}
#bath section .btnset2 .btnset2_row2 a {
    width: 100%;
    height: 42px;
}
#bath section .btnset2 .btnset2_row2 a::before {
    top: 0;
    bottom: 0;
    margin: auto;
}
#bath section .btnset2 .btnset2_row2 a+a {
    margin-top: 6px;
}

@media only screen and (max-width: 750px) {
    #bath section .btnset2 a{
        width: 100%;
        height: 70px;
        margin-bottom: 3vw;
    }
    #bath section .btnset2 a p {
        font-size: 3.5vw;
    }
    #bath section .btnset2 a span {
        font-size: 2.5vw;
    }
    #bath section .btnset2 .btnset2_row2 {
        width: 100%;
    }
    #bath section .btnset2 .btnset2_row2 a {
        height: 70px;
    }
}

#bath section .btnset2 a.rsv {
    margin-right: 0%;
    background-color: #caa47d;
}

#bath section .btnset2 a.rsv p {
    color: #fff;
}

#bath section .btnset2 a:hover {
    opacity: 0.7;
    /*background-color: #caa47d;*/
}

#bath section .btnset2 a:hover p {
    color: #fff;
}

@media only screen and (max-width: 750px) {
    #bath section .btnset2 {
        padding-left: 0;
        padding-right: 0;
    }
}

#bath section .btnset3 {
    position: relative;
    width: 100%;
    height: auto!important;
    margin-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    font-family: sans-serif;
    z-index: 3;
    margin: 10px auto;
    margin-top: 0;
    border-bottom: 6px double #9e8e76;
    border-top:6px double #9e8e76;
    box-sizing: border-box;
    pointer-events: none;
    padding: 20px!important;
    margin-top: 70px;
    font-family: 'Noto Serif JP', serif;
}
@media only screen and (max-width: 750px) {
    #bath section .btnset3 {
        margin-bottom: 6vw;
    }
}
#bath section .btnset2.sty3 {
margin-top: 0px;
}

#bath section .btnset3 a {
    display: block;
    position: relative;z-index: 2;
    width: 100%;
    height: 100%;
    position: relative;
    margin-right: 2%;

    /*background-color: #caa47d;*/

    /*border-top: 3px double #caa47d;*/

    border-bottom: 6px double #9e8e76;
    border-top:6px double #9e8e76;
    box-sizing: border-box;
    pointer-events: none;

    padding: 20px!important;
}

#bath section .btnset3 p {
    font-size: 30px;
    text-align: center;
    position: relative;
    width: 100%;
    left: 0;
    top: 50%;
    color: #9e8e76;
    line-height: 1;
    font-family: 'Noto Serif JP', serif;
}
#bath section .btnset3 span {
    display: block;
    text-align: center!important;
    color: #9e8e76;
    margin-top: 20px;
    line-height: 1.4;
}
@media only screen and (max-width: 750px) {
    #bath section .btnset3  p {
        font-size: 5.5vw;
    }
    #bath section .btnset3  span {
        font-size: 3.5vw;
    }
}

#bath section .btnset3 a.rsv {
    margin-right: 0%;
    background-color: #caa47d;
}

#bath section .btnset3 a.rsv p {
    color: #fff;
}

#bath section .btnset3 a:hover {
    opacity: 0.7;
    background-color: #caa47d;
}

#bath section .btnset3 a:hover p {
    color: #fff;
}

@media only screen and (max-width: 750px) {
    #bath section .btnset3 {
        padding-left: 0;
        padding-right: 0;
    }
}

.bslist {
    position: relative;
    display: inline-block;
    max-width: 650px;
    width: 100%;
    margin: 0 auto;
    text-align: left;
}
.bslist_wrap {
    max-width: 650px;
    width: 100%;
    margin: 30px auto 0;
    border: 1px solid #fff;
    padding: 10px 20px 15px;
    text-align: center;
}
.bslist_wrap .bslist {
    max-width: 400px;
    width: 100%;
    margin: 0 auto;
}
.bslist li {
    line-height: 1.6em !important;
    display: block;
    padding-left: 1em;
    text-indent: -1em;
    font-size: 15px;
    color: #fff;
    float: none;
}
.bslist_wrap .bslist li p {
    font-size: 14px;
}
#bath section .secin .bslist_wrap h4 {
    width: 200px;
    margin: 0 auto 15px;
    color: #fff;
    border-bottom: 1px solid #fff;
    font-size: 18px;
}
.secin .bslist_txt {
    line-height: 1.6em !important;
    position: relative;
    max-width: 400px;
    width: 100%;
    margin: 0 auto 6px;
    font-size: 14px;
    color: #fff;
}

@media only screen and (max-width: 750px) {
    .bslist {
        margin-top: 3vw;
    }
    .bslist_wrap {
        margin: 20px auto 0;
        padding: 10px 20px 15px;
    }
    .bslist_wrap .bslist li p {
        font-size: 12px;
    }
    #bath section .secin .bslist_wrap h4 {
        width: 150px;
        margin: 0 auto 15px;
        padding-bottom: 3px;
        font-size: 14px;
    }
    #bath section .secin .bslist_wrap .bslist {
        padding: 0;
    }
    .secin .bslist_txt {
        margin: 0 auto 6px;
        font-size: 12px;
        text-align: left;
    }

}

@media screen and (max-width: 584px) {
    .bslist li.cl1 {
        width: 100%;
    }
}
.bslist li figure {
    /*border: 1px solid #ccc;*/
}

.bslist li h5 {
    text-align: center;
    font-size: 16px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.bslist li p {
    font-size: 15px;
    line-height: 1.6em !important;
    /*font-family: sans-serif;*/
    color: #fff;
}

.bslist li p.note {
    margin-top: 10px;
    font-size: 10px;
    line-height: 1.4em !important;
}

@media screen and (max-width: 584px) {
    .bslist li {
        width: 100%;
    }
    .bslist li h5 {
        font-size: 16px;
    }
    .bslist li p {
        font-size: 12px;
    }
    #bath section .secin{
        width: 90%;
        padding-left: 0px;
        padding-right: 0px;
    }
}



#bath section .sec3a table tr td{
    font-size: 14px;
}
#bath section .sec3a table tr td table tr th{
    border-right: 1px solid #FFFFFF;
    font-size: 14px;
}
#bath section .sec3a table tr td table tr th.th4{
    text-align: center;
    background-color: #92d3d9;
}
#bath section .sec3a table tr td table tr th.th2{
    text-align: center;
}
#bath section .sec3a table tr td table tr th.th3{
    text-align: center;
    background-color: #92d3d9;
}
#bath section .sec3a table tr td table{
    margin-left: 10px;
}
#bath section .sec3a table tr td table tr td.td2{
    text-align: center;
    border-bottom: 1px solid #4AB7C1;
    border-right: none;
}
#bath section .sec3a table tr td table.sty2 td {
    font-size: 14px;
}
#bath section .sec3a table tr td sup{
    vertical-align: middle;
}
@media screen and (max-width: 584px) {
    #bath section .sec3a table tr td table{
        margin-left: 0px;
    }
    #bath section .sec3a table tr td table tr th.th2{
        width: 100px;
    }
    #bath section .sec3a table tr td table tr td,
    #bath section .sec3a table tr td table tr th.th4,
    #bath section .sec3a table tr td table tr th.th2,
    #bath section .sec3a table tr td table tr th.th3 {
        width: auto;
        display: table-cell;
    }
    #bath section .sec3a table tr td.sty4,
    #bath section .sec3a table tr th.sty4{
        width: 100%;
        display: block;
    }
}


.custom-shape-divider-top-1715829844 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.custom-shape-divider-top-1715829844 svg {
    position: relative;
    display: block;
    width: calc(124% + 1.3px);
    height: 86px;
}

.custom-shape-divider-top-1715829844 .shape-fill {
    fill: #FFFFFF;
}

.h2t span{
    width: 160px;
    height: 160px;
    position: relative;
    display: inline-block;
    border: 3px solid #4c9ac0;
    background-color: #fff;
    /*padding: 0.5em 1em;*/
    position: relative;
    z-index: 3;

    display: flex;
    justify-content: center;
    align-items: center;

    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;

    border-radius:30px;

}
.h2t span::before {
    content: '';
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#caa47d 8%, transparent 16%), radial-gradient(#caa47d 8%, transparent 16%);
    background-position: 0 0, 7px 7px;
    background-size: 12px 12px;
    position: absolute;
    top: -10px;
    left: 10px;
    z-index: -1;

    border-radius:30px;
}


.sinfo{

position: relative;
    padding: 40px;
    /*padding-top: 20px ;*/
    /*border: 1px solid #444;*/
    /*border: 1px solid #caa47d;*/
    box-sizing: border-box;
    /*border: 3px solid #9e8e76;*/
    /*border: 3px solid #4a463d;*/
    /*border: 1px solid #4a463d;*/
    box-sizing: border-box;
    margin-top: 60px;
    /*background-color: #4a463d;*/
    background-color: #9e8e76;
}
.sinfo::before{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
    z-index: 1;
    content: "";
    background-image: url(../img/onsenspa/bg_06.png);
    /*background-image: url(../img/onsenspa/bg_04.jpg);*/
    background-size: cover;
    background-position: center center;

    /*mix-blend-mode: multiply;*/
    /* background-blend-mode: multiply;*/

}
.sinfo h5 {
color: #fff;
margin: 0;
    padding: 0;
    font-size: 20px;
    margin-bottom: 20px;
    text-align: center;
    z-index: 5;
    position: relative;
}

.sinfo dl {
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 6px;
    align-items: stretch;
    gap: 10px;
    position: relative;
}

.sinfo dl dt {
    width: 140px;
    font-size: 12px;
    text-align: left;
    font-size: 15px;
    display: inline-block;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    border-bottom: 1px solid #caa47d;
    border-bottom: 1px solid #444;
    padding-top: 4px;
    padding-bottom: 4px;
}

.sinfo dl dd {
    display: inline-block;
    width: 300px;
    font-size: 12px;
    text-align: left;
    font-size: 15px;
    line-height: 1.4;
    color: #fff;
    border-bottom: 1px solid #caa47d;
    border-bottom: 1px solid #444;
    padding-top: 4px;
    padding-bottom: 4px;

}
@media only screen and (max-width: 750px) {
    .sinfo h5 {
        font-size: 4vw;
        font-feature-settings : "palt";
        letter-spacing: 0;
        text-align: center;

    }
    .sinfo{
        padding: 6vw;
        margin-top: 6vw;
    }
    .sinfo dl dt {
        font-size: 3.2vw;
        font-feature-settings : "palt";
        letter-spacing: 0;
        padding-top: 2vw;
        padding-bottom: 2vw;
    }
    .sinfo dl dd {
        font-size: 3.2vw;
        font-feature-settings : "palt";
        letter-spacing: 0;
        padding-top: 2vw;
        padding-bottom: 2vw;
    }
}


/*#bath section .btnset2{*/
/*    height: 70px;*/
/*}*/
@media only screen and (max-width: 750px) {
    #bath section .btnset2{
        margin-top: 6vw;
    }
}
#bath section .btnset2 a{
    /*border-radius:10px;*/

}

.stab{
    display: flex;
    justify-content: center;
    align-items: center;

    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    gap: 20px;
    margin-bottom: 40px;
}

.stab li{
    width: 31%;
    height: 80px;
    position: relative;
    border-radius:10px;
    -moz-border-radius: 10px;
    -webkit-border-radius:10px;
    -o-border-radius:10px;
    -ms-border-radius:10px;
    overflow: hidden;
}

.stab li::before{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 2;
    content: "";
    background-color: #000;
    opacity: 0.5;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
.stab li:hover::before{
    opacity: 0;
}
.stab li p{
    position: relative;
    z-index: 3;
    line-height: 1;
    font-size: 20px;
    text-shadow: 0 3px 10px #222222;
    text-align: center;
    color: #fff;
    font-family: 'Noto Serif JP', serif;
}

.stab li::after{
    content: "";
    position: absolute;
    right:20px;
    top:44%;
    z-index: 3;
    width: 10px;
    height: 10px;
    margin: auto;

    border-top: #FFFFFF solid 2px;
    border-right: #fff solid 2px;

    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);

}
@media only screen and (max-width: 750px) {
    .stab{
        gap: 0px;
        justify-content: space-between;
    }
    .stab li{
        width: 32%;
        height: 60px;
        border-radius:5px;
        -moz-border-radius: 5px;
        -webkit-border-radius:5px;
        -o-border-radius:5px;
        -ms-border-radius:5px;
    }
    .stab li::after{
        right:6px;
        top:43%;
        width: 8px;
        height: 8px;
        border-top: #FFFFFF solid 1px;
        border-right: #fff solid 1px;
    }
    .stab li p{
        font-size: 4vw;
    }

}
.stab li a{
    display: block;
    width: 100%;
    height: 100%;
    position: relative;

    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;

    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
.stab li img{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    object-fit: cover;
}
.sec1c1{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap:wrap;
}
.sec1c1 li{
    width: 50%;
}

.sec1c1 li figure{
    display: block;
    vertical-align: bottom;
    width: 100%;
}
.sec1c1 li img{
    display: block;
    vertical-align: bottom;
    width: 100%;
}
.morei{
    cursor: pointer;
    transition: 0.3s;
}
.morei:hover{
    opacity: 0.9;
}


.secopani {
    position: fixed;
    /*background-color: #fff;*/
    /*background-color: #f1e5cd;*/
    background-color: rgba(0,0,0,0.9);
    z-index: 99999;
    width: 100%;
    height: 100svh;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    box-sizing: border-box;
}

/*.secopani:after {*/
/*    pointer-events: none;*/
/*    content: "";*/
/*    position: absolute;*/
/*    z-index: 10;*/
/*    height: 110%;*/
/*    top: -5%;*/
/*    right: 0;*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    opacity: 1;*/
/*    background: linear-gradient(285deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 10%, #fff 30%, #fff 80%, #fff 110%);*/
/*    width: 150vw;*/
/*    -webkit-transform: translateX(0);*/
/*    transform: translateX(0);*/
/*    -webkit-transform-origin: right;*/
/*    transform-origin: right;*/
/*    -webkit-transition: 2s;*/
/*    transition: 2s;*/
/*    z-index: 5*/
/*}*/

.secopani.ani1 {
    -webkit-transition: 1s;
    transition: 1s;
    pointer-events: auto;
    opacity: 1;
    left: 0;
    -webkit-transition: 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: 0.6s cubic-bezier(0.52, 0.08, 0.18, 1)
}

/*.secopani.ani1:after {*/
/*    -webkit-transform: translateX(-100%);*/
/*    transform: translateX(-100%)*/
/*}*/

.secopani.as7 {
    pointer-events: none;
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    -webkit-transition: 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: 0.6s cubic-bezier(0.52, 0.08, 0.18, 1)
}

.secopani .skip {
    position: absolute;
    left: 50%;
    bottom: 20px;
    cursor: pointer;
    width: 100px;
    height: 40px;
    color: #000000;
    border: 1px solid #000000;
    display: block;
    -webkit-transition: 1s;
    transition: 1s;
    z-index: 9010;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 12px;
    z-index: 9999;
    -webkit-transition: 0.3s;
    transition: 0.3s;
                    transform: translateX(-50%) ;
}

@media screen and (max-width: 584px) {
    .secopani .skip {
        font-size: 3.5vw
    }
}

.secopani .skip:hover {
    opacity: 0.7
}


.secopani .bgmbtn img {
    width: 60%
}

.secopani .bgmbtn p {
    color: #fff;
    margin-top: -18px;
    text-align: center;
    font-size: 12px;
    letter-spacing: 2px;
    display: none
}

.secopani .bgmbtn:hover {
    opacity: 0.7
}



.secopani .secin {
    width: 100%;
    height: 100svh;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.secopani .secin figure {
    width: auto;
    height: 76%;
}
.secopani .secin figure img{
    display: block;
    vertical-align: bottom;
    /*width: 100%;*/
    width: auto;
    height: 100%;
}
@media screen and (max-width: 768px) {
    .secopani .secin figure {
        width: 100%;
        height: auto;
    }
    .secopani .secin figure img{
        width: 100%;
        height: auto
    }
}
.opani .secopani {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: 1s 1s;
    transition: 1s 1s
}

/*#bath section .btnset2::before {*/
/*    content: '';*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    background-image: radial-gradient(#4c9ac0 8%, transparent 16%), radial-gradient(#4c9ac0 8%, transparent 16%);*/
/*    background-position: 0 0, 7px 7px;*/
/*    background-size: 12px 12px;*/
/*    position: absolute;*/
/*    top: -10px;*/
/*    left: 10px;*/
/*    z-index: 1;*/

/*    border-radius:10px;*/
/*}*/

/*#bath section .btnset2::after {*/
/*    content: '';*/
/*    background-color: #4c9ac0;*/
/*    !*background: repeating-linear-gradient( -45deg, #4c9ac0, #4c9ac0 5px, #ffffff 5px, #ffffff 10px );*!*/
/*    background: repeating-linear-gradient( -45deg, #ffcf27, #ffcf27 2px, #ffffff 2px, #ffffff 10px );*/

/*    width: 100%;*/
/*    height: 100%;*/
/*    position: absolute;*/
/*    top: 10px;*/
/*    left: -10px;*/
/*    z-index: 1;*/
/*    border-radius:10px;*/

/*}*/