@charset "utf-8";
/* CSS Document */
body .ap {
    position:relative;
    padding: 10px;
    font-size: 100%;
}
body .ap .page {
    text-align: center;
    padding: 10px 0;
}
body .ap .subtt {
    font-size: 120%;
    font-weight:bold;
}
/*主要架構*/
body .maintitle {
    display:block;
    background-color: #5e7a87;
    padding: 12px 20px;
    font-size: 120%;
    font-weight: bold;
    color: #fff;
    margin: 10px 0;
    border-radius: 50px;
    position:relative;
    background-repeat:no-repeat;
    background-position: 13px center;
}
.ap .subtitle {
    display:block;
    padding: 10px 10px 10px 35px;
    font-size: 130%;
    font-weight: 600;
    position: relative;
}
.ap .subtitle::before {
    content:"";
    display:block;
    position:absolute;
    width: 15px;
    height: 15px;
    background-color: #009688;
    border-radius:100%;
    border: 3px solid #ffd823;
    left: 10px;
    top: 17px;
}
.ap .subtitle01 {
    font-size: 130%;
    font-weight:bold;
    color:#9c0000;
    text-align:center;
    padding:10px;
    display:block;
}
.home .setbtn {
    position:relative;
    display:block;
    margin-bottom:15px;
    text-align:right;
}
.home .setbtn a {
    background-color: #007368;
    display:inline-block;
    border-radius:5px;
    color:#FFF;
    padding:7px 15px;
    text-decoration:none;
}
.home .setbtn a:hover {
    background-color:#009688;
    color:#FFF;
}
body .modal-title {
    font-weight:bold;
}
.color-red {
    color:#e23c3d;
}
/*radio button*/
.radio {
    margin: 0 10px 0 0;
    display: inline-block;
    color: #555;
    padding: 5px 0;
}
.radio input[type=radio] {
    position: absolute;
    opacity: 0;
}
.radio input[type=radio] + .radio-label:before {
    content: "";
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #cf9625;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    position: relative;
    margin-right: 5px;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    transition: all 250ms ease;
}
.radio input[type=radio]:checked + .radio-label:before {
    background-color: #167c28;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}
.radio input[type=radio]:focus + .radio-label:before {
    outline: none;
    border-color: #3197EE;
}
.radio input[type=radio]:disabled + .radio-label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}
.radio input[type=radio] + .radio-label:empty:before {
    margin-right: 0;
}
/*checkbox*/
.styled-checkbox {
    position: absolute;
    opacity: 0;
}
.styled-checkbox + label {
    position: relative;
    cursor: pointer;
    padding: 0;
}
.styled-checkbox + label:before {
    content: "";
    margin: 0 6px 0 0;
    display: inline-block;
    vertical-align: text-top;
    width: 20px;
    height: 20px;
    background: white;
    border: 1px #ccc solid;
}
.styled-checkbox:hover + label:before {
    background: #f35429;
}
.styled-checkbox:focus + label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}
.styled-checkbox:checked + label:before {
    background: #125924;
}
.styled-checkbox:disabled + label {
    color: #b8b8b8;
    cursor: auto;
}
.styled-checkbox:disabled + label:before {
    box-shadow: none;
    background: #ddd;
}
.styled-checkbox:checked + label:after {
    content: "";
    position: absolute;
    left: 5px;
    top: 9px;
    background: white;
    width: 2px;
    height: 2px;
    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
    transform: rotate(45deg);
}
/*表格TPASS*/
@media screen and (max-width: 767px) {
.home .tabbox {
    max-width: 100%;
    overflow-x: scroll;
}
}
.home .table-no {
    background-color: #D4E8CF;
    position:relative;
    text-align: center;
    width: 100%;
    /* min-width: 600px; */
}
.home .table-no p {
    margin-bottom:0;
}
.home .table-no th {
    color: #FFF;
    font-weight: bold;
    background-color: #008299;
    padding:15px 6px;
    border-right:1px solid #FFF;
}
.home .table-no th.tt {
    position:relative;
}
/*.home .table-no th.tt:before {
    content:"";
    position:absolute;
    width: 150px;
    height:1px;
    background-color:#fff;
    transform: rotate(27deg); 
    left: 0;
}*/
.home .table-no th.tt p {
    position:absolute;
    margin:0;
}
.home .table-no th.tt p.w01 {top: 15px;right: 10px;}
.home .table-no th.tt p.w02 {left: 7px;bottom: 10px;line-height: 20px;}
.home .table-no td {
    padding: 8px;
}
.home .table-no td {
    border-bottom:1px solid #FFF;
    border-right:1px solid #FFF;
    background-color: #e3eff0;
}
.home .table-no td:first-child {
    border-left:1px solid #FFF;
}
.home .rwd-table {
    min-width: 100%;
    background-color: #e3eff0;
    position:relative;
}
.home .rwd-table ul,
.home .rwd-table p {
    margin:0;
}
.home .rwd-table th,
.home .rwd-table td:before {
    color: #FFF;
    font-weight: bold;
    background-color: #008299;
}
.home .rwd-table tr {
    border-bottom:1px solid #FFF;
    position: relative;
}
.home .rwd-table tr:last-child {
    border-bottom:none;
}
.home .rwd-table td a {
    color:#004878;
}
@media screen and (max-width: 767px) {
.home .rwd-table {
    background-color: #FFF;
    overflow: hidden;
}
.home .rwd-table th {
    display: none;
} 
.home .rwd-table th,
.home .rwd-table td:before {
    color: #000;
}
.home .rwd-table td:before {
    content: attr(data-th) " : ";
    font-weight: bold;
    margin-right: 5px;
    display: block;
    background-color:transparent;
    color:#000;
}
.home .rwd-table td:first-child:before {
    display:inline-block;
    color:#FFF;
}
.home .rwd-table td:first-child {
    background-color:#008299;
    color:#FFF;
}
.home .rwd-table td {
    text-align: left !important;
    padding: 10px;
    display: block;
    background-color:#e3eff0;
    border-bottom:1px solid #FFF;
}
.home .rwd-table tr {
    margin-bottom:10px;
    display:block;
}
}
@media screen and (min-width: 767px) {
.home .rwd-table td:before {
    display: none;
}
.home .rwd-table th,
.home .rwd-table td {
    display: table-cell;
    padding: 0.25em 0.5em;
    word-break: break-all;
}
.home .rwd-table th:first-child,
.home .rwd-table td:first-child {
    padding-left: 0;
}
.home .rwd-table th:last-child,
.home .rwd-table td:last-child {
    padding-right: 0;
}
.home .rwd-table th {
    padding:15px 6px !important;
    border-right:1px solid #FFF;
}
.home .rwd-table td {
    padding: 10px !important;
    border-bottom:1px solid #FFF;
    border-right:1px solid #FFF;
    text-align:center;
}
.home .rwd-table td:first-child {
    border-left:1px solid #FFF;
}
.home .rwd-table td:last-child {
    /* text-align:left; */
}
.home .rwd-table th:nth-child(1)::before {
    display: none;
}
.home .rwd-table th {
    position: relative;
    word-break: keep-all;
    text-align: center;
    border-bottom: 1px #FFF solid;
}
}
/*表格maas*/
.home .rwd-table-tc {
    min-width: 100%;
    background-color: #ffffff;
    position:relative;
}
.home .rwd-table-tc ul,
.home .rwd-table-tc p {
    margin:0;
}
.home .rwd-table-tc th,
.home .rwd-table-tc td:before {
    color: #FFF;
    font-weight: bold;
    background-color: #008299;
}
.home .rwd-table-tc tr {
    border-bottom:1px solid #FFF;
    position: relative;
}
.home .rwd-table-tc tr:last-child {
    border-bottom:none;
}
@media screen and (max-width: 767px) {
.home .rwd-table-tc {
    background-color: #FFF;
    overflow: hidden;
}
.home .rwd-table-tc th {
    display: none;
} 
.home .rwd-table-tc th,
.home .rwd-table-tc td:before {
    color: #000;
}
.home .rwd-table-tc td:before {
    content: attr(data-th) " : ";
    font-weight: bold;
    margin-right: 5px;
    display: block;
    background-color:transparent;
    color:#000;
}
.home .rwd-table-tc td:first-child:before {
    display:inline-block;
    color:#FFF;
}
.home .rwd-table-tc td:first-child {
    background-color:#008299;
    color:#FFF;
}
.home .rwd-table-tc td {
    text-align: left !important;
    padding: 10px;
    display: block;
    background-color:#eee;
    border-bottom:1px solid #ccc;
}
.home .rwd-table-tc tr {
    margin-bottom:10px;
    display:block;
}
}
@media screen and (min-width: 767px) {
.home .rwd-table-tc td:before {
    display: none;
}
.home .rwd-table-tc th,
.home .rwd-table-tc td {
    display: table-cell;
    padding: 0.25em 0.5em;
    word-break: break-all;
}
.home .rwd-table-tc th:first-child,
.home .rwd-table-tc td:first-child {
    padding-left: 0;
}
.home .rwd-table-tc th:last-child,
.home .rwd-table-tc td:last-child {
    padding-right: 0;
}
.home .rwd-table-tc th {
    padding:15px 6px !important;
    border-right:1px solid #FFF;
}
.home .rwd-table-tc td {
    padding: 6px !important;
    border-bottom:1px solid #FFF;
    border-right:1px solid #FFF;
    text-align:center;
}
.home .rwd-table-tc tr:nth-child(2n+2) {
    background-color:#eee;
}
.home .rwd-table-tc td:first-child {
    border-left:1px solid #FFF;
}
.home .rwd-table-tc td:last-child {
    text-align:left;
}
.home .rwd-table-tc th:nth-child(1)::before {
    display: none;
}
.home .rwd-table-tc th {
    position: relative;
    word-break: keep-all;
    text-align: center;
    border-bottom: 1px #FFF solid;
}
}
/*表單模組*/
.form_box {
    /*background-color: rgba(164,119,26,0.2);*/
    border-radius: 15px;
    padding: 20px;
}
.form_box label {
    margin: 0;
    white-space: nowrap;
}
.form_box .note {
    font-size: 90%;
    color: #ad0b0b;
    padding: 5px 0 0 15px;
    white-space: nowrap;
}
.form_box .file .note {
    padding: 0;
    white-space: inherit;
}
.form_box .more {
    text-align: center;
    padding: 35px 0 20px 0;
}
.form_box input,.form_box select,.form textarea {
    border: 1px #c3c3c3 solid;
    padding: 8px 15px;
    max-width: 100%;
}
.form_box .file input[type=button] {
    border-radius: 100px !important;
    padding: 8px 20px 8px 30px !important;
    background-color: #585858;
    color: #fff;
    background-image: url(../images/inside/ic_add.svg);
    background-repeat: no-repeat;
    background-size: 11px;
    background-position: 15px 50%;
}
.form_box .file input[type=button]:hover {
    background-color: #125924;
}
.form_box .file input {padding: 8px 15px 8px 0;border-radius: 0;}
.form_box textarea {
    border: none;
    border-radius: 15px;
    padding: 10px;
    width: 100%;
    margin: 5px 0 0 0;
}
.form_box .form_item {
    border-bottom: 1px #b6a480 solid;
    padding: 15px 10px;
}
.form_box .field .num_bt {
    padding: 0 3px;
    display: inline-block;
}
.form_box .field .num_bt a {
    display: inline-block;
    background-color: #555;
    width: 45px;
    border-radius: 100px;
    padding: 8px;
    height: 45px;
    text-align: center;
}
.form_box .field .num_bt a:hover {
    background-color: #125924;
}
.form_box .field .num_bt a img {
    width: 25px;
    height: 25px;
}
.form_box .field .img_num {
    padding: 5px;
    display: inline-block;
}
.form_box .ftitle01 {    
    white-space: nowrap;
    font-weight: bold;
    font-size: 110%;
}
.form_box .field .check {
    display: inline-block;
    margin: 0 10px 0 0;
    color: #555;
    padding: 5px 0;
}
.form_box .ftitle01 span {
    color: #b10505;
    font-size: 85%;
    margin: 0 5px 0 0;
    font-weight: normal;
}
.ap .form-row {
  padding: 10px;
}
.ap .custom-control {
  margin-left: 15px;
  padding: 2px 20px;
}
.ap .custom-radio label {
  display:inline-block;
}
.paycardform {
    max-width:600px;
    margin:auto;
}
.paycardform p {
    margin:0;
}
.paycardform select {
    width: 100px;
}
.paycardform span {
    color:#c20000;
    font-size:95%;
    font-weight:initial;
}
.paycardform .audio audio {
    max-width: 100%;
    height: 40px;
}
.paycardform .refresh {
    padding:5px;
}
.paycardform .refresh a {
    padding: 10px;
    background-color:#1b8198;
    border-radius:5px;
    display:flex;
    align-items:center;
}
.paycardform .refresh a:hover {
    background-color:#005265;
}
.personaldata label {
    font-weight:bold;
    margin: 0;
}
.personaldata span {
    color:#c20000;
    margin-left:5px;
    /* font-size: 100%; */
    /* font-weight:initial; */
}
.personaldata .note {
    padding:10px;
    border-radius:5px;
    background-color:#fff8e9;
    margin-bottom:10px;
}
.personaldata .custom-control {
    margin: 0 4px;
}
/*文字基本設定*/
.fs-1 {
    font-size:110%;
}
.fw-bold {
    font-weight:bold;
}
.word-break {
    word-break:break-all;
}
@media (min-width:575px) {
.form_box .ftitle01{
    width: 155px;
    min-width: 155px;
}
}
@media (max-width:575px) {
.form_box .ftitle01{
    margin: 0 0 5px 0;
}
}
@media (max-width:767px) {
.paycardform .mth {
    padding-top:10px;
}
}
/*搜尋模組*/
.search_list {
    padding: 15px;
}
.search_list .year a img {
    width: 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.search_list .year a {
    display: block;
    border: 1px #afafaf solid;
    width: 40px;
    height: 40px;
    position: relative;
    border-radius: 5px;
    opacity: 0.3;
    background-color: #e5e5e5;
}
.search_list .year p {
    margin: 0;
    padding: 0 10px;
    font-size: 180%;
    font-weight: bolder;
}
.search_list .season ul {
    padding: 0 10px;
    margin: 0;
    list-style-type: none;
    display: inline-block;
}
.search_list .season {
    text-align: center;
}
.search_list .season ul li {
    display: inline-block;
    padding: 5px;
}
.search_list .season ul li a {
    background-color: #ededed;
    padding: 9px 15px;
    border-radius: 5px;
    color: #000;
    font-size: 110%;
    text-decoration: none;
    display: block;
}
.search_list .season ul li a:hover {
    background-color: #000;
    color: #fff;
}
.search_list .year a:hover {
    opacity: 1;
}
.search_list .year a:last-child img {
    -moz-transform: scaleX(-1) translate(30%, -50%);
    -webkit-transform: scaleX(-1) translate(30%, -50%);
    -o-transform: scaleX(-1) translate(30%, -50%);
    -ms-transform: scaleX(-1) translate(30%, -50%);
    transform: scaleX(-1) translate(30%, -50%);
}
.search_list .day svg {
    fill: #0a4623;
}
.search_list .day a:hover svg {
    fill: #1a7630;
}
.search_list button {
    background-color: #5b6497;
    border-radius: 50px;
    padding: 8px 20px;
    color: #fff;
    text-decoration: none;
    font-size: 105%;
    letter-spacing: 1px;
    border: none;
    white-space: nowrap;
    transition: all 200ms ease-out;
}
.search_list button:hover {
    background-color: #364079;
}
@media (max-width:992px) {
.search_list .date_stitle {
    position: absolute;
    top: 0;
}
.search_list .date_search {
    padding: 25px 0 0 0;
    position: relative;
}
}
@media (max-width:767px) {
.search_list .row .col-12 {
    padding:5px 0px;
}
}
@media (max-width:480px) {
.search_list .event_keyword {
    padding: 25px 0 0 0;
    position: relative;
}
.search_list .event_keyword .w01 {
    position: absolute;
    top: 0;
    left: 10px;
}
}
/*頁籤*/
.ap .nav-tabs {
    border-bottom: 2px solid #007B94;
}
.ap .nav-tabs .nav-item {
    text-align: center;
    font-size: 125%;
}
.ap .nav-tabs .nav-item.show .nav-link,
.ap .nav-tabs .nav-link.active {
    background-color: #007B94;
    color:#fff;
    padding: 10px 20px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.ap .nav-tabs .nav-link {
    padding: 10px 20px;
    color: #007B94;
    border-radius:0;
    border: none;
}
.ap .tab-pane .flexbox {
    position:relative;
    display:flex;
    padding: 40px 15px 20px 15px;
    align-items: center;
    justify-content: center;
    flex-wrap:wrap;
}
.ap .tab-pane .flexbox .sharebtn,
.ap .tab-pane .flexbox .login {
    width:50%;
}
.ap .reglink {
    position:relative;
    padding:10px;
    text-align:center;
    margin-bottom:20px;
}
.ap .reglink a {
    margin-left:20px;
}
.ap .tab-pane .flexbox .login .alert-dismissible .close {
    top:-3px;
    padding:0;
}
@media screen and (max-width: 767px) {
.ap .tab-pane .flexbox .sharebtn,
.ap .tab-pane .flexbox .login {
    width:100%;
}
.ap .sharebtn {
    padding: 0 10px;
    border-right:none;
    border-bottom:1px solid #ddd;
}
.ap .turebtn li {
    width:100%;
}
.ap .nav-tabs .nav-item {
    font-size: 115%;
}
.ap .nav-tabs .nav-link {
    padding:12px;
}
.ap .nav-tabs .nav-item.show .nav-link,
.ap .nav-tabs .nav-link.active {
    padding:12px;
}
.ap .tab-pane .flexbox {
    padding:15px;
}
.ap .turebtn {
    padding:0px;
}
}
/*分頁-按鈕*/
.ap .button {
    text-align: center;
    padding:20px 10px;
    margin-top: 0px;
    display:
    block;
    position: relative;
}
.ap .button .btn-primary {
    background-color:#a0008f;
    border:none;
    padding: 7px 30px;
    color:#FFF;
    margin: 5px;
    display:inline-block;
}
.ap .button .btn-primary:hover {
    background-color:#000;
}
.ap .button ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    text-align: center;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
}
.ap .button li {
    list-style-type:none;
    display:inline-flex;
    margin: 5px;
}
.ap .button li a {
    background-color: #332e2b;
    padding: 7px 20px;
    border-radius: 50px;
    color:#FFF;
    text-decoration: none;
}
.ap .button li a:hover {
    background-color:#795548;
}
.ap .fast_page {
    padding: 15px 0 0 0;
}
.ap .fast_page .go a {
    display: inline-block;
    background-color: #256a97;
    padding: 2px 10px;
    border-radius: 5px;
    color: #fff;
    text-decoration: none;
    margin: 0 10px;
}
.ap .fast_page .go a:hover {
    background-color: #FF5722;
}
/*節慶活動*/
.season_list .season_title {
    white-space: nowrap;
    font-size: 200%;
    margin: 30px 0 0 0;
    min-width: 160px;
    font-weight: bold;
    color: #487f87;
}
.season_list {
    padding: 0 15px;
    border-bottom: 1px #bfbfbf solid;
}
.season_list:last-child {
    border: none;
}
/*公車動態列表*/
.route_list {
    background-color:#FFF;
    margin-bottom:30px;
}
.route_list .route a{
    border-bottom: 1px #e3e3e3 solid;
    color: #000;
    text-decoration: none;
}
.route_list .route a:hover {
    background-color: #ececec;
}
.route .info p {
    margin: 0;
}
.route .info .site {
    font-size: 120%;
    font-weight: bold;
}
.route_list .route .info .arrow img {
    width: 35px;
    padding: 0 5px;
}
.route .ic_bus img {
    width: 30px;
}
.route .ic_bus {
    padding: 20px;
}
/*ibike*/
.bikebox .district {
    padding: 20px 0;
    font-size: 105%;
}
.bikebox .district ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.bikebox .district ul li {
    display: inline-block;
    padding: 10px 5px;
    width: 105px;
}
.bikebox .sort{
    border-top: 1px #ddd solid;
    padding: 10px;
}
.bikebox .sort ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: -webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
}
.bikebox .sort ul li {
    text-align: center;
    padding: 10px;
    width: 100%;
}
.bikebox .sort ul li a {
    display: block;
    background-color: #fff;
    border-radius: 100px;
    padding: 5px;
    border: 3px #94c621 solid;
    color: #94c621;
    font-weight: bold;
    font-size: 150%;
    text-decoration: none;
}
.bikebox .sort ul li a:hover {border: 3px #4caf50 solid;color: #4caf50;}
.bikebox .sort ul li.active a {
    background-color: #94c621;
    color: #fff;
}
@media screen and (min-width: 767px) {  
.bikebox .district .left{
    padding: 0 25px;
}
.bikebox .district .right {
    border-left: 1px #e3e3e3 solid;
    padding: 0 0 0 20px;
}
}
@media screen and (max-width: 767px) {
.bikebox .district .right {
    border-top: 1px #e3e3e3 solid;
    margin: 15px 0 0 0;
    padding: 10px 0 0 0;
}
.bikebox .district .left .check {
    padding: 0 0 0 5px;
}
.bikebox .sort ul {
    -webkit-flex-wrap:wrap;
flex-wrap:wrap;
}
}
@media screen and (max-width: 767px) {
.bikebox .district {
    padding: 20px 0;
    font-size: 100%;
}
.bikebox .district ul li {
    display: inline-block;
    padding: 10px 5px;
    width: 85px;
}
}
.btn-warning {
    background-color: #FFD460;
    border-color:#dbdbdb;
    overflow:hidden;
    font-size:120%;
    font-weight: bold;
    padding: .5rem 1.5rem;
}
.btn-warning img {
    margin-right:5px;
}
.btn-warning:hover {
    color: #212529;
    background-color: #FFD460;
    border-color: #d39e00;
}
.btn-warning:not(:disabled):not(.disabled).active {
    background-color: #FFD460;
}
/*.btn-warning:before {
  content: "";
  position: absolute;
  top: 0;
  right:0;
  width: 0;
  height: 100%;
  background-color: #FFD460;
  z-index: -1;
  -webkit-transition: all .6s;
  transition: all .5s;
}
.btn-warning.right:before {
  content: "";
  position: absolute;
  top: 0;
  left:0;
  width: 0;
  height: 100%;
  background-color: #FFD460;
  z-index: -1;
  -webkit-transition: all .6s;
  transition: all .5s;
}*/
.btn-warning:hover {
  color: #27323A;
}
/*.btn-warning:hover:hover:before {
  width: 100%;
}*/
@media screen and (max-width: 480px) {
.btn-warning {
    font-size:105%;
}
}
/*公車動態內容*/
.busdetail .stop_name {
    text-align: center;
    font-size: 130%;
    font-weight: bold;
}
.busdetail .stop_bt {
    text-align: center;
    margin: 0 0 30px 0;
}
.busdetail .stop_bt ul {
    padding: 0;
    margin: auto;
    list-style-type: none;
    max-width: 800px;
}
.busdetail .stop_bt ul li {
    width: 100%;
    padding: 5px 10px;
}
.busdetail .stop_bt ul li a {
    border-radius: 100px;
    display: block;
    border: 3px #487ba5 solid;
    color: #4a4a4a;
    font-weight: bold;
    font-size: 120%;
    text-decoration: none;
    padding: 5px;
}
.busdetail .stop_bt ul li .arrow {
    width: 55px;
    padding: 0 10px;
}
.busdetail .stop_bt ul li .arrow .a02 {
    display: none;
}
.busdetail .stop_bt ul li a:hover .arrow .a01 {
    display: none;
}
.busdetail .stop_bt ul li a:hover .arrow .a02 {
    display: block;
}
.busdetail .stop_bt ul li a:hover {
    background-color: #487898;
    color: #fff;
}
.busdetail .stop_bt ul li:first-child a {
    text-align: left;
}
.busdetail .stop_bt ul li:first-child .arrow {
    -moz-transform:scaleX(-1);
    -webkit-transform:scaleX(-1);
    -o-transform:scaleX(-1);
    transform:scaleX(-1);
}

.busdetail .stop_bt ul li:last-child a {
    text-align: right;
}
.busdetail .stop_list {
    text-align: center;
}
.busdetail .step-vertical {
    margin: auto;
    display: inline-block;
    padding: 0;
}
.busdetail .step-vertical li {
    display: flex;
    font-weight: 600;
    position: relative;
}
.busdetail .step-vertical li:last-child .site::before {
    border: none;
}
.busdetail .step-vertical .time {
    position: relative;
    padding-bottom: 2.35rem;
    padding-left: 1.5rem;
    padding-right: 2.5rem;
    text-align: right;
    min-width: 160px;
}
.busdetail .step-vertical .time span {
    background-color: #e4e4e4;
    border-radius: 100px;
    padding: 5px 15px;
    white-space: nowrap;
}
.busdetail .step-vertical .in .time span {
    background-color: #e24242;
    color: #fff;
}
.busdetail .step-vertical .coming .time span {
    background-color: #1ea395;
    color: #fff;
}
.busdetail .step-vertical .time::after {
    content: "";
    position: absolute;
    z-index: 2;
    right: 0px;
    top: -1px;
    transform: translateX(50%);
    border-radius: 50%;
    background: white;
    border: 4px gray solid;
    width: 20px;
    height: 20px;
}
.busdetail .step-vertical .site::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: -2px;
    height: 100%;
    border-left: 4px #b1b1b1 solid;
}
.busdetail .current-item .site::before {
    border-left: 4px #e24242 solid;
}
.busdetail .step-vertical .site {
    padding: 0 1.5em;
    position: relative;
    text-align: left;
}
.busdetail li.no-state .site,.busdetail .no-state .time, .no-state .fecha {
    color: gray;
}
.busdetail .step-vertical .fecha {
    font-size: 13px;
}
.busdetail .current-item .time::after {
    border: 4px solid #e24242;
    background-color: #fff;
}
.busdetail .current-item.in .time::after {
    background-color: #e24242;
}
/*捷運*/
.mrt_box {
    /* margin-bottom:30px; */
}
.mrt_box .mrtbar {
    padding: 15px;
    background-color: #f1f1f1;
}
.search_list .ic_round img {
    width: 35px;
    padding: 0 5px;
}
.mrt_box .info .ic_round img {
    width: 45px;
    padding: 0 10px;
}
.mrt_box .info .ic_round01 img {
    width: 45px;
    padding: 0 10px;
}
.mrt_box .info p {
    margin: 0;
    font-size: 120%;
    font-weight: bold;
}
.mrt_box .bt a {
    display: block;
    background-color: #ffffff;
    border-radius: 100px;
    padding: 10px 20px;
    color: #000;
    text-align: center;
    text-decoration: none;
}
.mrt_box .bt a:hover {
    background-color: #00bcd4;
}
.mrt_box .info {
    text-align: center;
    padding: 10px;
}
.mrt_box .info .time {
    color: #4662ad;
    font-weight: bold;
    margin: 0 0 0 5px;
    white-space: nowrap;
}
.mrt_box .info .form {
    color: #e95550;
    font-weight: bold;
    margin:0 5px;
    white-space: nowrap;
}
.mrt_box .note{
    font-size: 90%;
}
.mrt_box .note01 {
    font-size: 90%;
    margin:10px 0 0 0;
}
/*.mrt_box .coming {
    color: #005eae;
    margin-bottom:0;
}*/
.mrt_box a {
    color: #005eae;
}
.mrt_line {
    padding: 45px 20px;
    background-color: #FFF;
    margin-bottom: 30px;
}
.mrt_box .line01 .station {
    width: 100%;
    max-width: 600px;
    padding: 0 0 0 60px;
    position: relative;
}
.mrt_box .line01 .through .line02 {
    font-weight: normal;
    font-size: 85%;
    margin: 0 0 10px 0;
}
.mrt_box .line01 .through .line02 ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.mrt_box .line01 .through .line02 ul li {
    padding: 10px 5px;
    position: relative;
    display: flex;
    align-items: center;
}
.mrt_box .line01 .through .line02 ul li::before {
    content: "";
    width: 15px;
    height: 15px;
    background-color: #94c621;
    display: inline-block;
    border-radius: 100px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    left: -37px;
}
.mrt_box .line01 .through .line02 ul li span {
    position:absolute;
    left: -103px;
    font-size: 95%;
}
.mrt_box .line01 .station .data a {
    display: block;
    border-bottom: 1px #dfdfdf solid;
    padding: 5px 25px 10px 5px;
    color: #000;
    font-weight: normal;
    margin: 0 0 15px 0;
    font-size: 90%;
    position: relative;
}
.mrt_box .line01 .station .data a::after {
    content: "";
    position: absolute;
    display: block;
    width: 15px;
    height: 15px;
    border-top: solid 3px #000000;
    border-right: solid 3px #000000;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    right: 10px;
    bottom: 17px;
}
.mrt_box .line01 .station p {
    border-bottom: 1px #dfdfdf solid;
}
.mrt_box .line01:last-child .station p {
    border: none;
}
.mrt_box .line01 .station .cline p {
    border-radius: 100px;
    background-color: #94c621;
    display: inline-block;
    padding: 0;
    color: #fff;
    padding: 5px 15px;
}
.mrt_box .line01 .station .cline {
    margin: 15px 5px;
}
.mrt_box .line01 p {
    margin: 0;
    padding: 0 5px 10px 5px;
}
.mrt_box .line01 .station::after {
    content: "";
    width: 5px;
    position: absolute;
    top: 0;
    bottom: 0;
    display: block;
    background-color: #94c621;
    left: 28px;
}
.mrt_box .line01:last-child .station::after {
    bottom: 17px;
}
.mrt_box .line01 .station::before {
    content: "";
    width: 30px;
    height: 30px;
    position: absolute;
    display: block;
    background-color: #fff;
    border-radius: 100px;
    border: 5px #94c621 solid;
    left: 16px;
    z-index: 9;
}
.mrt_line .line01 {
    font-size: 130%;
    font-weight: bold;
}
.mrt_line .line01 .time {white-space: nowrap;}
@media screen and (max-width: 767px) {
.ic_round {
    padding: 0 0 10px 0;
    text-align: center;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.ic_round a {
    margin: auto;
}
}
@media screen and (max-width: 480px) {
.mrt_line .line01 .time{
    font-size: 80%;
    line-height: 185%;
}
}
/*列表*/
.ap .list-group {
    position:relative;
    margin-top:20px;
    display: block;
}
.ap .list-group .list_title {
    background-color: #715737;
    padding: 12px 15px;
    font-size: 125%;
    text-align: center;
    color: #fff;
    font-weight: 600;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
}
.ap .list-group .list_title.news {
    background-color: #C94C4A;
}
.ap .list-group ul {
    position:relative;
    margin:0;
    padding:0;
}
.ap .list-group li {
    position:relative;
    list-style-type:none;
    display:block;
    background-color: #FFF;
}
.ap .list-group li:nth-child(2n+2) {
    background-color:#ebebeb;
}
.ap .list-group li:last-child {
    border-bottom:none;
}
.ap .list-group li a {
    color:#333;
    padding: 15px;
    transition: all 200ms ease-out;
    display:block;
    position:relative;
}
.ap .list-group li p.tt {
    padding:5px 0;
    margin:0;
    position: relative;
    font-weight: bold;
    font-size:110%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.ap .list-group li a:hover {
    color:#1c8198;
    text-decoration:none;
    box-shadow: 0 0 10px rgb(0,0,0,0.3);
    position:relative;
    z-index:1;
}
.ap .list-group li .info {
    display:block;
    color: #555;
}
/*.ap .list-group ul li::after {
    content: "";
    position: absolute;
    display: block;
    height: 2px;
    left: 0;
    width: 0;
    bottom:0;
    background-color: #e87875;
    transition: all 200ms ease-out;
}*/
.ap .list-group ul li:hover::after {
    width: 100%;
}
.ap .list-group li .info p {
    display:inline-block;
    margin:0;
    font-size: initial;
    font-weight: initial;
}
.ap .list-group li .info .date {
    color: #5E7A87;
    margin-right:5px;
}
@media screen and (max-width: 480px) {
.ap .list-group li a {
    border-left:none;
    margin:10px 0;
    box-shadow:0 0 5px #ccc;
    border-radius:5px;
}
.ap .list-group li:nth-child(2n+2) {
    background-color:#FFF;
}
.ap .list-group li p.tt {
    white-space: inherit;
}
.ap .list-group ul li::after {
    display:none;
}
.ap .list-group .list_title {
    font-size:110%;
}
}
/*單頁內容*/
body.home .ap .detail .info {
    display:flex;
    font-size: 95%;
    flex-wrap: wrap;
}
body.home .ap .detail p {
    margin-bottom:5px;
}
body.home .ap .detail .info .date {
    display:inline-flex;
    margin: 2px 10px 2px 0;
}
body.home .ap .detail .info .date i {
    padding-right:5px;
}
body.home .ap .detail .info .map {
    /* padding:2px; */
    position:relative;
}
body.home .ap .detail .info .map p {
    background-color: #FFF;
    color: #555;
    border-radius:50px;
    padding:2px 10px;
    margin:2px;
    display:inline-block;
    border: 1px solid #999;
}
body.home .ap .detail .info.a {
    display:block;
    /*border-bottom: 2px solid #7fc5c7;*/
    padding:10px 15px;
    margin-bottom: 10px;
    background-color:#dee9ea;
    border-radius:5px;
}
body.home .ap .detail .info.a p {
    margin-bottom:5px;
    width:50%;
    float:left;
}
body.home .ap .detail .subject {
    font-size:130%;
    font-weight:600;
    padding:5px 0;
    color: #0b8089;
    border-bottom: 1px solid #ccc;
}
body.home .ap .detail .edit {
    padding: 20px 0;
    line-height:160%;
}
body.home .ap .detail .edit img {
    max-width:100%;
}
body.home .ap .detail .stt {
    padding: 5px 10px;
    color:  #000;
    font-weight:600;
    margin:  0;
    font-size:120%;
    position:relative;
    background-color: #c9e0e3;
}
body.home .ap .detail .stt::after {
    position: absolute;
    /* top: 50%; */
    left:0;
    bottom: 0;
    /* transform: translateY(-50%); */
    content: '';
    width: 92px;
    height: 2px;
    background-color: #000000;
}
/*相關連結+檔案*/
body.home .ap .detail .download,
body.home .ap .detail .link {
    margin: 35px 0 0 0;
}
body.home .ap .detail .download ul {
    padding:0;
    background-color: #FFF;
}
body.home .ap .detail .download li {
    border-top: 1px #cecece dashed;
    padding: 10px;
    margin:0;
    position: relative;
    display:block;
}
body.home .ap .detail .download li:before {
    content: "❯";
    margin-right:5px;
}
body.home .ap .detail .download li li:before {
    content: "";
}
body.home .ap .detail .download .icon li a:hover {
    opacity: 0.7;
}
body.home .ap .detail .download .icon li, 
body.home .ap .detail .download li:nth-child(1),
body.home .ap .detail .link li:nth-child(1) {
    border: none;
}
body.home .ap .detail .download .icon li {
    float: left;
    margin-left: 5px;
    padding: 0;
}
body.home .ap .detail .download .icon {
    position: relative;
    bottom: -5px;
    display: inline-block;
}
body.home .ap .detail .download .icon li::before {
    display: none;
}
body.home .ap .detail .link {
    position:relative;
}
body.home .ap .detail .link ul {
    display:block;
    padding:0;
    margin-top: 5px;
}
body.home .ap .detail .link li {
    display:inline-block;
    margin: 0;
}
body.home .ap .detail .link li a {
    background-color: #008577;
    color:#FFF;
    text-decoration:none;
    display:inline-block;
    border-radius:3px;
    margin: 4px 2px;
    padding: 6px 12px;
}
body.home .ap .detail .link li a:hover {
    background-color:#f28711;
}
/*相關圖片*/
body.home .ap .album {
    position:relative;
}
body.home .ap .album ul {
    position:relative;
    list-style-type:none;
    padding:0;
}
body.home .ap .album li {
    padding:10px;
    display:
    flex;
    flex-wrap:
    wrap;
    align-items:
    stretch;
    position:
    relative;
}
body.home .ap .album li a {
    color:#333;
    padding:10px;
    display:block;
    width:100%;
    box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
    background-color: #FFF;
}
body.home .ap .album li a:hover {
    text-decoration:none;
}
body.home .ap .album li p {
    margin:0;
    padding-top:5px;
}
body.home .ap .album .pic {
    width: 100%;
    padding-top: 75%;
    position: relative;
    margin-bottom: 5px;
    background-color: #f5f5f5;
    overflow: hidden;
}
body.home .ap .album .pic img {
    transition: all 200ms ease-out;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: scale(1) translate(-50%, -50%);
}
body.home .ap .album li a:hover .pic img {
    text-decoration:none;
    -moz-transform: scale(1.1) translate(-45%, -45%);
    -webkit-transform: scale(1.1) translate(-45%, -45%);
    -o-transform: scale(1.1) translate(-45%, -45%);
    -ms-transform: scale(1.1) translate(-45%, -45%);
    transform: scale(1.1) translate(-45%, -45%);
}
@media (max-width: 575px) {
body.home .ap .album .pic {
    height:inherit;
}
}
/*個人專區*/
.mytickets {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    font-size: 105%;
}
.mytickets.using {
    display: inherit;
}
.mytickets .reload {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    -webkit-align-items:center;
    align-items:center;
    font-size: 100%;
}
.mytickets .reload .img {}
.mytickets .reload .sec {
    color: #d30202;
    padding: 0 2px;
}
.mytickets .reload img {
    width: 35px !important;
    padding: 7px;
    margin: inherit !important;
    max-width: initial !important;
}
.mytickets .box {
    margin: auto;
}
.mytickets.slick-slider {
    max-width: 900px;
    margin: auto;
}
.mytickets.slick-slider .slick-next::before {
    display: block;
    width: 50px;
    height: 50px;
    border-top: solid 3px #697b91;
    border-right: solid 3px #697b91;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.mytickets.slick-slider .slick-arrow::before {
    content: "";
}
.mytickets.slick-slider .slick-arrow {
    width: 50px;
    height: 50px;
    z-index: 9;
}
.mytickets.slick-slider .slick-prev::before {
    display: block;
    width: 50px;
    height: 50px;
    border-top: solid 3px #697b91;
    border-right: solid 3px #697b91;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
.mytickets .box {
    box-shadow: 0 0 8px #ccc;
    border-radius: 15px;
    overflow: hidden;
    max-width: 420px;
    margin: 15px;
    background-color: #FFF;
}
.mytickets .box02 {
    box-shadow: 0 0 8px #ccc;
    border-radius: 15px;
    overflow: hidden;
    max-width: 420px;
    margin: 15px;
}
.mytickets .box.slick-slide {
    max-width: none;
}
.mytickets .box .pic {
    padding: 5%;
    position: relative;
    text-align: center;
}
.mytickets .box .pic .cardmark {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0,0,0,0.6);
    border-radius: 100px;
    padding: 10px 15px;
    border: 2px #fff solid;
    color: #fff;
    font-size: 100%;
}
.mytickets .box .pic .qrmark {
    display:inline-block;
    padding:5px 20px;
    background-color: #757575;
    border-radius: 50px;
    margin-top: 10px;
    color:#FFF;
}
.mytickets .box .pic .qrmark.last {
    background-color: #C94C4A;
}
.mytickets .box .pic img {
    max-width: 100%;
    border-radius: 15px;
}
.mytickets .box .pic.qr img {
    max-width: 270px;
    width: 100%;
    margin: 5% auto;
}
.mytickets .box .ticketsname {
    background-color: #ececec;
    padding: 15px;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    color: #000;
}
.mytickets .box .info {
    padding: 10px 15px;
}
.mytickets .box .info ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.mytickets .box .info ul li {
    padding: 4px 0;
}
.mytickets .box .info ul li span {
    font-weight: bold;
    color: #000;
}
.mytickets .box .price_info {
    display: -webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    margin: 0 15px;
    border-bottom: 1px #a5a5a5 solid;
    padding: 0 5px 5px 5px;
}
.mytickets .box .price_info p {
    margin: 0;
    font-weight: bold;
}
.mytickets .box .price_info p span {
    color: #d10000;
}
.mytickets .box .state {padding: 15px;}
.mytickets .box .state ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: -webkit-flex;
    display:flex;
    border-radius: 15px;
    background-color: #f2f2f2;
    padding: 15px 10px;
}
.mytickets .box .state ul li {
    width: 100%;
    text-align: center;
    border-right: 1px #d1d1d1 solid;
}
.mytickets .box .state ul li p {
    margin: 0;
}
.mytickets .box .state ul li:last-child {
    border: none;
}
.mytickets .box .bt {
    padding: 0 10px 15px 10px;
}
.mytickets .box .bt ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: -webkit-flex;
    display: flex;
}
.mytickets .box .bt ul li {
    width: 100%;
    text-align: center;
    padding: 0 5px;
}
.mytickets .box .bt ul li a {
    display: block;
    color: #fff;
    padding: 10px 0;
}
.mytickets .box .bt ul li.qr.no {
    background-color: #136EB9;
    display: block;
    color: #fff;
    padding: 10px 0;
}
.mytickets .box .bt ul li.qr a {
    background-color: #136EB9;
    text-decoration:none;
}
.mytickets .box .bt ul li.order a {
     background-color: #009688;
}
.mytickets .box .bt ul li a:hover {
    background-color:#024d8b;
}
.mytickets .car_info {
    padding: 10px 15px;
}
.mytickets .car_info .sub {
    border-bottom: 1px #d9d9d9 solid;    
    padding: 10px 5px;
}
.mytickets .car_info .sub .wbt {
    padding: 5px 0 0 0;
}
.mytickets .car_info .sub .wbt a {
    border-radius: 100px;
    border: 1px #555 solid;
    color: #000;
    padding: 3px 10px;
    font-size: 90%;
    text-decoration: none;
}
.mytickets .car_info .sub .wbt a:hover {
    background-color:#ddd;
}
.mytickets .car_info .sub .w02 {
    color: #995C00;
}
.mytickets .car_info .sub .w01 {
    word-break: break-all;
    font-size: 95%;
}
.mytickets .car_info .sub:last-child {
    border: none;
}
.mytickets .car_info .sub .car {
    display: -webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    font-weight: bold;
    color: #000;
}
.mytickets .car_info .sub .car img {
    max-width: 35px;
    margin: 0 10px 0 0;
}
.modal .confirm img {
    max-width: 70px;
}
.mytickets .event {
    padding:4px 15px 20px 15px;
    border-top:1px solid #999;
    background-color:#f5f5f5;
}
.mytickets .event .e-title {
    font-weight:bold;
    padding:5px 0;
    color: #00707f;
}
.mytickets .event .quantity {
    font-size:90%;
    color: #AE5656;
    margin-bottom:5px;
}
.mytickets .event .form-group label {
    display:none;
}
.mytickets .event .btn-info {
    background-color:#136EB9;
    border:#136EB9;
    padding: 10px 0;
}
.mytickets .event .btn-secondary.disabled,
.mytickets .event .btn-secondary:disabled {
    padding: 10px 0;
}
.modal .confirm {
    text-align: center;
    padding: 15px 0;
    color: #000;
}
.modal .confirm .con_title {
    font-size: 140%;
    font-weight: bold;
    margin: 0;
    padding: 10px;
    text-align: center;
}
.modal .confirm .con_title.t01 {
    background-color:#ffe28c;
    margin-bottom:15px;
    margin-top:-16px;
    margin-right:-16px;
    margin-left:-16px;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
}
.modal .confirm p {
    font-size: 110%;
    margin: 0;
}
.modal .copy {
    /* display:flex; */
    align-items:center;
}
.modal .copy p {
    font-size: 105%;
    margin: 0;
}
.modal .copy .copybt {
    text-align:center;
    margin-top:10px;
}
.modal .copy .copybt img {
    padding-right:8px;
}
.modal .copy .copybt a {
    display:flex !important;
    background-color:#e23c3d;
    padding:10px;
    border-radius:8px;
    align-items:center;
    justify-content:center;
    color:#FFF;
    text-decoration:none;
}
.modal .copy .copybt a:hover {
    box-shadow:0 0 8px rgb(0 0 0 / 40%);
}
.modal .share {
    display:flex;
    justify-content:center;
}
.modal .share img {
    width:45px;
}
.modal .share a {
    padding:6px;
    display:block;
}
.modal .share a img:hover {
    box-shadow:0 0 8px rgb(0 0 0 / 40%);
    border-radius:5px;
}
.modal-footer .b01 {
    background-color: #006BC2;
}
.modal-footer .b02 {
    background-color: #9c27b0;
}
.modal-footer .btn {
    color: #fff;
}
@media screen and (min-width: 900px) {
.mytickets.slick-slider .slick-prev {
    left: -50px;
}
.mytickets.slick-slider .slick-next {
    right: -50px;
}
}
@media screen and (max-width: 900px) {
.mytickets.slick-slider .slick-prev {
    left: 0px;
}
.mytickets.slick-slider .slick-next {
    right:0px;
}
}
@media screen and (min-width: 400px) {
.mytickets .car_info .sub .car {
    white-space: nowrap;
    font-size: 95%;
}
.mytickets .car_info .sub {
    display: -webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    -webkit-align-items:center;
    align-items:center;;
}
.mytickets .car_info .sub .wbt {
    text-align: right;
}
}
/*搭乘紀錄*/
.record .box {
    box-shadow: 0 0 8px #ccc;
    border-radius: 15px;
    overflow: hidden;
    background-color: #FFF;
}
.record .box .re_title {
    background-color: #6b6a70;
    padding: 15px 10px;
    color: #fff;
    font-size: 120%;
    text-align: center;
    font-weight: bold;
}
.record .box .list {
    padding: 10px;
}
.record .box .list .item {
    margin: 0;
    padding: 10px;
}
.record .box .list .item:nth-child(4n+3) {
    background-color: #efefef;
    border-top: 1px #cbcbcb solid;
}
.record .box .list .item:nth-child(4n+4) {
    background-color: #efefef;
    border-top: 1px #cbcbcb solid;
}
.record .box .list .item ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.record .box .list .item ul li {
    padding: 5px 0;
    display: -webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
}
.record .box .list .item ul li span {
    font-weight: bold;
    margin: 0 10px 0 0;
}
.record .box .list .item ul li span::after {
    content:" : ";
}
@media screen and (max-width: 767px) {
.record .box .list .item{
    border-top: 1px #cbcbcb solid;
}
.record .box .list .item:first-child {
    border: none;
}
}
/*訂單列表*/
.orderlist .tab-pane {
    padding: 20px 10px;
}
.order .box {
    box-shadow: 0 0 8px #ccc;
    border-radius: 15px;
    overflow: hidden;
    margin: 10px 0 30px 0;
    background-color: #FFF;
}
.order .box .info {
    display: -webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    -webkit-align-items:center;
    align-items:center;
    padding: 15px 20px;
    border-bottom: 1px #cfcfcf solid;
}
.order .box .info .ticket {
    display: -webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-align-items:center;
    align-items:center;
}
.order .box .info .ticket .detail ul {
    margin: 0;
    list-style-type: none;
}
.order .box .info .ticket .detail ul li {
    padding: 3px 0;
}
.order .box .info .ticket .detail .t_title {
    font-size: 115%;
    font-weight: bold;
}
.order .box .info .ticket .detail .price {
    font-weight: bold;
    font-size: 105%;
}
.order .box .info .ticket .detail .price span {
    color: #eb0000;
}
.order .box .info .ticket .pic img {
    max-width: 100%;
}
.orderlist .box .info p {
    margin: 0;
}
.orderlist .box .info p span {
    font-weight: bold;
    color: #000;
}
.orderlist .box .info .state {
    padding: 10px 0;
    font-size: 90%;
}
.orderlist .box .info .state ul{
    margin: 0;
    padding: 0;
    display: -webkit-flex;
    display:flex;
    list-style-type: none;
    text-align: center;
    background-color: #f0f0f0;
    border-radius: 10px;
    padding: 8px;
    justify-content: space-between;
}
.orderlist .box .info .state ul li{
    border-right: 1px #c5c5c5 solid;
    padding: 0 15px;
    flex:auto;
}
.orderlist .box .info .state ul li:last-child {
    border: none;
}

.order .box .add {
    background-color: #fff1e8;
    border-bottom: 1px #d8d8d8 solid;
    padding: 20px;
}
.order .box .add .item {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
}
.orderlist .box .add .more {
    text-align: center;
    margin-top:5px;
}
.orderlist .box .add .more p {
    display:none;
}
.orderlist .box .add .more a {
    border-radius: 100px;
    border: 1px #a4a4a4 solid;
    background-color: #fff;
    color: #000;
    padding: 3px 15px 3px 15px;
    text-decoration: none;
    font-size: 95%;
}
.orderlist .box .add .more a:hover {
    background-color: #555;
    color: #fff;
}
.order .box .add .item p {
    margin: 0;
    text-align: right;
    padding: 5px 0;
    white-space: nowrap;
    width: 25%;
}
.order .box .add .item p span {font-weight: bold;}
.order .box .add .item .project {
    display: -webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    /* font-weight: bold; */
    width: 75%;
}
.order .box .add .item .project p {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display:block;
    width:100% !important;
    text-align:left;
}
.order .box .add .item .project .ic_add {
    border: 1px #B45F04 solid;
    border-radius: 3px;
    padding: 0px 5px;
    color: #B45F04;
    margin: 0 7px 0 0;
    font-weight: normal;
    font-size: 95%;
    white-space: nowrap;
    font-weight: bold;
}
.order .box .add .card.card-body {
    border:none;
    padding: 0;
    background-color:transparent;
}
.order .box .add .more .btn:before {
    content: "隠す…";
}
.order .box .add .more .btn.collapsed:before {
    content: "さらに表示…";
}
.orderlist .box .bt {
    text-align: right;
}
.orderlist .box .bt ul {
    padding: 15px;
    margin: 0;
    list-style-type: none;
}
.orderlist .box .bt ul li {
    display: inline-block;
    padding: 5px;
}
.orderlist .box .bt ul li a {
    display: block;
    padding: 8px 15px;
    color: #fff;
    text-decoration: none;
}
.orderlist .box .bt ul li.bt01 a {
    background-color: #257916;
}
.orderlist .box .bt ul li.bt01 a:hover {
    background-color: #166108;
}
.orderlist .box .bt ul li.bt02 a {
    background-color: #197385;
}
.orderlist .box .bt ul li.bt02 a:hover {
    background-color: #025262;
}
.orderlist .box .bt ul li.bt03 a {
    background-color: #b82e5e;
}
.orderlist .box .bt ul li.bt03 a:hover {
    background-color: #960739;
}
.orderlist .box .bt ul li.bt04 a {
    background-color: #3F51B5;
}
.orderlist .box .bt ul li.bt04 a:hover {
    background-color: #960739;
}
.orderlist .box .bt ul li.bt05 a {
    background-color: #0076D6;
}
.orderlist .box .bt ul li.bt05 a:hover {
    background-color: #0162b2;
}
.order .order_info {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    padding: 0 15px;
}
.order .box .in_title {
    padding: 15px 25px;
    margin: 0;
    border-bottom: 1px #dbdbdb solid;
    font-weight: bold;
    font-size: 120%;
}
.order .box .info .price p {
    margin: 0;
    font-weight: bold;
    text-align: right;
}
.order .box .info .price .quantity {
    font-weight: normal;
}
.order .box .info .more a {
    border-radius: 100px;
    border: 1px #a4a4a4 solid;
    background-color: #fff;
    color: #000;
    padding: 3px 15px;
    text-decoration: none;
    display: inline-block;
}
.order .box .info .more a:hover {
    background-color: #555;
    color: #fff;
}
.order .box .info .pay .item {
    display: -webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    -webkit-align-items:center;
    align-items:center;
    padding: 5px 10px;
}
.order .box .info .pay .item .stitle {
    font-weight: bold;
    margin: 0 20px 0 0;
}
.order .box .info .pay .item .money {
    color: #db0000;
    font-weight: bold;
    font-size: 120%;
}
.order .box .info .pay .item:first-child {
    border-bottom: 1px #d7d7d7 solid;
}
.order .box .buyer {
    padding: 20px 25px;
}
.order .box .buyer p span {
    font-weight: bold;
    font-size: 110%;
    margin: 0 5px 0 0;
}
.order .box .buyer p span::after {
    content:"：";
}
.order .box .buyer p {
    margin: 0;
}
.order .box .total {
    display: block;
    padding: 15px 20px 0 20px;
    text-align: right;
}
.order .box .total p {
    display: inline-block;
    font-size:150%;
    margin: 0 0 0 10px;
    font-weight: bold;
    color: #eb0000;
}
.order_check {
    margin-bottom:10px;
}
.order_check .check {
    border-bottom: 1px #eee solid;
    padding:10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.order_check .check label {
    display: none;
}
.order_check .check span {
    color: #666;
    padding:0px 6px;
    border: 1px solid #999;
    margin-right:5px;
    border-radius: 50px;
    font-size:90%;
}
.order_check .check .form-group {
    margin:0;
}
.order_check .check .form-group .form-control {
    width:60px;
}
.order_check .add {
    /* margin-top:5px; */
}
.order_check .add.tt {
    font-weight: bold;
    font-size:105%;
}
.order_check .custom-control {
    margin:10px 4px;
    padding: 0px 0 10px 24px;
    font-size:105%;
    border-bottom:1px solid #eee;
}
.order_check .custom-control-label p {
    margin:0;
    /* display:inline-block; */
}
.order_check .custom-control-label p.sn {
    font-weight: bold;
    margin:0 0 5px 0;
}
.order_check .custom-control-label span {
    color: #888;
    padding:0px 6px;
    border: 1px solid #999;
    margin-right:5px;
    border-radius: 50px;
    font-size:90%;
}
.modal-body .total {
    display:flex;
    padding:5px 0;
    margin-top:5px;
    font-weight: bold;
    align-items: baseline;
}
.modal-body .total p {
    margin:0;
    padding-left:10px;
    font-size:150%;
    color:#d80000;
}
.modal-body .fee {
    display:flex;
    padding:5px 0;
    margin-top:5px;
    font-weight: bold;
    align-items: baseline;
}
.modal-body .fee p {
    margin:0;
    padding-left:10px;
}
.modal-body .warn {
    padding-left:32px;
    color:#666;
}
.form-group.agree {
    padding-left:10px;
    color:#386f9a;
}
@media screen and (min-width: 767px) {
.order .box .info .ticket .pic{width: 150px;}
.order .box .info .ticket .detail ul {
    padding: 0 0 0 15px;
}
}
@media screen and (max-width: 767px) {
.order .box .info .ticket .detail ul {
    padding:0;
}
.order .box .info .price p{
    display: inline-block;
}

.order .box .add .item p br {
    display: none;
}
.order .box .info {
    padding:15px;
}
.orderlist .box .info .state {
    width:100%;
}
.orderlist .box .info .state ul li{
    padding: 0 5px;
}
.order .box .add .item .project,
.order .box .add .item p {
    width: 100%;
    text-align: left;
}
}
@media screen and (max-width: 767px) {
.orderlist .box .bt ul {
    display:flex;
    flex-wrap:wrap;
}
.orderlist .box .bt li {
    padding: 3px !important;
    flex:auto;
}
.orderlist .box .bt ul li a {
    padding: 8px 10px;
    width: 100%;
    text-align: center;
}
}
/*政府網站資料開放宣告*/
.ap .rule {
    padding: 25px;
    line-height:160%;
    border-radius:10px;
    display:block;
    box-shadow: 0 0 12px hsla(0, 0%, 0%, 0.38);
    background-color: #FFF;
    margin-bottom: 30px;
}
.ap .rule .mtt p,
.ap .rule .stt p {
    margin:0;
}
.ap .rule .mtt {
    font-size:120%;
    font-weight:600;
    margin: 10px 0 5px 0;
    color: #00795a;
    display:flex;
}
.ap .rule .stt {
    font-size: 105%;
    font-weight:600;
    margin-bottom:10px;
    display: flex;
}
.ap .rule p {
    margin-bottom:10px;
}
.ap .rule ul {
    padding: 0 0 0 30px;
}
.ap .rule li {
    padding:2px;
    list-style-type: decimal;
}
.ap .rule li span {
    font-weight:bold;
}
.ap .rule ul.item01 {
    padding: 0 0 0 40px;
}
.ap .rule ul.item01 li {
    padding:2px;
    list-style-type: none;
    text-indent: -31px;
}
.ap .rule ul.item02 li {
    padding:2px;
    list-style-type: disc;
}
.ap .rule p.title {
    font-size:110%;
    font-weight:600;
    color:#a00000;
}
/*常見問答*/
.ap .qabtn {
    position:relative;
}
.ap .qabtn ul {
    list-style-type:none;
    padding:0;
    text-align:center;
}
.ap .qabtn li {
    display:inline-block;
    padding:5px;
}
.ap .qabtn li a {
    padding: 9px 20px;
    display:block;
    background-color: #427AA9;
    color: #fff;
    text-decoration:none;
    border-radius:50px;
    font-size:105%;
}
.ap .qabtn li a:hover {
    background-color:#2b5578;
    color:#FFF;
}
.ap .qabtn li i {
    display:inline-block;
    padding-right:5px;
}
@media screen and (max-width: 480px) {
.ap .qabtn li {
    width:48%;
}
}
@media screen and (max-width: 380px) {
.ap .qabtn li {
    width:100%;
}
}
/*常見問答列表*/
.ap .qalist {
    padding: 0 0 30px 0;
}
.ap .qalist .accordion>.card {
    border: none;
    margin-bottom: 10px;
    border-radius: 15px;
    width: 100%;
}
.ap .qalist .accordion>.card>.card-header {
    padding: 0;
}
.ap .qalist .card-body {
    background-color: #ffffff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border: 2px #f4e4ce solid;
    border-top: none;
}
.ap .qalist .card-body .textlist {
    position:relative;
}
.ap .qalist .card-body .textlist ul {
    padding:0;
    list-style-type:none;
}
.ap .qalist .card-body .textlist li {
    list-style-type:decimal;
    padding:5px 0;
}
.ap .qalist .card-body .textlist li .subtt {
    font-size:110%;
    font-weight:600;
    color:#2c7c87;
    padding:4px 4px 4px 22px;
    margin-bottom:10px;
    position:relative;
    display:inline-block;
}
.ap .qalist .card-body .textlist li .subtt::after {
    position: absolute;
    top: 50%;
    left:0;
    transform: translateY(-50%);
    content: '';
    width: 12px;
    height: 4px;
    background-color: #2c7c87;
}
.ap .qalist button.collapsed {
    border-radius: 15px;
}
.ap .qalist button {
    padding: 13px 40px 13px 15px;
    display: block;
    width: 100% !important;
    text-align: left;
    /* color: #000; */
    font-size: 105%;
    background-color: #f4e4ce;
    text-decoration: none;
    border-radius: 0;
    position: relative;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border:none;
}
.ap .qalist button::after {
    content:"";
    width:25px;
    height:25px;
    position: absolute;
    right: 0;
    top: 50%;
    background-image: url(../images/svg/ic_close.svg);
    background-repeat: no-repeat;
    background-size: 25px;
    transform: translate(-50%, -50%);
}
.ap .qalist button.collapsed::after {
    content:"";
    width:25px;
    height:25px;
    background-image: url(../images/svg/ic_open.svg);
    background-repeat: no-repeat;
    background-size: 25px;
}
.ap .qalist button .info {
    display: block;
}
.ap .qalist button .info span {
    font-size: 90%;
    display:inline-block;
    padding:0 5px;
    color: #444;
}
.ap .qalist button .mtt {
    font-size:105%;
    display: block;
    padding:5px;
    font-weight: 600;
    color: #000;
}
/*商家優惠列表*/
.ap .list_shop {
    margin: 30px 0;
    width: 100%;
}
.ap .list_shop ul {
    padding: 0;
    margin: 0;
    list-style-type:none;
}
.ap .list_shop li {
    padding: 10px !important;
    position:relative;
}
.ap .list_shop li .box {
    display: block;
    border-radius: 0;
    padding: 12px !important;
    background-color: #fff;
    -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    position:relative;
}
.ap .list_shop .pic {
    background-color: #f3f3f3;
    vertical-align: middle;
    position:relative;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    overflow: hidden;
    width: 100%;
    padding-top: 75%;
}
.ap .list_shop a {
    display:block;
}
.ap .list_shop a:focus {
    outline-offset:initial;
}
.ap .list_shop .pic img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.ap .list_shop .info .sort {
    display:inline-block;
    padding:2px 10px;
    background-color: #C94C4A;
    border-radius:5px;
    color:#FFF;
    position:absolute;
    top:-45px;
    right:10px;
    font-size: 95%;
}
.ap .list_shop .info .subject {
    color: #b74e00;
    text-align: center;
    font-size: 115% !important;
    line-height: 26px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: bold;
}
.ap .list_shop .info .stt {
    color: #333333;
    text-align: center;
    font-size: 96% !important;
    -webkit-line-clamp: 2;
    height: 50px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    white-space: inherit;
    margin: 0px 0 5px 0;
}
.ap .list_shop .info {
    position:relative;
    color: #555;
    margin: 10px 0;
    letter-spacing:0;
}
.ap .list_shop .info span {
    display:block;
    font-size:90%;
    padding:2px 0;
}
.ap .list_shop .info .w01,
.ap .list_shop .info .w02,
.ap .list_shop .info .tel {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding:4px 0 4px 25px;
    background-repeat: no-repeat;
    background-position: 0 center;
}
.ap .list_shop .info .w01 {
    border-top:1px solid #e4e4e4;
    margin-top:5px;
    background-image: url(../images/home/icon_date.png);
}
.ap .list_shop .info .w02 {
    background-image: url(../images/home/icon_map.png);
}
.ap .list_shop .info .tel {
    border-top:1px solid #e4e4e4;
    margin-top:5px;
    background-image: url(../images/home/icon_tel.png);
}
.ap .list_shop .box .btn {
    display:block;
    position:relative;
    padding: 0;
}
.ap .list_shop .box .btn a {
    padding:8px 10px;
    display: block;
    color: #42727B;
    text-decoration:none;
    border-radius: 50px;
    background-color: #FFF;
    border: 1px solid #42727B;
}
.ap .list_shop .box .btn a:hover {
    background-color:#487f87;
    color:#FFF;
}
.ap .list_shop .box .btn a:focus {
    outline-offset: -3px;
}
@media screen and (max-width: 575px) {
.ap .list_shop .info .stt {
    height: inherit;
    -webkit-line-clamp: initial;
    color: #333333;
    text-align: center;
    font-size: 96% !important;
}
}
@media screen and (max-width: 480px) {
.ap .list_shop .info .stt {
    white-space: initial;
}
}
/*商家優惠內頁*/
.ap .shoppic img {
    width:100%;
}
.ap .shopbox {
    position:relative;
}
.ap .shopbox p {
    margin:0;
}
.ap .shopbox .ttbox {
    display: flex;
    padding:8px 0;
    margin:15px 0;
    border-bottom:1px solid #000;
    font-weight: bold;
    justify-content: space-between;
    align-items: center;
}
.ap .shopbox .ttbox .title {
    font-size:140%;
    width:90%;
}
.ap .shopbox .ttbox .keep {
    font-size:95%;
    width:10%;
    text-align: right;
    display: flex;
    justify-content: flex-end;
}
.ap .shopbox .ttbox .keep a {
    display: inline-flex;
    color:#333;
}
.ap .shopbox .ttbox .keep a p {
    padding-right: 5px;
}
.ap .shopbox .ttbox .keep:hover .color {
    fill:#FF424F;
}
.ap .shopbox .info {
    position:relative;
    background-color:#efefef;
    padding:20px 20px;
    margin-bottom:30px;
}
.ap .shopbox .info ul {
    margin:0;
    padding:0;
}
.ap .shopbox .info li {
    width:100%;
    display:flex;
    padding:4px 0;
    flex-wrap: wrap;
}
.ap .shopbox .info li .box_l {
    font-weight: bold;
    width:10%;
    text-align: right;
    font-size:105%;
}
.ap .shopbox .info li .box_r {
    width:90%;
}
.ap .shopbox .detailbox {
    position:relative;
    padding: 0 20px;
}
.ap .shopbox .detailbox .stt {
    background-color:#241917;
    display:inline-block;
    padding: 6px 20px;
    border-radius: 50px;
    color: #FFF;
    margin-bottom: 10px;
    font-size:105%;
}
.ap .shopbox .detailbox .txt {
    display:block;
    margin-bottom:20px;
    line-height: 180%;
    padding: 0 18px;
}
.ap .shopbox .detailbox .txt .shoplist {
    position:relative;
}
.ap .shopbox .detailbox .txt .shoplist ul {
    position:relative;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.ap .shopbox .detailbox .txt .shoplist li {
    display:flex;
    justify-content: space-between;
    padding: 5px;
    border-bottom: 1px dotted #ccc;
}
.ap .shopbox .detailbox .txt .shoplist li p {
    padding:5px 10px;
    align-items: center;
    display:inline-flex;
}
.ap .shopbox .detailbox .txt .shoplist li.title {
    background-color: #607d8b;
    font-weight: bold;
    color: #FFF;
}
.ap .shopbox .detailbox .txt .shoplist li .name {
    width:30%;
    border-right:1px solid #CCC;
}
.ap .shopbox .detailbox .txt .shoplist li .add {
    width:50%;
    border-right:1px solid #CCC;
}
.ap .shopbox .detailbox .txt .shoplist li .pcs {
    width:20%;
}
.ap .shopbox .detailbox img {
    width:100%;
}
.ap .shopbox .detailbox .txt img.map {
    margin-top:-15px;
    width: 20px;
}
.ap .shopbox .detailbox .txt img:hover {
    opacity:.7;
}
.ap .shopbox .detailbox .txt .w01 {
    font-weight: bold;
}
body.home .ap .detail.shop {
    padding:0 20px;
}
body.home .ap .detail.shop .stt {
    background-color:#241917;
    display:inline-block;
    padding: 6px 20px;
    border-radius: 50px;
    color: #FFF;
    margin-bottom: 10px;
    font-size:105%;
    font-weight: initial;
}
body.home .ap .detail.shop .stt::after {
    display:none;
}
@media screen and (max-width: 1199px) {
.ap .shopbox .detailbox,
body.home .ap .detail.shop {
    padding: 0 10px;
}
}
@media screen and (max-width: 991px) {
.ap .shopbox .info li .box_l {
    width:15%;
}
.ap .shopbox .info li .box_r {
    width:85%;
}
}
@media screen and (max-width: 767px) {
.ap .shopbox .info li .box_l,
.ap .shopbox .info li .box_r {
    width:100%;
    text-align: left;
}
.ap .shopbox .ttbox .title {
    width:80%;
}
.ap .shopbox .ttbox .keep {
    width:20%;
}
}
@media screen and (max-width: 575px) {
.ap .shopbox .detailbox .txt .shoplist li p.pcs:before {
  content: attr(data-th) " : ";
  margin-right: 5px;
  display: inline-block;
}  
.ap .shopbox .detailbox .txt .shoplist li.title {
    display:none;
}
.ap .shopbox .detailbox .txt .shoplist li {
    padding: 10px 15px;
    margin:5px 0;
    -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    flex-wrap: wrap;
    border: none;
}
.ap .shopbox .detailbox .txt .shoplist li p  {
    padding: 0;
    display:inline-block;
}
.ap .shopbox .detailbox .txt .shoplist li .name {
    width:100%;
    font-size:105%;
    border-right:none;
    font-weight: bold;
}
.ap .shopbox .detailbox .txt .shoplist li .add {
    width:100%;
    border-right:none;
}
.ap .shopbox .detailbox .txt .shoplist li .pcs {
    width:100%;
}
}
/*目錄清單*/
.treelist {
    position:relative;
    display:block;
    background-color: #FFF;
    margin-bottom: 30px;
}
.treelist ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    transition: all .3s ease-out;
}
.treelist ul ul {
    padding: 0 15px;
    margin: 0;
}
.treelist li a {
    padding: 10px 10px 10px 25px;
    color: #000;
    position: relative;
    text-decoration: none;
    display:block;
    border-bottom:1px solid #eaeaea;
}
.treelist li.title a {
    background-color: #e2e2e2;
    color: #000;
    font-weight: bold;
    margin: 5px 0;
    font-size:110%;
}
.treelist li.title a:hover {
    background-color: #f8bf71;
    color: #000;
}
.treelist li.title a::before {
    content:"";
    position:absolute;
    width: 15px;
    height: 4px;
    background-color:#00a5ac;
    left:0;
    top: 45% !important;
    border: none;
}
.treelist li a::before {
    width: 0;
    height: 0;
    border-top: solid 5px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 5px transparent;
    border-left: solid 6px #292929;
    background-color: transparent;
    top: 35%;
    bottom: inherit;
    left: 10px;
    content: "";
    position: absolute;
}
.treelist li li a::before {
    border-top: solid 1px #2f2f2f;
    border-right: solid 1px #2f2f2f;
    -webkit-transform: rotate(45deg);
    border-left: solid 0px transparent;
    border-bottom: solid 0px transparent;
    transform: rotate(45deg);
    width: 7px;
    height: 7px;
    top: 41%;
    margin-right: 5px;
}
.treelist ul li a::after {
    content: "";
    position: absolute;
    display: block;
    height: 2px;
    left: 0;
    width: 0;
    bottom:0;
    background-color: #607d8b;
    transition: all 200ms ease-out;
}
.treelist ul li a:hover::after {
    width: 100%;
}
/*網站導覽*/
.sitemap {
    margin-bottom: 30px !important;
}
.sitemap .sitemap_note {
    padding: 15px;
    line-height: 180%;
    letter-spacing: 1px;
}
.sitemap .sitemap_note .text-danger {
    color: #c94c4a !important;
}
.sitemap ul {
    padding: 0 5px;
    margin: 0;
    list-style-type: none;
    transition: all .3s ease-out;
}
.sitemap ul ul {
    padding: 0 15px;
    margin: 0;
}
.sitemap ul li a {
    padding: 5px 15px 5px 25px;
    color: #000;
    position: relative;
    font-size: 105%;
    text-decoration: none;
    display: block;
}
.sitemap ul li a:hover {
    background-color: #cbe7f2;
    border-radius: 50px;
}
.sitemap ul ul li a {
    font-size: 100%;
    padding: 5px 0 5px 25px;
    color: #383838;
}
.sitemap ul ul ul li a {
    font-size: 95%;
    padding: 5px 0 5px 28px;
    color: #555;
}
.sitemap ul li a::before {
    width: 0;
    height: 0;
    border-top: solid 5px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 5px transparent;
    border-left: solid 6px #292929;
    background-color: transparent;
    top: 35%;
    bottom: inherit;
    left: 10px;
    content: "";
    position: absolute;
}
.sitemap ul ul li a::before {
    border-top: solid 1px #2f2f2f;
    border-right: solid 1px #2f2f2f;
    -webkit-transform: rotate(45deg);
    border-left: solid 0px transparent;
    border-bottom: solid 0px transparent;
    transform: rotate(45deg);
    width: 7px;
    height: 7px;
    top: 41%;
    margin-right: 5px;
}
.sitemap ul ul ul li a::before {
    content: "_";
    border: none;
    left: 13px;
    transform: none;
    transform: none;
    top: inherit;
    margin-right: 0;
}
.sitemap ul li.title a {
    background-color: #C94C4A;
    padding: 8px 15px;
    color: #FFF;
    text-align: center;
    font-weight: 400;
    font-size: 110%;
    margin: 5px 0;
    border-radius: 5px;
}
.sitemap ul li.title a:hover {
    background-color: #fcd100;
    color: #000;
}
.sitemap ul li.title a::before {
    display: none;
}
@media screen and (max-width: 575px) {
.sitemap ul {
    padding: 0 5px !important;
}
}
/*套票模組*/
.ap .tickets_list .nav-tabs {
    flex-wrap: nowrap;
}
.ap .tickets_list .nav-tabs li {
    width: 100%;
}
.tickets_list .tab-content .note {
    margin: 5px 0;
}
.tickets_list .tab-content {
    padding: 10px;
}
/*套票購買*/
.tickets_list .note {
    padding:15px 0;
}
.tklist {
    position:relative;
    margin-bottom: 30px;
}
.tklist ul {
    position:relative;
    padding:0;
    margin:0;
    list-style-type: none;
}
.tklist li {
    padding: 15px 15px 40px 15px;
    position: relative;
}
.tklist .box {
    border-radius: 10px;
    box-shadow: 0 0 8px #ccc;
    /* overflow: hidden; */
    padding-bottom: 35px;
    position:relative;
    background-color: #FFF;
    height: 100%;
}
.tklist .pic {
    overflow:hidden;
    border-radius: 10px;
    position:relative;
}
.tklist .pic .seat {
    position:absolute;
    z-index:9;
    padding:5px 10px;
    background-color:#c94c4a;
    bottom:0;
    right:0;
    border-top-left-radius:10px;
    font-size:85%;
    color:#FFF;
}
.tklist .pic img {
    width:100%;
}
.tklist .tt {
    font-size: 120%;
    text-align: center;
    font-weight: bold;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 0 15px;
    margin-top:15px;
}
.tklist .info {
    display: flex;
    width:100%;
    justify-content: space-between;
    padding: 15px 10px;
    height: 95px;
}
.tklist .info .icon {
    flex-wrap: wrap;
    display: inline-flex;
    width: 55%;
}
.tklist .info .icon ul {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
}
.tklist .info .icon li {
    text-align: center;
    padding:2px;
}
.tklist .info .icon li.itme03 {
    display:none;
}
.tklist .info .icon li p {
    font-size:85%;
    color:#666;
    margin: 0;
}
.tklist .info .icon li.itme01 span {
    background-color:#5cc2cf;
    display:block;
    padding: 4px 8px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
}
.tklist .info .icon li.itme01 span img {
    display:inline-block;
    padding:2px;
}
.tklist .info .icon li.itme02 span,
.tklist .info .icon li.itme03 span {
    position:relative;
    display:block;
    border-radius: 50px;
    width: 30px;
    height:30px;
    border:1px solid #5cc2cf;
}
.tklist .info .icon li.itme02 span img,
.tklist .info .icon li.itme03 span img {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.tklist .info .price {
    width: 45%;
    text-align: end;
    margin-top: 4%;
    position: relative;
}
.tklist .info .price.free {
    margin-top:6%;
}
.tklist .info .price p {
    display:inline-block;
    font-size: 130%;
    margin: 0;
}
.tklist .info .price .w01 {
    color:#777;
    text-align: end;
    display:block;
    text-decoration:line-through;
    /* display: none; */
}
.tklist .info .price .w02 {
    color: #E52724;
    font-weight: bold;
    text-align: end;
    display:block;
    bottom: 0;
    position: absolute;
    right: 0;
}
.tklist .date {
    color:#333;
    padding:2px 10px;
    display:flex;
}
.tklist .date img {
    margin-right:5px;
}
.tklist .pcs {
    color:#666;
    padding:2px 10px;
    font-size:95%;
    display:flex;
}
.tklist .pcs img {
    margin-right:5px;
}
.tklist .more {
    position:absolute;
    bottom: -45px;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    z-index: 1;
    display: flex;
    justify-content: center;
}
.tklist .more img {
    margin-left:5px;
}
.tklist .more a {
    display: inline-flex;
    position:relative;
    background-color: #C94C4A;
    color:#FFF;
    padding: 10px 12px;
    border-radius: 50px;
    align-items: center;
    margin: 2px;
}
.tklist .more a.non {
    background-color: #5e7a87;
}
.tklist .more a.disable {
    background-color: #969696;
    pointer-events: none;
}
.tklist .more a:hover {
    text-decoration: none;
    letter-spacing: 2px;
}
@media screen and (max-width: 480px) {
.tklist li {
    padding: 15px 0px 40px 0px;
    position: relative;
}
}
/*訂單明細*/
.tickets_data {
    margin-bottom:30px;
}
.tickets_data .left .card-body {
    background-color: #f4f4f4;
    border-radius: 0;
}
.tickets_data .left .card-body .txtbox {
    padding:15px;
}
.tickets_data .left .card-body .txtbox .stt {
    font-size:105%;
    font-weight: bold;
    position: relative;
    margin-bottom:10px;
    display:block;
}
.tickets_data .left .card-body .txtbox .stt p  {
    margin:0;
    display:inline-block;
    background-color: #ffde00;
    position:relative;
    padding: 4px 10px;
    height: 34px;
}
.tickets_data .left .card-body .txtbox .stt p::after {
    content:"";
    position:absolute;
    width: 0px;
    height: 0px;
    border-top: 34px solid transparent;
    border-bottom: 0px solid transparent;
    border-right: 0px solid transparent;
    border-left: 20px solid #ffde00;
    right: -20px;
    top:0;
}
.tickets_data .left .card-body .txtbox ul {
    /* list-style-type: decimal; */
    padding-left: 30px;
    line-height: 170%;
}

.tickets_data .left button {
    padding: 13px 55px 13px 15px;
    display: block;
    width: 100%;
    text-align: left;
    color: #000;
    font-size: 105%;
    background-color: #d9e5eb;
    text-decoration: none;
    border-radius: 0px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-top: 1px solid rgba(255, 255, 255);
    position: relative;
    border:none;
}
.tickets_data .left button::after {
    content:"";
    position: absolute;
    width: 40px;
    height: 40px;
    right: -10px;
    top: 50%;
    background-color:#FFF;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/home/arrow_close.png);
    border-radius: 100%;
    transform: translate(-50%, -50%);
}
.tickets_data .left .collapsed::after {
    background-image: url(../images/home/arrow_open.png);
}
.tickets_data .collapse.list01 .btn-link .info span {
    font-size:95%;
    display:inline-block;
    padding:0 5px;
    color: #666;
}
.tickets_data .left button .mtt {
    font-size:105%;
    display: inline-block;
    padding:5px;
    font-weight: 600;
}
.tickets_data .tickets_list .right {
    position:relative;
}
.tickets_data .box {
    position:relative;
    box-shadow: 0 0 10px #ccc;
    border-radius: 10px;
    margin-bottom:20px;
    overflow: hidden;
    background-color: #FFF;
}
.tickets_data p {
    margin:0;
}
.tickets_data img {
    width:100%;
}
.tickets_data .right img {
    /*border-radius:10px;*/
}
.tickets_data .right .box .cardimg {
    padding: 30px;
}
.tickets_data .box .stt {
    font-size:115%;
    display:block;
    text-align: center;
    font-weight: bold;
    padding: 15px;
    background-color: #eee;
}
.tickets_data .infobox {
    position:relative;
}
.tickets_data .infobox ul {
    list-style-type: none;
    padding:0;
    margin:0;
}
.tickets_data .infobox li {
    padding:15px;
    margin:0;
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid #eee;
}
.tickets_data .infobox .icon {
    display: inline-flex;
    align-items: center;
}
.tickets_data .infobox .icon img {
    width:40px;
}
.tickets_data .infobox .icon p {
    margin-left:10px;
    font-weight: bold;
    font-size: 110%;
}
.tickets_data .infobox .form-group {
    margin:0;
    padding:0;
}
.tickets_data .infobox .form-group label {
    display:none;
}
.tickets_data .infobox .subtotal {
    font-size: 130%;
    color:#d50000;
    font-weight: bold;
}
.tickets_data .addshop {
    position:relative;
}
.tickets_data .addshop ul {
    list-style-type: none;
    padding:0;
    margin:0;
}
.tickets_data .addshop li {
    padding: 10px 15px;
    margin:0;
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid #eee;
}
.tickets_data .addshop li .custom-control {
    padding: 5px;
    margin-left: 20px;
}
.tickets_data .addshop li .pic {
    margin-right:10px;
    width:15%;
    border-radius:5px;
    overflow: hidden;
}
.tickets_data .addshop li .tt {
    margin-right:10px;
    width:60%;
}
.tickets_data .addshop li .info {
    /*width:20%;*/
}
.tickets_data .addshop .form-group {
    margin:0;
    padding:0;
}
.tickets_data .addshop .form-group .form-control {
    width:80px;
}
.tickets_data .addshop .form-group label {
    display:none;
}
.tickets_data .total {
    display:flex;
    padding:15px;
    justify-content: space-between;
    font-weight: bold;
    font-size:110%;
    align-items: center;
    background-color: #FFF;
}
.tickets_data .total .cash {
    font-size:120%;
    color: #d50000;
}
.tickets_data .total.ok {
    justify-content: right;
}
.tickets_data .total.ok .tt {
    padding-right:50px;
}
.tickets_data .box .maintt {
    background-color:#eee;
    padding:15px;
    text-align: left;
    font-size: 115%;
    font-weight: bold;
}
.tickets_data .box .maintt span {
    font-size:80%;
    font-weight:normal;
    color:#d50000;
    padding-left:5px;
}
.tickets_data .btn {
    display:block;
    padding: 0;
}
.tickets_data .btn a {
    background-color:#a0008f;
    display:block;
    padding:10px;
    color:#FFF;
    border-radius: 50px;
}
.tickets_data .btn a:hover {
    text-decoration: none;
    background-color: #000;
}
.tickets_data .btn.disable {
    pointer-events: none;
    cursor: none;
}
.tickets_data .btn.disable  a {
    background-color:#969696;
    display:block;
    padding:10px;
    color:#FFF;
    border-radius: 50px;
}
.tickets_data .card.card-body {
    border:none;
    padding: 0;
}
.tickets_data .box .btn {
    padding: 10px;
}
.tickets_data .box .btn p {
    display:none;
}
.tickets_data .box .btn:before {
    content: "隠す…";
}
.tickets_data .box .btn.collapsed:before {
    content: "さらに表示…";
}
.tickets_data .shoplist {
    position:relative;
}
.tickets_data .shoplist ul {
    list-style-type: none;
    padding:0;
    margin:0;
}
.tickets_data .shoplist li {
    padding: 10px 15px;
    margin:0;
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid #eee;
}
.tickets_data .shoplist li.add {
    background-color:#fff1e8;
}
.tickets_data .shoplist li .pic {
    margin-right: 20px;
    width:15%;
}
.tickets_data .shoplist li .tt {
    margin-right:10px;
    width:60%;
}
.tickets_data .shoplist li .info {
    width:25%;
    text-align: right;
}
.tickets_data .shoplist li .pic.big {
    padding:20px 0;
}
.tickets_data .shoplist li .tt span {
    padding: 2px 6px;
    color: #B74401;
    border: 1px solid #B74401;
    border-radius: 4px;
    margin-right: 5px;
}
.tickets_data .custom-control {
    display: flex;
    align-items: center;
}
.tickets_data .custom-control img {
    width: 140px;
}
.tickets_data .custom-control-label::after,
.tickets_data .custom-control-label::before {
    top: 50%;
    left: -15px;
    transform: translate(-50%, -50%);
}
.tickets_data .orderok {
    position:relative;
    text-align:center;
    padding:40px 0;
}
.tickets_data .orderok .icon img {
    max-width:90px;
}
.tickets_data .orderok p.stt {
    font-size:150%;
    margin:15px;
    font-weight:bold;
}
.tickets_data .form-row img.pay01 {
    width: 40px;
    margin-right:10px;
}
@media screen and (max-width: 991px) {
.tickets_data .row .left {
    margin-bottom:20px;
}
.tickets_data .right .box .cardimg {
    padding: 15px;
}
/*.tickets_data .left .show {
    display: none;
}
.tickets_data .left .collapse:not(.show) {
    display: block;
}
.tickets_data .left .collapsing {
    transition: none;
}*/
}
@media screen and (max-width: 480px) {
.tickets_data .addshop li .pic {
    display:none;
}
}
@media screen and (min-width: 767px) {
.tickets_data .left button::after {
    content:"";
    position: absolute;
    width: 40px;
    height: 40px;
    right: -10px;
    top: 50%;
    background-color:#FFF;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/home/arrow_close.png);
    border-radius: 100%;
    transform: translate(-50%, -50%);
}
.tickets_data .left .collapsed::after {
    background-image: url(../images/home/arrow_open.png);
}
}
@media screen and (max-width: 767px) {
.tickets_data .left button::after {
  background-image: url(../images/home/arrow_open.png);
}
.tickets_data .left .collapsed:after {
  background-image: url(../images/home/arrow_close.png);
}
.tickets_data .left .show {
    display: none;
  }
.tickets_data .left .collapse:not(.show) {
    display: block;
  }
.tickets_data .left .collapsing {
    transition: none;
  }
}
/*優惠專區*/
.disbox {
    position:relative;
}
.disbox .note {
    margin-top:10px;
    padding:10px;
    display:block;
    background-color:#eee;
}
.disbox .note a {
    color:#0050a5;
}
.dislist {
    position:relative;
    padding: 10px 0;
}
.dislist img {
    width:100%;
}
.dislist p {
    margin:0 0 4px 0;
    width:100%;
}
.dislist ul {
    position:relative;
    list-style-type: none;
    padding: 0;
    display:flex;
    flex-wrap: wrap;
    align-items:stretch;
}
.dislist li {
    padding: 10px;
    display: flex;
}
.dislist li {
    display:flex;
    width: 100%;
    align-items: center;
    position:relative;
    padding: 10px;
}
.dislist li .box {
    display:flex;
    width: 100%;
    box-shadow: 0 0 10px #ccc;
    border-radius: 10px;
    overflow: hidden;
    align-items: center;
    position:relative;
    background-color: #FFF;
}
.dislist li .btns {
    width:100%;
    display:flex;
}
.dislist li .btns a {
    background-color: #007B94;
    margin:4px;
    padding:5px;
    width:100%;
    color:#FFF;
    text-align:center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dislist li .btns a:hover {
    text-decoration:none;
    background-color:#0c7d8f;
}
.dislist li a:focus {
    outline-offset: inherit;
}
.dislist li .no {
    position:absolute;
    z-index:1;
    background-color:rgb(0,0,0,30%);
    width:100%;
    height:100%;
}
.dislist li .no p {
    position:absolute;
    color:#000;
    font-size: 110%;
    display: inline-block;
    border: 2px solid #FFF;
    background-color:#EEE;
    width: 170px;
    padding: 6px 20px;
    border-radius: 50px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: bold;
    text-wrap: nowrap;
    text-align: center;
}
.dislist li .no a:hover p {
    background-color:#f8bf71;
}
.dislist li .no a:focus p {
    outline: 3px #ff1100 dotted !important;
}
.dislist li .pic {
    width:35%;
    height: 100%;
    background-color:#eee;
    position:relative;
    padding-top: 40%;
}
.dislist li .pic img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.dislist li .pic .p-ticket {
    position:absolute;
    z-index:1;
    background-color: #6c757d;
    bottom: 0;
    padding: 2px 10px;
    color: #FFF;
    width: 100%;
    text-align: center;
    font-size: 85%;
}
.dislist li .info {
    width:65%;
    color:#000;
    padding: 15px;
}
.dislist li .info .stt {
    font-size:105%;
    font-weight: bold;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.store_qr .picqr {
    padding:20px;
    text-align: center;
}
.store_qr img {
    width:100%;
    max-width:300px;
}
.store_qr p {
    margin:0 0 5px 0;
    padding:0 10px;
}
.store_qr .t01 {
    font-size:130%;
    font-weight: bold;
}
.store_qr .t02 {
    font-size:110%;
    font-weight: bold;
    color:#ca0000;
}
.store_qr .txt {
    padding:10px;
    background-color:#eee;
    border-radius: 5px;
}
@media screen and (max-width: 480px) {
.dislist li .pic {
    padding-top:50%;
}
.dislist li .info {
    padding:10px;
}
}
.bill {
    display:flex;
    width: 100%;
    border: 1px solid #ccc;
    padding: 15px 0 15px 15px;
    border-radius: 5px;
    /* justify-content: space-between; */
    align-items: center;
    flex-wrap: wrap;
}
.bill .info {
    border-right:1px solid #ccc;
    padding-right: 10px;
    width:70%;
}
.bill .info ul {
    list-style-type: none;
    padding:0;
    margin: 0;
}
.bill .info li {
    padding:5px 0;
    font-size:105%;
    border-bottom:1px solid #eee;
}
.bill .info li:last-child {
    border-bottom:none;
}
.bill .info p {
    margin:0;
    /* font-size:95%; */
    color: #3b6e84;
}
.bill .stamp {
    width:30%;
    text-align: center;
}
.bill p {
    margin-bottom:5px;
    font-weight: bold;
}
.modal-body .date {
    margin-bottom:5px;
}
.modal-body .note {
    margin-top:20px;
}
.modal-body .note ul {
    list-style-type: decimal;
    padding-left: 25px;
    margin: 0;
}
.modal-body .note .tt {
    font-size:105%;
    font-weight: bold;
    margin-bottom: 10px;
}
.bill img {
    width:100%;
    max-width:100px;
}
.modal-body .logo_b {
    display:flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}
.modal-body .logo_b p {
    margin:0;
    font-weight: bold;
    font-size:105%;
}
@media screen and (max-width: 575px) {
.bill {
    padding: 15px;
}
.bill .info {
    border-right:none;
    padding-right:0;
    width:100%;
}
.bill .stamp {
    width:100%;
    border-top: 1px solid #ccc;
    padding-top: 15px;
}
}
/*地圖*/
.embed-responsive {
  height:600px;
}
.big .modal-dialog {
    max-width: 1140px !important;
    padding: 10px;
}
.big .modal-header {
    padding: 0;
    border: none;
}
.big .modal-header .close {
    right: 5px;
    top: 5px;
    position: absolute;
    opacity: 1;
    z-index:1;
    padding: 0;
}
.big .modal-header .close:hover {
    opacity: 1;
}
.big .modal-header .close:hover svg {
    color:#03A9F4;
    opacity: 1;
}
.big .modal-body {
    padding: 20px;
}
.big .modal-body .map-note {
    position:relative;
    margin-bottom: 15px;
}
.big .modal-body .map-note p {
    margin:0;
}
.big .modal-body .map-note ul {
    position:relative;
    padding: 0;
    list-style-type: none;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    /* min-height: 62px; */
}
.big .modal-body .map-note li {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
.big .modal-body .map-note img {
    max-width: 100%;
    width: 100%;
    max-height: 100%;
}
.big .modal-body .map-note i {
    display: block;
    width: 40px;
    height: 40px;
}
@media screen and (max-width: 767px) {
.big .modal-body .map-note li {
    flex-direction: column;
    word-break: keep-all;
    padding: 0 0.8vw 0 0;
}
.big .modal-body .map-note li:last-child {
    font-size:90%;
    border-left:1px solid #ccc;
    padding-left:20px;
}
.big.ibike1 .modal-body .map-note li:last-child {
    font-size:initial;
    border-left:none;
    padding-left:0;
}
}
@media screen and (max-width: 575px) {
.big .modal-body .map-note ul {
    flex-wrap: wrap;
}
.big .modal-body .map-note li {
    width:25%;
    font-size:95%;
}
.big .modal-body .map-note li:last-child {
    width:100%;
    border-top:1px solid #ccc;
    border-left:none;
    margin-top:10px;
    font-size:90%;
}
.big.ibike1 .modal-body .map-note li:last-child {
    width:initial;
    border-top:none;
    margin-top:0;
    font-size:90% !important;
}
}
.qa_box {
    padding: 20px 0 0 0;
}
.qa_box .q_bar button {
    background-color: #fff;
    padding: 15px 55px 15px 30px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border: 1px #d8c698 solid;
    display: block;
    border-bottom: none;
    font-size: 130%;
    width: 100%;
    color: #0a4623;
    font-weight: bold;
    text-align: left;
    background-image: url(../images/svg/ic_close.svg);
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: center right 25px;
    display: flex;
}
.qa_box .q_bar button.collapsed {
    border: 1px #ffffff solid;
    border-radius: 15px;
    box-shadow: 0 0px 7px 2px rgb(155 126 80 / 33%);
    -webkit-box-shadow: 0 0px 7px 2px rgb(155 126 80 / 33%);
    -moz-box-shadow: 0 0px 7px 2px rgb(155 126 80 / 33%);
    background-image: url(../images/svg/ic_open.svg);
    color: #000;
    background-color: #fffaed;
}
.qa_box .q_bar button.collapsed:hover {
    border: 1px #ffc107 solid;
}
.qa_box .qa_card {
    margin: 0 0 10px 0;
}
.qa_box .card-body {
    background-color: #fff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border: 1px #d8c698 solid;
    border-top: none;
    position: relative;
    padding: 1.25rem 2rem;
}
.qa_box .card-body::before {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    height: 1px;
    display: block;
    background-color: #c7ab64;
    top: 0;
}
/*20230808影音*/
.ap .video-container {
  position: relative;
  padding-bottom: 55%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  /* max-width: 1000px; */
  margin: auto;
}
.ap .video-container iframe,
.ap .video-container object,
.ap .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index:2;
}
.ap .video p  {
  display: block;
  padding:10px;
  text-align:center;
}
.ap .video {
  margin-top:30px;
}
.ap .video .container {
  padding:0 10%;
    margin-bottom:50px;
}
@media screen and (max-width: 991px) {
.ap .video-container {
  padding-bottom: 50%;
}
.ap .video>div {
  padding:10px 0;
}
.ap .video {
  margin-top:20px;
}
.ap .video .container {
  padding:0 5px;
}
}
/*支付業者綁定*/
.paycard {
    list-style-type:none;
    display:block;
    background-color:#FFF;
    margin: 00;
    padding:0;
}
.paycard > div {
    display:inline-flex;
    width:100%;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #ccc;
    padding:20px;
}
.paycard  > div:last-child {
    border:none;
}
.paycard p {
    font-size:120%;
    font-weight:bold;
    margin:0;
}
.paycard img {
    height:40px;
    margin-right:10px;
}
.paycard a {
    background-color:#ea5350;
    color:#FFF;
    padding:8px;
    width:100px;
    text-align:center;
    border-radius:5px;
}
.paycard a:hover {
    text-decoration:none;
    background-color:#607d8b;
}
/*預約購票*/
.booking {
    position:relative;
    padding:15px;
}
.booking label {
    white-space: nowrap;
    margin:0;
    padding-right:10px;
    font-weight:bold;
    font-size:110%;
}
.booking ul {
    margin:0;
    padding:0;
}
.booking li {
    display:flex;
    align-items:center;
    padding:6px 0;
}
.bookingdata {
    padding:15px 20px;
}
.bookingdata ul {
    list-style-type:none;
    padding:0;
    margin:0;
}
.bookingdata li {
    display:flex;
    padding:6px 0;
}
.bookingdata li p {
    white-space: nowrap;
    margin:0;
    padding-right:10px;
    font-weight:bold;
    font-size:105%;
}
@media screen and (max-width: 480px) {
.booking li {
    flex-wrap:wrap
}
.booking label {
    width:100%;
}
}
/*線上訂票按鈕*/
.btn-booking {
    padding:10px 0;
    margin:15px 0 10px 0;
    text-align:right;
}
.btn-booking img {
    padding-right:8px;
}
.btn-booking a {
    padding:8px 15px;
    background-color:#f2f2f2;
    border:1px solid #888;
    border-radius:5px;
    display:inline-flex;
    align-items:center;
}
.btn-booking a:hover {
    text-decoration:none;
    color:#000;
    box-shadow:0 0 10px rgb(0 0 0 / 20%);
}
.required {
    color:#c20000;
    display:block;
    text-align:end;
}
/*20241008點數管理*/
.ap .ptotal {
  display:flex;
  justify-content: flex-end;
  position:relative;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ccc;
}
.ap .ptotal div {
  padding: 0px 15px;
  border-right:1px solid #ccc;
}
.ap .ptotal div:last-child {
  border-right:none;
}
.ap .ptotal p {
  margin:0;
}
.ap .ptotal .picon:before {
  content:"";
  position:absolute;
  background-image: url(../images/svg/ic_points.svg);
  background-repeat:no-repeat;
  display:block;
  width: 25px;
  height: 25px;
  left:0;
  top: 4px;
  background-size: 25px;
}
.ap .ptotal .picon {
  position:relative;
  display:block;
  font-size: 140%;
  font-weight:bold;
  margin:0;
  color: #bf0000;
  padding: 0 0 0 30px;
}
/*點數搜尋*/
.ap .search_group {
  padding: 10px;
  /* background-color: #efefef; */
}
.ap .search_group .form-flex {
  padding: 0 !important;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}
.ap .search_group .form_title {
  white-space: nowrap;
}
.ap .search_group .btn {
  margin: 4px;
  background-color: #5b6497;
  padding: 7px 20px;
  border: none;
  color: #fff;
  width: 100%;
  white-space: nowrap;
  border-radius: 50px;
}
.ap .search_group .btnbox {
  padding:0 0 0 10px;
}
.ap .search_group .btnbox .btn {
  margin: 4px 0;
}
.ap .search_group .btn:hover {
  background-color: #364079;
  color: #fff;
}
@media screen and (max-width: 767px) {
.ap .search_group .btnbox {
  padding:0;
}
}
/*兌換列表*/
.ap .list_group {
  margin: 10px 0 35px 0;
  position:relative;
}
.ap .list_group ul {
  padding: 0;
  margin: 0;
  list-style-type:none;
  display:flex;
  justify-content: flex-start;
  flex-wrap:wrap;
}
.ap .list_group li {
  padding: 10px !important;
  position:relative;
  display:inline-flex;
}
.ap .list_group li a {
  width:100%;
  border-radius: 0;
  padding: 0 0 30px 0;
  border-radius: 10px;
  position:relative;
  transition: all 200ms ease-out;
  -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 3px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2);
  background-color:#FFF;
}
.ap .list_group li a:hover {
  text-decoration:none;
  -moz-transform: scale(1.03);
  -webkit-transform: scale(1.03);
  -o-transform: scale(1.03);
  -ms-transform: scale(1.03);
  transform: scale(1.03);
}
.ap .list_group li .title {
  font-size:110%;
  font-weight:bold;
  text-align:center;
  padding:10px;
}
.ap .list_group li a:focus {
  outline-offset: inherit;
}
.ap .list_group .pic img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.ap .list_group .pic {
    background-color: #f3f3f3;
    vertical-align: middle;
    position:relative;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    overflow: hidden;
    width: 100%;
    padding-top: 75%;
}
.ap .list_group .coin {
  display:flex;
  justify-content:center;
  align-items:center;
  position:relative;
  height: 150px;
  width: 150px;
  border-radius:100%;
  text-align:center;
  margin:20px auto 15px auto;
  border:10px solid #fed525;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fefcea+0,f1da36+100;Gold+3D */
  background: #fefcea; /* Old browsers */
  background: -moz-linear-gradient(top,  #fefcea 0%, #f1da36 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #fefcea 0%,#f1da36 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #fefcea 0%,#f1da36 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */
}
.ap .list_group .coin:before {
  content:"";
  position:absolute;
  width:130px;
  height:130px;
  display:block;
  border: 3px solid #ffef67;
  border-radius:100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.ap .list_group .coin p {
  font-size:300%;
  font-weight:bold;
  color: #332d2b;
  display:inline-flex;
}
.ap .list_group .info i {
  padding-right:8px;
}
.ap .list_group .info {
  position:relative;
  color: #333;
  padding: 15px;
}
.ap .list_group .info span {
  display:block;
  padding: 3px 0;
}
.ap .list_group .info p {
  display:inline-block;
}
.ap .list_group .info .subject {
  color: #332e2b;
  text-align: left;
  display: block;
  font-size: 105% !important;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 55px;
  line-height: 26px;
}
.ap .list_group .info .coins {
  color: #dc3545;
  display:flex;
  text-align:center;
  font-size:120%;
  font-weight: bold;
    align-items:center;
    justify-content:center;
}
.ap .list_group .info .coins img {
  width:20px;
    margin-right:5px;
}
.ap .list_group .info p {
  margin:0 0 5px 0;
  text-align:left;
  display:block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.ap .list_group .info .date {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  border-bottom: 1px solid #ccc;
  color: #5C7A8A;
  font-size:95%;
  display: none;
}
.ap .list_group .pcs {
  font-size:90%;
  color:#666;
  position:absolute;
  right:15px;
  bottom: 13px;
}
.ap .list_group .btn {
  display:block;
  position:relative;
  padding: 0;
  border-radius: 50px;
  margin:0 15px 20px 15px;
}
.ap .list_group .btn a {
  padding:8px 10px;
  display: block;
  color:#FFF;
  text-decoration:none;
}
/*我要兌換*/
.ap .exchange {
  position:relative;
  display:flex;
  padding:20px;
}
.ap .exchange .pic img {
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.ap .exchange .pic {
  width: 40%;
  background-color: #f3f3f3;
  vertical-align: middle;
  position:relative;
  border-radius:10px;
  overflow: hidden;
  text-align:center;
  margin-right:30px;
  box-shadow: 0 0 15px #ccc;
  padding-top: 30%;
}
.ap .exchange .txtbox {
  width:60%;
  position:relative;
  padding: 20px;
  background-color: rgb(255 255 255 / 83%);
  border-radius: 10px;
}
.ap .exchange .txtbox div {
  display:block;
}
.ap .exchange .point {
  margin-bottom:15px;
  color:#333;
}
.ap .exchange .point.ok {
  font-weight:bold;
  font-size: 120%;
}
.ap .exchange .point p {
  display:inline-block;
  margin:0;
}
.ap .exchange .point span {
  padding-right:10px;
  display:inline-block;
}
.ap .exchange .point p.im {
  font-size:150%;
  font-weight:bold;
  color:#b90000;
  margin: 0 5px;
}
.ap .exchange .txtbox .tt {
  font-size: 140%;
  font-weight:bold;
  margin-bottom:15px;
}
.ap .exchange .txtbox .note {
  color:#666;
  border-top:1px solid #ccc;
  padding:10px 0;
}
.ap .exchange .txtbox .btn {
  display:inline-block;
  width: auto;
  margin-bottom:15px;
  padding: 0;
}
.ap .exchange .txtbox .btn.disabled {
    pointer-events: none;
    opacity: 1;
}
.ap .exchange .txtbox .btn.disabled a {
    color: #fff;
    background-color: #6D7783;
}
.ap .exchange .txtbox .btn a {
  color:#fff;
  padding: 8px 30px;
  display: block;
  background-color:#5b6497;
  border-radius:5px;
}
.ap .exchange .txtbox .btn a:hover {
  text-decoration:none;
  background-color:#364079;
}
@media screen and (max-width: 991px) { 
.ap .exchange {
  flex-wrap:wrap;
}
.ap .exchange .pic,
.ap .exchange .txtbox {
  margin:auto;
  width: 100% !important;
  display: block !important;
}
.ap .exchange .pic {
    margin-bottom:20px;
    padding-top: 60%;
}
.ap .exchange .txtbox .btn {
  width:100%;
}
}
/*兌換記錄*/
.ap .log_box .list_title {
  background-color: #008099;
  padding: 12px 15px;
  font-size: 125%;
  text-align: center;
  color: #fff;
  font-weight: 600;
  border-top-left-radius:10px;
  border-top-right-radius:10px;
}
.ap .log_box .nav-tabs {
    flex-wrap: nowrap;
}
.ap .log_box .nav-tabs ul {
    margin:0;
    padding:0;
}
.ap .log_box .nav-tabs li {
    width:100%;
}
.ap .log_box .nav-tabs {
    border-bottom: 2px solid #f8bf71;
}
.ap .log_box .nav-tabs .nav-item {
    text-align: center;
    font-size: 110%;
}
.ap .log_box .nav-tabs .nav-item.show .nav-link,
.ap .log_box .nav-tabs .nav-link.active {
    background-color: #f8bf71;
    color:#000000;
    padding: 12px;
    font-weight:bold;
    border-bottom: 1px solid #f8bf71;
}
.ap .log_box .nav-tabs .nav-link {
    padding: 12px;
    border: none;
    border-radius:0;
    color:#000;
}
.ap .log_list {
  position:relative;
  margin:0 0 20px 0;
  display: block;
}
.ap .log_list ul {
  position:relative;
  margin:0;
  padding:0;
}
.ap .log_list li {
  position:relative;
  list-style-type:none;
  display: flex;
  background-color:#fff;
  align-items: center;
  justify-content: space-between;
}
.ap .log_list li:nth-child(2n+2) {
  background-color: #efefef;
}
.ap .log_list li:last-child {
  border-bottom:2px solid #999;
}
.ap .log_list li .chinfo {
  position:relative;
  padding: 10px;
}
.ap .log_list li .chinfo p {
  margin:0;
}
.ap .log_list li .chinfo span {
  display: flex;
  color:#333;
  margin-bottom:5px;
  position:relative;
}
.ap .log_list li .chinfo p.left {
  font-weight: bold;
  text-wrap: nowrap;
}
.ap .log_list li .chinfo .btt {
  font-size:100%;
}
.ap .log_list li .points {
  display: flex;
  align-items:center;
  padding-right:10px;
    flex-wrap:nowrap;
}
.ap .log_list li .points p {
    margin:0px;
    padding-left:5px;
    text-wrap: nowrap;
    font-weight: bold;
}
.ap .log_list li .points img {
    width:20px;
}
.ap .log_list li .use {
  position:absolute;
  right: 15px;
  top: 15px;
  display: block;
  text-align:center;
  margin:0;
  padding: 2px 8px;
  border-radius: 50px;
  font-size:90%;
  background-color:#cacaca;
  color:#fff;
}
.ap .log_list li .use-1 {
  position:absolute;
  right: 15px;
  top: 15px;
  display: block;
  text-align:center;
  margin:0;
  padding: 2px 8px;
  border-radius: 50px;
  font-size:90%;
  background-color:#00BCD4;
  color:#fff;
}
.ap .log_list li .points p.add,
.ap .log_list li .points p.reduce {
  display: inline-block;
  background-color: #E91B0C;
  padding:2px 10px;
  border-radius:50px;
  color:#FFF;
  font-weight:inherit;
  font-size:90%;
}
.ap .log_list li .points p.reduce {
  background-color:#60788a;
}
@media screen and (max-width: 480px) {
.ap .log_list li .chinfo .box {
    flex-wrap:wrap;
}
.ap .log_list li .chinfo .btt,
.ap .log_list li .chinfo .date {
    display:block;
    width:100%;
}
}
/*20241213提醒訊息*/
.warn {
    padding:15px;
    text-align:center;
    background-color:#fff5d8;
    border-left:1px solid #FFF;
    border-right:1px solid #FFF;
}
/*預約購票*/
.booking {
    position:relative;
    padding:15px;
}
.booking label {
    white-space: nowrap;
    margin:0;
    padding-right:10px;
    font-weight:bold;
    font-size:110%;
}
.booking ul {
    margin:0;
    padding:0;
}
.booking li {
    display:flex;
    align-items:center;
    padding:6px 0;
}
.bookingdata {
    padding:15px 20px;
}
.bookingdata ul {
    list-style-type:none;
    padding:0;
    margin:0;
}
.bookingdata li {
    display:flex;
    padding:6px 0;
}
.bookingdata li p {
    /*white-space: nowrap;*/
    margin:0;
    padding-right:10px;
    font-weight:bold;
    font-size:105%;
}
@media screen and (max-width: 767px) {
.bookingdata li {
    flex-wrap:wrap;
}
}
@media screen and (max-width: 480px) {
.booking li {
    flex-wrap:wrap
}
.booking label {
    width:100%;
}
}
/*線上訂票按鈕*/
.btn-booking {
    padding:10px 0;
    margin:15px 0 10px 0;
    text-align:right;
}
.btn-booking img {
    padding-right:8px;
}
.btn-booking a {
    padding:8px 15px;
    background-color:#f2f2f2;
    border:1px solid #888;
    border-radius:5px;
    display:inline-flex;
    align-items:center;
}
.btn-booking a:hover {
    text-decoration:none;
    color:#000;
    box-shadow:0 0 10px rgb(0 0 0 / 20%);
}
.required {
    color:#c20000;
    display:block;
    text-align:end;
}
/*表格樣式*/
.home .rwd-table01 {
    min-width: 100%;
    background-color: #eef1f2;
    position:relative;
}
.home .rwd-table01 th,
.home .rwd-table01 td:before {
    color: #FFF;
    font-weight: bold;
    background-color: #008099;
}
.home .rwd-table01 tr {
    border-bottom:1px solid #FFF;
    position: relative;
}
.home .rwd-table01 tr:last-child {
    border-bottom:none;
}
@media screen and (max-width: 767px) {
.home .rwd-table01 {
    background-color: #FFF;
    overflow: hidden;
}
.home .rwd-table01 th {
    display: none;
} 
.home .rwd-table01 th,
.home .rwd-table01 td:before {
    color: #000;
}
.home .rwd-table01 td:before {
    content: attr(data-th) " : ";
    font-weight: bold;
    margin-right: 5px;
    display: inline-block;
    background-color:transparent;
    color:#000;
}
.home .rwd-table01 td:first-child:before {
    display:inline-block;
    color:#FFF;
}
.home .rwd-table01 td:first-child {
    background-color:#008299;
    color:#FFF;
}
.home .rwd-table01 td {
    text-align: left !important;
    padding: 10px;
    display: block;
    background-color:#eef1f2;
    border-bottom:1px solid #FFF;
}
.home .rwd-table01 tr {
    margin-bottom:10px;
    display:block;
}
}
@media screen and (min-width: 767px) {
.home .rwd-table01 td:before {
    display: none;
}
.home .rwd-table01 th,
.home .rwd-table01 td {
    display: table-cell;
    word-break: break-all;
}
.home .rwd-table01 th {
    padding:10px 5px !important;
    border-right:1px solid #FFF;
}
.home .rwd-table01 td {
    padding: 10px 5px !important;
    border-bottom:1px solid #FFF;
    border-right:1px solid #FFF;
    text-align:center;
}
.home .rwd-table01 td:first-child {
    border-left:1px solid #FFF;
}
.home .rwd-table01 th:nth-child(1)::before {
    display: none;
}
.home .rwd-table01 th {
    position: relative;
    /*word-break: keep-all;*/
    text-align: center;
    border-bottom: 1px #FFF solid;
}
.home .rwd-table01 th:first-child {
    border-top-left-radius:5px;
}
.home .rwd-table01 th:last-child {
    border-top-right-radius:5px;
}
}