:root {

    /* 文字間 */
    --lsp-80: 0.08em;
    --lsp-50: 0.05em;
    --lsp-40: 0.04em;
    --lsp-35: 0.035em;
    --lsp-25: 0.025em;
    --lsp-20: 0.02em;
    --lsp-15: 0.015em;
    --lsp-10: 0.01em;

    /* 行送り */
    --lh-22: 2.2;
    --lh-20: 2;
    --lh-18: 1.8;
    --lh-16: 1.6;
    --lh-14: 1.4;

    /* 太さ */
    --fw-700: 700;
    --fw-500: 500;


    /* カラー */
    --blue: #3287E6;
    --m-blue: #D2EBFF;
    --l-blue: #F0FFFF;
    --l2-blue: #F2FAFF;
    --red: #FF5A64;
    --yellow: #FFF073;
    --pink: #FFD7E1;
    --l-pink: #FAF2F7;


    /* フォント */
    --ff-twnoto: "Noto Sans TC", serif;
}

html {
    font-size: 62.5%;
    scroll-behavior: smooth;
}

body {
    font-family: var(--ff-twnoto);
    color: var(--blue);
    letter-spacing: var(--lsp-50);
    line-height: var(--lh-14);
    font-weight: var(--fw-500);
}

a {
    display: block;
}

img {
    display: block;
    max-width: 100%;
}

.m-view {
    display: none;
}

.sp-view {
    display: none;
}

@media screen and (max-width:1800px) {
    html {
        font-size: 57%;
    }
}

@media screen and (max-width:1700px) {
    html {
        font-size: 55%;
    }
}

@media screen and (max-width:1600px) {
    html {
        font-size: 50%;
    }
}

@media screen and (max-width:1400px) {
    html {
        font-size: 48%;
    }
}

@media screen and (max-width:1200px) {
    html {
        font-size: 46%;
    }
}

@media screen and (max-width:1000px) {
    html {
        font-size: 43%;
    }
}

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

    html {
        font-size: 80%;
    }

    .pc-view {
        display: none;
    }
    
    .m-view {
        display: block
    }

}

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

    html {
        font-size: 62.5%;
    }
    
    .m-view {
        display: none;
    }

    .sp-view {
        display: block;
    }

}

/* 言語ボタン共通 */

.lang-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lang-btn p a {
    font-size: 2.6rem;
    font-weight: var(--fw-700);
    display: block;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: var(--lsp-50);
}

/* ボタン共通 */

.l-btn {
    width: 37.5vw;
    margin-left: auto;
    margin-right: auto;
    border-radius: 100px;
    transition: 0.3s;
}

.l-btn a {
    position: relative;
    padding: 20px 40px;
    font-size: 2.8rem;
    font-weight: var(--fw-700);
    line-height: var(--lh-14);
    letter-spacing: var(--lsp-20);
    text-align: center;
    transition: 0.3s;
}

.l-btn a::before {
    content: "";
    display: block;
    width: 27px;
    height: 23px;
    object-fit: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 2vw;
    -webkit-mask-image: url(../images/arrow.svg);
    mask-image: url(../images/arrow.svg);-webkit-mask-repeat: no-repeat;
    mask-size: contain;
    mask-repeat: no-repeat;
    transition: 0.4s;
}

.l-btn:hover {
    transform: translateY(-5px);
    opacity: 0.8;
}

.l-btn a:hover::before {
    right: 1.5vw;
}

.m-btn {
    width: 22vw;
    margin-left: auto;
    margin-right: auto;
    border-radius: 60px;
    transition: 0.3s;
}

.m-btn a {
    position: relative;
    padding: 25px 40px;
    font-size: 2rem;
    line-height: var(--lh-14);
    letter-spacing: var(--lsp-20);
    text-align: center;
    transition: 0.3s;
}

.m-btn a::before {
    content: "";
    display: block;
    width: 22px;
    height: 17px;
    object-fit: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1.2vw;
    -webkit-mask-image: url(../images/arrow.svg);
    mask-image: url(../images/arrow.svg);-webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    transition: 0.3s;
}

.m-btn:hover {
    transform: translateY(-5px);
    opacity: 0.8;
}

.m-btn a:hover::before {
    right: 0.9vw;
}


.s-btn {
    width: 19.5vw;
    margin-left: auto;
    margin-right: auto;
    border-radius: 60px;
    transition: 0.3s;
}

.s-btn a {
    position: relative;
    padding: 25px 40px;
    font-size: 2rem;
    line-height: var(--lh-14);
    letter-spacing: var(--lsp-20);
    text-align: center;
    font-weight: var(--fw-700);
    transition: 0.3s;
}

.s-btn a::before {
    content: "";
    display: block;
    width: 20px;
    height: 17px;
    object-fit: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1.2vw;
    -webkit-mask-image: url(../images/arrow.svg);
    mask-image: url(../images/arrow.svg);-webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    transition: 0.3s;
}

.s-btn:hover {
    transform: translateY(-5px);
    opacity: 0.8;
}

.s-btn a:hover::before {
    right: 0.9vw;
}

.red-btn {
    background-color: var(--red);
}

.red-btn a {
    color: #fff;
}

.red-btn a::before {
    background-color: #fff;
}

.yellow-btn {
    background-color: var(--yellow);
}

.yellow-btn a {
    padding-top: 40px;
    padding-bottom: 40px;
}

.yellow-btn a::before {
    background-color: var(--blue);
}

.blue-btn {
    background-color: var(--blue);
}

.blue-btn a {
    color: #fff;
}

.blue-btn a::before {
    background-color: #fff;
}

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

    .l-btn {
        width: 42.5vw;
    }

    .m-btn {
        width: 30vw;
    }

}

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

    .l-btn {
        width: 100%;
        transition: 0;
    }

    .l-btn a {
        font-size: 1.6rem;
        padding: 20px;
    }

    .l-btn a::before {
        width: 18px;
        height: 15px;
        right: 6vw;
    }

    .l-btn:hover {
        transition: 0;
        transform: translateY(0);
        opacity: 1;
    }

    .l-btn a:hover::before {
        right: 6vw;
    }

    .m-btn {
        width: 86.5vw;
        transition: 0;
    }

    .m-btn a {
        font-size: 1.6rem;
        padding: 20px 25px;
    }

    .m-btn:hover {
        transition: 0;
        transform: translateY(0);
        opacity: 1;
    }

    .m-btn a::before {
        right: 6vw;
    }

    .m-btn a:hover::before {
        right: 6vw;
    }

    .s-btn {
        width: 70vw;
        min-width: 260px;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        transition: 0;
    }

    .s-btn a {
        padding: 20px 30px;
        font-size: 1.6rem;
    }

    .s-btn:hover {
        transition: 0;
        transform: translateX(-50%);
        opacity: 1;
    }

    .s-btn a::before {
        right: 6vw;
    }

    .s-btn a:hover::before {
        right: 6vw;
    }

}

/* header */

header {
    padding: 2.5vw 4vw 0;
    height: 55vw;
    width: 100%;
    background-image: url(../images/tw-mv-pc.png);
    background-size: 100%;
    background-repeat: no-repeat;
    position: relative;
    z-index: 100;
}

.pc-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pc-wrap h1 {
    width: 23vw;
    min-width: 350px;
}

.header-btn {
    width: 240px;
}

.header-btn p a {
    width: 70px;
    height: 70px;
}

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

    .header-btn {
        width: 220px;
    }
    
    .header-btn p {
        width: 65px;
        height: 65px;
        
    }

}


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

    body.hidden {
        overflow: hidden;
    }

    header {
        background-image: url(../images/tw-mv-sp.png);
        height: 177vw;
        padding: 0;
        z-index: 1000;
    }

    .pc-wrap {
        display: none;
    }

    .sp-wrap_group {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        padding: 4.5vw 4vw 4vw;
        transition: 0.3s;

    }

    .sp-wrap_group.bg-change {
        background-color: #fff;
        box-shadow: 0px 10px 10px 0px rgba(51,51,51,0.15);;
        transition: 0.3s;
    }

    .sp-wrap h1 {
        width: 60vw;
    }

    .hamburger {
        width: 50px;
        height: 38px;
        position: relative;
        cursor: pointer;
    }

    .hamburger span {
        display: block;
        width: 100%;
        height: 6px;
        background-color: var(--blue);
        border-radius: 10px;
        position: absolute;
        left: 0;
        transition: 0.4s;
    }

    .hamburger span:nth-child(1) {
        top: 0;
    }
    .hamburger span:nth-child(2) {
        top: 50%;
        transform: translateY(-50%);
    }
    .hamburger span:nth-child(3) {
        bottom: 0;
    }

    .hamburger.close {
        margin-right: 20px;
    }

    .hamburger.close span {
        transition: 0.4s;
    }

    .hamburger.close span:nth-child(1) {
        transform: rotateZ(45deg);
        top: 14px;
    }
    .hamburger.close span:nth-child(2) {
        opacity: 0;
    }
    .hamburger.close span:nth-child(3) {
        transform: rotateZ(-45deg);
        bottom: 18px;
    }

    header .sp-menu {
        display: none;
        width: 100%;
        height: calc(100vh - 12.5vw);
        /* height: calc(100vh - 13vw); */
        background-color: var(--blue);
        position: fixed;
        top: 12.5vw;
        /* top: 13vw; */
        left: 0;
        padding-top: 58px;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
        z-index: 1000;
    }

    header .sp-menu.open {
        display: block;
    }

    header .sp-menu li {
        border-bottom: 1px solid #fff;
    }

    header .sp-menu li a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        color: #fff;
        font-size: 2rem;
        font-weight: var(--fw-700);
        padding: 30px 5px;
        position: relative;
    }

    header .sp-menu li a::after {
        content: "";
        width: 18px;
        height: 15px;
        object-fit: contain;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 2vw;
        -webkit-mask-image: url(../images/arrow.svg);
        mask-image: url(../images/arrow.svg);-webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        mask-size: contain;
        background-color: #fff;
    }

    header .sp-menu li a svg {
        margin-right: 10px;
    }

    header .header-btn_wrap {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 16vw;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }

    header .header-btn_wrap .header-sns {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    header .header-btn_wrap .header-sns p:nth-child(1) {
        margin-right: 20px;
        width: 45px;
    }

    header .header-btn_wrap .header-sns p:nth-child(2) {
        width: 40px;
    }

    header .sp-menu .sp-header_btn {
        width: 170px;
    }

    header .sp-menu .sp-header_btn p a {
        font-size: 1.8rem;
        width: 50px;
        height: 50px;
    }
}

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

    .hamburger {
        width: 25px;
        height: 19px;
    }

    .hamburger.close {
        margin-right: 0;
    }

    .hamburger span {
        height: 1px;
        border: 2px solid var(--blue);
    }

    .hamburger span:nth-child(1) {
        top: -1px;
    }

    .hamburger span:nth-child(2) {
        top: 9px;
    }

    .hamburger span:nth-child(1) {
        bottom: 0;
    }

    .hamburger.close span:nth-child(1) {
        top: 8px;
    }

    .hamburger.close span:nth-child(3) {
        bottom: 7px;
    }

    header .sp-menu {
        padding-top: 20px;
    }

    header .header-btn_wrap {
        bottom: 25vw;
    }

}

@media screen and (max-width:450px) {
    header .sp-menu {
        height: calc(100vh - 13vw);
        top: 13vw;
    }

}

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

    header .header-btn_wrap {
        bottom: 16vh;
    }

}

/* main */

main {
    position: relative;
    top: -3vw;
    z-index: 1;
}

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

    main {
        top: -12vw;
    }

}


/* about */

.about {
    background-color: var(--l-blue);
    padding-top: 7vw;
    padding-left: 13.5vw;
    padding-bottom: 6vw;
    background-image: url(../images/about-map_pc.png);
    background-repeat: no-repeat;
    background-position: right top -1vw;
    background-size: 46vw;
    position: relative;
    z-index: 0;
}

.about .wrap h2 {
    margin-bottom: 40px;
}

.about .wrap .catch {
    font-size: 4rem;
    font-weight: var(--fw-700);
    line-height: var(--lh-18);
    margin-bottom: 35px;
    letter-spacing: var(--lsp-50);
}

.about .wrap .desc {
    font-size: 2.5rem;
    font-weight: var(--fw-700);
    letter-spacing: var(--lsp-50);
}

.about .wrap .desc .lsp {
    letter-spacing: -0.29em;
}

.about .wrap .desc .lsp295 {
    letter-spacing: -0.01em;
}

.about .wrap .desc .lsp100 {
    letter-spacing: 0.1em;
}

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

    .about {
        padding-top: 16.5vw;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
        padding-bottom: 108vw;
        background-image: url(../images/about-map_sp.png);
        background-position: bottom 16vw right;
        background-size: 94%;
    }

    .about .wrap h2 {
        margin-bottom: 20px;
    }

    .about .wrap .catch {
        font-size: 2rem;
        line-height: var(--lh-20);
        margin-bottom: 15px;
    }

    .about .wrap .desc {
        font-size: 1.6rem;
        line-height: var(--lh-20);
        letter-spacing: var(--lsp-40);
    }

    .about .wrap .desc .lsp {
        letter-spacing: -0.8rem;
    }

    .about .wrap .desc .lsp295 {
        letter-spacing: -0.08rem;
    }

}

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

    .about .wrap .desc {
        letter-spacing: var(--lsp-20);
    }

    .about .wrap .desc .lsp295 {
        letter-spacing: -0.8rem;
    }

}

/* PCメニュー */

.p-nav {
    background-image: url(../images/pc-nav_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 0 92px;
}

.p-nav ul {
    display: flex;
    align-items: center;
    justify-content: center;
}

.p-nav ul li {
    position: relative;
}

.p-nav ul li a {
    padding-left: 5vw;
    padding-right: 5vw;
    font-size: 2.8rem;
    font-weight: var(--fw-700);
    width: 100%;
    height: 100%;
    letter-spacing: var(--lsp-50);
}

.p-nav ul li:nth-child(1) a::after,
.p-nav ul li:nth-child(2) a::after {
    content: "";
    display: block;
    width: 4px;
    height: 80px;
    background-color: #fff;
    position: absolute;
    top: -10px;
    right: 0;
}

.p-nav ul li a span {
    display: flex;
    align-items: center;
    flex-direction: column;
    color: #fff;
    position: relative;
}

.p-nav ul li a svg {
    margin-bottom: 10px;
}

.p-nav ul li a:hover span {
    color: var(--pink);
}

.p-nav ul li a:hover span path {
    fill: var(--pink);
}

.p-nav ul li a:hover span::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background-color: var(--pink);
    position: absolute;
    bottom: -10px;
    left: 0;
}

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

    .p-nav {
        padding-left: 6.5vw;
        padding-right: 6.5vw;
        padding-top: 10.5vw;
        padding-bottom: 19vw;
        background-image: url(../images/p-nav_sp.png);
        background-size: 100%;
    }

    .p-nav ul {
        justify-content: space-between;
    }

    .p-nav ul li a {
        font-size: 1.6rem;
        padding-left: 0;
        padding-right: 0;
    }

    .p-nav ul li a:hover span {
        color: #fff;
    }
    
    .p-nav ul li a:hover span path {
        fill: #fff;
    }

    .p-nav ul li a:hover span::after {
        display: none;
    }

    .p-nav ul li a svg {
        margin-bottom: 5px;
    }

    .p-nav ul li:nth-child(1) a::after, .p-nav ul li:nth-child(2) a::after {
        width: 2px;
        height: 45px;
        top: 0;
        right: calc(-5.8vw + 2px);
    }

    .p-nav ul li:nth-child(1) a svg {
        width: 14.4vw;
    }
    .p-nav ul li:nth-child(2) a svg {
        width: 19.7vw;
    }
    .p-nav ul li:nth-child(3) a svg {
        width: 24.5vw;
    }

}

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

    .about {
        padding-top: 22.5vw;
    }

    .about .wrap h2 img {
        width: 34vw;
    }

}

/* タイトル共通 */

.t-section .title {
    padding-left: 13.5vw;
    padding-right: 13.5vw;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.t-section .title h2 {
    font-size: 2.8rem;
    font-weight: var(--fw-700);
    letter-spacing: var(--lsp-50);
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
}

.t-section .title h2 svg {
    height: 59px;
    object-fit: cover;
    margin-bottom: 15px;
}

.t-section .title h2 path {
    fill: var(--blue);

}

.t-section .title p {
    font-size: 2.8rem;
    line-height: var(--lh-20);
    letter-spacing: var(--lsp-50);
}

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

    .t-section .title {
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }

    .t-section .title h2 {
        font-size: 1.6rem;
        margin-bottom: 25px;
    }

    .t-section .title p {
        font-size: 1.6rem;
        letter-spacing: var(--lsp-50);
    }

}

/* access */

.access {
    padding-top: 77px;
    position: relative;
    /* overflow: hidden; */
    background-image: url(../images/pointbg-1.png);
    background-repeat: no-repeat;
    background-size: 9.6vw;
    background-position: right 4.5vw bottom 13vw;
}

.access::before,
.access::after {
    content: "";
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: -1;
}

.access::before {
    background-image: url(../images/point-bg_pc2.png);
    width: 15.8vw;
    height: 19vw;
    top: 6vw;
    right: 0;
}

.access::after {
    background-image: url(../images/access-bg_item2.png);
    width: 12.5vw;
    height: 13vw;
    top: 16vw;
    left: 2vw;
}

.access .title {
    margin-bottom: 80px;
    position: relative;
}

.access .title::after {
    content: "";
    display: block;
    background-image: url(../images/access-item1_pc.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 17.5vw;
    height: 15.7vw;
    min-width: 200px;
    position: absolute;
    right: 13.5vw;
    top: 0;
    z-index: -1;
}

.access .title h2 svg {
    width: 13.5vw;
    max-width: 262px;
}

.ac-wrap1 {
    background-color: #fff;
    position: relative;
    width: 80vw;
    margin-left: auto;
    border-radius: 135px 0 0 0;
    border-top: 2px solid var(--blue);
    border-left: 2px solid var(--blue);
    border-bottom: 2px solid var(--blue);
    padding-right: 13.5vw;
    padding-top: 60px;
    padding-bottom: 60px;
    padding-left: 5vw;
    margin-bottom: 120px;
}

.ac-wrap1 div {
    width: 100%;
}

.ac-wrap1::before {
    content: "";
    display: block;
    width: 21vw;
    height: 14.5vw;
    background-image: url(../images/access1-img.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: -5vw;
    bottom: -3vw;
}

.ac-wrap1::after {
    content: "";
    display: block;
    width: 101%;
    height: 100%;
    background-image: url(../images/access1-bg_pc.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 20px;
    right: 0;
    z-index: -1;
}

.ac-wrap2 {
    background-color: #fff;
    position: relative;
    width: 80vw;
    height: 37vw;
    margin-right: auto;
    border-radius: 0 95px 95px 0;
    border-top: 2px solid var(--blue);
    border-right: 2px solid var(--blue);
    border-bottom: 2px solid var(--blue);
    padding-left: 13.5vw;
    padding-top: 85px;
    padding-right: 5vw;
    margin-bottom: 120px;
    background-image: url(../images/tw-access2_pc.jpg);
    background-repeat: no-repeat;
    background-position: top left -2vw;
    background-size: contain;
}

.ac-wrap2 div {
    width: 25vw;
    margin-left: auto;
}

.ac-wrap2 div h3 {
    font-size: 3.5rem;
    font-weight: var(--fw-700);
    line-height: var(--lh-14);
    margin-bottom: 20px;
    letter-spacing: var(--lsp-50);
}

.ac-wrap2 div p {
    font-size: 2.8rem;
    line-height: var(--lh-22);
}

/* 円装飾 */
.ac-wrap2::before {
    content: "";
    display: block;
    width: 12.5vw;
    height: 13vw;
    background-image: url(../images/access-bg_item2.png);
    background-size: contain;
    background-repeat: no-repeat;
    transform: rotateZ(180deg);
    position: absolute;
    right: -18vw;
    top: 11vw;
    z-index: -1;
}

.ac-wrap2::after {
    content: "";
    display: block;
    width: 102%;
    height: 102%;
    background-image: url(../images/access2-bg_pc.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 0 95px 95px 0;
    position: absolute;
    top: 0;
    right: -1.2vw;
    z-index: -1;
}

/* ac-wrap3 */

.ac-wrap3 {
    background-color: #fff;
    position: relative;
    width: 80vw;
    height: 31vw;
    /* height: 26vw; */
    margin-left: auto;
    border-radius: 95px 0 0 95px;
    border-top: 2px solid var(--blue);
    border-left: 2px solid var(--blue);
    border-bottom: 2px solid var(--blue);
    padding-right: 15.5vw;
    padding-top: 85px;
    padding-bottom: 60px;
    padding-left: 8vw;
    margin-bottom: 120px;
}

.ac-wrap3 > div {
    width: 100%;
}

.ac-wrap3::before {
    content: "";
    display: block;
    width: 26.8vw;
    height: 18vw;
    background-image: url(../images/access-item2_pc.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: 5vw;
    bottom: -9vw;
    z-index: 20;
}

.ac-wrap3::after {
    content: "";
    display: block;
    width: 101%;
    height: 100%;
    background-image: url(../images/access1-bg_pc.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 15px;
    right: 0;
    z-index: -1;
    border-radius: 95px 0 0 95px;
}

.ac-wrap3 h3 {
    font-size: 3.5rem;
    font-weight: var(--fw-700);
    line-height: var(--lh-14);
    margin-bottom: 20px;
    letter-spacing: var(--lsp-50);
}

.ac-wrap3 h3 .pcm-view {
    display: none;
}

.ac-wrap3 .txt-wrap p {
    font-size: 2.8rem;
    line-height: var(--lh-22);
}

.ac-wrap3 .txt-wrap p.caution {
    font-size: 2.4rem;
    text-indent: -1em;
    padding-left: 1em;
}

@media screen and (max-width:1800px) {
    .ac-wrap2 {
        background-position: top left -3vw;
    }

    .ac-wrap2 div {
        width: 27vw;
    }
}

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

    .access .title::after {
        right: 10.5vw;
    }

    .ac-wrap1 {
        padding-right: 10.5vw;
    }

    .ac-wrap2 {
        padding-right: 3vw;
        background-position: top left -5vw;
    }

    .ac-wrap2 div {
        width: 28vw;
    }

}

@media screen and (max-width:1300px) {
    .ac-wrap2 {
        padding-right: 5vw;
        background-position: top left -15vw;
        height: 44vw;
        padding-top: 65px;
    }

    .ac-wrap2::before {
        bottom: -6vw;
    }

    .access .title::after {
        right: 4.5vw;
    }

    .pcm-view {
        display: none;
    }

    .ac-wrap2 div h3 {
        font-size: 3.3rem;
    }

    /* ac-wrap3 */
    .ac-wrap3 {
        height: 36vw;
    }

    .ac-wrap3 h3 .pcm-view {
        display: block;
    }

    .ac-wrap3 .txt-wrap .pc-view {
        display: none;
    }

}

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

    .ac-wrap1 {
        width: 85vw;
    }

    .ac-wrap2 {
        background-position: top left -18vw;
        height: 47vw;
        padding-top: 50px;
        width: 85vw;
    }

    .ac-wrap2::before {
        right: -9vw;
    }

    .ac-wrap3 {
        height: fit-content;
    }

}

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

    .access {
        overflow: visible;
        padding-top: 16vw;
        pointer-events: none;
    }

    .access::before {
        background-image: url(../images/access-bg_item1_sp.png);
        width: 42.5vw;
        height: 53vw;
        top: 9vw;
        right: 0;
    }

    .access::after {
        display: none;
    }

    .access .title::after {
        width: 45vw;
        height: 40vw;
        min-width: 169px;
        max-width: 230px;
        top: -15vw;
        right: 2.5vw;
        z-index: 0;
    }

    .access .title {
        margin-bottom: 40px;
    }

    .access .title h2 svg {
        width: 41vw;
        margin-bottom: 10px;
    }

    .ac-wrap1 {
        width: 96vw;
        border-radius: 30px 0 0 0;
        padding-top: 35px;
        padding-bottom: 80px;
        padding-left: 5.5vw;
        padding-right: 5.5vw;
        margin-bottom: 38vw;
    }

    .ac-wrap1::before {
        background-image: url(../images/access1-img_sp.png);
        width: 57vw;
        height: 39vw;
        left: -5vw;
        bottom: -32vw;
    }

    .ac-wrap1::after {
        background-image: url(../images/access1-bg_sp.png);
        width: 100%;
        height: 200px;
        top: auto;
        right: 0;
        bottom: -20px;
    }

    .ac-wrap2 {
        width: 96vw;
        padding-top: 40px;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
        padding-bottom: 154vw;
        border-radius: 0 30px 30px 0;
        background-image: url(../images/tw-access2_sp.jpg);
        background-position: top 13vw left;
        background-size: 89vw 137vw;
        margin-bottom: 19vw;
    }

    .ac-wrap2::after {
        background-image: url(../images/access2-bg_sp.png);
        width: 100%;
        height: 200px;
        top: auto;
        right: 0;
        bottom: -20px;
    }

    .ac-wrap2 div {
        width: auto;
    }

    .ac-wrap2 div h3 {
        font-size: 2.8rem;
        margin-bottom: 15px;
    }

    .ac-wrap2 div p {
        font-size: 1.6rem;
        letter-spacing: var(--lsp-50);
    }

    .ac-wrap2::before {
        display: none;
    }

    .ac-wrap2::after {
        top: auto;
        bottom: -4vw;
        right: 0;
        border-radius: 0 0 30px 0;
    }

    .ac-wrap3 {
        width: 96vw;
        padding-top: 40px;
        padding-left: 6.5vw;
        padding-right: 5.5vw;
        border-radius: 45px 0 0 45px;
    }

    /* 人物装飾 */
    .ac-wrap3::before {
        width: 45vw;
        height: 35vw;
        bottom: -29vw;
    }

    .ac-wrap3::after {
        background-image: url(../images/access1-bg_sp.png);
        width: 100%;
        height: 200px;
        top: auto;
        right: 0;
        bottom: -20px;
        border-radius: 45px 0 0 45px;
    }

    .ac-wrap3 div h3 {
        font-size: 2.8rem;
        margin-bottom: 15px;
        line-height: var(--lh-18);
    }

    .ac-wrap3 div .txt-wrap p {
        font-size: 1.6rem;
        letter-spacing: var(--lsp-50);
    }

    .ac-wrap3 div .txt-wrap p.caution {
        font-size: 1.4rem;
    }

}

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

    .ac-wrap3 div h3 .pcm-view {
        display: none;
    }

} 

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

    .access {
        padding-top: 30vw;
        margin-top: -25vw;
    }

    .access .title h2 svg {
        margin-bottom: -5px;
    }

    .access::before {
        top: 41vw;
    }

    .access .title::after {
        top: -20vw;
        right: 6.5vw;
    }

    .ac-wrap1::before {
        bottom: -26vw;
    }

    .ac-wrap1::after {
        height: 118px;
        bottom: -15px;
    }

    .ac-wrap2 div h3 {
        font-size: 2rem;
    }

    .ac-wrap2::before {
        right: 0;
    }

    .ac-wrap2::after {
        height: 118px;
        bottom: -15px;
    }

    .access::after {
        right: 6.8vw;
    }

     /* ac-wrap3 */

     .ac-wrap3::before {
        bottom: -20vw;
        right: 11vw;
    }

    .ac-wrap3::after {
        height: 118px;
        bottom: -15px;
    }

    .ac-wrap3 div h3 {
        font-size: 2rem;
    }

    .ac-wrap3 div p {
        font-size: 1.6rem;
    }

    .ac-wrap3 div p.caution {
        font-size: 1.4rem;
    }

}

/* コンテンツ幅共通 */

.c-section {
    padding-left: 13.5vw;
    padding-right: 13.5vw;
}

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

    .c-section {
        padding-left: 10vw;
        padding-right: 10vw;
    }
}

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

    .c-section {
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }
}

.access-sub {
    position: relative;
    z-index: 10;
    padding-top: 120px;
    padding-bottom: 130px;
    background-color: var(--l2-blue);
    background-image: 
    url(../images/point-bg_pc2.png),
    url(../images/point-bg_pc3.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc4.png),
    url(../images/pointbg-1.png);
    
    background-repeat: 
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

    background-size: 
    16vw 19vw,
    12.5vw 13vw,
    9.6vw,
    14vw 12.5vw,
    9.6vw;

    background-position:
    top 6vw right,
    top 17vw left 2.6vw,
    right 36.5vw bottom 30vw,
    right 9vw bottom 20vw,
    left 25vw bottom 10vw;
}

.access-sub::before {
    content: "";
    display: block;
    width: 9.6vw;
    height: 9.6vw;
    background-image: url(../images/pointbg-1.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 33vw;
    top: -1.5vw;
}

.access-sub::after {
    content: "";
    display: block;
    width: 100%;
    height: 10.4vw;
    background-image: url(../images/access-sub-bg_line.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    bottom: -2.5vw;
    z-index: -1;
}

.access-sub .wrap .inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 90px;
}

.access-sub .wrap .inner:nth-child(even) {
    flex-direction: row-reverse;
}

.access-sub .wrap .inner:last-child {
    margin-bottom: 0;
}

.access-sub .wrap .inner .ttl {
    width: 47%;
    padding-top: 30px;
}

.access-sub .wrap .inner .ttl img {
    margin-bottom: 20px;
}

.access-sub .wrap .inner:nth-child(1) .ttl img {
    width: 4.1vw;
    max-width: 80px;
}
.access-sub .wrap .inner:nth-child(2) .ttl img {
    width: 5.2vw;
    max-width: 100px;
}
.access-sub .wrap .inner:nth-child(3) .ttl img {
    width: 5.4vw;
    max-width: 104px;
}

.access-sub .wrap .inner .ttl p {
    font-size: 3.1rem;
    line-height: var(--lh-18);
    letter-spacing: var(--lsp-50);
}

.access-sub .wrap .inner .inner-img {
    width: 47%;
}

@media screen and (max-width:1400px) {
    .access-sub .wrap .inner .ttl p {
        font-size: 2.8rem;
    }
}

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

    .access-sub {
        background-image: none;
        background-color: var(--l2-blue);
        position: relative;
        z-index: 0;
        padding-bottom: 19vw;
        padding-top: 10.5vw;
    }

    .access-sub.c-section {
        padding-left: 0;
        padding-right: 0;
    }

    .access-sub .wrap {
        position: relative;
        z-index: 5;
    }

    .access-sub .wrap .inner {
        flex-direction: column;
        margin-bottom: 40px;
        position: relative;
        z-index: 10;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }

    .access-sub .wrap .inner:nth-child(even) {
        flex-direction: column;
    }

    .access-sub .wrap .inner .ttl {
        width: 100%;
        margin-bottom: 30px;
    }

    .access-sub .wrap .inner .ttl img {
        width: 62px;
        margin-bottom: 20px;
    }

    .access-sub .wrap .inner:nth-child(1) .ttl img {
        width: 12vw;
        min-width: 45px;
    }
    .access-sub .wrap .inner:nth-child(2) .ttl img {
        width: 14.6vw;
        min-width: 55px;
    }
    .access-sub .wrap .inner:nth-child(3) .ttl img {
        width: 15.2vw;
        min-width: 57px;
    }

    .access-sub .wrap .inner .ttl p {
        font-size: 1.6rem;
    }

    .access-sub .wrap .inner .inner-img {
        width: 100%;
    }

    .access-sub .wrap .inner .inner-img img {
        width: 100%;
    }

    .access-sub::before {
        content: "";
        display: block;
        width: 22.5vw;
        height: 22.5vw;
        background-image: url(../images/point-bg_item1_sp.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: -11vw;
        left: 19vw;
    }

    .access-sub::after {
        content: "";
        display: block;
        width: 100%;
        height: 13.5vw;
        background-image: url(../images/point-bg_sp.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        bottom: -25px;
        left: 0;
    }

    .access-sub .wrap .inner:nth-child(1)::before {
        content: "";
        display: block;
        background-image: url(../images/access-bg_item1_sp.png);
        width: 42.5vw;
        height: 53vw;
        background-size: contain;
        position: absolute;
        bottom: -30vw;
        right: 0;
        z-index: -1;
    }


    .access-sub .wrap .inner:nth-child(2)::before {
        content: "";
        display: block;
        background-image: url(../images/point-bg_item1_sp.png);
        width: 22.6vw;
        height: 22.6vw;
        background-size: contain;
        position: absolute;
        bottom: -19vw;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
    }

    .access-sub .wrap .inner:nth-child(3)::before {
        content: "";
        display: block;
        background-image: url(../images/point-item3_sp.png);
        width: 29vw;
        height: 30vw;
        background-size: contain;
        position: absolute;
        bottom: -27vw;
        right: 6.5vw;
        z-index: -1;
    }
}

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

    .access-sub .wrap .inner .ttl p {
        letter-spacing: var(--lsp-10);
    }

}

/* 表組み */

.tables {
    padding-top: 11vw;

    background-image:
    url(../images/pointbg-1.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc2.png),
    url(../images/point-bg_pc5.png),
    url(../images/point-bg_pc6.png),
    url(../images/pointbg-1.png),
    url(../images/pointbg-1.png);
    
    background-repeat: 
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

    background-size: 
    9.6vw,
    9.6vw,
    16vw 19vw,
    12.5vw 13vw,
    6.7vw,
    9.6vw,
    9.6vw;

    background-position:
    top 7vw right 7.5vw,
    top 25vw left 7vw,
    top 39vw right,
    top 49vw left 2.5vw,
    bottom 63vw right 8.6vw,
    bottom 35vw right 7.3vw,
    bottom 10vw left 7vw;
}

.tables .c-section {
    position: relative;
    z-index: 10;
}

.tables .tables-section {
    border: 2px solid var(--blue);
    border-radius: 0 130px 130px 130px;
    position: relative;
    background-color: #fff;
}

.tables .tables-section .tables-bg {
    width: 100%;
    border-radius: 0 127px 0 0;
    overflow: hidden;
    height: 16.5vw;
}

.tables .tables-section .tables-ttl {
    position: absolute;
    left: -2px;
}

.tables .tables-section .tables-cont {
    padding: 35px 4.5vw 80px;
}

.tables .tables-section .tables-cont p {
    font-size: 3.2rem;
    margin-bottom: 45px;
    letter-spacing: var(--lsp-50);
}

.tables .tables-section .tables-cont .c-table {
    margin-bottom: 65px;
}

.tables .tables-section .tables-cont .c-table table {
    width: 100%;
}

.tables .tables-section .tables-cont .c-table td,
.tables .tables-section .tables-cont .c-table th {
    text-align: center;
    letter-spacing: var(--lsp-40);
}

.tables .tables-section .tables-cont .c-table .t-ttl {
    color: #fff;
    background-color: var(--blue);
    font-size: 2.6rem;
    font-weight: var(--fw-700);
}

.tables .tables-section .tables-cont .c-table .t-ttl td,
.tables .tables-section .tables-cont .c-table .t-ttl th {
    padding: 18px;
    text-align: center;
}

.tables .tables-section .tables-cont .c-table .t-ttl td {
    border-left: 2px solid var(--blue);
}

.tables .tables-section .tables-cont .c-table .t-ttl th {
    border-left: 2px solid #fff;
}

.tables .tables-section .tables-cont .c-table .t-ttl th:last-child {
    border-right: 2px solid var(--blue);
}

.tables .tables-section .tables-cont .c-table .day {
    width: 20%;
}

.tables .tables-section .tables-cont .c-table .t-desc {
    font-size: 2.8rem;
    font-weight: bold;
}

.tables .tables-section .tables-cont .c-table .t-desc th,
.tables .tables-section .tables-cont .c-table .t-desc td {
    padding: 36px 10px;
    border: 2px solid var(--blue);
    border-collapse: collapse;
}

.tables .tables-section .tables-cont .c-table .t-desc .day {
    background-color: var(--m-blue);
}

.tables .tables-section .tables-cont .c-table .t-desc td {
    background-color: var(--l-blue);
    vertical-align: middle;
}

/* 別府 */

.tables .t-beppu {
    margin-bottom: 140px;
}

.tables .t-beppu::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-image: url(../images/table-secti-bg_pc.png);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 0 130px 130px 130px;
    position: absolute;
    top: 1vw;
    right: -1vw;
    z-index: -1;
}

.tables .t-beppu .tables-ttl {
    width: 38.5vw;
    top: -2.5vw
}

/* 志布志 */

.tables .t-shibushi::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-image: url(../images/table-sect2-bg_pc.png);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 0 130px 130px 130px;
    position: absolute;
    top: 1vw;
    right: -1vw;
    z-index: -1;
}

.tables .t-shibushi .tables-ttl {
    width: 38.8vw;
    top: -2.5vw;
}

.tables .tables-more {
    margin-top: 140px;
    padding: 80px 80px 70px;
    background-image: url(../images/table-cta-bg_pc.png);
    background-repeat: no-repeat;
    position: relative;
}

.tables .tables-more .pcm-view {
    display: block;
}

.tables .tables-more::before {
    content: "";
    display: block;
    width: 14vw;
    height: 18vw;
    background-image: url(../images/table-item_pc.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -11.5vw;
    right: 12vw;
    z-index: 10;
}

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

    .tables {
        padding-top: 21.5vw;
        background-image: none;
    }

    .tables .c-section {
        padding-left: 0;
        padding-right: 0;
    }

    .tables .c-section::after {
        content: "";
        display: block;
        width: 22.5vw;
        height: 22.5vw;
        background-image: url(../images/point-bg_item1_sp.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        right: 11vw;
        bottom: -19vw;
        z-index: -2;
    }

    .tables .tables-section {
        border: 2px solid var(--blue);
        border-radius: 30px;
    }
    
    .tables .tables-section .tables-bg {
        border-radius: 28px 28px 0 0;
        height: 48vw;
    }

    .tables .tables-section .tables-bg img {
        width: 100%;
    }

    .tables .tables-section .tables-cont {
        padding: 35px 6.5vw 50px;
    }

    .tables .tables-section .tables-cont p {
        font-size: 1.6rem;
        margin-bottom: 30px;
    }

    .tables .tables-section .tables-cont .c-table {
        margin-bottom: 30px;
    }

    .tables .tables-section .tables-cont .c-table .t-ttl td,
    .tables .tables-section .tables-cont .c-table .t-ttl th {
        font-size: 1.4rem;
        padding: 7px;
    }

    .tables .tables-section .tables-cont .c-table .t-desc {
        font-size: 1.4rem;
    }

    .tables .tables-section .tables-cont .c-table .t-desc th {
        background-color: var(--m-blue);
        width: 27.5%;
    }

    .tables .tables-section .tables-cont .c-table .t-desc td {
        font-size: 1.4rem;
        width: 32%;
    }

    .tables .tables-section .tables-cont .c-table .t-desc th,
    .tables .tables-section .tables-cont .c-table .t-desc td {
        padding: 17px 10px;
    }

    .tables .tables-section .tables-cont .c-table table:nth-child(1) {
        margin-bottom: 20px;
    }

    .tables .tables-section .tables-cont .c-table .t-ttl th:last-child {
        border-left: 2px solid var(--blue);
    }

    .tables .tables-more {
        padding: 18.5vw 6.5vw 16vw;
        background-image: url(../images/table-cta-bg_sp.png);
        background-size: 100%;
        margin-top: 24.5vw;
    }

    .tables .tables-more::before {

        width: 37.5vw;
        height: 46vw;
        max-width: 220px;
        right: auto;
        left: 6.5vw;
        top: -25.5vw;
    }

    /* 別府 */

    .tables .t-beppu {
        margin-bottom: 24vw;
    }

    .tables .t-beppu .tables-ttl {
        width: 88vw;
        left: 50%;
        transform: translateX(-50%);
        top: -7.5vw;
    }

    .tables .t-beppu::after {
        background-image: url(../images/table-bg_sp.png);
        height: 167px;
        border-radius: 0 0 30px 30px;
        top: auto;
        right: 0;
        bottom: -3vw;
    }

    /* 志布志 */
    .tables .t-shibushi .tables-ttl {
        width: 88vw;
        left: 50%;
        transform: translateX(-50%);
        top: -7.5vw;
    }

    .tables .t-shibushi::after {
        background-image: url(../images/table-bg_sp.png);
        height: 167px;
        border-radius: 0 0 30px 30px;
        top: auto;
        right: 0;
        bottom: -3vw;
    }

}

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

    .tables .t-beppu::after {
        height: 118px;
        bottom: -15px;
    }

    .tables .t-shibushi::after {
        height: 118px;
        bottom: -15px;
    }

    .tables .tables-more::before {
        top: -34.5vw;
    }

}


/* landmark */

.landmark {
    padding-top: 8.3vw;
    padding-bottom: 125px;
    background-image:
    url(../images/point-bg_pc7.png),
    url(../images/point-bg_pc5.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc6.png),
    url(../images/pointbg-1.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc2.png),
    url(../images/point-bg_pc5.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc6.png);
    
    background-repeat: 
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

    background-size: 
    15.5vw 12.5vw,
    12.5vw 13vw,
    9.6vw,
    6.7vw,
    9.6vw,
    9.6vw,
    16vw 19vw,
    12.5vw 13vw,
    9.6vw,
    6.7vw;

    background-position:
    top right,
    top 3.6vw left 3vw,
    top 33vw right 40vw,
    top 46vw right 8.5vw,
    top 70vw right 7vw,
    top 87vw left 7vw,
    top 100vw right,
    top 114vw left 2.5vw,
    bottom 24vw right 35vw,
    bottom 15vw right 10vw;
}

.landmark .title {
    margin-bottom: 100px;
}

.landmark .title::before {
    content: "";
    display: block;
    width: 25.5vw;
    height: 24vw;
    background-image: url(../images/landmark-item_pc.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -3vw;
    right: 16vw;
}

.landmark .title h2 svg {
    width: 18.4vw;
    max-width: 365px;
}

.landmark .wrap .inner {
    margin-bottom: 70px;
    border-bottom: 4px dotted var(--blue);
    padding-bottom: 70px;
}

.landmark .wrap .inner:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.landmark .wrap .inner h3 {
    font-size: 5rem;
    font-weight: bold;
    letter-spacing: var(--lsp-20);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-feature-settings: "palt";
}

.landmark .wrap .inner h3 .lsp {
    letter-spacing: -2rem;
}

.landmark .wrap .inner h3 svg {
    margin-right: 25px;
}

.landmark .wrap .inner p {
    font-size: 2.6rem;
    line-height: var(--lh-20);
    margin-bottom: 60px;
    letter-spacing: var(--lsp-50);
}

.landmark .wrap .inner ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
}

.landmark .wrap .inner ul li {
    width: 29%;
}

/* ↓2412追加 */
.landmark .wrap .inner .red-btn {
    margin-bottom: 60px;
}

.landmark .wrap .inner .inner-cta a:hover {
    transition: 0.3s;
    opacity: 0.7;
}

.landmark .wrap .inner .inner-cta a {
    width: 30vw;
    max-width: 580px;
    min-width: 350px;
    margin-left: auto;
    margin-right: auto;
    transition: 0.3s;
}

/* ↑2412追加 */

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

    .landmark {
        padding-top: 16vw;
        background-image: none;
        position: relative;
        padding-bottom: 28vw;
    }

    .landmark .c-section {
        padding-left: 0;
        padding-right: 0;
    }

    .landmark .title {
        margin-bottom: 50px;
    }

    .landmark .title h2 svg {
        width: 56vw;
        margin-bottom: 10px;
    }

    .landmark .title::before {
        width: 32vw;
        height: 36.5vw;
        max-width: 200px;
        background-image: url(../images/landmark-item_sp.png);
        top: -16vw;
        right: 0;
    }

    .landmark .title::after {
        content: "";
        display: block;
        width: 32vw;
        height: 30vw;
        background-image: url(../images/access-bg_item2.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 20vw;
        right: 0;
        z-index: -2;
    }

    .landmark .wrap .inner h3 {
        font-size: 2rem;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }

    .landmark .wrap .inner h3 svg {
        width: 7vw;
        min-width: 45px;
        margin-right: 10px;
    }

    .landmark .wrap .inner h3 .lsp {
        letter-spacing: -0.8rem;
    }

    .landmark .wrap .inner p {
        font-size: 1.6rem;
        margin-bottom: 35px;
        padding-left: 6.5vw;
        padding-right: 6.5vw;
    }

    .landmark .wrap .inner ul {
        display: block;
    }

    .landmark .wrap .inner ul li {
        width: 70%;
    }

    .landmark .wrap .inner ul li img {
        width: 100%;
    }
    
    /* slick調整 */

    .slick-slide {
        margin-left: 4vw;
        margin-right: 4vw;
    }

    .slick-prev {
        left: 4vw;
    }

    .slick-next {
        right: 4vw;
    }

    .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
        background-color: var(--blue);
    }

    .slick-prev,
    .slick-next {
        background-color: var(--blue);
        border-radius: 50%;
        width: 50px;
        height: 50px;
        z-index: 100;
        opacity: 1;
    }

    .slick-prev:before,
    .slick-next:before {
        content: "";
        display: block;
        width: 14px;
        height: 22px;
        background-image: url(../images/slick-arrow.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%)translateY(-50%);
        opacity: 1;
    }

    .slick-next:before {
        transform: translateX(-50%)translateY(-50%)rotateY(180deg);
    }

    .landmark .wrap .inner {
        margin-bottom: 40px;
        padding-bottom: 44px;
        border-bottom: none;
        position: relative;
    }

    .landmark .wrap .inner::after {
        content: "";
        display: block;
        width: 86.5vw;
        height: 8px;
        border-bottom: 8px dotted var(--blue);
        position: absolute;
        left: 6.5vw;
        bottom: 0;
    }

    .landmark .wrap .inner:last-child {
        padding-bottom: 0;
    }

    .landmark .wrap .inner:last-child::after {
        display: none;
    }
    
    .landmark::after {
        content: "";
        display: block;
        width: 16.5vw;
        height: 22.5vw;
        background-image: url(../images/landmark-bt_item.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        left: 0;
        bottom: 9.3vw;
        z-index: -2;
    }

    .landmark .wrap .inner .inner-cta a:hover {
        opacity: 1;
    }

}

@media screen and (max-width:500px) {
    
    .landmark {
        padding-top: 24vw;
        margin-top: -12vw;
    }

    .landmark .title h2 svg {
        margin-bottom: -5px;
    }

    .landmark .title::before {
        top: -21vw;
    }

    .landmark .wrap .inner {
        margin-bottom: 30px;
    }

    .landmark .wrap .inner ul {
        margin-bottom: 30px;
    }

    .landmark .wrap .inner h3 {
        margin-bottom: 12px;
    }

    .landmark::after {
        bottom: 19.3vw;
    }

    .landmark .title::after {
        right: 4vw;
        top: 51vw;
    }

    .landmark .wrap .inner::after {
        border-bottom: none!important;
        height: 8px;
        background: radial-gradient(circle farthest-side, var(--blue), var(--blue) 37%, transparent 40%, transparent);
        background-size: 18px 8px;
        background-repeat: repeat-x;
        content: "";
        display: inline-block;
    }

    .landmark .wrap .inner .red-btn {
        margin-bottom: 30px;
    }

    .landmark .wrap .inner .inner-cta a {
        width: 74vw;
        max-width: 280px;
        min-width: 250px;
    }


}

/* information */

.information {
    position: relative;
    z-index: 10;
    padding-top: 8.3vw;
    padding-bottom: 5vw;
    background-color: var(--l-pink);
    background-image: 
    url(../images/pointbg-1.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc6.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc2.png),
    url(../images/point-bg_pc3.png),
    url(../images/point-bg_pc6.png),
    url(../images/pointbg-1.png),
    url(../images/point-bg_pc2.png),
    url(../images/point-bg_pc3.png),
    url(../images/point-bg_pc6.png);
    
    background-repeat: 
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

    background-size: 
    9.6vw,
    9.6vw,
    6.7vw,
    9.6vw,
    16vw 19vw,
    12.5vw 13vw,
    6.7vw,
    9.6vw,
    16vw 19vw,
    12.5vw 13vw,
    6.7vw;

    background-position:
    top 16.5vw right 7vw,
    top 22.5vw right 34.5vw,
    top 32vw right 8.5vw,
    top 60vw right 7vw,
    top 80vw right,
    top 100vw left 2.6vw,
    top 141vw right 8.5vw,
    top 188vw left 7vw,
    top 195vw right,
    top 212vw left 2.6vw,
    bottom 50vw right 8.5vw;
}

.information::before {
    content: "";
    display: block;
    width: 100%;
    height: 10.4vw;
    background-image: url(../images/info-bg_top.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
}

.information::after {
    content: "";
    display: block;
    width: 100%;
    height: 10.4vw;
    transform: rotateZ(180deg);
    background-image: url(../images/info-bg_top.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
}

.information .title {
    margin-bottom: 100px;
    position: relative;
    z-index: 10;
}

.information .title::before {
    content: "";
    display: block;
    width: 20vw;
    height: 14.5vw;
    background-image: url(../images/information-item.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -2vw;
    right: 15vw;
}

.information .title::after {
    content: "";
    display: block;
    width: 9.6vw;
    height: 9.6vw;
    background-image: url(../images/pointbg-1.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -10vw;
    left: 28vw;
    z-index: -1;
}

.information .title h2 svg {
    width: 23vw;
    max-width: 442px;
}

.information .c-section {
    position: relative;
    z-index: 10;
}

.information .c-section .wrap {
    background-color: #fff;
    border: 2px solid var(--blue);
    border-radius: 0 130px 130px 130px;
    position: relative;
    padding: 155px 5vw 100px;
}

.information .c-section .wrap::before {
    content: "";
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
}

.information .c-section .wrap::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 0 130px 130px 130px;
    position: absolute;
    z-index: -1;
    top: 1vw;
    right: -1vw;
}

.information .c-section .wrap .inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 80px;
}

.information .c-section .wrap .inner:last-child {
    margin-bottom: 0;
}

.information .c-section .wrap .inner picture {
    width: 48%;
}

.information .c-section .wrap .inner .cont {
    width: 46%;
}

.information .c-section .wrap .inner .cont img {
    margin-bottom: 20px;
}

.information .c-section .wrap .inner:nth-child(1) .cont img {
    width: 4.1vw;
    max-width: 80px;
}

.information .c-section .wrap .inner:nth-child(2) .cont img {
    width: 5.2vw;
    max-width: 100px;
}

.information .c-section .wrap .inner:nth-child(3) .cont img {
    width: 5.4vw;
    max-width: 104px;
}

.information .c-section .wrap .inner:nth-child(4) .cont img {
    width: 5.4vw;
    max-width: 104px;
}

.information .c-section .wrap .inner .cont h4 {
    font-size: 3.4rem;
    font-weight: var(--fw-700);
    margin-bottom: 15px;
    letter-spacing: var(--lsp-50);
}

.information .c-section .wrap .inner .cont p {
    font-size: 2.6rem;
    line-height: var(--lh-20);
    margin-bottom: 45px;
}

.information .l-btn {
    position: absolute;
    bottom: -3vw;
    left: 50%;
    transform: translateX(-50%);
    transition: 0.3s;
}

.information .l-btn:hover {
    transition: 0.3s;
    bottom: calc(-3vw + 5px);
    opacity: 0.7;
}

.information .l-btn a {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* 別府 */

.information .c-section {
    margin-bottom: 100px;
}

.information .info-beppu {
    margin-bottom: 140px;
    position: relative;
}

.information .info-beppu::before {
    width: 27.5vw;
    height: 11vw;
    background-image: url(../images/info-beppu_item.png);
    top: -5vw;
    right: 3vw;
}

.information .info-beppu::after {
    background-image: url(../images/info-beppu-bg_pc.png);
}

.information .info-beppu .wrap-ttl {
    position: absolute;
    width: 38.5vw;
    top: -2.5vw;
    left: -2px;
}

.information .info-beppu .wrap-movie {
    margin-top: 85px;
    text-align: center;
}

.information .info-beppu .wrap-movie h4 {
    font-size: 4rem;
    font-weight: var(--fw-700);
    margin-bottom: 45px;
    letter-spacing: var(--lsp-50);
}

.information .info-beppu .wrap-movie iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

/* 志布志 */

.information .info-shibushi .wrap-ttl {
    position: absolute;
    width: 38.8vw;
    top: -2.5vw;
    left: -2px;
}

.information .info-shibushi::before {
    width: 24.5vw;
    height: 11vw;
    background-image: url(../images/info-shibushi_item.png);
    top: -1.5vw;
    right: 3vw;
}

.information .info-shibushi::after {
    background-image: url(../images/info-shibushi-bg_pc.png);
}

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

    .information .title::before {
        right: 8vw;
    }

}

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

    .information {
        background-image: none;
        background-color: var(--l-pink);
        padding-top: 16vw;
        position: relative;
        z-index: 10;
    }

    .information .title {
        margin-bottom: 16vw;
        z-index: 10;
    }

    .information .title::before {
        width: 31.5vw;
        height: 22.5vw;   
        top: -26.5vw;
        right: 6.5vw;
    }

    .information .title h2 svg {
        width: 69vw;
        margin-bottom: 15px;
    }

    .information .c-section {
        padding-left: 0;
        padding-right: 0;
    }

    .information .c-section .wrap {
        border-radius: 30px;
        padding: 61vw 6.5vw 50px;
    }

    .information .c-section .wrap .inner {
        flex-direction: column-reverse;
        position: relative;
        padding-bottom: 15vw;
    }

    .information .c-section .wrap .inner .cont {
        width: 100%;
    }

    .information .c-section .wrap .inner .cont .cont-wrap {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .information .c-section .wrap .inner .cont .cont-wrap img {
        margin-right: 15px;
    }

    .information .c-section .wrap .inner:nth-child(1) .cont .cont-wrap img {
        width: 12vw;
        min-width: 45px;
    }
    .information .c-section .wrap .inner:nth-child(2) .cont .cont-wrap img {
        width: 14.6vw;
        min-width: 55px;
    }
    .information .c-section .wrap .inner:nth-child(3) .cont .cont-wrap img {
        width: 15.2vw;
        min-width: 57px;
    }
    .information .c-section .wrap .inner:nth-child(4) .cont .cont-wrap img {
        width: 14.9vw;
        min-width: 56px;
    }


    .information .c-section .wrap .inner .cont h4 {
        font-size: 2rem;
    }

    .information .c-section .wrap .inner .cont p {
        font-size: 1.6rem;
        margin-bottom: 30px;
        letter-spacing: var(--lsp-50);
    }

    .information .c-section .wrap .inner picture {
        width: 100%;
        margin-bottom: 35px;
    }

    .information .c-section .wrap .inner picture img {
        width: 100%;
    }

    .information .info-beppu .wrap-movie h4 {
        font-size: 2.2rem;
        margin-bottom: 25px;
        line-height: var(--lh-16);
    }

    .information::before {
        content: "";
        display: block;
        width: 100%;
        height: 13vw;
        background-image: url(../images/info-bg_sp.png);
        background-size: 100%;
        background-repeat: no-repeat;
        position: absolute;
        top: -7vw;
        left: 0;
    }

    .information::after {
        content: "";
        display: block;
        width: 100%;
        height: 13vw;
        background-image: url(../images/info-bg2_sp.png);
        background-size: 100%;
        background-repeat: no-repeat;
        position: absolute;
        bottom: -4vw;
        left: 0;
        z-index: -2;
        transform: rotateZ(360deg);
    }

    .information .title::after {
        content: "";
        display: block;
        background-image: url(../images/access-bg_item1_sp.png);
        width: 42.5vw;
        height: 53vw;
        background-size: contain;
        position: absolute;
        bottom: -31vw;
        left: auto;
        right: 0;
        z-index: -1;
    }

    .information .c-section .wrap::after {
        background-image: url(../images/table-bg_sp.png);
        height: 167px;
        border-radius: 0 0 30px 30px;
        top: auto;
        right: 0;
        bottom: -3vw;
    }

    .information .l-btn {
        width: 86vw;
    }

    .information .l-btn:hover {
        transition: 0;
        bottom: -3vw;
        opacity: 1;
    }

    /* 別府 */

    .information .info-beppu::before {
        width: 85vw;
        height: 33.5vw;
        top: 18vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .information .info-beppu .wrap-ttl {
        width: 88vw;
        top: -7.5vw;
        left: 50%;
        transform: translateX(-50%);
    }

    /* 志布志 */

    .information .info-shibushi::before {
        width: 76vw;
        height: 34vw;
        top: 18vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .information .info-shibushi .wrap-ttl {
        width: 88vw;
        top: -7.5vw;
        left: 50%;
        transform: translateX(-50%);
    }

} 

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

    .information {
        padding-top: 14vw;
        margin-top: -7vw;
        padding-bottom: 5vw;
        margin-bottom: 18vw;
    }

    .information::before {
        top: -3vw;
    }

    .information .title {
        margin-bottom: 22vw;
    }

    .information .title h2 svg {
        margin-bottom: -5px;
    }

    .information .c-section .wrap .inner {
        margin-bottom: 13.5vw;
    }

    .information .info-beppu .wrap-movie {
        margin-top: 13vw;
    }

    .information .c-section {
        margin-bottom: 16.5vw;
    }

    .information .l-btn {
        position: absolute;
        bottom: -15vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .information .l-btn a {
        padding: 27px;
    }

    .information .l-btn:hover {
        bottom: -15vw;
    }

    .information::after {
        bottom: -6vw;
    }

    .information .title::before {
        top: -23.5vw;
    }

    .information .title::after {
        top: 43vw;
    }

    .information .c-section .wrap::after {
        height: 118px;
        bottom: -15px;
    }
    

}

/* cta */

.cta {
    padding: 140px 13.5vw 100px;
}

.cta .cta-cont {
    transition: 0.3s;
}

.cta .cta-cont:hover {
    transition: 0.3s;
    transform: translateY(-5px);
}

.cta .cta-cont a {
    transition: 0.4s;
}

.cta .cta-cont a img {
    width: 100%;
}

.cta .cta-cont a:hover {
    opacity: 0.8;
    transition: 0.3s;
}

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

    .cta {
        padding: 13vw 6.5vw 5vw;
    }

    .cta .cta-cont a:hover {
        opacity: 1;
        transition: 0;
    }

    .cta .cta-cont:hover {
        transition: 0;
        transform: translateY(0);
        opacity: 1;
    }

}

/* footer */

footer {
    position: relative;
    z-index: 10;
    padding: 6vw 4vw 70px;
    background-color: var(--red);
}

footer::before {
    content: "";
    display: block;
    width: 100%;
    height: 12.5vw;
    background-image: url(../images/footer-bg_pc.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0vw;
    z-index: -1;
}

.footer-sns {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 70px;
}

.footer-sns p {
    margin-left: 20px;
    margin-right: 20px;
}

.footer-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 50px;
}

.footer-logo .logo-img {
    width: 23.5vw;
    min-width: 400px;
}

.footer-btn {
    width: 185px;
    margin-left: 40px;
}

.footer-btn p a {
    width: 55px;
    height: 55px;
    line-height: 55px;
    font-size: 2rem;
}

footer .copy {
    color: #fff;
    text-align: center;
}

footer .copy small {
    font-size: 1.4rem;
    line-height: var(--lh-18);
    letter-spacing: var(--lsp-50);
}

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

    .footer-btn {
        margin-left: 3vw;
    }

}

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

    footer .copy small .pcm-view {
        display: block;
    }
}

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

    footer {
        display: block;
        padding: 13vw 6.5vw 10.5vw;
    }

    footer::before {
        background-image: url(../images/footer-bg_sp.jpg);
        background-size: 100%;
    }

    .footer-sns {
        display: none;
    }

    .footer-logo {
        display: none;
    }

    footer .copy {
        text-align: center;
    }

    .sp-gotop {
        position: fixed;
        right: 4vw;
        bottom: 4vw;
        z-index: 100;
        min-width: 50px;
        width: 50px;
    }
}

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

    footer {
        padding: 13vw 6.5vw 9vw;
    }

    footer .copy small {
        font-size: 1.2rem;
    }

}
