/* Scss Document */


.mvs {
    position: relative;
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.mvs h2 {
    position: absolute;
    width: 70%;
    left: 15%;
    top: 38%;
    font-family: "Shippori Mincho", serif;
    font-size: 2.2rem;
    color: #FFF;
    text-align: center;
    padding-bottom: 40px;
    border-bottom: 2px solid #FFF;
    font-weight: bold;
    z-index: 20;
}

.mvs p {
    position: absolute;
    width: 59%;
    left: 20%;
    top: 60%;
    font-family: "Shippori Mincho", serif;
    font-size: 1.4rem;
    color: #FFF;
    text-align: center;
    z-index: 21;
}

.titles h2 {
    color: #141414;
    text-align: center;
    margin-bottom: 15px;
    font-family: "Shippori Mincho", serif;
    text-align: center;
    font-size: 1.75rem;
}

.titles p.sub {
    color: #A28550;
    text-align: center;
    margin-bottom: 25px;
    font-size: 1.05rem;
    text-transform: uppercase;
    font-family: noto sans jp;
}

.titles .en {
    font-family: bulter-r;
}

.sliders {
    padding: 80px 0;
    background-color: #fffff8;
    width: 100%;
    overflow: hidden;
}

.sliders p.text {
    color: #141414;
    text-align: center;
    margin-bottom: 70px;
    font-family: "Shippori Mincho", serif;
    text-align: center;
    font-size: 1.1rem;
    line-height: 2.2rem;
}

.sliderbox {
    display: flex;
}

.sliderbox .slider__inner {
    display: flex;
}

.sliderbox .slider__inner:first-child {
    animation: loop 120s linear infinite;
}

.sliderbox .slider__inner:nth-child(2) {
    animation: loop2 120s -80s linear infinite;
}

.sliderbox .slider__inner:last-child {
    animation: loop3 120s -40s linear infinite;
}

.sliderbox figure {
    border: 1px solid #A28550;
    padding: 8px;
    box-sizing: border-box;
    position: relative;
}

.sliderbox figcaption {
    color: #4f5150;
    font-size: 1rem;
    display: inline;
    position: absolute;
    left: 10px;
    top: -17px;
    background-color: #fffff8;
    padding: 0px 15px;
    font-family: "Shippori Mincho", serif;
}

.sliderbox li {
    width: 500px;
    position: relative;
    height: 400px;
}

.sliderbox .box1 {
    position: absolute;
    top: 8%;
    left: 3%;
    width: 92%;
}

.sliderbox .box2 {
    position: absolute;
    bottom: 0;
    left: 8%;
    width: 89%;
}

.sliderbox .box3 {
    position: absolute;
    bottom: 3%;
    left: 10%;
    width: 77%;
}

.sliderbox .box4 {
    position: absolute;
    top: 3%;
    left: 8%;
    width: 89%;
}

@keyframes loop {
    0% {
        transform: translateX(200%);
    }

    to {
        transform: translateX(-100%);
    }
}

@keyframes loop2 {
    0% {
        transform: translateX(100%);
    }

    to {
        transform: translateX(-200%);
    }
}

@keyframes loop3 {
    0% {
        transform: translateX(0%);
    }

    to {
        transform: translateX(-300%);
    }
}

.itinerary {
    background-color: #fffff8;
    padding: 50px 0 0;
}

.itinerary .container {
    display: -webkit-flex;
    display: flex;
    width: 100%;
    margin-top: 20px;
}

.itinerary .last {
    height: 100px;
}

.itinerary .main {
    display: block;
    width: 84%;
    padding-left: 7%;
    box-sizing: border-box;
}

.itinerary .sidebar {
    width: 16%;
}

.itinerary .sidebar li {
    box-sizing: border-box;
    border-bottom: #A28550 1px solid;
    font-size: 0.95rem;
    width: 80%;
    font-weight: bold;
}

.itinerary .sidebar li span {
    font-family: Roboto;
    font-size: 0.9rem;
}

.itinerary .sidebar a {
    color: #141414;
    transition: all 0.35s ease;
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    display: inline-block;
    padding: 11px 0 10px 13px;
    box-sizing: border-box;
}

.itinerary .sidebar a:hover {
    color: #BC0000;
}

.itinerary .sidebar a.selected {
    border-left: 5px #A28550 solid;
    padding-left: 8px;
    color: #A28550;
}

.itinerary .item_fixed {
    position: sticky;
    margin-bottom: 0;
    top: 60px;
    left: 0px;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    padding-left: 30px;
    padding-bottom: 20px;
    box-sizing: border-box;
}

.itinerary .detail {
    border-left: #aaa 1px solid;
    padding-top: 30px;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    padding-left: 7%;
    padding-bottom: 50px;
}

.itinerary .detail_last {
    padding: 0px;
}

.itinerary .day {
    position: absolute;
    width: 90px;
    height: 90px;
    left: -45px;
    top: 20px;
    background-color: #fffff8;
    z-index: 1;
    border: #4f5150 1px solid;
    border-radius: 50%;
    font-family: Roboto;
    color: #4f5150;
}

.itinerary .day .wrap {
    width: 100%;
    height: 100%;
    position: relative;
}

.itinerary .day .days {
    position: absolute;
    top: 5px;
    left: 0%;
    width: 22%;
    height: 30px;
    padding: 4px 0;
    background-color: #fffff8;
    color: #4f5150;
    text-align: center;
    font-size: 1.05rem;
    display: block;
}

.itinerary .day .number {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 37%;
    left: 0;
    font-size: 1.8rem;
    font-weight: bold;
    display: block;
}

.itinerary h3 {
    color: #4f5150;
    font-size: 1.3rem;
    margin-bottom: 20px;
    font-weight: bold;
    padding-left: 20px;
    font-family: "Shippori Mincho", serif;
}

.itinerary .timeline {
    display: table;
    width: 100%;
    z-index: 10000;
    padding-left: 15px;
}

.itinerary .timeline .box {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 55%;
    padding-right: 60px;
    padding-left: 5px;
}

.itinerary .timeline .pic {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 45%;
    padding-top: 20px;
    padding-right: 10px;
}

.itinerary .timeline .pic figure {
    border-top: 1px solid #A28550;
    border-left: 1px solid #A28550;
    padding-top: 10px;
    padding-left: 10px;
    box-sizing: border-box;
    position: relative;
}

.itinerary .timeline .pic img {
    width: 100%;
}

.itinerary .timeline .pic figcaption {
    position: absolute;
    background-color: #fffff8;
    padding: 5px 20px;
    display: inline-block;
    font-family: "Shippori Mincho", serif;
    font-size: 1.1rem;
    color: #141414;
    left: 0;
    bottom: 0;
    text-transform: uppercase;
}

.itinerary .timeline h4 {
    color: #BC0000;
    font-size: 1.05rem;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.itinerary .timeline .title {
    font-family: "Shippori Mincho", serif;
    font-size: 1.6rem;
    line-height: 2.0rem;
    color: #141414;
    margin-bottom: 10px;
}

.itinerary .timeline .text {
    font-size: 0.96rem;
    line-height: 1.45rem;
    color: #4f5150;
    text-align: justify;
    text-justify: inter-word;
}

.itinerary .timeline .stay {
    color: #BC0000;
    margin-top: 15px;
    text-align: right;
}

.itinerary .linkbox {
    border-top: 1px solid #aaa;
    padding-top: 10px;
    display: table;
    width: 100%;
    margin-top: 10px;
}

.itinerary .linkbox .link-info {
    display: table-cell;
    width: 67%;
    padding-right: 10px;
    box-sizing: border-box;
    vertical-align: top;
}

.itinerary .linkbox .reference {
    display: inline-block;
    background-color: #BC0000;
    color: #FFF;
    font-size: 0.9rem;
    padding: 5px 10px;
    margin-bottom: 8px;
}

.itinerary .linkbox .pics {
    display: table-cell;
    width: 33%;
    box-sizing: border-box;
    vertical-align: top;
}

.itinerary .linkbox .link-title {
    font-size: 1.0rem;
    line-height: 1.25rem;
}

.itinerary .timeline .box_video {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 52%;
    padding-right: 40px;
    padding-left: 5px;
}

.itinerary .timeline .video_box {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 48%;
    padding-top: 40px;
}

.itinerary .video {
    width: 100%;
    position: relative;
    padding-top: 60%;
}

.itinerary .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hotel .container {
    display: -webkit-flex;
    display: flex;
    background-color: #F2F2F2;
    width: 100%;
}

.hotel .main {
    display: block;
    width: 70%;
}

.hotel .sidebar {
    width: 30%;
}

.hotel .item_fixed {
    position: sticky;
    margin-bottom: 0;
    top: 0px;
    left: 0px;
    z-index: 1;
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

.hotel .box {
    width: 100%;
    padding: 60px 5%;
    box-sizing: border-box;
}

.hotel .hotel_list {
    padding: 30px 0;
    border-bottom: #4f5150 1px solid;
    display: table;
    width: 100%;
    margin-bottom: 20px;
}

.hotel .pic {
    display: table-cell;
    vertical-align: middle;
    box-sizing: border-box;
    width: 50%;
    padding-top: 10px;
}

.hotel .pic figure {
    border: 1px solid #A28550;
    padding: 5px;
    box-sizing: border-box;
    background-color: #fff;
}

.hotel .detail {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 50%;
    padding-right: 40px;
}

.hotel .title {
    position: relative;
    height: 30px;
    width: 100%;
    margin-bottom: 10px;
}

.hotel .title h3 {
    color: #141414;
    font-size: 1.5rem;
    font-family: "Shippori Mincho", serif;
    position: absolute;
    left: 0;
    bottom: 0;
}

.hotel .title p.day {
    position: absolute;
    right: 25px;
    bottom: 0;
    text-align: right;
    color: #BC0000;
    font-size: 0.95rem;
}

.hotel .title p.day span {
    font-family: Roboto;
    font-size: 0.9rem;
}

.hotel p.text {
    font-size: 0.96rem;
    line-height: 1.5rem;
    color: #4f5150;
    text-align: justify;
    text-justify: inter-word;
}



.hotel .pic figure {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.hotel .pic figcaption {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 3px;
    box-sizing: border-box;
    height: 25px;
    text-align: right;
    font-size: 0.85rem;
    background: rgba(255, 255, 255, 0.75);
    color: #ff0034;
}

.hotel .pic .thumbs {
    display: table;
    width: 100%;
    margin-top: 7px;
}

.hotel .pic li {
    display: table-cell;
    vertical-align: top;
    box-sizing: border-box;
    width: 20%;
    padding: 0 3px;
    box-sizing: border-box;
}

.hotel .pic li img {
    opacity: 0.65;
    width: 100%;
}

.hotel .pic li:hover img {
    opacity: 1;
}

.hotel .pic li.active img {
    border: #111 3px solid;
    opacity: 1;
    box-sizing: border-box;
}


.links{
    padding: 50px 8%;
}

.links ul{
    display: table;
    width: 100%;
}
.links li{
    display: table-cell;
    width: 25%;
    vertical-align: top;
    padding: 0 20px;
}

.links li p{
    font-size: 0.9rem;
    color: #333;
    transition: all 0.35s ease;
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    margin-top: 10px;   
}

.links li:hover p{
    font-size: 0.9rem;
    color: #ff0034;
}


.main .link {
    border: #4f5150 2px solid;
    text-align: center;
    color: #4f5150;
    line-height: 0.95rem;
    font-size: 0.95rem;
    padding: 10px 0px;
    width: 32%;
    text-transform: uppercase;
    outline: none;
    position: relative;
    margin: 15px 0 0px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    overflow: hidden;
    z-index: 1;
    font-weight: 700;
    display: inline-block;
}

.main .link:after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
    color: #FFFFFF;
    width: 100%;
    height: 0;
    top: 50%;
    left: 50%;
    background: #4f5150;
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

.main .link:hover,
.main .link:active {
    color: #FFFFFF;
}

.main .link:hover:after {
    height: 350%;
    opacity: 1;
}

.main .link:active:after {
    height: 350%;
    opacity: 1;
}

.fadein {
    opacity: 0;
    transform: translate(0px, 0px);
    transition: all 2s;
}

.fadein.scrollin {
    opacity: 1;
    transform: translate(0px, 0px);
}

.fadein4 {
    opacity: 0;
    transform: translate(0px, 80px);
    transition: all 1s;
}

.fadein4.scrollin4 {
    opacity: 1;
    transform: translate(0px, 0px);
}

.next {
    width: 10%;
    position: absolute;
    top: 70%;
    left: 45%;
    text-align: center;
}

a.arrow {
    padding-top: 60px;
    position: relative;
    width: 24px;
    display: inline-block;
    margin: 0 auto;
    color: #FFF;
}

a.arrow span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 24px;
    height: 24px;
    margin-left: -6px;
    border-left: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb 2.5s infinite;
    animation: sdb 2.5s infinite;
    box-sizing: border-box;
}

@-webkit-keyframes sdb {
    0% {
        -webkit-transform: rotate(-45deg) translate(0, 0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        -webkit-transform: rotate(-45deg) translate(-20px, 20px);
        opacity: 0;
    }
}

@keyframes sdb {
    0% {
        transform: rotate(-45deg) translate(0, 0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        transform: rotate(-45deg) translate(-20px, 20px);
        opacity: 0;
    }
}

@media only screen and (max-width: 980px) {
    .mvs {
        height: 500px;
        width: 100%;
        position: relative;
        overflow: auto;
    }

    .mvs h2 {
        width: 82%;
        left: 9%;
        top: 40%;
        font-size: 2.1rem;
        padding-bottom: 30px;
    }

    .mvs p {
        width: 82%;
        left: 9%;
        top: 65%;
        font-size: 1.3rem;
    }

    .titles h2 {
        font-size: 1.7rem;
    }

    .titles p.sub {
        font-size: 1.05rem;
    }

    .titles .en {
        font-family: bulter-r;
    }

    .sliders {
        padding: 50px 0 0;
    }

    .sliders p.text {
        margin-bottom: 30px;
        font-size: 1.2rem;
        line-height: 2.4rem;
    }

    .sliderbox {
        display: flex;
    }

    .sliderbox .slider__inner {
        display: flex;
    }

    .sliderbox .slider__inner:first-child {
        animation: loop 120s linear infinite;
    }

    .sliderbox .slider__inner:nth-child(2) {
        animation: loop2 120s -80s linear infinite;
    }

    .sliderbox .slider__inner:last-child {
        animation: loop3 120s -80s linear infinite;
    }

    .sliderbox figcaption {
        font-size: 1.1rem;
    }

    .sliderbox li {
        width: 420px;
        position: relative;
        height: 350px;
    }

    .sliderbox .box1 {
        top: 8%;
        left: 3%;
        width: 94%;
    }

    .sliderbox .box2 {
        bottom: 0;
        left: 8%;
        width: 90%;
    }

    .sliderbox .box3 {
        bottom: 5%;
        left: 12%;
        width: 75%;
    }

    .sliderbox .box4 {
        top: 3%;
        left: 8%;
        width: 90%;
    }

    .itinerary {
        background-color: #fffff8;
        padding: 50px 0 0;
    }

    .itinerary .container {
        display: -webkit-flex;
        display: flex;
        width: 100%;
        margin-top: 20px;
    }

    .itinerary .last {
        height: 0px;
    }

    .itinerary .main {
        display: block;
        width: 94%;
        padding-left: 0%;
        box-sizing: border-box;
        margin: 0 auto;
    }

    .itinerary .sidebar {
        width: 0%;
        display: none;
    }

    .itinerary .detail {
        border-left: #aaa 1px solid;
        padding-top: 30px;
        width: 100%;
        box-sizing: border-box;
        position: relative;
        padding-left: 5%;
        padding-bottom: 40px;
    }

    .itinerary .detail_last {
        padding: 0px;
    }

    .itinerary .day {
        position: absolute;
        width: 58px;
        height: 58px;
        left: -16px;
        top: 20px;
    }

    .itinerary .day .days {
        top: 4px;
        left: 0%;
        width: 22%;
        height: 26px;
        padding: 2px 0;
        font-size: 0.96rem;
    }

    .itinerary .day .number {
        top: 40%;
        left: 0;
        font-size: 1.5rem;
    }

    .itinerary h3 {
        color: #4f5150;
        font-size: 1.3rem;
        margin-bottom: 20px;
        font-weight: bold;
        padding-left: 15px;
        font-family: "Shippori Mincho", serif;
    }

    .itinerary .timeline {
        display: table;
        width: 100%;
        z-index: 10000;
        padding-left: 15px;
    }

    .itinerary .timeline .box {
        width: 47%;
        padding-right: 30px;
    }

    .itinerary .timeline .pic {
        width: 53%;
        padding-top: 20px;
    }

    .itinerary .timeline .pic figure {
        padding-top: 8px;
        padding-left: 8px;
    }

    .itinerary .timeline .pic figcaption {
        font-size: 1.1rem;
    }

    .itinerary .timeline h4 {
        color: #BC0000;
        font-size: 1.05rem;
        margin-bottom: 10px;
        text-transform: uppercase;
    }

    .itinerary .timeline .title {
        font-size: 1.25rem;
        line-height: 2rem;
    }

    .itinerary .timeline .text {
        font-size: 1rem;
        line-height: 1.5rem;
    }

    .hotel .main {
        display: block;
        width: 100%;
    }

    .hotel .sidebar {
        width: 0%;
    }

    .hotel .box {
        width: 100%;
        padding: 30px 4%;
        box-sizing: border-box;
    }

    .hotel li {
        padding: 30px 0;
        margin-bottom: 20px;
    }

    .hotel li .pic {
        width: 37%;
    }

    .hotel .detail {
        width: 63%;
        padding-right: 25px;
    }

    .hotel .title {
        position: relative;
        height: 30px;
        width: 100%;
        margin-bottom: 10px;
    }

    .hotel .title h3 {
        font-size: 1.5rem;
    }

    .hotel .title p.day {
        right: 10px;
        font-size: 1rem;
    }

    .hotel .title p.day span {
        font-family: Roboto;
        font-size: 0.95rem;
    }

    .hotel p.text {
        font-size: 1rem;
        line-height: 1.6rem;
    }

    .hotel .link {
        line-height: 1rem;
        font-size: 1rem;
    }

    .fadein {
        opacity: 1;
    }

    .fadein4 {
        opacity: 1;
    }
}

@media only screen and (max-width: 680px) {
    .mvs {
        height: 350px;
        width: 100%;
        position: relative;
        overflow: auto;
    }

    .mvs h2 {
        width: 80%;
        left: 10%;
        top: 23%;
        font-size: 2rem;
        padding-bottom: 20px;
    }

    .mvs p {
        width: 82%;
        left: 9%;
        top: 65%;
        font-size: 1.25rem;
    }

    .titles h2 {
        font-size: 1.8rem;
        line-height: 3rem;
        width: 90%;
        margin: 0 auto 10px;
    }

    .titles p.sub {
        font-size: 1.25rem;
    }

    .titles .en {
        font-family: bulter-r;
    }

    .sliders {
        padding: 30px 0 0;
    }

    .sliders p.text {
        margin-bottom: 60px;
        font-size: 1.35rem;
        line-height: 2.4rem;
        width: 90%;
        margin: 0 auto;
    }

    .sliderbox {
        display: flex;
    }

    .sliderbox .slider__inner {
        display: flex;
    }

    .sliderbox .slider__inner:first-child {
        animation: loop 90s linear infinite;
    }

    .sliderbox .slider__inner:nth-child(2) {
        animation: loop2 90s -60s linear infinite;
    }

    .sliderbox .slider__inner:last-child {
        animation: loop3 90s -30s linear infinite;
    }

    .sliderbox figcaption {
        font-size: 1.15rem;
    }

    .sliderbox li {
        width: 400px;
        height: 400px;
    }

    .sliderbox .box1 {
        top: 16%;
        left: 3%;
        width: 90%;
    }

    .sliderbox .box2 {
        bottom: 15%;
        left: 7%;
        width: 88%;
    }

    .sliderbox .box3 {
        bottom: 2%;
        left: 8%;
        width: 82%;
    }

    .sliderbox .box4 {
        top: 10%;
        left: 8%;
        width: 89%;
    }

    .itinerary {
        background-color: #fffff8;
        padding: 50px 0 0;
    }

    .itinerary .container {
        display: -webkit-flex;
        display: flex;
        width: 100%;
        margin-top: 20px;
    }

    .itinerary .last {
        height: 0px;
    }

    .itinerary .main {
        width: 92%;
        margin: 0 3% 0 5%;
    }

    .itinerary .detail {
        padding-top: 30px;
        width: 100%;
        padding-left: 3%;
        padding-right: 15px;
        padding-bottom: 20px;
    }

    .itinerary .detail_last {
        padding: 0px;
    }

    .itinerary .day {
        width: 64px;
        height: 64px;
        left: -15px;
        top: 15px;
    }

    .itinerary .day .days {
        top: 3px;
        left: 0%;
        width: 22%;
        height: 26px;
        padding: 2px 0;
        font-size: 1.1rem;
    }

    .itinerary .day .number {
        top: 38%;
        left: 0;
        font-size: 1.6rem;
    }

    .itinerary h3 {
        font-size: 1.4rem;
        margin-bottom: 30px;
        padding-left: 50px;
    }

    .itinerary .timeline {
        padding-left: 10px;
    }

    .itinerary .timeline .box {
        width: 100%;
        padding-right: 0px;
        display: block;
    }

    .itinerary .timeline .pic {
        width: 100%;
        padding-top: 20px;
        display: block;
    }

    .itinerary .timeline .pic figure {
        padding-top: 8px;
        padding-left: 8px;
    }

    .itinerary .timeline .pic figcaption {
        font-size: 1.3rem;
    }

    .itinerary .timeline h4 {
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

    .itinerary .timeline .title {
        font-size: 1.7rem;
        line-height: 2.3rem;
    }

    .itinerary .timeline .text {
        font-size: 1.25rem;
        line-height: 1.9rem;
    }

    .hotel .main {
        display: block;
        width: 100%;
    }

    .hotel .box {
        width: 100%;
        padding: 30px 5%;
    }

    .hotel li {
        padding: 10px 0 50px;
        margin-bottom: 30px;
    }

    .hotel li .pic {
        width: 100%;
        margin-top: 20px;
        display: block;
    }

    .hotel .detail {
        width: 100%;
        padding-right: 0px;
        display: block;
    }

    .hotel .title {
        position: relative;
        height: 30px;
        width: 100%;
        margin-bottom: 10px;
    }

    .hotel .title h3 {
        font-size: 1.75rem;
    }

    .hotel .title p.day {
        right: 10px;
        font-size: 1.2rem;
    }

    .hotel .title p.day span {
        font-family: Roboto;
        font-size: 1.1rem;
    }

    .hotel p.text {
        font-size: 1.25rem;
        line-height: 1.9rem;
    }

    .hotel .link {
        line-height: 1.2rem;
        font-size: 1.2rem;
    }
}

@media only screen and (max-width: 380px) {
    .mvs {
        height: 300px;
        width: 100%;
        position: relative;
        overflow: auto;
    }

    .mvs h2 {
        width: 80%;
        left: 10%;
        top: 24%;
        font-size: 1.8rem;
        padding-bottom: 15px;
    }

    .mvs p {
        width: 82%;
        left: 9%;
        top: 65%;
        font-size: 1.15rem;
    }

    .titles h2 {
        font-size: 1.6rem;
        line-height: 2.6rem;
        width: 90%;
        margin: 0 auto 10px;
    }

    .titles p.sub {
        font-size: 1.15rem;
    }

    .sliders {
        padding: 15px 0 0;
    }

    .sliders p.text {
        margin-bottom: 60px;
        font-size: 1.25rem;
        line-height: 2rem;
        width: 92%;
        margin: 0 auto;
    }

    .sliderbox {
        display: flex;
    }

    .sliderbox .slider__inner {
        display: flex;
    }

    .sliderbox .slider__inner:first-child {
        animation: loop 90s linear infinite;
    }

    .sliderbox .slider__inner:nth-child(2) {
        animation: loop2 90s -60s linear infinite;
    }

    .sliderbox .slider__inner:last-child {
        animation: loop3 90s -30s linear infinite;
    }

    .sliderbox figcaption {
        font-size: 1.15rem;
    }

    .sliderbox li {
        width: 320px;
        height: 300px;
    }

    .sliderbox .box1 {
        top: 16%;
        left: 3%;
        width: 90%;
    }

    .sliderbox .box2 {
        bottom: 15%;
        left: 7%;
        width: 88%;
    }

    .sliderbox .box3 {
        bottom: 2%;
        left: 8%;
        width: 82%;
    }

    .sliderbox .box4 {
        top: 10%;
        left: 8%;
        width: 89%;
    }

    .itinerary {
        background-color: #fffff8;
        padding: 50px 0 0;
    }

    .itinerary .container {
        display: -webkit-flex;
        display: flex;
        width: 100%;
        margin-top: 20px;
    }

    .itinerary .last {
        height: 0px;
    }

    .itinerary .main {
        width: 94%;
        margin: 0 2% 0 4%;
    }

    .itinerary .detail {
        padding-top: 25px;
        width: 100%;
        padding-left: 3%;
        padding-right: 15px;
        padding-bottom: 30px;
    }

    .itinerary .detail_last {
        padding: 0px;
    }

    .itinerary .day {
        width: 60px;
        height: 60px;
        left: -10px;
        top: 10px;
    }

    .itinerary .day .days {
        top: 1px;
        left: 0%;
        width: 22%;
        height: 26px;
        padding: 2px 0;
        font-size: 1.05rem;
    }

    .itinerary .day .number {
        top: 36%;
        left: 0;
        font-size: 1.65rem;
    }

    .itinerary h3 {
        font-size: 1.4rem;
        margin-bottom: 30px;
        padding-left: 50px;
    }

    .itinerary .timeline {
        padding-left: 10px;
    }

    .itinerary .timeline .box {
        width: 100%;
        padding-right: 0px;
        display: block;
    }

    .itinerary .timeline .pic {
        width: 100%;
        padding-top: 20px;
        display: block;
    }

    .itinerary .timeline .pic figure {
        padding-top: 8px;
        padding-left: 8px;
    }

    .itinerary .timeline .pic figcaption {
        font-size: 1.3rem;
    }

    .itinerary .timeline h4 {
        font-size: 1.15rem;
        margin-bottom: 8px;
    }

    .itinerary .timeline .title {
        font-size: 1.55rem;
        line-height: 2.2rem;
        margin-bottom: 10px;
    }

    .itinerary .timeline .text {
        font-size: 1.15rem;
        line-height: 1.8rem;
    }

    .hotel .main {
        display: block;
        width: 100%;
    }

    .hotel .box {
        width: 100%;
        padding: 30px 5%;
    }

    .hotel li {
        padding: 10px 0 40px;
        margin-bottom: 30px;
    }

    .hotel .title {
        margin-bottom: 10px;
    }

    .hotel .title h3 {
        font-size: 1.6rem;
    }

    .hotel .title p.day {
        right: 5px;
        font-size: 1.1rem;
    }

    .hotel .title p.day span {
        font-family: Roboto;
        font-size: 1.05rem;
    }

    .hotel p.text {
        font-size: 1.15rem;
        line-height: 1.8rem;
    }

    .hotel .link {
        line-height: 1.15rem;
        font-size: 1.15rem;
    }
}