@charset "UTF-8";
:root{
--font-color-btn-link:#666;
--font-color-placeholder:#949494;
--font-color-btn-link-visited:#4d009a;
--outline-color:#338cd5;
--font-num:Arial;
}

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

  Base

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Typography
----------------------------------------------------------------- */
.map sup{
position:relative;
line-height:1;
vertical-align:baseline;
font-size:10px;
}
.map sup{
top:-.5em;
}

/* ----------------------------------------------------------------
  link
----------------------------------------------------------------- */
.map-lyt a{
color:var(--cmn-font-color-base);
text-decoration:none;
}

/* ----------------------------------------------------------------
  Form
----------------------------------------------------------------- */
/* default
----------------------------------------------- */
.map button,
.map input,
.map optgroup,
.map select,
.map textarea{
margin:0;
line-height:1.25;
font-size:100%;
vertical-align:baseline;
}
.map label{
cursor:pointer;
}
.map button,
.map select{
text-transform:none;
cursor:pointer;
}
.map [type=button],
.map [type=reset],
.map [type=submit],
button{
-webkit-appearance:button;
}
.map [type=button]::-moz-focus-inr,
.map [type=reset]::-moz-focus-inr,
.map [type=submit]::-moz-focus-inr,
.map button::-moz-focus-inr{
border-style:none;
padding:0;
}
.map fieldset{
margin:0;
padding:0;
border:none;
}
.map legend{
height:0;
overflow:hidden;
position:absolute;
}
.map [type=checkbox],
.map [type=radio]{
padding:0;
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
.map [type=search]{
-webkit-appearance:none;
}
.map [type=search]::-webkit-search-decoration{
-webkit-appearance:none;
}
.map [type=search]::-webkit-search-cancel-button{
display:none;
}
.map [type=search],
.map [type=text],
select,
textarea{
padding:2px 8px;
border:1px solid #ccc;
min-height:34px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
-webkit-box-shadow:none;
box-shadow:none;
}
.map [type=search]:disabled,
.map [type=text]:disabled,
.map select:disabled,
.map textarea:disabled,
.map button:disabled{
border-color:#ccc;
cursor:default;
opacity:.33;
}
.map input[type=search]:-ms-input-placeholder,
.map input[type=text]:-ms-input-placeholder{
color:var(--font-color-placeholder);
}
.map ::-ms-clear{
display:none;
}

/* select customize
----------------------------------------------- */
.map select{
padding:2px 18px 2px 10px;
background:#fff url(/element/j_optional_v2/map/images/icon-form-select.svg) calc(100% - 7px) 50% no-repeat;
min-width:72px;
background-size:7px 5px;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
font-size:13px;
cursor:pointer;
}
.map select:active,
.map select:hover{
border-color:#338cd5;
}
.map select:disabled{
border-color:#bbb;
background-image:url(/element/j_optional_v2/map/images/icon-form-select-disabled.svg);
}

@-moz-document url-prefix(){
.map select{
padding-top:3px;
line-height:2;
}
}
.map select::-ms-expand{
display:none;
}

/* radio customize
----------------------------------------------- */
.map [type=radio]{
margin:0;
padding:0;
border:none;
border-radius:0;
width:16px;
height:16px;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
display:inline-block;
background:url(/element/j_optional_v2/map/images/icon-form-radio.svg) 0 0 no-repeat;
cursor:pointer;
}
.map [type=radio]:active,
.map [type=radio]:hover,
.map [type=radio]:focus{
background-image:url(/element/j_optional_v2/map/images/icon-form-radio-hover.svg);
}
.map [type=radio]:checked{
background-image:url(/element/j_optional_v2/map/images/icon-form-radio-checked.svg);
}
.map [type=radio]:disabled{
opacity:1;
cursor:default;
background-image:url(/element/j_optional_v2/map/images/icon-form-radio-disabled.svg);
}

/* checkbox customize
----------------------------------------------- */
.map [type=checkbox]{
margin:0;
padding:0;
border:none;
border-radius:0;
width:16px;
height:16px;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
display:inline-block;
background:url(/element/j_optional_v2/map/images/icon-form-checkbox.svg) 0 0 no-repeat;
cursor:pointer;
}
.map [type=checkbox]:active,
.map [type=checkbox]:hover,
.map [type=checkbox]:focus{
background-image:url(/element/j_optional_v2/map/images/icon-form-checkbox-hover.svg);
}
.map [type=checkbox]:checked{
background-image:url(/element/j_optional_v2/map/images/icon-form-checkbox-checked.svg);
}
.map [type=checkbox]:disabled{
opacity:1;
cursor:default;
background-image:url(/element/j_optional_v2/map/images/icon-form-checkbox-disabled.svg);
}

/* ----------------------------------------------------------------
  Pseudo classes Transition
----------------------------------------------------------------- */
.map a,
.map button,
.map label,
.map input{
-webkit-transition:all .15s linear;
transition:all .15s linear;
}

/* ----------------------------------------------------------------
  Outline control
----------------------------------------------------------------- */
/* plugin
   https://github.com/ten1seven/what-input
----------------------------------------------------------------- */
/* TODO:Delayed introduction of what-input */
/* .map *:focus{
outline:none;
} */
/* default mouse focus
----------------------------------------------- */
[data-whatinput="mouse"] .map *:focus{
outline:none;
}

/* default keyboard focus
----------------------------------------------- */
[data-whatinput="keyboard"] .map *:focus{
outline:none;
-webkit-box-shadow:0 0 0 2px var(--outline-color);
box-shadow:0 0 0 2px var(--outline-color);
}

/* ----------------------------------------------------------------
  .cmn-dashed
----------------------------------------------------------------- */
.map .map-filter-option-pulldown-note .cmn-dashed{
--cmn-dashed-color:#777;
--cmn-dashed-font-color:#777;
}
.map .map-view-area-outside .cmn-dashed{
--cmn-dashed-color:#fff;
--cmn-dashed-font-color:#fff;
}

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

  Layout

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  map-lyt
----------------------------------------------------------------- */
.map-lyt{
padding:0;
font-family:var(--cmn-font-family);
font-size:13px;
}
.map-lyt .str-header,
.map-lyt .nav-global,
.map-lyt .cmn-topic-path,
.map-lyt #container,
.map-lyt .str-footer,
.map-lyt .seo-footer-container{
display:none;
}
.map-lyt .cmn-tip-agt::before{
left:9px;
}

/* ----------------------------------------------------------------
  map
----------------------------------------------------------------- */
.map{
-webkit-box-sizing:border-box;
box-sizing:border-box;
min-width:1460px;
height:100vh;
min-height:585px;
position:relative;
line-height:1.25;
display:none;
-webkit-box-direction:normal;
-ms-flex-direction:column;
flex-direction:column;
background-color:#fff;
}
.map-lyt .map{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
}

/* Media Queries
----------------------------------------------- */

@media screen and (max-width:1459px){
.map{
height:calc(100vh - 17px);
}
}

/* ----------------------------------------------------------------
  map-inr
----------------------------------------------------------------- */
.map .map-inr{
-webkit-box-flex:1 0 auto;
-ms-flex:1 0 auto;
flex:1 0 auto;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:stretch;
-ms-flex-align:stretch;
align-items:stretch;
}

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

  Common Modules

----------------------------------------------------------------- */
/* tip-help-content
---------------------------------- */
.tip-help-content{
display:none;
position:absolute;
color:#fff;
background-color:rgba(60,64,67,.9);
border-radius:4px;
padding:4px 8px;
z-index:12;
font-size:12px;
margin-top:-4px;
white-space:nowrap;
}
.tip-help-content.is-active{
display:block;
}

/* ----------------------------------------------------------------
  Suggest
----------------------------------------------------------------- */
/* .suggest
----------------------------------------------- */
.map .suggest{
border-radius:4px;
border-color:#ccc;
line-height:1.5;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.16);
box-shadow:0 1px 2px rgba(0,0,0,.16);
top:100%;
left:0;
min-width:0;
width:100%;
}
.map .suggest .suggest-frame{
overflow:hidden;
overflow-y:auto;
min-height:50px;
max-height:calc(100vh - 100px);
margin:8px 0;
}
.map .suggest .suggest-frame.is-branch{
max-height:calc(100vh - 140px);
}
.map .suggest .suggest-hdg:first-child{
padding-top:0;
}
.map .suggest .suggest-item{
padding-top:0;
}
.map .suggest .suggest-footer{
margin-top:-4px;
background-color:#f5f5f5;
}

/* .map-filter-basic > .suggest
----------------------- */
.map .map-filter-basic .suggest{
width:410px;
top:100%;
}

/* .suggest-list
----------------------------------------------- */
.map .suggest .suggest-list{
margin:0;
}
.map .suggest .suggest-list > li.minpaku{
width:auto;
}

/* .suggest-select-list
----------------------------------------------- */
.map .suggest .suggest-select-list{
margin-bottom:0;
}

/* .suggest-select-list
----------------------------------------------- */
.map .suggest .suggest-select-list input[type="checkbox"]{
display:inline-block;
vertical-align:middle;
}

/* .suggest-category
----------------------------------------------- */
.map .suggest .suggest-category{
width:auto;
margin-bottom:0;
}

/* .suggest-sup
----------------------------------------------- */
.map .suggest .suggest-sup{
width:auto;
padding-bottom:0;
}

/* .suggest-btn-clear
----------------------------------------------- */
.map .suggest .suggest-btn-clear{
-webkit-box-shadow:none;
box-shadow:none;
font-weight:normal;
}

/* .suggest-btn-set
----------------------------------------------- */
.map .suggest .suggest-btn-set{
-webkit-box-shadow:none;
box-shadow:none;
text-shadow:none;
font-weight:normal;
padding-top:2px;
background-color:var(--outline-color);
}

/* ----------------------------------------------------------------
  Modal
----------------------------------------------------------------- */
/* .suggest-sup
----------------------------------------------- */
.map-lyt .local-modal .local-modal-btn{
-webkit-box-shadow:none;
box-shadow:none;
text-shadow:none;
font-weight:normal;
}

/* ----------------------------------------------------------------
  .br
----------------------------------------------------------------- */
.map .br{
display:block;
}

/* ----------------------------------------------------------------
  .is-hidden
----------------------------------------------------------------- */
.map .is-hidden{
height:0;
overflow:hidden;
position:absolute;
}

/* ----------------------------------------------------------------
  .suggest
----------------------------------------------------------------- */
.map .suggest-container{
width:auto;
}

/* ----------------------------------------------------------------
  .cal-container
----------------------------------------------------------------- */
.map .cal-container[aria-expanded="false"] .cal-layer,
.map .cal-container[aria-expanded="false"] .cal-content{
display:none;
}
.map .cal-container[aria-expanded="true"] .cal-content{
display:block;
}
.map .cal-container .cal-layer{
display:none;
position:fixed;
left:0;
top:0;
width:100%;
height:100%;;
z-index:200;
}
.map .cal-container .cal-content{
z-index:201;
}
.map .cal-container .cal-content .cal-frame{
padding:10px 20px;
max-height:calc(100vh - 120px);
overflow:hidden;
overflow-y:auto;
}
.map .cal-container .cmn-calendar{
top:100%;
padding:8px 0;
border:1px solid #ccc;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.15);
box-shadow:0 1px 2px rgba(0,0,0,.15);
border-radius:4px;

}
.map .cal-container .cmn-calendar-header{
background-color:transparent;
color:var(--cmn-font-color-base);
margin:0 0 16px;
padding:0;
}
.map .cal-container .cal-date-undecided-btn{
position:absolute;
right:20px;
top:18px;
}

/* ----------------------------------------------------------------
  .map-pager
----------------------------------------------------------------- */
.map .map-pager{
margin:25px -4px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .map-pager > li{
margin:0 4px;
}
.map .map-pager > li > a{
padding:10px 0;
border:1px solid #bbb;
display:block;
border-radius:3px;
width:46px;
color:#555;
text-align:center;
text-decoration:none;
background-color:#fff;
}
.map .map-pager > li > a:active,
.map .map-pager > li > a:hover{
border-color:var(--outline-color);
}
.map .map-pager > .map-pager-current{
margin:0;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
text-align:center;
font-size:12px;
}
.map .map-pager > .map-pager-current:first-child{
margin-left:112px;
}
.map .map-pager > .map-pager-current:last-child{
margin-right:112px;
}
.map .map-pager > .map-pager-current span{
font-size:14px;
}
.map .map-pager > .map-pager-current > b{
display:block;
font-weight:normal;
}

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

  Error Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-view-content-error
----------------------------------------------------------------- */
.map .map-view-content-error{
padding:15px;
color:#fff;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;

/* transform: translate(50%, 50%); */
background-color:rgba(0, 0, 0, .6);
-webkit-box-sizing:border-box;
box-sizing:border-box;
z-index:1;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
}
.map .map-view-content-error > div{
text-align:center;
}

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

  Loading Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-view-loading
----------------------------------------------------------------- */
.map .map-view-loading{
margin:auto;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
width:24px;
height:24px;
}

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

  Map Filter

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-filter
----------------------------------------------------------------- */
/* .map-filter
----------------------------------------------- */
.map .map-filter{
padding:15px 20px;
min-height:45px;
z-index:3;
-webkit-box-shadow:0 3px 5px rgba(0,0,0,.3);
box-shadow:0 3px 5px rgba(0,0,0,.3);
display:-webkit-box;
display:-ms-flexbox;
display:flex;
background-color:#f5f5f5;
font-size:12px;
}

/* .map-filter-inr
----------------------------------------------- */
.map .map-filter > form:first-child{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}

/* ----------------------------------------------------------------
  .map-filter-row
----------------------------------------------------------------- */
/* .map-filter-row-top
----------------------------------------------- */
.map .map-filter-row-top{
margin-bottom:12px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}

/* ----------------------------------------------------------------
  .map-filter-btn-prev
----------------------------------------------------------------- */
.map .map-filter-btn-prev{
width:100px;
}
.map .map-filter-btn-prev button{
padding:4px;
border:none;
color:var(--font-color-btn-link);
width:78px;
background:none;
font-size:14px;
text-align:left;
}
.map .map-filter-btn-prev button:active,
.map .map-filter-btn-prev button:hover{
background-color:rgba(0,0,0,.04);
}

/* ----------------------------------------------------------------
  .map-filter-basic
----------------------------------------------------------------- */
/* .map-filter-basic
----------------------------------------------- */
.map .map-filter-basic{
border-radius:4px;
-webkit-box-shadow:0 1px 4px rgba(0,0,0,.24);
box-shadow:0 1px 4px rgba(0,0,0,.24);
height:45px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:stretch;
-ms-flex-align:stretch;
align-items:stretch;
background-color:#fff;
}

/* .map-filter-basic-input
----------------------------------------------- */
.map .map-filter-basic-input{
border-radius:4px 0 0 4px;
padding-left:1px;
width:262px;
height:100%;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-sizing:border-box;
box-sizing:border-box;
border-radius:4px;
position:relative;
z-index:200;
}
.map .map-filter-basic-input input{
padding:2px 16px;
border:none;
border-radius:4px;
height:100%;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
font-size:14px;
}
.map .map-filter-basic-input:active,
.map .map-filter-basic-input:hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color);
box-shadow:0 0 0 1px var(--outline-color);
}
.map .map-filter-basic-input button{
padding:0;
border:none;
color:rgba(0,0,0,0);
width:25px;
height:100%;
overflow:hidden;
background:transparent url(/element/shared/images/icon/icon-reset-line.svg) 0 center no-repeat;
background-size:9px;
-webkit-filter:opacity(60%);
filter:opacity(60%);
}
.map .map-filter-basic-input button:disabled{
display:none;
}

/* .map-filter-basic > .area
----------------------------------------------- */
.map .map-filter-basic .area{
padding-bottom:1px;
}

/* .map-filter-basic > .theme
----------------------------------------------- */
.map .map-filter-basic .theme{
width:257px;
position:relative;
padding:0 0 1px 1px;
}
.map .map-filter-basic .theme.is-unselected > button{
font-size:12px;
color:var(--font-color-placeholder);
}
.map .map-filter-basic .theme::before{
margin-top:-13px;
content:"";
display:block;
width:1px;
height:26px;
overflow:hidden;
position:absolute;
top:50%;
left:0px;
background-color:#ccc;
}
.map .map-filter-basic .theme > button{
padding:0 16px;
border:none;
border-radius:4px;
width:100%;
height:100%;
background:transparent;
text-align:left;
font-size:14px;
position:relative;
z-index:1;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
line-height:1;
color:var(--cmn-font-color-base);
}
.map .map-filter-basic .theme > button:active,
.map .map-filter-basic .theme > button:hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color);
box-shadow:0 0 0 1px var(--outline-color);
}

/* .map-filter-basic > .date
----------------------------------------------- */
.map .map-filter-basic .date-select{
width:112px;
position:relative;
padding-left:1px;
padding-bottom:1px;
}
.map .map-filter-basic .date-select::before{
margin-top:-13px;
content:"";
display:block;
width:1px;
height:26px;
overflow:hidden;
position:absolute;
top:50%;
left:0;
background-color:#ccc;
}
.map .map-filter-basic .date button{
border-radius:4px;
padding:0 16px 0 14px;
border:none;
width:100%;
height:100%;
background:transparent;
text-align:left;
font-size:14px;
position:relative;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
color:var(--cmn-font-color-base);
}
.map .map-filter-basic .date button:active,
.map .map-filter-basic .date button:hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color);
box-shadow:0 0 0 1px var(--outline-color);
}

/* ----------------------------------------------------------------
  .map-filter-keyword
----------------------------------------------------------------- */
/* .map-filter-keyword
----------------------------------------------- */
.map .map-filter-keyword{
margin-left:16px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .map-filter-keyword > label{
margin-right:8px;
}

/* .map-filter-keyword-input
----------------------------------------------- */
.map .map-filter-keyword-input{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map .map-filter-keyword-input > span{
border:1px solid #ccc;
width:255px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
background-color:#fff;
position:relative;
}
.map .map-filter-keyword-input input{
border:none;
height:36px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
padding-right:18px;
}
.map .map-filter-keyword-input input:active,
.map .map-filter-keyword-input input:hover,
.map .map-filter-keyword-input button:active,
.map .map-filter-keyword-input button:hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color);
box-shadow:0 0 0 1px var(--outline-color);
}
.map .map-filter-keyword-input button{
margin:0;
padding:0;
border:none;
color:rgba(0,0,0,0);
width:20px;
height:36px;
cursor:pointer;
background:transparent url(/element/shared/images/icon/icon-reset-line.svg) 5px center no-repeat;
background-size:9px;
-webkit-filter:opacity(60%);
filter:opacity(60%);
position:absolute;
right:0;
top:0;
}
.map .map-filter-keyword-input button:disabled{
display:none;
}

/* ----------------------------------------------------------------
  .map-filter-others
----------------------------------------------------------------- */
/* .map-filter-others
----------------------------------------------- */
.map .map-filter-others{
margin-left:16px;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map .map-filter-others.is-unselected > button{
background-color:#fff;
}
.map .map-filter-others > button{
padding:0;
border:1px solid #ccc;
border-radius:3px;
min-width:100px;
height:36px;
font-size:14px;
padding:0 8px;
color:var(--cmn-font-color-base);
background-color:#e4f2fb;
}
.map .map-filter-others > button > span{
background-color:#fff;
border-radius:50%;
font-size:11px;
width:16px;
height:16px;
display:-webkit-inline-box;
display:-ms-inline-flexbox;
display:inline-flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
color:var(--cmn-font-color-gray);
margin-left:4px;
vertical-align:middle;
}
.map .map-filter-others > button:active,
.map .map-filter-others > button:hover{
border-color:var(--outline-color);
}

/* ----------------------------------------------------------------
  .map-filter-inquiry
----------------------------------------------------------------- */
/* .map-filter-inquiry
----------------------------------------------- */
.map .map-filter-inquiry{
position:relative;
}

/* .map-filter-inquiry-hook
----------------------------------------------- */
.map .map-filter-inquiry-hook{
padding:0 12px 0 27px;
border:1px solid #bbb;
border-radius:4px;
color:var(--cmn-font-color-base);
-webkit-box-sizing:border-box;
box-sizing:border-box;
cursor:pointer;
line-height:43px;
background:url(/element/shared/images/frame/icon-inquiry.svg) 8px 50% no-repeat;
background-size:15px 14px;
background-color:#fff;
font-size:13px;
}
.map .map-filter-inquiry.branch .map-filter-inquiry-hook{
padding-left:36px;
border-radius:6px;
line-height:45px;
background-size:22px 20px;
font-size:14px;
}

/* .map-filter-inquiry-pulldown
----------------------------------------------- */
.map .map-filter-inquiry-pulldown{
padding:16px;
border-radius:6px;
position:absolute;
top:100%;
right:0;
width:284px;
z-index:152;
-webkit-box-sizing:border-box;
box-sizing:border-box;
-webkit-box-shadow:0 1px 4px rgba(0,0,0,.45);
box-shadow:0 1px 4px rgba(0,0,0,.45);
background-color:#eee;
}
.map .map-filter-inquiry[aria-expanded="false"] .map-filter-inquiry-pulldown{
display:none;
}
.map .map-filter-inquiry[aria-expanded="true"] .map-filter-inquiry-pulldown{
display:block;
}

/* .map-filter-inquiry-pulldown-list
----------------------------------------------- */
.map .map-filter-inquiry-pulldown-list > li:not(:first-child){
margin-top:12px;
}
.map .map-filter-inquiry-pulldown-list button{
margin:0;
padding:0;
border:1px solid #bbb;
border-radius:4px;
color:var(--cmn-font-color-base);
display:block;
width:100%;
min-height:34px;
background-color:#fff;
font-size:12px;
font-weight:bold;
}

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

  Map Filter Option

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-filter-option
----------------------------------------------------------------- */
/* .map-filter-option
----------------------------------------------- */
.map .map-filter-option{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
max-width:1200px;
}

/* .map-filter-option-inr
----------------------------------------------- */
.map .map-filter-option-inr{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .map-filter-option-inr.is-hidden{
display:none;
}
.map .map-filter-option-inr:not(.is-hidden) + .map-filter-option-inr{
margin-left:20px;
padding-left:16px;
position:relative;
}
.map .map-filter-option-inr:not(.is-hidden) +.map-filter-option-inr::before{
margin-top:-8px;
content:"";
display:block;
width:1px;
height:16px;
overflow:hidden;
position:absolute;
top:50%;
left:0;
background-color:#ccc;
}

/* .map-filter-option-hdg
----------------------------------------------- */
.map .map-filter-option-hdg{
margin-right:8px;
font-weight:normal;
white-space:nowrap;
}

/* .map-filter-option-list
----------------------------------------------- */
.map .map-filter-option-list{
color:var(--font-color-btn-link);
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
line-height:1;

}
.map .map-filter-option-list > li:not(:last-child){
margin-right:4px;
}
.map .map-filter-option-list label{
display:block;
position:relative;
}
.map .map-filter-option-list label:hover span,
.map .map-filter-option-list label:hover input:checked + span{
border:1px solid var(--outline-color);
}
.map .map-filter-option-list label > span{
padding:6px 8px;
border:1px solid #bbb;
border-radius:3px;
display:block;
max-width:137px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background-color:#fff;
}
.map .map-filter-option-list input{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
opacity:0;
}
.map .map-filter-option-list input:focus + span{
-webkit-box-shadow:0 0 0 1px var(--outline-color);
box-shadow:0 0 0 1px var(--outline-color);
}
.map .map-filter-option-list input:checked + span{
color:var(--cmn-font-color-base);
border-color:#ccc;
background-color:#e4f2fb;

}
.map .map-filter-option-list input:checked + span:hover{
border:1px solid var(--outline-color);
}

/* .map-filter-option-more
---------------------------------- */
.map .map-filter-option-more{
font-size:12px;
margin:0 4px;
position:relative;
top:-3px;
display:none !important;
}

/* .map-filter-option-spot > .map-filter-option-btn-more
---------------------------------- */
.map .map-filter-option-spot .map-filter-option-list label > span{
border-radius:14px;
}

/* .map-filter-option-btn-more
----------------------------------------------- */
.map .map-filter-option-btn-more{
margin:0 0 0 4px;
padding:0;
border:none;
background:transparent;
width:40px;
height:24px;
overflow:hidden;
position:relative;
top:1px;
font-size:0;
background:url(/element/j_optional_v2/shared/images/icon-chevrons-double-r.svg) center center no-repeat;
background-size:40px 10px;
border-radius:3px;
}
.map .map-filter-option-btn-more:hover{
background-color:rgba(0,0,0,.08);
}
.map [aria-expanded="true"] .map-filter-option-btn-more{
background-color:rgba(0,0,0,.08);
}
.map .map-filter-option-btn-more > span{
--cmn-dashed-font-color:var(--font-color-btn-link);
}

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

  Map Result

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-result
----------------------------------------------------------------- */
.map .map-result{
width:375px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
z-index:2;
position:relative;
-webkit-box-shadow:1px 0 5px rgba(0,0,0,.4);
box-shadow:1px 0 5px rgba(0,0,0,.4);
background-color:#f5f5f5;
}

/* ----------------------------------------------------------------
  .map-result-inr
----------------------------------------------------------------- */
.map .map-result-inr{
padding:2px 15px 0;
-webkit-box-sizing:border-box;
box-sizing:border-box;
position:absolute;
top:56px;
left:0;
width:100%;
height:calc(100% - 56px);
overflow-y:scroll;
-ms-scroll-chaining:none;
overscroll-behavior:none;
}
.map .map-result-inr .cmn-loading-spinner{
margin-top:80px;
margin-bottom:80px;
}

/* ----------------------------------------------------------------
  .map-result-header
----------------------------------------------------------------- */
/* .map-result-header
----------------------------------------------- */
.map .map-result-header{
padding:0 30px 0 15px;
height:56px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}

/* .map-result-header-num
----------------------------------------------- */
.map .map-result-header-num{
font-size:12px;
margin-right:24px;
}

/* .map-result-header-guide
----------------------------------------------- */
.map .map-result-header-guide{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
font-size:12px;
}
.map .map-result-header-guide .cmn-tip-btn{
margin-left:4px;
}

/* .map-result-header-sort
----------------------------------------------- */
.map .map-result-header-sort{
position:relative;
}
.map .map-result-header-sort .cmn-tip-btn{
margin-left:4px;
}

/* .map-result-header-sort-hook
----------------------------------------------- */
.map .map-result-header-sort-hook{
padding:8px 19px 7px 5px;
color:var(--font-color-btn-link);
border:none;
background:url(/element/j_optional_v2/map/images/icon-form-select.svg) calc(100% - 4px) 50% no-repeat;
background-size:7px 5px;
font-size:14px;
text-overflow:ellipsis;
white-space:nowrap;
width:130px;
overflow:hidden;
}
.map .map-result-header-sort-hook:active,
.map .map-result-header-sort-hook:hover{
background-color:rgba(0,0,0,.04);
}

/* .map-result-header-sort-pulldown
----------------------------------------------- */
.map .map-result-header-sort-pulldown{
padding:12px 16px;
border:1px solid #ccc;
border-radius:4px;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.15);
box-shadow:0 1px 2px rgba(0,0,0,.15);
display:none;
position:absolute;
top:95%;
right:50%;
-webkit-transform:translateX(50%);
transform:translateX(50%);
z-index:15;
min-width:200px;
background-color:#fff;
font-size:13px;
-webkit-box-sizing:border-box;
box-sizing:border-box;

}
.map .map-result-header-sort-pulldown .pulldown-btn-container{
position:relative;
height:14px;
}
.map .map-result-header-sort-pulldown .pulldown-btn-container .pulldown-btn-layer{
position:absolute;
right:-10px;
top:-10px;
height:48px;
z-index:1;
}
.map .map-result-header-sort-pulldown .pulldown-btn-container .pulldown-btn-layer .pulldown-close-btn{
margin:0;
padding:12px;
border:none;
background:none;
width:29px;
height:29px;
font-size:0;
background:url(/element_sp/j_optional_v2/shared/images/icon-close-gry.svg) center center no-repeat;
background-size:9px auto;
border-radius:50%;

}
.map .map-result-header-sort-pulldown .pulldown-btn-container .pulldown-btn-layer .pulldown-close-btn:active,
.map .map-result-header-sort-pulldown .pulldown-btn-container .pulldown-btn-layer .pulldown-close-btn:hover{
background-color:rgba(0,0,0,.04);
}
.map .map-result-header-sort[aria-expanded="true"] .map-result-header-sort-pulldown{
display:block;
}
.map .map-result-header-sort[aria-expanded="true"] .map-result-header-sort-hook{
background-color:rgba(0,0,0,.08);
}

/* .map-result-header-sort-pulldown-list
----------------------------------------------- */
.map .map-result-header-sort-pulldown-list label{
display:block;
position:relative;
padding:4px 0px 3px 22px;
font-size:14px;
white-space:nowrap;
}
.map .map-result-header-sort-pulldown-list label input{
position:absolute;
left:0px;
top:4px;
}
.map .map-result-header-sort-pulldown-list label:not([class]):active,
.map .map-result-header-sort-pulldown-list label:not([class]):hover{
-webkit-box-shadow:4px 0 0 rgba(0,0,0,.04),-4px 0 0 rgba(0,0,0,.04);
box-shadow:4px 0 0 rgba(0,0,0,.04),-4px 0 0 rgba(0,0,0,.04);
background-color:rgba(0,0,0,.04);
}
.map .map-result-header-sort-pulldown-list label .tool-select-list-cnt{
font-size:12px;
font-family:var(--font-num);
color:#666;
display:inline-block;
}
.map .map-result-header-sort-pulldown-list label.is-disabled{
opacity:.25;
cursor:default;
}
.map .map-result-header-sort-pulldown-list > li:not(:first-child){
margin-top:5px;
}

/* ----------------------------------------------------------------
  .map-result-error
----------------------------------------------------------------- */
.map .map-result-error{
margin-bottom:20px;
padding:15px;
line-height:1.55;
background-color:#fff;
font-size:14px;
}

/* ----------------------------------------------------------------
  .map-result-item
----------------------------------------------------------------- */
/* .map-result-item
----------------------------------------------- */
.map .map-result-item > li{
position:relative;
margin-bottom:10px;
border-radius:3px;
padding:8px;
-webkit-box-shadow:0 1px 4px rgba(0,0,0,.4);
box-shadow:0 1px 4px rgba(0,0,0,.4);
background-color:#fff;
cursor:pointer;
}
.map .map-result-item > li:active,
.map .map-result-item > li:hover,
.map .map-result-item > li.is-hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color), 0 1px 4px rgba(0,0,0,.4);
box-shadow:0 0 0 1px var(--outline-color), 0 1px 4px rgba(0,0,0,.4);
}
.map .map-result-item > li:active .map-result-item-plan-swiper-item .name > span,.map .map-result-item > li:hover .map-result-item-plan-swiper-item .name > span,.map .map-result-item > li:active .map-result-item-info-content-hdg > span,.map .map-result-item > li:hover .map-result-item-info-content-hdg > span{
background:-webkit-gradient(linear, left top, right top, color-stop(0, #bbb), to(#bbb)) repeat-x 0 100%;
background:linear-gradient(90deg, #bbb 0, #bbb 100%) repeat-x 0 100%;
background-size:100% 1px;
text-decoration:none !important;
}
.map .map-result-item > li.is-active{
-webkit-box-shadow:0 0 0 2px var(--outline-color),0 1px 8px rgba(0,0,0,.4);
box-shadow:0 0 0 2px var(--outline-color),0 1px 8px rgba(0,0,0,.4);
}

/* .map-result-item-info
----------------------------------------------- */
.map .map-result-item-info{
margin-bottom:8px;
position:relative;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:stretch;
-ms-flex-align:stretch;
align-items:stretch;
-webkit-box-orient:horizontal;
-webkit-box-direction:reverse;
-ms-flex-direction:row-reverse;
flex-direction:row-reverse;
height:85px;
}

/* .map-result-item-info-content
----------------------------------------------- */
.map .map-result-item-info-content{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}

/* .map-result-item-info-content-hdg
----------------------------------------------- */
.map .map-result-item-info-content-hdg{
margin-bottom:8px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.5;
font-size:14px;
font-weight:normal;

/* &:active,
  &:hover{
    & >span{
      background: linear-gradient(90deg, #bbb 0, #bbb 100%) repeat-x 0 94%;
      background-size:  100% 1px;
    }
  } */
}

/* .map-result-item-info-content-review
----------------------------------------------- */
.map .map-result-item-info-content-review{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
line-height:1;
font-size:0;
}
.map .map-result-item-info-content-review .cmn-tip-btn{
position:relative;
margin-left:4px;
vertical-align:middle;
top:0;
}

/* .map-result-item-info-content-review-rank
----------------------------------------------- */
.map .map-result-item-info-content-review-rank{
position:relative;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
top:-1px;
}
.map .map-result-item-info-content-review-rank .icon-r-face{
margin-right:4px;
}

/* .map-result-item-info-content-review-rank-label
----------------------------------------------- */
.map .map-result-item-info-content-review-rank-label{
position:relative;
font-size:14px;
font-weight:normal;
}
.map .map-result-item-info-content-review-rank-label .blank{
position:relative;
display:inline-block;
width:11px;
height:0;
padding-top:12px;
overflow:hidden;
line-height:2;
margin:0 4px 0 0;
}
.map .map-result-item-info-content-review-rank-label .blank::before{
position:absolute;
top:1px;
left:0;
content:"-";
display:block;
font-size:12px;
color:#999;
line-height:1;
}
.map  .map-result-item-info-content-review-rank-label .blank::after{
position:absolute;
top:1px;
right:0;
content:"-";
display:block;
font-size:12px;
color:#999;
line-height:1;
}

/* .map-result-item-info-content-review-label
----------------------------------------------- */
.map .map-result-item-info-content-review-label{
font-weight:normal;
font-size:12px;
margin-left:8px;
}

/* .map-result-item-info-thumb
----------------------------------------------- */
.map .map-result-item-info-thumb{
margin:-8px 8px 0 -8px;
border-radius:3px 0 3px 0;
position:relative;
width:112px;
height:85px;
overflow:hidden;

}
.map .map-result-item-info-thumb:hover .help{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
}
.map .map-result-item-info-thumb .help{
display:none;
-webkit-box-align:end;
-ms-flex-align:end;
align-items:flex-end;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
padding-bottom:4px;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
color:#fff;
font-size:12px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
border-radius:0 0 3px 0px;
background:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#000));
background:linear-gradient(rgba(0, 0, 0, 0) 0%, #000 100%);
}
.map .map-result-item-info-thumb .guard{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
}
.map .map-result-item-info-thumb img{
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover;
}
.map .map-result-item-info-thumb.nophoto{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
}
.map .map-result-item-info-thumb.nophoto img{
width:80%;
height:80%;
}

/* .map-result-item-info-thumb-gallery
----------------------------------------------- */
.map .map-result-item-info-thumb-gallery{
margin:0;
padding:4px 18px 3px 2px;
border:none;
border-radius:3px;
color:#fff;
width:39px;
overflow:hidden;
position:absolute;
top:7px;
right:6px;
z-index:1;
font-size:11px;
background:rgba(0,0,0,.45) url(/element/j_optional_v2/map/images/icon-gallery.svg) no-repeat 85% 50%;
background-size:12px 10px;
}
.map .map-result-item-info-thumb-gallery:active,
.map .map-result-item-info-thumb-gallery:hover{
/* background-color:rgba(0,0,0,.16); */
}

/* .map-result-item-plan
----------------------------------------------- */
.map .map-result-item-plan{
margin:4px 0;
position:relative;
height:102px;
}

/* .map-result-item-plan-num
----------------------------------------------- */
.map .map-result-item-plan-num{
margin:0;
padding:3px 0 2px;
border:none;
border-radius:6px;
width:52px;
height:24px;
-webkit-box-shadow:0 0 4px rgba(0,0,0,.2);
box-shadow:0 0 4px rgba(0,0,0,.2);
position:absolute;
top:9px;
right:16px;

/* for iPad */
-webkit-transform:translateZ(1px);
transform:translateZ(1px);
z-index:2;
background-color:#fff;
font-size:12px;
color:var(--cmn-font-color-base);
}
.map .map-result-item-plan-num:active,
.map .map-result-item-plan-num:hover{
background-color:rgba(0,0,0,.04);
}

/* .map-result-item-plan-swiper
----------------------------------------------- */
.map .map-result-item-plan-swiper{
margin:0 -8px;
padding:0;
position:relative;
overflow:hidden;
font-size:12px;
}

/* .map-result-item-plan-swiper-nav
----------------------------------------------- */
.map .map-result-item-plan-swiper-nav > li{
margin-top:-20px;
position:absolute;
top:50%;

/* for iPad */
-webkit-transform:translateZ(1px);
transform:translateZ(1px);
z-index:2;
}
.map .map-result-item-plan-swiper-nav > li button{
margin:0;
padding:0;
border:none;
color:rgba(0,0,0,0);
width:40px;
height:40px;
border-radius:50%;
-webkit-box-shadow:0 0 3px rgba(0,0,0,.4);
box-shadow:0 0 3px rgba(0,0,0,.4);
background-color:#fff;
}
.map .map-result-item-plan-swiper-nav > li button:active,
.map .map-result-item-plan-swiper-nav > li button:hover{
background-color:#f1f1f1;
}
.map .map-result-item-plan-swiper-nav > li button::before{
content:"";
display:block;
width:7px;
height:12px;
overflow:hidden;
position:absolute;
bottom:50%;
right:9px;
-webkit-transform:translateY(50%);
transform:translateY(50%);
-webkit-filter:brightness(20%);
filter:brightness(20%);
background:url(/element/shared/images/icon/icon-chevron-left.svg) 50% 50% no-repeat;
}
.map .map-result-item-plan-swiper-nav > li.next{
right:-20px;
}
.map .map-result-item-plan-swiper-nav > li.prev{
left:-20px;
}
.map .map-result-item-plan-swiper-nav > li.next button::before{
right:auto;
left:10px;
-webkit-transform:translateY(50%) rotate(175deg);
transform:translateY(50%) rotate(175deg);
}
.map .map-result-item-plan-swiper-nav [aria-disabled="true"]{
display:none;
}

/* .map-result-item-plan-swiper-item
----------------------------------------------- */
.map .map-result-item-plan-swiper-item{
overflow:hidden;
padding:0 16px;

/* for iPad */
position:relative;
}
.map .map-result-item-plan-swiper-item > ul{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:stretch;
-ms-flex-align:stretch;
align-items:stretch;
}
.map .map-result-item-plan-swiper-item > ul > li{
padding:8px;
border:1.6px solid #ddd;
border-radius:6px;
height:100px;
margin:1px 0;
-webkit-box-sizing:border-box;
box-sizing:border-box;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-direction:column;
flex-direction:column;
position:relative;
left:-1px;
}
.map .map-result-item-plan-swiper-item .name{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.4;

/* &:active,
  &:hover{
    & > span{
      background: linear-gradient(90deg, #bbb 0, #bbb 100%) repeat-x 0 94%;
      background-size:  100% 1px;
    }
  } */
}
.map .map-result-item-plan-swiper-item .sup{
margin:auto 0 4px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.map .map-result-item-plan-swiper-item .price{
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .map-result-item-plan-swiper-item .price b{
display:inline-block;
line-height:1;
font-size:18px;
}
.map .map-result-item-plan-swiper-item .price button{
margin-left:8px;
padding:3px 3px 2px;
border:1px solid #bbb;
border-radius:3px;
background-color:#fff;
font-size:12px;
color:var(--cmn-font-color-base);
}
.map .map-result-item-plan-swiper-item .price button:hover{
background-color:rgba(0,0,0,.04);
}
.map .map-result-item-plan-swiper-item .price button:active,
.map .map-result-item-plan-swiper-item .price button.is-active{
background-color:rgba(0,0,0,.08);
}
.map .map-result-item-plan-num + .map-result-item-plan-swiper .name{
margin-right:60px;
}

/* .map-result-item-footer
----------------------------------------------- */
.map .map-result-item-footer{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:end;
-ms-flex-pack:end;
justify-content:flex-end;
font-size:12px;
}

/* .map-result-item-footer
----------------------------------------------- */
.map .map-result-item-footer-agt{
position:relative;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map .map-result-item-footer-agt .map-result-item-footer-agt-name{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .map-result-item-footer-agt .map-result-item-footer-agt-name a{
max-width:156px;
display:inline-block;
padding:4px;
text-decoration:none;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.map .map-result-item-footer-agt .map-result-item-footer-agt-name a:hover{
background-color:rgba(0,0,0,.04);
}
.map .map-result-item-footer-agt .map-result-item-footer-agt-name a:active,
.map .map-result-item-footer-agt .map-result-item-footer-agt-name a.is-active{
background-color:rgba(0,0,0,.08);
}

/* .map-result-item-footer-status
----------------------------------------------- */
.map .map-result-item-footer-status > span{
display:block;
text-align:center;
}
.map .map-result-item-footer-status > .icon{
margin:0 auto;
padding-top:11px;
border:1px solid var(--cmn-font-color-base);
border-radius:50%;
display:block;
width:11px;
height:0;
overflow:hidden;
}

/* .map-result-item-footer-cv
----------------------------------------------- */
.map .map-result-item-footer-cv{
display:block;
margin-left:8px;
padding:5px 0 4px;
border:none;
border-radius:3px;
color:#fff !important;
width:90px;
background-color:var(--cmn-btn-color);
text-align:center;
text-decoration:none;
}
.map .map-result-item-footer-cv:active,
.map .map-result-item-footer-cv:hover{
background-color:#67a700;
}

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

  Map View Modules

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-view
----------------------------------------------------------------- */
.map .map-view{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
position:relative;
}

/* ----------------------------------------------------------------
  .map-view-gm
----------------------------------------------------------------- */
.map .map-view-gm{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
-webkit-box-sizing:border-box;
box-sizing:border-box;
background-color:#acdafd;
}

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

  Map View Marker

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-view-marker
----------------------------------------------------------------- */
/* .map-view-marker-pin
---------------------------------- */
.map-view-marker-pin{
color:rgba(0, 0, 0, 0);
display:block;
width:16px;
height:37px;
overflow:hidden;
background:url(/element/j_optional_v2/map/images/icon-pin.svg) no-repeat 0 100%;
background-size:16px auto;
cursor:pointer;
}
.map-view-marker-pin.is-hover{
background:url(/element/j_optional_v2/map/images/icon-pin-hover.svg) no-repeat 0 100%;
}

/* .map-view-marker-airport
---------------------------------- */
.map-view-marker-airport{
color:rgba(0, 0, 0, 0);
width:26px;
height:36px;
background-repeat:no-repeat;
background-position:0 100%;
background-image:url(/element/j_optional_v2/map/images/icon-pin-airport.svg);
}

/* .map-view-marker-hotel
---------------------------------- */
.map-view-marker-hotel{
color:rgba(0, 0, 0, 0);
width:26px;
height:36px;
background-repeat:no-repeat;
background-position:0 100%;
background-image:url(/element/j_optional_v2/map/images/icon-pin-hotel.svg);
}

/* .map-view-marker-station
---------------------------------- */
.map-view-marker-station{
color:rgba(0, 0, 0, 0);
width:26px;
height:36px;
background-repeat:no-repeat;
background-position:0 100%;
background-image:url(/element/j_optional_v2/map/images/icon-pin-station.svg);
}

/* .map-view-marker-spot.is-multiple
---------------------------------- */
.map-view-marker-spot .cmn-loading-spinner-dot,
.map-view-marker-spot .cmn-loading-spinner-dot-wht{
margin:0 auto;
width:11px;
height:11px;
}
.map-view-marker-spot.is-multiple::before{
content:"";
border:1px solid #777;
border-radius:5px;
display:block;
width:100%;
height:100%;
-webkit-box-sizing:border-box;
box-sizing:border-box;
overflow:hidden;
position:absolute;
top:-2px;
left:2px;
background-color:#e2e2e2;
}
.map-view-marker-spot.is-spot-active .map-view-marker-spot-content{
min-width:30px;
max-width:120px;
height:27px;
}
.map-view-marker-spot.is-spot-active .map-view-marker-spot-content span{
font-size:16px;
}
.map-view-marker-spot .map-view-marker-spot-content{
padding:5px 4px 2px;
border:1px solid #777;
border-radius:5px;
color:var(--cmn-font-color-base);
-webkit-box-sizing:border-box;
box-sizing:border-box;
min-width:30px;
max-width:92px;
height:22px;
line-height:1;
position:relative;
background-color:#fff;
font-size:12px;
text-align:center;
cursor:pointer;
}
.map-view-marker-spot .map-view-marker-spot-content span{
display:inline-block;
min-width:20px;
font-size:12px;
}
.map-view-marker-spot .map-view-marker-spot-content span.sup{
display:block;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
position:relative;
line-height:1.2;
top:-1px;
}
.map-view-marker-spot .map-view-marker-spot-content::before{
margin-left:-5px;
content:"";
border-width:0 1px 1px 0;
border-style:solid;
border-color:#777;
display:block;
width:8px;
height:8px;
position:absolute;
top:calc(100% - 4px);
left:50%;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
background-color:#fff;
}
.map-view-marker-spot-content .price{
display:block;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
}

/* .is-active > .map-view-marker-spot-content
---------------------------------- */
.map-view-marker-spot.is-active .map-view-marker-spot-content{
color:var(--cmn-font-color-base);
border-color:var(--cmn-btn-color);
background-color:#d8eeff;
}
.map-view-marker-spot.is-active .map-view-marker-spot-content::before{
border-color:var(--cmn-btn-color);
background-color:#d8eeff;
}

/* .is-selected > .map-view-marker-spot-content
---------------------------------- */
.map-view-marker-spot.is-selected .map-view-marker-spot-content{
border-color:#ef6060;
background-color:#fcbdbd;
}
.map-view-marker-spot.is-selected.is-hover .map-view-marker-spot-content{
border-color:#ef6060;
background-color:#ffefef;
}
.map-view-marker-spot.is-selected .map-view-marker-spot-content::before{
border-color:#ef6060;
background-color:#fcbdbd;
}
.map-view-marker-spot.is-selected.is-hover .map-view-marker-spot-content::before{
border-color:#ef6060;
background-color:#ffefef;
}

/*    map-tooltip-payment
----------------------------------------------------------------- */
.map-tooltip-payment-container{
position:absolute;
z-index:11;
display:none;
}
.map-tooltip-payment-container.is-active{
display:block;
}
.map-tooltip-payment-container .tooltip-payment{
display:block;
top:auto;
right:auto;
position:relative;
font-size:12px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
width:411px;
padding:12px;
color:var(--cmn-font-color-base);
border:1px solid #b5b5b5;
border-radius:4px;
background-color:#fff;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.15);
box-shadow:0 1px 2px rgba(0,0,0,.15);
z-index:auto;
}
.map-tooltip-payment-container .tooltip-footer{
margin-top:8px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:end;
-ms-flex-pack:end;
justify-content:flex-end;
}
.map-tooltip-payment-container .tooltip-cv-btn{
display:block;
margin-left:8px;
padding:5px 0 4px;
border:none;
border-radius:3px;
color:#fff;
width:90px;
background-color:var(--cmn-btn-color);
text-align:center;
text-decoration:none;
font-size:12px;
}

/* .map-tooltip-payment-list
----------------------------------------------- */
.map-tooltip-payment-list > li{
overflow:hidden;
font-size:12px;
line-height:1.6;
}
.map-tooltip-payment-list > li:not(:first-child){
margin-top:4px;
}
.map-tooltip-payment-list .payment-head{
position:relative;
float:left;
width:4em;
padding-right:1em;
}
.map-tooltip-payment-list .payment-head::after{
position:absolute;
top:0;
right:0;
display:block;
content:"\ff1a";
}
.map-tooltip-payment-list .payment-item{
overflow:hidden;
color:#ccc;
}
.map-tooltip-payment-list .payment-item strong{
font-weight:normal;
color:var(--cmn-font-color-base);
}
.map-tooltip-payment-list .payment-item-image{
display:inline-block;
position:relative;
top:-2px;
}
.map-tooltip-payment-list .payment-item-image img{
vertical-align:middle;
height:13px;
width:auto;
margin-left:3px;
}

/* .map-tooltip-payment-note-list
----------------------------------------------- */
.map-tooltip-payment-note-list{
font-size:12px;
margin-top:6px;
padding-top:8px;
border-top:1px solid #ccc;
}
.map-tooltip-payment-note-list > li{
position:relative;
margin-top:2px;
padding-left:1em;
color:var(--cmn-font-color-gray);
}
.map-tooltip-payment-note-list > li::before{
position:absolute;
top:3px;
left:-1px;
display:block;
content:"\203B";
line-height:1;
}
.map-tooltip-payment-note-list > li:first-child{
margin-top:0;
}

/* map-tooltip-calnder-container
---------------------------------- */
.map-tooltip-calnder-container{
position:absolute;
z-index:11;
display:none;



}
.map-tooltip-calnder-container.is-active{
display:block;
}
.map-tooltip-calnder-container .tip-calendar-info{
position:absolute;
text-align:left;
padding:20px;
top:auto;
left:auto;
background-color:#fff;
width:397px;
border-radius:3px;
background:#fff;
border:1px solid #b5b5b5;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.15);
box-shadow:0 1px 2px rgba(0,0,0,.15);
color:var(--cmn-font-color-base);
}
.map-tooltip-calnder-container .tip-calendar-info >:first-child{
margin-top:0;
}
.map-tooltip-calnder-container .calendar-info-price{
position:relative;
margin-top:6px;
}
.map-tooltip-calnder-container .calendar-info-price-list{
font-size:12px;
}
.map-tooltip-calnder-container .calendar-info-price-list > li{
word-break:break-all;
overflow-wrap:break-word;
}
.map-tooltip-calnder-container .calendar-info-price-list > li > span .mod-num{
font-size:13px;
}
.map-tooltip-calnder-container .calendar-info-price-list > li > span:first-child{
position:relative;
display:inline;
}
.map-tooltip-calnder-container .calendar-info-price-list > li > span:first-child::after{
content:":";
display:inline-block;
margin-right:4px;
margin-left:10px;
}
.map-tooltip-calnder-container .calendar-info-price-list > li > span:last-child{
display:inline-block;
}
.map-tooltip-calnder-container .calendar-info-option-price{
margin-top:12px;
}
.map-tooltip-calnder-container .calendar-info-option-price-hdg{
font-size:12px;
}
.map-tooltip-calnder-container .calendar-info-option-price-list > li{
font-size:12px;
word-break:break-all;
overflow-wrap:break-word;
line-height:1.4;
}
.map-tooltip-calnder-container .calendar-info-option-price-list > li > span .mod-num{
font-size:14px;
}
.map-tooltip-calnder-container .calendar-info-option-price-list > li > span:first-child:not(:empty){
position:relative;
display:inline;

/* min-width:60px; */
}
.map-tooltip-calnder-container .calendar-info-option-price-list > li > span:first-child:not(:empty)::after{
content:":";
display:inline-block;
margin-right:4px;
margin-left:10px;
}
.map-tooltip-calnder-container .calendar-info-option-price-list > li > span:last-child{
display:inline-block;
}
.map-tooltip-calnder-container .calendar-info-row{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:end;
-ms-flex-pack:end;
justify-content:flex-end;
}
.map-tooltip-calnder-container .calendar-info-special{
margin-top:12px;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map-tooltip-calnder-container .calendar-info-agt{
max-width:50%;
}
.map-tooltip-calnder-container .calendar-info-agt .calendar-info-agt-list >li{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
font-size:12px;
line-height:1.6;
}
.map-tooltip-calnder-container .calendar-info-agt .calendar-info-agt-list >li > span:first-child{
white-space:nowrap;
}
.map-tooltip-calnder-container .calendar-info-agt .calendar-info-agt-list >li > span:first-child::after{
content:":";
display:inline-block;
margin:0 3px;
}
.map-tooltip-calnder-container .calendar-info-payment{
margin-top:12px;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-list{
border-top:1px solid #ddd;
padding-top:8px;
margin-top:8px;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide{
margin-top:10px;
color:var(--cmn-font-color-gray);
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide > li{
display:inline-block;
position:relative;
font-size:12px;
text-indent:-1.4em;
margin-left:1.4em;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide .tooltip-payment-guide-child{
margin-left:2px;
margin-top:8px;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide .tooltip-payment-guide-child > li{
font-size:12px;
text-indent:-.4em;
padding-left:.8em;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide .tooltip-payment-guide-child > li:not(:first-child){
margin-top:4px;
}
.map-tooltip-calnder-container .calendar-info-payment .tooltip-payment-guide .tooltip-payment-guide-child > li::before{
display:inline-block;
width:.4em;
content:"\00B7";
}
.map-tooltip-calnder-container .calendar-info-special-hdg{
font-size:12px;
}
.map-tooltip-calnder-container .calendar-info-special-desc{
word-break:break-all;
overflow-wrap:break-word;
font-size:12px;
}
.map-tooltip-calnder-container .calendar-info-footer{
margin-top:15px;
}
.map-tooltip-calnder-container .calendar-info-att{
font-size:12px;
position:relative;
padding-left:20px;
}
.map-tooltip-calnder-container .calendar-info-att::before{
content:"";
display:inline-block;
position:absolute;
top:1px;
left:0;
width:16px;
height:14px;
background-image:url(/element/shared/images/icon/icon-caution-triangle-red.svg);
background-repeat:no-repeat;
background-size:100%;
}
.map-tooltip-calnder-container .tip-cv-btn-item{
text-align:right;
margin-top:10px;
}
.map-tooltip-calnder-container .tip-cv-btn-item .tip-cv-btn{
display:inline-block;
margin-left:8px;
padding:5px 0 4px;
border:none;
border-radius:3px;
color:#fff;
width:90px;
background-color:var(--cmn-btn-color);
text-align:center;
text-decoration:none;
font-size:12px;
-webkit-box-shadow:none;
box-shadow:none;
text-shadow:none;
font-weight:normal;
height:auto;
min-height:auto;
min-width:auto;
}
.map-tooltip-calnder-container .calendar-info-note{
font-size:11px;
margin-top:8px;
}

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

  Map View Detail

----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  .map-view-detail
----------------------------------------------------------------- */
/* .map-view-detail
----------------------------------------------- */
.map .map-view-layer{
display:none;
content:"";
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
background-color:rgba(0,0,0,.5);
z-index:10;
}
.map .map-view-layer.is-map-view-active{
display:block;
}
.map .map-result.is-map-view-active{
z-index:11;
}
.map .map-result.is-map-view-active::before{
position:absolute;
top:0;
left:-3px;
content:"";
display:block;
width:calc(100% + 6px);
height:8px;
-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.3);
box-shadow:inset 0 3px 5px rgba(0,0,0,.3);
}
.map .map-view-detail{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
display:none;
position:absolute;
top:40px;
left:calc(375px + 70px);
z-index:10;
width:790px;
height:780px;
max-height:calc(100vh - 80px);
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-direction:column;
flex-direction:column;
-webkit-box-shadow:0 4px 6px rgba(0,0,0,.3);
box-shadow:0 4px 6px rgba(0,0,0,.3);
background-color:#fff;
}
.map .map-view-detail.is-active{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
}
.map .map-view-detail .map-view-detail-loading .cmn-loading-spinner{
margin-top:210px;
}
.map .map-view-detail .search-result-loading .cmn-loading-spinner{
margin-top:60px;
}

/* ----------------------------------------------------------------
  .map-view-detail-header
----------------------------------------------------------------- */
/* .map-view-detail-header
----------------------------------------------- */
.map .map-view-detail-header{
position:relative;
z-index:1;
min-height:130px;
}
.map .map-view-detail-header::before{
content:"";
display:block;
width:100%;
height:8px;
overflow:hidden;
position:absolute;
bottom:-8px;
left:0;
background:-webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(0,0,0,.18)), to(transparent));
background:linear-gradient(rgba(0,0,0,.18) 10%, transparent 100%);
}

/* .map-view-detail-header-hdg
----------------------------------------------- */
.map .map-view-detail-header-hdg{
margin:12px 56px 0 20px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
font-size:16px;
}

/* .map-view-detail-header-hdg
----------------------------------------------- */
.map .map-view-detail-header-sup{
margin:4px 56px 0 20px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
font-size:14px;
}

/* .map-view-detail-header-tab
----------------------------------------------- */
.map .map-view-detail-header-tab{
margin:0px 20px 6px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:stretch;
-ms-flex-align:stretch;
align-items:stretch;
}
.map .map-view-detail-header-tab .map-view-detail-tab-photo{
position:relative;
display:block;
background:none;
border:none;
font-family:Arial;
line-height:1.2;
border:1px solid #bbb;
border-radius:3px;
height:22px;
min-width:49px;
padding:4px 20px 4px 5px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
font-size:12px;
}
.map .map-view-detail-header-tab .map-view-detail-tab-photo::after{
content:"";
display:block;
width:13px;
height:11px;
background:url(/element/j_optional_v2/shared/images/icon-more-image-gry.svg) 0 0 no-repeat;
background-size:100% auto;
position:absolute;
right:4px;
top:5px;
}
.map .map-view-detail-header-tab > li{
height:30px;
}
.map .map-view-detail-header-tab >li:not(:first-child){
margin-left:28px;
}
.map .map-view-detail-header-tab button{
padding:0;
border:none;
width:100%;
height:100%;
line-height:1.25;
position:relative;
background:none;
font-size:12px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
padding-top:4px;
color:var(--cmn-font-color-base);
}
.map .map-view-detail-header-tab button[aria-selected="true"]{
color:var(--cmn-font-color-base);
}
.map .map-view-detail-header-tab button[aria-selected="true"]::before{
content:"";
display:block;
width:100%;
height:3px;
overflow:hidden;
position:absolute;
bottom:0;
left:0;
background-color:var(--outline-color);
}

/* .map-view-detail-header-btn
----------------------------------------------- */
.map .map-view-detail-header-btn{
padding:0;
border:none;
color:rgba(0,0,0,0);
position:absolute;
top:4px;
right:4px;
width:48px;
height:48px;
background:url(/element/j_optional_v2/map/images/icon-x.svg) center center no-repeat;
background-size:12px 12px;
overflow:hidden;
border-radius:50%;
}
.map .map-view-detail-header-btn:hover{
background-color:#f1f1f1;
}

/* .map-view-detail-header-summary
---------------------------------- */
.map-view-detail-header-summary{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
font-size:12px;
margin:1px 30px 0 20px;
}
.map-view-detail-header-summary .item-detail-action{
width:150px;
margin-left:4px;
}
.map-view-detail-header-summary .item-detail-action .search-item-action-cv{
margin-right:0;
}
.map-view-detail-header-summary .item-detail-action .search-item-action-cv .search-item-action-btn{
-webkit-box-shadow:none;
box-shadow:none;
text-shadow:none;
padding-top:10px;
}
.map-view-detail-header-summary .item-detail-action .search-item-action-cv .search-item-action-btn b{
font-weight:normal;
}
.map-view-detail-header-summary .plan-item{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map-view-detail-header-summary .plan-item .plan-agt{
margin-right:8px;
max-width:144px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.map-view-detail-header-summary .plan-item .plan-sup{
max-width:144px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
margin-right:8px;
}
.map-view-detail-header-summary .plan-item .plan-date{
max-width:61px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
margin-right:8px;
}
.map-view-detail-header-summary .plan-item .plan-price{
display:inline-block;
font-size:12px;
white-space:nowrap;
margin-right:4px;
}
.map-view-detail-header-summary .plan-item .plan-price .mod-num{
font-size:18px;
font-weight:bold;
}
.map-view-detail-header-summary .plan-item .plan-btn{
display:inline-block;
margin:0;
padding:3px 3px 2px;
border:1px solid #bbb;
border-radius:3px;
background-color:#fff;
font-size:12px;
white-space:nowrap;
color:var(--cmn-font-color-base);
}
.map-view-detail-header-summary .plan-item .plan-btn:hover{
background-color:rgba(0,0,0,.04);
}
.map-view-detail-header-summary .plan-item .plan-btn:active,
.map-view-detail-header-summary .plan-item .plan-btn.is-active{
background-color:rgba(0,0,0,.08);
}

/* ----------------------------------------------------------------
  .map-view-detail-content
----------------------------------------------------------------- */
/* .map-view-detail-content
----------------------------------------------- */
.map .map-view-detail-content{
padding:20px 30px 30px;
line-height:1.55;
overflow-y:scroll;
scrollbar-width:none;
font-size:12px;
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map .map-view-detail-content::-webkit-scrollbar{
display:none;
}

/* .map-view-detail-content > div
----------------------------------------------- */
.map .map-view-detail-content > [role="tabpanel"]{
display:none;
}
.map .map-view-detail-content > [role="tabpanel"].is-active{
display:block;
}

/* .map .map-view-detail-content .dtl-review-card-list
---------------------------------- */
.map .map-view-detail-content .dtl-header{
border:none;
padding-top:4px;
}
.map .map-view-detail-content .dtl-review-sorter-list > li button{
border-bottom:solid 3px transparent;
height:26px;
color:var(--cmn-font-color-base);
}
.map .map-view-detail-content .dtl-review-sorter-list >li.is-active button{
position:relative;
font-weight:normal;
border-color:#338cd5;
}
.map .map-view-detail-content .dtl-review-content-header{
padding-bottom:6px;
}
.map .map-view-detail-content .dtl-review-content-header .dtl-review-header .dtl-review-header-col >:first-child{
width:335px;
}
.map .map-view-detail-content .dtl-review-footer{
margin-top:20px;
}
.map .map-view-detail-content .dtl-item.dtl-item-agt{
margin-top:0;
}

/* ----------------------------------------------------------------
  .map-view-detail-footer
----------------------------------------------------------------- */
/* .map-view-detail-footer
----------------------------------------------- */
.map .map-view-detail-footer{
padding:8px 10px 10px;
position:relative;
font-size:11px;
}
.map .map-view-detail-footer::before{
content:"";
display:block;
width:100%;
height:8px;
overflow:hidden;
position:absolute;
top:-8px;
left:0;
background:-webkit-gradient(linear, left top, left bottom, color-stop(10%, transparent), to(rgba(0,0,0,.18)));
background:linear-gradient(transparent 10%, rgba(0,0,0,.18) 100%);
}

/* ----------------------------------------------------------------
  .map-view-detail-plan-item
----------------------------------------------------------------- */
/* .map-view-detail-plan-item
----------------------------------------------- */
/* .map .cmn-tip-agt
---------------------------------- */
/* .map .cmn-tip-agt{
  width:312px;
  padding:12px;
  & .cmn-tip-agt-header{
    & .cmn-tip-agt-hdg{
      font-size:14px;
    }
  }
  & .cmn-tip-agt-btn{
    margin: 5px auto;
    padding: 4px 8px;
    border: 1px solid #bbb;
    border-radius: 3px;
    color: #666;
    display: block;
    min-height: 30px;
    background-color: #fff;
    font-size: 12px;
  }
  & .cmn-tip-agt-link:before{
    top:4px;
  }
  & .tip-agt-close-btn{
    position: absolute;
    top:4px;
    right:4px;
    margin: 0;
    padding: 12px;
    border: none;
    background: none;
    width: 29px;
    height: 29px;
    font-size: 0;
    background: url(/element_sp/j_optional_v2/shared/images/icon-close-gry.svg) center center no-repeat;
    background-size: 9px auto;
    border-radius: 50%;
    &:active,
    &:hover{
      background-color:rgba(0,0,0,.04);
    }
  }
} */
/* .map .popup-price-dtl-container
----------------------------------------------- */
.map .map-result-inr .popup-price-dtl-container{
width:300px;
}
.map .map-result-inr .price-dtl-header{
display:block;
}
.map .map-result-inr .price-dtl-close-btn{
display:block;
}
.map .map-price-detail-container .popup-price-dtl-container{
width:398px;
}
.map .map-price-detail-container .price-dtl-header{
display:block;
}
.map .map-price-detail-container .price-dtl-close-btn{
display:block;
}
.map .popup-price-dtl-container{
display:none;
position:absolute;
padding:12px;
border:1px solid #aaa;
border-radius:4px;
background-color:#fff;
-webkit-box-shadow:0 3px 4px 0 rgba(215, 215, 215, .75);
box-shadow:0 3px 4px 0 rgba(215, 215, 215, .75);

/* for iPad */
-webkit-transform:translateZ(1px);
transform:translateZ(1px);
z-index:10;
width:300px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
cursor:default;
}
.map .popup-price-dtl-container.is-active{
display:block;
}
.map .popup-price-dtl-container .popup-price-dtl-tip{
position:absolute;
top:-25px;
width:57px;
height:22px;
cursor:pointer;
pointer-events:none;
}
.map .popup-price-dtl-container .popup-price-dtl-tip::before{
display:block;
position:absolute;
content:"";
top:16px;
left:50%;
margin-left:-8px;
z-index:2;
border:9px solid #aaa;
border-top:none;
border-right:8px solid transparent;
border-left:8px solid transparent;
}
.map .popup-price-dtl-container .popup-price-dtl-tip::after{
display:block;
position:absolute;
content:"";
top:17px;
left:50%;
margin-left:-8px;
z-index:3;
border:9px solid #fff;
border-top:none;
border-right:8px solid transparent;
border-left:8px solid transparent;
}
.map .popup-price-dtl-container .price-dtl-header{
padding-right:37px;
margin-bottom:8px;
font-size:14px;
}
.map .popup-price-dtl-container .price-dtl-close-btn{
position:absolute;
top:4px;
right:4px;
margin:0;
padding:12px;
border:none;
background:none;
width:29px;
height:29px;
font-size:0;
background:url(/element_sp/j_optional_v2/shared/images/icon-close-gry.svg) center center no-repeat;
background-size:9px auto;
border-radius:50%;

}
.map .popup-price-dtl-container .price-dtl-close-btn:active,
.map .popup-price-dtl-container .price-dtl-close-btn:hover{
background-color:rgba(0,0,0,.04);
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-loading{
height:69px;
padding:26px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-loading .cmn-loading-spinner-dot{
width:16px;
height:16px;
margin:0 auto;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date{
position:relative;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date::before,
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date::after{
top:0;
content:"";
display:block;
position:absolute;
width:10px;
height:100%;
z-index:2;
pointer-events:none;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date::before{
left:0;

/* background:linear-gradient(to left, rgba(245, 245, 245, 0) 0%, #fff 100%); */
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date::after{
right:0px;

/* background:linear-gradient(to right, rgba(245, 245, 245, 0) 0%, #fff 100%); */
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date.is-start::before{
display:none;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date.is-end::after{
display:none;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-inner{
max-width:100%;
display:inline-block;
overflow:hidden;
overflow-x:scroll;
vertical-align:top;
-webkit-box-sizing:border-box;
box-sizing:border-box;
scrollbar-width:none;
-ms-overflow-style:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-inner::-webkit-scrollbar{
display:none;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list{
-webkit-box-sizing:border-box;
box-sizing:border-box;
white-space:nowrap;
font-size:0;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li{
display:-webkit-inline-box;
display:-ms-inline-flexbox;
display:inline-flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
margin:1px 0;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li:not(:last-child){
margin-right:4px;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li button{
-webkit-box-sizing:border-box;
box-sizing:border-box;
width:48px;
padding:5px 0 4px;
border:none;
background:none;
border:1px solid #ddd;
border-radius:4px;
font-size:12px;
outline:none;
color:var(--cmn-font-color-base);
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .date{
display:inline-block;
line-height:calc(14 / 12);
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .week{
display:block;
line-height:calc(14 / 12);
margin-top:1px;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .price{
display:block;
line-height:1;
min-height:12px;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .status{
display:block;
line-height:1;
width:11px;
height:11px;
margin:2px auto 0;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .status .status-ok{
display:inline-block;
vertical-align:middle;
width:11px;
height:0;
padding-top:11px;
overflow:hidden;
background:url(/element_sp/j_optional_v2/shared/images/icon-plan-ok.svg) 0 0 no-repeat;
background-size:11px auto;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .status .status-ng{
display:inline-block;
vertical-align:middle;
width:9px;
height:0;
padding-top:9px;
overflow:hidden;
background:url(/element_sp/j_optional_v2/shared/images/icon-plan-ng.svg) 0 0 no-repeat;
background-size:9px auto;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li .status .status-blank{
display:inline-block;
vertical-align:middle;
position:relative;
top:-1px;
width:11px;
height:0;
padding-top:1px;
overflow:hidden;
background:url(/element/j_optional_v2/shared/images/icon-plan-blank.svg) 0 0 no-repeat;
background-size:11px auto;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.holiday .week{
color:var(--cmn-font-color-red);
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.is-active button{
-webkit-box-shadow:none;
box-shadow:none;
background-color:#eee;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.is-selected button .date{
height:14px;
width:33px;
padding:0 1px;
background-color:#bce0f8;
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.is-disabled button{
cursor:default;
-webkit-box-shadow:none;
box-shadow:none;
border-color:#ddd;
color:rgba(2,2,2,.33);
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.is-disabled button .status{
opacity:.33;
}
.map .popup-price-dtl-container .price-dtl-date-container .price-dtl-date-list li.is-disabled.holiday .week{
color:rgba(2,2,2,.33);
}
.map .popup-price-dtl-container .price-dtl-def{
margin-top:6px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:space-between;
-ms-flex-align:space-between;
align-items:space-between;
-webkit-box-pack:end;
-ms-flex-pack:end;
justify-content:flex-end;
}
.map .popup-price-dtl-container .price-dtl-def .price-dtl-def-unit{
font-size:12px;
}
.map .popup-price-dtl-container .price-dtl-def .price-dtl-def-unit >span:first-child::after{
content:":";
display:inline-block;
margin:0 4px;
}
.map .popup-price-dtl-container .price-dtl-sup-container{
background-color:#f5f5f5;
height:25px;
padding:4px;
margin-top:8px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
}
.map .popup-price-dtl-container .price-dtl-sup-container .price-dtl-sup-date{
font-size:12px;
line-height:1;
}
.map .popup-price-dtl-container .price-dtl-sup-container .mod-num{
margin-right:-4px;
font-size:14px;
font-family:Arial;
}
.map .popup-price-dtl-container .price-dtl-sup-container .month{
font-size:14px;
font-family:Arial;
}
.map .popup-price-dtl-container .price-dtl-item{
margin-top:12px;
}
.map .popup-price-dtl-container .price-dtl-list >li{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
font-size:12px;
}
.map .popup-price-dtl-container .price-dtl-list >li:not(:first-child){
margin-top:12px;
}
.map .popup-price-dtl-container .price-dtl-list >li >div{
position:relative;
}
.map .popup-price-dtl-container .price-dtl-list >li >div:first-child{
width:73px;
padding-right:12px;
white-space:nowrap;
}
.map .popup-price-dtl-container .price-dtl-list >li >div:first-child::after{
position:absolute;
right:13px;
top:0;
content:":";
display:block;
}
.map .popup-price-dtl-container .price-dtl-list >li >div:last-child{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
}
.map .popup-price-dtl-container .price-item{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:end;
-ms-flex-align:end;
align-items:flex-end;
line-height:1;
}
.map .popup-price-dtl-container .price-item .price-num{
font-size:14px;
font-family:Arial;
}
.map .popup-price-dtl-container .price-dtl-main .price-num{
font-size:18px;
font-weight:bold;
font-family:Arial;
}
.map .popup-price-dtl-container .price-dtl-sub{
margin-top:8px;
}
.map .popup-price-dtl-container .price-dtl-option{
margin:0;
}
.map .popup-price-dtl-container .price-dtl-option >li >div:last-child{
margin-top:-1px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
}
.map .popup-price-dtl-container .price-dtl-option >li:not(:first-child){
margin-top:8px;
}

/* ----------------------------------------------------------------
  .map-view-panel
----------------------------------------------------------------- */
.map .map-view-panel{
position:absolute;
padding:3px;
}
.map .map-view-panel.is-blank .map-view-info-inner{
cursor:default;
}
.map .map-view-panel.is-blank .map-view-info-inner:active,
.map .map-view-panel.is-blank .map-view-info-inner:hover{
-webkit-box-shadow:0px 4px 6px rgba(0, 0, 0, .3);
box-shadow:0px 4px 6px rgba(0, 0, 0, .3);
}

/* map-view-info
---------------------------------- */
.map-view-info{
width:412px;
}
.map-view-info .map-view-info-close{
padding:0;
border:none;
color:rgba(0, 0, 0, 0);
display:block;
width:30px;
height:30px;
position:absolute;
top:4px;
right:0;
overflow:hidden;
background:none;
background:url(/element_sp/j_optional_v2/map/images/icon-close.svg) no-repeat 50% 50%;
background-size:10px 10px;
}
.map-view-info .map-view-info-inner{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:horizontal;
-webkit-box-direction:reverse;
-ms-flex-flow:row-reverse;
flex-flow:row-reverse;
position:relative;
z-index:1;
background-color:#fff;
height:auto;
border-radius:3px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
-webkit-box-shadow:0px 4px 6px rgba(0, 0, 0, .3);
box-shadow:0px 4px 6px rgba(0, 0, 0, .3);
overflow:hidden;
cursor:pointer;
}
.map-view-info .map-view-info-inner:active,
.map-view-info .map-view-info-inner:hover{
-webkit-box-shadow:0 0 0 1px var(--outline-color),0px 4px 6px rgba(0, 0, 0, .3);
box-shadow:0 0 0 1px var(--outline-color),0px 4px 6px rgba(0, 0, 0, .3);
}
.map-view-info .map-view-info-inner:active .map-view-info-hdg a,.map-view-info .map-view-info-inner:hover .map-view-info-hdg a{
text-decoration:underline;
}
.map-view-info .map-view-info-inner .map-view-info-detail{
-webkit-box-flex:1;
-ms-flex:1;
flex:1;
overflow:hidden;
padding:12px 12px 40px;
min-height:74px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
.map-view-info .map-view-info-inner .map-view-info-hdg{
font-size:14px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.map-view-info .map-view-info-inner .map-view-info-hdg a{
color:var(--cmn-font-color-link);
text-decoration:none;
}
.map-view-info .map-view-info-inner .map-view-info-desc{
position:relative;
font-size:12px;
line-height:calc(18 /  12);
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
overflow:hidden;
margin-top:4px;
}
.map-view-info .map-view-info-inner .map-view-info-btn{
position:absolute;
right:10px;
bottom:10px;
margin:4px 0 0 0;
padding:4px 8px;
border:none;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
font-size:12px;
background:none;
border:1px solid #bbb;
border-radius:13px;
height:26px;
color:var(--cmn-font-color-base);
line-height:1;
}
.map-view-info .map-view-info-inner .map-view-info-btn:active,
.map-view-info .map-view-info-inner .map-view-info-btn:hover{
border-color:var(--outline-color);
}
.map-view-info .map-view-info-inner .map-view-info-pic{
border-radius:3px 0 0 3px;
width:154px;
height:132px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
position:relative;
overflow:hidden;
background-color:#e5e5e5;
}
.map-view-info .map-view-info-inner .map-view-info-pic img{
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover;
position:absolute;
top:0;
right:50%;
-webkit-transform:translateX(50%);
transform:translateX(50%);
}

/* suggest-select-list-child
---------------------------------- */
/* .map .suggest .suggest-select-list-child >li{
  & label{
    display: inline-block;
    &:active,
    &:hover{
      box-shadow:4px 0 0 rgba(0,0,0,.04),-4px 0 0 rgba(0,0,0,.04);
      background-color:rgba(0,0,0,.04);
    }
  }
} */
.scroll-test{
top:190px;
left:120px;
overflow:scroll;
position:absolute;
display:none;
background-color:rgba(0,0,0,.5);
z-index:999;
width:100px;
height:100px;
}
