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

  Site Common Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .cmn-calendar
----------------------------------------------------------------- */
@media (min-resolution:192dpi){
.cmn-calendar{
transform:scale(.999);
}
}



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

  Area LP Component Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .ranking-header
----------------------------------------------------------------- */
/* .ranking-header
----------------------------------------------- */
.ranking-header{
padding:20px 20px 26px;
position:relative;
}

/* .ranking-header-catch
----------------------------------------------- */
.ranking-header-catch{
color:#fff;
display:-webkit-box;
display:flex;
-webkit-box-pack:center;
justify-content:center;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
flex-direction:column;
height:306px;
}

/* .ranking-header-catch-hdg
----------------------------------------------- */
.ranking-header-catch-hdg{
text-shadow:0 2px 3px #000;
font-size:32px;
font-weight:bold;
}

/* .ranking-header-catch-sup
----------------------------------------------- */
.ranking-header-catch-sup{
display:-webkit-box;
display:flex;
-webkit-box-align:center;
align-items:center;
gap:0 4px;
font-weight:normal;
font-size:14px;
text-shadow:0 2px 4px #000;
}

/* .ranking-header-catch-sup-hdg
----------------------------------------------- */
.ranking-header-catch-sup-hdg{
font-weight:normal;
}


/* .ranking-header-image
----------------------------------------------- */
.ranking-header-image{
position:absolute;
top:0;
left:0;
z-index:-1;
width:100%;
height:100%;
overflow:hidden;
}


/* ----------------------------------------------------------------
  .ranking-search
----------------------------------------------------------------- */
/* .ranking-search
----------------------------------------------- */
.ranking-search{
margin:0;
padding:20px;
border-radius:8px;
color:var(--cmn-font-color-base);
position:relative;
box-shadow:0 1px 6px rgba(32,33,36,.4);
background-color:rgba(255,255,255,.85);
}

.ranking-search[aria-expanded="true"]{
margin-bottom:-16px;
background-color:#f5f5f5;
}

/* .ranking-search-more
----------------------------------------------- */
.ranking-search[aria-expanded="false"] .ranking-search-more{
display: none;
}

.ranking-search[aria-expanded="true"] .ranking-search-more{
display: block;
}

/* .ranking-search-more-hook
----------------------------------------------- */
.ranking-search-more-hook{
margin: 16px auto 0;
padding: 0 0 0 20px;
border: none;
display: block;
background: transparent url(/element/shared/images/icon/icon-chevron-down.svg) 0 50% no-repeat;
background-size: 12px auto;
font-size: 14px;
}

.ranking-search[aria-expanded="true"] .ranking-search-more-hook {
background-image: url(/element/shared/images/icon/icon-chevron-up.svg);
}

/* .ranking-search-btn
----------------------------------------------- */
.ranking-search-btn{
border:none;
border-radius:6px;
color:#fff;
width:140px;
height:40px;
display:block;
position: absolute;
bottom:56px;
right:20px;
background-color:var(--button-color);
font-size:16px;
font-weight:bold;
}

.ranking-search-btn:active,
.ranking-search-btn:hover,
.ranking-search-btn:focus{
background-color:var(--button-color-hover);
}



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

  Hotel Common Modules Modify

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .form-custom-select
----------------------------------------------------------------- */
.form-custom-select select{
font-size:14px;
}


/* ----------------------------------------------------------------
  .form-search modify
----------------------------------------------------------------- */
/* .form-search-lyt-01
----------------------------------------------- */
.ranking-search .form-search-lyt-01{
margin-top:16px;
}

.ranking-search .form-search-lyt-01 > .form-search-lyt-01-cell{
width:230px;
}

.ranking-search .form-search-lyt-01 > .form-search-lyt-01-cell:last-child{
margin-left:12px;
padding-left:12px;
border-left:1px solid #ddd;
}

/* .form-search-item-lyt
----------------------------------------------- */
.ranking-search .form-search-item-lyt{
gap:21px;
}

.ranking-search .form-search-item-lyt > div:first-child{
-webkit-box-flex:0;
flex:none;
width:335px;
}

.ranking-search .form-search-item-lyt > div:last-child{
-webkit-box-flex:1;
flex:1;
}

/* .form-search-item-lyt-01
----------------------------------------------- */
.ranking-search .form-search-item-lyt-01{
margin-right:60px;
gap:20px;
}

.ranking-search .form-search-item-lyt-01 > div:first-child{
width:290px;
}

/* .form-search-hdg
----------------------------------------------- */
.ranking-search .form-search-hdg{
padding-right:24px;
}

.ranking-search .form-search-hdg > h2{
font-weight:normal;
font-size:12px;
}

.ranking-search .form-search-hdg .cmn-tip-btn{
right:12px;
}

.ranking-search .form-search-hdg.no-tip-btn{
padding-right:12px;
}

/* .form-search-hdg-01
----------------------------------------------- */
.ranking-search .form-search-hdg-01 > h2{
font-weight:normal;
font-size:12px;
}

/* .form-search-item
----------------------------------------------- */
.ranking-search .form-search-item.picky{
margin-top:0;
}

.ranking-search .form-search-item > .form-search-item-cell:first-child,
.ranking-search .form-search-item.room-num > .form-search-item-cell:first-child,
.ranking-search .form-search-item.smoking > .form-search-item-cell:first-child,
.ranking-search .form-search-item.budget > .form-search-item-cell:first-child{
width:110px;
}

.ranking-search .form-search-item.price-range > .form-search-item-cell:first-child{
width:65px;
}

.ranking-search .form-search-item.review > .form-search-item-cell:first-child{
width:90px;
}

/* .form-search-item-lyt > .form-search-item
----------------------------------------------- */
.ranking-search .form-search-item-lyt .form-search-item.room-num{
width:297px;
}

/* .form-search-btn
----------------------------------------------- */
.ranking-search .form-search-btn,
.ranking-search .form-search-btn-01{
width:100%;
min-height:34px;
box-shadow:none;
font-size:14px;
}

/* .form-search-btn-01
----------------------------------------------- */
.ranking-search .hotel-type .form-search-btn-01,
.ranking-search .meal .form-search-btn-01,
.ranking-search .room-type .form-search-btn-01{
width:225px;
}

.ranking-search .hotel-rank .form-search-btn-01,
.ranking-search .price-range .form-search-btn-01{
width:180px;
}

/* .form-search-list-line
----------------------------------------------- */
.ranking-search .form-search-list-line{
font-size:12px;
}

/* .form-search-date-btn
----------------------------------------------- */
.ranking-search .form-search-date-btn{
width:225px;
}

/* .form-search-checkbox
----------------------------------------------- */
.ranking-search .form-search-checkbox{
margin:8px 0 0 10px;
}

.ranking-search .form-search-checkbox .sup{
display:inline-block;
}

/* .form-search-num
----------------------------------------------- */
.ranking-search .form-search-num > li.adult > label .form-search-select{
width:65px;
}

.ranking-search .form-search-num > li.child .form-search-btn-01{
width:106px;
}

.ranking-search .form-search-num > li.adult > label > span:first-child{
padding:6px 0 4px 8px;
font-size:14px;
}

/* .form-search-keyword
----------------------------------------------- */
.ranking-search .form-search-keyword{
width:540px;
}

.ranking-search .form-search-keyword > label input[type='text'],
.ranking-search .form-search-keyword > label input[type='search']{
width:350px;
}

/* .form-search-note
----------------------------------------------- */
.ranking-search .smoking .form-search-note{
margin:2px 0 0 -110px;
}


/* ----------------------------------------------------------------
  .seo
----------------------------------------------------------------- */
/* .ranking > .seo
----------------------------------------------- */
.ranking .seo{
margin-top:48px;
padding-top:0;
border:none;
background:transparent;
}


/* .seo-carousel-ranking-hotel
----------------------------------------------- */
.seo .seo-carousel-ranking-hotel > li{
width:234px;
min-width:234px;
}
