@charset "utf-8";
/* CSS Document */
/*-- 獎牌數字用 --*/
@import url('https://fonts.googleapis.com/css?family=Roboto:700');

body{
    background-color: #efefef;
}
body, html, h1,h2,h3,h4,h5,p,span,a,div{ font-family: Microsoft JhengHei !important; }
a:hover{ text-decoration: none; color:#000000; }

/*-----------youtube RWD------------*/
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
.video-container iframe, .video-container object, .video-container embed {
    position: absolute;
    top: 0;left: 0;
    width: 100%;
    height: 100%;
}
/*-----------youtube RWD END------------*/



/*----  線上立即辦卡menu ---*/
#menu .dropDown_menu.card_assign_menu{
   width: 25%;
   margin-left: 31px;
}



/*-- 報稅特輯 --*/
.marquee_pc{
    position: absolute;
    width: 130px;
    height: 35px;
    right: 30px;
    background-color: rgba(255, 100, 100, 0.8);
    border-radius: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
    transition: all 0.5s;   
}

.marquee_pc span{
	padding: 10px 10px 10px 10px;
}
.marquee_pc button{ 
    position: absolute; 
    left: -6px; 
    top: -6px; 
    border: 1px solid; 
    padding: 0; 
    border: 1px solid; 
    border-radius: 30px; 
    background-color: #d83181; 
    width: 20px; 
    height: 20px; 
    font-size: 12px; 
    color: #fff;
}

.marquee_pc a{
	text-decoration: none;
	text-decoration-line: none;
	color: #fff;
}



/*---------------共用------------------*/

/*boostrap 自定義*/

        
.container {
	position: relative;
	margin-right: auto;
	margin-left: auto;
	width: 1130px;
	max-width: 1130px;      
}

.container.detail_page {
    width: 1150px;
    max-width:1150px;
}

.row {
    display: flex;
    flex-wrap: wrap;
    padding:0;
    margin:0;
}

.col,.col0{
    position: relative;
    max-width: 100%;
    width: 100%;
    min-height: 1px;
}

.col{ padding:10px; }
.col0{ padding:0px; }

.pl-30{ padding-left: 30px; }

.h-center{ 
    display: flex; 
    align-items: center;
}
.hv-center{ 
    display: flex !important; 
    justify-content: center;
    align-items: center;
}

.hv-around{
    display: flex; 
    justify-content: space-around;
    align-items: center;
}

.flex-x-center{
    justify-content: center;
}

.w-30{
  width: 33% !important;
}

.w-85-mt{ width: 85%; margin: auto;}
.w-100{ width: 100%;}
.h-100{ height: 100% !important; }

.w-h-100{
    width: 100%;
    height: 100%;
}

.wh-50px{ width: 50px; height: 50px; }
.h-60px{ height: 60px; }

.mt-05{
    margin-top: 0.5rem;
}

.mt-025{
    margin-top: 0.25rem;
}

.nowrap{ white-space: nowrap; }

/*boostrap 自定義end*/

/*-- 信用卡快搜、權益快搜用 --*/
.ccard_back{ 
    background:url(/img/component/search_back.png) no-repeat; 
    background-position-x: 142%;
    background-position-y: 53px; 
}

.ccard_icon_js.type img{ width: 52px; padding: 2px; }

.pcard_back {
    background: url(/img/component/p_card.png) no-repeat;
    background-position-x: 105%;
    background-position-y: 90px;
}

.tcard_back {
    background: url(/img/component/t_card.png) no-repeat;
    background-position-x: 108%;
    background-position-y: 88px;
}

.ucard_back {
    background: url(/img/component/u_card.png) no-repeat;
    background-position-x: 102%;
    background-position-y: 100px;
}

.cardu_li{
  list-style-image: url(/img/component/li.png) !important;
}

.cardu_li li{ list-style-image: url(/img/component/li.png) !important;}

.star_li{ list-style-image: url(/img/component/star_li.png); }

.crumbs{ margin: 0; padding: 2px 0; color: #888; }
.crumbs a{ color: #888; padding: 0 3px; }
.crumbs a:last-child{ color: #007bff; }
.crumbs i{  color: #4d67c7; }
.crumbs .active{ color: #4d67c7; }
.crumbs_row{ width: 1090px; margin:auto; }

.img_div{ background-position: center; background-size: cover; }


.clearfix { clear: both; }

.test{
    width:100%;
    height:100%;
}

.test-color{
    background-color: #eee;
}

.cardshap{ 
    border-radius: 20px 0 20px 0;
    background-color: #fff;
    overflow: hidden;
}

.shadow_text{text-shadow: 1px 1px 1px #333;}
.shadow_div{box-shadow:0px 0px 18px rgba(20%,20%,40%,0.2);}

.blue_br{  background-color: #3a56ab;}
.green_br{ background-color: #126900;}

.blue_font{  color: #3a56ab;}
.green_font{ color: #126900;}

.icon{ background-repeat: no-repeat; background-position: center; display: inline-block; width: 20px; height: 20px; background-size: 90%;margin-right:3px;}

.search_div{ justify-content: flex-end; }
.search_btn{ 
    width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 5px;
 }

 #arrow_btn{
   border-radius: 0%;
   background-color: #172f87;
 }

 #arrow_btn i{ padding: 0; color: #fff; }

  .apply_btn{
   width: 110px;
   height: 40px;
   background-color: #ffc107;
   color: #212529;
   text-align: center;
   line-height: 40px;
   border-radius: 5px;
 }
 


 .more_search{ position: absolute; width: 33px; right: 5px; margin-top: 2px; height: 0px; overflow: hidden; z-index: 10;}
 .more_search a{ margin-bottom: 5px;  display: block; }


/*swiper*/
 .swiper-wrapper{ transition-timing-function: cubic-bezier(0.07, 0.29, 0.31, 1); }


 .close_fancybox{ position: absolute; right: 0; top: 0; border-radius: 0; }

 #G_login, #G_link, #G_unlink{
   background: url('/img/component/icon/g-normal.png'); 
   background-repeat: no-repeat;
   background-position-y:center;
   background-position-x:3px;
 }

 #mem_G_login{
   background: url('/img/component/icon/g-normal.png'); 
   background-repeat: no-repeat;
   background-position-y:center;
   background-position-x:3px;
   width: 141px;
   height: 34px;
   padding: 0px;
   border: 1px solid #ccc;
 }





/*---------------共用end------------------*/



/*---------------Header------------------*/
.header_div{
  width: 1080px;
  margin: auto;
}

.header_div.fixed{
  position:fixed;
  z-index:101;
  top:0;
  left: 0;
  right: 0;
}

.header_div.fixed>.row{
  width: 1080px;
  margin: auto;
}

.header_div.fixed #index_head_left div{
  position: absolute;
  top: -23px;
}

.header_div.fixed #index_head_left div img{
  width: 135px;
}

.header_div.fixed #index_head_right>.row{
  display: none;
}


/* 置頂橫幅 */
.header_div #index_head_right>.row .top-ad.d-flex .ad-span{
  overflow: hidden;
  border-radius: 15px;
  width: 250px;
  height: 96px;
}

.header_div #index_head_right>.row .top-ad.d-flex .ad-span img{
  width: 250px;
  height: 96px;
}

/*iconSet*/
.icon_head{
    /* margin: 13px 0 0 0; */
    display: block;
    width: 100%;
}
.icon_head a{
    width: 38px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #22398f;
    color: #fff;
}
.icon_head a:hover{
    background: linear-gradient(135deg, rgba(119 119 119) 0%,rgba(76 76 76 / 78%) 36%,rgba(0 0 0 / 14%) 100%);
}
#icon_head_fb{}
#icon_head_rss{ }




/*iconSet end*/



/*ad_headtop_txt*/
#headtop_ad{
	font-size: 16px;
    color: #172f87;
	margin-top: 0.5rem;
	display: inline-block;
}
#headtop_ad a{
    color: #172f87;
    padding: 12px;
}
#headtop_ad a:hover {
    text-decoration: none;
}

#headtop_ad a:visited {
    background-color: #efefef;
    text-decoration: none;

}

/*TopInfo*/
#TopInfo{
    font-size: 16px;
    color: #172f87;
	margin-top: 0.5rem;
	display: inline-block;
}
#TopInfo a{
    color: #172f87;
    margin-right: 10px;
    margin-left: 14px;
}
#TopInfo a:hover {
    text-decoration: none;
}

#TopInfo a:visited {
    background-color: #efefef;
    text-decoration: none;
}
#TopInfo .fa-sign-in {
  margin-right: 4px;
}

#TopInfo .fa-user-plus {
  margin-right: 2px;
}

#TopInfo .fa-sign-out {
  margin-right: 2px;
  margin-left: 14px;
}

.search_box{ display: none; position: absolute; width: 94%;  padding: 7px 15px; left: 0; right: 0; z-index: 100;  margin: auto; background-color: #ffffff; border: 1px solid #e6e6e6; border-top: 0;}
.search_box .search_box_btn{ color: #fff; background-color: #23398e; margin:5px 0; padding: 5px 40px;}
.search_box .Adv_search_box_btn{ font-size: 13px; padding: 5px; margin:5px 0; background-color: #929292; color: #fff; vertical-align: bottom;}
.search_box .form-row{ align-items: center; }
.search_box .close_btn{ color: #000; display: block; margin:5px 0; }

.top_div{
  display: none;
  opacity: 0;
  position: fixed;
  right: 2%;
  bottom: 0%;
  z-index: 100;
}

.top_div a{
  display: inline-block;
    line-height: 0.8;
    padding: 8px 12px;
    background-color: #fff;
    border: 1px solid #dedede;
    color: #9E9E9E;
    border-radius: 30px;
    font-size: 15px;
    box-shadow: 1px 3px 6px -1px rgba(0, 0, 0, 0.2);
}

.top_div a i{
  width: 100%;
  text-align: center;
}

.top_div a p{
  margin-bottom: 5px;
}


/*-- 會員開方提醒 --*/
.mem_tool_alert{ 
    position: absolute; 
    top: 50px; 
    right: 18px; 
    width: 120px; 
    height: 40px; 
    background-color: rgba(255, 100, 100, 0.8); 
    border-radius: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.5s;}

.mem_tool_alert button{ 
     position: absolute; 
     right: -6px; 
     top: -6px; 
     border: 1px solid; 
     padding: 0; 
     border: 1px solid; 
     border-radius: 30px; 
     background-color: #d83181; 
     width: 20px; 
     height: 20px; 
     font-size: 12px; 
     color: #fff;}

.mem_tool_alert p{margin: 0;}


.mem_tool_alert::before{
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 9px 9px 9px;
  border-color: transparent transparent rgba(255, 100, 100, 0.8) transparent;
  position: absolute;
  top: -9px;
  left: 20px;
}

.mem_tool_alert.none{ opacity: 0; z-index: 0; top: 55px;}

.mem_tool_alert.phpbb2{ right: 150px;}

.mem_tool_alert.phpbb2::before{left:53px;}

.mem_tool_alert.card_assign{ right: 220px;}

.mem_tool_alert.card_assign::before{left:53px;}

#menu{
    width: 100%; 
    
    height: 35px;
    border-radius: 20px;
    text-align: center;
    display: block;
}


#menu > ul {
    list-style-type: none;           
    overflow: hidden;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
    padding: 0px 12px 0px 20px;
    width: 100%; 
    font-weight: bold;
    font-size:18px;
}

#menu > ul> li {
    float: left;
    line-height: 35px;
    display: block;
}

#menu > ul> li> a {
    display: flex;
    color: white;
    text-align: center;
    padding:0 10px;

    text-decoration: none;
}
#menu > ul> li.active{
  background-image:url(/img/component/menuOverBr.png);
}

#menu > ul> li.active>a{
  color: #1d368c !important;
}

#menu > ul > li:nth-child(1) >a {
  background-image:url("/img/component/menuOverBr2.png");
  text-decoration: none;
  color: white;
}

#menu > ul> li a:hover {
  background-image:url("/img/component/menuOverBr.png");
  text-decoration: none;
  color: #223a8f;
}

/* Change the link color to #111 (black) on hover */

#menu > ul> li a:hover {
  background-image:url("/img/component/menuOverBr.png");
  text-decoration: none;
  color: #223a8f;
}

#TopInfo a#searchBtn{
color: #ffffff;
}

#searchBtn{
display: inline-block;
padding-left: 12px;
padding-right: 12px;
background-color: #fc9b1b;
border-radius: 50px;
text-align: center;
cursor: pointer;
}

#searchBtn > a{
  margin: 0;
  padding: 0px;
}

#TopInfo a#searchBtn:hover{
background-color: #e18812;
}


/*--- 下拉選單 ---*/
#menu .dropDown_menu{  
    display: none;   
    position: absolute;
    z-index: 100;
    width: 94%;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 0 0 20px 0;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    background-color: #E5E5E5; 
  }

#menu .dropDown_menu .row>div{
  padding: 0 10px;
}

#menu .dropDown_menu .news_img_menu a div{
  height: 120px;
  border: 5px solid #fff;
}

#menu .dropDown_menu .news_img_menu a p{
  color: #000;
  font-size: 14px;
}

#menu .dropDown_menu .news_list_menu {
  padding: 12px 0;
}

#menu .dropDown_menu .news_list_menu a{
  display: block;
    color: #000;
    font-weight: 500;
    border-bottom: 1px solid #ccc;
}

#menu .dropDown_menu .news_list_menu a:hover{
  background: #172f87;
  color: #fff;
}

#menu .dropDown_menu .list_menu{
  padding: 10px 0;
}

#menu .dropDown_menu .list_menu h4{
     font-size: 20px;
     font-weight: 600;
     padding: 8px 0;
     border-bottom: 1px solid #ccc;
     color: #1d368c;
}

#menu .dropDown_menu .list_menu ul{
   list-style: none;
   padding: 0;
}

#menu .dropDown_menu .list_menu ul li a{
  display: block;
  font-weight: 500;
  color: #000;
  width: 100%;
  font-size: 16px;
}

#menu .dropDown_menu .list_menu ul li a:hover{
  background: #172f87;
  color: #fff;
}

.list_menu div .ul-2-part{ width: 48%; display: inline-block; vertical-align: top;}

/*--- 下拉選單 END ---*/

/*-- 登入會員 --*/
#member_div{ display: none; width: 350px;}
#member_div .mem_logo img{ width: 130px; }
#member_div b{ font-size: 22px; text-align: center; font-weight: 600; color: #172f8b; margin: 15px 0; display: block;}
#member_div .login_btn{ display: block; padding: 10px; text-align: center; background-color: #193296; color: #fff; width: 100%; border: 0; margin-bottom: 10px; cursor: pointer; }
#member_div .other_login_btn{ display: block; padding: 5px; text-align: center; background-color: #ccc; color: #fff; margin: 0 5px;}
#member_div .fb_color{ background-color: #3E569A; }
#member_div .google_color{ background-color: #DB4E44; }

        
 /*---------------Header------------------*/ 
        
        /*----------Index----------*/
        



/*區塊自定義--index*/
#index_head_left,#index_head_right{
    width: 100%; 
    float: left;
}

#index_head_left{
    max-width: 230px; 
    display: flex;
    justify-content: center;
    padding: 0px;
    padding-top: 10px;
}
#index_head_right{
    max-width: 850px; 
}

#index_head_right.news_detail_head{
    max-width: 870px;
}

.index-content-left, .index-content-right, .index-content-right-noMove{
    width: 100%;  
    float: left;
}


.index-content-left{
    max-width: 770px;

}

.index-content-left.detail_page{
    max-width: 800px;

}
.index-content-right, .index-content-right-noMove{
    width: 100%; 
    max-width: 320px;

}

/*孔洞*/
.hole::before{
    content: "";
    position: absolute;
    top: 11px;
    left: 11px;
    background: #e1e1e1;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: inset 1px 1px 2px 0px rgba(0, 0, 0, 0.55);
}

.swiper-button-next, .swiper-button-prev{
   outline: none;
}

/*區塊自定義--index end */

.news_slide .swiper-container{
    height: 100%;
}

.news_slide .swiper-slide{
   background-size: cover;
   background-position: center;
}

.news_slide .swiper-slide a{
    display: block;
    width: 100%;
    height: 100%;
}

.news_slide .swiper-button-prev i, .news_slide .swiper-button-next i{
   width: 35px;
   height: 35px;
   text-align: center;
   background-color: rgba(255, 255, 255, 0.5);
   color: #6a6a6a;
   line-height: 2.2rem;
   border-radius: 50px;
}

.news_slide .swiper-button-prev, .news_slide .swiper-container-rtl .swiper-button-next{
       height: 100%;
       width: 45px;
       left: -7%;
       top: 6%;
}

.news_slide .swiper-button-next, .news_slide .swiper-container-rtl .swiper-button-prev{
      height: 100%;
      width: 45px;
     right: -7%;
     top: 6%;
}

.news_slide .swiper-button-next.swiper-button-disabled, .news_slide .swiper-button-prev.swiper-button-disabled{
   opacity: 0.4;
}

.news_slide .swiper-container-horizontal>.swiper-pagination-bullets{
  bottom: 19%;
  text-align: left;
  padding: 0 1rem;
  z-index: 100;
}

.news_slide .swiper-pagination-bullet{
  width: 18px;
  height: 18px;
  background: #fff;
  opacity: .4;
}

.news_slide .swiper-pagination-bullet-active{
  background: #f39e1b;
  opacity: 0.9;
}

#iNews{
    height: 375px;
    overflow: hidden;
    position: relative;
}

#iNews .title{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 35px;
    line-height: 35px;
    background-image: url("/img/component/news_title_br.png");
    background-repeat: repeat-y;
    color: #fff;
    font-size: 20px;
    z-index: 99;
    padding: 0 0 0 30px;
}

#iNews .title a{
  color:#fff;
}


#iNews .word{
    position: absolute;
    width: 100%;
    height: 60px;
    line-height: 60px;
    top:315px;
    left:0;
    z-index: 69;
    background-color: rgba(0,0,0,0.40);
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    padding: 0 0 0 30px;   
    overflow: hidden; 
}


#iNews .pic{
    position: absolute;
    top:0;
    left:0;
    z-index: 49;
}


.iNewsR .swiper-container{
    height: 100%;
}

.iNewsR .swiper-button-next, .iNewsR .swiper-button-prev{
       width: 35px;
       height: 100%;
}

.iNewsR .swiper-button-next i, .iNewsR .swiper-button-prev i{
    background-color: rgba(255, 255, 255, 0.5);
    color: #6D6D6D;
    width: 30px;
    height: 30px;
    font-size: 30px;
    text-align: center;
    border-radius: 50px;
    line-height: 1.8rem;
}

.iNewsR .swiper-button-prev, .iNewsR .swiper-container-rtl .swiper-button-next{
       left: -12%;
       top: 11%;
}

.iNewsR .swiper-button-next, .iNewsR .swiper-container-rtl .swiper-button-prev{
     right: -12%;
     top: 11%;
}

.iNewsR .swiper-button-next.swiper-button-disabled, .iNewsR .swiper-button-prev.swiper-button-disabled{
   opacity: 0.4;
}

.iNewsR .swiper-container-horizontal>.swiper-pagination-bullets{
  bottom: 19%;
  text-align: left;
  padding: 0 1rem;
}

.iNewsR .swiper-pagination-bullet{
  width: 18px;
  height: 18px;
  background: #fff;
  opacity: .4;
}

.iNewsR .swiper-pagination-bullet-active{
  background: #f39e1b;
  opacity: 0.9;
}

.iNewsR,#iNewsR02{
    background-color: #333;
    height: 180px;
    overflow: hidden;
    position: relative;
}

.iNewsR .title,#iNewsR02 .title{
    position: absolute;
    top:0;
    left:0;
    width: 200px;
    height: 35px;
    line-height: 35px; 
    background-repeat: repeat-y;
    color: #fff;
    font-size: 20px;
    z-index: 99;
    padding: 0 0 0 30px;
}

.iNewsR .title a,#iNewsR02 .title a{
  color:#fff;
}
.iNewsR .word,#iNewsR02 .word{
    position: absolute;
    width: 100%;
    height: 40px;
    line-height: 40px;
    top:140px;
    left:0;
    z-index: 69;
    background-color: rgba(0,0,0,0.40);
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 0 0 0 30px;

    
    
}
.iNewsR .pic{
    position: relative;
    top:0;
    left:0;
    z-index: 49;
}


#iNewsR02{
    margin-top: -5px;
}
      

#iOil{
    display: flex;
    align-items: center;
    width: 1065px;
    height: 45px;
    margin: 10px auto;
    border-radius: 22.5px;
    background-image: url(/img/component/icon_oil.png);
    background-repeat: no-repeat;
    background-position: 0 7px;
    background-color: #fffcd3;
    overflow: hidden;
    position: relative;
    letter-spacing: 1px;
    font-size: 15px;
    
}

#iOil .row{ display: none; }
#iOil .row.show{ display: flex; width: 100%;}

/*#iOil div div{  font-size: 15px;}*/

#iOil div .title {
    display: inline-block;
    color: #fff;
    height: 26px;
    width:56px;
    margin: 0 15px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    border-radius: 13px;
    
}

#iOil div .blue_txt{
  color: #3a56ab;
}

#iOil div .green_txt{
  color: #126901;
}



#iCardRanking{
    display: block;
    width: 100%;
    overflow: hidden;
    
}


        /*----------Index end----------*/

/*--------------------- 廣告 -----------------------*/

.ad_news{max-width:365px; height: 150px; background-color:#fcfaee;margin:10px auto;}
.ad_news .best{text-align: right;}
.ad_news h6{color:#3f57b5; font-weight: 600;}
.ad_news p{font-size: 13px !important; line-height: 1.4 !important;}
.ad_news .about_txt{font-size: 13px;line-height: 1.5;}

.ad_card_div a{ width: 150px; height: 40px;}
.ad_card_div p{ font-size: 12px !important;}

.ad_rank .col-md-5{margin:auto 0;}

/*--------------------- 卡排行 -----------------------*/


/*== 字級 ==*/
.big_font_size{ font-size: 27px; }
.s_big_font_size{ font-size: 21px; }


/*== 選單 ==*/

.card_rank .swiper-container, .card_type .swiper-container{
    height: 90px;
    margin:0 1rem;
}

.card_rank .swiper_div, .card_type .swiper_div{
   background-color: #fcf4ff;
}


.card_rank .swiper-slide, .card_type .swiper-slide{
    display: flex;
    justify-content: center;
    align-items: center;
    border-color: #8c37cc;
    border-bottom: 0px solid #8c37cc;
    transition: 0.2s;
}


.card_rank .swiper-slide.active, .card_type .swiper-slide.active{
  border-bottom: 8px solid rgb(140, 55, 204);
}

.card_rank .swiper-slide.active a, .card_type .swiper-slide.active a{
   color: rgb(124, 49, 181);
}


.card_rank .swiper-slide div a, .card_type .swiper-slide div a{
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    color: #757275;
}

.card_rank .swiper-slide div a img {
  width: 60px;
}


.card_rank .swiper_div .swiper-button-next,.card_rank .swiper_div .swiper-button-prev, .card_type .swiper_div .swiper-button-next,.card_type .swiper_div .swiper-button-prev{
  height: 100%;

  top: 24%;
}

.ccard .swiper-button-next, .ccard .swiper-button-prev{
  height: 100%;
  top: 10%;
}


.card_rank .col-2{
   max-width: 19%;
    flex: 0 0 19%;
}

.card_rank .col-10{
   max-width: 81%;
    flex: 0 0 81%;
}

/* 固定卡排行圖示的寬度 */
.card_type .swiper-slide img {
  width: 57px;
}

.card_fun{
    padding-left: 0.5rem;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    background: rgb(140,55,204); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(140,55,204,1) 0%, rgba(196,147,237,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(140,55,204,1) 0%,rgba(196,147,237,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(140,55,204,1) 0%,rgba(196,147,237,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c37cc', endColorstr='#c493ed',GradientType=0 ); /* IE6-9 */
}


.rank_order{ color: #fff; text-decoration: underline;}
.rank_order:hover{ text-decoration: underline; position: relative;    color: #371551;}
.rank_order:hover:after{content: "▼"; position: relative; right: 0px;     color: #371551;}
.rank_order.active{ text-decoration: underline; position: relative;}
.rank_order.active:after{content: "▼"; position: relative; right: 0px;}


/*--------------------- 卡總覽 -----------------------*/

.card_all .card_fun{
 background: rgb(204,157,46);
    background: -moz-linear-gradient(top, rgba(204,157,46,1) 0%, rgba(229,184,78,1) 100%);
    background: -webkit-linear-gradient(top, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%);
    background: linear-gradient(to bottom, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc9d2e', endColorstr='#e5b84e',GradientType=0 );
}

.card_all .swiper-container{
    height: 90px;
    margin:0 1rem;
}

.card_all .swiper_div{
   background-color: #f9f2dd;
}

.card_all .swiper-slide{
    display: flex;
    justify-content: center;
    align-items: center;
    border-color: #8c37cc;
    border-bottom: 0px solid #8c37cc;
    transition: 0.2s;
}

.card_all .swiper-slide.active{
  border-bottom: 8px solid rgb(216, 169, 62);
}

.card_all .swiper-slide.active a{
   color: rgb(216, 169, 62);
}


.card_all .swiper-slide div a{
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    color: #757275;
}

.card_all .swiper_div .swiper-button-next,.card_all .swiper_div .swiper-button-prev{
  height: 100%;
  top: 24%;
}

.ccard .swiper-button-next, .ccard .swiper-button-prev{
  height: 100%;
  top: 10%;
}

.card_all .swiper-slide .active{

}

.card_all .swiper-slide .active div a{
    
}

.card_all .col-2{
   max-width: 19%;
    flex: 0 0 19%;
}

.card_all .col-10{
   max-width: 81%;
    flex: 0 0 81%;
}


.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
    opacity: 0;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    background-image: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #cacaca;
    right: 5px;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    background-image: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #cacaca;
    left: 5px;
}

/*== 信用卡 ==*/

.ccard{
    position: relative;
}

.ccard .swiper-container{
    height: 185px;
    margin: 0 2rem;
}

.ccard .swiper-slide div a{
  display: block;
  /*width: 100%;*/
  text-align: center;
  color: #000;
}

.ccard .top_Medal{
    font-family: 'Roboto', sans-serif;
    font-size: 23px;
    font-weight: 600;
    line-height: 2.5rem;
    position: absolute;
    top: 7px;
    left: 1px;
    width: 40px;
    height: 51px;
    text-align: center;
    background-image: url(/img/component/topNew_img.png);
    background-position: center;
    background-repeat: no-repeat;
    color: #601986;
}

.ccard .swiper-slide div a img{
    height: 126px;
}

/*--------------------- 人氣卡排行 --------------------*/
.ccard .cards-3 a{ width: 100%; text-align: center; }
.ccard .cards-3 a img{ height: 126px; margin-top: 1.2rem;}
.ccard .cards-3 a p{ font-weight: 600; font-size: 17px;}
.ccard .card_txt p{ font-weight: 500; font-size: 13px; color: #a8a8a8; }
.ccard .card_btn{ margin: 0.5rem; }
.ccard .card_btn button, .ccard .card_btn a{  padding: 3px 10px; font-size: 14px; margin: 0 10px; width: auto; }
.ccard .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff; } 
.ccard .card_btn .btn-gray{ background-color: #797979; color: #fff; } 



/*--------------------- 卡排行 END -----------------------*/





/*------------------ TABs ---------------------*/
.tab-content{ padding:22.5px 10px; }



.tab-content .more_bag{
 text-align: right;
 padding:5px;
  }
 
.tab-content .more_bag img{
 width:25px;
 height:25px;
 border-radius: 50%;
 padding:5px;
  }
 
.tab-content small{
  /*font-size: 16px;
  color:#fff;
  
  position: absolute;
  bottom:32px;*/
 padding:3px 10px;
}

.credit_icon {
  padding:0;
}
.credit_icon li{
  width:100px;
  display:inline-block;
  background-color: #ffffff;

}

.tab-content .credit_icon li a{
  color:#000000;
  display: block;
  text-align: center;
  font-size: 15px;
}

.tab-content .credit_icon img{
  display: block;
  margin:8px auto;
}



.tab-content .credit_card{
  width:200px;
  height:50px;
  background-color: #d4e4fb;
  font-size:20px;
  text-align: center;
  line-height: 50px;
  color:#343a40;
  margin:10px;
  border-radius: 5px;
  font-weight: bold;
}

.tab-content .cre_card{
  font-size:20px;
  font-weight: bold;
  margin: 0 10px;
}

.tab-content .deb_card{
  font-size:20px;
  font-weight: bold;
  margin: 0 10px;
}

.creditbg{
  box-shadow: 1px 4px 3px #ccc;
}



.tab-content .credit_card i{padding-left:5px;}

.tab-content .credit_boot th{
  text-align: center;
  background-color: #d4ad53;
  color:#fff;
  padding:5px 0;
  }

.tab-content .credit_boot td{
 /* word-break: keep-all;*/
  padding:10px;
  border: 1px solid #dcdcdc;
  }

.tab-content .credit_boot input{
  width:18px;
  height:18px;
}

.tab-content .online_list{
    padding-left:1rem;
 
}

.tab-content .online_list li{
    display: inline-block;
    list-style: none;
}

.tab-content .online_list li:hover{
    border: 1px solid;
    text-decoration:none;
    border-radius: 5px;
}

.tab-content .online_list .one a{
    background-color:#253d95;
}

.tab-content .online_list li a{
    /*
    width: 123px;
    height: 46px;
    font-size: 22px;
    line-height: 46px;
    background-color:#898989;
    display: inline-block;
    text-align: center;
    margin:8px 5px;
    border-radius: 5px;
    color:#ffffff;
    */
    width: 125px;
    height: 80px;
    font-size: 22px;
    line-height: 80px;
    display: inline-block;
    text-align: center;
    text-decoration: underline;
    margin:8px 5px;
}

.tab-content .online_list li a:hover{ 
    /*background-color:#253d95;*/
}

.bank_alllist_hide .arrow-bottom {
  	width: 0;
  	height: 0;
  	border-left: 8px solid transparent;  /* 左邊框的寬 */
  	border-right: 8px solid transparent; /* 右邊框的寬 */
  	border-top: 11px solid red; /* 下邊框的長度|高,以及背景色 */
  	font-size: 0;
  	line-height: 0;
  	display: inline-block;
}

.bank_alllist_hide .arrow-top {
  	width: 0;
  	height: 0;
  	border-left: 8px solid transparent;  /* 左邊框的寬 */
  	border-right: 8px solid transparent; /* 右邊框的寬 */
  	border-bottom: 11px solid red; /* 下邊框的長度|高,以及背景色 */
  	font-size: 0;
  	line-height: 0;
  	display: inline-block;
}

.bank_alllist_hide .arrow-bottom-m {
  	width: 0;
  	height: 0;
  	border-left: 4px solid transparent;  /* 左邊框的寬 */
  	border-right: 4px solid transparent; /* 右邊框的寬 */
  	border-top: 7px solid red; /* 下邊框的長度|高,以及背景色 */
  	font-size: 0;
  	line-height: 0;
  	display: inline-block;
}

.bank_alllist_hide .arrow-top-m {
  	width: 0;
  	height: 0;
  	border-left: 4px solid transparent;  /* 左邊框的寬 */
  	border-right: 4px solid transparent; /* 右邊框的寬 */
  	border-bottom: 7px solid red; /* 下邊框的長度|高,以及背景色 */
  	font-size: 0;
  	line-height: 0;
  	display: inline-block;
}


.nav-tabs{/* display: flex; justify-content: space-around;*/ }

.nav-tabs .nav-item{ margin-bottom: -1px; width: 50%; }

.nav-tabs .nav-item .top_link{ 
 width:50px;
 height:30px;
 display:inline-block;
 background-image: url(/img/component/icon/gray_icon.svg);
 background-size: 50%;
 background-repeat: no-repeat;
 background-position: center;
 position:absolute;
 right: 20px;
 top: 15px; 
 
}

.nav-tabs{
    overflow: hidden;
}

.nav-link{
   padding-top: .25rem ;
   padding-bottom: .25rem ;
}

.nav-tabs .nav-link.active{
  border-radius:20px 0 0 0;
}

.nav-tabs .nav-link.active:before{
  content: "";
  position: absolute;
  top: 11px;
  left: 11px;
  background: #e1e1e1;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  box-shadow: inset 1px 1px 2px 0px rgba(0, 0, 0, 0.55);
}

.nav-tabs .nav-item.show .nav-link,  .nav-tabs .nav-link.active{
    box-shadow: 4px 4px 7px -2px rgba(0, 0, 0, 0.5);
}

.nav-tabs .nav-link{
    position: relative; 
    border-radius: 0; 
    border: none; 
    font-weight: 600;
    font-size: 17px;
    padding-right: 0;
    display: flex;
    align-items: center;
}

/*----------------------------------------- pay版區 ------------------------------------------------*/
.pay-4{
  width:223px;
  background-color:#ffffff; 
  display:block;
  position: relative;
  bottom: 0px;
  transition: all 0.3s;
  box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}




.pay-4 h3{
  text-align: center;
  padding:5px 0;
  font-family: arial;
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 0px;
  font-size: 24px;
}

.pay-4 img{
  margin: 0 auto;
  display: block;
  border-bottom: 1px solid #dee2e6;
  padding:10px 0;
   
}


.pay-4 p{
  font-size:15px;
  padding: 3px 0;
}

.pay-4 a{
  display:block;
  height:100%;
  color:#757275;
  padding:20px;
}

.pay-4:hover{
  bottom: 10px;
}



/*----------------------------------------- pay版區end ------------------------------------------------*/
/*----------------------------------------- point版區 ------------------------------------------------*/
.point-4{
  width:100%;
  background-color:#ffffff; 
  display:block;
  position: relative;
  bottom: 0px;
  transition: all 0.3s;
  box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}




.point-4 h1{
  text-align: center;
  font-family: Microsoft JhengHei;
  font-weight: bold;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 0px;
  border-top: 1px solid;
  padding: 15px 0;
  width:70%;
}

.point-4 div{
  text-align: center;
  font-size:36px;
}




.point-4 p{
  font-size:15px;
  padding: 3px 0;
}

.point-4 a{
  display:block;
  height:100%;
  color:#757275;
  padding:40px;
}

.point-4:hover{
  bottom: 10px;
}


/*----------------------------------------- point版區 ------------------------------------------------*/

.search_from select,.search_from input{
  /*清除樣式*/
   appearance:none;
   -moz-appearance:none;
   -webkit-appearance:none; 

   position: relative;
     width: 100%;
     margin: 4px 0;
     border: none;
     padding: 7px;
     font-size: 15px;
     background-size: cover;
     background-position: center;
}


.search_from button{
    border: none;
    padding: 7px 15px;
    border-radius: 30px;
    cursor: pointer;
}

.tab_list{ 
  padding-left: 1.8rem; 
  margin: 0;
}
.tab_list li {   
   padding: 0.1rem 0;
}
.tab_list li a{
    font-size: 15px;
    color: #000;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/*------------------ TAB one (如熱門支付) ---------------------*/
.tab_one .title_tab{ 
 position: relative; 
 padding: 0.5rem 1rem 0.5rem 2rem;
 display: flex;
 align-items: center;
 color: #fff;
}

.tab_one .title_tab.tab_main{ 
 padding:12px 0 12px 60px;
}

.tab_one .title_tab span{
  position: absolute;
  right: 10px;
  font-size: 12px;
}


.tab_one .title_tab h4{ 
    margin:0; 
    font-size: 18px;
    font-weight: 600;  
}

.tab_one .title_tab .more_link{ 
 width:50px;
 height:30px;
 display:inline-block;
 background-image: url(/img/component/icon/more_icon.svg);
 background-size: 50%;
 background-repeat: no-repeat;
 background-position: center;
 position:absolute;
 right:0;
 

}


.tab_one .content_tab{
   padding:16.3px 10px;
}



.tab_one .content_tab .active_date{
    margin: 0;
    color: #fd9b1d;
    font-weight: 600;
}


/*------------------------- 熱門辦卡 -----------------------------*/
.hotCard .content_tab h4{
   font-size: 15px;
   font-weight: 600;
   color: #3f57b5;
}

.hotCard .content_tab .img_a{ 
  display: block; 
  height: 80px;
  width:120px;
}

.hotCard .content_tab .img_b{ 
  display: block; 
  height: 200px;
  width:300px;
  margin:0 auto;
  
 
}


.hotCard .content_tab .travel_main h6{ 
  margin:5px 0;
}
 




 
 
.hotCard .content_tab .img_c{ 
  display: block; 
  height: 100px;
  width:150px;
  margin:0 auto;
}

.hotCard .content_tab .row span{
  font-size: 12px;
  display: block;
  text-align: center;
}

.hotCard .content_tab .row{
   padding: 8px 0;
}

.hotCard .content_tab .row .col-7{
    padding: 0px 8px;
}

.hotCard .content_tab p{
  font-size: 13px;
  margin: 0;
}


.hotCard.ad .img_div{
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
}

.hotCard.ad p{ font-size: 12px; line-height: 1.2; }


.journey_icon a{
  color:#549c58;
  font-weight: bold;
  margin:0 auto;
}

.journey_icon hr{
 margin:0;
}




/*----------------------- 百葉窗 Tab (新卡訊) ---------------------------*/
#new_card .card{
    border:none;
}
#new_card .card-header{
    padding: 0rem 1rem;
    border-bottom: 1px solid #fff;
    background-color: #d9ab3e;
}

#new_card .card-header + .collapse.show {
  /*height: 260px;*/
}

#new_card .card-header h5 button{
    color: #fff;
    padding: 5.1px 12px;
}

#new_card .card_one a{
  display: block;
  text-align: center;
  width: 100%;
  color: #ad862a;
  font-weight: 600;
  line-height: 2;
}

#new_card .card-body{
  position: relative;
  padding: 19px;
  padding-bottom: 10px;
}

#new_card .card_one a img{
    width: 200px;
}

#new_card .card_info{
   margin: 0;
   font-size: 14px;
}

#new_card .card_info li{
    font-size: 14px;
    line-height: 1.3;
}

#new_card .card_more{
     position: absolute;
      right: 1rem;
      bottom: 1rem;
      font-size: 12px;
      padding: 0 5px;
      background-color: #d8ab3f;
      color: #fff;
      border-radius: 3px;
}

#new_card .icon-collapse, #faq-accordion .icon-collapse, #menu_list .fa-angle-down {
  transition: 0.2s transform;
}

#faq-accordion .card-body {
  line-height: 1.8;
}

/* 第一個icon初始先改成展開狀態 */
#new_card #heading1 .icon-collapse {
  transform: rotate(180deg);
}

.icon_top{ width: 30px; }
.store_icon_top{ height: 40px; margin-right: 5px; }
.store_pay_title span{ font-size: 25px; font-weight: 600; color: #a45a3a; }

/*----------------------------- 銀行總攬 ----------------------------------*/
.more_stop_card{ border-top: 1px solid #dee2e6;}
.more_stop_card h4{ margin: 0; font-weight: 600;}

/*--------------------------------- 卡情報 單卡 ----------------------------------*/
/* .ccard_img{ height: 190px; } */
.oneCard_org img{ filter: grayscale(1); opacity: 0.6; }
.oneCard_org.active img{ filter: grayscale(0); opacity: 1; }
.oneCard_org.active{ padding-bottom: 40px; }
.oneCard_org.active .oneCard_level{ display: block; padding:0; position: absolute; width: 400px; }
.oneCard_org .oneCard_level{display: none;}
.oneCard_org .oneCard_level li.active a{ color: #e59118; }
.pref_icon li a img, .eq_icon{ width: 30px; }
.cc_fun { width: 370px; }
.debit_card .card_btn .btn-block{ width: auto; }
/*--------------------------------- 卡情報 單卡 END ----------------------------------*/

/*----------------------- big Tab (如卡情報) ---------------------------*/

.big_tab .tab_menu .menu{
    padding: 0 0.5rem;
}

.big_tab .tab_menu .menu a{
   display: inline-block;
   position: relative;
   font-weight: 600;
   color: #555;
   padding: 10px 5px;
   transition: 0.2s;
}


.big_tab .tab_menu .menu a:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 0px;
    transition: 0.2s;
}

.big_tab .tab_menu .menu a:hover:before{
    height: 5px;
}

.big_tab .tab_menu .menu a.ms_enter:before{
    height: 5px;
}

.big_tab .title_tab{
    position: relative;
    padding: 0.7rem 0rem 0.7rem 0rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.big_tab .title_tab h4 {
    margin:0;
    font-size: 18px;
    font-weight: 600;
}


.big_tab .content_tab{
   padding: 30px 10px;
   min-height:242px; 
}

.tab_list_div .content_tab .news_list_div{
  display: none;
}

.tab_list_div .content_tab .news_list_div.show{
  display: flex;
}

.cards-2 a{
    display: block;
    color: #555;
    font-size: 15px;
    padding: 0 11px;
}

 .cards-2 .img_div{
    width:343px;
    height: 225px;
} 

 .cards-2 p{
    margin:0;
    margin-top: 5px;
    text-align: center;
    position: absolute;
    bottom: 0px;
    width: 343px;
    color: #fff;
    background-color: rgba(0,0,0,0.4);
    line-height: 2;
}

 .cards-3 a{
    display: block;
    color: #555;
    font-size: 15px;
    
}

.cards-3 .img_div{
   position: relative;
    width:225px;
    height: 150px;
    margin:auto;
} 

 .cards-3 p{
    margin:0;
    text-align: center;
    padding:5px 0;
}

.change_law h5{
  font-size: 20px;
  font-weight: 600;
  color: #3148a3;
  display: inline-block;
 }
.change_law span{
  color: #9c9c9c;
  font-size: 16px;
}

.change_law a{
   color: #000000;
   display: block;
}

.change_law i{
   color: #32b16c;
   font-size: 18px;
   padding: 5px;
}

.change_law hr{
  width:90%;
  margin: 10px 0;
}

.ticket_card .cards-4 .ticket_img{
    margin:0 5px;
    text-align: center;
    position: relative;
    bottom: 0px;
    transition: all 0.3s;
    box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}

.ticket_card .cards-4 .ticket_img h4{
    font-weight: bold;
    color:#263d95;
    font-size: 16px;
}

.ticket_card .cards-4 .ticket_img:hover{bottom: 10px;}

.ticket_card .cards-4 .ticket_img img{
     margin:10px 0;
}


 .cards-4 p{
    margin:0;
    text-align: center;
    padding:5px 0;
}


.cards-two .new_article, .cards-3 .new_article{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 !important; z-index: 1;}
.cards-two .small_a, .cards-3 .small_a{ font-size: 20px; color: #fff; position: absolute; bottom: 0px; left: 0; padding: 0; z-index: 2;}
.cards-two .small_a:hover, .cards-3 .small_a:hover{ color: #fff; }


.cards-two .img_div{
    position: relative;
    height: 245px;
    margin: 0 10px;
} 

.cards-two p{
    margin:0;
    text-align: center;
    padding:5px 0;
}

 .cards-two a{
    display: block;
    color: #555;
    font-size: 15px;
    padding: 0 10px;
}
/*--------------------------------- 集點店家----------------------------------*/
.shop_img img{
  width:225px;
}
/*--------------------------------- 優旅行----------------------------------*/
 
.travel_text h6{
 text-align: center;
 font-weight: bold;
 color:#549c58;
 margin: 0 auto;
}

.travel_text p{
  font-size: 14px;
  color:#000;
}
.travel_text hr{
  width: 95%;
  text-align: center;
  margin: 16px auto;
}

.travel_main{
  background-color: #ffffff;
  border-radius: 5px;
  overflow: hidden;
  width:360px;
  margin: auto;
  box-shadow: 0px 0px 12px 1px rgba(71,71,72,0.1);

}

.travel_main h6{
 font-weight: bold;
 color:#549c58;
 margin-top: 8px;
 font-size: 17px;
 padding:0 10px;
}

.travel_main p{
 color:#000000;
 display: block;
 font-size: 15px;
 padding:0 10px;
}


.travel_main .img_div {
    margin: auto;
    width:360px;
    height: 240px;
}

.travel_about{
  margin: 0 auto;
}

.travel_about h6{
 font-weight: bold;
 color:#549c58;
 font-size: 17px;
 margin-top: 8px;
 padding:0 10px;
}

.travel_about p{
 font-size: 15px;
 margin-top: 8px;
 padding: 0 10px;
 color:#000000;
}

.travel_about .img_div{
  width:343px;
  height: 225px;
  margin: auto;
}

.travel_about span a{
  color: #fff;
  background-color: #afafaf;
  border-radius: 8px;
  padding: 2px 5px;
  margin: 0px 2px;
}


.travel_share h6{
 font-weight: bold;
 color:#3f57b5;
 margin-top:10px;
 text-align: center;
}

.travel_share p{
 margin: 0;
 padding: 5px 0;
 text-align: left;
}

.japan_list{
 bottom: 0px;
 transition: all 0.3s;
 position: relative;
 box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}

.japan_list .img_div{
 height:210px;
 border-radius: 20px 0 0 0;
 margin:auto;
 

}

.japan_list big{
 position:absolute;
 top:10px;
 right:45px;
 color:#ffffff;
 font-size: 30px;
 text-shadow: 0px 4px 3px rgba(0,0,0,0.4);
}

.japan_list a{
 color:#107816;
 font-size: 15px;
 font-weight: bold;

}

.japan_list span img{
 width:15px;
 height:16px;
}

.japan_list:hover{
 bottom: 10px;
}

 
.travel_list{
  padding-left:62px;
}

.travel_list h6{
 font-weight: bold;
 color:#549c58;
 margin-top:10px;
}

.travel_list p{
 margin: 0;
 padding: 5px 0;
 text-align: left;
}

/*------- 東京 ------*/

.map .UENO {
  position: absolute;
    right: 265px;
    top: 150px;
}

.map .UENO-01 {
  position: absolute;
    right: -179px;
    top: -72px;
    display: none;
    z-index: 1;
}

.map .AKIBA {
  position: absolute;
    right: 265px;
    top: 206px;
}

.map .AKIBA-01 {
  position: absolute;
    right: -180px;
    top: -67px;
    display: none;
    z-index: 1;
}

.map .TOKYO {
  position: absolute;
    right: 270px;
    top: 259px;
}

.map .TOKYO-01 {
  position: absolute;
    right: -184px;
    top: -77px;
    display: none;
    z-index: 1;
}

.map .ASAKUSA {
  position: absolute;
    right: 170px;
    top: 156px;
}

.map .ASAKUSA-01 {
  position: absolute;
    right: -80px;
    top: 43px;
    display: none;
    z-index: 1;
}

.map .NIA {
  position: absolute;
    right: 91px;
    top: 192px;
}
.map .GINZAA {
  position: absolute;
    right: 234px;
    top: 288px;
}

.map .GINZAA-01 {
  position: absolute;
    right: -126px;
    top: -115px;
    display: none;
    z-index: 1;
}

.map .TSUKIJI {
  position: absolute;
    right: 243px;
    top: 324px;
}

.map .TSUKIJI-01 {
  position: absolute;
    right: 54px;
    top: -12px;
    display: none;
    z-index: 1;
}

.map .SHINAGAWA {
  position: absolute;
    right: 365px;
    top: 337px;
}

.map .SHINAGAWA-01 {
  position: absolute;
    right: 50px;
    top: -11px;
    display: none;
    z-index: 1;
}

.map .KEIKYU {
  position: absolute;
    right: 312px;
    top: 438px;
}
.map .DAIKANYAMA {
  position: absolute;
    right: 543px;
    top: 314px;
}

.map .DAIKANYAMA-01 {
  position: absolute;
    right: -180px;
    top: 29px;
    display: none;
    z-index: 1;
}

.map .TSUNAGU {
  position: absolute;
    right: 498px;
    top: 290px;
}

.map .TSUNAGU-01 {
  position: absolute;
    right: 8px;
    top: -113px;
    display: none;
    z-index: 1;

}

.map .ODAIBA {
  position: absolute;
    right: 218px;
    top: 398px;
}

.map .ODAIBA-01 {
  position: absolute;
    right: -136px;
    top: -114px;
    display: none;
    z-index: 1;
}


.map .ROPPONGI {
  position: absolute;
    right: 448px;
    top: 284px;
}

.map .ROPPONGI-01 {
  position: absolute;
    right: 8px;
    top: 48px;
    display: none;
    z-index: 1;
}

.map .HARAJUKU {
  position: absolute;
    right: 499px;
    top: 238px;
}

.map .HARAJUKU-01 {
  position: absolute;
    right: -64px;
    top: -113px;
    display: none;
    z-index: 1;

}

.map .SHINJUKU {
  position: absolute;
    right: 498px;
    top: 178px;
}

.map .SHINJUKU-01 {
  position: absolute;
    right: 8px;
    top: -111px;
    display: none;
    z-index: 1;
}

.map .KICHIJOJI {
  position: absolute;
    right: 576px;
    top: 189px;
}

.map .KICHIJOJI-01 {
  position: absolute;
    right: -178px;
    top: -34px;
    display: none;
    z-index: 1;
}

.map .IKEBUKURO {
  position: absolute;
    right: 482px;
    top: 117px;
}

.map .IKEBUKURO-01 {
  position: absolute;
    right: -65px;
    top: 49px;
    display: none;
    z-index: 1;
}

/*------- 關西 ------*/
.map .Lanshan {
  position: absolute;
    right: 395px;
    top: 98px;
}

.map .Lanshan-01 {
  position: absolute;
    right: -8px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .GPT{
  position: absolute;
    right: 295px;
    top: 80px;
}

.map .GPT-01{
  position: absolute;
    right: -124px;
    top: 29px;
    z-index: 1;
    display: none;
}

.map .Heian{
  position: absolute;
    right: 227px;
    top: 106px;
}

.map .Heian-01{
  position: absolute;
    right: -133px;
    top: 25px;
    z-index: 1;
    display: none;
}

.map .Gion{
  position: absolute;
    right: 234px;
    top: 130px;
}

.map .Gion-01{
  position: absolute;
    right: -110px;
    top: 28px;
    z-index: 1;
    display: none;
}

.map .Shijo{
  position: absolute;
    right: 337px;
    top: 130px;
}

.map .Shijo-01{
  position: absolute;
    right: -52px;
    top: 29px;
    z-index: 1;
    display: none;
}

.map .Kiyomizu{
  position: absolute;
    right: 197px;
    top: 176px;
}

.map .Kiyomizu-01{
  position: absolute;
    right: -95px;
    top: 28px;
    z-index: 1;
    display: none;
}

.map .Fushimi{
  position: absolute;
    right: 160px;
    top: 205px;
}

.map .Fushimi-01{
  position: absolute;
    right: -55px;
    top: 34px;
    z-index: 1;
    display: none;
}

.map .Todaiji{
  position: absolute;
    right: 191px;
    top: 265px;
}

.map .Todaiji-01{
  position: absolute;
    right: -80px;
    top: 34px;
    z-index: 1;
    display: none;
}

.map .Shinsaibashi{
  position: absolute;
    right: 327px;
    top: 319px;
}

.map .Shinsaibashi-01{
  position: absolute;
    right: -117px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .Osaka{
  position: absolute;
    right: 313px;
    top: 289px;
}

.map .Osaka-01{
  position: absolute;
    right: -97px;
    top: 33px;
    z-index: 1;
    display: none;
}

.map .USJ{
  position: absolute;
    right: 456px;
    top: 342px;
}

.map .USJ-01{
  position: absolute;
    right: -181px;
    top: -6px;
    z-index: 1;
    display: none;
}

.map .POK{
  position: absolute;
    right: 466px;
    top: 232px;
}

.map .POK-01{
  position: absolute;
    right: -181px;
    top: -66px;
    z-index: 1;
    display: none;
}

.map .ASHK{
  position: absolute;
    right: 468px;
    top: 154px;
}

.map .ASHK-01{
  position: absolute;
    right: -180px;
    top: -66px;
    z-index: 1;
    display: none;
}

.map .Kobe{
  position: absolute;
    right: 520px;
    top: 198px;
}

.map .Kobe-01{
  position: absolute;
    right: -181px;
    top: -93px;
    z-index: 1;
    display: none;
}

.map .Himeji{
  position: absolute;
    right: 609px;
    top: 210px;
}

.map .Himeji-01{
  position: absolute;
    right: -115px;
    top: 50px;
    z-index: 1;
    display: none;
}

/*------- 北海道 ------*/

.map .Abashiri{
  position: absolute;
    right: 234px;
    top: 167px;
}

.map .Abashiri-01{
  position: absolute;
    right: 55px;
    top: -80px;
    z-index: 1;
    display: none;
}

.map .Kitami{
  position: absolute;
    right: 237px;
    top: 208px;
}

.map .Kitami-01{
  position: absolute;
    right: -142px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .Sounkyo{
  position: absolute;
    right: 282px;
    top: 234px;
}

.map .Sounkyo-01{
  position: absolute;
    right: 55px;
    top: -123px;
    z-index: 1;
    display: none;
}

.map .Shikisai{
  position: absolute;
    right: 285px;
    top: 262px;
}

.map .Shikisai-01{
  position: absolute;
    right: 78px;
    top: -140px;
    z-index: 1;
    display: none;
}

.map .Akan{
  position: absolute;
    right: 222px;
    top: 265px;
}

.map .Akan-01{
  position: absolute;
    right: -115px;
    top: 50px;
    z-index: 1;
    display: none;
}

.map .Kushiro{
  position: absolute;
    right: 162px;
    top: 280px;
}

.map .Kushiro-01{
  position: absolute;
    right: -66px;
    top: 29px;
    z-index: 1;
    display: none;
}

.map .Church{
  position: absolute;
    right: 290px;
    top: 298px;
}

.map .Church-01{
  position: absolute;
    right: -115px;
    top: 50px;
    z-index: 1;
    display: none;
}

.map .tokachi{
  position: absolute;
    right: 213px;
    top: 332px;
}

.map .tokachi-01{
  position: absolute;
    right: -80px;
    top: 26px;
    z-index: 1;
    display: none;
}

.map .Farm{
  position: absolute;
    right: 374px;
    top: 271px;
}

.map .Farm-01{
  position: absolute;
    right: 7px;
    top: -154px;
    z-index: 1;
    display: none;
}

.map .Noboribetsu{
  position: absolute;
    right: 379px;
    top: 346px;
}

.map .Noboribetsu-01{
  position: absolute;
    right: -181px;
    top: -16px;
    z-index: 1;
    display: none;
}

.map .Otaru{
  position: absolute;
    right: 500px;
    top: 266px;
}

.map .Otaru-01{
  position: absolute;
    right: -8px;
    top: -121px;
    z-index: 1;
    display: none;
}

.map .Hokkaido{
  position: absolute;
    right: 480px;
    top: 303px;
}

.map .Hokkaido-01{
  position: absolute;
    right: 14px;
    top: -121px;
    z-index: 1;
    display: none;
}

.map .Lake{
  position: absolute;
    right: 536px;
    top: 342px;
}

.map .Lake-01{
  position: absolute;
    right: -42px;
    top: -120px;
    z-index: 1;
    display: none;
}

.map .Bear{
  position: absolute;
    right: 495px;
    top: 373px;
}

.map .Bear-01{
  position: absolute;
    right: -182px;
    top: -30px;
    z-index: 1;
    display: none;
}

.map .Hakodate{
  position: absolute;
    right: 510px;
    top: 413px;
}

.map .Hakodate-01{
  position: absolute;
    right: -183px;
    top: -64px;
    z-index: 1;
    display: none;
}

.map .NCA{
  position: absolute;
    right: 463px;
    top: 333px;
}

.map .HA{
  position: absolute;
    right: 435px;
    top: 440px;
}

.map .AA{
  position: absolute;
    right: 350px;
    top: 240px;
}

/*------- 東北 ------*/

.map .Hirosaki{
  position: absolute;
    right: 280px;
    top: 124px;
}

.map .Hirosaki-01{
  position: absolute;
    right: 70px;
    top: -42px;
    z-index: 1;
    display: none;
}

.map .Lake{
  position: absolute;
    right: 216px;
    top: 130px;
}

.map .Lake-01{
  position: absolute;
    right: -124px;
    top: 35px;
    z-index: 1;
    display: none;
}

.map .Aomori{
  position: absolute;
    right: 168px;
    top: 157px;
}

.map .Aomori-01{
  position: absolute;
    right: -75px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .Tazawa{
  position: absolute;
    right: 291px;
    top: 186px;
}

.map .Tazawa-01{
  position: absolute;
    right: 67px;
    top: -93px;
    z-index: 1;
    display: none;
}

.map .Kakunodate{
  position: absolute;
    right: 271px;
    top: 211px;
}

.map .Kakunodate-01{
  position: absolute;
    right: -179px;
    top: -20px;
    z-index: 1;
    display: none;
}

.map .Longquan{
  position: absolute;
    right: 153px;
    top: 250px;
}

.map .Longquan-01{
  position: absolute;
    right: -62px;
    top: 29px;
    z-index: 1;
    display: none;
}

.map .Matsushima{
  position: absolute;
    right: 220px;
    top: 312px;
}

.map .Matsushima-01{
  position: absolute;
    right: -115px;
    top: 32px;
    z-index: 1;
    display: none;
}

.map .Kisuke{
  position: absolute;
    right: 227px;
    top: 336px;
}

.map .Kisuke-01{
  position: absolute;
    right: -135px;
    top: -120px;
    z-index: 1;
    display: none;
}

.map .Chusonji{
  position: absolute;
    right: 285px;
    top: 308px;
}

.map .Chusonji-01{
  position: absolute;
    right: -135px;
    top: -120px;
    z-index: 1;
    display: none;
}

.map .Sendai{
  position: absolute;
    right: 374px;
    top: 337px;
}

.map .Sendai-01{
  position: absolute;
    right: -181px;
    top: -16px;
    z-index: 1;
    display: none;
}

.map .Tendo{
  position: absolute;
    right: 440px;
    top: 324px;
}

.map .Tendo-01{
  position: absolute;
    right: -8px;
    top: -121px;
    z-index: 1;
    display: none;
}

.map .Temple{
  position: absolute;
    right: 448px;
    top: 348px;
}

.map .Temple-01{
  position: absolute;
    right: 14px;
    top: -146px;
    z-index: 1;
    display: none;
}

.map .Inawashiro{
  position: absolute;
    right: 426px;
    top: 379px;
}

.map .Inawashiro-01{
  position: absolute;
    right: -182px;
    top: -32px;
    z-index: 1;
    display: none;
}

.map .Aizuwakamatsu{
  position: absolute;
    right: 482px;
    top: 396px;
}

.map .Aizuwakamatsu-01{
  position: absolute;
    right: 16px;
    top: -119px;
    z-index: 1;
    display: none;
}

.map .BAO{
  position: absolute;
    right: 343px;
    top: 413px;
}

.map .BAO-01{
  position: absolute;
    right: -183px;
    top: -64px;
    z-index: 1;
    display: none;
}

/*------- 九州 ------*/

.map .MOJIKO{
  position: absolute;
    right: 295px;
    top: 78px;
}

.map .MOJIKO-01{
  position: absolute;
    right: -181px;
    top: 5px;
    z-index: 1;
    display: none;
}

.map .DAZAIFU{
  position: absolute;
    right: 305px;
    top: 125px;
}

.map .DAZAIFU-01{
  position: absolute;
    right: -180px;
    top: -18px;
    z-index: 1;
    display: none;
}

.map .YUFUIN{
  position: absolute;
    right: 320px;
    top: 167px;
}

.map .YUFUIN-01{
  position: absolute;
    right: -216px;
    top: -36px;
    z-index: 1;
    display: none;
}

.map .BAPPU{
  position: absolute;
    right: 213px;
    top: 155px;
}

.map .BAPPU-01{
  position: absolute;
    right: -117px;
    top: 36px;
    z-index: 1;
    display: none;
}

.map .FA{
  position: absolute;
    right: 436px;
    top: 88px;
}

.map .GINZA{
  position: absolute;
    right: 271px;
    top: 211px;
}

.map .GINZA-01{
  position: absolute;
    right: -179px;
    top: -20px;
    z-index: 1;
    display: none;
}

.map .ASO{
  position: absolute;
    right: 271px;
    top: 241px;
}

.map .ASO-01{
  position: absolute;
    right: -177px;
    top: -54px;
    z-index: 1;
    display: none;
}

.map .KUMAMOTO{
  position: absolute;
    right: 350px;
    top: 207px;
}

.map .KUMAMOTO-01{
  position: absolute;
    right: -252px;
    top: -102px;
    z-index: 1;
    display: none;
}

.map .KUMAMOTOOFFICE{
  position: absolute;
    right: 370px;
    top: 248px;
}

.map .KUMAMOTOOFFICE-01{
  position: absolute;
    right: -135px;
    top: -120px;
    z-index: 1;
    display: none;
}

.map .SAKURAJIMA{
  position: absolute;
    right: 340px;
    top: 378px;
}

.map .SAKURAJIMA-01{
  position: absolute;
    right: -186px;
    top: -136px;
    z-index: 1;
    display: none;
}

.map .MANAGAHA{
  position: absolute;
    right: 514px;
    top: 270px;
}

.map .MANAGAHA-01{
  position: absolute;
    right: -20px;
    top: -125px;
    z-index: 1;
    display: none;
}

.map .KIRISHIMA{
  position: absolute;
    right: 345px;
    top: 324px;
}

.map .KIRISHIMA-01{
  position: absolute;
    right: -188px;
    top: -51px;
    z-index: 1;
    display: none;
}

.map .RICESAYAMA{
  position: absolute;
    right: 488px;
    top: 242px;
}

.map .RICESAYAMA-01{
  position: absolute;
    right: 6px;
    top: -119px;
    z-index: 1;
    display: none;
}

.map .ATOMICBOMB{
  position: absolute;
    right: 482px;
    top: 216px;
}

.map .ATOMICBOMB-01{
  position: absolute;
    right: -182px;
    top: -32px;
    z-index: 1;
    display: none;
}

.map .HUIS{
  position: absolute;
    right: 482px;
    top: 181px;
}

.map .HUIS-01{
  position: absolute;
    right: 16px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .HAKATA{
  position: absolute;
    right: 408px;
    top: 123px;
}

.map .HAKATA-01{
  position: absolute;
    right: 93px;
    top: -39px;
    z-index: 1;
    display: none;
}

/*------- 沖 ------*/

.map .CA{
  position: absolute;
    right: 382px;
    top: 77px;
}

.map .CA-01{
  position: absolute;
    right: 89px;
    top: 2px;
    z-index: 1;
    display: none;
}

.map .Nakijin{
  position: absolute;
    right: 348px;
    top: 100px;
}

.map .Nakijin-01{
  position: absolute;
    right: -142px;
    top: 30px;
    z-index: 1;
    display: none;
}

.map .AUI{
  position: absolute;
    right: 236px;
    top: 75px;
}

.map .AUI-01{
  position: absolute;
    right: -113px;
    top: 33px;
    z-index: 1;
    display: none;
}

.map .Sea{
  position: absolute;
    right: 353px;
    top: 175px;
}

.map .Sea-01{
  position: absolute;
    right: 78px;
    top: -64px;
    z-index: 1;
    display: none;
}

.map .Manzamoo{
  position: absolute;
    right: 398px;
    top: 205px;
}

.map .Manzamoo-01{
  position: absolute;
    right: 72px;
    top: -93px;
    z-index: 1;
    display: none;
}

.map .Pink-Mermaid{
  position: absolute;
    right: 445px;
    top: 238px;
}

.map .Pink-Mermaid-01{
  position: absolute;
    right: -251px;
    top: 34px;
    z-index: 1;
    display: none;
}

.map .Ryukyu{
  position: absolute;
    right: 370px;
    top: 251px;
}

.map .Ryukyu-01{
  position: absolute;
    right: -188px;
    top: -15px;
    z-index: 1;
    display: none;
}

.map .Residual{
  position: absolute;
    right: 469px;
    top: 266px;
}

.map .Residual-01{
  position: absolute;
    right: 22px;
    top: -123px;
    z-index: 1;
    display: none;
}

.map .Katsuren{
  position: absolute;
    right: 310px;
    top: 310px;
}

.map .Katsuren-01{
  position: absolute;
    right:-180px;
    top: -13px;
    z-index: 1;
    display: none;
}

.map .American{
  position: absolute;
    right: 442px;
    top: 316px;
}

.map .American-01{
  position: absolute;
    right: -181px;
    top: -16px;
    z-index: 1;
    display: none;
}

.map .urasoe-park{
  position: absolute;
    right: 438px;
    top: 343px;
}

.map .urasoe-park-01{
  position: absolute;
    right: -187px;
    top: -1px;
    z-index: 1;
    display: none;
}

.map .Naminoue{
  position: absolute;
    right: 489px;
    top: 370px;
}

.map .Naminoue-01{
  position: absolute;
    right: 14px;
    top: -121px;
    z-index: 1;
    display: none;
}

.map .Shuri{
  position: absolute;
    right: 392px;
    top: 377px;
}

.map .Shuri-01{
  position: absolute;
    right: -181px;
    top: -33px;
    z-index: 1;
    display: none;
}

.map .Kokusai{
  position: absolute;
    right: 411px;
    top: 401px;
}

.map .Kokusai-01{
  position: absolute;
    right: -205px;
    top: -56px;
    z-index: 1;
    display: none;
}

.map .Yuquan{
  position: absolute;
    right: 396px;
    top: 429px;
}

.map .Yuquan-01{
  position: absolute;
    right: -183px;
    top: -86px;
    z-index: 1;
    display: none;
}


/*-- 旅遊景點存放 fancybox --*/
.fancybox-div{ display: none; }
.view_title{color: #549c58;}



/*------- 飛往資訊 ------*/

.sky_info {padding:0;}

.sky_info li{
  width:180px;
  height:50px;
  background-color: #797979;
  color:#fff;
  display: inline-block;
  margin:10px;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
}

.sky_info li a{color:#fff;}

.sky_text{
  font-weight: bold;
  color:#549c58;
}




/*--------------------------------- 優旅行end--------------------------------------------------*/


/*--------------------------------- NEWS 4塊 tab (如特別議題) ----------------------------------*/
.nav-tabs .nav-item.news_tab{ width: 25%; background-color: #fff !important;}
.nav-tabs .nav-item.news_tab .nav-link{ justify-content: center; padding-left:0; }
.nav-tabs .nav-item.news_tab .nav-link.active { border-radius: 20px 0 0 0; }
.nav-tabs .nav-item.news_tab .nav-link.active:before{   
    content: "";
    position: absolute;
    top: 11px;
    left: 11px;
    background: #e1e1e1;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: inset 1px 1px 2px 0px rgba(0, 0, 0, 0.55); 
}

/*--------------------------------- CARD 2塊 tab (如開卡文) ----------------------------------*/
.nav-tabs .nav-item.news_tab.news_tab_two {width:50% !important;}

/*--------------------------------- CARD 3塊 tab (如開卡文) ----------------------------------*/
.nav-tabs .nav-item.news_tab.news_tab_three{ width: 33.33%; background-color: #fff !important;}
/*------------------------------- NEWS 次版 TAB -----------------------------------------*/
.news_list{ border-bottom: 1px solid #ccd0d5; }
.news_list.interests{ min-height: 180px; }
.news_list:last-child{ border-bottom:none; }
.news_list_img{ display: block; height: 150px; width:225px; margin: auto;}
.news_list_txt h3{  font-size: 22px; font-weight: 600;  color: #3148a3;  display: inline-block;}
.news_list_txt h3 a{ color: #3148a3; }
.news_list_txt span{display: inline-block;}
.news_list_txt a{color:#000000;}
.news_list_txt .date{display: block;}
.news_list_txt small{ color: #9c9c9c; font-size: 15px; }
.news_list_txt small a {color: #9c9c9c; font-size: 16px;}
.news_list_txt .cs_small{ display: initial; margin-bottom: 0; color: #9c9c9c; font-size: 22px;}
.news_list_txt .cs_small a{ font-size: 22px; color: #8b8b8b; }
.news_list_txt .fb_search_btn{ width: 100%; position: absolute; bottom: 10px; right: 0; height: 20px;}
.news_list_txt .fb_search_btn iframe{ float: right; width: 110px;}
 .page{  text-align: center; padding: 1.5rem 0; color: #2c439d;}
 .page a{ padding: 0 10px; color: #2c439d; }
 .page select{ width: 80px;  padding: 5px 0px 5px 10px; border-radius: 4px; border: 1px solid #2c439d; background-color: #fff;}



/*------------------------------- NEWS 內頁 TAB -----------------------------------------*/
.detail_title .fb_search_btn{ height: 20px; }
.detail_title h2, .detail_title h1{  font-size: 26px; font-weight: 600; color: #263d95; display:inline-block; margin: 0;}
.detail_title .h4_style{    font-size: 20px;  font-weight: 500;  color: #000;}
.detail_title i{ padding-right: 5px;}
.detail_title h4{  font-size: 20px; }
.detail_title p{ display: inline-block; line-height: 25px; }
.detail_title .card_btn .btn-orange{ background-color: #253d95; color: #fff; } 
.detail_title .card_btn .btn-gray{ background-color: #797979; color: #fff; } 
.detail_title .card_btn button {
    font-size: 16px;
    margin: 10px;
    
  }
.newcard_g{
  padding:10px;
  border: 2px #ce9f30 solid;
  border-radius: 5px;
}

.prizecard_g{
    padding: 10px;
    position: relative;
    bottom: 0px;
    transition: all 0.3s;
    box-shadow: 2px 1px 5px rgba(71,71,72,0.5);
}

.detail_title .row.newcard_g span{color:#ce9f30; font-size: 18px; padding:5px;}
.detail_title .row.ticketbg .col-5{text-align: center;}
.detail_title .row.ticketbg hr{margin: 10px 0}
.detail_title .row.ticketbg h6{font-weight: bold; margin:10px 0;letter-spacing: 1.5px;}
.detail_title .row.ticketbg img{padding: 10px 0;}
.detail_title .row.ticketbg2{
  background-image:url(/img/component/about_bg.jpg);
  margin:0 auto;
  background-size: cover;
}
.detail_title .row.ticketbg2 .col-5{text-align: center;}

.detail_title .row.ticketbg2 .col-5 a{
  background-color: #cccccc;
  display:block;
  text-decoration:none;
  list-style:none;
  padding:4px 0;
  color:#000000;
  border-radius: 5px;
}

.detail_title .row.ticketbg2 .col-5 a:hover{
 background:#990000;
 color:#ffffff;
}

.detail_title .row.ticketbg .col-5 .apply_btn{
  background-color: #fccc24;
  display:block;
  text-decoration:none;
  list-style:none;
  color:#000000;
  line-height: 40px;
  text-align: center;
  margin:0 auto;
  border-radius: 5px;
 
}

.detail_title .row.ticketbg2 h1{
  font-size: 48px;
  font-weight:bold;
  color:#ffffff;
  text-shadow:0.1em 0.1em 0.2em rgba(146,146,148,0.5);
  padding-left: 40px;
  
}

.detail_title .row.ticketbg2 img{
      display: block;
      margin: 0 auto;
      padding:5px 0;
}

.detail_title .row.ticketbg2 .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff; } 
.detail_title .row.ticketbg2 .card_btn .btn-gray{ background-color: #797979; color: #fff; } 

.detail_title .row.ticketbg2 .card_btn button {
    font-size: 14px;
    margin: 0 20px;
  }



.detail_title .row.ticketbg .col-md-4{text-align: center;}

.detail_title .row.ticketbg .col-md-8 h4{
  color:#263d95;
  font-weight: bold;
}

.detail_title .row.ticketbg .col-md-8 hr{
  width:80%;
}

.detail_title .row.ticketbg .col-md-8 p{
  font-size: 15px;
  line-height: 25px;
  margin:0;
}

.applycard_btn{
  width:180px;
  background-color: #ffc926;
  color:#4b4f56;
  border-radius: 5px;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  display: block;
  margin:5px auto;
}


.detail_title .row.ticketbg .applycard_btn i{ margin-right:5px;}
.detail_title .row.ticketbg .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff; margin:0; } 
.detail_title .row.ticketbg .card_btn .btn-gray{ background-color: #797979; color: #fff; } 
.detail_title .row.ticketbg .card_btn button {
    font-size: 16px;
    margin: 0 20px;
    display:inline-block;
  }



.detail_title .debit_card i{padding-right:5px;}

.detail_title .debit_card ul {
  margin-bottom: 10px;
  padding-left:0px;
  width:100%;
}


.detail_title .debit_card ul li {
  display:inline-block;
  list-style: none;
  position: relative;
}

.detail_title .debit_card .cardRank a{
  display: inline-block;
  position: relative;
}

.detail_title .debit_card .cardRank h5 {
  position: absolute;
  font-weight: bold;
  color: #fff;
  z-index: 1;
  top: 10px;
  left: 65px;
}

.detail_title .debit_card .cardRank b{
  position: absolute;
  font-family: "arial";
  font-weight: bold;
  color: #601986;
  z-index: 1;
  top: 10px;
  left: 20px;
}



.detail_title .crecard_icon{
  padding-left:0;
  margin:0;
}



.crecard_icon li a {
    color: #000000;
    display: block;
    text-align: center;
    font-size: 14px;
}

.credit_prize{
  background-color: #ebedf0;
  padding:10px;
  margin-left:10px;
  margin-bottom: 10px;
}

.credit_prize h4{
  font-weight: bold;
  color:#ba0d2e;
  font-size: 22px;
  display:inline-block;
  margin: 0 5px;
}




.blue_icon i{
  font-size: 20px;
  padding: 0;
  margin-left: 4px;
  margin-top: 2px;
}


.detail_title .debit_card .debit_limit li a{
 border:1px solid #ccc;
 padding:5px;
 border-radius: 10%;
 display: inline-block;

}
.detail_title .debit_card .debit_list li {
  width:52px;
  height:52px;
  background-color:#253d95;
  padding-right:3px;
}

.detail_title .debit_card .credit_btn {
  width:130px;
  height:40px;
  background-color: #fccc24;
  display:inline-block;
  margin:10px 0;
  color:#000000;
  line-height:40px;
  border-radius: 5px;

}

.crecard_prize .top_prize {
    position: absolute;
    top: 4px;
    left:-2px;
    width: 40px;
    height: 51px;
    text-align: center;
    background-image: url(/img/component/topNew_img.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 80%;
}

.crecard_prize h1 {
    margin: 0;
    font-weight: bold;
    font-family: arial;
    z-index: 1;
    font-size: 25px;
    color: #601986;
    position: absolute;
}

.crecard_prize h6{
  font-weight: bold;
  padding-left: 26px;
  padding-top: 5px;
  color: #b24242;
}

.txt_detail{
  font-size: 18px;
}

.bank_search{
  background:#dee2e6;
  border: 1px solid #ccc;
  width:100%;
}


.bank_search .search_from{ width:100% }

.ticketbg .move_2{
  width:365px;
  text-align: center;
  background-color: #fff;
  padding:20px 0;
  box-shadow:4px 4px 12px 2px rgba(71,71,72,0.5);
  
}

.ticketbg .move_2 hr{
  width:80%;
}
.ticketbg .move_2 h3{
 color:#263d95;
  font-weight: bold;
  margin:15px 0;
  padding-top: 10px;
}

.ticketbg .move_2 .all_form{
  background-color: #ffffff;
  display:block;
}
 
.ticketbg .move_2 a{
  background-color: #cccccc;
  display:block;
  text-decoration:none;
  list-style:none;
  padding:4px 0;
  color:#000000;
}

.ticketbg .move_2 .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff; } 
.ticketbg .move_2 .card_btn .btn-gray{ background-color: #797979; color: #fff; } 
.ticketbg .move_2 .card_btn button {
    font-size: 14px;
    margin: 0 20px;
  }
 
.ticketbg .move_3{
  /*width:236px;*/
  text-align: center;
  background-color: #fff;
  padding:20px 0;
  box-shadow:4px 4px 12px 2px rgba(71,71,72,0.5);
}

.ticketbg .move_3 .all_form{
  background-color: #ffffff;
  display:block;
}

.ticketbg .move_3 .all_form img{
  height: 90px;
}

.ticketbg .move_3 .number{
  background-color: #ffffff;
  display:block;
  text-decoration:none;
  list-style:none;
  color:#273e96;
}


 
.ticketbg .move_3 a{
  background-color: #cccccc;
  display:block;
  text-decoration:none;
  list-style:none;
  padding:4px 0;
  color:#000000;
}
 
.ticketbg .move_3 p{
  font-size: 14px;
}
.ticketbg .move_3 hr{width:70%;}
.ticketbg .move_3 h4{
  color:#263d95;
  font-weight: bold;
  margin:15px 0;
  padding-top: 10px;
}


.ticketbg .move_3 .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff; } 
.ticketbg .move_3 .card_btn .btn-gray{ background-color: #797979; color: #fff; } 
.ticketbg .move_3 .card_btn button {
    padding: 3px 10px;
    font-size: 14px;
    margin: 0 5px;
  }
 
.ticketbg .move_3 .bank_icon img{
  width:52px;
  height:34px;
  margin:3px 8px;
}

.ticketbg .bank_3{
	/*
  	position: relative;
  	width:236px;
  	height: 328px;
  	text-align: center;
  	background-color: #fff;
  	padding:20px 5px;
  	box-shadow:4px 4px 12px 2px rgba(71,71,72,0.5);
	*/
	width: 236px;
  	height: 350px;
  	text-align: center;
  	background-color: #fff;
  	padding: 20px 5px;
  	box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}

.ticketbg .bank_3 .all_form{
  background-color: #ffffff;
  display:block;
}

.ticketbg .bank_3 .all_form img{ height: 50px; }


.ticketbg .bank_3 .number{
  background-color: #ffffff;
  display:block;
  text-decoration:none;
  list-style:none;
  color:#273e96;
}
 

 
.ticketbg .bank_3 a{
  background-color: #cccccc;
  display:block;
  text-decoration:none;
  list-style:none;
  padding:4px 0;
  color:#000000;
}
 
.ticketbg .bank_3 p{
  font-size: 15px;
  text-align: left;
  margin: 5px 0;
}

.ticketbg .bank_3 span{
  padding-left: 120px;
}

.ticketbg .bank_3 hr{
  width:50%;
}


.ticketbg .bank_3 h5{
  color:#263d95;
  font-weight: bold;
  font-family: Microsoft JhengHei;
}

.bank_btn button, .bank_btn a {
    display: inline-block;
    width:100px;
    height: 35px;
    background-color: #797979;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 3px 10px;
    font-size: 15px;
    margin: 0 5px;
    cursor:pointer;
    border: none;
    vertical-align: middle;
    line-height: 1.8;
  }

 .bank_btn{ position: absolute; bottom: 20px; }

.ticketbg .bank_3 .bank_icon img{
  padding:10px  0;

}

.onlinebg{
  margin-bottom: 30px;
  position: relative;
  bottom: 0px;
  transition: all 0.3s;
  box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
}

.onlinebg h4{
  color:#263d95;
  font-weight: bold;
}

.detail_title .onlinebg h6{
    font-weight: bold;
    margin-top:10px;
    margin-bottom: 15px;
    letter-spacing: 1.5px;
  }
.detail_title .onlinebg p{
    font-size: 15px;
    line-height: 28px;
    margin: 0;
  }


.detail_title .onlinebg .applycard_btn i {
    margin-right: 5px;
}


.detail_content{margin:0 15px !important;}
.detail_content .ns_photo .con_img{ margin: 1rem auto;}
/*.detail_content .con_img img{ width: 100%; }*/
.detail_content .con_img p{color:#000 !important; font-size: 15px; margin: 5px 0; border-bottom: 1px solid #ccc}
.detail_content p{ font-size: 20px; letter-spacing: 0.5px; line-height: 1.8; margin-left: auto; margin-right: auto;}
.detail_content h2{   font-weight: 600;   font-size: 20px;}
.detail_content h3{font-size: 20px; letter-spacing: 0.5px; margin-bottom: 1rem;}
.detail_content strong { /*display: block;*/ margin:auto; }
.detail_content p img{max-width: 100%; height: auto !important; display: block; }
.detail_content .ns_photo img{ margin: auto; }
.detail_content .sub_title{font-size:1rem; line-height: 1.5;}
/* .detail_content span{padding:5px 0; display: inline-block;} */
.detail_content .shop_card h5{color: #3f57b5; font-weight: bold;}
.detail_content .shop_txt{font-size: 18px; width: 100%;}
.detail_content .paybg{background-color:#f2f2f2; width:750px;}
.detail_content .paybg p{font-size: 16px; margin: 0; padding:5px 0;}
.card_list { border-bottom: 1px solid #ccd0d5; position: relative;}
.card_list_img { display: block; width: 100%; text-align: center;}
.card_list_img img{ width: 200px;}
.card_list_img.cardall_list img{width:160px; height: 102px;}

.card_list_a{ display: block;  width: 100%;  height: 100%;  position: absolute;  top: 0;  left: 0;     z-index: 10;}
/*.card_list_txt{ padding: 0.5rem; }*/
.card_list_txt h2{ font-size: 18px; font-weight: 600; color: #273e96;}
.card_list_txt ul{ padding-left: 1.3rem; margin: 0;}
.card_list_txt ul li{ font-size: 15px;}
.card_list div:nth-child(1) .btn{ background-color: #ffc107; color: #212529; border: none; }
.card_list div:nth-child(4) .card_list_img{ height: 150px; width:225px; margin:auto; }
.card_list div:nth-child(4) p{  margin: 0; margin-top: 5px; text-align: center; font-size: 14px;}
.bank_all_small_img img{ height:120px;}
.bank_all_img img{ height: 127px;}

.icon_img{ width: 30px; }

.card_name{ 
  color:#263d95;
  font-weight: bold;
  font-size: 18px;
  display: block;
   }

.bank_list ul li{
  list-style-type: none;
  font-size: 15px;
  padding-bottom: 8px;
}

.rank_ad{ border-bottom: 1px solid #ccc; }

.rank_ad .col-md-5{max-width: 285px;flex: auto;}
.rank_ad .col-md-7{max-width: 400px;flex: auto;}
.rank_hot .col-md-1{max-width: 50px; flex: auto;}
.rank_hot .col-md-4{max-width: 215px;flex: auto;}
.rank_hot .col-md-7{max-width: 465px;flex: auto; margin-left: 20px;}
.rank_hot .col-md-5{max-width: 270px;flex: auto;}
.rank_hot .col-md-2{max-width: 193px;flex: auto;}
.rank_hot strong{display: none;}
.bankbg_list:nth-child(even){
  background-color:#f5f6f7;
  border-bottom: 1px solid #dee2e6;
  border-top: 1px solid #dee2e6;
  }

.bank_list ul li a{
 padding-left:10px;
 color: #263d95;
}

.all_color a{
  color: #263d95;
  display: inline-block;
}


.credit_table{ width: 100%; }
.credit_table .bank_list ul li{
 display:inline-block;
}

.credit_table td{
 padding:10px 20px;
}


.credit_table td ul li{
 list-style: none;
}

.credit_table hr{
  width:85%;
  color:#ccc;
}

.credit_table .last_card{
 margin-right:80px;
}

.credit_table .cards_div{ padding: 8px 0; }
.credit_table>.row{ padding: 0; }

.credit_table .bank_div{ border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.credit_table .card_div { border-bottom: 1px solid #ccc; }

.tab-content .credit_card.active{ background-color: #253d95; color: #ffffff;}

.bank_list.type_card h5 a{ 
  display: inline-block;
  font-weight: 600;
  color:#273e96;
  font-size: 20px;
}

.bank_list.type_card ul{ 
  padding: 0;
}

.bank_list.type_card ul li a{
 border:1px solid #898989;
 padding:5px;
 border-radius: 10%;
 margin: 0 5px;
 background:#ffffff;
}

.bank_list.type_card .fb_search_btn{ 
  width: 100%;
  height: 30px;
}

.bank_main{
  position: relative;
  padding:0 10px;
  border-bottom: 1px dashed #dddfe2;
} 

.bank_main.hole:before{
  position: absolute;
  top: 5px;
}

.bank_main h5{
 color:#666;
 margin:10px 0;
 font-weight: bold;
 display:inline;
 padding-bottom: 5px;
 padding-left: 15px;
}



.bank_main.gray_hole{
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.online_btn{
  background-color:#ffc107;
  border-color:#ffc107;
  color: #212529;
}

.online_care p{
  font-size: 1rem;
  line-height: 1.8;
  letter-spacing: 0.5px;
}

.online_care h5{
  font-size:20px;
  line-height: 2;
  letter-spacing: 0.5px;
  color: #5a5c5f;
  font-weight: bold;
  border-bottom: 1px dashed #ccc;
  width: 90%;
  margin: 10px auto;
}

/* 常見問題(線上辦卡/線上貸款/數位帳戶/證券開戶) */
#faq-accordion .card a {
  color: #000000;
  letter-spacing: 0.5px;
}

#faq-accordion .card .card-body a {
  color: rgb(169 113 1);
  font-weight: bold;
}

#faq-accordion .card a:hover {
  color: #3f57b5;
}

#faq-accordion .card a span {
  color: #ce9f30;
  font-size: 24px;
}

/* 卡優獨享首刷禮常見問題 */
.faq-assign .card .card-text {
  line-height: 1.8;
} 

.faq-assign .card img {
  width: 55%;
} 

/* 辦卡注意事項 */
.online_care .card {
  background-color: rgb(226,180,88) !important;
  border-radius: 0 0 20px 20px;
}

.online_care .card:hover {
  background-color: rgb(233, 189, 102)  !important;
}

.online_care .card-body {
  line-height: 1.8;
  border-radius: 0 0 20px 20px;
}

.online_care .card-header h6 {
  letter-spacing: 0.5px;
}

/*----------------------------------------- 卡片比一比 -------------------------------------------------*/

.rank_care .search_from select{
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    position: relative;
    width: 100%;
    margin: 4px 0;
    border: none;
    padding: 7px;
    padding-right: 40px;
    font-size: 15px;
    background-size: cover;
    background-position: center;
 }

.rank_care img{
 height:135px;
 margin:10px auto;
}

.rank_care h1{
 width:220px;
 height: 147px;
 border:1px #cccccc dashed;
 border-radius: 8px;
 margin:10px auto;
 color:#cccccc;
}



.rank_care h6{
 color:#8d39ce;
 text-align: center;
}

.rank_care h5{
 color:#8d39ce;
 text-align: center;
 word-break: break-all;
}


.money_main{
  font-size: 20px;
    font-weight: bold;
    color:#273e96 !important;
    padding-bottom: 5px;
}


.money_button{
  padding: 0 17px;
    line-height: 1;
}

.rank_care .rankas_img{
  /*width:190px;*/
  height: 128px;
}

.rank_care .rankasable_img{
  width:50px;
  height:50px;
}

.rank_care .rankascard_img{
  width:30px;
  height: 30px;
}

.rank_boot table{width:100%;}
.rank_boot td{
  width:310px;
  border-bottom: 1px solid #ccc;
  text-align: center;
  padding: 10px 0;
}
.rank_boot tr td:nth-child(3){ background-color: #f5f6f7;}

.compare_bg .col:nth-child(2){ background-color: #f5f6f7;}
/*----------------------------------------- 卡片比一比end ----------------------------------------------*/

/*----------------------------------------- 現金回饋 ----------------------------------------------*/
.money_header{
  height:auto !important;
}

.modal_prize{ height: 100%; }
.modal_prize h1{
    margin-top: 85px;
    font-weight: bold;
    font-family: arial;
    z-index: 1;
    font-size: 25px;
    color: #601986;
}


.card b{display: none;}
.card-header{background: none;}
.card:nth-child(odd) {
    background-color: #f5f6f7;
}
.card{border:none;}

.rank_second .col-md-1{max-width: 6%; padding: 0; flex: auto;}
.rank_second .col-md-11{max-width: 94%; padding: 0; flex: auto;}




/*----------------------------------------- 現金回饋end ----------------------------------------------*/

/*----------------------------------------- 會員專區 ----------------------------------------------*/
.about_bg{background: url(/img/component/about_bg.jpg); margin: 0 auto; background-size: cover;}
.about_bg h1{font-size: 30px;font-weight: bold; color:#888;}
.about_bg h2{font-size: 25px;font-weight: bold; color:#bbb;text-align: center; padding-top: 20px;}
.about_bg p{font-size: 20px;font-weight: bold; color:#3f57b5;}

#terms{ width: 600px; height: 500px; }
#terms div{ height: 450px; overflow: auto; }


.about_bg button{
    width: 90px;
    height: 40px;
    border-radius: 5px;
    display: block;
    margin: 5px;
}

.about_bg a{
    text-align: center;
    padding: 8px 0px;
    width: 90px;
    border-radius: 5px;
    display: block;
    margin: 5px;
}


.member_info h4{font-weight: bold; color:#3f57b5;}
.member_info h5{font-weight: bold; color:#3f57b5;}
.member_info .table td, .table th{padding:8px 5px; font-size: 14px;}
.fun{padding-left: 0;}
.fun li{list-style: none; padding: 5px;}
.fun li:nth-child(even){
    background-color: #f5f6f7;
    border-bottom: 1px solid #dee2e6;
    border-top: 1px solid #dee2e6;
  }
.fun .publish_cate{color:#257DB4;margin-right: 10px;}
.fun .ontime{float: right;    font-size: 14px; color: #888;}
.sign_info i {font-size:25px; color:#90949c; margin: 0 5px;}
.sign_info h5{
    font-size: 22px;
    font-weight: 600;
    color: #172f8b;
    margin: 15px 10px;
}

.user_login button{width:150px; padding:8px 0; margin:10px;}
.user_info{border: 1px solid #ccc; padding: 25px 8px; margin: 15px 0;}
.user_info ul{padding-left: 0; padding-right: 0px; border-right: 1px solid #ccc; margin-bottom: 0;}
.user_info li{display: inline-block; margin:0 5px;}
.user_info p{margin:0; font-size: 16px; display: block;}
.member_btn button{width: 160px; background: linear-gradient(to bottom, rgba(226,180,88,1) 0%,rgba(203,157,64,1) 100%); border-radius: 30px; box-shadow: none; height: auto; padding: 12px; display: block; margin: 15px 5px 5px 5px; cursor: pointer;}
.mf_tool_div{ position: absolute; top: 0; right: 0;}
.mf_tool_div #G_calendar_btn,.mf_tool_div #del_fa_btn{ display: inline-block; position: relative; top: auto; right: auto;}
.user_more{padding:8px 0;}
.user_more h5{display: block; border-bottom: 1px dashed #ccc; padding:10px 0;}
.user_more .btn{display: block; position: absolute; top: 10px; right: 19px;left: auto;} 
.user_more button a{color:#fff;}
.member_more h5{display: inline-block;}
.member_more a{float:right;margin: 5px; color:#fff;}  


.login_info .login_line{border: 1px solid #eee;}
.login_info .col-sm-10{border-bottom: 1px solid #eee;}
.login_info .login_w input{/*width:80%;*/}
.login_info .col-sm-2 {
    background-color: #888;
    text-align: right;
    font-weight: bold;
    color: #fff;
    border-bottom: 1px #ddd solid;
    padding: 15px;
  }

.check_in ul{padding-left:0;}
.check_in ul li{display:inline-block;margin:10px;}
.check_in .col-sm-3{
    background-color: #888;
    text-align: right;
    font-weight: bold;
    color: #fff;
    border-bottom: 1px #ddd solid;
    padding: 15px;
}

.check_in .col-sm-9{border-bottom: 1px solid #eee;}
.check_in .login_line{border: 1px solid #eee;}
.check_in button a{color:#fff;}
.mycard_info{overflow: auto; width: 100%;}
.mycard_info table{/*width: 730px;*/}
#add_card{display: none;}
#add_card .mem_logo img{width:150px;}
#add_card .date_w input[type="text"]{width:15%;}
#add_card h1{
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    color: #172f8b;
    margin: 15px 0;
  }
#repair_card{display: none;}
#repair_card .mem_logo img{width:150px;}
#repair_card .date_w input{width:15%;}
#repair_card h1{
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    color: #172f8b;
    margin: 15px 0;
  }
#add_bill{width: 700px; margin: auto; }
#add_bill .mem_logo img{width:150px;}
#add_bill .date_w input{width:50%; margin: 0 10px;}
#add_bill .date_w option{margin: 0 10px;}
#add_bill h1{
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    color: #172f8b;
    margin: 15px 0;
  }
#add_bill h5{
    font-size: 18px;
    color: #172f8b;
    margin: 15px 10px;
  }
#add_bill span{
    font-size: 18px;
    color: #172f8b;
    margin: 15px 10px;
  }
#bill_update{display: none;}
#bill_update .mem_logo img{width:150px;}
#bill_update .date_w input{width:50%; margin: 0 10px;}
#bill_update .date_w option{margin: 0 10px;}
#bill_update h1{
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    color: #172f8b;
    margin: 15px 0;
  }
#bill_update h5{
    font-size: 18px;
    color: #172f8b;
    margin: 15px 10px;
  }
#bill_update span{
    font-size: 18px;
    color: #172f8b;
    margin: 15px 10px;
  }
.info_btn{
  position: absolute;
  right: 25px;
  top: 15px;
}
.info_btn button{
  width:85px;
  height: 25px;
  border-radius: 5px;
  display: block;
}

.post p{text-align: left;}
.post small{bottom:54px;}

.error h1{
  font-size: 28px;
  font-weight: bold;
  color: #32b2e8;
  padding-bottom: 10px;
  border-bottom: 1px dashed #ccc;
}
.error h3{
  font-weight: bold;
  color: #888;
  font-size: 24px;
  letter-spacing: 1px;
}

.error p{
  font-size: 16px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #ccc;
}

.error img{
  width:62%;
}

.error .logo_m{
  width: 130px;
  margin: 10px;
}

.error .col-md-8 div{
  display: inline-block;
}

.note_div { background-color: #f7f7f7; }

.mycard_more_btn{ position: absolute; top: 6px; right: 0px; background-color: #36a6e8; color: #fff; }

#card_info_div{ position: absolute;  right: 10px;  bottom: 10px; }

/*----------------------- 會員留言 -------------------------------*/
.discuss_content{  border-bottom: 1px dashed #ccc; position: relative;}
.discuss_content .d_mem_img{ display: inline-block; vertical-align: top; }
.discuss_content .d_mem_txt{ display: inline-block; vertical-align: top; width: 80%;}
.discuss_content .d_mem_txt p:nth-child(2){word-break: break-all;}
.discuss_content .d_mem_txt textarea{ width: 100%; padding: 10px;}
.discuss_content .d_mem_img img{ width: 50px; border: 1px solid #7fb8e7; padding: 2px; }
.discuss_content .d_mem_name{ color: #1274dc;  margin-right: 5px; font-weight: 600; }
.discuss_content .d_mem_time{ color: #ccc; }
.discuss_content .d_mem_edit{ position: absolute;  right: 8px;  top: 8px; font-size: 20px;}
/*----------------------- 會員留言 END -------------------------------*/

/*----------------------------------------- 會員專區end ----------------------------------------------*/
/*----------------------------------------- footer ----------------------------------------------*/
.about_info{font-weight: 600; color: #3f57b5;}
.footer_care p{font-size: 16px; padding:15px;}
.footer_bg{
    box-shadow: 4px 4px 12px 2px rgba(71,71,72,0.5);
    margin-bottom: 15px;
  }


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 紫色 ------------------------------------------------*/

.purple_tab .nav-tabs .nav-item.show .nav-link, .purple_tab .nav-tabs .nav-link.active { 
color: #fff;
box-shadow: 4px 4px 7px -2px rgba(0, 0, 0, 0.5);
background: -moz-linear-gradient(top, rgba(162,46,204,1) 0%, rgba(208,79,255,1) 60%, rgba(233,173,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(162,46,204,1) 0%,rgba(208,79,255,1) 60%,rgba(233,173,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(162,46,204,1) 0%,rgba(208,79,255,1) 60%,rgba(233,173,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a22ecc', endColorstr='#e9adff',GradientType=0 ); /* IE6-9 */
}

.purple_tab .nav-tabs{
    border-bottom: 3px solid #e1b5f4;  
}

.purple_tab .nav-tabs .nav-link{ 
    color: #b83de4;
}

.purple_tab .nav-tabs .nav-item{
   background-color: #faf3fc;
}

.purple_tab .search_from select{ 
    background-color: #f2e3f8;
    background-image: url(/img/component/select_back_purple.jpg);
}

.purple_tab .search_from button{
    color: #fff;
    background: rgb(198,113,229); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(198,113,229,1) 0%, rgba(146,83,168,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(198,113,229,1) 0%,rgba(146,83,168,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(198,113,229,1) 0%,rgba(146,83,168,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c671e5', endColorstr='#9253a8',GradientType=0 ); /* IE6-9 */
}



/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/


/*----------------------------------------- 藍色 ------------------------------------------------*/

.blue_tab .nav-tabs .nav-item.show .nav-link, .blue_tab .nav-tabs .nav-link.active{ 
color: #fff;
background: rgb(36,59,146); /* Old browsers */
background: -moz-linear-gradient(top, rgba(36,59,146,1) 0%, rgba(93,121,221,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(36,59,146,1) 0%,rgba(93,121,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(36,59,146,1) 0%,rgba(93,121,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#243b92', endColorstr='#5d79dd',GradientType=0 ); /* IE6-9 */
}

.blue_tab .title.hole{

  background: -moz-linear-gradient(left, rgba(39,60,139,1) 37%, rgba(57,86,158,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(39,60,139,1) 37%,rgba(57,86,158,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(39,60,139,1) 37%,rgba(57,86,158,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#273c8b', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}

.blue_tab .nav-tabs{
    border-bottom:3px solid #5975d8;  
}

.blue_tab .nav-tabs .nav-link{ 
    color: #273e96;
}

/*.blue_tab .nav-tabs .nav-item{
    background-color: #ecf0ff;
}*/

.blue_tab .search_from select{ 
    background-color: #eff6fe;
    background-image: url(/img/component/select_back_blue.png);
}

.blue_tab .search_from button{
    color: #fff;
    background: rgb(85,114,219); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(85,114,219,1) 0%, rgba(63,84,163,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5572db', endColorstr='#3f54a3',GradientType=0 ); /* IE6-9 */
}

.blue_tab_btn{
    color: #fff;
    border: none;
    box-shadow: 2px 2px 2px #3f54a3;
    background: rgb(85,114,219); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(85,114,219,1) 0%, rgba(63,84,163,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5572db', endColorstr='#3f54a3',GradientType=0 ); /* IE6-9 */
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 紅色 ------------------------------------------------*/
.red_tab_btn{
    color: #333;
    border: none;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    background-color: #fff;
}
/*----------------------------------------- 桃紅色 ------------------------------------------------*/

.pink_tab .nav-tabs .nav-item.show .nav-link, .pink_tab .nav-tabs .nav-link.active{ 
color: #fff;

background: rgb(197,72,104); /* Old browsers */
background: -moz-linear-gradient(top, rgba(197,72,104,1) 1%, rgba(197,72,104,1) 25%, rgba(232,89,126,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c54868', endColorstr='#e8597e',GradientType=0 ); /* IE6-9 */
}

.pink_tab .title.hole{

background: -moz-linear-gradient(left, rgba(211,82,113,1) 37%, rgba(193,103,138,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(211,82,113,1) 37%,rgba(193,103,138,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(211,82,113,1) 37%,rgba(193,103,138,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d35271', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}

.pink_tab .nav-tabs{
    border-bottom:3px solid #e6587c;  
}

.pink_tab .nav-tabs .nav-link{ 
    color: #894a2e;
}

.pink_tab .nav-tabs .nav-item{
    background-color: #fff;
}

.pink_tab .search_from select{ 
    background-color: #fde6ec;
    background-image: url(/img/component/select_back_pink.jpg);
}

.pink_tab .tab-content small {
    background-color: #e8597e;
}
 
.pink_tab .search_from button{
    color: #fff;

background: rgb(197,72,104); /* Old browsers */
background: -moz-linear-gradient(top, rgba(197,72,104,1) 1%, rgba(197,72,104,1) 25%, rgba(232,89,126,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c54868', endColorstr='#e8597e',GradientType=0 ); /* IE6-9 */
}

.pink_tab .card_list_txt b {
    color: #d85174;
    margin-right: 5px;
}

.pink_tab .more_ot_btn{ 
  padding: 2px 10px; color: #fff; 
  background: rgb(197,72,104); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(197,72,104,1) 1%, rgba(197,72,104,1) 25%, rgba(232,89,126,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c54868', endColorstr='#e8597e',GradientType=0 ); /* IE6-9 */
}
 

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 咖啡色 ------------------------------------------------*/
 
.brown_tab .nav-tabs .nav-item.show .nav-link, .brown_tab .nav-tabs .nav-link.active{ 
color: #fff; 
    background: rgb(204,157,46); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(204,157,46,1) 0%, rgba(229,184,78,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc9d2e', endColorstr='#e5b84e',GradientType=0 ); /* IE6-9 */
}

 
.brown_tab .nav-tabs{
    border-bottom:3px solid #deb147;  
}


 
.brown_tab .nav-tabs .nav-link{ 
    color: #ce9f30;
}
 
.brown_tab .nav-tabs .nav-item{
    background-color: #fff;
}
.brown_tab .search_from select {
    background-color: #fcf0d8;
    background-image: url(/img/component/select_back_brown.jpg);
}

.brown_tab .search_from input{ 
    background-color: #fcf0d8;
}

.brown_tab .card_list_txt b{
    color: #ce9f30;
    margin-right: 5px;
}

.brown_tab .row.imp_int_title{
    background-color: #d4ad53;
    color:#fff;
    font-weight: bold;
}


.brown_tab .more_ot_btn{ 
  padding: 2px 10px; color: #fff; 
  background: rgb(226,180,88); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(226,180,88,1) 0%, rgba(203,157,64,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(226,180,88,1) 0%,rgba(203,157,64,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(226,180,88,1) 0%,rgba(203,157,64,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2b458', endColorstr='#cb9d40',GradientType=0 ); /* IE6-9 */
}

 
.brown_tab .search_from button{
    color: #fff;
    background: rgb(226,180,88); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(226,180,88,1) 0%, rgba(203,157,64,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(226,180,88,1) 0%,rgba(203,157,64,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(226,180,88,1) 0%,rgba(203,157,64,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2b458', endColorstr='#cb9d40',GradientType=0 ); /* IE6-9 */
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 綠色 ------------------------------------------------*/
 
.green_tab .nav-tabs .nav-item.show .nav-link, .green_tab .nav-tabs .nav-link.active{ 
 color: #fff;
 
   background: rgb(5,112,11); /* Old browsers */
   background: -moz-linear-gradient(top, rgba(5,112,11,1) 1%, rgba(88,176,93,1) 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05700b', endColorstr='#58b05d',GradientType=0 ); /* IE6-9 */
}
 
 
.green_tab .nav-tabs{
    border-bottom:3px solid #4da852;  
}
 
.green_tab .nav-tabs .nav-link{ 
    color: #107816;
}
 
.green_tab .nav-tabs .nav-item{
    background-color: #fff;
}
 
.green_tab .search_from select{ 
    background-color: #eff6fe;
    background-image: url(/img/component/select_back_blue.png);
}
 
.green_tab .search_from button{
    color: #fff;
    background: rgb(85,114,219); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(85,114,219,1) 0%, rgba(63,84,163,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(85,114,219,1) 0%,rgba(63,84,163,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5572db', endColorstr='#3f54a3',GradientType=0 ); /* IE6-9 */
}
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 深咖啡色 ------------------------------------------------*/
 
.Darkbrown_tab .nav-tabs .nav-item.show .nav-link, .Darkbrown_tab .nav-tabs .nav-link.active{ 
  color: #fff;
background: #8f4e31; /* Old browsers */
background: -moz-linear-gradient(top, #8f4e31 0%, #c77049 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #8f4e31 0%,#c77049 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #8f4e31 0%,#c77049 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f4e31', endColorstr='#c77049',GradientType=0 ); /* IE6-9 */
}
 
 
.Darkbrown_tab .nav-tabs{
    border-bottom:3px solid #c56f49;  
}
 
.Darkbrown_tab .nav-tabs .nav-link{ 
    color: #874b2f;
}
 
.Darkbrown_tab .nav-tabs .nav-item{
    background-color: #fff;
}
 
.Darkbrown_tab .tab-content small{
    background-color:#874b2f;
}
.Darkbrown_tab .tab-content .more_bag img{
     background-color:#874b2f; 
}
 
.Darkbrown_tab .search_from select{ 
    background-color: #fcede8;
    background-image: url(/img/component/select_back_darkbrown.jpg);
    padding-right: 35px;
}

.Darkbrown_tab .row.imp_int_title{
    background-color: #b97253;
    color:#fff;
    font-weight: bold;
    }
 
.Darkbrown_tab .search_from button{
     color: #fff;
background: #8f4e31; /* Old browsers */
background: -moz-linear-gradient(top, #8f4e31 0%, #c77049 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #8f4e31 0%,#c77049 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #8f4e31 0%,#c77049 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f4e31', endColorstr='#c77049',GradientType=0 ); /* IE6-9 */
}

.Darkbrown_tab .card_list_txt b {
    color: #874b2f;
    margin-right: 5px;
}


.Darkbrown_tab .more_ot_btn{ 
  padding: 2px 10px; color: #fff; 
  background: #8f4e31; /* Old browsers */
  background: -moz-linear-gradient(top, #8f4e31 0%, #c77049 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #8f4e31 0%,#c77049 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #8f4e31 0%,#c77049 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f4e31', endColorstr='#c77049',GradientType=0 ); /* IE6-9 */
}
 
 
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 切換型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 藍綠色 ------------------------------------------------*/
 
.blueGreen_tab .nav-tabs .nav-item.show .nav-link, .blueGreen_tab .nav-tabs .nav-link.active{ 
 color: #fff;
    background: rgb(24,124,155); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(24,124,155,1) 0%, rgba(56,172,198,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#187c9b', endColorstr='#38acc6',GradientType=0 ); /* IE6-9 */
}
 
 
.blueGreen_tab .nav-tabs{
    border-bottom:3px solid #2ba6c1;  
}
 
.blueGreen_tab .nav-tabs .nav-link{ 
    color: #126f90;
}
 
.blueGreen_tab .nav-tabs .nav-item{
    background-color: #fff;
}
 
.blueGreen_tab .tab-content small{
    background-color:#2ba6c1;
}
.blueGreen_tab .tab-content .more_bag img{
     background-color:#2ba6c1; 
}
 
.blueGreen_tab .search_from select{ 
    background-color: #dff4f9;
    background-image: url(/img/component/select_back_blueGreen.jpg);
}
.blueGreen_tab .search_from input{ 
    background-color: #dff4f9;
}

.blueGreen_tab .card_list_txt b{
    color: #187c9b;
    margin-right: 5px;
    
}
 
.blueGreen_tab .search_from button{
   color: #fff;
    background: rgb(24,124,155); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(24,124,155,1) 0%, rgba(56,172,198,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#187c9b', endColorstr='#38acc6',GradientType=0 ); /* IE6-9 */
}

.blueGreen_tab .more_ot_btn{
  padding: 2px 10px; color: #fff; 
  background: rgb(24,124,155); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(24,124,155,1) 0%, rgba(56,172,198,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#187c9b', endColorstr='#38acc6',GradientType=0 ); /* IE6-9 */
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 藍色 ------------------------------------------------*/
.blue_tab .tab_menu{ background-color: #e5f0e6; }
.blue_tab .tab_menu .menu a:hover{ color: #1a7f9e;}
.blue_tab .tab_menu .menu a.ms_enter{ color: #1a7f9e; }
.blue_tab .tab_menu .menu a:before{ background-color: #1a7f9e; }

.blue_tab .title_tab{  
    color: #fff;
    background: rgb(36,59,146); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(36,59,146,1) 0%, rgba(93,121,221,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(36,59,146,1) 0%,rgba(93,121,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(36,59,146,1) 0%,rgba(93,121,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#243b92', endColorstr='#5d79dd',GradientType=0 ); /* IE6-9 */
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 咖啡色 ------------------------------------------------*/
.brown_tab .tab_menu{ background-color: #fff8e5; }
.brown_tab .tab_menu .menu a:hover{ color: #d4a537;}
.brown_tab .tab_menu .menu a.ms_enter{ color: #d4a537; }
.brown_tab .tab_menu .menu a:before{ background-color: #d4a537; }

.brown_tab .title_tab{ 
   color: #fff; 
    background: rgb(204,157,46); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(204,157,46,1) 0%, rgba(229,184,78,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(204,157,46,1) 0%,rgba(229,184,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc9d2e', endColorstr='#e5b84e',GradientType=0 ); /* IE6-9 */
}
.brown_tab.hotCard .content_tab b{
    color: #cc9d2e;
    font-size: 2px;
}

.brown_tab .title.hole{
background: -moz-linear-gradient(left, rgba(206,160,67,1) 37%, rgba(189,165,101,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(206,160,67,1) 37%,rgba(189,165,101,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(206,160,67,1) 37%,rgba(189,165,101,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cea043', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 藍綠色 ------------------------------------------------*/
.blueGreen_tab .tab_menu{ background-color: #e5f0e6; }
.blueGreen_tab .tab_menu .menu a:hover{ color: #1a7f9e;}
.blueGreen_tab .tab_menu .menu a.ms_enter{ color: #1a7f9e; }
.blueGreen_tab .tab_menu .menu a:before{ background-color: #1a7f9e; }

.blueGreen_tab .title_tab{  
    color: #fff;
    background: rgb(24,124,155); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(24,124,155,1) 0%, rgba(56,172,198,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(24,124,155,1) 0%,rgba(56,172,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#187c9b', endColorstr='#38acc6',GradientType=0 ); /* IE6-9 */
}

.blueGreen_tab .title.hole{
background: -moz-linear-gradient(left, rgba(48,147,174,1) 37%, rgba(64,155,186,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(48,147,174,1) 37%,rgba(64,155,186,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(48,147,174,1) 37%,rgba(64,155,186,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3093ae', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}




/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 橘色 ------------------------------------------------*/
.orange_tab .tab_menu{ background-color: #fef4f0; }
.orange_tab .tab_menu .menu a:hover{ color: #eb8c0f;}
.orange_tab .tab_menu .menu a.ms_enter{ color: #eb8c0f; }
.orange_tab .tab_menu .menu a:before{ background-color: #eb8c0f; }

.orange_tab .title_tab{  
    color: #fff;
    background: rgb(209,123,10); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(209,123,10,1) 0%, rgba(229,134,9,1) 31%, rgba(255,157,30,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(209,123,10,1) 0%,rgba(229,134,9,1) 31%,rgba(255,157,30,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(209,123,10,1) 0%,rgba(229,134,9,1) 31%,rgba(255,157,30,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d17b0a', endColorstr='#ff9d1e',GradientType=0 ); /* IE6-9 */
}

.orange_tab .title.hole{
background: -moz-linear-gradient(left, rgba(242,146,51,1) 37%, rgba(218,154,88,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(242,146,51,1) 37%,rgba(218,154,88,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(242,146,51,1) 37%,rgba(218,154,88,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f29233', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}







/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 綠色 ------------------------------------------------*/
.green_tab .tab_menu{ background-color: #e5f0e6; }
.green_tab .tab_menu .menu a:hover{ color: #37963e;}
.green_tab .tab_menu .menu a.ms_enter{ color: #37963e; }
.green_tab .tab_menu .menu a:before{ background-color: #37963e; }

.green_tab .title_tab{ 
    color: #fff;

   background: rgb(5,112,11); /* Old browsers */
   background: -moz-linear-gradient(top, rgba(5,112,11,1) 1%, rgba(88,176,93,1) 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05700b', endColorstr='#58b05d',GradientType=0 ); /* IE6-9 */
}
.green_tab .search_from input{
  background-color:#e9fbea;
  width: 75%;
  margin-right: 10px;
  box-shadow: 2px 2px 10px 2px rgba(136,136,138,0.5);
 }

.green_tab .search_from button{
  color: #fff;

   background: rgb(5,112,11); /* Old browsers */
   background: -moz-linear-gradient(top, rgba(5,112,11,1) 1%, rgba(88,176,93,1) 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, rgba(5,112,11,1) 1%,rgba(88,176,93,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05700b', endColorstr='#58b05d',GradientType=0 ); /* IE6-9 */
}

.green_tab .title.hole{
background: -moz-linear-gradient(left, rgba(40,130,53,1) 37%, rgba(58,141,90,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(40,130,53,1) 37%,rgba(58,141,90,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(40,130,53,1) 37%,rgba(58,141,90,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#288235', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}



/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 粉紅色 ------------------------------------------------*/
.pink_tab .tab_menu{ background-color: #fce0e8; }
.pink_tab .tab_menu .menu a:hover{ color: #d65073;}
.pink_tab .tab_menu .menu a.ms_enter{ color: #d65073; }
.pink_tab .tab_menu .menu a:before{ background-color: #d65073; }

.pink_tab .title_tab{ 
  color: #fff;

background: rgb(197,72,104); /* Old browsers */
background: -moz-linear-gradient(top, rgba(197,72,104,1) 1%, rgba(197,72,104,1) 25%, rgba(232,89,126,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(197,72,104,1) 1%,rgba(197,72,104,1) 25%,rgba(232,89,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c54868', endColorstr='#e8597e',GradientType=0 ); /* IE6-9 */
}

.pink_tab .title.hole{
background: -moz-linear-gradient(left, rgba(211,82,113,1) 37%, rgba(193,103,138,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(211,82,113,1) 37%,rgba(193,103,138,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(211,82,113,1) 37%,rgba(193,103,138,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d35271', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}

.pink_tab .search_from input{ 
    background-color: #fde6ec;
}



/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ 單頁型 TAB @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*----------------------------------------- 深咖啡 ------------------------------------------------*/
.Darkbrown_tab .title_tab{ 
  color: #fff;
background: #8f4e31; /* Old browsers */
background: -moz-linear-gradient(top, #8f4e31 0%, #c77049 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #8f4e31 0%,#c77049 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #8f4e31 0%,#c77049 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f4e31', endColorstr='#c77049',GradientType=0 ); /* IE6-9 */
}


.Darkbrown_tab .title.hole{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9d5737+36,7db9e8+100&1+50,0+100 */
background: -moz-linear-gradient(left,  rgba(157,87,55,1) 36%, rgba(150,108,94,1) 50%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(157,87,55,1) 36%,rgba(150,108,94,1) 50%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(157,87,55,1) 36%,rgba(150,108,94,1) 50%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d5737', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}


.Darkbrown_tab .search_from input{ 
    background-color: #fcede8;
}
 




/*----------------------------- footer ------------------------------------*/
.footer_btn{
    background-color: #fff;
    border: 1px solid #dfdfdf;
}

.footer_btn a{ display: inline-block; color: #000; font-size: 15px; }

.footer_div img{ width: 150px; }
.footer_div p{ font-size: 14px;  color: #949494; }


/*----  線上立即辦卡menu ---*/
#menu .dropDown_menu.card_assign_menu{
   width: 25%; margin-right: 22%;
}

/*################################################################## 平板畫面 #######################################################################*/


@media (max-width: 1024px){
  
  .mb-md-tablet{margin-bottom: 125px !important;}

  .mem_tool_alert{
    width: 120px !important;
    justify-content: center !important;
    top: auto;
    right: auto;
    bottom: -45px; 
    left:93px; 
  }

  .mem_tool_alert.none{top: auto; bottom: -55px;  }
  

  .fancybox-slide--iframe{ padding: 0; }

  /*信用卡快搜 fancybox*/
  #ccard_search{ display: none;  }
  #ccard_search .mem_logo img{ width: 130px; }

  .search_from select{ padding-right:40px; }
  

  #iNews{ height: 190px; }
  #iNews .word{ height: 40px; line-height: 40px; top: auto; padding:0px 5px; font-size: 26px; }

  /*-- 輪播廣告CSS --*/
  .ad_top_slide{ background-size: contain !important; background-position: top !important; background-repeat: no-repeat !important; }

  .top-space{ margin-top: 6.5rem; }
  .container-fluid{ padding:0; }
  .hamburger{ padding: 5px; }
  .hamburger-box{ width: 25px;  }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after{ width: 25px; height: 3px; }
  .hamburger-inner::before{ top: -7.4px; }
  .hamburger--collapse .hamburger-inner::after{  top: -14px; }

  header{ width: 100%; top: 0; left: 0; position: fixed; z-index: 200; background-color: #fff;}
  
  /*--- menu tool ---*/
  .tool_div div{ width: 85%; margin-left: auto; justify-content: space-between;}
  .tool_div a{display: block; width: 25px; height: 25px; background-repeat: no-repeat; }
  .tool_div a:nth-child(1){ background-size: 90%; }
  .tool_div a:nth-child(2){ background-size: 70%; }
  .tool_div a:nth-child(3){ background-size: 95%; }
  .tool_div a:nth-child(4){ background-size: 95%; }


  /*--- menu bar ---*/
  #menu{
    width: auto;
    background-image: none;
  }
  #menu_bar{ 
   
   background: rgb(66,85,157); /* Old browsers */
   background: -moz-linear-gradient(top, rgba(66,85,157,1) 0%, rgba(25,49,136,1) 50%, rgba(63,83,156,1) 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, rgba(66,85,157,1) 0%,rgba(25,49,136,1) 50%,rgba(63,83,156,1) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, rgba(66,85,157,1) 0%,rgba(25,49,136,1) 50%,rgba(63,83,156,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42559d', endColorstr='#3f539c',GradientType=0 ); /* IE6-9 */
  }

  #menu_bar .swiper-slide{ width: initial; padding: 5px 0;}
  #menu_bar .swiper-slide.active{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#afafaf+6,dbdbdb+49,b7b7b7+93 */
    background: rgb(175,175,175); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(175,175,175,1) 6%, rgba(219,219,219,1) 49%, rgba(183,183,183,1) 93%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(175,175,175,1) 6%,rgba(219,219,219,1) 49%,rgba(183,183,183,1) 93%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(175,175,175,1) 6%,rgba(219,219,219,1) 49%,rgba(183,183,183,1) 93%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afafaf', endColorstr='#b7b7b7',GradientType=0 ); /* IE6-9 */
  }
  #menu_bar .swiper-slide a{ display: inline-block; padding: 0 0.5rem; font-size: 19px; color: #fff; font-weight: 600; text-align: center; }
  #menu_bar .swiper-slide.active a{ color: #193188; }

  /*--- menu 下拉選單 ---*/
  #menu_list{ 
    position: fixed; 
    top: 0;
    left:-100%;
    z-index: 100;
  }

  #menu_list .close_div{
    padding: 5px 18px;
    font-size: 20px;
    background: #ccc;
    background: rgb(66,85,157); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(66,85,157,1) 0%, rgba(24,48,135,1) 51%, rgba(66,85,157,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(66,85,157,1) 0%,rgba(24,48,135,1) 51%,rgba(66,85,157,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(66,85,157,1) 0%,rgba(24,48,135,1) 51%,rgba(66,85,157,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42559d', endColorstr='#42559d',GradientType=0 ); /* IE6-9 */
  }

  #menu_list .card-header{
    padding: 0;
  }

  #menu_list .card{
    background: #eee;
    border-radius: 0;
  }

  #menu_list .card-body{
    padding: 8px 18px;
  }

  #menu_list .card-body a{
    color: #3e529b;
    font-weight: 600;
    display: block;
    padding: 8px 1px;
  }

  #menu_list .card-body h4{
    font-size: 18px;
    border-bottom: 2px solid #ccc;
    padding: 5px 0;
    padding-top: 10px;
    font-weight: 600;
  }

  #menu_list .accordion{
    max-height: 90vh;
    overflow: auto;
  }

  #menu_list .btn{ 
    width: 100%;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    padding: 10px 18px;
    color: #3e529b;
    background-color: #d2d2d2;
    border-radius: 0;
    border-bottom: 1px solid #bcbcbc;
 }

#menu_list .card-header a{
  position: absolute;
    top: 0;
    left: 0;
    font-size: 18px;
    font-weight: 600;
    padding: 8px 18px;
    color: #3e529b;
    line-height: 1.6;
    background-color: #d2d2d2;
    
}


 #menu_list .btn i{
  font-size: 25px;
  float: right;
 }

  #menu_list .close_div a{
    color: #fff;
    font-weight: 600;
  }

  #menu_list .close_div a:nth-child(2){
    float: right;
  }
	
	

    /*--- menu 下拉選單 END ---*/

  .title{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    line-height: 28px;
    background-repeat: repeat-y;
    color: #fff;
    font-size: 18px;
    z-index: 99;
    padding: 0 0 0 25px;
  }


  /*--- 新聞專題 ---*/
  .news_slide{ position: relative; height: 100%;}
  .news_slide .swiper-container{
      height: 100%;
  }

  .news_slide .swiper-slide{
     background-size: cover;
     background-position: center;
  }

  .news_slide .swiper-slide a{
      display: block;
      width: 100%;
      height: 100%;
  }

  .news_slide .swiper-button-prev, .news_slide .swiper-container-rtl .swiper-button-next{
         
         color: #fff;
         width: 45px;
         height: 45px;
         left: 0%;
         top: 44%;
  }

  .news_slide .swiper-button-next, .news_slide .swiper-container-rtl .swiper-button-prev{
       
       color: #fff;
       width: 45px;
       height: 45px;
       right: 0%;
       top: 44%;
  }

  .news_slide .swiper-button-next.swiper-button-disabled, .news_slide .swiper-button-prev.swiper-button-disabled{
     opacity: 0.4;
  }

  .news_slide .swiper-container-horizontal>.swiper-pagination-bullets{
    bottom: 25%;
    text-align: left;
    padding: 0 1rem;
  }

  .news_slide .swiper-pagination-bullet{
    width: 12px;
    height: 12px;
    background: #fff;
    opacity: .4;
  }

  .news_slide .swiper-pagination-bullet-active{
    background: #f39e1b;
    opacity: 0.9;
  }

  .news_slide .swiper-slide .word{
    position: absolute;
    bottom: 0;
    font-size: 23px;
    color: #fff;
    font-weight: 600;
    width: 100%;
    padding: 0.5rem 0rem;
    text-align: center;
  }


  /*-- 其他專題-輪播 --*/
  .other_slide .swiper-container{
    height: 100%;
  }

  .other_slide .swiper-slide .word{
    position: absolute;
    bottom: 0;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    width: 100%;
    padding: 0.5rem 0rem;
    text-align: center;
  }

  /*-- 其他專題-輪播 END --*/


/*--------------------- 卡排行 -----------------------*/

/*== 字級 ==*/
.big_font_size{ font-size: 27px; }
.s_big_font_size{ font-size: 19px; }

/*== 選單 ==*/

.card_rank .swiper-container{
    height: 90px;
    margin:0 1rem;
}

.card_rank .swiper_div{
   background-color: #fcf4ff;
}


.card_rank .swiper-slide{
    display: flex;
    justify-content: center;
    align-items: center;
    border-color: #8c37cc;
    border-bottom: 0px solid #8c37cc;
}


.card_rank .swiper-slide div a{
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    color: #757275;
}


.card_rank .swiper-slide .active{
}

.card_rank .swiper-slide .active div a{
}

.card_rank .col-2{
   max-width: 19%;
    flex: 0 0 19%;
}

.card_rank .col-10{
   max-width: 81%;
    flex: 0 0 81%;
}

.card_fun{
    padding: 0.5rem;
    padding-left: 2rem;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    background: rgb(140,55,204); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(140,55,204,1) 0%, rgba(196,147,237,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(140,55,204,1) 0%,rgba(196,147,237,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(140,55,204,1) 0%,rgba(196,147,237,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c37cc', endColorstr='#c493ed',GradientType=0 ); /* IE6-9 */
}




.card_fun div{  display: inline-block; }
.card_fun div p{ display: inline-block; vertical-align: middle; margin: 0; }
.card_fun div img{ width: 21px; }

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
    opacity: 0;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    background-image: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #cacaca;
    right: -2px !important;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    background-image: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #cacaca;
    left: -2px !important;
}

/*== 信用卡 ==*/

.ccard{
    position: relative;
}

.ccard .swiper-button-next, .ccard .swiper-button-prev{
  top: 10%;
}

.ccard .swiper-container{
    margin: 0 1.5rem;
}

.ccard .swiper-slide div a{
  display: block;
  width: 100%;
  text-align: center;
  color: #000;
  font-size: 14px;
  line-height: 2;
}

.ccard .top_Medal{
    font-family: 'Roboto', sans-serif;
    font-size: 21px;
    font-weight: 600;
    line-height: 2.2rem;
    position: absolute;
    top: 20px;
    left: 0;
    width: 35px;
    height: 45px;
    text-align: center;
    background-image: url(/img/component/topNew_img.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #601986;
}

.ccard .swiper-slide div a img{
    height: 90px;
    margin-top: 2rem;
}

/*--------------------- 卡排行 END -----------------------*/


/*--------------- 百葉窗 Tab (新卡訊) ---------------------*/
#new_card .card{
    border:none;
}
#new_card .card-header{
    padding: 0.35rem 1rem;
    border-bottom: 1px solid #fff;
    background-color: #d9ab3e;
}

#new_card .card-header h5 button{
    color: #fff;
    padding: 4px 12px;
}

#new_card .card_one a{
  display: block;
  text-align: center;
  width: 100%;
  color: #ad862a;
  font-weight: 600;
  line-height: 2;
}

#new_card .card-body{
  padding: 19px;
}

#new_card .card_one a img{
    width: 100%;

}

#new_card .card_info{
   margin: 0;
}

#new_card .card_info li{
    font-size: 14px;
    line-height: 1.3;
}

#new_card .card_more{
     position: absolute;
      right: 1rem;
      bottom: 1rem;
      font-size: 12px;
      padding: 0 5px;
      background-color: #d8ab3f;
      color: #fff;
      border-radius: 3px;
}
/*------------- 百葉窗 Tab (新卡訊) END ------------------*/

/*--------------- 人氣排行 -------------------*/


.favorite_card .swiper-slide{
  width: initial;
}
.favorite_card .swiper-slide a{
  display: inline-block; 
  padding: 0 5px;
}

.favorite_card .tab_menu .swiper-slide a{
   display: inline-block;
   position: relative;
   font-weight: 600;
   color: #555;
   padding: 7px 8px;
   transition: 0.2s;
}


.favorite_card .tab_menu .swiper-slide a:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 0px;
    transition: 0.2s;
}

.favorite_card .tab_menu .swiper-slide a:hover:before{
    height: 5px;
}

.favorite_card .swiper-card a p{    
    margin: 0;
    font-size: 18px;
    font-weight: 600; 
  }

.favorite_card .swiper-card .card_txt p{
   text-align: center;
   font-size: 15px;
}

.ccard .card_btn .btn-orange{ background-color: #fc9b1b; color: #fff;  width: 85%;} 
.ccard .card_btn .btn-gray{ background-color: #797979; color: #fff; } 

/*------------------------------- 人氣排行 END -------------------------------------*/


/*------------------------------- 優行動Pay -------------------------------------*/
.page-3.swiper-container{
 width: 100%;
}

.page-3.swiper-container .row{
  padding-top: 10px;
}

.page-3.swiper-container .page_txt{
  padding-left: 10px;
}

.page-3.swiper-container .page_txt p{
  margin:0;
  
}

.page-3.swiper-container .img_div{
  height: 110px;
}

.page-3.swiper-pagination{
  position: relative;
  width: 100%;
  padding: 10px 0 0 0;
}

.page-3 .swiper-pagination-bullet {
    width: 15px;
    height: 15px;
    background: #000;
    opacity: .1;
    margin:0 6px;
}

.page-3 .swiper-pagination-bullet-active{
    opacity: 1;
    background: #fc9b1b;
}

/*------------------------------- 優行動Pay END -------------------------------------*/



/*-------------------------- 關鍵字搜尋 bar --------------------------------*/
#search_bar{
  background-color: #e2e2e2;
  position: absolute;
  width: 100%;
  top: 0;
  z-index: -1;
}

#search_bar .form-row{
  padding: 5px 10px;
}

#search_bar .search_btn{
  padding: 0px;
  width: 100%;
  height: 36px;
  border-radius: 5px;
  background-color: #2f4593;
  color: #fff;
}

#search_bar .close_btn{
  background-color: #e2e2e2;
  padding: 6px 0;
}

/*---------------------------------------------- 新聞版區共用區 ----------------------------------------------*/

.bigcard .img_div{display: block; width:93vw; height:43.8vw; padding:8px 0; margin:0 auto; position: relative;}
.bigcard p{
    margin: 0;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    bottom: 0;
    width: 100%;
    font-size: 25px;
    padding: 5px 10px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
.nav-tabs .nav-item.news_tab .nav-link {
    justify-content: left;
    padding-left: 23px;
}

.nav-tabs .nav-item .top_link {
      background-image: url(/img/component/icon/more_icon.svg);
}

.cards-3 p {padding:5px;}

/*----------------------------------------------     共用區     ---------------------------------------------*/
.phone_hidden{display: none !important;}
.phone_block{display: block;}
.redius_bg{border-radius: 0;}
.photo{width:100%;}
.banner img{ width: 100%; height: auto;}
.w-100-ph{width:100% !important; height:210px !important;}
.ph-center{text-align: center;}
.wx-100-ph{max-width: 100% !important;}
.nav-tabs .nav-item.news_tab.news_tab_three {width:33.3% !important;}
.nav-tabs .nav-item.news_tab.news_tab_three.wx-100-ph {width:100% !important;}

.index-content-left{max-width: 100%;}

/*---------------------------------------------- 新聞次版區 ----------------------------------------------*/


.col{ flex-basis: auto; }
.container{padding:0; margin-top: 22vw;}
.index-content-right, .index-content-right-noMove{display: none;}
.news_list{border-bottom:none; margin:auto; width: 100%;}
.news_list.interests{ min-height: auto; border-bottom: 1px solid #ddd;}
/*.news_list_txt p{display: none;}*/
.news_list_txt h3{font-size: 25px; }
.news_list_txt span{font-size: 14px; color: #8d8d8d;}
.news_list_txt small{ font-size: 20px;}
.news_list_txt .fb_search_btn iframe{display: none; height: 20px; width: 100px; }
.news_list_img {width:42.7vw; height: 28.3vw;}
.news_list_txt .fb_search_btn{display: block; position: relative;}
.news_list_txt .cs_small{ display: initial; margin-bottom: 0; font-size: 18px;}
.news_list_txt .cs_small a{ font-size: 18px; color: #8b8b8b; }
/*.page{display: none;}*/



/*---------------------------------------------- 新聞內頁 ----------------------------------------------*/
.nav-tabs .nav-item.news_tab {width: 100% !important;}
.cards-3 .img_div { width: 95%; height: 28.3vw; }
.cards-3-ph a span{ text-align: left !important; font-size: 18px; font-weight: 600; color: #3148a3;}
.crumbs_row {width:100%;}
/*.detail_content img{ width: 100% !important; height: auto !important; }*/
.detail_content .con_img{ margin-right: 0; position: relative;}
.detail_content .img_zoonOut{ background-color: rgba(0, 0, 0, 0.5); padding: 5px; color: #fff; position: absolute; right: 0; }
.detail_content p{  position: relative; }
.detail_content iframe{ width: 100% !important;}

.PrevNext_div{ position: fixed; top: 45vh; z-index: 100; font-size: 30px; line-height: 0; padding: 10px 5px; background-color: rgba(0, 0, 0, 0.5);}
.PrevNext_div a{ color: #fff; }
.PrevNext_div.prev_btn{ left: 0; }
.PrevNext_div.next_btn{ right: 0; }
#PrevNext_footer{ background-color: #fff; }
#PrevNext_footer a{ color: #bbb; }
#PrevNext_footer a p{ color: #146fb2; font-size: 13px; }
.table_div{ overflow: auto; }
.table_div table{width: 100% !important;}
.table_div tr td{word-break: break-all; }
.table_div tr td img{ width: 100% !important; height: auto !important;}

/*---------------------------------------------- pay區 ----------------------------------------------*/
.ticketbg .move_3 {margin:auto; width: 100%; padding: 20px 10px; height: 230px;}
.ticketbg .move_3 .all_form img{ max-width: 100%; height: 65px;}
.ticketbg .move_3 h4{ font-size: 19px; }
.pay-4{margin:0 auto;}
.detail_content span{padding:0;}
.detail_title .row.ticketbg2 h1{margin-bottom: 0; padding: 0; text-align: center; font-size: 40px;}



/*---------------------------------------------- ticket區 ----------------------------------------------*/
.ticketbg .move_2 {width:99%;}

/*---------------------------------------------- 集點區 ----------------------------------------------*/
.ticketbg .move_2 {width:99%;}
.detail_content .shop_txt {display: block;}


/*---------------------------------------------- 卡情報區 ----------------------------------------------*/


/*--- 卡總覽 ---*/
.cc_fun_icon{ width: 100%; }
.credit_table .bank_div{ border-right:0px; background-color: #fdf4de;}
.credit_icon li{ width: auto; }
.tab-content .credit_icon img{margin:3px;}

/*--- 銀行總覽 ---*/
.detail_title .row.ticketbg .col-md-8 hr{ width: 100%; }


.four_tab {
    width: 25% !important;
    letter-spacing: 5px;
}
.ticketbg .bank_3 {margin:auto;}
.ticketbg .bank_3.bank_list_ph{  }
.bank_btn{text-align: center;}
.card_name{text-align: center;}
.imp_int .card-header {height: auto;}
.imp_int .card-header .angle_down{line-height: 1;}
.tab-content .credit_icon {display: block; text-align: center;}
.nav {justify-content: center;}
.cards-3 p {padding-top:8px; padding-bottom: 10px; padding-left: 5px; padding-right: 5px; font-size: 20px;}
.cards-3 span{display: block; padding:8px 0;}
.bank_all_small_img img{ height: 90px; }
.bank_all_img img{display: block; margin:auto; height: 90px;}
.detail_title .debit_card .cardRank a{ transform: scale(0.85) translateX(-10px); }

/*-- 新卡訊 --*/
.ccard_sp_ul{ list-style: none; padding: 0; }


/*----------------------------------------- 卡情報單卡頁區----------------------------------------------*/
.debit_card .card_btn .btn-block{ width: 100%; }
.credit_boot{overflow: auto;}
.cc_fun{ width: 100%; }
.angle_down{ font-size: 30px; line-height: 1;  padding-top: 0;  padding-bottom: 0; }
.tab-content .credit_boot table{ width: 550px; }



/*-----------------------------------------卡排行區----------------------------------------------*/
.rank-4 {margin:auto;}
.card_list_txt h2{margin-top: 10px; text-align: left; word-break: break-all;}
.card_list_txt .card_name_a{ display: block; position: absolute; top: -110px; right: 5px; width: 45%; }
.rank_hot .card_list_txt ul li{text-align: left;display: block; }
.rank_hot .col-md-7{  margin-left: 0px; }
.rank_hot .col-md-4{ max-width: 50%;flex: auto;}
.rank_hot .col-md-5{ max-width: 50%;flex: auto;}
/*.rank_hot .col-md-7{ max-width: 58.333333%;flex: auto;}*/
.ccard .top_Medal{top: 4px;left: 59px;}
/*.rank_hot .col-md-1 {height: 60px;}*/
.modal_prize h1 {margin-top: 0;}
.modal_prize .top_prize{top:0px; left: 5px; z-index: 1;}
.popular_prize .top_prize {position: absolute; top:-9px !important; left: 5px;}
.card_list_txt{text-align: center;}
.card_list_txt ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}
.phone_card ul{text-align: left; margin-left: 65px;}
.rank_boot{overflow: auto;}
.rank_boot table{width:100%;}
.rank_care h5{ height: auto; font-size: 16px; }
.rank_care .rankas_img{ height: 75px; }
.rank_care .rank_btn a{ width: 110px; height: 35px; }
.rankasable_img.cc_pref_img{ width: 30px; }
.card b{display: inline-block; padding:0 10px;}
.ranksearch_list li {width:135px !important;}
.ranksearch_list ul li a {font-size: 15px;}
.ranksearch_list .rank_shop{padding:0 !important;}
.profit_shop ul li a{text-align: left !important;}
.profit_shop img{margin-left:8px;}
.phone_list li{width: 280px !important;}
.rank_order.active:after{right: 0px;}


/*----------------------------------------- 優旅行區----------------------------------------------*/
.nav-tabs .nav-item.news_tab.news_tab_three{width:100%;}
.travel_list {padding:0;}
.travel_list h6{text-align: center;}
.travel_info p {line-height:18px;}
.dt_main02{height: 525px !important;}
.travel_main {width: 93vw;}
.travel_main .img_div { width: 93vw; height: 63vw;}


/*----------------------------------------- 會員中心----------------------------------------------*/
.about_bg .col-md-3{text-align: center;}
.about_bg .col-md-5{text-align: center;}
.about_bg h2 {color:#fff; margin: 0; padding: 0;}
.sign_info .blue_tab_btn{text-align: center;}
.sign_info .blue_tab_btn button{width:60%;}
.login_info .col-sm-2 {
  background-color: #fff;
  text-align: left;
  color: #495057;
  border-bottom: 1px #fff solid;
  padding: 15px;
}
.login_info .col-sm-10 {border-bottom: 1px solid #fff;}
.login_info .col-sm-10.login_w input {width: 100%;}
.user_info ul{border-right: 1px solid #fff; padding-right: 0;}
.check_in .col-sm-3 {
    
    text-align: left;
    padding: 15px;
}
.check_in .col-sm-9 {border-bottom: 1px solid #fff; padding: 10px;}
#add_card{ width: 100%; }
#add_card .date_w input[type="text"]{ width: 30%; }
#add_bill{ width: 100%; }
#add_bill .date_w input{ width: 75%; margin: 5px 10px; }
.mycard_more_btn{top: 6px; right: 6px; background-color: #fff; color: #36a6e8; }

.new_consume_category{ text-align: center;  padding: 10px;  background-color: #f5f5f5;}
.new_consume_category div:nth-child(2) input{width: 50% !important; display: inline-block; }


/*----------------------- 網友留言 -------------------------------*/
.discuss_content .d_mem_txt{ width: 75%; }
.discuss_content .d_mem_edit{position: relative; right: 0; top: 0px; padding: 5px;  font-size: 18px;  background-color: #e7e7e7;  }

/*----------------------- 網友留言 END -------------------------------*/



/*------------------------------------------- 廣告 -------------------------------------------------*/
.ad_fixed_ph img { width: 100% !important; height: auto !important;}
.ad_fixed_ph{ position: fixed; bottom: 0; left: 0; width: 100%; z-index: 10;}
.ad_fixed_ph .sub_slide .swiper-button-next, 
.ad_fixed_ph .sub_slide .swiper-container-rtl .swiper-button-prev, 
.ad_fixed_ph .sub_ph_slide .swiper-button-next, 
.ad_fixed_ph .sub_ph_slide .swiper-container-rtl .swiper-button-prev{
  top: 27%;
}

.ad_fixed_ph .sub_slide .swiper-button-prev, 
.ad_fixed_ph .sub_slide .swiper-container-rtl .swiper-button-next, 
.ad_fixed_ph .sub_ph_slide .swiper-button-prev, 
.ad_fixed_ph .sub_ph_slide .swiper-container-rtl .swiper-button-next{
  top: 27%;
}
}
/*----- 平板畫面 END -----*/



/*######################################################################## 手機 ################################################################################*/
@media (max-width: 420px){
  
 .container{ margin-top: 100px;}
 .bigcard .img_div{ width: 89vw;}
 .bigcard p{ font-size: 18px;}
 .cards-3 p{ font-size: 15px; }
 #iNews .word{ font-size: 20px;}
 .news_list_txt h3{ font-size: 18px;}
 .mb-md-tablet{margin-bottom: 35px !important;}
 .news_list_txt small{ font-size: 15px;}
}
/*----- 手機畫面 END -----*/






.rwd-table {
background: #fff;
overflow: hidden;
border: none !important;
}

.rwd-table tr:nth-of-type(2n){
background: #eee;
}

.rwd-table tr {
    border: 1px solid #ccc;
}

.rwd-table th,
.rwd-table td {
margin: 0.5em 1em;
width: 90% !important;
border: none !important;
background-color: rgba(0,0,0,0) !important;
}

.rwd-table tr td p{
  text-align: left !important;
}

.rwd-table {
min-width: 100%;
}

.rwd-table th {
display: none;
}

.rwd-table td {
display: block;
}

.rwd-table td:before {
content: attr(data-th) " : ";
font-weight: bold;
width: 12.5em;
display: block;
}

.rwd-table tr:not(:nth-child(1)) td[style*="background-color"]:before{
  content:'';
}

.rwd-table th, .rwd-table td {
text-align: left;
}

.rwd-table th, .rwd-table td:before {
color: #D20B2A;
font-weight: bold;
}

/*報稅特輯Menu*/
.news_list_menu .tax_menutext1, .list_menu .tax_menutext1{
	background-color: #ffc107; 
	color: #212529;
}

.news_list_menu .tax_menutext1:hover, .list_menu .tax_menutext1:hover{
	background: #172f87;
    color: #fff;
}

/*報稅特輯之跑馬燈資訊*/
#marquee{
    display: inline-flex;
    align-items: center;
    width: auto;
    height: 30px;
	float: right;
	margin: -29px auto auto auto;
	padding-right: 20px;
    /* overflow: hidden; */
    /* position: relative; */
    letter-spacing: 1px;
    font-size: 15px;
}

#marquee .row{ display: none; }
#marquee .row.show{ display: inline-flex;}
#marquee div .title{
	display: inline-block;
    color: #fff;
	background-color: #fc9b1b;
    height: 25px;
    width: auto;
	padding-left: 3px;
	padding-right: 3px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    border-radius: 5px;
}
.head_adstxt_title {
	width: auto;
	padding-left: 3px;
	padding-right: 3px;
    color: #fff;
	background-color: #fc9b1b;
    font-weight: bold;
    border-radius: 5px;
	float: left; 
	margin: auto auto auto 250px;
	display: inline;
}
.head_adstxt{
	float: left; 
	display: inline; 
	padding-left: 10px;
}
#marquee div .title:nth-of-type(1), .head_adstxt_title:nth-of-type(1){
	background-color: #172f87;
	animation:marquee-title-shine 2s linear infinite;
}
@keyframes marquee-title-shine{
	0%{
		background-color: #fc9b1b;
	}
	90%{
		background-color: #fc9b1b;
	}
	100%{
		background-color: #172f87;
	}
}
#marquee div .blue_txt{
    color: #3a56ab;
	font-weight: bold;
	width: 100px;
}

/*報稅特輯之顯示Button*/
.marquee_ph{
	position: absolute; 
    right: 10px; 
    width: 85px; 
    height: 40px; 
    background-color: rgba(255, 100, 100, 0.8); 
    border-radius: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
    transition: all 0.5s;;
}
.marquee_ph span{
	padding: 10px 10px 10px 10px;
}
.marquee_ph button{ 
    position: absolute; 
    left: -6px; 
    top: -6px; 
    border: 1px solid; 
    padding: 0; 
    border: 1px solid; 
    border-radius: 30px; 
    background-color: #d83181; 
    width: 20px; 
    height: 20px; 
    font-size: 12px; 
    color: #fff;
}

.marquee_ph a{
	text-decoration: none;
	text-decoration-line: none;
	color: #fff;
}


.crumbs .marquee_ph{top: -6px; width: 95px;}
.crumbs .marquee_ph a{color: #fff;}



/*新卡訊內文查看卡片*/
.detail_content .card_info_msghtml{
	width: 120px;
	height: 48px;
	margin-top: -5px;
	margin-left: 50px;
	font-weight: bold;
	background: #8d39cd; /* Old browsers */
	background: -moz-linear-gradient(top, #8d39cd 0%, #bc83e8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #8d39cd 0%,#bc83e8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #8d39cd 0%,#bc83e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8d39cd', endColorstr='#bc83e8',GradientType=0 ); /* IE6-9 */
	text-align: center;
	color: #fff !important;
  	border: none;
  	box-shadow: 2px 2px 2px #8d39cd;
	padding: 5px 5px 5px 5px;
}
.detail_content .card_info_msghtml:hover{ transform: translateX(1px) translateY(2px); }

/* 延伸閱讀 */
.further_read a > span {
  color: black;
  margin-right: 5px;
}

/* 行動卡內文熱門文字 */
.ph-hot-search {
  display: none;
}

/* table of contents插件for ckeditor */
.widget-toc{
	display: table;
	border: 1px solid #a2a9b1;
	background-color: #f8f9fa;
	padding-right: 1rem;
  line-height: 1.8;
  margin: 16px 0;
}

.widget-toc  ol {
	padding-right: 0px;
	counter-reset: item;
}
.widget-toc ol li {
	display: block;
	position: relative;
}
.widget-toc  ol li:before {
	content: counters(item, ".");
	counter-increment: item;
	position: absolute;
	margin-right: 100%;
	right: 0.5rem;
}

.toc-title{
    text-align: left;
    font-weight: 700;
    padding-left: 24px;
    margin: 0.8rem 0;
}

/* 跳轉錨點位置時，減掉header的高度 */
.cardshap :target::before {
  content: '';
  display: block;
  height:      105px;
  margin-top: -105px;
}

/* 浮水印位置 */
.index-content-left .expired_stamp {
  position: absolute;
  top: 26px;
  left: 250px;
}