/* 全体 */

body {
    font-size: 24px;
    font-family: 'Shippori Mincho', serif;
}

footer {
    background-color: #4D4545;
    color: #F5DAE3;
    text-align: center;
    padding: 50px 0;
}

/* Main Page */

header h1 img {
    width: 90%;
    height: auto;
    padding: 30px 0;
}

header h1 {
    text-align: center;
    margin-bottom: 40px;
}

header .catch-copy {
    text-align: center;
    margin-bottom: 80px;
    font-weight: bold;
    font-size: 36px;
}

.catch-copy::before,
.catch-copy::after {
    content: "----------------------";
    border-top: 0 solid #333;
}

main .concept {
    margin-bottom: 100px;
}

main .concept .top,
main .concept .center,
main .concept .bottom {
    display: flex;
    justify-content: space-around;
}

main .concept .explain {
    width: 30%;
    height: 20%;
    margin: auto 0;
}

.menu {
    display: flex;
    justify-content: space-around;
    gap: 20px;
    margin-bottom: 100px;
}

.menu a {
    display: block;
}

.menu img {
    display: block;
    max-width: 100%;
    height: auto;
}

/* pagetop */
#pagetop {
    position: fixed;
    right: 20px;
    bottom: 40px;
    cursor: pointer;
    z-index: 10;
    text-align: center;
}

/* 子ページ全体 */

header .top_part {
    display: flex;
    justify-content: space-evenly;
    gap: 36%;
    padding: 64px 36px;
    margin-bottom: 64px;

}

header .top_part .logo {
    display: block;
    width: 74%;
    height: auto;
    margin: auto 0;
}

header .top_part .nav {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

header .top_part .nav a {
    display: block;
    max-width: 100%;
}

header .top_part .nav img {
    display: block;
    max-width: 80%;
    height: auto;
}

header h1 .title {
    width: 20%;
    margin: 0 auto;
}

header .catchCopyC {
    text-align: center;
    font-size: 36px;
    font-weight: bold;
    transform: translateY(-20px);
    margin-bottom: 100px;
}

/* 旅 */


.inside_nav {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    margin-bottom: 120px;
    width: 80%;
}


.inside_nav img {
    display: block;
    max-width: 80%;
    height: auto;
    margin: 0 auto;
}

.history_content {
    background-color: rgba(244, 242, 166, 0.3);
    padding: 160px 120px 60px;
}

.nature_content {
    background-color: rgba(202, 242, 167, 0.3);
    padding: 160px 120px 60px;
}

.healing_content {
    background-color: rgba(249, 223, 199, 0.3);
    padding: 160px 120px 60px;
}

.history,
.nature,
.healing {
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: 200px;

}

.history h2,
.nature h2,
.healing h2 {
    transform: translateX(-100px) translateY(140px);
}

.item {
    display: flex;
    align-items: center;
    gap: 60px;
    margin-bottom: 24px;

}

.item.left {
    flex-direction: row;
}

.item.right {
    flex-direction: row-reverse;
}

.photo,
.text {
    width: 50%;
}

.photo img {
    width: 100%;
    display: block;
}

.line_right,
.line_left {
    transform: translateX(500px) translateY(-35px);
    width: 80%;
}

.spot_name {
    font-weight: bold;
    margin-bottom: 20px;
}

.address,
.point,
.access {
    font-size: 20px;
    margin-bottom: 16px;
    line-height: 1.8;
}


/* 食 */

.eat01,
.eat02,
.eat03 {
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: 200px;
}

.eat01 h2,
.eat02 h2,
.eat03 h2 {
    text-align: center;
    margin-bottom: 54px;
}

.eat01 h2 img,
.eat02 h2 img,
.eat03 h2 img {
    width: 30%;
    height: auto;
}

.eat_top,
.eat_center,
.eat_bottom {
    display: flex;
    justify-content: space-between;
    gap: 60px;
}

.eat_top img,
.eat_center img,
.eat_bottom img {
    display: block;
    width: 48%;
    height: auto;
}

.eat_main {
    background: url(../images/eat_page/bk_eat.png) no-repeat center center;
    background-position: cover;
    background-size: 96%;
    padding: 40px;
}


/* 人 */

.people01,
.people02,
.people03 {
    max-width: 1400px;
    margin: 0 auto;
    margin-bottom: 200px;
}

.people_top,
.people_center,
.people_bottom {
    display: flex;
    justify-content: space-between;

}

.people_photo_name {
    flex-basis: 36%;
}

.p_ex {
    flex-basis: 64%;
    display: block;
}

.sp-text {
    display: none;
}

.people_top img,
.people_center img,
.people_bottom img {
    display: block;
    width: 48%;
    height: auto;
}

.people_photo_name img {
    display: block;
    width: 80%;
    height: auto;
    margin-bottom: 20px;
    padding-bottom: 20px;
    margin: 0 auto;
}

.person {
    text-align: center;
    width: 50%;
    background-color: rgb(134, 160, 160);
    margin: 0 auto;
    color: ghostwhite;
    padding: 20px;
}

.real {
    display: none;
}

.person:hover .real {
    display: inline;

}

.person:hover {

    background-color: #D7F7E1;
    color: #24258C;
    font-weight: bold;
}

.person:hover .name {
    display: none;
}


/* 知 */

.kn_main {
    max-width: 1400px;
    margin: 0 auto;
}

.knowledge01 img,
.knowledge02 img,
.knowledge03 img {
    width: 60%;
    margin: 0 auto;
}

.knowledge01,
.knowledge02,
.knowledge03 {
    max-width: 1400px;
    text-align: center;
    background-color: rgba(187, 226, 241, 0.3);
    margin: 40px auto;
    border-radius: 40px;
}

.knowledge01 p,
.knowledge02 p,
.knowledge03 p {
    transform: translateY(-60px);
}

/* SP版 */
@media (max-width: 640px) {

    /* main */
    header .catch-copy {
        font-size: 12px;
        margin-bottom: 48px;
        max-width: 100%;
    }

    main .concept .top,
    main .concept .center,
    main .concept .bottom {
        display: block;
        text-align: center;

    }

    main .concept {
        max-width: 100%;
    }

    .concept .center img {
        max-width: 50%;
    }

    main .concept .explain {
        width: 80%;
    }

    .concept .top img,
    .concept .bottom img {
        max-width: 70%;
        margin: 0 auto;
        margin-bottom: 30px;
    }

    .catch-copy::before,
    .catch-copy::after {
        content: "";
        border-top: 0 solid #333;
    }

    .menu {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .menu a {
        width: 40%;
    }

    #pagetop {
        right: -16px;
        width: 40%;
    }

    /* 子ページ共通 */

    header .top_part {
        display: block;
        padding-bottom: 40px;
    }

    header .top_part .logo {
        width: 60%;
        margin-bottom: 40px;
    }

    header .top_part,
    header .catchCopyC,
    header h1,
    .inside_nav {
        margin-bottom: 10px;
    }

    header .catchCopyC {
        font-size: 24px;
    }

    .inside_nav {
        width: 92%;
    }

    /* 旅 */

    #nav_his img,
    #nav_nat img,
    #nav_hl img {
        width: 30%;
    }

    .history,
    .nature,
    .healing {
        max-width: 84%;
        margin: 0 auto;
        margin-bottom: 200px;

    }

    .history_content,
    .nature_content,
    .healing_content {
        padding: 36px 0;
        text-align: center;
    }

    .history h2,
    .nature h2,
    .healing h2 {
        transform: translateY(30px);
    }

    .item {
        display: block;
        width: 90%;
        margin: 0 auto;
    }

    .photo,
    .text {
        width: 90%;
        text-align: center;
    }

    .photo img {
        margin-bottom: 36px;

    }


    .item.left,
    .item.right {
        align-items: center;
    }

    .line_right,
    .line_left {
        transform: translateX(0px) translateY(0px);

    }

    .line_right img,
    .line_left img {
        width: 16%;
        margin: 10px;

    }

    .address,
    .point {
        font-size: 12px;
        margin-bottom: 8px;
    }

    .spot_name {
        font-size: 18px;
        margin-bottom: 8px;
    }

    /* 食 */

    .eat01,
    .eat02,
    .eat03 {
        max-width: 100%;
        background-color: antiquewhite;
        padding: 20px;
        margin-bottom: 36px;
        border-radius: 20px;
    }

    .eat01 h2,
    .eat02 h2,
    .eat03 h2 {
        margin-bottom: 24px;
    }

    .eat_top,
    .eat_center,
    .eat_bottom {
        display: flex;
        flex-direction: column;
        gap: 36px;
    }

    .eat_center .explain_nasu {
        order: 1;
    }

    .item.right .photo_nasu {
        order: 2;
    }

    .eat_top img,
    .eat_center img,
    .eat_bottom img {
        display: block;
        width: 100%;
        height: auto;
    }

    .eat_main {
        background: none;
    }

    .eat01 h2 img,
    .eat02 h2 img,
    .eat03 h2 img {
        width: 100%;
    }

    /* 人 */

    .people01,
    .people02,
    .people03 {
        max-width: 100%;
        margin: 0 auto;
        margin-bottom: 36px;
    }

    .people_top,
    .people_center,
    .people_bottom {
        display: block;
        padding: 20px 0;
        margin-bottom: 20px;

    }

    .people_photo_name {
        margin-bottom: 20px;
    }

    .people_center .p_ex,
    .people_top .p_ex,
    .people_bottom .p_ex {
        display: none;
    }

    .sp-text {
        display: block;
        font-size: 14px;
        border: #4f4040 solid 2px;
        width: 90%;
        margin: 0 auto;
        padding: 20px;
        border-radius: 20px;
        line-height: 1.8;
    }

    /* 知 */

    .kn_main {
        max-width: 100%;
    }

    .knowledge01 img,
    .knowledge02 img,
    .knowledge03 img {
        width: 100%;

    }

    .knowledge01,
    .knowledge02,
    .knowledge03 {
        max-width: 88%;
        padding: 20px;

    }

    .knowledge01 p,
    .knowledge02 p,
    .knowledge03 p {
        transform: translateY(0px);
        display: block;
        width: 100%;
        font-size: 16px;
    }

    /* ここまで記述 */
}