:root{
--font-color-btn-link:#666;
--font-color-placeholder:#9e9e9e;
--font-num:Arial;
}

/* ----------------------------------------------------------------
    calender module
----------------------------------------------------------------- */
/* ----------------------------------------------------------------
  Layout
----------------------------------------------------------------- */
/* .lyt-calendar
----------------------------------------------- */
[data-role=page].lyt-sticky.lyt-calendar{
padding:30px 10px 105px;
}
[data-role=page].lyt-sticky.lyt-calendar main{
padding-bottom:150px;
}
[data-role=page].lyt-sticky.lyt-calendar .hdg-l1-container{
position:fixed;
width:100%;
top:0;
left:0;
margin:0;
z-index:3;
}

/* ----------------------------------------------------------------
  Headings
----------------------------------------------------------------- */
/* .hdg-l2-02
----------------------------------------------- */
.lyt-calendar .hdg-l2-02{
font-size:15px;
margin:0px -10px;
padding:30px 190px 20px 10px;
background-color:#fff;
color:var(--cmn-font-color-base);
}
.lyt-calendar .hdg-l2-02 .font-num{
font-size:16px;
}
.hdg-l1-container + .hdg-l2-02{
border-top:none;
}
.calendar-add + .hdg-l2-02,
.calendar-tool + .hdg-l2-02{
border-top:none;
}
.price-calendar .calendar-add + .hdg-l2-02{
margin-top:0;
padding-top:20px;
}

/* ----------------------------------------------------------------
  Button
----------------------------------------------------------------- */
/* .btn
----------------------------------------------- */
.calendar-sticky-box .btn-08{
font-size:16px;
display:block;
padding:7px 10px 8px;
margin:0 auto;
min-width:calc((100% + 20px) * .6);
max-width:calc((100% + 20px) * .8);text-align:center;
font-weight:normal;
color:#fff;
border:none;
border-radius:6px;
background-color:var(--cmn-btn-color);
text-align:center;
height:42px;
box-sizing:border-box;
}
.calendar-sticky-box .btn-08.disabled{
background-color:#d5d5d5;
text-shadow:none;
box-shadow:none;
}

/* ----------------------------------------------------------------
  Calendar Component
----------------------------------------------------------------- */
/* .calendar-container
----------------------------------------------- */
.calendar-container{
position:relative;
margin:0 -10px -10px;
border-bottom:1px solid #bbb;
}

/* .calendar
----------------------------------------------- */
.calendar{
margin:0 0 12px;
font-size:14px;
font-weight:normal;
width:100%;
table-layout:fixed;
border-collapse:collapse;
}
.calendar th{
text-align:center;
font-size:13px;
font-weight:normal;
line-height:1;
padding-bottom:16px;
}
.calendar td{
text-align:center;
padding:4px 0;
position:relative;
}
.calendar td a{
display:block;
padding:11px 0;
color:var(--cmn-font-color-base);
box-sizing:border-box;
height:38px;
}
.calendar strong .icon,
.calendar strong .icon_start,
.calendar strong .icon_end{
display:none;
}
.calendar .disabled a{
color:#ccc;
}
.calendar .active strong{
position:relative;
display:block;
font-weight:normal;
height:38px;
background-color:#ecf6ff;
}
.calendar .active strong a{
width:38px;
height:38px;
background-color:#2584d1;
color:#fff !important;
border-radius:5px;
}
.calendar .active a{
background-color:#ecf6ff;
cursor:pointer;
opacity:1;
}
.calendar .start{
background-color:#fff;
}
.calendar .start strong{
width:50%;
float:right;
}
.calendar .start strong a{
position:absolute;
left:0;
margin-left:-19px;
}
.calendar .end strong{
width:50%;
float:left;
}
.calendar .end strong a{
position:absolute;
right:0;
margin-right:-19px;
}
.calendar .startend strong{
background-color:#fff;
}
.calendar .single strong{
background-color:#fff;
}
.calendar .single strong a{
margin:0 auto;
}
.calendar tr > th:nth-child(1),
.calendar tr > td:nth-child(1) a,
.calendar tr > td:nth-child(7).holiday a,
.calendar tr > td.holiday a{
color:var(--cmn-font-color-red);
}
.calendar tr > td:nth-child(1).disabled a,
.calendar tr > td.holiday.disabled a,
.calendar tr > td:nth-child(7).disabled a{
color:#ccc;
}

/* .calendar-sticky-box
----------------------------------------------- */
.calendar-sticky-box{
font-size:13px;
position:fixed;
z-index:3;
bottom:0;
display:none;
box-sizing:border-box;
width:100%;
margin:0 -10px;
padding:14px 10px 10px;
background-color:#444;
}
.contentFilter_Box .calendar-sticky-box{
margin:0;
}
.calendar-sticky-box p{
margin:0;
}
.calendar-sticky-box .calendar-term{
font-weight:bold;
display:-webkit-box;
display:flex;
color:#fff;
margin-bottom:12px;
-webkit-box-align:center;
align-items:center;
height:35px;
}
.calendar-sticky-box .calendar-term >span >span{
display:block;
vertical-align:middle;
font-size:13px;
color:var(--cmn-font-color-base);
border-radius:2px;
background-color:#fff;
padding:8px 5px;
}
.calendar-sticky-box .calendar-term > span.start,
.calendar-sticky-box .calendar-term > span.end{
width:50%;
display:block;
box-sizing:border-box;

}
.calendar-sticky-box .calendar-term > span.start small,.calendar-sticky-box .calendar-term > span.end small{
font-size:11px;
}
.calendar-sticky-box .calendar-term > span.start.selected > span,.calendar-sticky-box .calendar-term > span.end.selected > span{
background-color:#bbb;
}
.calendar-sticky-box .calendar-term > span.start .calendar-guide,.calendar-sticky-box .calendar-term > span.end .calendar-guide{
display:block;
font-weight:bold;
font-size:13px;
color:var(--font-color-placeholder);
text-align:center;
}
.calendar-sticky-box .calendar-term > span.start{
padding-right:7px;
position:relative;
}
.calendar-sticky-box .calendar-term > span.start:after{
position:absolute;
content:"-";
display:block;
right:-2px;
color:#fff;
top:8px;
font-size:11px;
}
.calendar-sticky-box .calendar-term > span.end{
padding-left:7px;
}

/* calendar-tool
------------------------------------------------ */
.calendar-tool{
padding:33px 10px 10px;
background-color:#fff;
}
.calendar-tool .cal-filter label{
display:inline-block;
}

/* calendar-add
------------------------------------------------ */
.calendar-add{
position:relative;
margin:0 -10px;
}
.calendar-add .cal-switch{
position:absolute;
top:25px;
right:10px;
display:block;
color:var(--cmn-font-color-base);
font-size:12px;
border:1px solid #bbb;
border-radius:3px;
width:170px;
height:30px;
padding:5px 5px;
text-align:center;
box-sizing:border-box;
line-height:1.5;
}
.calendar-add .cal-guide{
padding:8px 10px 0;
display:block;
font-size:13px;
}
.calendar-add .cal-sup{
padding:0 10px;
font-size:13px;
}
.calendar-add .cal-notes{
display:block;
font-size:11px;
color:var(--cmn-font-color-gray);
margin-top:3px;
}
.calendar-add .cal-notes.indent{
margin-left:1em;
text-indent:-1em;
}

/* price-calendar > calendar-add
------------------------------------------------ */
.price-calendar.lyt-price-calendar-sticky .calendar-add{
position:fixed;
width:100%;
top:42px;
left:0;
margin:0;
z-index:1;
background-color:#fff;
}

/* price-cal-container
------------------------------------------------ */
.price-calendar .calendar-container{
padding:0 5px 15px;
}
.price-calendar .calendar tr:not(:first-child){
border-top:1px solid #e5e5e5;
}

/* toggle-cal-container
------------------------------------------------ */
.price-calendar .toggle-cal-container .toggle-cal-item{
display:none;
}
.price-calendar .toggle-cal-container.active .toggle-cal-item{
display:block;
}
.price-calendar .toggle-cal-container.active .toggle-cal-btn-container{
height:10px;
}
.price-calendar .toggle-cal-container.active .toggle-cal-btn-container .toggle-cal-btn{
top:9.5px;
}
.price-calendar .toggle-cal-container.active .toggle-cal-btn-container .toggle-cal-btn span::before{
top:0;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
}
.price-calendar .toggle-cal-container .toggle-cal-btn-container{
position:relative;
z-index:2;
border-bottom:1px solid #c2c2c2;
height:15px;
background-color:#fff;
}
.price-calendar .toggle-cal-container .toggle-cal-btn-container .toggle-cal-btn{
display:block;
position:relative;
top:14.5px;
z-index:1;
margin:0 auto;
border:1px solid #c2c2c2;
border-top:1px solid #fff;
border-radius:0 0 6px 6px;
width:178px;
height:25px;
background-color:#fff;
box-shadow:0px 3px 1px -2px rgba(0, 0, 0, .2);
text-align:center;
-webkit-user-select:none;
user-select:none;
}
.price-calendar .toggle-cal-container .toggle-cal-btn-container .toggle-cal-btn span{
color:var(--font-color-btn-link);
font-size:11px;
}
.price-calendar .toggle-cal-container .toggle-cal-btn-container .toggle-cal-btn span::before{
display:inline-block;
position:relative;
top:-2px;
margin-right:5px;
border-top:2px solid #888;
border-right:2px solid #888;
width:4px;
height:4px;
content:"";
-webkit-transform:rotate(135deg);
transform:rotate(135deg);
}

/* cal-define
------------------------------------------------ */
.price-calendar .cal-define{
position:absolute;
right:10px;
top:-47px;
width:160px;
line-height:1.1;
}
.price-calendar .cal-define li{
display:inline-block;
margin-left:7px;
vertical-align:middle;
color:#555;
font-size:10px;
}
.price-calendar .cal-define li:nth-child(1):before{
content:"";
position:relative;
display:inline-block;
width:14px;
height:9px;
border:1px solid rgba(227,7,7,.4);
border-radius:50%;
box-sizing:border-box;
vertical-align:middle;
}
.price-calendar .cal-define li:nth-child(3):before{
position:relative;
top:-1px;
display:inline-block;
width:10px;
height:10px;
margin:0 1px 0 3px;
background-image:url(/element/w_air_on/shared/images/icon/icon-zoom.svg);
background-size:100%;
background-repeat:no-repeat;
content:"";
vertical-align:middle;
}

/* price-status
------------------------------------------------ */
.price-calendar .calendar th{
border-bottom:1px solid #e5e5e5;
}
.price-calendar .calendar td:nth-child(1) .price-date,
.price-calendar .calendar td.holiday .price-date{
color:var(--cmn-font-color-red);
}
.price-calendar .calendar td.disabled .price-date,
.price-calendar .calendar td.disabled:nth-child(1) .price-date,
.price-calendar .calendar td.holiday.disabled .price-date{
color:#ccc;
}
.price-calendar .calendar td{
height:49px;
}
.price-calendar .calendar td.active > div{
background-color:#ecf6ff;
}
.price-calendar .calendar td.active.start > div{
background:-webkit-linear-gradient(right, #ecf6ff 0%, #ecf6ff 50%, #fff 50%);
background:linear-gradient(to left, #ecf6ff 0%, #ecf6ff 50%, #fff 50%);
}
.price-calendar .calendar td.active.start.startend > div{
background:none;
}
.price-calendar .calendar td.active.end > div{
background:-webkit-linear-gradient(left, #ecf6ff 0%, #ecf6ff 50%, #fff 50%);
background:linear-gradient(to right, #ecf6ff 0%, #ecf6ff 50%, #fff 50%);
}
.price-calendar .calendar td.active.start,
.price-calendar .calendar td.active.end{
background:none;
}
.price-calendar .calendar td.active.start a,.price-calendar .calendar td.active.end a{
background-color:#2584d1;
}
.price-calendar .calendar td.active.start a .price-date,
.price-calendar .calendar td.active.end a .price-date,
.price-calendar .calendar td.active.start a .price-item,
.price-calendar .calendar td.active.end a .price-item{
color:#fff;
}
.price-calendar .calendar td a{
position:relative;
width:38px;
height:38px;
margin:0 auto;
padding:3px 0 0;
border-radius:5px;
}
.price-calendar .calendar .disabled a{
-webkit-tap-highlight-color:transparent;
}
.price-calendar .calendar .disabled .price-item{
display:none;
}
.price-calendar .calendar .price-status-blank a >span:before{
content:"";
position:absolute;
top:20px;
left:50%;
margin-left:-5px;
width:12px;
height:0;
padding-top:12px;
overflow:hidden;
line-height:2;
background-image:url(/element/w_air_on/shared/images/icon/icon-zoom.svg);
background-repeat:no-repeat;
background-size:100%;
}
.price-calendar .calendar .price-status-blank.active.start a >span:before,.price-calendar .calendar .price-status-blank.active.end a >span:before{
background-image:url(/element/w_air_on/shared/images/icon/icon-zoom-white.svg);
}
.price-calendar .calendar .price-status-cheapest a >span:before{
display:block;
position:absolute;
bottom:2px;
left:2%;
width:91%;
height:17px;
border:1px solid rgba(227,7,7,.4);
border-radius:50%;
content:"";
}
.price-calendar .calendar .price-status-cheapest.active.start a >span:before,.price-calendar .calendar .price-status-cheapest.active.end a >span:before{
border-color:#fff;
}
.price-calendar .calendar .price-date{
display:block;
text-align:center;
font-size:14px;
color:var(--cmn-font-color-base);
line-height:1;
}
.price-calendar .calendar .price-item{
display:block;
text-align:center;
color:var(--font-color-btn-link);
font-size:12px;
line-height:1;
margin-top:4px;
}
