@import url("/LiverpoolTheme/Theme.LiverpoolTheme.css?297");

/*
    How to generate a theme for your company: 
    
        1 - Go to https://silkui.outsystems.com/ThemeCustomizer/GenerateLiverpool.aspx
        2 - Copy the generated CSS
        3 - Replace the CSS for Primary Color Customization below with the Generated CSS

*/


* {
    font-family: Meiryo, sans-serif;
}

/***************************************/
/***** PRIMARY COLOR CUSTOMIZATION *****/
/***************************************/


a,
a:link,
a:visited {
    color: #F4D03F; /*primary-color*/
}

a.Button{
    color: #999;
}

.Header_Menu,
.Application_Menu {
    background-color: #F4D03F; /*primary-color*/
    box-shadow: 0 -2px 0 0 rgba(0, 0, 0, .25) inset;
    white-space: nowrap;
}

.Menu_TopMenuActive,
.Menu_DropDownButton.open .Menu_TopMenu {
    background-color: #F4D03F; /*primary-color*/
    -webkit-filter: brightness(80%);
    filter: brightness(0.8);
}

.Menu_TopMenu a:hover,
.Menu_TopMenu:hover {
    background-color: #F4D03F; /*primary-color*/
    -webkit-filter: brightness(80%);
    filter: brightness(0.8);
}


/* Menu_SubMenuItem */
.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    background-color: #F4D03F; /*primary-color*/
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    background-color: #F4D03F; /*primary-color*/
    -webkit-filter: brightness(80%);
    filter: brightness(0.8);
}

a.Header_ButtonMenu {
    color: #fff;
}

.tablet .Application_Menu a,
.phone .Application_Menu a,
.tablet .Application_Menu a:link,
.phone .Application_Menu a:link,
.phone .Application_Menu a:visited,
.phone .Application_Menu a:visited {
    border-bottom-color: rgba(0,0,0,0.2);
}

span.ListNavigation_CurrentPageNumber{
    color:#FFF;
}

.EditableTable tr.RowControlGroup a.SaveRowAction,
.EditableTable tr.RowControlGroup a.CancelRowAction{
    color: #F4D03F; /*primary-color*/
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #F4D03F; /*primary-color*/
    border-color: #F4D03F; /*primary-color*/
    color: #fff;
    text-shadow: none;
}

.desktop .Button.ButtonDefault:hover,
.desktop .Button.Is_Default:hover,
.Button.Button.Is_Default:hover {
    background-color: #F4D03F; /*primary-color*/
    border-color: #F4D03F; /*primary-color*/
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.Button.Cancel {
    background-color: #fff;
}

.desktop .Button.Cancel:hover {
    background-color: #fff;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9); 
}

.desktop .Button:hover,
.desktop a.Button:hover {
    background-color: #cfcfcf;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.Button.Link {
    color: #F4D03F; /*primary-color*/
}

.desktop .Button.Link:hover {
    background-color: #fff;
    border-color: #F4D03F; /*primary-color*/
    color: #F4D03F; /*primary-color*/
}

.Button.Danger{
    background-color: #e09d90;
    border-color: #df3a01;
    color: #fff;
}

a.ActionAdd,
a.ActionEdit,
a.ActionChange,
a.ActionDelete {
    background-color: #F4D03F; /*primary-color*/
    border-color: #F4D03F; /*primary-color*/
    color: #fff;
}

a.ActionAdd:hover,
a.ActionEdit:hover,
a.ActionChange:hover,
a.ActionDelete:hover {
    background-color: #F4D03F; /*primary-color*/
    border-color: #F4D03F; /*primary-color*/
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}


a.ActionAdd:before, 
a.ActionEdit:before, 
a.ActionDelete:before, 
a.ActionChange:before, 
.Actions [class^=fa]{
    background: #F4D03F; /*primary-color*/
}

.DropdownMenu .PH > a {
    color: #F4D03F; /*primary-color*/
}

.DropdownMenu .PH > a:hover {
    background-color: #efefef;
    color: #F4D03F; /*primary-color*/
    text-decoration: none;
}

.phone .Login_Info_Logout:before,
.tablet .Login_Info_Logout:before {
    color: #F4D03F; /*primary-color*/
}

.IconBadge_number {
    background-color: #F4D03F; /*primary-color*/
}

.NavigationBar a.Active:after {
    background-color: #F4D03F; /*primary-color*/
}

.NavigationBar a.Active:not(.ie7):before,
.NavigationBar a.Active:not(.ie8):before {
    border-bottom-color: #F4D03F; /*primary-color*/
}

.phone .NavigationBar .InlineDropdown:active:after,
.phone .NavigationBar .InlineDropdown:link:active:after,
.tablet .NavigationBar .InlineDropdown:active:after,
.tablet .NavigationBar .InlineDropdown:link:active:after,
.phone .NavigationBar a:active:after,
.phone .NavigationBar a:link:active:after,
.tablet .NavigationBar a:active:after,
.tablet .NavigationBar a:link:active:after {
    background-color: #F4D03F; /*primary-color*/
}


/* Responsive Context **************************/

.desktop .NavigationBar a:hover:after,
.desktop .NavigationBar a:link:hover:after {
    background-color: #F4D03F; /*primary-color*/
}


.phone .NavigationBar a:active:after,
.phone .NavigationBar a:link:active:after,
.tablet .NavigationBar a:active:after,
.tablet .NavigationBar a:link:active:after {
    background-color: #F4D03F; /*primary-color*/
}


/* NavigationBar: Vertical **************************/

.NavigationBar.Vertical a.Active,
.NavigationBar.Vertical a:link.Active {
    border-color: #F4D03F; /*primary-color*/
}

.NavigationBar.Vertical a.Active:not(.ie7):before,
.NavigationBar.Vertical a.Active:not(.ie8):before {
    border-left-color: #F4D03F; /*primary-color*/
}

/* Responsive Context **************************/
.desktop .NavigationBar.Vertical a:hover,
.desktop .NavigationBar.Vertical a:link:hover {
    border-color: #F4D03F; /*primary-color*/
}


.SectionIndex a.active, 
.SectionIndex a:hover{
    border-bottom-color: #F4D03F; /*primary-color*/
    color: #F4D03F; /*primary-color*/
}

.SectionIndex.vertical a.active, 
.SectionIndex.vertical  a:hover{
    border-left-color: #F4D03F; /*primary-color*/
}

.Tabs__tab.active {
    border-top: 1px solid #ccc;
}

/* Calendar **************************/
.pika-prev:after,
.pika-next:after {
    color: #F4D03F; /*primary-color*/ 
}

.pika-title {
    border-bottom: 2px solid #F4D03F; /*primary-color*/
}

.is-selected .pika-button {
   background-color: #F4D03F; /*primary-color*/
}

.has-event .pika-button:after {
   background-color: #F4D03F; /*primary-color*/ 
}

/* Calendar DEPRECATED **************************/
.Calendar-dayNames {
    border-top-color: #F4D03F; /*primary-color*/
}

.Calendar-navBtn > div {
    color: #F4D03F; /*primary-color*/
}

.Calendar-day-selected,
.Calendar-day-selected:hover {
    background: #F4D03F; /*primary-color*/
}

.Calendar-time-down, 
.Calendar-time-up, 
.Calendar-time-am {
    color: #F4D03F; /*primary-color*/
}


/* OS PopUps **************************/

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar {
    background: #F4D03F; /*primary-color*/
}

/* Wizard **************************/

.WizardStep:before {
    border-bottom-color: #c2c2c2;
    border-top-color: #c2c2c2;
}

.WizardStep.ActiveStep {
    background: #F4D03F; /*primary-color*/
}

.WizardStep.ActiveStep:before {
    border-bottom-color: #F4D03F; /*primary-color*/
    border-top-color: #F4D03F; /*primary-color*/
}

.WizardStep.Past {
    background-color: #F4D03F; /*primary-color*/
}

.WizardStep.Past:before {
    border-color: #F4D03F; /*primary-color*/
}

.WizardStep.Past:after,
.WizardStep.ActiveStep:after {
    border-right-color: #efefef;
    border-top-color: #efefef;
}

.cancel .box .reason .bk_gray {
    background: #a2a2a2;
}

.air-logo-size {
    max-width: 60px;
    max-height: 24px;
    vertical-align: -1.5px;
}

.OptionSalesBtn {
    max-width: none;
    width: 100%;
}

.Cntainer2 {
    height: 70.667px;
    margin-bottom: 15px;
}

/*TAI 対応*/
.TAI h2{
    color: black !important;
}

.TAI h3,
.TAI .travel_document .top a.back,
.TAI .travel_document .nav a{
    background-color: #C11E58 !important;
}

.TAI h4,
.TAI .login .box .btn_wrap .Button,
.TAI .travel_document .info .cancel_table div:first-child,
.TAI .cancel_head .cancel_colum,
.TAI .cancel_table_title{
    background-color: #D75571 !important;
}

.TAI .mypage_wrap{
    background: white !important;
}

.TAI .box,
.TAI .travel_document .main{
    border: solid 2px #C11E58 !important;
}


.TAI .mypage a.logout{
    border: solid 3px #C11E58 !important;
}
.TAI .mypage a.logout span,
.TAI .travel_document .top a .fa-print{
    color: #C11E58 !important;
}

.TAI .travel_document .top a.print{
    color: #C11E58 !important;
    border: 3px solid #C11E58 !important;
}

.TAI .travel_document .btn_wrap a{
    color: #D75571 !important;
    border: solid 2px #D75571 !important;
}

.TAI .mypage .box dl,
.TAI .travel_document .top,
.TAI .travel_document .nav{
    background-color: #fdecf0 !important;
}
.TAI .travel_document .nav a{
    border-right: 1px solid #fdecf0 !important;
}

.printbtn_box{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
    margin-bottom: 8px;
    padding-top: 8px;
}
.printbtn_box > div{
    width:calc(100% / 2 - 4px);
}  
.printbtn_box > div input{
    width:100% !important;   
} 
.travel_document .top a.print{
    margin-bottom:8px;
}
@media screen and (max-width: 767px) {
.printbtn_box{
    margin-bottom: 0;
}
.printbtn_box > div{
    width: 100%;
    margin-bottom: 8px;
}
    .travel_document .top a.print {
        margin: 0 0 10px !important;
    }
}



/* Link をボタン見た目にする */
a.SeatBtn,
a.SeatBtn:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 22px;      /* 高さ/横幅の雰囲気 */
  min-height: 36px;

  background: #2f79d6;     /* 青 */
  color: #fff;
  text-decoration: none;

  border: 1px solid #1f5fb0;
  border-radius: 2px;      /* 角の丸み（画像は小さめ） */
  box-shadow: 0 1px 0 rgba(0,0,0,0.15);

  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.02em;

  cursor: pointer;
  user-select: none;
}

/* hover */
a.SeatBtn:hover {
  background: #2a6cc1;
  border-color: #1b539a;
  color: #fff;
}

/* 押下中 */
a.SeatBtn:active {
  background: #245faa;
  border-color: #184a88;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
}

/* フォーカス（キーボード操作） */
a.SeatBtn:focus {
  outline: 2px solid rgba(47,121,214,0.35);
  outline-offset: 2px;
}

/* 無効っぽく見せたい場合（必要なら） */
a.SeatBtn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

/* リンクの中の子要素（span等）も白に固定 */
a.SeatBtn,
a.SeatBtn:visited,
a.SeatBtn:hover,
a.SeatBtn:active,
a.SeatBtn:focus {
  color: #fff !important;
}

a.SeatBtn * {
  color: #fff !important;
}