@charset 'UTF-8';

/* ----------------------------------------------------------------

  Custom Properties

----------------------------------------------------------------- */
:root{
--color-gray:#777;
--color-red:#e93939;
--link-color:#004c9a;
}



/* ----------------------------------------------------------------

  Default Setting

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Default Form
----------------------------------------------------------------- */
/* Default Form Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* form parts
----------------------------------------------- */
input[type='text'],
input[type='search'],
input[type='tel'],
input[type='url'],
input[type='email'],
textarea{
padding:5px;
border:1px solid #999;
border-radius:4px;
display:block;
width:100%;
min-height:38px;
font-size:16px;
box-sizing:border-box;
-webkit-appearance:none;
appearance:none;
font-size:16px;
}

input::-webkit-input-placeholder,
input::-webkit-input-placeholder{
font-size:12px;
}

input::-webkit-input-placeholder,
input::placeholder{
font-size:12px;
}

/* checkbox
----------------------------------------------- */
input[type='checkbox']{
margin:0;
padding:0;
border:none;
border-radius:0;
width:20px;
height:20px;
-webkit-appearance:none;
appearance:none;
display:inline-block;
vertical-align:baseline;
background:url(/element_sp/shared/images/icon/icon-form-checkbox.svg) 0 0 no-repeat;
background-size:100%;
}
input[type='checkbox']:checked{
background-image:url(/element_sp/shared/images/icon/icon-form-checkbox-on.svg);
}
input[type='checkbox']:disabled{
background-image:url(/element_sp/shared/images/icon/icon-form-checkbox-disabled.svg);
opacity:1;
}

/* radio
----------------------------------------------- */
input[type='radio']{
margin:0;
padding:0;
border:none;
border-radius:0;
width:20px;
height:20px;
-webkit-appearance:none;
appearance:none;
display:inline-block;
vertical-align:baseline;
background:url(/element_sp/shared/images/icon/icon-form-radio.svg) 0 0 no-repeat;
background-size:100%;
}
input[type='radio']:checked{
background-image:url(/element_sp/shared/images/icon/icon-form-radio-on.svg);
}
input[type='radio']:disabled{
background-image:url(/element_sp/shared/images/icon/icon-form-radio-disabled.svg);
opacity:1;
}
}



/* ----------------------------------------------------------------

  Site Common Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Loading
----------------------------------------------------------------- */
/* Loading Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-ranking .cmn-loading-spinner,
.spot-season .cmn-loading-spinner{
margin:32px auto;
}
}




/* ----------------------------------------------------------------

  Layout Base

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot
----------------------------------------------------------------- */
.spot{
margin:0 auto;
max-width:730px;
}

.spot strong{
color:var(--color-red);
font-weight:normal;
}

.spot a[target=_blank]{
text-decoration:none;
}


/* ----------------------------------------------------------------
  .spot-detail
----------------------------------------------------------------- */
/* Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail{
margin:0 -10px -20px;
padding:0 10px;
overflow:hidden;
background-color:#f5f5f5;
}
}


/* ----------------------------------------------------------------
  .spot-info-bg
----------------------------------------------------------------- */
/* Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-info-bg{
margin:-10px -10px 0;
padding:0 10px;
overflow:hidden;
background:#2a2a2a url(/element_sp/shared/images/frame/bg-secondary.jpg) repeat 0 0;
background-size:100% auto;
}
}




/* ----------------------------------------------------------------

  Spot Common Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Icon
----------------------------------------------------------------- */
/* .icon-blank
----------------------------------------------------------------- */
.icon-blank{
margin-left:2px;
padding-top:10px;
overflow:hidden;
display:inline-block;
width:10px;
height:0;
position:relative;
top:1px;
background:url(/element/shared/images/icon/icon-external.svg) 0 0 no-repeat;
}

/* .icon-sns-insta
----------------------------------------------------------------- */
.icon-sns-insta{
margin:0;
padding:0;
border:none;
color:rgba(0,0,0,0);
display:inline-block;
width:18px;
height:18px;
background:url(/element/spot/shared/images/icon-instagram.svg) no-repeat 0 0;
}

.spot-ranking-item-col .icon-sns-insta{
display:none;
position:absolute;
top:0;
right:0;
}

/* Icon Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-ranking-item-col .icon-sns-insta{
display:block;
}
}


/* ----------------------------------------------------------------
  link
----------------------------------------------------------------- */
/* .link-dashed
----------------------------------------------------------------- */
.link-dashed{
--link-dashed-grad:linear-gradient(90deg, var(--link-dashed-color), var(--link-dashed-color) 50%, transparent 50%, transparent 100%) repeat-x 0 100%;
--link-dashed-color:#949494;
--link-dashed-size:6px 1px;
--link-dashed-font-color:var(--cmn-font-color-base);
color:var(--link-dashed-font-color) !important;
background:var(--link-dashed-grad);
background-size:var(--link-dashed-size);
text-decoration:none !important;
}



/* ----------------------------------------------------------------
  Notice
----------------------------------------------------------------- */
/* .notice-list
----------------------------------------------------------------- */
.notice-list{
margin-top:12px;
color:var(--color-gray);
font-size:12px;
}

.notice-list > li{
display:-webkit-box;
display:flex;
}

.notice-list > li > span{
margin-right:8px;
}

.notice-list > li > div{
-webkit-box-flex:1;
flex:1;
}

.notice-list > li:not(;:first-child){
margin-top:12px;
}


/* ----------------------------------------------------------------
  Pager PC View
----------------------------------------------------------------- */
/* .pager-pc
----------------------------------------------------------------- */
.pager-pc{
margin-top:20px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
font-size:12px;
}

/* .pager-pc-num
----------------------------------------------------------------- */
.pager-pc-num{
margin-right:8px;
-webkit-box-flex:1;
flex:1;
}

/* .pager-pc-num
----------------------------------------------------------------- */
.pager-pc-nav-list,
.pager-pc-nav-list ul{
margin:0;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.pager-pc-nav-list li:not(:last-child){
margin-right:4px;
}

.pager-pc-nav-list a,
.pager-pc-nav-list em{
padding:4px 4px 0;
border:1px solid #ddd;
color:#555;
line-height:1;
box-sizing:border-box;
display:-webkit-box;
display:flex;
-webkit-box-pack:center;
justify-content:center;
min-width:23px;
height:23px;
overflow:hidden;
background-color:#fff;
text-decoration:none;
font-size:14px;
}

.pager-pc-nav-list em{
color:var(--cmn-font-color-base);
border-color:transparent;
background-color:transparent;
font-weight:bold;
}

.pager-pc-nav-list > li:not(:last-child){
margin-right:5px;
}

.pager-pc-nav-list > li > a{
padding-top:5px;
min-width:43px;
font-size:12px;
}

.pager-pc-nav-list .ellipsis{
margin-left:-2px;
padding-left:16px;
position:relative;
}

.pager-pc-nav-list .ellipsis::before{
content:'...';
display:block;
position:absolute;
left:0;
bottom:0;
}

/* .pager-pc Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.pager-pc{
display:none;
}
}


/* ----------------------------------------------------------------
  Pager SP View
----------------------------------------------------------------- */
/* .pager-sp
----------------------------------------------------------------- */
.pager-sp{
margin:16px 0;
line-height:42px;
font-size:14px;
display:none;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.pager-sp a{
color:var(--cmn-font-color-base);
display:block;
border-radius:50%;
width:42px;
height:42px;
box-sizing:border-box;
text-align:center;
overflow:hidden;
text-decoration:none;
}

.pager-sp a:not([href]){
visibility:hidden;
}

.pager-sp .pager-sp-prev a,
.pager-sp .pager-sp-next a{
color:rgba(0,0,0,0);
width:30px;
background:url(/element/shared/images/icon/icon-chevron-left.svg) no-repeat 50% 50%;
background-size:10px auto;
}

.pager-sp .pager-sp-next a{
transform:rotate(180deg);
}

/* .pager-sp-list
----------------------------------------------------------------- */
.pager-sp .pager-sp-list{
margin:0;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.pager-sp .pager-sp-list > li{
margin:0 2px;
}

.pager-sp .pager-sp-list .pager-sp-active > a{
border:1px solid #bbb;
background-color:#fff;
}

.pager-sp .pager-sp-list .pager-sp-ellipsis{
padding-right:1em;
position:relative;
}

.pager-sp .pager-sp-list .pager-sp-ellipsis::after{
content:'...';
display:block;
overflow:hidden;
position:absolute;
top:0;
right:0;
}

/* .pager-sp Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.pager-sp{
display:-webkit-box;
display:flex;
}
}


/* ----------------------------------------------------------------
  Error
----------------------------------------------------------------- */
/* .error
----------------------------------------------------------------- */
.error{
margin:20px 0;
text-align:center;
}

.error strong{
color:var(--cmn-font-color-base);
font-size:16px;
font-weight:bold;
}


/* .eoor Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.error{
margin-top:34px;
font-size:14px;
}

.error strong{
font-size:14px;
font-weight:normal;
}
}

/* ----------------------------------------------------------------

  Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-header
----------------------------------------------------------------- */
/* .spot-header
----------------------------------------------------------------- */
.spot-header{
margin-bottom:28px;
font-size:12px;
}

/* .spot-header-kv
----------------------------------------------------------------- */
.spot-header-kv{
margin-bottom:12px;
padding-top:calc(calc(365 / 730) * 100%);
height:0;
position:relative;
}

.spot-header-kv img{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
}

/* .spot-header-kv-hdg
----------------------------------------------------------------- */
.spot-header-kv-hdg{
padding:20px;
box-sizing:border-box;
color:#fff;
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
text-shadow:0 2px 4px #000;
font-size:32px;
font-weight:bold;
z-index:1;
}

.spot-header-kv-hdg span{
display:inline-block;
}

/* .spot-header-kv-sup
----------------------------------------------------------------- */
.spot-header-kv-sup{
padding:4px 8px 5px;
box-sizing:border-box;
width:100%;
min-height:28px;
position:absolute;
bottom:0;
left:0;
z-index:1;
background:linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
font-size:12px;
text-align:right;
}

main .spot-header-kv-sup a{
color:rgba(255,255,255,.7);
text-decoration:none;
}

/* .spot-header-toggle-hook
----------------------------------------------------------------- */
.spot-header-toggle-hook{
display:none;
}

.spot-header-toggle-hook button{
padding:0;
border:none;
color:var(--link-color);
display:inline-block;
background-color:transparent;
}

.spot-header-toggle-hook button::before {
margin:0 3px;
content: "...";
display:inline-block;
vertical-align:bottom
}

/* .spot-header-toggle-content
----------------------------------------------------------------- */
.spot-header-toggle-content p{
margin:0;
line-height:1.5;
}

/* .spot-header-toggle-close
----------------------------------------------------------------- */
.spot-header-toggle-close{
margin:4px 0 0 auto;
padding:0 0 0 12px;
border:none;
display:none;
background:url(/element/spot/shared/images/icon-arrow-down.svg) no-repeat 0 50%;
background-size:8px auto;
font-size:12px;
}

.spot-header-toggle.is-active .spot-header-toggle-close{
background-image:url(/element/spot/shared/images/icon-arrow-up.svg);
}

/* .spot-header Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-header
----------------------------------------------- */
.spot-header{
margin-bottom:12px;
}

/* .spot-header-kv
----------------------------------------------- */
.spot-header-kv{
margin:0 -10px 12px;
}

/* .spot-header-kv-hdg
----------------------------------------------- */
.spot-header-kv-hdg{
padding:10px;
-webkit-box-pack:center;
justify-content:center;
text-shadow:1px 1px 2px #000;
text-align:center;
font-size:24px;
font-weight:normal;
}

/* .spot-header-kv-sup
----------------------------------------------- */
.spot-header-kv-sup{
padding:4px 12px;
}

/* .spot-header-toggle-hook
----------------------------------------------- */
.spot-header-toggle-hook{
display:block;
}

.spot-header-toggle.is-active .spot-header-toggle-hook{
display:none;
}

/* .spot-header-toggle-content
----------------------------------------------- */
.spot-header-toggle-content{
display:none;
}

.spot-header-toggle.is-active .spot-header-toggle-content{
display:block;
}

/* .spot-header-toggle-close
----------------------------------------------- */
.spot-header-toggle-close{
display:block;
}
}


/* ----------------------------------------------------------------
  .spot-index
----------------------------------------------------------------- */
/* .spot-index
----------------------------------------------------------------- */
.spot-index{
margin-top:36px;
}

.spot-index > :first-child{
margin-top:0;
}

/* .spot-index-hdg
----------------------------------------------------------------- */
.spot-index-hdg{
margin:56px 0 8px;
font-size:16px;
}

/* .spot-index-filter
----------------------------------------------------------------- */
.spot-index-filter{
margin:12px 0 -8px;
padding:12px;
background-color:#f5f5f5;
}

.spot-index-filter button{
padding:0 12px;
border:1px solid #bebebe;
border-radius:4px;
color:#9e9e9e;
width:100%;
min-height:45px;
background:#fff url(/element/spot/shared/images/icon-arrow.svg) calc(100% - 8px) 50% no-repeat;
background-size:7px auto;
text-align:left;
font-size:14px;
}

/* .spot-index Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-index
----------------------------------------------- */
.spot-index{
margin:0 -10px -20px;
padding:16px 10px 20px;
position:relative;
background-color:#f5f5f5;
}

.spot-index::before{
content:'';
display:block;
width:100%;
height:4px;
overflow:hidden;
position:absolute;
top:0;
left:0;
background:linear-gradient(rgba(0,0,0,.15) 0%, rgba(0,0,0,0) 100%);
}

/* .spot-index-hdg
----------------------------------------------- */
.spot-index-hdg{
margin-top:32px;
font-size:16px;
font-weight:normal;
}

/* .spot-index-filter
----------------------------------------------- */
.spot-index-filter{
margin:0 0 20px;
padding:0;
}

.spot-index-filter button{
padding:0 8px;
min-height:37px;
}
}



/* ----------------------------------------------------------------
  .spot-tab
----------------------------------------------------------------- */
/* .spot-tab-list
----------------------------------------------------------------- */
.spot-tab-list{
margin-bottom:12px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.spot-tab-list > li{
padding:0 20px;
position:relative;
}

.spot-tab-list > li:first-child{
padding-left:0;
}

.spot-tab-list > li:not(:last-child)::before{
content:'';
display:block;
width:1px;
height:16px;
overflow:hidden;
position:absolute;
top:2px;
right:0;
background-color:#ccc;
}

.spot-tab-list button{
margin:0;
padding:0 0 8px;
border:none;
color:var(--color-gray);
height:30px;
line-height:1;
background-color:transparent;
font-size:14px;
}

.spot-tab-list button[aria-selected="true"]{
color:var(--cmn-font-color-base);
box-shadow:0 -2px 0 var(--cmn-font-color-base) inset;
}

/* .spot-tab-content
----------------------------------------------------------------- */
.spot-tab-content{
display:none;
}

.spot-tab-content.is-active{
display:block;
}

/* .spot-tab Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-tab-list
----------------------------------------------- */
.spot-tab-list{
margin:0 -10px;
padding:0 10px 8px;
overflow:hidden;
position:relative;
box-shadow:0 3px 3px rgba(0,0,0,.15);
}

.spot-tab-list > li{
padding:0 10px;
}

.spot-tab-list > li:not(:last-child)::before{
display:none;
}

.spot-tab-list button{
padding-top:6px;
color:var(--cmn-font-color-base);
}
}



/* ----------------------------------------------------------------

  Ranking Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-ranking
----------------------------------------------------------------- */
/* .spot-ranking
----------------------------------------------------------------- */
.spot-ranking{
padding:16px 12px;
background-color:#f5f5f5;
}

.spot-ranking > :last-child{
margin-bottom:0;
}

/* .spot-ranking-hdg
----------------------------------------------------------------- */
.spot-ranking-hdg{
margin-bottom:8px;
font-size:16px;
}


/* ----------------------------------------------------------------
  .spot-ranking-filter
----------------------------------------------------------------- */
/* .spot-ranking-filter-list
----------------------------------------------------------------- */
.spot-ranking-filter-list{
margin:0;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.spot-ranking-filter-list > li{
border:1px solid #bebebe;
border-radius:2px;
overflow:hidden;
-webkit-box-flex:1;
flex:1;
display:-webkit-box;
display:flex;
-webkit-box-align:stretch;
align-items:stretch;
}

.spot-ranking-filter-list > li:not(:last-child){
margin-right:8px;
}

.spot-ranking-filter-list button{
padding:0 8px;
border:none;
color:#9e9e9e;
width:100%;
-webkit-box-flex:1;
flex:1;
min-height:34px;
background:#fff url(/element/spot/shared/images/icon-arrow.svg) calc(100% - 8px) 50% no-repeat;
background-size:5px auto;
text-align:left;
font-size:12px;
}

.spot-ranking-filter-list .is-selected button{
color:var(--cmn-font-color-base);
background-image:none;
}

.spot-ranking-filter-list .is-selected .del{
padding:0;
color:rgba(0,0,0,0);
width:24px;
height:34px;
-webkit-box-flex:0;
flex:none;
overflow:hidden;
background:#fff url(/element/shared/images/icon/icon-reset-line.svg) calc(100% - 8px) 50% no-repeat;
background-size:7px auto;
text-indent:-999px;
}


/* ----------------------------------------------------------------
  .spot-ranking-item
----------------------------------------------------------------- */
/* .spot-ranking-item
----------------------------------------------------------------- */
.spot-ranking-item{
margin-top:12px;
padding:20px;
border-radius:6px;
box-shadow:0 0 3px rgba(0,0,0,.3);
background-color:#fff;
font-size:12px;
}

/* .spot-ranking-item-col
----------------------------------------------------------------- */
.spot-ranking-item-col{
position:relative;
display:grid;
grid-template-rows:auto auto;
grid-template-columns:200px 1fr;
column-gap:20px;
}

/* .spot-ranking-item-col-data
----------------------------------------------------------------- */
.spot-ranking-item-col-data{
grid-row:1/2;
grid-column:2/3;
}

/* .spot-ranking-item-col-data-hdg
----------------------------------------------------------------- */
.spot-ranking-item-col-data-hdg{
margin-bottom:8px;
font-size:16px;
}

.spot-ranking-item-col-data-hdg a{
text-decoration:none;
}

.spot-ranking-item-col-data-hdg .num{
color:#fff;
border-radius:6px;
box-sizing:border-box;
display:block;
min-width:42px;
position:absolute;
top:4px;
left:4px;
z-index:2;
background-color:rgba(0,0,0,.45);
line-height:28px;
text-shadow:0 1px 0 rgba(0,0,0,.5);
font-weight:normal;
font-size:14px;
text-align:center;
}

.spot-ranking-item-col-data-hdg .hidden{
height:0;
overflow:hidden;
position:absolute;
}

/* .spot-ranking-item-col-data-list
----------------------------------------------------------------- */
.spot-ranking-item-col-data-list{
margin-top:8px;
}

.spot-ranking-item-col-data-list > li{
margin-top:4px;
display:-webkit-box;
display:flex;
}

.spot-ranking-item-col-data-list > li > span{
width:5.25em;
position:relative;
}

.spot-ranking-item-col-data-list > li > span::after{
content:"\ff1a";
position:absolute;
top:0;
right:0;
}

.spot-ranking-item-col-data-list > li > div{
-webkit-box-flex:1;
flex:1;
}

/* .spot-ranking-item-col-detail
----------------------------------------------------------------- */
.spot-ranking-item-col-detail{
margin-top:8px;
grid-row:2/3;
grid-column:2/3;
}

.spot-ranking-item-col-detail p{
margin-top:0;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.5;
}

.spot-ranking-item-col-detail p > a{
color:var(--cmn-font-color-base);
text-decoration:none;
}

/* .spot-ranking-item-col-thumb
----------------------------------------------------------------- */
.spot-ranking-item-col-thumb{
height:150px;
grid-row:1/3;
grid-column:1/2;
position:relative;
}

.spot-ranking-item-col-thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-ranking-item-col-thumb img.guard{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
-webkit-touch-callout:none;
}

.spot-ranking-item-col-thumb.no-photo{
box-shadow:0 0 0 1px #e5e5e5 inset;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.spot-ranking-item-col-thumb.no-photo img{
width:100px;
height:100px;
}

/* .spot-ranking-item-optional
----------------------------------------------------------------- */
.spot-ranking-item-optional{
margin-top:20px;
display:grid;
grid-template-rows:auto auto;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}

/* .spot-seo > .spot-ranking-item-optional
----------------------------------------------- */
.spot-seo .spot-ranking-item-optional{
margin-top:36px;
}

/* .spot-ranking-item-optional-hdg
----------------------------------------------------------------- */
.spot-ranking-item-optional-hdg{
grid-row:1/2;
grid-column:1/2;
font-size:16px;
}

.spot-ranking-item .spot-ranking-item-optional-hdg{
font-size:14px;
}

/* .spot-ranking-item-optional-carousel
----------------------------------------------------------------- */
.spot-ranking-item-optional-carousel{
margin-top:8px;
position:relative;
grid-row:2/3;
grid-column:1/3;
font-size:12px;
}

/* .spot-seo > .spot-ranking-item-optional-carousel
----------------------------------------------- */
.spot-seo .spot-ranking-item-optional-carousel{
margin:0 -5px -5px;
}

/* .spot-ranking-item-optional-carousel-nav
----------------------------------------------------------------- */
.spot-ranking-item-optional-carousel-nav{
margin:0;
}

.spot-ranking-item-optional-carousel-nav > li{
position:absolute;
bottom:50%;
transform:translateY(50%);
z-index:2;
}

.spot-ranking-item-optional-carousel-nav > .next{
right:-16px;
}

.spot-ranking-item-optional-carousel-nav > .prev{
left:-16px;
}

.spot-ranking-item-optional-carousel-nav button{
border:1px solid #bbb;
border-radius:16px;
color:rgba(0,0,0,0);
width:32px;
height:32px;
overflow:hidden;
position:relative;
background-color:#fff;
}

.spot-ranking-item-optional-carousel-nav button::before{
content:'';
display:block;
width:7px;
height:12px;
overflow:hidden;
position:absolute;
bottom:50%;
right:50%;
transform:translate(50%, 50%);
background:url(/element/shared/images/icon/icon-chevron-left.svg) 50% 50% no-repeat;
}

.spot-ranking-item-optional-carousel-nav .next button::before{
transform:translate(50%, 50%) rotate(175deg);
}

.spot-ranking-item-optional-carousel-nav [aria-disabled="true"]{
display:none;
}

/* .spot-ranking-item-optional-carousel-list
----------------------------------------------------------------- */
.spot-ranking-item-optional-carousel-list{
overflow:hidden;
}

.spot-ranking-item-optional-carousel-list > ul{
margin:0;
display:-webkit-box;
display:flex;
-webkit-box-align:stretch;
align-items:stretch;
}

.spot-ranking-item-optional-carousel-list li{
border-radius:4px;
width:260px;
min-width:260px;
min-height:122px;
box-shadow:0 0 0 1px #ddd inset;
overflow:hidden;
}

.spot-ranking-item-optional-carousel-list li > a{
padding:1px;
display:block;
height:100%;
box-sizing:border-box;
position:relative;
text-decoration:none;
}

.spot-ranking-item-optional-carousel-list li > a > div:first-child{
padding:8px 8px 8px 94px;
display:-webkit-box;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
flex-direction:column;
min-height:100%;
box-sizing:border-box;
}

.spot-ranking-item-optional-carousel-list .data{
margin-bottom:4px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.5;
}

.spot-ranking-item-optional-carousel-list .price{
margin-top:auto;
color:var(--cmn-font-color-base);
text-align:right;
}

.spot-ranking-item-optional-carousel-list .price > span{
display:block;
}

.spot-ranking-item-optional-carousel-list .price > span:first-child{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}

.spot-ranking-item-optional-carousel-list .price > span:last-child{
font-size:11px;
}

.spot-ranking-item-optional-carousel-list .price b{
font-size:14px;
font-family:Arial;
}

.spot-ranking-item-optional-carousel-list .thumb{
margin-right:8px;
border-radius:4px 0 0 4px;
position: absolute;
top:1px;
left:1px;
width:85px;
height:calc(100% - 2px);
overflow:hidden;
}

.spot-ranking-item-optional-carousel-list .thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-ranking-item-optional-carousel-list .thumb.no-photo{
box-shadow:-1px 0 0 #e5e5e5 inset;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.spot-ranking-item-optional-carousel-list .thumb.no-photo img{
width:70px;
height:70px;
}

/* .spot-seo > .spot-ranking-item-optional-carousel-list
----------------------------------------------- */
.spot-seo .spot-ranking-item-optional-carousel-list{
padding:8px 5px 5px;
}

.spot-seo .spot-ranking-item-optional-carousel-list li{
overflow:visible;
box-shadow:none;
}

.spot-seo .spot-ranking-item-optional-carousel-list li > a{
padding:0;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.3);
background-color:#fff;
}

.spot-seo .spot-ranking-item-optional-carousel-list .thumb{
top:0;
left:0;
height:100%;
}

/* .spot-ranking-item-optional-more
----------------------------------------------------------------- */
.spot-ranking-item-optional-more{
grid-row:1/2;
grid-column:2/3;
text-align:right;
font-size:12px;
}


/* ----------------------------------------------------------------
  .spot-ranking Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:800px){

/* .sopt-seo .spot-ranking-item-optional-carousel
----------------------------------------------- */
.spot-seo .spot-ranking-item-optional-carousel{
margin-right:-10px;
}

/* .sopt-seo .spot-ranking-item-optional-carousel-nav
----------------------------------------------- */
.spot-seo .spot-ranking-item-optional-carousel-nav{
display:none;
}
}

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

/* .spot-ranking
----------------------------------------------- */
.spot-ranking{
margin:0 -10px;
padding:16px 8px;
min-height:300px;
}

/* .spot-ranking-hdg
----------------------------------------------- */
.spot-ranking-hdg{
font-weight:normal;
}

/* .spot-ranking-filter-list
----------------------------------------------- */
.spot-ranking-filter-list > li{
border-radius:4px;
}

.spot-ranking-filter-list button{
min-height:37px;
background-size:7px auto;
font-size:14px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.spot-ranking-filter-list .is-selected button{
background-size:9px auto;
}

.spot-ranking-filter-list .is-selected .del{
background-size:9px auto;
}

/* .spot-ranking-item
----------------------------------------------- */
.spot-ranking-item{
padding:12px;
}

/* .spot-ranking-item-col
----------------------------------------------- */
.spot-ranking-item-col{
grid-template-columns:108px 1fr;
column-gap:12px;
}

/* .spot-ranking-item-col-data
----------------------------------------------- */
.spot-ranking-item-col-data{
grid-row:1/2;
grid-column:2/3;
}

/* .spot-ranking-item-col-data-hdg
----------------------------------------------- */
.spot-ranking-item-col-data-hdg{
padding-right:20px;
font-weight:normal;
}

.spot-ranking-item-col-data-hdg .num{
top:-8px;
left:-8px;
min-width:36px;
line-height:20px;
font-size:12px;
}

/* .spot-ranking-item-col-detail
----------------------------------------------- */
.spot-ranking-item-col-detail{
grid-row:2/3;
grid-column:1/3;
}

.spot-ranking-item-col-detail p{
-webkit-line-clamp:3;
}

/* .spot-ranking-item-col-thumb
----------------------------------------------- */
.spot-ranking-item-col-thumb{
margin:-12px 0 0 -12px;
border-radius:6px 0;
height:90px;
grid-row:1/2;
grid-column:1/2;
overflow:hidden;
}

.spot-ranking-item-col-thumb.no-photo{
box-shadow:-1px -1px 0 #eee inset;
background-color:#fcfcfc;
}

.spot-ranking-item-col-thumb.no-photo img{
width:80px;
height:80px;
}

/* .spot-ranking-item-optional
----------------------------------------------- */
.spot-ranking-item-optional{
margin-top:12px;
grid-template-rows:auto auto auto;
}

/* .spot-ranking-item-optional-hdg
----------------------------------------------- */
.spot-ranking-item-optional-hdg{
grid-row:1/2;
grid-column:1/3;
font-weight:normal;
}

/* .spot-ranking-item-optional-carousel
----------------------------------------------- */
.spot-ranking-item-optional-carousel{
margin-right:-12px;
grid-row:2/3;
grid-column:1/3;
}

/* .spot-ranking-item-optional-carousel-nav
----------------------------------------------- */
.spot-ranking-item-optional-carousel-nav{
display:none;
}

/* .spot-ranking-item-optional-more
----------------------------------------------- */
.spot-ranking-item-optional-more{
margin-top:12px;
grid-row:3/4;
grid-column:1/3;
text-align:center;
font-size:14px;
}

.spot-ranking-item .spot-ranking-item-optional-more{
font-size:12px;
}

/* .spot-ranking-item-optional-carousel-list
----------------------------------------------- */
.spot-ranking-item-optional-carousel-list .price b{
font-size:18px;
}

.spot-ranking-item-optional-carousel-list .thumb.no-photo{
box-shadow:-1px 0 0 #eee inset;
background-color:#fcfcfc;
}
}



/* ----------------------------------------------------------------

  Season Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-season-hdg
----------------------------------------------------------------- */
.spot-season-hdg{
margin:20px 0 8px;
font-size:16px;
}


/* ----------------------------------------------------------------
  .spot-season-data
----------------------------------------------------------------- */
/* .spot-season-data
----------------------------------------------------------------- */
.spot-season-data{
padding:20px;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.4);
display:-webkit-box;
display:flex;
background-color:#fff;
}

/* .spot-detail-panel-content > .spot-season-data
-------------------------------------------- */
.spot-detail-panel-content .spot-season-data{
padding:0;
border-radius:0;
box-shadow:none;
}

/* .spot-season-data-hdg
----------------------------------------------------------------- */
.spot-season-data-hdg{
margin-bottom:12px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.spot-season-data-hdg h3{
-webkit-box-flex:1;
flex:1;
font-size:14px;
font-weight:normal;
}

/* .spot-season-data-hdg-note
----------------------------------------------------------------- */
.spot-season-data-hdg-note{
color:var(--color-gray);
font-size:11px;
}

.spot-season-data-hdg-note::before{
margin-right:4px;
content:'\203b';
display:inline-block;
}

/* .spot-season-data-temperature
----------------------------------------------------------------- */
.spot-season-data-temperature{
padding-right:20px;
border-right:1px solid #e5e5e5;
-webkit-box-flex:1;
flex:1;
}

/* .spot-season-data-clothes
----------------------------------------------------------------- */
.spot-season-data-clothes{
padding-left:20px;
-webkit-box-flex:1;
flex:1;
display:-webkit-box;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
flex-direction:column;
}

/* .spot-season-data-clothes-list
----------------------------------------------------------------- */
.spot-season-data-clothes-list{
margin:0;
display:-webkit-box;
display:flex;
font-size:11px;
}

.spot-season-data-clothes-list > li{
-webkit-box-flex:1;
flex:1;
text-align:center;
}

.spot-season-data-clothes-list [class^="level-"]{
margin-top:4px;
border-right:1px solid #e9e9e9;
color:rgba(0,0,0,0);
display:block;
height:37px;
overflow:hidden;
background-position:50% 50%;
background-repeat:no-repeat;
background-size:auto 22px;
}

.spot-season-data-clothes-list > li:first-child [class^="level-"]{
border-left:1px solid #e9e9e9;
}

.spot-season-data-clothes-list .level-1{
background-image:url(/element/spot/shared/images/icon-clothes-l1.svg);
background-size:auto 18px;
}
.spot-season-data-clothes-list .level-2{
background-image:url(/element/spot/shared/images/icon-clothes-l2.svg);
background-size:auto 18px;
}
.spot-season-data-clothes-list .level-3{
background-image:url(/element/spot/shared/images/icon-clothes-l3.svg);
background-size:auto 18px;
}
.spot-season-data-clothes-list .level-4{
background-image:url(/element/spot/shared/images/icon-clothes-l4.svg);
background-size:auto 18px;
}
.spot-season-data-clothes-list .level-1-2{
background-image:url(/element/spot/shared/images/icon-clothes-l1-l2.svg);
}
.spot-season-data-clothes-list .level-1-3{
background-image:url(/element/spot/shared/images/icon-clothes-l1-l3.svg);
}
.spot-season-data-clothes-list .level-1-4{
background-image:url(/element/spot/shared/images/icon-clothes-l1-l4.svg);
}
.spot-season-data-clothes-list .level-2-3{
background-image:url(/element/spot/shared/images/icon-clothes-l2-l3.svg);
}
.spot-season-data-clothes-list .level-2-4{
background-image:url(/element/spot/shared/images/icon-clothes-l2-l4.svg);
}
.spot-season-data-clothes-list .level-3-4{
background-image:url(/element/spot/shared/images/icon-clothes-l3-l4.svg);
}

/* .spot-season-data-clothes-definition
----------------------------------------------------------------- */
.spot-season-data-clothes-definition{
margin-top:8px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:end;
justify-content:flex-end;
font-size:11px;
}

.spot-season-data-clothes-definition p{
margin:0 -4px 0 0;
}

/* .spot-season-data-clothes-definition-list
----------------------------------------------------------------- */
.spot-season-data-clothes-definition-list{
margin:0;
display:-webkit-box;
display:flex;
}

.spot-season-data-clothes-definition-list [class^="level-"]{
margin-left:8px;
padding-left:16px;
background-position:0 40%;
background-repeat:no-repeat;
background-size:auto 13px;
}

.spot-season-data-clothes-definition-list .level-1{
background-image:url(/element/spot/shared/images/icon-clothes-l1.svg);
}
.spot-season-data-clothes-definition-list .level-2{
background-image:url(/element/spot/shared/images/icon-clothes-l2.svg);
}
.spot-season-data-clothes-definition-list .level-3{
background-image:url(/element/spot/shared/images/icon-clothes-l3.svg);
}
.spot-season-data-clothes-definition-list .level-4{
background-image:url(/element/spot/shared/images/icon-clothes-l4.svg);
}

/* .spot-season-data-clothes-more
----------------------------------------------------------------- */
.spot-season-data-clothes-more{
margin-top:auto;
text-align:right;
font-size:12px;
}

.spot-season-data-clothes-more a{
text-decoration:none;
}


/* ----------------------------------------------------------------
  Spot Season Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-season
----------------------------------------------- */
.spot-season{
margin:0 -10px;
padding:16px 8px;
min-height:300px;
background-color:#f5f5f5;
}

/* .spot-detail-panel-content > .spot-season
----------------------------- */
.spot-detail-panel-content .spot-season{
margin:0;
padding:0;
min-height:0;
background-color:transparent;
}

/* .spot-season-hdg
----------------------------------------------- */
.spot-season-hdg{
margin-top:0;
font-weight:normal;
}

/* .spot-season-data
----------------------------------------------- */
.spot-season-data{
padding:12px;
display:block;
}

/* .spot-season-data-hdg
----------------------------------------------- */
.spot-season-data-hdg{
margin-bottom:8px;
}

/* .spot-season-data-temperature
----------------------------------------------- */
.spot-season-data-temperature{
padding-right:0;
border:none;
}

.spot-season-data-temperature-image{
margin:0 auto;
width:fit-content;
}

/* .spot-season-data-clothes
----------------------------------------------- */
.spot-season-data-clothes{
margin-top:20px;
padding-left:0;
}

/* .spot-season-data-clothes-inner
----------------------------------------------- */
.spot-season-data-clothes-inner{
margin:0 auto;
max-width:325px;
}

/* .spot-season-data-clothes-definition
----------------------------------------------- */
.spot-season-data-clothes-definition{
margin:4px 0 0;
}

/* .spot-season-data-clothes-definition-list
----------------------------------------------- */
.spot-season-data-clothes-definition-list [class^="level-"]{
background-position:0 10%;
}

/* .spot-season-data-clothes-more
----------------------------------------------- */
.spot-season-data-clothes-more{
margin-top:16px;
}
}



/* ----------------------------------------------------------------

  Gourmet Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-gourmet
----------------------------------------------------------------- */
/* .spot-gourmet
----------------------------------------------------------------- */
.spot-gourmet{
padding:16px 12px;
background-color:#f5f5f5;
}

.spot-gourmet > :last-child{
margin-bottom:0;
}

/* .spot-gourmet-hdg
----------------------------------------------------------------- */
.spot-gourmet-hdg{
margin-bottom:8px;
font-size:16px;
}


/* ----------------------------------------------------------------
  .spot-gourmet-item
----------------------------------------------------------------- */
/* .spot-gourmet-item
----------------------------------------------------------------- */
.spot-gourmet-item{
margin-top:12px;
padding:20px;
border-radius:6px;
box-shadow:0 0 3px rgba(0,0,0,.3);
background-color:#fff;
font-size:12px;
}

.spot-gourmet-item a{
color:var(--cmn-font-color-base);
text-decoration:none;
}

/* .spot-gourmet-item-col
----------------------------------------------------------------- */
.spot-gourmet-item-col{
display:-webkit-box;
display:flex;
-webkit-box-align:stretch;
align-items:stretch;
flex-direction:row-reverse;
}

/* .spot-gourmet-item-col-detail
----------------------------------------------------------------- */
.spot-gourmet-item-col-detail{
-webkit-box-flex:1;
flex:1;
}

.spot-gourmet-item-col-detail p{
display:-webkit-box;
-webkit-line-clamp:5;
-webkit-box-orient:vertical;
overflow:hidden;
}

/* .spot-gourmet-item-col-hdg
----------------------------------------------------------------- */
.spot-gourmet-item-col-hdg{
margin-bottom:8px;
color:var(--link-color);
line-height:1.35;
font-size:16px;
}

.spot-gourmet-item-col-hdg a{
text-decoration:none;
}

/* .spot-gourmet-item-col-thumb
----------------------------------------------------------------- */
.spot-gourmet-item-col-thumb{
margin-right:20px;
width:200px;
height:150px;
}

.spot-gourmet-item-col-thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-gourmet-item-col-thumb.no-photo{
box-shadow:0 0 0 1px #e5e5e5 inset;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.spot-gourmet-item-col-thumb.no-photo img{
width:100px;
height:100px;
}


/* ----------------------------------------------------------------
  .spot-gourmet Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-gourmet
----------------------------------------------- */
.spot-gourmet{
margin:0 -10px;
padding:16px 8px;
min-height:300px;
}

/* .spot-gourmet-hdg
----------------------------------------------- */
.spot-gourmet-hdg{
font-weight:normal;
}

/* .spot-gourmet-item
----------------------------------------------- */
.spot-gourmet-item{
padding:0;
}

/* .spot-gourmet-item-col-detail
----------------------------------------------------------------- */
.spot-gourmet-item-col-detail{
padding:12px;
}

.spot-gourmet-item-col-detail p{
margin-top:8px;
-webkit-line-clamp:2;
}

/* .spot-gourmet-item-col-hdg
----------------------------------------------------------------- */
.spot-gourmet-item-col-hdg{
font-weight:normal;
font-size:14px;
}

/* ..spot-gourmet-item-col-thumb
----------------------------------------------- */
.spot-gourmet-item-col-thumb{
margin:0;
border-radius:6px 0 0 6px;
width:160px;
height:auto;
min-height:120px;
overflow:hidden;
}

.spot-gourmet-item-col-thumb.no-photo{
box-shadow:-1px -1px 0 #eee inset;
background-color:#fcfcfc;
}
}




/* ----------------------------------------------------------------

  Spot Detail Component Moduled

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-detail-header
----------------------------------------------------------------- */
.spot-detail-header{
margin-bottom:20px;
font-size:12px;
}

/* .spot-detail-header Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-header{
margin:0 -10px;
box-shadow:0 2px 4px rgba(0,0,0,.2);
background-color:#fff;
}
}


/* ----------------------------------------------------------------
  .spot-detail-header-carousel
----------------------------------------------------------------- */
.spot-detail-header-carousel{
--swiper-navigation-size:28px;
--swiper-theme-color: #fff;
position:relative;
overflow:hidden;
}

.spot-detail-header-carousel::before{
content:'';
display:block;
width:100%;
height:50px;
overflow:hidden;
position:absolute;
bottom:0;
left:0;
background:linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
}

.spot-detail-header-carousel ul{
margin:0;
}

/* .spot-detail-header-carousel-list
----------------------------------------------------------------- */
.spot-detail-header-carousel .spot-detail-header-carousel-list > li{
position:relative;
aspect-ratio:730 / 486;
}

.spot-detail-header-carousel .spot-detail-header-carousel-list > li img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-detail-header-carousel .spot-detail-header-carousel-list > li img.guard{
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
z-index:1;
-webkit-touch-callout:none;
}

/* .spot-detail-header-carousel-cap
----------------------------------------------------------------- */
.spot-detail-header-carousel .spot-detail-header-carousel-cap{
color:rgba(255,255,255,.6) !important;
display:block;
position:absolute;
left:10px;
bottom:8px;
width:85%;
line-height:1.42;
z-index:1;
font-size:11px;
text-decoration:none;
}

/* .spot-detail-header-carousel-prev / next
----------------------------------------------------------------- */
.spot-detail-header-carousel .spot-detail-header-carousel-prev,
.spot-detail-header-carousel .spot-detail-header-carousel-next{
margin:-28px 0 0;
filter:drop-shadow(#000 1px 1px 1px);
transform:translateZ(0);
}

/* .spot-detail-header-carousel-pagination
----------------------------------------------------------------- */
.spot-detail-header-carousel .spot-detail-header-carousel-pagination{
padding:1px 12px 3px;
border-radius:3px;
color:#fff;
display:block;
box-sizing:border-box;
width:auto;
height:24px;
position:absolute;
left:auto;
right:10px;
bottom:8px;
line-height:1.6;
background-color:rgba(0,0,0,.45);
font-size:14px;
font-family:Arial;
}



/* ----------------------------------------------------------------
  .spot-detail-header-inner
----------------------------------------------------------------- */
.spot-detail-header-inner{
margin-top:20px;
position:relative;
}

.spot-detail-header-inner > p{
margin:4px 0 8px;
}

/* .spot-detail-header-inner Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-header-inner{
margin:0;
padding:12px 10px;
}
}


/* ----------------------------------------------------------------
  .spot-detail-header-hdg
----------------------------------------------------------------- */
.spot-detail-header-hdg{
margin-right:170px;
font-size:24px;
}

/* .spot-detail-header-hdg Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-header-hdg{
margin:0 50px 12px 0;
font-size:18px;
font-weight:normal;
}
}


/* ----------------------------------------------------------------
  .spot-detail-header-list
----------------------------------------------------------------- */
.spot-detail-header-list{
margin:4px 0 0;
}

.spot-detail-header-list > li{
display:-webkit-box;
display:flex;
}

.spot-detail-header-list > li:not(:first-child){
margin-top:4px;
}

.spot-detail-header-list > li > div:first-child{
padding-right:1em;
width:4.5em;
position:relative;
}

.spot-detail-header-list > li > div:first-child::after{
content:"\ff1a";
display:block;
position:absolute;
top:0;
right:0;
}

.spot-detail-header-list > li > div:last-child{
-webkit-box-flex:1;
flex:1;
}


/* ----------------------------------------------------------------
  .spot-detail-header-btn
----------------------------------------------------------------- */
.spot-detail-header-btn{
margin:0;
position:absolute;
top:0;
right:0;
display:-webkit-box;
display:flex;
-webkit-box-align:end;
align-items:flex-end;
}

.spot-detail-header-btn button{
display:block;
}

.spot-detail-header-btn .insta{
display:none;
}

.spot-detail-header-btn .sns button{
padding:8px 36px 7px 12px;
border:1px solid #bbb;
border-radius:3px;
background:url(/element/spot/shared/images/icon-share.svg) calc(100% - 12px) 50% no-repeat;
background-size:16px auto;
font-size:12px;
}

.spot-detail-header-btn .insta button{
margin:0;
padding:0;
border:none;
color:rgba(0,0,0,0);
width:18px;
height:18px;
background:url(/element/spot/shared/images/icon-instagram.svg) no-repeat 0 0;
}

/* Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-header-btn{
top:10px;
right:10px;
gap:0 12px;
}

.spot-detail-header-btn .sns button{
padding:0;
border:none;
color:rgba(0,0,0,0);
width:16px;
height:20px;
overflow:hidden;
background-position:0 0;
}

.spot-detail-header-btn .insta{
display:block;
}
}


/* ----------------------------------------------------------------
  .spot-detail-panel
----------------------------------------------------------------- */
.spot-detail-panel{
margin-top:16px;
font-size:12px;
}

/* .spot-detail-panel.spot-detail-summary
----------------------------------------------------------------- */
.spot-detail-panel.spot-detail-summary{
font-size:14px;
}

/* .spot-detail-panel Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-panel{
padding:12px;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.3);
background-color:#fff;
}
}


/* ----------------------------------------------------------------
  .spot-detail-panel-content
----------------------------------------------------------------- */
.spot-detail-panel-content{
padding:20px;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.4);
background-color:#fff;
}

.spot-detail-panel-content > :first-child{
margin-top:0;
}

.spot-detail-panel-content > :last-child{
margin-bottom:0;
}

/* .spot-detail-panel-content Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-panel-content{
padding:0;
border-radius:0;
box-shadow:none;
}
}


/* ----------------------------------------------------------------
  .spot-detail-panel-hdg
----------------------------------------------------------------- */
.spot-detail-panel-hdg{
margin-bottom:8px;
font-size:14px;
font-weight:normal;
}

/* .spot-detail-panel-hdg Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-panel-hdg{
margin-bottom:12px;
padding-bottom:8px;
border-bottom:1px solid #ebebeb;
font-size:16px;
}
}


/* ----------------------------------------------------------------
  .spot-detail-panel-hdg-01
----------------------------------------------------------------- */
.spot-detail-panel-hdg-01{
margin-bottom:8px;
font-size:14px;
font-weight:normal;
}


/* ----------------------------------------------------------------
  .spot-detail-panel-list-separate
----------------------------------------------------------------- */
.spot-detail-panel-list-separate > li{
display:-webkit-box;
display:flex;
}

.spot-detail-panel-list-separate > li:not(:first-child){
margin-top:12px;
}

.spot-detail-panel-list-separate > li > div:first-child{
padding-right:1em;
width:7.5em;
position:relative;
}

.spot-detail-panel-list-separate > li > div:first-child::after{
content:"\ff1a";
display:block;
position:absolute;
top:0;
right:0;
}

.spot-detail-panel-list-separate > li > div:last-child{
-webkit-box-flex:1;
flex:1;
word-break:break-word;
overflow-wrap:break-word;
}


/* ----------------------------------------------------------------
  .spot-detail-panel-toggle
----------------------------------------------------------------- */
/* .spot-detail-panel-toggle-hook
----------------------------------------------------------------- */
.spot-detail-panel-toggle-hook button{
padding:0;
border:none;
color:var(--color-gray);
display:inline-block;
background-color:transparent;
}

.spot-detail-panel-toggle-hook button::before {
margin:0 3px;
content: "...";
display:inline-block;
vertical-align:bottom
}

.spot-detail-panel-toggle.is-active .spot-detail-panel-toggle-hook{
display:none;
}

/* .spot-detail-panel-toggle-content
----------------------------------------------------------------- */
.spot-detail-panel-toggle-content{
display:none;
}

.spot-detail-panel-toggle-content > :first-child{
margin-top:0;
}

.spot-detail-panel-toggle.is-active .spot-detail-panel-toggle-content{
display:block;
}

/* .spot-detail-panel-toggle-close
----------------------------------------------------------------- */
.spot-detail-panel-toggle-close{
margin:4px 0 0 auto;
padding:0 0 0 12px;
border:none;
display:block;
background:url(/element/spot/shared/images/icon-arrow-down.svg) no-repeat 0 50%;
background-size:8px auto;
font-size:14px;
}

.spot-detail-panel-toggle.is-active .spot-detail-panel-toggle-close{
background-image:url(/element/spot/shared/images/icon-arrow-up.svg);
}


/* ----------------------------------------------------------------
  .spot-detail-panel-author
----------------------------------------------------------------- */
/* .spot-detail-panel-author
----------------------------------------------------------------- */
.spot-detail-panel-author{
margin:20px 0 12px;
padding:12px;
border-radius:4px;
background-color:#f5f5f5;
}

/* Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-detail-panel-author {
padding:8px;
}
}

/* .spot-detail-panel-author-hdg
----------------------------------------------------------------- */
.spot-detail-panel-author-hdg{
margin-bottom:8px;
font-weight:normal;
font-size:14px;
}

/* .spot-detail-panel-author-list
----------------------------------------------------------------- */
.spot-detail-panel-author-list{
margin:4px 0 -2px 0;
color:var(--color-gray);
}

.spot-detail-panel-author-list > li{
display:inline-block;
}

.spot-detail-panel-author-list > li:not(:first-child)::before{
content:"/";
display:inline-block;
margin:0 4px;
}



/* ----------------------------------------------------------------

  Seo Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .spot-seo
----------------------------------------------------------------- */
/* .spot-detail > .spot-seo
----------------------------------------------------------------- */
.spot-detail .spot-seo{
margin:60px 0 -50px;
padding:20px 0 50px;
border-image:linear-gradient(#eee,#eee) fill 0 //0 100vw 0 100vw;
}

/* .spot-seo Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-seo{
margin:0 -10px -20px;
padding:20px 10px 20px;
border-image:none;
background-color:#f5f5f5;
}

.spot-seo > :first-child{
margin-top:0;
}

.spot-index .spot-seo{
margin:0;
padding:0;
}

.spot-detail .spot-seo{
margin:28px 0 -20px;
padding:20px 0 30px;
border-image:none;
}
}


/* ----------------------------------------------------------------
  .spot-seo-hdg
----------------------------------------------------------------- */
/* .spot-seo-hdg
----------------------------------------------------------------- */
.spot-seo-hdg{
margin:36px 0 8px;
font-size:16px;
}

.spot-seo-hdg a{
text-decoration:none;
}

.spot-seo-hdg a:active,
.spot-seo-hdg a:hover,
.spot-seo-hdg a:focus{
text-decoration:underline;
}

/*  .spot-index > .spot-seo-hdg
-------------------------------------------------- */
.spot-index .spot-seo-hdg{
margin-top:28px;
font-size:14PX;
}

/* .spot-seo-hdg Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-seo-hdg{
margin-top:28px;
font-weight:normal;
}

.spot-index .spot-seo-hdg{
margin-top:20px;
}
}


/* ----------------------------------------------------------------
  .spot-seo-carousel
----------------------------------------------------------------- */
/* .spot-seo-carousel
----------------------------------------------------------------- */
.spot-seo-carousel{
margin:-5px;
position:relative;
font-size:12px;
}

/* .spot-seo-carousel-nav
----------------------------------------------------------------- */
.spot-seo-carousel-nav{
margin:0;
}

.spot-seo-carousel-nav > li{
position:absolute;
bottom:50%;
transform:translateY(50%);
z-index:2;
}

.spot-seo-carousel-nav > .next{
right:-16px;
}

.spot-seo-carousel-nav > .prev{
left:-16px;
}

.spot-seo-carousel-nav button{
border:1px solid #bbb;
border-radius:16px;
color:rgba(0,0,0,0);
width:32px;
height:32px;
overflow:hidden;
position:relative;
background-color:#fff;
}

.spot-seo-carousel-nav button::before{
content:'';
display:block;
width:7px;
height:12px;
overflow:hidden;
position:absolute;
bottom:50%;
right:50%;
transform:translate(50%, 50%);
background:url(/element/shared/images/icon/icon-chevron-left.svg) 50% 50% no-repeat;
}

.spot-seo-carousel-nav .next button::before{
transform:translate(50%, 50%) rotate(175deg);
}

.spot-seo-carousel-nav [aria-disabled="true"]{
display:none;
}

/* .spot-seo-carousel-list
----------------------------------------------------------------- */
.spot-seo-carousel-list{
padding:5px;
overflow:hidden;
}

.spot-seo-carousel-list > ul{
margin:0;
display:-webkit-box;
display:flex;
-webkit-box-align:stretch;
align-items:stretch;
width:100%;
}

.spot-seo-carousel-list > ul > li{
width:168px;
min-width:168px;
}

.spot-seo-carousel-list a{
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.3);
color:var(--cmn-font-color-base);
display:-webkit-box;
display:flex;
-webkit-box-direction:reverse;
flex-direction:column-reverse;
text-decoration:none;
overflow:hidden;
height:100%;
}

/* .spot-seo-carousel-list.genre
----------------------------------------------------------------- */
.spot-seo-carousel-list.genre a{
position:relative;
height:126px;
}

.spot-seo-carousel-list.genre img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-seo-carousel-list.genre span{
padding:5px 8px;
color:#fff;
box-sizing:border-box;
display:block;
width:100%;
position:absolute;
left:0;
bottom:0;
background-color:rgba(51,51,51,.8);
font-weight:bold;
}

/* .spot-seo-carousel-list.area
----------------------------------------------------------------- */
.spot-seo-carousel-list.area > ul > li{
width:230px;
min-width:230px;
height:auto;
background-color:#fff;
}

.spot-seo-carousel-list.area .detail{
padding:8px;
-webkit-box-flex:1;
flex:1;
}

.spot-seo-carousel-list.area .detail b{
margin-bottom:4px;
display:block;
font-weight:normal;
font-size:14px;
}

.spot-seo-carousel-list.area .detail span{
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.5;
}

.spot-seo-carousel-list.area .detail .area{
margin-bottom:4px;
}

.spot-seo-carousel-list.area .thumb{
position:relative;
height:173px;
}

.spot-seo-carousel-list.area .thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.spot-seo-carousel-list.area .thumb img.guard{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
-webkit-touch-callout:none;
}

.spot-seo-carousel-list.area .thumb.nophoto{
box-shadow:0 -1px 0 #e5e5e5 inset;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.spot-seo-carousel-list.area .thumb.nophoto img{
width:100px;
height:auto;
}

/* .spot-seo-carousel Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:800px){

/* .spot-seo-carousel
----------------------------------------------- */
.spot-seo-carousel{
margin-right:-10px;
}

/* .spot-seo-carousel-nav
----------------------------------------------- */
.spot-seo-carousel-nav{
display:none;
}

/* .spot-seo-carousel-list
----------------------------------------------- */
.spot-seo-carousel-list > ul > li{
width:144px;
}

.spot-seo-carousel-list.genre a{
 height:108px;
}

.spot-seo-carousel-list.area > ul > li{
min-width:260px;
width:260px;
}

.spot-seo-carousel-list.area .thumb{
height:195px;
}
}


/* ----------------------------------------------------------------
  .spot-seo-matome
----------------------------------------------------------------- */
/* .spot-seo-matome
----------------------------------------------------------------- */
.spot-seo-matome{
padding:20px;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.3);
background-color:#fff;
}

/* .spot-seo-matome-list
----------------------------------------------------------------- */
.spot-seo-matome-list{
margin:0 0 -20px;
display:-webkit-box;
display:flex;
flex-wrap:wrap;
font-size:12px;
line-height:1.5;
}

.spot-seo-matome-list > li{
margin:0 20px 20px 0;
width:calc(calc(100% - 80px) / 5);
}

.spot-seo-matome-list > li:nth-child(5n){
margin-right:0;
}

.spot-seo-matome-list a{
color:var(--cmn-font-color-base);
display:-webkit-box;
display:flex;
-webkit-box-direction:reverse;
flex-direction:column-reverse;
text-decoration:none;
}

.spot-seo-matome-list .thumb{
margin-bottom:8px;
width:100%;
height:92px;
}

.spot-seo-matome-list .thumb img{
width:100%;
height:100%;
object-fit:cover;
}

/* .spot-seo-matome Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:760px){

/* .spot-seo-matome
----------------------------------------------- */
.spot-seo-matome{
padding:12px;
}

/* .spot-seo-matome-list
----------------------------------------------- */
.spot-seo-matome-list{
margin:0;
display:block;
}

.spot-seo-matome-list > li{
margin:0;
width:auto;
}

.spot-seo-matome-list > li:not(:first-child){
margin-top:8px;
padding-top:8px;
border-top:1px solid #ebebeb;
}

.spot-seo-matome-list a{
-webkit-box-direction:reverse;
flex-direction:row-reverse;
}

.spot-seo-matome-list .column{
-webkit-box-flex:1;
flex:1;
}

.spot-seo-matome-list .thumb{
margin:0 8px 0 0;
max-width:72px;
height:54px;
}
}


/* ----------------------------------------------------------------
  .spot-seo-faq
----------------------------------------------------------------- */
/* .spot-seo-faq
----------------------------------------------------------------- */
.spot-seo-faq{
padding:2px 20px;
border-radius:6px;
box-shadow:0 0 4px rgba(0,0,0,.3);
background-color:#fff;
font-size:12px;
}

.spot-seo-faq p{
margin:0;
}

.spot-seo-faq > :first-child{
margin-top:0;
}

/* .spot-seo-faq-item
----------------------------------------------------------------- */
.spot-seo-faq-item + .spot-seo-faq-item{
border-top:1px solid #ddd;
}

/* .spot-seo-faq-item-hook
----------------------------------------------------------------- */
.spot-seo-faq-item-hook{
padding:4px 16px 4px 24px;
border:none;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
box-sizing:border-box;
width:100%;
min-height:42px;
position:relative;
cursor:pointer;
background:url(/element/spot/shared/images/icon-faq-q.svg) 0 50% no-repeat;
background-size:11px auto;
text-align:left;
font-size:12px;
font-weight:normal;
}

.spot-seo-faq-item-hook::before{
margin-top:-4px;
content:'';
display:block;
width:12px;
height:7px;
overflow:hidden;
position:absolute;
top:50%;
right:0;
background:url(/element/shared/images/icon/icon-chevron-down.svg) 0 0 no-repeat;
}

.spot-seo-faq-item[aria-expanded="true"] > .spot-seo-faq-item-hook::before{
background-image:url(/element/shared/images/icon/icon-chevron-up.svg);
}

/* .spot-seo-faq-item-content
----------------------------------------------------------------- */
.spot-seo-faq-item-content{
padding:0 0 12px 24px;
background:url(/element/spot/shared/images/icon-faq-a.svg) 0 0 no-repeat;
background-size:11px auto;
}

.spot-seo-faq-item[aria-expanded="false"] > .spot-seo-faq-item-content{
display:none;
}

/* .spot-seo-faq Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.spot-seo-faq{
padding:0 12px;
}

.spot-seo-faq-item-hook{
min-height:50px;
}
}


/* ----------------------------------------------------------------
  .spot-seo-toggle
----------------------------------------------------------------- */
/* .spot-seo-toggle
----------------------------------------------------------------- */
.spot-seo-toggle{
margin-top:60px;
}

/* .spot-seo-toggle-item
----------------------------------------------------------------- */
.spot-seo-toggle-item{
margin-top:20px;
padding-top:20px;
border-top:1px solid #d9d9d9;
}

/* .spot-seo-toggle-item-hook
----------------------------------------------------------------- */
.spot-seo-toggle-item-hook{
margin-bottom:20px;
}

.spot-seo-toggle-item-hook button{
margin:0;
padding:0 20px 0 0;
border:none;
width:100%;
background:url(/element/shared/images/icon/icon-chevron-down.svg) 100% 40% no-repeat;
background-size:12px auto;
font-size:14px;
font-weight:bold;
text-align:left;
}

.spot-seo-toggle-item[aria-expanded="true"] .spot-seo-toggle-item-hook button{
background-image:url(/element/shared/images/icon/icon-chevron-up.svg);
}

/* .spot-seo-toggle-item-content
----------------------------------------------------------------- */
.spot-seo-toggle-item-content{
display:none;
}

.spot-seo-toggle-item[aria-expanded="true"] .spot-seo-toggle-item-content{
display:block;
}

/* .spot-seo-toggle Media Queries
    PC view Only
----------------------------------------------------------------- */
@media screen and (min-width:751px){

/* .spot-seo-toggle-item-list-line
----------------------------------------------- */
.spot-seo-toggle-item-list-line{
margin-top:-10px;
line-height:1.25;
font-size:12px;
}

.spot-seo-toggle-item-list-line > li{
margin:10px 10px 0 0;
display:inline-block;
padding-right:12px;
border-right:1px solid #ddd;
}

.spot-seo-toggle-item-list-line > li:last-child{
margin-right:0;
padding-right:0;
border-right:none;
}

.spot-seo-toggle-item-list-line > li > a{
color:#666;
text-decoration:none;
}

.spot-seo-toggle-item-list-line > li > a:active,
.spot-seo-toggle-item-list-line > li > a:hover,
.spot-seo-toggle-item-list-line > li > a:focus{
text-decoration:underline;
}

/* .spot-seo-toggle-item-list-separate
----------------------------------------------- */
.spot-seo-toggle-item-list-separate{
line-height:1.25;
font-size:12px;
}

.spot-seo-toggle-item-list-separate > li{
margin-top:12px;
display:-webkit-box;
display:flex;
}

.spot-seo-toggle-item-list-separate > li > span{
margin-right:20px;
width:8em;
}

.spot-seo-toggle-item-list-separate > li > span a{
padding-left:10px;
color:#666;
display:inline-block;
position:relative;
background:url(/element/spot/shared/images/icon-arrow.svg) 0 2px no-repeat;
background-size:4px auto;
text-decoration:none;
}

.spot-seo-toggle-item-list-separate a:active,
.spot-seo-toggle-item-list-separate a:hover,
.spot-seo-toggle-item-list-separate a:focus{
text-decoration:underline;
}

.spot-seo-toggle-item-list-line + .spot-seo-toggle-item-list-separate{
margin-top:20px;
}

/* .spot-seo-toggle-item-list-separate-inner
----------------------------------------------- */
.spot-seo-toggle-item-list-separate-inner{
-webkit-box-flex:1;
flex:1;
}
}

/* .spot-seo-toggle Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .spot-seo-toggle
----------------------------------------------- */
.spot-seo-toggle{
margin:28px 0 0;
border-bottom:1px solid #ddd;
}

/* .spot-seo-toggle-item
----------------------------------------------- */
.spot-seo-toggle-item{
margin-top:0;
padding-top:0;
}

/* .spot-seo-toggle-item-hook
----------------------------------------------- */
.spot-seo-toggle-item-hook{
margin-bottom:0;
}

.spot-seo-toggle-item-hook button{
min-height:44px;
background-position:100% 50%;
font-weight:normal;
}

/* .spot-seo-toggle-item-content
----------------------------------------------- */
.spot-seo-toggle-item-content{
margin-top:0;
padding-bottom:12px;
}

/* .spot-seo-toggle-item-list-line
----------------------------------------------- */
.spot-seo-toggle-item-list-line{
margin-top:0;
font-size:14px;
}

.spot-seo-toggle-item-list-line > li:not(:first-child){
margin-top:8px;
}

.spot-seo-toggle-item-list-line a{
color:var(--cmn-font-color-base);
text-decoration:none;
}

/* .spot-seo-toggle-item-list-separate
----------------------------------------------- */
.spot-seo-toggle-item-list-separate{
margin-top:0;
font-size:14px;
}

.spot-seo-toggle-item-list-separate > li{
margin-top:8px;
}

.spot-seo-toggle-item-list-separate ul{
margin:8px 0 0 24px;
}

.spot-seo-toggle-item-list-separate a{
color:var(--cmn-font-color-base);
text-decoration:none;
}
}



/* ----------------------------------------------------------------

  Dialog Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .dialog
----------------------------------------------------------------- */
[role="dialog"].dialog{
position:fixed;
top:0;
right:0;
bottom:0;
left:0;
display:none;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
z-index:1000;
background-color:rgba(0,0,0,.6);
}

[role="dialog"].dialog.is-active{
display:-webkit-box;
display:flex;
}

/* .dialog { Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
[role="dialog"].dialog{
background-color:rgba(0,0,0,.7);
}
}


/* ----------------------------------------------------------------
  .dialog-btn-close
----------------------------------------------------------------- */
.dialog-btn-close{
padding:0;
border:none;
width:53px;
height:52px;
position:absolute;
top:-18px;
right:-25px;
cursor:pointer;
background:url(/element/shared/images/sprite/sprite-modal-01.png) 0 0 no-repeat;
text-indent:-9999px;
}

.dialog-btn-close:active,
.dialog-btn-close:hover,
.dialog-btn-close:focus{
background-position:0 -65px;
}

/* .dialog-btn-close Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-btn-close{
width:40px;
height:36px;
top:0;
right:0;
background:url(/element_sp/shared/images/modal/btn-close.svg) 50% 50% no-repeat;
background-size:20px;
}
}


/* ----------------------------------------------------------------
  .dialog-inner
----------------------------------------------------------------- */
/* .dialog-inner
----------------------------------------------------------------- */
.dialog-inner{
padding:10px;
box-sizing:border-box;
width:450px;
max-width:calc(100vw - 20px);
height:calc(100vh - 80px);
max-height:850px;
position:relative;
background-color:var(--cmn-font-color-base);
}

/* .dialog-sns > .dialog-inner
----------------------------------------------------------------- */
.dialog-sns .dialog-inner{
height:auto;
background-color:#fff;
}

/* .dialog-inner Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-inner{
padding:36px 0;
height:86vh;
background-color:transparent;
}

.dialog-sns .dialog-inner{
background-color:transparent;
}
}


/* ----------------------------------------------------------------
  .dialog-lyt
----------------------------------------------------------------- */
.dialog-lyt{
display:-webkit-box;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
flex-direction:column;
height:100%;
background-color:#fff;
}

/* .dialog-lyt Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-lyt{
border-radius:5px;
overflow:hidden;
}
}


/* ----------------------------------------------------------------
  .dialog-lyt-header
----------------------------------------------------------------- */
/* .dialog-lyt-header-inner
----------------------------------------------------------------- */
.dialog-lyt-header-inner{
padding:4px 20px 12px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
background-color:var(--cmn-font-color-base);
}

/* .dialog-lyt-header-hdg
----------------------------------------------------------------- */
.dialog-lyt-header-hdg{
color:#fff;
-webkit-box-flex:1;
flex:1;
font-size:15px;
}

/* .dialog-lyt-header Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .dialog-lyt-header-inner
----------------------------------------------- */
.dialog-lyt-header-inner{
padding:12px 15px;
}

/* .dialog-lyt-header-hdg
----------------------------------------------- */
.dialog-lyt-header-hdg{
font-size:16px;
}
}


/* ----------------------------------------------------------------
  .dialog-lyt-content
----------------------------------------------------------------- */
/* .dialog-lyt-content
----------------------------------------------------------------- */
.dialog-lyt-content{
padding:16px 20px 20px;
-webkit-box-flex:1;
flex:1;
overflow-y:auto;
}

/* .dialog-lyt-content Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-lyt-content{
padding:16px;
}

/* .dialog-sns > .dialog-lyt-content
----------------------------------------------- */
.dialog-sns .dialog-lyt-content{
padding:24px 16px 20px;
}
}


/* ----------------------------------------------------------------
  .dialog-list
----------------------------------------------------------------- */
/* .dialog-list
----------------------------------------------------------------- */
.dialog-list{
margin:-16px 0 0;
font-size:14px;
}

.dialog-list > li{
border-bottom:1px solid #ccc;
}

.dialog-list > li > a,
.dialog-list > li > span{
color:var(--cmn-font-color-base);
min-height:46px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
text-decoration:none;
}

.dialog-list > .is-disabled > span{
color:#ccc;
}

/* .dialog-toggle-list > .dialog-list
----------------------------------------------------------------- */
.dialog-toggle-list .dialog-list{
margin-top:0;
margin-bottom:-1px;
}

/* .dialog-list Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-list > li{
border-bottom-color:#e5e5e5;
}
}


/* ----------------------------------------------------------------
  .dialog-toggle-list
----------------------------------------------------------------- */
/* .dialog-toggle-list
----------------------------------------------------------------- */
.dialog-toggle-list{
margin:-16px 0 0;
font-size:14px;
}

.dialog-toggle-list > li:not(:first-child){
border-top:1px solid #ccc;
}

.dialog-toggle-list > li:last-child{
border-bottom:1px solid #ccc;
}

.dialog-toggle-list > li > ul{
margin-left:20px;
border-top:1px solid #ccc;
}

.dialog-toggle-list .dialog-toggle-list{
margin-top:0;
}

.dialog-toggle-list .dialog-toggle-list > li:last-child{
border-bottom:none;
}

.dialog-toggle-list > .is-disabled > span{
color:#ccc;
}

/* toggle none
----------------------------------------------------------------- */
.dialog-toggle-list > li > a,
.dialog-toggle-list > li > span{
padding:4px 0;
color:var(--cmn-font-color-base);
box-sizing:border-box;
min-height:46px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
text-decoration:none;
}

/* toggle
----------------------------------------------------------------- */
.dialog-toggle-list > li[aria-expanded] > div{
min-height:46px;
display:-webkit-box;
display:flex;
-webkit-box-align:stretch;
align-items:stretch;
}

.dialog-toggle-list > li[aria-expanded] > div > a{
margin-right:10px;
padding:4px 0;
color:var(--cmn-font-color-base);
box-sizing:border-box;
position:relative;
-webkit-box-flex:1;
flex:1;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
text-decoration:none;
}

.dialog-toggle-list > li[aria-expanded] > div > button{
padding:0;
border:none;
color:rgba(0,0,0,0);
width:44px;
background:url(/element/shared/images/icon/icon-chevron-down.svg) 100% 50% no-repeat;
background-size:12px auto;
}

.dialog-toggle-list > li[aria-expanded="false"] > ul{
display:none;
}

.dialog-toggle-list > li[aria-expanded="true"] > div > button{
background-image:url(/element/shared/images/icon/icon-chevron-up.svg);
}

/* .dialog-toggle-list Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){
.dialog-toggle-list{
margin-top:-16px;
}

.dialog-toggle-list > li > a,
.dialog-toggle-list > li[aria-expanded] > div > a,
.dialog-toggle-list > li[aria-expanded] > div{
min-height:44px;
}

.dialog-toggle-list > li:not(:first-child),
.dialog-toggle-list > li > ul{
border-top-color:#e5e5e5;
}

.dialog-toggle-list > li:last-child{
border-bottom-color:#e5e5e5;
}

.dialog-toggle-list > li > ul{
margin-left:16px;
}
}


/* ----------------------------------------------------------------
  .dialog-link
----------------------------------------------------------------- */
/* .dialog-link
----------------------------------------------------------------- */
.dialog-link{
margin:12px 0 0 auto;
display:block;
width:fit-content;
font-size:12px;
}


/* ----------------------------------------------------------------
  .dialog-tab
----------------------------------------------------------------- */
/* .dialog-tab-list
----------------------------------------------------------------- */
.dialog-tab-list{
margin:0;
padding:14px 20px 10px;
box-shadow:0 2px 4px rgba(0,0,0,.2);
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
}

.dialog-tab-list > li{
padding:0 12px;
position:relative;
}

.dialog-tab-list > li:first-child{
padding-left:0;
}

.dialog-tab-list > li:not(:last-child)::before{
content:'';
display:block;
width:1px;
height:16px;
overflow:hidden;
position:absolute;
top:2px;
right:0;
background-color:#ccc;
}

.dialog-tab-list button{
margin:0;
padding:0 0 8px;
border:none;
color:var(--cmn-font-color-base);
height:26px;
line-height:1;
background-color:transparent;
font-size:12px;
}

.dialog-tab-list button[aria-selected="true"]{
box-shadow:0 -2px 0 var(--cmn-font-color-base) inset;
}

/* .dialog-tab-content
----------------------------------------------------------------- */
.dialog-tab-content{
display:none;
}

.dialog-tab-content.is-active{
display:block;
}

/* .dialog-tab Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

.dialog-tab-list{
padding:12px 16px 8px;
}

.dialog-tab-list > li{
padding:0;
}

.dialog-tab-list > li:not(:last-child){
margin-right:20px;
}

.dialog-tab-list > li:not(:last-child)::before{
display:none;
}

.dialog-tab-list button{
font-size:14px;
}
}


/* ----------------------------------------------------------------
  .dialog-sns
----------------------------------------------------------------- */
/* .dialog-sns-hdg
----------------------------------------------------------------- */
.dialog-sns-hdg{
margin-bottom:16px;
font-size:16px;
font-weight:normal;
text-align:center;
}

/* .dialog-sns-icon
----------------------------------------------------------------- */
.dialog-sns-icon{
margin:0 auto;
max-width:200px;
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
justify-content:space-around;
}

.dialog-sns-icon button{
border:none;
color:rgba(0,0,0,0);
width:40px;
height:40px;
overflow:hidden;
background-position:0 0;
background-repeat:no-repeat;
background-size:40px;
background-color:transparent;
}

.dialog-sns-icon .insta button{
background-image:url(/element/shared/images/icon/icon-sns-instagram.svg);
}

.dialog-sns-icon .line button{
background-image:url(/element/shared/images/icon/icon-sns-line.svg);
}

.dialog-sns-icon .fb button{
background-image:url(/element/shared/images/icon/icon-sns-fb.svg);
}

.dialog-sns-icon .x button{
background-image:url(/element/shared/images/icon/icon-sns-twitter.svg);
}

/* .dialog-sns-list
----------------------------------------------------------------- */
.dialog-sns-list{
margin:0 auto;
max-width:240px;
}

.dialog-sns-list > li{
margin-top:8px;
}

.dialog-sns-list button{
padding:0;
border:1px solid #bfbfbf;
border-radius:4px;
width:100%;
min-height:36px;
background-color:#fff;
font-size:14px;
}

.dialog-sns-list button > span{
padding-left:40px;
display:block;
background-position:12px 50%;
background-repeat:no-repeat;
background-size:18px auto;
text-align:left;
}

.dialog-sns-list .mail button > span{
background-image: url(/element/spot/shared/images/icon-ml.svg);
}

.dialog-sns-list .sms button > span{
background-image:url(/element/spot/shared/images/icon-sms.svg);
}

.dialog-sns-list .url button > span{
background-image:url(/element/spot/shared/images/icon-copy.svg);
background-size:15px auto;
}

.dialog-sns-list .url-copy{
margin-top:8px;
display:block;
text-align:center;
font-size:11px;
}

/* .dialog-sns Media Queries
----------------------------------------------------------------- */
@media screen and (max-width:750px){

/* .dialog-sns-list
------------------------------------------------- */
.dialog-sns-list button{
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
-webkit-box-pack:center;
justify-content:center;
}

.dialog-sns-list button > span{
padding-left:24px;
background-position:0 38%;
}
}



/* ----------------------------------------------------------------

  Plug in

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Swiper
----------------------------------------------------------------- */
/**
 * Swiper 8.4.6
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2023 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: January 17, 2023
 */
.swiper-pointer-events{
touch-action:pan-y;
}

.swiper-pointer-events.swiper-vertical{
touch-action:pan-x;
}

.swiper-notification{
position:absolute;
left:0;
top:0;
pointer-events:none;
opacity:0;
z-index:-1000
}