/*
Theme Name: カウンセリングオフィス成子坂
*/
/*この下からCSSを書いてください*/
/* フォントの設定 */
@import url('https://typesquare.com/3/tsst/script/ja/typesquare.js?66c9ea9aac744e29900479e6ac1e02e5');
html, body {
    font-size: 16px;
    font-family: "エコー L", "Echo L", "Echo B", 'Noto Sans JP', sans-serif;
}
/* header */
.header {
    height: 70px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: fixed;
    background-color: #FFFEF2;
    z-index: 1;
}
.header__logo {
    display: flex;
    justify-content: flex-start;
}
.header__logo__img {
    height: 100%;    
}
.header__logo__img img {
    width: 100%;
}
.header__logo p {
    line-height: 70px;
    font-weight: 600;
    letter-spacing: 0rem;
}
.header__logo a {
    color: #9acf67;
    font-size: 1.6rem;
}
.header__menu {
    line-height: 70px;
    width: 60%;
}
.hamburger__btn {
    display: none;
}
.menu-sp {
    display: none;
}
.modal-sp {
    display: none;
}
.header__menu ul {
    display: flex;
    justify-content: space-around;
    font-size: 1rem;
}
.header__menu ul li {
    margin-right: 3%;
}
.header__menu ul li:last-child {
    background-color: #9acf67;
    border-radius: 50px;
    line-height: 32px;
    margin: 18px 0;
    padding-top: 2px;
    width: 20%;
    text-align: center;
}
.header__menu ul li:last-child a {
    color: #FFFEF2;
    font-weight: bold;
}
/* common */
.section-title {
    margin: 100px auto;
    width: 300px;
}
.section-title h2 {
    font-size: 28px;
    font-weight: 600;
    color: #9acf67;
    text-align: center;
}
.section-title img {
    width: 100%;
}
.section-subtitle {
    font-size: 20px;
    padding-bottom: 20px;
    margin-top: 50px;
}
.section-subtitle h3 {
    position: relative;
    z-index: 0;
    width: 350px;
    text-align: right;
}
.section-subtitle h3::after {
    content: "";
    position: absolute;
    top: 15px;
    left: 0;
    z-index: -1;
    width: 400px;
    height: 18px;
    background-image: linear-gradient(90deg, rgba(154,207,103,0.7) 60%,rgba(255,254,240,0.4) 90%,rgba(255,254,240,0));
}
.policy {
    margin-left: 32%;
    overflow: hidden;
}
.policy h3 {
    text-align: start;
    /* margin-right: 30%; */
}
.policy h3::after {
    position: absolute;
    transform: scaleX(-1);
    /* left: 22%; */
}
.common-contact {
    width: 90%;
    margin: 30px auto ;
}
.common-btn {
    width: 300px;
    margin: 0 auto;
    line-height: 3rem;
    background-color: #9acf67;
    border-radius: 9999px;
    text-align: center;
}
.common-btn a {
    color: #FFFEF0;
}
.news-index {
    margin-top: 140px;
    line-height: 3rem;
}
.common-mail {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 15%;
    margin-top: 20px;
}
.flow__mail {
    width: 300px;
    margin: 20px auto;
    padding-left: 20px;
}
.common-mail__img {
    width: 12%;
}
.common-mail p {
    width: 60%;
    color: #9acf67;
    text-align: start;
    line-height: 2rem;
}
.sp-owl {
    display: none;
}
/* FV */
.fv {
    padding-top: 70px;
}
.fv__img {
    position: relative;
    z-index: -1;
}
.fv__concept{
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
    text-wrap: nowrap;
    font-size: 46px;
    color: #FFFEF2;
    line-height: 100px;
    /* padding: 0 8%; */
    background-image: linear-gradient(90deg,rgba(255,254,240,0) ,rgba(154,207,103,0.7) ,rgba(154,207,103,0.7) ,rgba(255,254,240,0));
    opacity: 0;
    transition: opacity 2s ease-in-out;
}
.fv__concept.fade-in {
    opacity: 1;
}

/* second-view */
.second-view {
    position: relative;
    z-index: -1;
    width: 60%;
    margin: 80px auto 200px;
}
.second-view__text {
    letter-spacing: 0.3rem;
    line-height: 1.5rem;
    width: 80%;
}
.second-view__img {
    position: absolute;
    top: 58%;
    left: 93%;
    width: 20%;
}
/* firstcontact */
.firstcontact {
    background-color: #FFFEF0;
    padding: 10px 0 80px;
    z-index: -10;
}
.firstcontact__about p {
    width: 75%;
    margin: 25px auto;
    font-size: 15px;
    letter-spacing: 0.3rem;
}
.firstcontact__target {
    display:flex ;
    width: 90%;
    margin: 10px auto;
    flex-wrap: wrap;
}
.firstcontact__target__text {
    margin: 10px 10px 10px 30px;
    width: 45%;
    border: solid 2px #9acf67;
    border-radius: 30px;
    padding: 3%;
}
.firstcontact__target__text h4 {
    margin-bottom: 5px;
}
.firstcontact__target__text li {
    list-style: inside;
    font-size: 14px;
    line-height: 1.1rem;
    margin-left: 35px;
}
.firstcontact__target__text:last-child {
    margin-top: 40px;
    margin-right: 0;
    border: none;
}
.firstcontact__target__text:last-child p {
    font-size: 12px;
    line-height: 2rem;
    margin-left: 10px;
}
.firstcontact__before p {
    width: 75%;
    margin: 25px auto;
    letter-spacing: 0.3rem;
    line-height: 1.5rem;
    font-size: 15px;
}
/* reservation */
.reservation__time__table {
    width: 60%;
    margin: 10px auto;
    border-collapse: collapse;
    border: solid 1px #9acf67;
    table-layout: auto;
}
.reservation__time__table th {
    height: 3rem;
    text-align: start;
    padding-left: 30px;
    background-color: #FFFEF0;
    vertical-align: middle;
}
.reservation__time__table tr {
    height: 3rem;
}
.reservation__time__table td {
    vertical-align: middle;
    text-align: start;
    padding-left: 30px;
    border-top: solid 1px #9acf67;
}
.reservation__time__comment {
    width: 60%;
    margin: 0 auto;
    text-align: end;
    font-size: 14px;
}
.reservation__charge {
    margin-bottom: 30px;
}
.reservation__charge__table {
    width: 60%;
    margin: 10px auto;
    border-collapse: collapse;
    border: solid 1px #9acf67;
    table-layout: auto;
}
.reservation__charge__table:nth-child(odd) {
    background-color: #FFFEF0;
}
.reservation__charge__table th {
    height: 3rem;
    text-align: start;
    padding-left: 30px;
    vertical-align: middle;
    background-color: #FFFEF0;
}
.reservation__charge__table tr {
    height: 3rem;
}
.reservation__charge__table td {
    text-align: center;
    padding-left: 30px;
    vertical-align: middle;
    border-top: solid 1px #9acf67;
}
.reservation__cancel__table {
    width: 60%;
    margin: 10px auto;
    border-collapse: collapse;
    border: solid 1px #9acf67;
    table-layout: auto;
}
.reservation__cancel__table th {
    height: 3rem;
    text-align: start;
    padding-left: 30px;
    vertical-align: middle;
    background-color: #FFFEF0;
}
.reservation__cancel__table tr {
    height: 3rem;
}
.reservation__cancel__table tr:nth-child(odd) {
    background-color: #FFFEF0;
}
.reservation__cancel__table td {
    text-align: center;
    padding-left: 30px;
    vertical-align: middle;
    border-top: solid 1px #9acf67;
}
.break-keep {
    word-break: keep-all;
}
.reservation__flow {
    width: 75%;
    margin: 0 auto;
    height: 900px;
    display: flex;
}
.reservation__flow__line {
    position: relative;
    margin: 0 auto;
    text-align: center;
    width: 1%;
}
.reservation__flow__line img {
    display: block;
    margin-top: 62px;
    margin-left: 130%;
    height: 80%;
}
.reservation__flow__numbering {
    position: absolute;
    top: 60px;
    text-align: center;
    font-size: 18px;
    color: #FFFEF0;
    line-height: 2rem;
    width: 2rem;
    background-color: #9acf67;
    border-radius: 50%;
}
.reservation__flow__text {
    margin: 65px 0 0 5%;
}
.reservation__flow__text2 {
    margin-top: 50px;
}
.reservation__flow__text3 {
    margin-top: 50px;
}
.reservation__flow__text5 {
    margin-top: 50px;
}
.reservation__flow__text__title {
    font-size: 16px;
}
.reservation__flow__caption {
    margin: 20px 0 20px 50px;
    font-size: 14px;
    line-height: 1.5rem;
}
.reservation__flow__caption__comment {
    font-size: 13px;
}
.reservation__flow__caption a {
    text-decoration: underline;
}
.reservation__flow__caption__essential {
    margin: 10px 0 0 10px;
    border: solid 1px #9acf67;
    padding: 10px;
    font-size: 13px;
}
.reservation__flow__caption__essential li {
    list-style: inside;
}
.reservation__flow__caption__essential li p {
    margin: -24px 0 0 160px;
}
.reservation__flow__caption__essential li span {
    font-size: 12px;
    letter-spacing: 0;
}
.reservation__flow__numbering:nth-child(3) {
    top: 420px;
}
.reservation__flow__text__comment {
    margin: 20px 0 30px 50px;
    line-height: 1.5rem;
    font-size: 13px;
}
.reservation__flow__numbering:nth-child(4) {
    top: 540px;
}
.reservation__flow__numbering:nth-child(5) {
    top: 640px;
}
.reservation__flow__numbering:nth-child(6) {
    top: 760px;
}
.reservation__flow__text__attention {
    width: 55%;
    margin: 0 auto 60px ;
    font-size: 14px;
    padding-left: 60px;
}
/* introduction */
.introduction {
    background-color: #FFFEF0;
    padding: 80px 0;
}
.introduction__img-enter {
    width: 12%;
    margin: -30px auto 50px;
}
.introduction__img-enter img {
    border-radius: 15px;
    filter: drop-shadow(0 5px 5px rgba(83, 81, 54, 0.4));
}
.introduction__policy {
    display: flex;
    align-items: center;
    margin-top: 60x;
}
.introduction__policy__img-pc {
    margin-top: 30px;
    width: 70%;
    height: 70%;
    margin-right: 30px;
}
.introduction__policy__img-sp {
    display: none;
}
.policy__text {
    margin: 50px 0 50px 50px;
}
.introduction__policy__img-pc img {
    border-radius: 0 15px 15px 0;
    filter: drop-shadow(0 5px 5px rgba(83, 81, 54, 0.4));
}
.introduction__policy__text {
    margin: 10px 20px 0 30px;
    font-size: 14px;
}
.introduction__works {
    display: flex;
    margin-top: 60px;
    align-items: center;
}
.works__text {
    margin: 50px 50px 50px 0;                           
}
.introduction__works__list {
    width: 100%;
    margin-top: 30px;
    margin-left: 160px;
}
.introduction__works__list li {
    font-size: 14px;
    list-style: inside;
}
.introduction__works__img {
    margin-top: 30px;
    width: 80%;
    height: 70%;
    margin-left: 30px;
    text-align: end;
}
.introduction__works__img img {
    border-radius: 15px 0 0 15px;
    width:70%;
    filter: drop-shadow(0 5px 5px rgba(83, 81, 54, 0.4));
}
.introduction__img-group {
    position: relative;
    top: 50px;
}
.introduction__img {
    display: flex;
    width: 80%;
    margin: 70px auto;
}
.introduction__img img {
    width: 50%;
    border-radius: 15%;
    filter: drop-shadow(0 5px 5px rgba(83, 81, 54, 0.4));
}
.introduction__img__wallandowl {
    margin-left: 4%;
    width: 50%;
}
.introduction__img__from-enter {
    width: 50%;
}
.introduction__img__wall02 {
    width: 100%;
}
.introduction__img__wall03 {
    width: 80%;
    margin-top: 12px;
    margin-left: 20%;
    text-align: center;
}
.introduction__img__owl {
    width: 60%;
    margin-top: 12px;
    margin-left: 40%;
    text-align: end;
}
.introduction__img__comment {
    position: absolute;
    top: 80px;
    left: 75%;
    color: #9acf67;
    font-size: 100%;
    font-weight: 600;
    letter-spacing: 0.3rem;
}
/* counselor */
.counselor__person {
    width: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 70px auto;
}
.counselor__person__img {
    width: 30%;
    text-align: center;
}
.counselor__person__img img {
    width: 60%;
}
.sugiura img {
    width: 65%;
}
.noimage img {
    width: 30%;
}
.wada img {
    width: 40%;
}
.counselor__person__text {
    width: 50%;
    margin-left: 50px;
    vertical-align: middle;
}
.license span{
    font-size: 12px;
    font-weight: 600;
    color: #9acf67;
}
.comment {
    font-size: 13px;
    margin: 20px 0;
}
.belong {
    font-size: 13px;
}
.belong span {
    font-size: 12px;
    font-weight: 600;
    color: #9acf67;
}
/* access */
.access {
    background-color: #FFFEF0;
    padding: 70px 0;
}
.access__map {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    margin: 30px auto;
}
.access__map__img {
    width: 50%;
}
.access__map__img iframe {
    width: 100%;
    border: solid 1px #9acf67;
    border-radius: 15px;
}
.access__map__text {
    width: 45%;
    margin-left: 3%;
}
.access__map__text__name {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 20px;
}
.access__map__text__address {
    line-height: 1.3rem;
    margin-bottom: 20px;
}
.access__map__text__rout {
    font-size: 16px;
}
.access__contact {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 80%;
    margin: 60px auto;
}
.access__contact__img {
    width: 70%;
    height: 100%;
    margin-left: 50px;
}
.access__contact__img img {
    border-radius: 25px;
}
.access__contact__img p {
    font-size: 10px;
    text-align: end;
}
/* news */
.news {
    width: 70%;
    margin: 50px auto 160px;
}
.news__content a{
    display: flex;
    height: 3rem;
    border-bottom: solid 1px #9acf67;
    line-height: 3rem;
    margin-bottom: 30px;
}
.news__content__new {
    font-size: 11px;
    font-weight: 600;
    background-color: #9acf67;
    border-radius: 50px;
    width: 40px;
    text-align: center;
    margin: 10px 0;
    line-height: 1.6rem;
    color: #FFFEF0;
}
.notnew {
    background-color: #ffffff;
}
.news__content time {
    font-size: 12px;
    letter-spacing: 0;
    margin-left: 3%;
}
.news__content__title {
    font-size: 20px;
    font-weight: 600;
    margin-left: 4%;
}
.news__content__close {
    font-size: 12px;
    border: solid 1px #fd4747;
    padding: 0 3px;
    color: #fd4747;
    margin-left: 50px;
    height: 1.5rem;
    line-height: 1.5rem;
    margin: 10px auto 0;
}
.notclose {
    border: none;
}
.newslist__article {
    width: 80%;
    margin: 50px auto;
    display: flex;
    line-height: 2rem;
    border-bottom: solid 1px #9acf67;
}
.newslist__article small {
    color: #666666;
    font-size: 14px;
    margin-right: 30px;
}
.newslist__article h2 {
    font-size: 20px;
}

/* qa */
.qa {
    background-color: #FFFEF0;
    padding: 60px 0;
}
.qa__content {
    display: flex;
    justify-content: center;
    align-items: center;
}
.qa__content__img {
    width: 15%;
    margin-left: 50px;
}
.qa__content__img02 {
    display: none;
}
.qa__content__text {
    width: 60%;
    margin-left: 60px;
    line-height: 2rem;
}
.qa__content__text-inner {
    display: flex;
    justify-content: space-between;
    border: solid 1px #9acf67;
    border-radius: 15px;
    background-color: #ffffff;
    font-size: 15px;
    padding: 3px 10px;
    margin-bottom: 10px;
    cursor: pointer;
}
.qa__content__text-inner i {
    color: #9acf67;
    margin-right: 20px;
    font-size: 30px;
}
.qa__content__text-inner.active {
    color: #FFFEF2;
    background-color: #9acf67;
}
.qa__content__answer {
    display: none;
    border: solid 1px #9acf67;
    border-radius: 15px;
    background-color: #ffffff;
    font-size: 15px;
    padding: 3px 10px;
    margin-left: 20px;
    margin-bottom: 10px;
    overflow: hidden;
}
/* contact */
.contact__text {
    text-align: center;
    font-size: 16px;
    margin-top: 50px;
}
.contact__attention {
    text-align: center;
    font-size: 15px;
    margin: 10px 0 40px 0;
}
.contact__form {
    width: 60%;
    margin: 50px auto;
}
.contact__form__content {
    width: 90%;
    margin: 10px auto;
}
.contact__form__content p {
    width: 95%;
}
.contact__form__content label {
    font-size: 14px;
}
.contact__form__content span {
    font-size: 12px;
    color: #fd4747;
}
.contact__form__content input {
    border: solid 1px #666666;
    background-color: #FFFEF0;
    border-radius: 5px;
    line-height: 2rem;
    width: 100%;
    margin: 10px auto;
    text-align: center;
}
.contact__form__content textarea {
    height: 200px;
    border-radius: 5px;
    border: solid 1px #666666;
    background-color: #FFFEF0;
    width: 100%;
    margin: 10px auto;
}
.send {
    margin: 70px auto;
}
.send input[type="submit"] {
    color: #FFFEF0 ;
    border: none;
    background-color: #9acf67;
    font-size: 20px;
    font-weight: 500;
    line-height: 3rem;
}
/* footer */
.footer {
    background-color: #FFFEF0;
}
.footer__inner {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 230px;
}
.footer__inner__left {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45%;
}
.footer__inner__left img {
    width: 35%;
    height: 100%;
}
.footer__inner__left p {
    margin-left: -50px;
    font-size: 20px;
    font-weight: 600;
}
.footer__inner__left a {
    color: #9acf67;
}
.footer__inner__right {
    width: 55%;
}
.footer__inner__rightup {
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-size: 14px;
}
.footer__inner__rightup p:last-child {
    background-color: #9acf67;
    border-radius: 50px;
    line-height: 32px;
    padding-top: 2px;
    width: 100px;
    text-align: center;
}
.footer__inner__contact{
    color: #FFFEF0;
}
.footer__inner__rightdown {
    font-size: 14px;
    margin-top: 20px;
    margin-left: 20px;
}
.copyright {
    text-align: center;
}
.footer small {
    font-size: 10px;
}
/* ContactForm7 */
.page-parts__header {
    height: 250px;
    position: relative;
}
.page-parts__header img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}
.page-parts__header-title {
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    color: #FFFEF2;
    font-size: 30px;
    font-weight: bold;
    width: 20%;
    text-align: center;
    background-image: linear-gradient(90deg,rgba(255,254,240,0.4),rgba(154,207,103,0.7) 50%,rgba(255,254,240,0.4));

}

/* 送信時のメッセージ エラー文 / 送信完了文 */
.wpcf7-not-valid-tip{
    display: block;
    margin-bottom: 20px;
    color: #f00;
}
.wpcf7-response-output{
    margin: 60px auto;
    max-width: 850px;
}
.screen-reader-response{display: none;}
/* お知らせページ */
.single-parts__article {
    margin-top: 60px;
}
.single-parts__article small {
    color: #666666;
    font-size: 12px;
    margin-left: 10%;
}
.single-parts__article  h3{
    position: relative;
    z-index: 0;
    width: 50%;
    text-align: center;
    font-weight: 500;
    font-size: 22px;
    margin-top: 5px;
}
.single-parts__article h3::after {
    content: "";
    position: absolute;
    top: 15px;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 18px;
    background-image: linear-gradient(90deg, rgba(154,207,103,0.7) 60%,rgba(255,254,240,0.4) 90%,rgba(255,254,240,0));
}
.single-parts__content {
    width: 80%;
    margin: 30px auto;
}


/* responsive */
@media screen and (max-width:1168px){
    .header__menu ul {
        font-size: 0.8rem;
    }
}
@media screen and (max-width:1065px){
    .header__logo a {
        font-size: 1.3rem;
    }
}
@media screen and (max-width:1022px){
    .reservation__flow__text2 {
        margin-top: 25px;
    }
}
@media screen and (max-width:992px) {
    .access__map__text__name {
        font-size: 20px;
    }
}
@media screen and (max-width:970px) {
    .header__menu li a{
        font-size: 10px;
    }
    .header__logo a {
        font-size: 1.3rem;
    }
    .fv__concept {
        font-size: 30px;
        text-align: center;
    }
    .second-view__text {
        margin-right: 30px;
    }
    .firstcontact__target__text {
        width: 44%;
    }
    .firstcontact__target__text li {
        font-size: 13px;
    }
    .reservation__flow__line img {
        margin-left: 200%;
    }
    .reservation__flow__text {
        margin-left: 10%;
    }
    .reservation__flow__text2 {
        margin-top: 20px;
    }
    .reservation__flow__text3 {
        margin-top: 50px;
    }
    .reservation__flow__text5 {
        margin-top: 60px;
    }
    .footer__inner {
        display: block;
    }
    .footer__inner__left p {
        font-size: 16px;
        width: 100%;
        padding-left: 15px;
    }
    .footer__inner__right {
        margin-left: 10%;
        width: 80%;
        margin-top: -20px;
    }
    .footer__inner__rightdown {
        margin-top: 0;
    }
}
@media screen and (max-width:893px){
    .header__logo a {
        font-size: 1.0rem;
    }
    .header__menu {
        width: 65%;
    }
    .reservation__flow__line img {
        margin-left: 245%;
    }
}
@media screen and (max-width:854px){
    .header__logo a {
        font-size: 0.9rem;
    }
    .reservation__flow__text3 {
        margin-top: 10px;
    }
}
@media screen and (max-width:835px) {
    .access__map__text__name {
        font-size: 18px;
    }
}
@media screen and (max-width:830px) {
    .reservation__flow__line img {
        margin-left: 280%;
    }
}
@media screen and (max-width:796px) {
    .reservation__flow__text5 {
        margin-top: 30px;
    }    
}
@media screen and (max-width:767px) {
    .header {
        width: 100vw;
    }
    .header__menu {
        display: none;
    }
    .hamburger__btn {
        display: block;
        color: #9acf67;
        line-height: 70px;
        margin-right: 15px;
        font-size: 30px;
    }
    .add-menu-sp {
        position: fixed;
        top: 0;
        right: 0;
        background-color: #FFFEF0;
        display: block;
        width: 70%;
        height: 100vh;
        padding: 20px 0;
        z-index: 2;
    }
    .add-menu-sp li {
        font-weight: bold;
        margin: 50px auto;
        text-align: center;
        width: 80%;
    }
    .add-menu-sp li a {
        color: #9acf67;
    }
    .add-menu-sp li:last-child a {
        color: #FFFEF0;
    }
    .menu-sp-contact {
        background-color: #9acf67;
        border-radius: 50px;
        padding: 10px 25px;
    }
    .add-modal-sp {
        position: fixed;
        top: 0;
        left: 0;
        width: 99%;
        height: 100vh;
        display: block;
        background-color: #000000aa;
        z-index: 1;
    }
    .header__logo {
        width: 80%;
    }
    .header__logo__img {
        width: 10%;
    }
    .header__logo__img img {
        width: 100%;
    }
    .header__logo a {
        font-size: 1.5rem;
    }
    /* common */
    .section-title h2 {
        font-size: 22px;
    }
    .section-title img {
        width: 70%;
        display: block;
        margin: 0 auto;
    }
    .section-subtitle {
        font-size: 16px;
    }
    .section-subtitle h3 {
        width: 270px;
    }
    .section-subtitle h3::after {
        width: 300px;
        height: 15px;
    }
    /* fv */
    .fv__concept {
        font-size: 20px;
        width: 90%;
        margin: 0 auto;
        line-height: 50px;
        background-image: linear-gradient(90deg,rgba(255,254,240,0),rgba(154,207,103,0.7),rgba(154,207,103,0.7),rgba(255,254,240,0));
    }
    .second-view {
        width: 80%;
        font-size: 14px;
    }
    .second-view__text {
        margin: 0 auto;
    }
    .second-view__img {
        top: 105%;
        left: 43%;
    }
    .firstcontact__about p {
        font-size: 13px;
    }
    .firstcontact__target {
        display: block;
        width: 100%;
        flex-wrap: none;
    }
    .firstcontact__target__text {
        width: 90%;
        font-size: 13px;
    }
    .firstcontact__target__text li {
        font-size: 11px;
    }
    .firstcontact__target__text:last-child p {
        width: 80%;
        text-wrap: wrap;
        font-size: 10px;
        line-height: 1rem;
    }
    .firstcontact__before p {
        font-size: 13px;
    }
    .sp-owl {
        display: block;
        width: 20%;
        margin: 30px auto;
    }
    /* reservation */
    .time-and-charge h3 {
        width: 180px;
    }
    .time-and-charge h3::after {
        width: 180px;
    }
    .reservation__time__table {
        font-size: 13px;
        width: 90%;
        table-layout: auto;
    }   
    .reservation__time__table th {
        padding-left: 15px;
    }
    .reservation__time__table td {
        padding-left: 15px;
        text-wrap: nowrap;
    }
    .reservation__time__comment {
        width: 90%;
        font-size: 12px;
    }
    .reservation__charge__table {
        font-size: 13px;
        width: 90%;
    }
    .reservation__charge__table th {
        padding-left: 15px;
        text-wrap: nowrap;
    }
    .reservation__cancel__table {
        font-size: 13px;
        width: 90%;
    }
    .reservation__cancel__table th {
        padding-left: 15px;

    }
    .reservation__cancel__table td {
        padding-left: 15px;
        text-wrap: nowrap;
    }
    .reservation__flow {
        width: 90%;
    }
    .reservation__flow__line {
        left: 0;
    }
    .reservation__flow__line img {
        height: 85%;
        margin-left: 230%;
    }
    .reservation__flow__numbering {
        left: 40%;
    }
    .reservation__flow__text {
        margin-left: 10%;
    }
    .reservation__flow__text2 {
        margin-top: 100px;
    }
    .reservation__flow__text3 {
        margin-top: 70px;
    }
    .reservation__flow__text4 {
        margin-top: 50px;
    }
    .reservation__flow__text5 {
        margin-top: 60px;
    }
    .reservation__flow__text__title {
        font-size: 14px;
    }
    .reservation__flow__caption {
        font-size: 11px;
        line-height: 1.2rem;
    }
    .reservation__flow__caption__comment {
        font-size: 11px;
    }
    .reservation__flow__caption__essential {
        font-size: 11px;
        margin: 10px 0 0 0;
    }
    .reservation__flow__caption__essential li p {
        margin: 0;
    }
    .reservation__flow__caption__essential li span {
        font-size: 11px;
    }
    .reservation__flow__numbering:nth-child(3) {
        top: 440px;
    }
    .reservation__flow__text__comment {
        line-height: 1.2rem;
        font-size: 11px;
    }
    .reservation__flow__numbering:nth-child(4) {
        top: 570px;
    }
    .reservation__flow__numbering:nth-child(5) {
        top: 680px;
    }
    .reservation__flow__numbering:nth-child(6) {
        top: 800px;
    }
    .reservation__flow__text__attention {
        width: 90;
        font-size: 11px;
        padding: 0;
    }
    /* introduction */
    .introduction__img-enter {
        width: 20%;
        margin: -60px auto 50px;
    }
    .introduction__policy {
        display: block;
    }
    .introduction__policy__img-pc {
        display: none;
    }
    .introduction__policy__img-sp {
        display: block;
        width: 80%;
        height: 80%;
        filter: drop-shadow(0 5px 5px rgba(83, 81, 54, 0.4));    
    }
    .introduction__policy__img-sp img {
        border-radius: 0 15px 15px 0;
    }
    .policy__text {
        margin-bottom: 30px;
    }
    .introduction__poicy__text {
        font-size: 13px;
        width: 50%;
    }
    .policy {
        margin-left: 0;
    }
    .policy__text {
        margin-left: 0;
    }
    .policy h3 {
        text-align: end;
    }
    .policy h3::after {
        transform: none;
    }
    .introduction__works {
        display: block;
    }
    .introduction__works__list {
        margin-left: 90px;
    }
    .introduction__works__list li {
        font-size: 13px;
    }
    .introduction__works__img {
        width: 100%;
        height: 90%;
        margin-left: 0;
    }
    .introduction__img-group {
        top: 70px;
        margin-bottom: 140px;
    }
    .introduction__img {
        width: 70%;
        margin: 80px auto;
    }
    .introduction__img__wallandowl {
        margin: 30px 0 0 5%;
    }
    .introduction__img__wall02 {
        width: 98%;
        margin: 10px auto;
    }
    .introduction__img__wall03 {
        width: 98%;
        margin: 50px auto;
    }
    .introduction__img__owl {
        display: none;
    }
    .introduction__img__comment {
        top: -80px;
        left: 20%;
        font-size: 15px;
    }
    /* counselor */
    .counselor__person {
        display: block;
    }
    .counselor__person__img {
        width: 80%;
        margin: 0 auto;
    }
    .counselor__person__text {
        width: 90%;
        margin: 40px auto;
    }
    /* access */
    .access__map {
        display: block;
        width: 90%;
        margin: 0 auto;
    }
    .access__map__img {
        width: 80%;
        margin: 0 auto;
    }
    .access__map__text {
        width: 80%;
        margin: 20px auto;
    }
    .access__map__text__name {
        font-size: 16px;
    }
    .access__map__text__address {
        font-size: 13px;
    }
    .access__map__text__rout {
        font-size: 13px;
    }
    .access__contact {
        display: block;
    }
    .access__contact__img {
        width: 80%;
        margin: 0 auto;
    }
    .access__contact__mail {
        margin-left: 18%;
    }
    /* news */
    .news {
        width: 90%;
        margin: 50px auto;
    }
    .news__content__new {
        font-size: 9px;
        width: 30px;
    }
    .news__content time {
        font-size: 10px;
        letter-spacing: 0;
        margin-left: 10px;
    }
    .news__content__title {
        font-size: 16px;
        margin-left: 10px;
    }
    .news__content__close {
        font-size: 10px;
    }
    /* qa */
    .qa {
        padding: 30px;
    }
    .qa__content {
        display: block;
    }
    .qa__content__img {
        display: none;
    }
    .qa__content__img02 {
        display: block;
        width: 30%;
        margin: 30px auto;
    }
    .qa__content__text {
        width: 90%;
        margin: 0 auto;
        line-height: 1.3rem;
    }
    .qa__content__text-inner {
        font-size: 12px;
        border-radius: 10px;
    }
    .qa__content__answer {
        font-size: 12px;
        border-radius: 10px;
    }
    .qa__content__text-inner i {
        margin: 5px 10px;
        font-size: 24px;
        line-height: 2rem;
    }
    /* contact */
    .contact {
        width: 80%;
    }
    .contact__text {
        font-size: 14px;
        width: 80%;
        margin: 30px auto 0;
    }
    .contact__attention {
        font-size: 12px;
    }
    .contact__form__content {
        width: 100%;
    }
    .contact__form__content label {
        width: 45%;
        font-size: 14px;
    }
    .contact__form__content span {
        font-size: 10px;
    }
    .contact__form__content input {
        width: 100%;
        line-height: 1.3rem;
        border-radius: 5px;
    }
    .page-parts__header-title {
        font-size: 130%;
    }
    .newslist__article small {
        font-size: 8px;
        letter-spacing: 0;
    }
    .newslist__article h2 {
        font-size: 16px;
        font-weight: 600;
    }
    /* footer */
    .footer__inner {
        display: block;
    }
    .footer__inner__left {
        width: 100%;
    }
    .footer__inner__left img {
        width: 25%;
    }
    .footer__inner__left p {
        margin: 35px 0 0 -45px;
        font-size: 16px;
    }
    .footer__inner__right {
        width: 90%;
        margin: -40px auto 0;
    }
    .footer__inner__rightup {
        /* display: block; */
        font-size: 10px;
        letter-spacing: 0;
    }
    .footer__inner__rightdown {
        font-size: 10px;
        margin: 10px 0 50px 30px;
    }
    .footer__inner__rightup p:last-child {
        width: 70px;
        line-height: 20px;
        margin: 0;
    }
    .copyright {
        margin-top: 3%;
    }
    .copyright small {
        font-size: 8px;
    }
}
@media screen and (max-width: 660px) {
    .reservation__flow__line img {
        margin-left: 270%;
    }
}
@media screen and (max-width: 638px){
    .reservation__flow__text2 {
        margin-top: 75px;
    }
}
@media screen and (max-width: 624px) {
    .reservation__flow__text3 {
        margin-top: 50px;
    }
}
@media screen and (max-width: 583px){
    .reservation__flow__text3 {
        margin-top: 50px;
    }
    .reservation__flow__text5 {
        margin-top: 40px;
    }
    .reservation__flow__line img {
        margin-left: 320%;
    }
}
@media screen and (max-width: 560px) {
    .reservation__flow__line img {
        margin-left: 360%;
    }
    .footer__inner__right {
        margin-top: -20px;
    }
}
@media screen and (max-width: 510px) {
    .reservation__flow__line img {
        margin-left: 410%;
    }
}
@media screen and (max-width: 498px) {
    .reservation__flow__text2 {
        margin-top: 60px;
    }
    .news__content a {
        display: grid;
        grid-template-columns: 10% auto 15%;
        height: 5rem;
        line-height: 1rem;
    }
    .news__content__new {
        padding-top: 5px;
    }    
    .news__content a time {
        grid-column: 2/3;
        grid-row: 1/2;
        margin-top: 10px;
    }
    .news__content__title {
        grid-column: 2/3;
        grid-row: 2/3;
    }
    .news__content__close {
        grid-column: 3/4;
        grid-row: 1/2;
    }
}
@media screen and (max-width: 480px) {
    .header__logo a {
        font-size: 1.3rem;
    }
    .page-parts__header-title {
        font-size: 120%;
    }
    .reservation__flow__line img {
        margin-left: 485%;
    }
    .fv__concept {
        font-size: 16px;
    }
    .reservation__flow__text2 {
        margin-top: 43px;
    }
    .access__map__img {
        width: 80%;
        margin: 0 auto;
    }
    .access__map__img iframe {
        width: 100%;
        height: 80%;
    }
    .access__contact__btn {
        width: 80%;
    }
    .access__contact__mail {
        width: 80%;
        margin: 20px auto;
    }
    .footer__inner {
        height: fit-content;
    }
    .footer__inner__right {
        margin-top: 5px;
    }
    .footer__inner__left p {
        margin-top: 5px;
        font-size: 14px;
    }
    .footer__inner__rightdown {
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 462px) {
    .footer__inner__rightup {
        margin: -30px 0 0 10%;
        display: block;
        line-height: 1.2rem;
    }  
    .footer__inner__left a {
        padding-left: 6%;
    }  
}
@media screen and (max-width:440px) {
    .reservation__flow__line img {
        margin-left: 495%;
    }
}
@media screen and (max-width:430px) {
    .reservation__flow__line img {
        margin-left: 645%;
    }
}
@media screen and (max-width: 405px) {
    .header__logo a {
        font-size: 1rem;
    }
}
@media screen and (max-width: 400px) {
    .reservation__flow__text4 {
        margin-top: 30px;
    }
    .news__content__close {
        font-size: 9px;
    }
}
@media screen and (max-width:390px) {
    .reservation__flow__line img {
        margin-left: 745%;
    }
    .news__content__title {
        font-size: 14px;
    }
}
@media screen and (max-width: 375px) {
    .reservation__flow__text2 {
        margin-top: 20px;
    }
    .reservation__flow__text {
        margin-left: 15%;
    }
    .news__content a {
        grid-template-columns: 10% auto 20%;
        line-height: 1.2rem;
    }
}
@media screen and (max-width: 366px) {
    .news__content__title {
        font-size: 12px;
    }   
    .news-index {
        width: 60%;
    } 
}
@media screen and (max-width: 360px) {
    .reservation__flow__text3 {
        margin-top: 35px;
    }
    .access__contact__mail {
        width: 100%;
    }
}
@media screen and (max-width:350px) {
    .reservation__flow__line img {
        margin-left: 930%;
    }
}
@media screen and (max-width: 344px) {
    .reservation__flow__text5 {
        margin-top: 0px;
    }
}
@media screen and (max-width: 341px) {
    .reservation__flow__text3 {
        margin-top: 32px;
    }
    .access__map__text__name {
        font-size: 14px;
    }
}
@media screen and (max-width: 325px) {
    .reservation__flow__text5 {
        margin-top: 0px;
    }
    .news__content__title {
        font-size: 10px;
    }
    .news-index a {
        font-size: 14px;
    }
}
@media screen and (max-width: 312px) {
    .header__logo a {
        font-size: 0.8rem;
    }
}
@media screen and (max-width:306px) {
    .firstcontact__target__text {
        margin: 10px;
        width: 90%;
    }
    .reservation__flow__line img {
        margin-left: 1160%;
    }
    .reservation__flow__text {
        margin-left: 15%;
    }
    .reservation__flow__numbering:nth-child(3) {
        top: 460px;
    }
    .reservation__flow__numbering:nth-child(4) {
        top: 590px;
    }
    .reservation__flow__numbering:nth-child(5) {
        top: 698px;
    }
    .reservation__flow__numbering:nth-child(6) {
        top: 828px;
    }
    .access__map__text__name {
        font-size: 12px;
    }
}
@media screen and (max-width: 296px) {
    .reservation__flow__text {
        margin-left: 15%;
    }
    .reservation__flow__caption {
        margin-left: 0;
    }
    .reservation__flow__text__comment {
        margin-left: 0;
    }
    .reservation__flow__text2 {
        margin-top: 40px;
    }
    .reservation__flow__text5 {
        margin-top: 50px;
    }
    .reservation__flow__numbering:nth-child(3) {
        top: 460px;
    }
    .reservation__flow__numbering:nth-child(4) {
        top: 570px;
    }
    .reservation__flow__numbering:nth-child(5) {
        top: 678px;
    }
    .reservation__flow__numbering:nth-child(6) {
        top: 808px;
    }
}
@media screen and (max-width: 294px) {
    .reservation__flow__numbering:nth-child(3) {
        top: 460px;
    }
    .reservation__flow__numbering:nth-child(4) {
        top: 590px;
    }
    .reservation__flow__numbering:nth-child(5) {
        top: 698px;
    }
    .reservation__flow__numbering:nth-child(6) {
        top: 828px;
    }
}
@media screen and (max-width: 284px) {
    .access__contact__mail p {
        font-size: 12px;
    }
    .news-index a {
        font-size: 12px;
    }
}
@media screen and (max-width: 277px) {
    .reservation__flow__text5 {
        margin-top: 30px;
    }
    .news__content__title {
        font-size: 9px;
    }
    .news__content__close {
        font-size: 8px;
    }
}
@media screen and (max-width:252px) {
    .access__contact__btn a {
        font-size: 12px;
    }
}