/* ----------------------------------------------------------------
    calender module
----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Layout
----------------------------------------------------------------- */
/* .lyt-calendar
----------------------------------------------- */
.lyt-calendar{
padding:0;
}
.lyt-calendar main{
padding-bottom:131px;
}
.calendar-guide{
font-family: '\30e1\30a4\30ea\30aa', Meiryo, '\30d2\30e9\30ae\30ce\89d2\30b4 Pro W3', 'Hiragino Kaku Gothic ProN', '\ff2d\ff33 \ff30\30b4\30b7\30c3\30af', sans-serif;
}

/* .calendar-01
----------------------------------------------- */
[data-role=page].lyt-sticky.calendar-01{
padding-bottom:70px;
font-family:"\30d2\30e9\30ae\30ce\89d2\30b4 Pro W3", "HiraKakuProN-W3", sans-serif;
}
[data-role=page].lyt-sticky.calendar-01 button{
font-family:"\30d2\30e9\30ae\30ce\89d2\30b4 Pro W3", "HiraKakuProN-W3", sans-serif;
}

/* ----------------------------------------------------------------
  Headings
----------------------------------------------------------------- */
/* .hdg-l2-02
----------------------------------------------- */
.hdg-l2-02{
font-size:15px;
margin:0;
padding:10px;
background-color:#fff;
width:100%;
line-height:1.2;
border: 0;
box-shadow: 0 0 0;
color: #333;
}
#Area_calendar_page .hdg-l1-container{
margin: 0px -10px 0 0;
position: fixed;
width: 100%;
z-index: 3;
}
.hdg-l1-container + .hdg-l2-02{
margin-top:43px;
}

.hdg-cal.scrollset{
font-size: 16px;
margin: 0 -10px 0;
padding: 17px 20px 0 20px;
background-color: #fff;
}

/* .calendar-guide
----------------------------------------------- */
.calendar-guide{
width:100%;
z-index:1;
padding-bottom:30px;
}
.calendar-guide.scrollset{
position:fixed;
top:17px;
left:0;
display:block;
z-index: 10;
}
.hdg-l1-container{
margin: -10px -10px 15px;
}
#Area_hotel_calendar_page .hdg-l1-container{
margin: 0 0 20px 0;
position: fixed;
width:100%;
z-index: 1;
}
.hdg-l1-container + .calendar-guide p{
margin:0 -10px;
font-size:14px;
font-weight:bold;
line-height:1.3;
padding:5px 0;
background-color:#fff;
text-align:center;
text-shadow:none;
}
.calendar-guide .calendar-sticky-box p{
margin:5px -10px 0 -10px;
font-size:14px;
font-weight:bold;
line-height:1.3;
padding:0 8px 5px;
text-align:center;
text-shadow:none;
background:none;
}

/* ----------------------------------------------------------------
  Calendar Component
----------------------------------------------------------------- */
/* .calendar-container
----------------------------------------------- */
.calendar-container{
margin:0;
padding:9px 0 12px;
border-bottom:1px solid #bbb;
background-color:#fff;
text-shadow:none;
}
.calendar-container + .hdg-l2-02{
margin-top:8px;
}

/* .calendar
----------------------------------------------- */
.calendar{
margin: 0;
border-collapse: collapse;
width: 100%;
table-layout: fixed;
text-align: center;
font-weight: normal;
font-size: 14px;
}
.calendar th:first-child{
color: #e93939;
}
[data-role='page'] .calendar td a{
font-weight:bold;
position:relative;
display:block;
overflow:hidden;
padding:12px 0;
color:#333;
}
.calendar th{
font-weight:normal;
font-size: 13px;
padding-bottom: 11px;
}
.calendar td {
position: relative;
padding: 0;
height: 46px;
line-height: 1;
}
.calendar td strong{
position:relative;
display:block;
}
.calendar .active strong {
display: block;
position: relative;
height: 38px;
background-color: #ecf6ff;
font-weight: normal;
}
.calendar .start strong{
float:right;
width:50%;
height: 38px;
}
.calendar .start strong a{
position:absolute;
left:0;
}

.calendar .end strong{
float:left;
width:50%;
}

.calendar td.end.selected strong a{
position:absolute;
right:0;
margin-right:-19px;
}

.calendar td.start.selected strong a {
position: absolute;
left: 0;
margin-left: -19px;
}
.calendar td strong .icon{
font-size: 10px;
font-weight: bold;
position: relative;
position: absolute;
z-index: 2;
top: -33px;
left: inherit;
right: -19px;
display: block;
min-width: 2.5em;
padding: 5px 3px;
text-align: center;
color: #fff;
border-radius: 4px;
background-color: #444;
text-shadow: none;
white-space: nowrap;
line-height: 1.3;
box-shadow: 0 -2px 0 #000 inset;
width: 4em;
}
.calendar td.start.selected strong .icon{
left: -19px;
right: inherit;
top: inherit;
bottom: 33px;
}
#Act_calendar_picker .calendar td strong .icon{
font-size: 11px;
width: 3.5em;
right: -19px;
left: inherit;
}
#Act_calendar_picker .calendar td.start strong .icon{
left: -19px;
right: inherit;
}
.calendar td strong .icon:before{
position:absolute;
display:inline-block;
display:block;
width:0;
height:0;
margin:0;
content:"";
border-width:5px 5px 0 5px;
border-style:solid;
border-color:#000 transparent transparent transparent;
bottom:-5px;
left:50%;
margin-left:-5px;
}
.calendar td.start a,
.calendar td.end a{
margin: 0 auto;
border-radius: 5px;
color: #fff;
width: 38px;
position: relative;
background-color: #2584d1;
font-weight: normal;
color: #fff!important;
}
.calendar td.active.start.single,
.calendar td.active.end.single{
background-color:#ffb92a;
}
.calendar td.active.start.single a:after,
.calendar td.active.end.single a:after{
display:none;
}

.calendar td.active.start.selected.single,
.calendar td.active.end.selected.single{
background-color:#ffb92a;
}
.calendar td.active.start.selected.single a:after,
.calendar td.active.end.selected.single a:after{
display:none;
}
.calendar td.start.selected a,
.calendar td.end.selected a{
background-color:#ecf6ff;
}
.calendar td.start.selected a,
.calendar td.end.selected a{
margin: 0 auto;
border-radius: 5px;
color: #fff;
width: 38px;
position: relative;
background-color: #2584d1;
font-weight: normal;
}
.calendar td.disabled a{
cursor:default;
color: #ccc;
}
.calendar td.active a{
background-color:#ecf6ff;
}
.calendar td a{
box-sizing: border-box;
display: block;
padding: 13px 0 0;
height: 38px;
color: #333;
}
.calendar td.active a{
cursor:pointer;
opacity:1;
}
.calendar tr > td:nth-child(1) a,
.calendar tr > td.holiday a{
color:#e93939;
}
.calendar tr > td:nth-child(1).disabled a,
.calendar tr > td.holiday.disabled a{
color:#ccc;
}
.calendar tr > td.holiday:nth-child(7) a{
color:#e93939;
}
.calendar tr > td:nth-child(7).disabled a{
color:#ccc;
}

/* .calendar-sticky-box
----------------------------------------------- */
.calendar-sticky-box{
font-size:12px;
position:fixed;
z-index:3;
bottom:0;
display:none;
box-sizing:border-box;
width:100%;
margin:0 ;
padding: 10px;
background-color:rgba(0, 0, 0, .7);
}
.calendar-sticky-box .btn {
font-size: 16px;
background-color: var(--button-color);
width: 60%;
box-sizing: border-box;
margin: 0 auto;
margin-top: 10px;
height: 44px;
font-weight: normal;
border-radius: 4px;
min-width:225px;
}
.calendar-sticky-box .btn.disabled {
background-color: #d5d5d5;
}


/* .calendar-term
------------------------------------------------ */
.calendar-term > span{
padding-top:0;
}
.calendar-sticky-box .calendar-term{
width: calc(100%);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-weight:bold;
text-shadow:none;
font-size:13px;
}

.calendar-sticky-box .calendar-term + .calendar-term{
margin-top:5px;
}

.calendar-sticky-box .calendar-term > .start,
.calendar-sticky-box .calendar-term > .end{
padding:8px 0;
border-radius:3px;
width: calc(50% - 7px);
box-sizing: border-box;
background-color:#bbb;
color:#333;
}
.calendar-sticky-box .calendar-term > .start{
margin-right: 7px;
position: relative;
}
.calendar-sticky-box .calendar-term > .end{
margin-left: 7px;
}
.calendar-sticky-box .calendar-term > a .calendar-guide {
display: block;
color: #666;
text-align: center;
font-weight: bold;
font-size: 13px;
padding: 0;
margin: 0;
height: inherit;
}
.calendar-sticky-box .calendar-term > .active .calendar-guide{
font-weight: bold;
color: #999;
}

.calendar-sticky-box .calendar-term >:first-child{
margin-right:14px;
position:relative;
}

.calendar-sticky-box .calendar-term >:first-child:after{
margin-top:-1px;
content:'';
display:block;
width:10px;
height:2px;
background-color:#fff;
position:absolute;
top:50%;
right:-15px;
}

.calendar-sticky-box .calendar-term .start > span,
.calendar-sticky-box .calendar-term .end > span{
font-size:14px;
padding:0 10px;
font-weight:normal;
}
.calendar-sticky-box .calendar-term .start > span b,
.calendar-sticky-box .calendar-term .end > span b{
font-weight:normal;
}
.calendar-sticky-box .calendar-term .start > span.calendar-guide,
.calendar-sticky-box .calendar-term .end > span.calendar-guide{
font-size:13px;
display: block;
white-space: nowrap;
padding: 0;
}
#act_page-hotel_calendar .calendar-sticky-box .calendar-term .start > span,
#act_page-hotel_calendar .calendar-sticky-box .calendar-term .end > span{
font-size:11px;
padding:0 0 0 10px;
}
#act_page-hotel_calendar .calendar-sticky-box .calendar-term .start > span.calendar-guide,
#act_page-hotel_calendar .calendar-sticky-box .calendar-term .end > span.calendar-guide{
font-size:11px;
display: block;
white-space: nowrap;
padding: 0;
}


.calendar-sticky-box .calendar-term > .start.active,
.calendar-sticky-box .calendar-term > .end.active{
background-color:#fff;
}

.calendar-sticky-box .calendar-term .days{
margin-left:10px;
color:#fff;
display:block;
white-space:nowrap;
font-size:14px;
font-weight:normal;
}

.calendar-sticky-box .calendar-term .days b{
font-weight:normal;
}

/* .calendar-btn-term
------------------------------------------------ */
.calendar-btn-term{
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:justify;
-webkit-justify-content:space-between;
-ms-flex-pack:justify;
justify-content:space-between;
}
.calendar-btn-term button{
height:50px;
}
.calendar-btn-term .btn-09{
margin-right:5px;
width:105px;
line-height:1.2;
}
.calendar-btn-term .btn-08{
-webkit-box-flex:1;
-webkit-flex:1;
-ms-flex:1;
flex:1;
line-height:1.2;
font-size:16px;
font-weight:bold;
position:relative;
display:block;
box-sizing:border-box;
width:100%;
margin-top:0;
padding:5px;
color:#fff;
border:none;
border-radius:6px;
box-shadow: 0 -4px 0 #608b0b inset;
background-color: #78ae0e;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

}
.calendar-btn-term .btn-08.disabled{
background-color:#999;
}
.calendar-btn-term .btn-08 span{
display:table;
padding:0 5px;
}
.calendar-btn-term .btn-08 span span{
display:table-cell;
padding-right:5px;
text-align:left;
vertical-align:top;
height:2.25em;
width:5.5em;
white-space:nowrap;
position:relative;
}
.calendar-btn-term .btn-08 span span:first-child{
padding-right:13px;
}
.calendar-btn-term .btn-08 span span:first-child:after{
display:block;
content:"";
margin-left:5px;
border:5px solid #fff;
position:absolute;
bottom:.25em;
right:5px;
border-top-color:transparent;
border-bottom-color:transparent;
border-right:none;
}
.calendar-btn-term .btn-08 span span:last-child{
vertical-align:bottom;
width:auto;
}
.calendar-btn-term .btn-08 b,
.calendar-btn-term .btn-08 small{
font-size:12px;
}
.calendar-btn-term .btn-09 small{
font-size:12px;
}
.calendar-btn-term .btn-08 b{
display:block;
margin-bottom:2px;
letter-spacing:-.07em;
}
.calendar-btn-term .btn-08 em{
font-size:16px;
letter-spacing:-.07em;
}

.contentFilter_Area.departurePlace_Area.str-container .calendar-guide.scrollset {position: fixed;top: 9px;left: 10px;display: block;}
.contentFilter_Area.departurePlace_Area.str-container .hdg-l1-container .btn-hdg + .hdg-l1-box {
text-align: center;
padding: 0 60px 0 10px;
}
.calendar-guide {
width: 100%;
z-index: 1;
padding-top:18px;
overflow: hidden;
}