/*bank*/
#bank {
    padding: 3%;
    background:url(../images/bg01.jpg) top center repeat-y ;
    /* background: #ebf4f9; */
    font-size: 22px;
    /*#f5e9df;*/
}

#bank .logo {
    text-align: center;
    padding: 1em 0;
}

#bank .logo img {
    width: 65%;
    max-width: 360px;
}

#bank .bankBox {
    background: white;
    border-radius: 15px;
    margin: 2em auto 3em;
    max-width: 1220px;
}

#bank .bankBox.blue {
    background: #463076;
}

#bank .bankBox h3 {
    background: #39d19d;
    color: white;
    font-weight: bold;
    font-size: 136%;
    text-align: center;
    width: 60%;
    margin: 0 auto;
    padding: 1em 0;
    border-radius: 0 0 15px 15px;
}

#bank .bankBox.blue h3 {
    background: #6b49b3;
}

#bank .bankBox.redred h3 {
    background: #e2211c;
}

#bank .bankBox .btn {
    display: block;
    width: 100%;
    font-weight: bold;
    text-align: center;
    padding: 1em 0;
    border-radius: 15px;
    color: black;
    background: #64e8bb;
    box-shadow: 0 9px 0 #449e80;
    transition: all 0.2s;
}

#bank .bankBox .btn.red {
    background: #e2211c;
    box-shadow: 0 9px 0 #9e1813;
    color: white;
}

#bank .bankBox .btn.blue {
    background: #007679;
    box-shadow: 0 9px 0 #005f61;
    color: white;
}

#bank .bankBox .btn span {
    padding-left: 2em;
}
#bank .bankBox.installment{
    padding: 0 2em 2em;
}
#bank .bankBox.installment .bankBox-2{
    align-items: center;
}
#bank .bankBox.installment .bankBox-2 dl{
    border-right:unset;
}
#bank .bankBox.installment .bankBox-2 dl b{
    font-size: 120%;
    line-height: 1.5;
}
#bank .bankBox.installment .bankBox-2 dl p{
    font-weight: 400;
}

#bank .bankBox.installment img{
 
    width: 100%;

}
#bank .bankBox .btn1 {
    padding: 0 2em 2em;
}

#bank .bankBox .btn2 .btn {
    background: #553b8f;
    box-shadow: 0 9px 0 #342457;
    color: white;
}

#bank .bankBox .btn:hover {
    transform: translateY(5px);
}

#bank .bankBox .btn1 .btn:hover {
    box-shadow: 0 5px 0 #449e80;
}

#bank .bankBox .btn1 .btn.red:hover {
    box-shadow: 0 5px 0 #9e1813;
}

#bank .bankBox .btn1 .btn.blue:hover {
    box-shadow: 0 5px 0 #005f61;
}

#bank .bankBox .btn2 .btn:hover {
    box-shadow: 0 5px 0 #342457;
}

#bank .bankBox h5 {
    text-align: center;
    font-size: 180%;
    line-height: 1.2;
    font-weight: bold;
    letter-spacing: 0.05em;
    padding: 1em 1em 0;
}

#bank .bankBox h6 {
    text-align: center;
    font-size: 100%;
    line-height: 1.2;
    font-weight: bold;
    letter-spacing: 0.05em;
    padding: 1em 1em 0;
    color: red;
}

#bank .bankBox-2,
#bank .bankBox-c26 {
    display: flex;
    justify-content: center;
    padding: 2em;
}

#bank .bankBox-2 dl {
    width: 50%;
    font-weight: bold;
    padding: 0 1.5em;
    /*padding: 0 2em;*/
    display: flex;
    flex-wrap: wrap;
    align-content: start;
}
#bank .bankBox-2 dl.onlyone {
    width: 100%;
    
}

#bank .bankBox-2 dl:first-child {
    border-right: solid 2px #355c85;
}

#bank .bankBox.redred .bankBox-2 dl:first-child {
    border-right: none;
}

#bank .bankBox-2 .line {
    border-right: solid 2px #355c85;
}

#bank .bankBox-2 dt {
    width: 100%;
    color: #355c85;
    font-size: 300%;
    text-align: center;
    letter-spacing: 0.1em;
    padding-bottom: 0.5em;
}

#bank .bankBox-2 dt.cardName {
    font-size: 180%;
    color: #e2211c;
}

#bank .bankBox-2 dd {
    padding: 1em 0;
    line-height: 1.5;
    width: 100%;
}

#bank .bankBox-2 dd p.inlineBlock {
    display: inline-block;
}

#bank .bankBox-2 dd.btn2 {
    align-self: flex-end;
}

#bank .bankBox-2 dd b {
    /* background: #e2211c; */
    color: #e2211c;
    /* padding: 0 0.5em; */
    /* margin: 0 0.2em; */
    /* border-radius: 5em; */
    font-size:30px;
}

#bank .bankBox-2 dd b.date{

   background:  #f3ce14;
    padding: 0 0.5em;
    border-radius: 5em;
    color: #FFF;
}

#bank .bankBox-2 dd .mark {
    display: inline-block;
    font-size: 180%;
    line-height: 1;
    /*background: url(../images/bg_mark.jpg) left bottom repeat-x;*/
}

#bank .bankBox-2 dd .mark span {
    font-size: 160%;
    vertical-align: baseline;
}

#bank .bankBox-2 dd small {
    color: #4c4c4c;
    font-weight: normal;
    vertical-align: baseline;
}

#bank .bankBox-2 dd p.mark small {
    font-size: 50%;
}

#bank .bankBox-2 dd p img {
    margin-bottom: 0.5em;
}

#bank .bankBox-2 dd p em {
    font-style: normal;
    color: #e2211c;
    font-size: 180%;
    vertical-align: baseline;
}

#bank .bankBox-2 dd p br.brbank {
    display: none;
}

#bank .info {
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.2;
}

#bank .info .left {
    font-size: 170%;
    padding-right: 1em;
    margin-right: 1em;
    border-right: solid 1px;
}

#bank .info .right {
    font-size: 110%;
}

#bank .ex {
    padding: 2em;
    color: gray;
}

#bank .ex h6 {
    text-align: center;
    font-size: 100%;
    padding: 1em 0;
}

#bank .ex ul {
    padding-left: 1em;
}

#bank .ex li {
    font-size: 70%;
    line-height: 1.5;
    list-style-type: decimal;
}

#bank .bankBox .bankBox-c26 .group-type-ph {
    display: flex;
    justify-content: space-between;
}

#bank .bankBox .bankBox-c26 .ph {
    width: 32%;
    padding: 0;
    display: inline-block;
    font-family: "微軟正黑體", "Microsoft JhengHei", "Apple LiGothic Medium", Arial, Helvetica, sans-serif;
    height: auto;
    padding: 10px;
}

#bank .bankBox .bankBox-c26 .ph a {
    position: relative;
    display: block;
    text-decoration: none;
    background: white;
    color: #666666;
    border-radius: 15px;
    overflow: hidden;
    height: 100%;
}

#bank .bankBox .bankBox-c26 .ph .ph-img img {
    width: 100%;
}

#bank .bankBox .bankBox-c26 .ph .ph-title {
    font-size: 24px;
    line-height: 1.3;
    padding: 5%;
    color: black;
}

#bank .bankBox .bankBox-c26 .ph .ph-detail {
    font-size: 16px;
    line-height: 1.5;
    overflow: hidden;
    padding: 0 5%;
    margin-bottom: 4em;
}

#bank .bankBox .bankBox-c26 .ph .ph-feature {
    display: none;
}

#bank .bankBox .bankBox-c26 .ph .price {
    position: absolute;
    bottom: 1em;
    right: 1em;
    display: inline-block;
    font-family: "Century Gothic", Arial, "Microsoft JhengHei";
    font-size: 16px;
    height: 2em;
    line-height: 2em;
    padding: 0 1em;
    background: red;
    font-weight: bold;
    color: white;
    border-radius: 5em;
}

#bank .bankBox .bankBox-c26 .ph .price * {
    font-style: normal;
    font-size: 100%;
}

#bank .bankBox .bankBox-c26 .price span {
    vertical-align: inherit;
}

#bank .bankBox .bankBox-c26 .ph .price i {
    font-family: "微軟正黑體", "Microsoft JhengHei", "Apple LiGothic Medium", Arial, Helvetica, sans-serif;
}


/*實體旅展下單禮*/
#bank .giftBox {
    position: relative;
    display: block;
}

#bank .giftBox img {
    width: 100%;
}

#bank .giftBox img.pc {
    display: block;
    max-width: 1200px;
    text-align: center;
    margin: 0 auto;
}

#bank .giftBox img.mob {
    display: none;
}


@media screen and (max-width:1024px) {
    #bank .bankBox-2 dd p img {
        width: 100%;
    }
}


@media screen and (max-width:800px) {
    #bank .giftBox img.pc {
        display: none;
    }

    #bank .giftBox img.mob {
        display: block;
        max-width: 800px;
        text-align: center;
        margin: 0 auto;
    }
}



@media screen and (max-width:980px) {
    #bank {
        font-size: 18px;
    }

    #bank .bankBox h3 {
        width: 80%;
    }

    #bank .bankBox-2,
    #bank .bankBox-c26 {
        padding: 2em 0;
    }

    #bank .bankBox-2 dl:first-child,
    #bank .bankBox-2 dl:nth-child(2) {
        padding: 0 2em;
    }

    #bank .info .left {
        font-size: 120%;
        padding-right: 0.5em;
        margin-right: 0.5em;
    }

    #bank .info .right {
        font-size: 80%;
    }

    #bank .bankBox .bankBox-c26 .group-type-ph {
        padding: 0 2em;
    }

    #bank .bankBox .bankBox-c26 .ph .ph-title {
        font-size: 20px;
    }

    .bankBox-c26 .group-type-ph {
        padding: 0 2em;
    }

    .bankBox-c26 .ph .ph-title {
        font-size: 20px;
    }

}

@media screen and (max-width:640px) {
    #bank .bankBox h3 {
        width: 100%;
        border-radius: 0;
    }

    #bank .bankBox-2,
    #bank .bankBox-c26 {
        flex-wrap: wrap;
        padding: 1em;
    }

    #bank .bankBox-2 dl {
        width: 100%;
        padding: 0 !important;
        text-align: left;
    }

    #bank .bankBox-2 dl:first-child,
    #bank .bankBox-2 dl:nth-child(2) {
        border-right: none;
        padding: 1em 0 !important;
    }

    #bank .bankBox .btn1 {
        padding: 0 1em 2em;
    }

    #bank .bankBox-2 dt {
        font-size: 250%;
    }

    #bank .bankBox h5 {
        font-size: 140%;
    }

    #bank .ex {
        padding: 1em;
    }

    #bank .bankBox .btn span {
        padding-left: 0;
        display: block;
        padding-top: 0.5em;
    }

    #bank .bankBox .bankBox-c26 .ph .ph-title {
        font-size: 18px;
    }

    #bank .bankBox .bankBox-c26 .ph .ph-detail {
        font-size: 14px;
    }

    #bank .bankBox .bankBox-c26 .group-type-ph {
        flex-wrap: wrap;
        padding: 0;
    }

    #bank .bankBox .bankBox-c26 .ph {
        width: 100%;
        padding: 0.5em 0;
    }

    #bank .bankBox-2 .line {
        border-right: none;
    }

    #bank .bankBox-2 dd p br.brbank {
        display: block;
    }


    #bank .bankBox-2 dd b.date{
        font-size: 24px;
    }
}



/*video*/
#video {
    padding: 0 3% 3%;
    font-size: 22px;
    text-align: center;
}

#video h2 img {
    max-width: 634px;
    width: 100%;
}

#video h2 {
    margin: 10px auto;
    background: url(../images/c26title2.png) no-repeat center top;
    font: bold 38px/1.8 "微軟正黑體";
    display: block;
    color: #FFF;
    position: relative;
    width: 490px;
    padding: 5px 0;
}

#video .iframeBox {
    position: relative;
    width: 1060px;
    margin: 1em auto;
    padding-bottom: 595px;
}

#video .iframeBox iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

#video p {
    text-align: center;
    font-weight: bold;
    line-height: 1.5;
}

#video b {
    text-align: center;
    font: bold 32px/1.5 "微軟正黑體";
    color: #744cab;
}



#video h2::before {
    content: "";
    position: absolute;
    background: url(../images/video-l.png)top center no-repeat;
    left: -136px;
    width: 141px;
    height: 120px;
    display: block;
    top: -20px;
}

#video h2::after {
    content: "";
    position: absolute;
    background: url(../images/video-r.png)top center no-repeat;
    right: -122px;
    width: 120px;
    height: 120px;
    display: block;
    top: -25px;
}

@media screen and (max-width:1220px) {
    #video {
        font-size: 18px;
    }

    #video .iframeBox {
        width: 100%;
        padding-bottom: 56.25%;
    }
}

@media screen and (max-width:700px) {
    #video h2 {
        font: bold 5.4vw/1.7 "微軟正黑體";
        width: 80%;
        background-size: 100%;
    }

    #video h2::before {
        left: -85px;
        width: 23%;
        height: 115%;
        top: -5px;
        background-size: 100%;
    }

    #video h2::after {
        right: -75px;
        width: 20%;
        height: 150%;
        top: -5px;
        background-size: 100%;
    }

}


@media screen and (max-width:620px) {

    #video b {
        font: bold 26px/1.5 "微軟正黑體";
    }

}

@media screen and (max-width:500px) {

    #video h2::before {
        left: -50px;
    }

    #video h2::after {
        right: -50px;
    }



}








#bank .blog {
    background: white;
    border-radius: 15px;
    margin: 2em auto 3em;

    width: 95%;
    max-width: 1200px;
}

#bank .blog h3 {
    background: #e2211c;
    color: white;
    font-weight: bold;
    font-size: 136%;
    text-align: center;
    width: 60%;
    margin: 0 auto 60px auto;
    padding: 1em 0;
    border-radius: 0 0 15px 15px;
}

#bank .blog_infor {
    display: inline-flex;
    margin: 0 auto;
    padding: 0 20px 20px 20px;
    flex-wrap: wrap;
    justify-content: center;

}

#bank .blog_infor li {
    display: inline-block;
    flex-shrink: 0;
    padding: 0 20px;
    width: 50%;
}

#bank .blog_infor li iframe{

    width: 100%;
    margin: 20px auto;


}

#bank .blog img {
    width: 100%;
}

#bank h4 {
    margin-bottom: 20px;
    font-size: 150%;
    color: #e2211c;
}

#bank .blog_infor_img {
    margin-bottom: 20px;
}

#bank p {

    line-height: 1.5;
}

@media screen and (max-width:640px) {
    #bank .blog h3 {
        margin-bottom: 5%;
        width: 100%;

        border-radius: 0;
    }

    #bank .blog_infor {
        flex-wrap: wrap;
    }

    #bank .blog_infor li {
        display: block;
        margin-bottom: 20%;
        padding: 0 5%;
        width: 100%;
    }


    #bank .blog_infor li iframe{

        margin: 10px auto;
    
    
    }
    


}






#bank .eventWarning {
    background: white;
    border-radius: 15px;
    margin: 2em auto 3em;
    width: 95%;
    max-width: 1200px;
}

#bank .eventWarning h3 {
    background: #e2211c;
    color: white;
    font-weight: bold;
    font-size: 136%;
    text-align: center;
    width: 60%;
    margin: 0 auto 60px auto;
    padding: 1em 0;
    border-radius: 0 0 15px 15px;
}

#bank .eventWarning ul {
    padding: 0 20px 20px 50px;
}
#bank .eventWarning b{
    border-radius: 20px;
    background: #ffef9e;
    color: #000;
    padding: 5px 10px;
    margin-bottom: 10px;
    display: inline-block;
}
#bank .eventWarning li {
    margin-bottom: 12px;
    line-height: 1.5;
    letter-spacing: 0.2px;
    list-style: decimal;
    font-size: 85%;
}

@media screen and (max-width:640px) {
    #bank .eventWarning h3 {
        margin-bottom: 5%;
        width: 100%;

        border-radius: 0;
    }


}













/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/
/***********POI商品開始******************/

.poi h2 {
    display: block;
    margin: 0 auto;
    padding: 15px 0;
    width: 95%;
    font: 900 65px/1 "Noto Sans TC", "微軟正黑體";
    color: #e50039;
    text-align: center;
    letter-spacing: 3px;
    border-radius: 0 0 20px 20px;

}


.poi h3 {
    display: block;
    text-align: center;
}

.poi h3 span {
    display: inline-block;
    margin: 10px 0 30px 0;
    padding: 10px 20px;
    font: 500 42px/1.2 "Noto Sans TC", "微軟正黑體";
    color: white;
    border-radius: 99em;
    background: #e50039;
    vertical-align: middle;

}

.poi h3 span strong {
    color: #fff200;
    vertical-align: middle;
    transform: translateY(2px);
}



.poi-sale .poiAutoTemplate .slidecontain {
    justify-content: center;
}

.poi-sale .ph {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0.03em;
    margin: 0 auto;
    color: #333333;
}

.poi-sale .ph a {
    color: #333333;
}

.poi-sale .ph-title {
    display: none;
}

.poi-sale .ph-menu img {
    display: none;
}

.poi-sale .ph-group {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.poi-sale .ph-group-title {
    display: none;
}

.poi-sale .ph-group-title img {
    display: none;
}

.poi-sale .ph-group-content {
    position: relative;
    width: calc(25% - 2em);
    margin: 3em 1em;
    background: white;
    border: solid 1px #333333;
    padding: 10px;
}

.poi-sale .ph-group-content:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 2px rgba(0, 0, 0, 0.2);
}

.poi-sale .ph-group-content-photo {
    position: relative;
}

.poi-sale .ph-group-content-photo a {
    display: block;
}

.poi-sale .ph-group-content-photo img {
    width: 100%;
}

.poi-sale .ph-group-content-tag {
    font-size: 20px;
    position: absolute;
    left: 0;
    top: -2.2em;
    font-weight: 500;
    letter-spacing: 0.1em;
    white-space: nowrap;
    padding: 0.4em 0.8em 0.2em;
    color: black !important;
}

.poi-sale .ph-group-content-text {
    padding: 1em;
}

.poi-sale .ph-group-content-text-name {
    display: block;
    font:700 17px/1.5 "微軟正黑體";
    padding: 5px;
}

.poi-sale .ph-group-content-text-sale a {
    display: inline-block;
    font-size: 14px;
    color: #666666;
    letter-spacing: 0.1em;
    padding: 0.2em 1em;
    margin: var(--poi-padding) 0;
    /* border: solid 1px; */
    border-radius: 5em;
    font:700 15px/1.5 "微軟正黑體";
}

.poiAutoTemplate .ph-group-content-text-sale,
.poiAutoTemplate .ph-group-content-text-sale a {
    background: none !important;
}

.poi-sale .ph-group-content-text-detail a {
    display: block;
    color: #666666;
    font-size: 14px;
    line-height: 1.5;
    font:14px/1.8 "微軟正黑體";
    padding: 5px;
}

.poi-sale .ph-group-content-text-price {
    display: block;
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    border-top: solid 1px #333333;
    margin-top: var(--poi-padding);
    padding-top: var(--poi-padding);
    width: calc(100% + 32px);
    transform: translateX(-16px);
    font:700 25px/1.5 "微軟正黑體";
    padding: 5px;
}

.poi-sale .ph-group-content-text-price span {
    font-size: 14px;
    vertical-align: middle;
}


.poi-sale.poi-green .ph-group-content-tag {
    background: url(../images/circle-green.png) left center no-repeat;
    background-size: contain;
}

.poi-sale.poi-green .ph-group-content-text-price {
    color: #e50039;
}

.poi-sale.poi-red .ph-group-content-tag {
    background: url(../images/circle-red.png) left center no-repeat;
    background-size: contain;
}

.poi-sale.poi-red .ph-group-content-text-price {
    color: #db6f4b;
}







@media screen and (max-width:1220px) {
    .poi-sale .ph {
        font-size: 14px;
    }

    .poi-sale .ph-group-content-tag {
        font-size: 16px;
    }

    .poi-sale .ph-group-content-text-sale a {
        font-size: 12px;
    }

    .poi-sale .ph-group-content-text-detail a {
        font-size: 12px;
    }

    .poi-sale .ph-group-content-text-price {
        font-size: 24px;
    }

    .poi-sale .ph-group-content-text-price span {
        font-size: 12px;
    }

    .poi-sale .ph-group-content-text-price {
        width: 100%;
        transform: none;
    }
}


@media screen and (max-width:960px) {
    .poi-sale .ph-group-content {
        width: 48%;
        margin: 3em 1% 1.5em;
    }
}

@media screen and (max-width:480px) {
    .poi-sale .ph-group-content {
        width: 100%;
        margin: 3em 0% 1.5em;
    }

    .poi h2 {
        font: 900 25px/1 "Noto Sans TC", "微軟正黑體";

    }

    .poi h3 span {
        font-size: 20px;
    }
}


.poi-sale .poiAutoTemplate .slidecontain li a {
    color: #e50039;
}

.poiAutoTemplate .slidecontain li.poiAutoTemplate-on {
    border-bottom: none;
}

.poi-sale .poiAutoTemplate .slidecontain li.poiAutoTemplate-on a {
    color: white;
    border-radius: 99em;
    background: #e50039;
}

.poi-sale .poiAutoTemplate .slidecontain li:hover a {
    color: white;
    border-radius: 99em;
    background: #e50039;
}




.poi-item.on{ display: block;}
.poi-item{display: none;}
.poi-item .ph-menu{display:none;}

.poi-menu{ display: flex; flex-wrap: wrap;  padding-bottom: 20px;justify-content: center; }
.poi-menu ul li{cursor: pointer;  display:inline-block;  padding: 5px 10px;  text-decoration: none; font: 300 17px/1 "微軟正黑體";color: black;}
.poi-menu ul li:hover{ color: white;  border-radius: 99em;  background: #e50039; }
.poi-menu ul li.on{color: white; border-radius: 99em; background: #e50039; }
.poi-sale .poi-item .ph-group-title {text-align: center;display: block;margin: 10px auto; }
.poi-sale .poi-item .ph-group-title span{font: bold 24px/1 "微軟正黑體"; color: #000; }

@media screen and (max-width:480px) {
.poi-menu ul li{padding: 5px 3px;}
}



.poi-item .ph .link-right{
    background: #355c85;
    border-radius: 30px;
    padding: 12px 24px;
    color: #FFF;
    text-align: center;
    position: relative;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
    bottom: 24px;
    margin: 0 auto;
    font-size: 30px;
}
@media screen and (max-width:480px) {
    .poi-item .ph .link-right{
        font-size: 20px;
    }
}

/***********POI商品結束******************/
/***********POI商品結束******************/
/***********POI商品結束******************/
/***********POI商品結束******************/
/***********POI商品結束******************/
/***********POI商品結束******************/
/***********POI商品結束******************/






table.bankBoxTable * {vertical-align: middle !important; }
table.bankBoxTable {text-align: center;border:1px #960c00 solid;font-size: 16px;margin: 0 auto;text-align: center;background: #fff6d8;margin-bottom: 40px;
width: 100%;}
table.bankBoxTable tr td{padding: 10px 10px; border:1px #d21100 solid;text-align: center;}
table.bankBoxTable tr:nth-of-type(1){background:#df4b4b;color:#fff; padding: 20px ;text-align: center;}