@charset "UTF-8";

.tab{
	width: 100%!important;
	font-size: 15px!important;
}
.form-checkbox, .form-radio, .form-switch {
    font-size: 14px!important;
}
.m20{
	margin-top: 20px;
}
.pb{
        width: 100%;
    bottom: 0;
    position: fixed;
    z-index: 999;
}
.m40{
	margin-top: 40px;
	float: left;
}
/*選取的東西*/
.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.btn-group>.btn:first-child {
    margin-left: 0;
}
.btn-linear.active, .btn-linear.active a, .btn-linear.active:hover, a.btn-linear.active:hover {
    background: #256fa0;
    color: #fff;
}
.btn.active, .btn:active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}
a.btn-linear, .btn-linear {
    background: #fbfbfb;
    background: -moz-linear-gradient(top, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    background: -webkit-linear-gradient(top, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    background: linear-gradient(to bottom, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#efefef', GradientType=0);
    border: 1px solid #b1b1b1;
}
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
label {
    margin-bottom: 0;
    font-weight: normal;
}

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0;
}
a.btn-linear, .btn-linear {
    background: #fbfbfb;
    background: -moz-linear-gradient(top, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    background: -webkit-linear-gradient(top, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    background: linear-gradient(to bottom, #fbfbfb 0%, #ffffff 20%, #ffffff 65%, #efefef 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#efefef', GradientType=0);
    border: 1px solid #b1b1b1;
}

[data-toggle=buttons]>.btn input[type=checkbox], [data-toggle=buttons]>.btn input[type=radio], [data-toggle=buttons]>.btn-group>.btn input[type=checkbox], [data-toggle=buttons]>.btn-group>.btn input[type=radio] {
    position: absolute;
    clip: rect(0,0,0,0);
    pointer-events: none;
}




.demo-include{
	width: 100%;
	float: left;
	margin-bottom: 100px;
}
.menu ol li, .menu ul li { margin-top: 0; }

ol.menu-item li, ul.menu-item li { list-style: none; }

.parent { margin: 0; }

.icon-fa:before, .icon-fa:after { font-family: FontAwesome; font-weight: normal; }

.icon-fa:before { margin-right: 4px; }

.icon-fa:after { margin-left: 4px; }

.links.icon-fa:hover, a.links.icon-fa:hover { text-decoration: none; }

.angle-right:after { content: "\f105"; }

#menu .btn { background: #f7f7f7; border-color: #256fa0; color: #256fa0; }

#menu .btn .btn-primary { background: #f7f7f7; border-color: #256fa0; color: #fff; }

#menu .btn:hover, #menu .btn:focus { background-color: #256fa0; color: #fff; }

#menu a.btn.btn-primary { background: #256fa0; border-color: #256fa0; color: #fff; }

#menu ul.menusub-2 li { width: 217px; }

#menu ul.menusub-3 li { width: 280px; }

#menu ul.menusub-4 li.shop { width: 700px; }

/*麵包屑*/

.p_left{
	float: left!important;
}
.navbar ol li, ul li {
    margin-top: 0rem;
}
.breadcrumb {
	
	font-size: 16px;
	font-weight: inherit;
	line-height: 1.55;
	padding: 9px 20px;
	border-radius: 6px
}
.breadcrumb>li {
	position: relative;
	text-shadow: none
}

.breadcrumb-text {
	color: #bdc3c7;
	margin-bottom: 20px
}

.breadcrumb-text ul {
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 20px;
	list-style: none;
	padding: 0
}
.breadcrumb-text ul li {
	display: inline-block
}


/*--------------------------主選單-------------------------*/
.menu { 
	background: #256fa0;
    border-top: #78aeff 4px solid;
	height: 46px;
    -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
    min-width: inherit;
    margin: 0 auto;
    position: relative;
    z-index: 1001;
    left: 0;
    right: 0;
    top: 0;
    padding: 0; 
}

.menu .container { position: relative; }

.menu .container > ul { text-align: center; display:flex; }

.menu .container > ul > li { display: inline-block; width: 125px; flex-grow: 1; height: 42px; line-height: 42px; font-size: 1em; zoom: 1; *display: inline; letter-spacing: normal; }

.menu .container > ul > li > a { display: block; color: #fff; position: relative; top: -4px; top: 0; margin-right: -4px; }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .menu .container > ul > li > a { top: -4px; } }

@supports (-ms-accelerator: true) { .menu .container > ul > li > a { top: -4px; } }

.menu .container > ul > li.active > a, .menu .container > ul > li:hover > a { color: #256fa0; border-bottom: #256fa0 4px solid; text-decoration: none; background: #fff; top: -4px; }

.menu .container > ul > li.active > .sub, .menu .container > ul > li:hover > .sub { display: block; }

.menu .container > ul > li { border-left: #d9d9d9 1px solid; }

.menu .container > ul > li:last-child { border-right: #d9d9d9 1px solid; }

/*---子選單---*/
/* .menu .sub { position: absolute; display: none; top: 42px; left: 0; background: #f7f7f7; background: -moz-linear-gradient(top, #f7f7f7 35%, #efefef 68%, #e4e4e4 100%); background: -webkit-linear-gradient(top, #f7f7f7 35%, #efefef 68%, #e4e4e4 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(35%, #f7f7f7), color-stop(68%, #efefef), to(#e4e4e4)); background: -o-linear-gradient(top, #f7f7f7 35%, #efefef 68%, #e4e4e4 100%); background: linear-gradient(to bottom, #f7f7f7 35%, #efefef 68%, #e4e4e4 100%); -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.3) inset; padding: 8px 0 16px 0; text-align: left; font-size: 0.875em; } */

.menu .sub { position: absolute; display: none; top: 42px; left: 0; background: #fff; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.3) inset; padding: 8px 0 16px 0; text-align: left; font-size: 0.875em; }

.menu .sub-area { padding: 0 8px; }

.menu .sub-area > li { display: table-cell; padding-left: 2.5%; min-width: 220px; }

.menu .sub-area > li + li { border-left: #ccc 1px solid; }

.menutitle { font-size: 1.25em; font-weight: bold; margin: 16px 0; color: #333; }

.menutitle2 { font-size: 1.1em; font-weight: bold; margin: 16px 0; }

a.icon-fa.angle-right { color: #333; text-decoration: none; }

.menutitle a { color: #256fa0; }

.menutitle a.angle-right:after { margin-left: 16px; }

.menu .sublist a { font-size: 1.1em; position: relative; color: #333; }

.menu .sublist { padding-left: 8px; }

.menu .sub li { /*width: inherit;*/ height: inherit; line-height: normal; }

.menu-item li { margin-bottom: 16px; }

.menu .sublist a:before { content: " "; display: inline-block; width: 4px; height: 10px; background: #256fa0; border-radius: 3px; position: absolute; top: 7px; left: -8px; }

.menu .sublist a:hover, .menu .subtitle a:focus { color: #256fa0; text-decoration: underline; }

.menu-item .subtitle { font-size: 0.875em; color: #000; }

.menu-item { padding-left: 8px; display: table-cell; padding-right: 24px; vertical-align: top; }

/*選單中的按鈕*/
.menu .book-ticket-btn, .menu .book-ticket-btn .btn { margin-top: 8px; }

.menu .book-ticket-btn .btn { display: block; margin-left: 0; }

.menu .btn { min-width: 160px; padding-right: 0; padding-left: 0; }

.booking-user:before, .booking-users:before { font-family: FontAwesome; margin-right: 8px; }

.booking-user:before { content: "\f007"; }

.booking-users:before { content: "\f0c0"; }

.menu-item .btn:hover, .menu-item .btn:focus { background-color: #256fa0; color: #fff; -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5); box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5); }

.menu-item .btn:hover i, .menu-item .btn:focus i { color: #fff; }

.btn-more { padding: 3px 16px; font-size: 0.875em; border-radius: 0px !important; margin: auto; /* background-color: #e8e8e8 !important; */}

.btn-more:hover, .btn-more:focus { background-color: #fff !important; }

/*----------------------下拉選單個別-樣式1 線上訂票-------------------*/
.menu .menusub-1 .sub-area > li { min-width: inherit; }

.menu .menusub-1 > li:nth-of-type(1) { width: 55%; padding-left: 3%; }

.menu .menusub-1 > li:nth-of-type(2) { width: 45%; }

.menusub-1 .column2 li { width: 49%; }

.menusub-1 .column3 li { width: 32%; }

.menu .sub-area.menusub-7 > li {
  padding-left: 1.38648180242634%;
  padding-right: 1.38648180242634%;
  min-width: 200px;
}
.menu .sub-area.menusub-7 > li:last-child {
  padding-left: 2.5%;
  min-width: 148px;
}
.menu .sub-area.menusub-7 > li .menu-item {
  padding-right: 8px;
}

.book-ticket { position: relative; }

.book-ticket .note { position: absolute; bottom: -80px; width: 100%; color: #7c7c7c; }

.menusub-1 .column2 li, .menusub-1 .column3 li { display: inline-block; margin-bottom: 25px; vertical-align: top; }

/*----------------------------下拉選單個別-樣式2 旅客旅遊--------------------*/
.menu .sub-area > li.travel-area { position: relative; padding-left: 0; border: none; min-height: 200px; }

.travel-area-title { font-size: 1.125em; margin: 16px 0 8px 0; font-weight: 600; }

.travel-area-inner { width: 200px; position: absolute; right: 16px; top: 0; bottom: 0; padding: 0 16px; border-left: #ccc 1px solid; }

.travel-area a { color: #256fa0; }

.travel-img { width: 100%; height: auto; margin-top: 8px; border: 2px solid #256fa0; }

/*----------------------------下拉選單個別-樣式4 線上購物--------------------*/
.menu .menusub-4 > li:nth-of-type(1) { padding-left: 10%; }

.menusub-4 .menu-item { width: 200px; }

/*----------------------------下拉選單個別-樣式5 會員專區--------------------*/
.menu .sub-area > li.travel-area { position: relative; padding-left: 0; border: none; min-height: 200px; }

.travel-area-title { font-size: 1.125em; margin: 16px 0 8px 0; font-weight: 600; }

.travel-area-inner { width: 200px; position: absolute; right: 16px; top: 0; bottom: 0; padding: 0 16px; border-left: #ccc 1px solid; }

.travel-area a { color: #256fa0; }

.travel-img { width: 100%; height: auto; margin-top: 8px; border: 2px solid #256fa0; }

/*--未登入 會員專區--*/
.sub-account { width: 50%; margin: 0 auto 8px auto; padding: 8px 48px 16px 48px; border: 1px #d1d1d1 solid; border-radius: 5px; }

.sub-account p { margin: 8px 0 16px 0; line-height: normal; font-size: 0.875em; }

.sub-account .menutitle, .sub-login .menutitle { margin-bottom: 8px; color: #333; }

/*--已登入 會員專區--*/
.sub-login { width: 40%; margin: 0 auto; padding: 0 20px 16px 5%; border: 2px #d3d3d3 dotted; border-radius: 5px; }

.sub-login .sublist { display: inline-block; width: 40%; margin-left: 5%; }

body { overflow-x: auto; }

/*--menu拆分--*/
.menu .container > ul{
    display: flex;
}

.menu .container > ul > li{
    width: auto !important;
    flex-grow: 1;
    min-width: 0;
}

.menu .sub{
    display: flex;
    visibility: hidden;
    padding: 0;
    box-shadow: 0 0 10px 5px rgba(0,0,0,.05);
    border: 8px #d8e0e9 solid;
}

.menu .current .sub{
    visibility: visible;
    display: flex;
}

.menu .container > ul > li.active > .sub, .menu .container > ul > li:hover > .sub{
    visibility: visible;
    display: flex;
}

.menu .container > ul > li.current > a, .menu .container > ul > li:hover > a {
    color: #256fa0;
    border-bottom: #256fa0 4px solid;
    text-decoration: none;
    background: #fff;
    top: -4px;
}

.menu .sub li{
    display: block;
    height: auto;
    margin-bottom: 0;
}

.menu .sub li:nth-child(n){
    width: 100%;
}

.menu .sub-main{
  flex-grow: 1;
  min-width: 0;
  padding: 15px 15px;
}

.sub {
  display: none;
}

.sub.open {
  display: flex;
}

.menu .sub-area{
  display: flex; 
  padding: 0 0px;
}

.menu ul.sub-area{
	margin: 0 0 0 0 !important;
}

.menu .sub-area > li{
    min-width: 0;
    padding: 0 10px 0px;
    margin-bottom: 15px;
}

.menu .sub-area > li+li {
    border-left: #eee 1px solid;
}

.menu .sublist{
    padding-left: 0;
}

.menu .sublist a{
    padding-left: 15px;
    display: block;
}

.menu .sublist a:before{
    left: 2px;
}

.menu .ads-area{
    background-color: #f2f2f2;
    width: 300px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.menu .ads-area a{
    display: block;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 10px 5px rgba(0,0,0,.05);
}

.menu .ads-area a::after{
    content: "了解更多";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
    background: linear-gradient(0deg,rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .6) 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all ease-in-out .2s;
    opacity: 0;
    font-weight: 900;
}

.menu .ads-area a:hover::after{
    opacity: .8;
}

.menu .illustration-area{
    width: 280px;
    min-width: 280px;
    display: flex;
    align-items: flex-end;
}

.menu-item{
    display: block;
    padding-left: 0;
    padding-right: 0;
}

[class*="menusub"] .menu-item{
    width: auto;
}

.menutitle{
    margin: 0;
}

.menutitle + .menutitle{
    margin-top: 16px;
}

.menutitle a{
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.menutitle a:hover{
    color: #256FA0;
}

.menutitle a.angle-right:after{
    /* content: "\f0a9"; */
    color: #aabcc9;
    margin-left: 0px;
    margin-top: 3px;
}

.menutitle2{
    margin-top: 0;
}

.menutitle3 a{
    display: grid;
    grid-template-columns: 1fr 25px;
    align-items: center;
    font-size: 1.25em;
    font-weight: bold;
    padding: 0px 0;
    border-bottom: 2px solid transparent;
}

.menutitle3 a::after{
    content: "\f0a9";
    display: inline-flex;
    font: normal normal normal 14px / 1 FontAwesome;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1em;
    color: #aabcc9;
    margin-left: 5px;
    align-items: center;
    justify-content: center;
    width: 15px;
}

.menutitle3 + *{
    margin-top: 10px;
}

.menutitle3 a:hover{
border-bottom-color:#256fa080;
}

.menutitle3 a:hover::after{
    background-color: #f2f2f2;
    color: #256FA0;
}

.menu-single-link{
    width: 180px;
    min-width: 180px!important;
    flex-grow: 0!important;
    border-left: #eee 1px solid;
    padding-left: 0px!important;
    padding-right: 0px;
    display: flex;
    flex-direction: column;
    background-color: #FAFAFA;
}

.menu-single-link .menutitle2{
    line-height: 1.2;
    margin-bottom: 0px;
    height: auto;
    min-width: 0;
    min-height: 0;
}

.menu-single-link > div + div{
    border-top: 1px solid #ddd;
}

.menu-single-link a{
    padding: 12px 15px 12px 8px;
    display: block;
    font-size: .95em;
    position: relative;
}

.menu-single-link a:hover{
    background-color: #f2f2f2;
}

.menu-single-link a:after{
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    color: #dedede;
}

.menu-single-link a:hover:after{
    color: #256FA0;
}

.menu-collapse{
    padding-right: 0px;
}

.menu-collapse .menu-item {
  overflow: hidden;
  transition: height 300ms ease;
  box-sizing: border-box;
  margin-top: 16px;
}

.menu-collapse .menu-item > li, .menu-item > li{
    padding-bottom: 14px;
}

.menu-collapse .btn-more {
  cursor: pointer;
  user-select: none;
  background-color: transparent;
  color: #256FA0;
  border-radius: 0;
  font-size: 1.5em;
  padding: 0;
  line-height: 1;
  border: none;
  box-shadow: none;
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  font-weight: 900;
  padding: 5px 0;
  margin-top: -15px;
}

.menu-collapse .btn-more:focus{
    outline: 4px #FF0004 dotted !important;
}

.menu-collapse .btn-more::before{
content:"";
height:1px;
width: 40%;
background-color: #dde0e2;
margin-bottom: 5px;
}

.menu-collapse .btn-more::after{
content:"";
height:1px;
width: 40%;
background-color: #dde0e2;
margin-bottom: 5px;
}

.menu-collapse .btn-more:hover{
    color: #53b6f8;
}

.menu-collapse .btn-more:hover::before, .menu-collapse .btn-more:hover::after{
    background-color: #256FA0;
}

.menu-collapse-more .menutitle{
    display: grid;
    grid-template-columns: 1fr 20px;
    align-items: flex-start;
    margin-bottom: 0;
}

.menu-collapse-more .menutitle .btn-cm-more{
    height: auto;
    line-height: 1;
    padding-top: 4px;
}

.menu-collapse-more .menutitle .btn-cm-more button{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 100%;
    border-radius: 0;
    border: none;
    background-color: transparent;
    color: #bbb;
    font-size: .7em;
    line-height: 1;
    height: 20px;
}

.menu-collapse-more .menutitle .btn-cm-more button:hover,.menu-collapse-more .menutitle .btn-cm-more button:focus{
    color: #256FA0;
    outline: 4px #FF0004 dotted
}

.menu-collapse-more .menu-item{
    margin: 16px 0 0 0;
}

.menu-collapse-more .collapse-container {
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}

.menu-collapse-more.showing .collapse-container {
  overflow: hidden;
}

.menu-collapse-more.show .collapse-container {
  height: auto;
}

.menu-collapse-more .btn-more{
    display: flex;
    justify-content: flex-end;
    border: none;
    border-radius: 0 !important;
    border-bottom: 1px solid #dde0e2;
    padding: 5px 0;
    letter-spacing: 1px;
    background-color: transparent;
}

.menu-collapse-more .btn-more:hover{
    background-color: transparent;
    box-shadow: none;
    color: #256FA0;
    border-bottom-color: #256FA0;
}

.sub-account{
    border-radius: 0;
    border: none;
    display: grid;
    grid-template-columns: 1fr 600px;
    gap: 20px;
    width: 90%;
    margin: 0 auto;
    padding: 50px 10px;
    align-items: flex-start;
}

.sub-account .docs{
    width: 600px;
    min-width: 600px;
    padding-left: 20px;
    border-left: #eee 1px solid;
}

.sub-account .docs a{
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 10px;
}

.sub-account .docs a .icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: #f2f2f2;
    color: #999;
    text-indent: 0;
}

.sub-account .docs a .icon i.fa{
    color: #999;
}

.sub-account .docs a .info{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.sub-account .docs a .info p{
  font-size: 1.1em;
  line-height: 1.2;
  margin: 0;
}

.sub-account .docs a .info span{
    font-size: .8em;
    line-height: 1;
    height: auto;
    color: #aaa;
}

.sub-account .menutitle, .sub-login .menutitle{
    line-height: 1.2;
}

.sub-account .docs .menu-item{
 display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap:20px 15px;
    margin-top: 15px;
}

/* layout */
.menu-layout-1 .menutitle{
margin-bottom: 16px;
}

.menu-layout-1 .body{
    display: grid;
grid-template-columns: 250px 1fr;
    gap:20px;
}

.menu-layout-1 li.book-ticket{
    padding-bottom: 0;
}

.menu-layout-1 .book-ticket-btn .btn{
   border: none;
   background-color: #eaf7ff;
   padding:8px 10px;
}

.menu-layout-1 .book-ticket-btn .btn:hover{
   box-shadow: none;
   color: #eaf7ff;
   background-color: #256fa0;
}

.menu-layout-2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 15px;
}

.menu-layout-2 > li{
    border: none!important;
    padding: 0!important;
}

.menu-layout-2 .menutitle3 a{
    display: flex;
    height: 120px;
    align-items: flex-end;
    padding: 15px;
    border: 1px solid #eee;
    background-image: url('./images/menu-item-bg-01.png');
    background-repeat: no-repeat;
    background-position: right bottom;
    position: relative;
}

.menu-layout-2 .menutitle3 a::after{
    position: absolute;
    left: 10px;
    top: 10px;
    font-size: 2.5rem;
    width: auto;
    height: auto;
    background-color: transparent;
}

[class*="menu-col-"].menu-item > li{
  padding-bottom: 0px;
}

.menu-col-2{
    display: grid!important;
    grid-template-columns: repeat(2, 1fr);
    gap:14px 5px;
}

.menu .sub-area.menu-col-2 > li:nth-child(2n+1) {
    border-left: none;
}

.menu-col-3{
    display: grid!important;
    grid-template-columns: repeat(3, 1fr);
    gap:14px 5px;
}

.menu .sub-area.menu-col-3 > li:nth-child(3n+1) {
    border-left: none;
}

.menu-col-4{
    display: grid!important;
    grid-template-columns: repeat(4, 1fr);
    gap:14px 5px;
}

.menu .sub-area.menu-col-4 > li:nth-child(4n+1) {
    border-left: none;
}

.menu-col-5{
    display: grid!important;
    grid-template-columns: repeat(5, 1fr);
    gap:14px 5px;
}

.menu .sub-area.menu-col-5 > li:nth-child(5n+1) {
    border-left: none;
}

.menu-single-link {
    width: 179px;
    min-width: 179px;
    flex: 0 0 179px;
    margin-left: auto;   /* ← 靠右關鍵 */
}

header { padding: 1rem 0; }

footer { font-size: .7rem; padding: 10px ;}

footer p {margin:0; line-height: 2em;}

#content { padding:  0;}

.bottom-border { border-bottom: #efefef 5px solid;}

a {margin: 0; padding: 0; text-decoration:none;}
a:active, a:hover {outline-width: 0;}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: inherit;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: .5em;
  margin-top: 0;

}
h6,
.h6 {
  font-size: .8rem;
}
header { padding: 1rem 0; }

div.menutitle a span { color: #333; }

div.menutitle a:hover { color: #256fa0; }

a, a:hover, a:focus, a:active, a:visited { color: #256fa0; }

.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon { background: #256fa0; border-color: #256fa0; }

.btn { border-color: #256fa0; color: #256fa0; border-radius: 6px; }

.btn-danger {color: #fff; background-color: #d9534f; border-color: #d43f3a}

.btn:hover, .btn:focus { background: #256fa0; border-color: #256fa0; color: #fff; }

.btn.btn-primary { background: #256fa0; border-color: #256fa0; color: #fff; }

.btn.btn-primary:hover, .btn.btn-primary:focus { background: #256fa0; border-color: #256fa0; border: 1px solid red; }

.btn.btn-link { color: #256fa0; }

.btn.btn-link:hover, .btn.btn-link:focus { color: #256fa0; background-color: #fff; border-color: #fff; }

.language-selector { padding-top: 14px; }

a.btn-3d, .btn-3d { min-width: 200px; background: #00d1e0; background: -moz-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: -webkit-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: -webkit-gradient(linear, left top, left bottom, from(#00d1e0), to(#00c4d8)); background: -o-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: linear-gradient(to bottom, #00d1e0 0%, #00c4d8 100%); color: #fff; padding: 12px 15px; -webkit-box-shadow: 0 5px 0 #00a2b5, 0 7px 5px rgba(0, 0, 0, 0.3); box-shadow: 0 5px 0 #00a2b5, 0 7px 5px rgba(0, 0, 0, 0.3); border: 1px solid transparent; border-radius: 4px; }

a.btn-3d:hover, .btn-3d:hover, a.btn-3d:focus, .btn-3d:focus { background: #44d9ea; background: -moz-linear-gradient(top, #44d9ea 13%, #00d1e0 90%, #00c4d8 100%); background: -webkit-linear-gradient(top, #44d9ea 13%, #00d1e0 90%, #00c4d8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(13%, #44d9ea), color-stop(90%, #00d1e0), to(#00c4d8)); background: -o-linear-gradient(top, #44d9ea 13%, #00d1e0 90%, #00c4d8 100%); background: linear-gradient(to bottom, #44d9ea 13%, #00d1e0 90%, #00c4d8 100%); -webkit-box-shadow: 0 5px 0 #00a2b5, 0 7px 5px rgba(0, 0, 0, 0.3); box-shadow: 0 5px 0 #00a2b5, 0 7px 5px rgba(0, 0, 0, 0.3); color: #fff; }

a.btn-3d:active, .btn-3d:active { background: #00d1e0; background: -moz-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: -webkit-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: -webkit-gradient(linear, left top, left bottom, from(#00d1e0), to(#00c4d8)); background: -o-linear-gradient(top, #00d1e0 0%, #00c4d8 100%); background: linear-gradient(to bottom, #00d1e0 0%, #00c4d8 100%); color: #fff; -webkit-box-shadow: 0 2px 0 #00a2b5, 0 3px 3px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 0 #00a2b5, 0 3px 3px rgba(0, 0, 0, 0.5); position: relative; top: 3px; }

#content { padding: .2rem 0 1rem 0; }

#content .toast-pale-yellow { background: #fcf8e3; border-color: #faebcc; color: red; padding: 1rem; }

#content .toast-pale-yellow h5 { color: green; }

#content .toast-light-blue { background: #d9edf7; border-color: #bce8f1; color: red; padding: 1rem; }

#content .panel-title { font-size: 1rem; font-weight: 800; color: red; }

#content .panel-body .mx-8rem { margin: 0 8rem; }

#content .panel-body .top-border { border-top: #efefef 1px solid; padding: .4rem 0; }

#content .booking-details h5 { border-bottom: #efefef 1px solid; margin-top: .4rem; padding-bottom: .4rem; font-weight: 800; }

#content .booking-title { background-color: #086873; color: white; padding: .6rem; font-size: .7rem; }

#content .booking-title span { font-size: 1.2rem; margin-left: .2rem; }

#content .booking-body { padding: 0 .4rem; }

#content .booking-body .column { padding: .4rem; border: #efefef 1px solid; }

#content .booking-footer { margin-top: .4rem; }

#content .tab { border-bottom: 1px solid #ccc; }

#content .tab a { padding: 8px 16px; background: #efefef; border-top: 4px solid #efefef; border-bottom: 1px solid #fff; margin-right: 1px; }

#content .tab .active a, #content .tab a:hover { border-top: 4px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; background: #fff; position: relative; bottom: -1px; color: #256fa0; }

#content .one-way { padding: 1rem; margin-top: 1rem; border: #ccc 1px solid; }

#content .one-way h5 { border-bottom: #efefef 1px solid; padding-bottom: .4rem; }

/*#content .one-way .not-required { margin-top: 1.8rem; }*/

#content .one-way .time-table-query, #content .one-way a { color: #E20000; font-size: .75rem; }

footer { font-size: .7rem; }

.booking-people { height: 32px; padding: .4rem 0; margin: .2rem 0; }

#input-example-1 { width: 15.2rem; }

.__red { border: 1px solid red; }

/*# sourceMappingURL=style.css.map */

@media screen and (min-width: 1000px) {
.pc{
	display: block;
	}
.mobile{
	display: none;
	}	
.ap{
 margin-left: -8px;
}	
.p-2{
	margin-top: -8px;
	}
.col-s3 {
  width: 14.833%;
}
	.container_bg {
  height: 420px;
  background-image: url(../images/img-compressor.jpg);
  background-repeat: no-repeat;
}

header .navbar-brand img { 
	margin-right: 20px; 
}
.col-xl { width: 1170px !important; }	
.container { 
  width: 1170px; 
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}	
.navbar .navbar-brand{
	font-size:.9rem;font-weight:500;text-decoration:none;
	}	
}
.float-center{
	text-align: center;
}
@media screen and (max-width: 999px) {
.pc{	
	display: none;	
}
.mobile{	
	display: block;
	}	
.p-2{
		
	}	
	.col-xs-12{
		width: 100%!important;
	}	
.container_bg {
    background-image: url(../images/img-compressor.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
	height: 150px;
}
.m10{
	width: 100%!important;	
	}
.col-s3 {
  width: 31.3%;
  height:50px;
 margin-bottom: 3px;
}
.col-6 {
  width: 100%!important;
}
.col-2 {
  width: 50%;
}
.col-12 {
  width: 100%!important;
}
header .navbar-brand img { 
	margin-right: 20px; 
	width: 200px;
}
.navbar .navbar-brand{
	
	font-size:.9rem;font-weight:500;text-decoration:none;
	}
.col-xl { width: 100% !important; }
.container { 
  width: 100%; 
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}
}




.bg-dark{
  background:#454d5d;
  color:#ffffff;
}

.service_btn {
  background-color:#be4c00;
  border: none;
  font-size: .6rem;
  color: #fff;
  -webkit-border-radius: 2;
  -moz-border-radius: 2;
  border-radius: 2px;
  padding: 0 5px;
  cursor: pointer;
}

.row:before,
.row:after {
  display: table;
  content: " ";
}

.row:after {
  clear: both;
}
.row {
  margin-right: 0px;
  margin-left: 0px;
  vertical-align:bottom;
}
/* .row a, a:hover {color: #ffffff; font-weight: bold;} */

.col-s3, .col-s7 {
  position: relative;
  min-height: 1px;
  padding-right: 0px;
  padding-left: 0px;
  float: left;
}

.col-s7 {
  width: 84.167%;
}

.linkbutton {
  padding:6.5% 0 1% 1%;
  float: left;
  background-image: url(../images/icon.png);
  background-repeat: no-repeat;
  background-position:95% 88%;
}

.align-r {
  text-align: right;
  float:right;
  padding:5% 0 1% 1%;
} 

.mr {margin-right: 1%;}
.pl20 {margin-left: 20px;}
.mt10 {margin-top: 10px!important;}
.mb10 {margin-bottom: 10px;}

.bgb1 { background-color: #4d57c1;}
.bgb2 { background-color: #4d57c1;}
.bgo1 { background-color: #be4c00;}
.bgo2 { background-color: #be4c00;}
.bgg1 { background-color: #737373;}
.bgg2 { background-color: #737373;}

.columns{display:flex;display:-ms-flexbox;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:0;margin-right:0;}
.columns.col-gapless{margin-left:0;margin-right:0;}
.columns.col-gapless>.column{padding-left:0;padding-right:0}
.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}

.navbar{align-items:stretch;display:flex;display:-ms-flexbox;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between;}
.navbar .navbar-section{align-items:center;display:flex;display:-ms-flexbox;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center;}
.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end;}
.navbar .navbar-center{align-items:center;display:flex;display:-ms-flexbox;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center;}


.text-gray{color:#66758c;}
.text-bold {font-weight: bold;}

.none {display:none;}

@media print {
	.hide-print {
		visibility: hidden
	}
}

a.links, .links {/*黃色連結*/
    color: #256fa0!important;
}
a.links:hover {
    text-decoration: underline;
}

a.blacklinks, .blacklinks {/*黃色連結*/
    color: #667189!important;
}

a.color-rag,
.color-rag {/*橘色*/
    color: #af0015;
}

/* layout */
.menu-layout-1 .menutitle{
margin-bottom: 16px;
}

.menu-layout-1 .body{
    display: grid;
grid-template-columns: 250px 1fr;
    gap:20px;
}

.menu-layout-1 li.book-ticket{
    padding-bottom: 0;
}

.menu-layout-1 .book-ticket-btn .btn{
   border: none;
   background-color: #eaf7ff;
   padding:8px 10px;
}

.menu-layout-1 .book-ticket-btn .btn:hover{
   box-shadow: none;
   color: #eaf7ff;
   background-color: #256fa0;
}

.menu-layout-2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 15px;
}

.menu-layout-2 > li{
    border: none!important;
    padding: 0!important;
}

.menu-layout-2 .menutitle3 a{
    display: flex;
    height: 120px;
    align-items: flex-end;
    padding: 15px;
    border: 1px solid #eee;
    background-image: url('./images/menu-item-bg-01.png');
    background-repeat: no-repeat;
    background-position: right bottom;
    position: relative;
}

.menu-layout-2 .menutitle3 a::after{
    position: absolute;
    left: 10px;
    top: 10px;
    font-size: 2.5rem;
    width: auto;
    height: auto;
    background-color: transparent;
}

.menu-single-link > div + div{
    border-top: 1px solid #ddd;
}

.menu-single-link a{
    padding: 12px 15px 12px 8px;
    display: block;
    font-size: .95em;
    position: relative;
}

.menu-single-link a:hover{
    background-color: #f2f2f2;
}

.menu-single-link a:after{
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    color: #dedede;
}

.menu-single-link a:hover:after{
    color: #256FA0;
}

ul.menu-item {
	margin-top: 10px !important;
	margin-left: 0 !important;
	padding: 0 !important;
}

.red { color: #860002; }

img {
    max-width: 100%;
}

div.info p {
	color: #333;
}

a.btn-basic, .btn-basic {
    background: #256fa0;
    color: #fff;
}

a.btn-basic:hover, .btn-basic:hover {
    background: #009bad;
    border-color: #009bad;
    color: #fff;
}

.btn.btn-lg {
    font-size: 1em !important;
}

li.current {
	z-index: 999;
}

.h70_30.over70 {
    margin-bottom: -30px;
}