/*contents_sp*/
.l-sizedetect {
    font-family: "SP";
}

/* -----------------------------

HAMBARGER MENU

----------------------------- */
#ham-menu {
    position: fixed;
    top: 0px;
    right: 0px;
    z-index: 11;
    height: 60px;
    width: 60px;
    background: rgba(255,255,255,0.83);
    box-shadow: -1px 1px 3px #9a9a9a;
    cursor: pointer;
    opacity: 0;
    transform: translate(100%, 0);
    transition: all 0.5s ease;
    display: none;
}

#ham-menu.is-show {
    opacity: 1;
    transform: translate(0, 0);
}

.menu-on #ham-menu.is-show {
    background: none;
    box-shadow: none;
}

.ham-menu-in, .ham-menu-in span {
    display: inline-block;
    -webkit-transition: all .4s;
    transition: all .4s;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ham-menu-in {
    position: absolute;
    width: 20px;
    height: 17px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.ham-menu-in span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #464646;
    border-radius: 3px;
}

.ham-menu-in span:nth-of-type(1) {
    top: 0;
}

.ham-menu-in span:nth-of-type(2) {
    top: 7px;
}

.ham-menu-in span:nth-of-type(3) {
    bottom: 0;
}

#ham-menu.active span:nth-of-type(1) {
    -webkit-transform: translateY(20px) rotate(-45deg);
    -ms-transform: translateY(9px) rotate(-45deg);
    transform: translateY(7px) rotate(-45deg);
}

#ham-menu.active span:nth-of-type(2) {
    left: 50%;
    opacity: 0;
    -webkit-animation: active-menu-bar02 .8s forwards;
    animation: active-menu-bar02 .8s forwards;
}

@-webkit-keyframes active-menu-bar02 {
    100% {
        height: 0;
    }
}

@keyframes active-menu-bar02 {
    100% {
        height: 0;
    }
}

#ham-menu.active span:nth-of-type(3) {
    -webkit-transform: translateY(-20px) rotate(45deg);
    -ms-transform: translateY(-9px) rotate(45deg);
    transform: translateY(-7px) rotate(45deg);
}

/*contents_pc*/
/* -----------------------------

reset | common | keyframes

----------------------------- */
* {
    box-sizing: border-box;
}

img {
    vertical-align: middle;
}

html, body {
    font-family: 'Noto Sans JP', sans-serif;
}

.serif {
    font-family: 'Noto Serif JP', serif;
}

.br-sp {
    display: block;
}

#widewrapper {
    width: 100%;
    overflow: hidden;
}

#contentsArea {
    /* max-width: 1680px; */
    margin: 0 auto;
    position: relative;
    width: 100%;
}

#contents {
    width: 100%;
    background-repeat: no-repeat;
    /*background-attachment: fixed;*/
    padding-top: 10px;
    transition: all 0.5s ease;
    position: relative;
    z-index: 5;
}

#contents-in {
    padding-top: 100px;
    z-index: 5;
    position: relative;
}

/* -----------------------------

keyframes

----------------------------- */
@keyframes anim-show {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes anim-hide {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

/* -----------------------------

contents-bg

----------------------------- */
.contents-bg {
    opacity: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    /*background-attachment: fixed;*/
    background-position: center center;
    -webkit-background-size: cover;
    background-size: cover;
    -webkit-transition: all 2s linear 0s;
    -moz-transition: all 2s linear 0s;
    transition: all 2s linear 0s;
}

.contents-bg.is-show {
    z-index: 1;
    opacity: 1;
}

.contents-bg span {
/*    display: block;
    font-size: 100px;
    top: 40%;
    left: 0%;
    position: fixed;
    background: #ccc;*/
}
.bg-wrap{width: 100%;}
#bg-01 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg01.jpg);
}

#bg-02 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg02.jpg);
}

#bg-03 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg03.jpg);
}

#bg-04 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg04.jpg);
}

#bg-05 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg05.jpg);
}

#bg-06 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg06.jpg);
}

/* #bg-07 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg07.jpg);
}

#bg-08 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg08.jpg);
} */

#bg-09 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg09.jpg);
}

#bg-10 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg10.jpg);
}

#bg-11 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg11.jpg);
}

#bg-12 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg12.jpg);
}

#bg-13 {
    background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg13.jpg);
}

/* -----------------------------

mainVisual

----------------------------- */
#mainVisual {
    overflow: hidden;
    z-index: 9999;
    position: relative;
    z-index: 10;
}

.kv-area {
    width: 100%;
    /* background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/main-visual.jpg) no-repeat; */
    /* background-position: center top; */
}

.kv-area img {
    width: 100%;
}

.map-area {
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/map_bg.png) no-repeat;
    /*background-position: center center;*/
    opacity: 1;
    position: relative;
}

.map-area:before {
    /* content: ''; */
    display: block;
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/map_front.png) no-repeat;
    background-position: center center;
    min-width: 1020px;
    width: 100%;
    height: 546px;
    opacity: 1;
    /* opacity: 0; */
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    transition: all 1s ease;
}

.map-area:before.is-show {
    animation: anim-mapshow 3s linear 0s forwards;
}

.map-area.is-show {
    /*animation: anim-mapshow 3s linear 0s forwards;*/
}

@keyframes anim-mapshow {
    0% {
        opacity: 0;
        transform: translate3d(0, 50%, 0);
        background-position: (-50%, -50%);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0%, 0);
        background-position: (0%, 0%);
    }
}

.map-area-in {
    width: auto;
    height: auto;
    margin: 0 auto;
    position: relative;
}

.map-spots {
    display: none;
}

.map-spots a {
    position: absolute;
    opacity: 1;
}

.map-spots a:hover {
    opacity: 0.5;
}

.map-spots .spot1 {
    top: 244px;
    left: 452px;
    animation: bounce-spot 2.3s cubic-bezier(0, 0, 0.2, 1) 0s infinite;
}

.map-spots .spot2 {
    top: 220px;
    left: 546px;
    animation: bounce-spot 2.4s cubic-bezier(0, 0, 0.2, 1) 0s infinite;
}

.map-spots .spot3 {
    top: 123px;
    left: 742px;
    animation: bounce-spot 2.2s cubic-bezier(0, 0, 0.2, 1) 0s infinite;
}

.map-spots .spot4 {
    top: 237px;
    left: 818px;
    animation: bounce-spot 2.1s cubic-bezier(0, 0, 0.2, 1) 0s infinite;
}

/*---------------------
amination
---------------------*/
.anime-map {
    opacity: 1;
    transition: none;
}

.map-words {
    padding: 0 30px;
}

.map-ttl {
    padding-top: 30px;
}

.map-ttl .pc,
.map-text .pc {
    display: none;
}
.map-ttl .sp,
.map-text .sp {
    display: block;
}

.map-words img {
    width: 100%;
}

.map-text {
    padding-top: 20px;
    padding-bottom: 40px;
}

.map-area .scroll {
    display: none;
    position: absolute;
    bottom: 0;
    left: 25px;
    animation: bounce-scroll 2s cubic-bezier(0, 0, 0.2, 1) 0s infinite;
}

.map-bard {
    display: none;
    /* position: absolute; */
    /* background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/map-bard.png) no-repeat; */
    /* width: 96px; */
    /* height: 62px; */
}

.map-bard01 {
    top: 171px;
    left: -263px;
}

.map-bard02 {
    top: 412px;
    left: 85px;
}

.map-bard03 {
    top: 77px;
    left: 528px;
}

.map-bard04 {
    bottom: 16px;
    right: -370px;
}

@keyframes bounce-scroll {
    0% {
        opacity: 1;
        transform: translate3d(0, 0%, 0)
    }

    40% {
        opacity: 0.5;
        transform: translate3d(0, -10%, 0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0%, 0)
    }
}

.bounce-scroll {
    animation-name: bounce-scroll;
}

@keyframes bounce-spot {
    0% {
        opacity: 1;
        transform: translate3d(0, 0%, 0)
    }

    40% {
        opacity: 1;
        transform: translate3d(0, -20%, 0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0%, 0)
    }
}

.bounce-scroll {
    animation-name: bounce-scroll;
}

/*============================
.gnav
============================*/
.gnav {
    background: rgba(255,255,255,0.83);
    width: 100%;
    height: 100vh;
    padding: 80px 0px;
    z-index: 10;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    transform: translate(0, -100%);
    transition: all 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
    display: none;
}

.menu-on .gnav {
    opacity: 1;
    transform: translate(0, 0);
    /*visibility: visible;*/
}

.gnav-list {
    width: 80%;
    height: auto;
    margin: 0px auto;
    display: block;
    /* padding: 0 10%; */
    border-bottom: 1px solid #989898;
}

.gnav-item {
    width: 100%;
    height: 100%;
    text-align: left;
    border-left: none;
    /* border-top: 1px solid #989898; */
    position: relative;
}

.gnav-item:after {
    position: absolute;
    content: '';
    width: 8px;
    height: 8px;
    border-top: solid 2px #000;
    border-right: solid 2px #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 50%;
    right: 10px;
    margin-top: -3px;
    pointer-events: none;
}

.gnav-item a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    padding: 4% 0;
}


.gnav-item img {
    padding-top: 10px;
    width: 50%;
    height: auto;
}

.gnav-list .gnav-item:nth-child(3) img {
    width: 64%;
}

.gnav-item img.pc {
    display: none;
}

.gnav-arrow {
    display: none;
}

/* sec common */
.sec .media-wrap:nth-of-type(5) .media {
    margin-bottom: 0;
}

.sec .media-wrap:nth-of-type(5) .media-lead {
    margin-bottom: 0;
}

/* -----------------------------

sec

----------------------------- */
.sec {
    width: 94%;
    margin: 0 auto;
    padding: 0 0px 5px;
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg-paper-body.png) repeat-y;
    position: relative;
    z-index: 10;
}

.sec img {
    /* width: 100%; */
}

.sec:before {
    /* content: ''; */
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg-paper-top.png) no-repeat;
    background-size: 100%;
    width: 100%;
    height: 17px;
    position: absolute;
    top: -17px;
    left: 0px;
}

.sec:after {
    /*content: '';*/
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg-paper-bottom.png) no-repeat;
    background-size: 100%;
    width: 100%;
    height: 17px;
    position: absolute;
    bottom: -17px;
    left: 0;
}

.tra-top {
    width: 94%;
    position: relative;
    margin: 0 auto;
    z-index: 100;
}

.tra-bottom {
    width: 94%;
    height: auto;
    position: relative;
    z-index: 100;
    margin: 0 auto 20px;
    line-height: 1;
}

.tra-top img {
    width: 100%;
    vertical-align: bottom;
}

.tra-bottom img {
    width: 100%;
    vertical-align: top;
}

.sec-ttl {
    text-align: center;
    margin-bottom: 0;
    margin-top: 0;
    position: relative;
    padding: 0 0 4% 0;
}

.sec-ttl:before, .sec-ttl:after {
    content: '';
    display: block;
    width: 90%;
    background: #000;
    position: absolute;
    left: 50%;
    margin-left: -45%;
}

.sec-ttl:before {
    height: 3px;
    bottom: 4px;
}

.sec-ttl:after {
    height: 1px;
    bottom: 0px;
}

#sec-hagi .sec-ttl img {
    width: 53%;
    margin-left: -20px;
    padding-bottom: 5px;
}

#sec-tsuwano .sec-ttl img {
    width: 68%;
    padding-bottom: 5px;
}

#sec-okayama .sec-ttl img {
    width: 90%;
    padding-bottom: 5px;
}

.sec-ttl img.pc {
    display: none;
}

.sec-ttl img.sp {
    display: inline-block;
}

/*  media-wrap  */
.media-wrap {
    position: relative;
}

.media-wrap>img {
    position: absolute;
    height: auto;
    opacity: 0;
}

.media-wrap {
    position: relative;
    padding: 0 0px 90px;
    padding: 0px 0px 42%;
}

.media {
    /* display: flex; */
    /* width: 920px; */
    margin: 13px auto 0px;
}

.media.media-reverse {
    flex-direction: row-reverse;
}

.media-image {
    padding: 0 10px;
}

.media-image img {
    display: block;
    z-index: 2;
    position: relative;
    width: 100%;
}

.media-text-block {
    padding: 7px 10px 0px;
}

.media.media-reverse .media-text-block {
    /* padding: 7px 10px 0 0px; */
}

.media-ttl {
    font-size: 21px;
    margin-bottom: 10px;
    vertical-align: top;
    line-height: 30px;
}

.media-ttl span {
    font-size: 14px;
    display: inline-block;
    padding-left: 20px;
    margin-left: 20px;
    line-height: 30px;
    border-left: 1px solid #000;
    vertical-align: top;
}

.media-lead {
    font-size: 15px;
    font-weight: bold;
    line-height: 1.6;
    margin-bottom: 39px;
    letter-spacing: 0.01em;
}

.media-access {
}

.media-subttl {
    font-size: 17px;
    font-weight: bold;
    margin-bottom: 13px;
}

.media-subtext {
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: 0.01em;
    font-weight: bold;
}

.media-subttl:before {
    content: '';
    display: inline-block;
}

.ico-access:before {
    width: 25px;
    height: 29px;
    padding-right: 8px;
    margin-bottom: -8px;
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/ico-access.png) left center no-repeat;
    transform: scale(0.9);
}

.ico-date:before {
    width: 29px;
    height: 29px;
    padding-right: 10px;
    margin-bottom: -7px;
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/ico-date.png) left center no-repeat;
    transform: scale(0.9);
}

/* -----------------------------

stamp positions

----------------------------- */
/*footprint*/
.footprint1 {
    bottom: -7%;
    left: 15%;
    width: 50%;
}

.footprint2 {
    bottom: -5%;
    left: 40%;
    width: 40%;
}

.footprint3 {
    bottom: -4%;
    left: 16%;
    width: 37%;
}

.footprint4 {
    bottom: -5%;
    left: 48%;
    width: 38%;
}

/*  hagi  */
.stamp1 {
    bottom: 5%;
    left: 62%;
    width: 24%;
}

.stamp2 {
    bottom: 3%;
    left: 15%;
    width: 20%;
}

.stamp3 {
    bottom: 5%;
    left: 56%;
    width: 27%;
}

.stamp4 {
    bottom: 3%;
    left: 16%;
    width: 25%;
}

.stamp5 {
    bottom: 5%;
    left: 18%;
    width: 21%;
}

.tegaki-arrow {
    bottom: 6%;
    left: 59%;
    width: 14%;
}

/*  tsuwano  */
.tsuwano-stamp1 {
    top: 330px;
    left: 820px;
}

.tsuwano-stamp2 {
    top: 340px;
    left: 170px;
}

.tsuwano-stamp3 {
    top: 320px;
    left: 780px;
}

.tsuwano-stamp4 {
    top: 350px;
    left: 220px;
}

.tsuwano-stamp5 {
    top: 160px;
    left: 780px;
}

.tsuwano-tegaki-arrow {
    top: 290px;
    left: 730px;
}

/*---------------------------------------

recommend

---------------------------------------*/
.recommend {
    width: 100%;
    margin: 0px auto;
    padding: 0 20px;
}

.recommend-ttl {
    text-align: center;
    margin-bottom: 28px;
}

#sec-hagi .recommend-ttl {
    /* margin-bottom: 40px; */
}

.recommend-ttl img {
    width: 100%
}

.recommend-container {
    background: #fff;
    border: 1px solid #000;
    border-top: none;
    width: auto;
    margin: 0 auto 15px;
    position: relative;
}

#rec04.recommend-container {
    margin-bottom: 0px;
}

#sec-tsuwano .recommend-container {
    margin-bottom: 10px;
}

.rec-ttl {
    text-align: center;
    font-size: 17px;
    line-height: 1.5;
    position: relative;
    top: 0;
    padding: 12px 10px 0;
}

.rec-ttl span {
    font-size: 29px;
    display: block;
    position: relative;
    padding: 8px 0 14px;
}

.rec-ttl span:after {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 20%;
    height: 2px;
    background: #000;
    transform: translateX(-50%);
}

.rec-nav {
    margin-top: 40px;
    margin-bottom: 97px;
    font-family: 'Noto Serif JP', serif;
    display: none;
}

.rec-nav-list {
    width: 100%;
    /* height: 70px; */
    display: flex;
    justify-content: space-around;
    align-items: center;
    /* text-align: center; */
    margin: 0 auto;
    text-align: center;
    border-right: 1px solid #000;
}

.rec-nav-item {
    border-left: 1px solid #000;
    width: 100%;
    height: 70px;
    position: relative;
    /* display: flex; */
    /* align-items: center; */
}

.rec-nav-item a:after {
    content: '';
    display: block;
    width: 100px;
    height: 4px;
    background: #000;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.rec-nav-item a {
    display: block;
    width: 100%;
    height: 70px;
    font-size: 18px;
    font-weight: bold;
    opacity: 1;
    text-decoration: none !important;
    transition: all 0.5s ease;
}

.rec-nav-item a:hover {
    /*     opacity: 0.8; */
}

.rec-nav-item a:hover:after {
    animation: rec-nav-action 0.5s ease-in-out 0s;
}

@keyframes rec-nav-action {
    from {
        width: 0px;
        height: 1px;
        opacity: 0;
    }

    to {
        width: 100px;
        height: 4px;
        opacity: 1;
    }
}

.recommend-top img {
    width: 100%;
    vertical-align: bottom;
}

.rec-nav-item a span {
    display: block;
    padding: 5px 0 17px;
    font-size: 12px;
}

.recommend .media-wrap {
    padding-bottom: 0;
}

/* .recommend .media-wrap:after {
    content: '';
    display: block;
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/arrow-down.png) no-repeat;
    background-size: 100%;
    width: 26px;
    height: 18px;
    margin: 10px auto 42px;
} */

.recommend .media {
    margin-top: 10px;
    margin-bottom: 20px;
    padding: 0 5px;
}

.recommend .media img {
    width: 100%;
}

.recommend .media-text-block {
    padding: 15px 5px 0px;
}

.recommend .media-ttl {
    margin-bottom: 7px;
}

.recommend #rec03 .media-ttl {
    padding-left: 0px;
}

.recommend .media-lead {
    margin-bottom: 32px;
}

.recommend .media-lead p {
    line-height: 1.4;
    margin-bottom: 13px;
    letter-spacing: 0.02em;
    display: flex;
}

.recommend .media-lead p span {
    padding-right: 0.5em;
}

.rec-pointback {
    text-align: center;
    padding: 0 4%;
}

.rec-pointback img.pc {
    display: none;
}

.rec-pointback img.sp {
    display: inline-block;
    width: 100%;
}

.rec-link-list {
    width: 100%;
    padding: 0 10px;
    margin: 27px 0 16px;
}

.rec-link-item {
    width: 100%;
    margin-top: 20px;
}

.rec-link-item a {
    background: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/bg-rec-border.png);
    background-size: 4%;
    border-radius: 10px;
    box-shadow: 1px 1px 10px #828282;
    display: block;
    padding: 3px 37px 3px 3px;
    padding: 3px 15% 3px 3px;
    transition: all 0.3s ease;
    opacity: 1;
}

.rec-link-item-in {
    position: relative;
    border-radius: 10px 0 0 10px;
    background: #fff;
    display: inline-block;
    padding: 10px 10px;
    line-height: 1.4;
    width: 100%;
}

.rec-link-text-upper {
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 15px;
    border-bottom: 1px solid #000;
    line-height: 1.4;
    position: relative;
    z-index: 1;
    height: auto !important;
    box-sizing: content-box;
}

.rec-link-text-lower {
    font-size: 13px;
    padding-top: 5px;
    line-height: 1.5;
}

.rec-link-text-lower em {
    color: #b11b1a;
    font-weight: bold;
    letter-spacing: 0.01em;
}

.rec-link-text-lower em span {
    font-size: 14px;
    /* font-weight: normal; */
}

.rec-link-text-lower .rec-price em {
    font-size: 24px;
    display: block;
}

.rec-link-text-lower .rec-point {
    margin-top: 3px;
}

.rec-link-text-lower .rec-point em {
    font-size: 18px;
    padding-right: 0px;
}


.rec-point-text {
    font-size: 13px;
    color: #b11b1a;
    font-weight: bold;
}

span.rec-grant-text {
    margin-left: -0.5em;
}


@media screen and (max-width: 374px) {
    .rec-grant-text {
        text-align: right;
        display: block;
    }
}



.rec-link-text-lower .rec-link-price-point {
    font-size: 24px;
    font-weight: bold;
    padding-right: 5px;
    display: inline-block;
}

.rec-link-text-underline {
    display: inline;
    background: linear-gradient(rgba(255, 255, 255, 0), 40%, #e0e22e 40%);
    padding: 0 5px;
}

.rec-link-item-in {
}

.rec-link-item-in::before {
    position: absolute;
    content: '';
    width: 12px;
    height: 12px;
    border-top: solid 4px #000;
    border-right: solid 4px #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 50%;
    right: -11%;
    margin-top: -3px;
}

/*--------------------------------------------

 sec-aboutdeal

 --------------------------------------------*/
#sec-aboutdeal {padding: 10px 20px;}

#sec-aboutdeal .container {
    /* width: 900px; */
    margin: 0 auto;
    margin-top: 15px;
}

#sec-aboutdeal .ttl-text {
    text-align: center;
}
#sec-aboutdeal .ttl-text img {
    width: 100%;
}

#sec-aboutdeal .ttl-img {
    text-align: left;
    font-size: 18px;
    text-align: left;
    margin: 20px 0 10px;
}

.howto {
    /* display: flex; */
    margin: 0 auto 10px;
    justify-content: center;
    align-items: center;
}

.howto li {
    /* display: table; */
    padding: 7px 0;
    position:relative;
}
.howto li > img {
    width: 100%;
}

.howto li span img {
    display: none;
}

.howto li span {
    /* padding: 0 30px; */
}

.howto li span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-top: -3px;
    border-top: 4px solid #333;
    border-right: 4px solid #333;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    content: "";
    font-size: 0;
    margin-left: -11px;
}

.howto li:last-child {
    margin-right: 0;
}

.superdeal {
    font-weight: bold;
    color: #000;
    font-size: 14px;
    line-height: 1.6;
    padding-bottom: 10px;
}

.superdeal span {
    color: #cc1e06;
}

.atn {
    font-size: 13px;
    line-height: 1.8;
    overflow: hidden;
    /* max-width: 74%; */
    margin: 0 auto;
}

.atn dt {
    margin-top: 15px;
    color: #bf0000;
    font-size: 13px;
    font-weight: bold;
}

.atn span {
    display: block;
    color: #60813a;
    font-weight: bold;
}

.atn .mt0 {
    margin-top: 0;
}

/*--------------------------------------------

 btn-pagetop

 --------------------------------------------*/
.btn-pagetop.pc {
    display: none;
}
.btn-pagetop.sp {
    display: inline-block;
    z-index: 9999;
    position: fixed;
    bottom: 0;
    right: 0px;
    width: 60px;
    height: 60px;
    opacity: 0;
    transform: translate(100%, 0);
    transition: all 0.5s ease;
    background: #17264c;
    box-shadow: 1px -1px 10px #717171;
    text-indent: -9999px;
}

.btn-pagetop a {
    display: block;
}

.btn-pagetop a:before {
    position: absolute;
    content: '';
    display: block;
    width: 16px;
    height: 1px;
    background: #fff;
    top: 38%;
    left: 50%;
    margin-left: -8px;
}

.btn-pagetop a:after {
    position: absolute;
    content: '';
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}

.btn-pagetop.sp.is-show {
    opacity: 1;
    transform: translate(0, 0);
}
.btn-pagetop.sp img {
    width: 100%;
}


/*--------------------------------------------

swiper

 --------------------------------------------*/
.swiper-container {
  width: auto;
  margin: 0 !important;
  padding-bottom: 35px;
}

.swiper-button-prev,
.swiper-button-next {
  width: 30px;
  height: 40px;
  -webkit-background-size: 100%;
  background-size: 80%;
  margin-top: -35px;
}

.swiper-button-prev {
  background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/swiper-arrow-left.png) !important;
  left: 5px;
}

.swiper-button-next {
  background-image: url(https://img.travel.rakuten.co.jp/select/matsuo/201901/images/swiper-arrow-right.png) !important;
  right: 5px;
}

.swiper-pagination-bullet-active {
  background: #757575;
}

img[width="1"] {
    display: none;
}

/* スマホ用Serviceinfo */
h2 img {
    width: 100%;
}



/*#keyVisual {
    z-index: 6;
    background: #fff;
    padding: 0 10px 5px;
    margin: 0;
}*/
#keyVisual {
    width: 100%;
    background-color: #fff;
    overflow: hidden;
    margin-bottom: 0;
 z-index: 99999;
}

#sevInfo,
#contentsArea .surveyArea{
    z-index: 99;
    position: relative;
    background: #fff;
    padding: 0;
    overflow: hidden;
    margin-top: -2px !important;
}


/*============================
#menu-sp
============================*/
#menu-sp {display: block;position: fixed;width: 100%;bottom: 0;z-index: 999;background: #fffaf7;box-sizing: border-box;}
#menu-sp .main-acc {display: none;padding: 15px 10px 1em;position: absolute;bottom: 47px;width: 100%;background: rgba(255, 251, 249, 0.9);box-sizing: border-box;}
#menu-sp .menu-arrow {display: inline-block;width: 10px;height: 10px;border-top: solid 3px #333;border-right: solid 3px #333;border-radius: 1px;-webkit-transform: rotateX(0deg) rotate(-45deg);transform: rotateX(0deg) rotate(-45deg);position: relative;top: 1px;left: 7px;transition: 0.4s;}
#menu-sp .is-show .menu-arrow {top: -3px;-webkit-transform: rotateX(-180deg) rotate(-45deg);transform: rotateX(-180deg) rotate(-45deg);}
#menu-sp .ico-close {position: absolute;width: 22px;height: 22px;display: block;top: 8px;right: 8px;cursor: pointer;}
#menu-sp .ico-close:before, #menu-sp span.ico-close:after {content: '';width: 22px;height: 2px;display: block;background: #616161;position: absolute;top: 50%;}
#menu-sp .ico-close:before {transform: rotate(-45deg);}
#menu-sp .ico-close:after {transform: rotate(45deg);}
#menu-sp ul li a {font-size: 1em;font-weight: bold;letter-spacing: 0.05em;}
#menu-sp .menu-list1 li {text-align: center;}
/* 2 column */
#menu-sp .menu-list1.col2 {display: flex;flex-wrap: wrap;justify-content: space-between;padding-top: 12px;}
#menu-sp .menu-list1.col2 li {width: 48%;}
#menu-sp .menu-list1 li a {padding: 0.6em 0;display: inline-block;border-bottom: 1px solid #989898;width: 100%;box-sizing: border-box;}
#menu-sp .menu-list1 li a span {display: block;font-size: 12px;}
#menu-sp .menu-list2 li {text-align: center;}
#menu-sp .menu-list2 li a {padding: 0.7em 0 0;display: inline-block;width: 100%;}
#menu-sp .menu-list2 .ico-info a span {position: relative;}
#menu-sp .menu-list2 .ico-info a span:before {content: '';width: 22px;height: 22px;display: inline-block;position: absolute;top: 2px;left: -26px;background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/ico_info.png) no-repeat left center;background-size: 22px;}
#menu-sp p.btn-acc {font-size: 1em;font-weight: bold;color: #333;text-align: center;text-shadow: 1px 1px 1px #b1b1b1;letter-spacing: 0.05em;width: 100%;height: 47px;line-height: 47px;cursor: pointer;background: #eae9df;}

.gnav-item:nth-child(1) img {width: 40%;margin-left: -44px;}
.gnav-item:nth-child(2) img {width: 40%;margin-left: -37px;}
.gnav-item:nth-child(3) img {width: 50%;}



/* 20210107 gyy */
/* ----- linkbnr -----*/
ul.leftbnr { text-align: center; margin: 15px; }

ul.leftbnr li { margin-bottom: 10px; }

ul.leftbnr li img { width: 100%; max-width: 200px; }

#contents .superSale a { color: #aabfa7; }

.superSale { font-weight: normal; font-size: 15px; display: none;}
.dropup-menu .navimds.superSale{ display:block;}

nav.arealist li.superSale { padding-left: 0; }

nav.arealist li.superSale a { padding-left: 0; padding-right: 0; background: none; }

nav.arealist li.superSale a:hover { background: #eee; }

nav.arealist li.allarea { border-top: none; }

nav.arealist li.allarea a { position: relative; display: block; }

nav.arealist li.allarea a.noken { background-image: none; }

nav.arealist li.allarea a.open { background-image: url(https://img.travel.rakuten.co.jp/superdeal/images/base/arrow1down.gif); }

.area13 { line-height: 1.5; }

.area13 > ul { display: none; }

.area13 > .isShow { display: block; }

/* btm_nav */
.btmNav { position: fixed;z-index: 9999;bottom: 0;width: 100%; background-color:#aabfa7;}
@media screen and (min-width:0px) and (max-width:240px) { 
.btmNav{ width:240px;}
}

.btmNav .dropup-menu { 
    display: none; 
    /* box-shadow: 0px 3px 15px #999;  */
    position: absolute;
    bottom: 100%;
    width: 100%;
    border: 1px solid #aabfa7;
    background-color:
    #fff;
    z-index: 9999; }

.btmNav .dropup-menu a { position: relative; }



.btmNav .dropup-menu li { text-align: center; margin: auto; padding: 0; }

.btmNav .dropup-menu li:first-child { text-align: center; }

.btmNav .dropup-menu li:first-child img { width: 5%; }

.btmNav .dropup-menu.areachos { padding-bottom: 5px; }

.btmNav .dropup-menu.areachos li { padding: 5px 0; }

.btmNav .dropup-menu.areachos li select { border-radius: 4px; padding: 10px; background-color: #f7f7f4; font-size: .9em; }

.btmNav .dropup-menu.areachos li.remindMsg { padding: 0; }

.btmNav .dropup-menu:last-of-type .close { padding: 8px 0; }

.btmNav .dropup-menu:last-of-type .close strong { padding: 3px 0 3px 29px; background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/icon_search.png) 0 -1px/18px auto no-repeat; }

.btmNav .dropup-menu .close { position: relative; font-weight: bold; background-color: #f1f1f1; color: #aabfa7; cursor: pointer; }

.btmNav .dropup-menu a, .btmNav .dropup-menu .close { display: block; padding: 10px 0; font-size: 15px; }
.btmNav .dropup-menu span strong{display: block; padding-right: 25px; white-space: nowrap;}
.btmNav .dropup-menu a em, .btmNav .dropup-menu .close em { position: absolute; right: 5px; top: 5px; width: 20px; height: 20px; background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/close.gif) 0 0/100% 100%; }

.btmNav a.invoice:before { content: ''; background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/ico_info.png) center; display: block; position: absolute; 
 width:16px; height:16px; left: calc( 50% - 60px); top: 14px; background-size: 100%; }

.btmNav .column2 a { float: left; width: 48%; box-sizing: border-box; background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/arrow1right.gif) -5px -5px no-repeat; position: relative; }

.btmNav .column2 a.invoice:before { top: 5px; }

.btmNav .column2 a.wid98 { width: 98%; }

.btmNav:after { content: ""; display: block; clear: both; }

.btmNav .isShow { display: block; }

.btmNav span.nv { float: left; display: block; max-width:24.9%; width:24.9%; padding:0; box-sizing: border-box; background-color: #aabfa7; text-align: center; color: #fff; cursor: pointer; font-size: 12px; margin:0;
min-height:67px; border-right: 1px solid #fff;}
.btmNav span.nv.moreIco{ margin-right: 0;}
.btmNav span.nv a{ color:#fff!important; display: block; padding: 0; margin: 0;}
.btmNav span.nv  img{ display: block; margin: 5px auto;}

.btmNav.sp .btn {
    float: left;
    /* width: 100%; */
    padding: 0;
    box-sizing: border-box;
    background-color: #aabfa7;
font-weight: normal;
text-align: center;
color:
    #fff;
    cursor: pointer;
    font-size: 12px;
}

@media screen and (max-width:330px) {
.btmNav span.nv {font-size: 11px;}
}
.btmNav span.nv a,.btmNav span.nv span{ display: block; padding: 0; line-height: 1.2;}
.btmNav .btn em { display: inline-block; transform: rotate(0deg); transition: .3s; }

.btmNav .btn:first-child { border-right: 1px solid #f0f0f0; }

.btmNav .btn.btn2 { width: calc( (100% - 1px) / 2); }

.btmNav .btn.btn3 { width: 33.33%; }

.btmNav .unchose { background-color: #333; }

.btmNav .chose { background-color: #aabfa7; }

.btmNav .chose em { transform: rotate(180deg); }




#schPCSP{position: relative; bottom:0;width:92%; margin-left:auto;margin-right:auto;
    background-color:#fff;z-index:10;box-shadow:none; 
    left:0; display:block!important;}
#schPCSP .close { position: relative; text-align:center; font-weight:  bold;cursor: pointer; padding: 8px 0; width: 100%; display: block;color:#FFFFFF; background:#aabfa7;}
#schPCSP .close em {

    position: absolute;
    right: 5px;
    top: 5px;
    width: 20px;
    height: 20px;
    background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/close.gif) 0 0/100% 100%;

}
#schPCSP .close em {display:none;}
#schPCSP .close:after{ content:"+";color:#FFFFFF;position:absolute; border:1px solid #fff; padding:1px 5px 2px 5px; font-size:12px;top:5px; right:5px;}
#schPCSP .close.open:after{content:"-";}


#search-box{ position:relative;border: 0; margin: 0; text-align: left; border: 1px solid#aabfa7; border-radius: 0px;}

#search-box #search-box-title, #search-box .searchCategory { display: none; }

#search-box .remindMsg { text-align: center; }

#search-box #search-box-body { display: block; }

#search-box #search-box-body #domestic-search-box { padding: 0; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl { display: block; width: 96%; margin: auto; overflow: hidden; }


#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dt { padding-right: 20px; padding-top: 5px; display: block; overflow: hidden; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd { margin-bottom: 0; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd select, #search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd input, #search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd a#dh-child-popup { margin-bottom: 4px; border: 1px solid #747474; background-color: #f7f7f4; border-radius: 6px;font-size:16px!important;}


#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.heyasu select { width: 85%; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.number select { width:62px;font-size: 16px !important; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.number ul li { width: 48%; max-width: none; white-space: nowrap; text-align: left; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.number ul li a { width: 46%; display: inline-block; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.number ul li.adult { float: left; margin-top: 2px; padding-top: 0; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.number ul li.child { float: right; margin-top: 0; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.area select { font-size:16px!important; }

#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd.prcBox select { width: 65%;font-size:16px!important;}
.sltBox td{font-size:14px!important;}
.sltBox table select{font-size:16px!important;}
#search-box p.searchSubmit { display: block; overflow: hidden; width: 160px; margin:0 auto 2px auto; }

#search-box p.searchSubmit a { border-radius: 100px; border: 0; padding:6px 0; width: 160px; margin:2px auto 8px auto; font-size: 100%;}
#search-box .inputDate,#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd select{ font-size: 13px;}
#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl.structure.structure2.lft{ width: 46%; float: left; margin-left: 2%;}
.hasDatepicker{ padding: 1px 3px;}
#search-box #search-box-body #domestic-search-box #searchSwitchArea1 dl dd select{ height: 30px;border-radius:4px;font-size: 16px!important;}
#search-box .number ul li.child a{ line-height: 1.2;}
body .childBox.popup-contents { z-index:999 !important; }

#search-box #search-box-body dl.structure label{ font-size: 14px;}
@media screen and (max-width:330px) {
#search-box #search-box-body dl.structure label{ font-size: 12px;}
}
#ui-datepicker-div{z-index:9999999999999999999!important; }


.jdsAlwaysFix2.end { display: none !important; }

.rt-footer { z-index: 1 !important; }

.mt10{ margin-top:10px !important;}
#ss_special{ display:none;}
#ss_the_sale{ display:none;}
.ebnr{ display:none;}
.ss1bnr{ display:none;}
.ss2bnr { display: none;}

.arealist.kenlist{ bottom: 1px!important; width: 100%; z-index: 999;}
#showMsg{ display: none!important;}
#search-box #f_chu{ margin-top: 5px; display:inline;}

#sevInfo h2{width: 100%!important;}

.btmNav .dropup-menu li.dealTop{ width:184px; float:none; margin-left: auto; margin-right: auto; clear: both;}
.btmNav .dropup-menu li.dealTop a{ float:none; width: 100%; margin:2px 0;background: url(https://img.travel.rakuten.co.jp/superdeal/images/base/arrow1right.gif) -5px -7px no-repeat;}
.btn.btn-default.moreIco.nv{
    border:none;
}

#contents {
    padding: 0;
    background: #fff;
    box-shadow: inset 0px 15px 10px -15px #999;
}
.columleft{padding: 10px 0 10px; position: relative; background: #fff; z-index: 10;}
.btmNav span.noBdr{border: none;}
.hero > img{display: block; width: 100%;}

.columright{position: relative; z-index: 1;}