﻿/* ----- 注意事項 ------ */
.InfoContent {
	background-color:#FFF; 
	padding:20px; 
	border-radius:10px; 
	box-shadow: 0 0 7px 3px rgba(0,0,0,0.2);
}


.noticebox__moreBtn {
    z-index:10;
}
.noticebox__moreBtn span {
    position: relative;
    font-size: 30px;
    line-height: 30px;
    font-weight: 700;
    padding:0 30px 0 20px;
}

.noticebox__moreBtn span:after {
    content: "";
    position: absolute;
    display: inline-block;
    top: 10px;
    right: 2px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 9.5px 0 9.5px;
    border-color: #ff4736 transparent transparent transparent;
    transition: all 0.2s ease-out;
}

.noticebox__moreBtn.noticebox-active span:after {
    transform: rotate(-180deg);
}

.noticebox__listbox {
    margin-top: 15px;
}

.noticebox__listbox {
    margin-top: 15px;
    overflow: visible;
    height: auto;
}

.subnotice_frame {
    background: #f5f5f5;
}

.subnotice {
    background: #f5f5f5;
    padding: 10px 10px;
}

.subnotice-title {
    color: #666;
    font-size: 32px;
    letter-spacing: 20px;
    padding: 25px 10px;
}

.subnotice-info {
    font-size: 13px;
}
.noticebox-wrap {
    padding-bottom: 20px;
}
.noticebox__list ol li {
    list-style: disc;
    margin-bottom:0px;
}
/* 全域格線 */
.activity_content {
    margin-top: 30px;
}
/*全域共用元素*/
.bg-fcfcfc{
    background: #fcfcfc;
}
.bg-f8f8f8{
    background: #f8f8f8;
}
.bg-F76C6C{
    background: #F76C6C;
}
.bg-FFB56E{
	background: #FFB56E;
}

.table-bordered {
    border: 2px solid #dee2e6;
}
.table > tbody > tr > td {
     vertical-align: middle;
}
.section-border{
    border-bottom:1px solid #f1ffcd;
}
.table-striped tbody tr:nth-of-type(2n+1) {
    background-color: rgba(0,0,0,0);
}
.common-line i{
    position: relative;
    width:90px;
    height:1px;
    background:#fed31d;
    display: inline-block;
    vertical-align: middle;
}
.common-line i:before{
    content: "";
    position: absolute;
    width:8px;
    height:8px;
    border-radius: 50%;
    background:#fed31d;
    display: inline-block;
}
.common-line .common-line_left:before{
    right:0;
    margin-top:-3px;
}
.common-line .common-line_right:before{
    left:0;
    margin-top:-3px;
}
.common-line abbr{
    vertical-align: middle;
    padding:0 20px;
}
.common-info{
    left:5px;
    top:5px;
    padding:2px 10px;
    background: #F0F8FF;
    border:#ADCDE5 1px solid;
    color:#4782AD;
    border-radius: 5px;
    font-style:normal;
}
.common-dotted-line{
    background-image: linear-gradient(90deg, #9b9b9b, #9b9b9b 75%, transparent 75%, transparent 100%);
    background-size: 15px 1px;
    border: none;
    display: inline-block;
    width:100%;
    height:1px;
}
.common-list li{
    list-style: disc;
    width: calc(100% - 20px);
    margin-left:20px;
}
/*全域文字顏色*/
body {
    color: #333333;
}
a,button{
    -moz-transition: all 0.4s ease-in;
    -o-transition: all 0.4s ease-in;
    -webkit-transition: all 0.4s ease-in;
    transition: all 0.4s ease-in;
}

/*標題顏色*/
.main-title {
    color: #444;
}

/*各險種按鈕*/
.btn--fubonBg {
    color: #EF8484;
    background: #FFEAEA;
    font-weight:bold;
    -moz-transition: all 0.4s ease-in;
    -o-transition: all 0.4s ease-in;
    -webkit-transition: all 0.4s ease-in;
    transition: all 0.4s ease-in;
}
.btn--fubonBg:hover {
    color: #fff;
    background: #E35959;
}

.activity-main-btn {
    display: inline-block;
    color: #ff5a39;
    background: #ffdccd;
    border-radius: 30px;
    padding: 8px 18px;
    min-width:150px;
    border:0px solid #fff;
    font-weight:bold;
}
.activity-main-btn.active {
    color: #fff;
    background: #fd4738;
}
.activity-main-btn:hover {
    color: #fff;
    background: #fd4738;
}
.activity-main-btn-green {
    display: inline-block;
    color: #6da947;
    background: #f0f4d3;
    border-radius: 30px;
    padding: 8px 18px;
    min-width:150px;
    border:0px solid #fff;
    font-weight:bold;
}
.activity-main-btn-green.active {
    color: #fff;
    background: #6da947;
}
.activity-main-btn-green:hover {
    color: #fff;
    background: #6da947;
	text-decoration:none;
}
.activity-main-btn-blue {
    display: inline-block;
    color: #2a416a;
    background: #61beff;
    border-radius: 30px;
    padding: 8px 18px;
    min-width:150px;
    border:0px solid #fff;
    font-weight:bold;
}
.activity-main-btn-blue.active {
    color: #fff;
    background: #2a416a;
}
.activity-main-btn-blue:hover {
    color: #fff;
    background: #2a416a;
	text-decoration:none;
}
/*---- 共用文字 ----*/
.main-text-label {
    margin: 10px 0 0 0;
}
.font-size-16{
    font-size:16px;
}
.font-size-24{
    font-size:24px;
}
.font-size-12{
    font-size:12px;
}

/* ----- Navbar -----*/
.logoborder {
    border-left: 1px solid #d2d2d2;
}

.nav_link_fixed {
    background: #888;
    padding-top: 20px;
    padding-bottom: 20px;
    position: fixed;
    right: 0px;
    bottom: 0px;
    left: 0px;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
    -moz-transition: -moz-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
    transition: transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
}
.nav_link_fixed a {
    position: relative;
    text-align: center;
    color: #fff;
    display: inline-block;
    text-decoration: none;
    width: 100%;
}

.nav_link_fixed.hidden {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

/* ----- 活動 ----- */
.popular a{
    text-decoration: none;
}
.popular_group p img{
	border-radius: 6px;
}
.kv-bg .kv-bg_item{
    height:300px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.activity_banner {
    
}
.content_item:before{
    content:"";
    display: inline-block;
    position: absolute;
    width:100%;
    height:90%;
    bottom:0;
    border-radius: 8px;
    border:1px solid #E9E9E9;
    border-bottom:2px solid #E9E9E9;
}
.content_item img{
    border-radius: 8px;
}
.content_item .align-self-center{
    padding:0 0 1rem 0;
}
.heading-reset {
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
}

.main-title {
    font-size: 30px;
    font-weight: 700;
}

.main-title-line {
    line-height: 0;
    text-align: center;
}

.main-text {
    display: block;
    padding: 30px 0;
}

.activity td {
    padding: 10px 5px;
    line-height: 24px;
}

.activity th {
    padding: 10px 5px;
    line-height: 24px;
}

.activity th.activity-table-cover {
    padding: 0 0;
}
.activity th.activity-table-cover img {
    width:100%;
}

.activity-notetext {
    text-align: left;
    font-size: 16px;
}

.bg-gray{
    background: #F5F5F5;
}
.bg-sky{
    background: #EDF7FD;
}
.activity-main-btn:hover,
.activity-login-btn:hover {
    text-decoration: none;
}
.content_table table th,
.content_table table td{
    vertical-align: middle;
}
.js-popular-maturity{
    display: none;
}
/* ----- 活動-更多說明內容 ------ */
.contentbox_notice{
    margin-top:8px;
    padding:0 15px;
    display: none;
}
.contentbox_notice:before{
    content:"";
    position: absolute;
    left:0;
    right:0;
    top:-20px;
    margin:auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 25px 30px 25px;
    border-color: transparent transparent #F5F5F5 transparent;
}
.current-item{
    height: 175px;
    background-color: rgba(255, 255, 255, 1);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center bottom;
/*     border:2px solid #E9E9E9; */
    margin-bottom:15px;
    border-radius: 8px;
    padding:10px 20px 10px 20px;
    position: relative;
    font-size: 16px;
    font-weight: 100;
    line-height: 1.5;
}
.contentbox_notice .current-item span{
    display: none;
}
.contentbox_notice .current-item span abbr{
    position: absolute;
    left:0;
    right:0;
    margin:auto;
    top:50%;
    transform:translateY(-50%);
    z-index: 11;
}
.contentbox_notice .current-item span:before{
    content:"";
    width:100%;
    height:100%;
    position: absolute;
    left:0;
    top:0;
    background: #666;
    z-index: 1;
    opacity: 0.9;
    border-radius: 8px;
    backdrop-filter: blur(10px);
}

.contentbox_notice .current-item span.current_date1_maturity:before,
.contentbox_notice .current-item span.current_date2_maturity:before,
.contentbox_notice .current-item span.current_date3_maturity:before,
.contentbox_notice .current-item span.current_date4_maturity:before{
    opacity: 0;
}
.contentbox_notice .current-item span.current_date1_last:before,
.contentbox_notice .current-item span.current_date2_last:before,
.contentbox_notice .current-item span.current_date3_last:before,
.contentbox_notice .current-item span.current_date4_last:before{
    opacity: 1;
    background: #F5F5F5;
    border:2px solid #B1D6EF;
}
.contentbox_notice .current-item .current-item_content{
    position: relative;
    top:50%;
    transform:translateY(-50%);
}
.contentbox_notice .current-item .current-item_content img{
    max-width:180px;
    position: relative;
    top:50%;
    transform:translateY(-50%);
}
.contentbox_notice .current-item .current-item_content img.common-money{
    max-width:150px;
}
.contentbox_notice .current-item .current-item_content img.common-point{
    max-width:140px;
}
.contentbox_notice .current-item .current-item_content img.common-switch{
    max-width:170px;
}
.contentbox_notice .current-item .current-item_content img.common-air{
    max-width:96px;
}
.contentbox_notice .current-item .current-item_content .item_content_img{
    height:80px;
}
.contentbox_notice .current-item .current-item_content .item_content_date{
    background: #fff;
    border:1px solid #D8D8D8;
    border-radius: 15px;
    padding:3px 0;
}
.common-lock{
   height:70px;
}
.font-d1d1d1{
    color:#D1D1D1;
}
/* 藍 */
.font-007bff{
    color:#007bff;
}
/* 紅 */
.font-e35959{
    color:#E35959;
}
/* 橘 */
.font-ff4736{
    color:#ff4736;
}
.font-5fa8d6{
    color:#5FA8D6;
}
.font-efefef{
    color:#efefef;
}
.font-fd6e51{
	color:#fd6e51;
}
.font-2a416a{
	color:#2a416a;
}
.font-288cae{
	color:#288cae;
}
.font-f115b1{
	color:#f115b1;
}

/* ----- 得獎名單 ------ */
.winning-list table{
    margin-bottom:0;
}
.js-current_winner_unexpired,
.js-current_winner_maturity,
.js-current_winner_hide_first,
.js-current_winner_hide_second,
.js-current_winner_notice_first,
.js-current_winner_notice_second,
.js-popular-maturity,
.js-popular-unexpired,
.js-gift_maturity,
.js-gift_unexpired,
.current_version,
.current_version_last,
.current_version_maturity{
    display: none;
}
.navbar__list__item.class1 {
/*     display: inline-block; */
}
.navbar__list__item.js-current_link_maturity,
.navbar__list__item.js-current_link_unexpired,
.js-current_link_unexpired,
.js-current_link_maturity,
.js-current_otherlink_maturity,
.js-current_otherlink_unexpired{
    display: none;
}
.js-gift_unexpired .content_item{
    
}
.js-gift_unexpired .content_item abbr{
    position: absolute;
    left:0;
    right:0;
    margin:auto;
    top:50%;
    transform:translateY(-50%);
    z-index: 11;
}
.js-gift_unexpired .content_item:before{
    content:"";
    width:100%;
    height:100%;
    position: absolute;
    left:0;
    top:0;
    background: #666;
    z-index: 1;
    opacity: 1;
    border-radius: 8px;
    backdrop-filter: blur(10px);
}
/* ----- 表格 ------ */
.rwd-table {
    border: 1px solid #d8d8d8;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
    /*.rwd-table-layout: fixed;*/
}

.rwd-table caption {
    font-size: 1.5em;
    margin: .5em 0 .75em;
}

.rwd-table tr {
    border: 1px solid #d8d8d8;
    padding: 0;
}

.rwd-table th,
.rwd-table td {
    padding: 10px 0;
    text-align: center;
    border-right:#d8d8d8 solid 1px;
}

.content_table_cell{
    display: none;
}
.table-bordered td, .table-bordered th {
    border: 1px solid #d8d8d8;
}
@media screen and (max-width: 991px) {
    .content_table_img{
        padding-top:15px;
    }
    .rwd-table {
        border: 0;
    }

    .rwd-table caption {
        font-size: 1.3em;
    }

    .rwd-table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .rwd-table tr {
        border-bottom: 1px solid #ddd;
        display: block;
    }

    .rwd-table td {
        line-height: 22px;
        border-bottom: 1px solid #ddd;
        display: block;
        text-align: left;
        padding:0;
    }
    .rwd-table th,
    .rwd-table td {
        border-right:#d8d8d8 solid 0px;
    }
    .rwd-table td div {
        display: table;
        margin: 0;
        width: 100%;
    }

    .rwd-table td div abbr {
        display: table-cell;
        vertical-align: top;
        text-align: center;
        padding:10px 5px;
        border-left:#d8d8d8 1px solid;
        vertical-align: middle;
    }
    .rwd-table td div abbr.cell-rowspan4 {
        position: relative;
        padding-top: 50px;
        z-index:2;
    }
    .rwd-table td div abbr.border-bottom {
        border-bottom: 1px solid #ddd;
    }
    .content_table_cell.border-none-bottom{
        border-bottom: 0px solid #ddd;
    }
    .rwd-table td div ul {
        display: table-cell;
        vertical-align: top;
        text-align: center;
        background: #EDF7FD;
        vertical-align: middle;
    }
    .rwd-table td div ul li{
        padding:10px 5px;
        background: #EDF7FD;
        position: relative;
        border-bottom:#d8d8d8 1px solid;
        height:100%;
    }
    .rwd-table td div ul li.border-none{
        border-bottom:#d8d8d8 0px solid;
    }
    .cell-title
    {
        width: 50%;
    }
    .cell-money,
    .cell-gift{
        width: 25%;
    }
    .rwd-table td div ul.cell-title abbr
    {
        border-left:#d8d8d8 0px solid;
    }
    .rwd-table td::before {
        content: attr(data-label);
        float: left;
        width:30%;
        text-align: center;
        font-weight: bold;
        text-transform: uppercase;
        position: relative;
    }

    .rwd-table td:last-child {
        border-bottom: 0;
    }
    .rwd-table tr.rwd-table_hidden,
    .rwd-table td.rwd-table_hidden{
        display: none;
    }
}
/* ----- RWD ------ */
@media(min-width:768px) {
    .popular_group{
        display: table;
    }
    .popular_list {
        white-space: normal;
        display: table-cell;
        width:25%;
    }
    .contentbox_notice.notice_01:before{
        left:14.5%;
        right:auto;
        top:-20px;
    }
    .contentbox_notice.notice_03:before{
        left:auto;
        right:14.5%;
        top:-20px;
    }
    .contentbox_notice.notice_04:before{
        left:23%;
        right:auto;
        top:-20px;
    }
    .contentbox_notice.notice_05:before{
        left:auto;
        right:23%;
        top:-20px;
    }
    .content_item_text{
        max-height:70px;
        height:70px;
    }
    .table-average-20{
        width:20%;
    }
    .table-average-40{
        width:40%;
    }
}
@media(min-width:992px) {
    .content_item .content_item_img{
        width:96%;
        margin:0 auto;
    }
    .content_table_img {
        padding-left:15px;
    }
    .content_table_img img{
        max-width:280px;
    }
    .content_item_text{
        max-height:60px;
        height:60px;
    }
    .average-width{
        width:16.6%;
    }
    .average-width2{
        width:17%;
    }
    .average-width3{
        width:32%;
    }
    .average-width4{
        width:20%;
    }
    .average-width5{
        width:40%;
    }	
}
@media(max-width:991px) {
    .kv-bg .kv-bg_item{
        height:auto;
    }
    .navbar__btn {
        top: 15px;
    }
    .navbar-toggler {
        top:12px;
        right:0;
        display: inline-block;
        position: absolute;
    }
    .navbar__list {
        margin: 15px -1rem 0;
        border-top: 1px solid #c9c9c9;
    }
    .activity td {
/*         padding: 15px 30px; */
    }

    .heading-reset {
        font-size: 16px;
    }
    .activity-table-cover{
        display: none;
    }
    .activity-main-btn {
        min-width: 150px;
        padding: 5px 10px;
    }
    .activity-main-btn.active {
        min-width:auto;
        margin-bottom:10px;
    }
	.content_item .common-info{
        padding:2px 4px;
	}
	.content_item .font16px{
		line-height:1.2;
		font-size: 14px;;
	}
	
}

@media(max-width:767px) {
    .order-left{
        padding-right:4px;
    }
    .order-right{
        padding-left:4px;
    }
    .order-left .content_item_text,
    .order-right .content_item_text{
        height:100px;
    }
    .noticebox__moreBtn span{
        font-size:23px;
        line-height: 23px;
    }
    .noticebox__moreBtn span:after{
        right: 3px;
        top:5px;
    }
    .noticebox__moreBtn.noticebox-active span:after{
        
    }
    
    .kv-content {
        padding-top: 30px;
    }
    .main-title {
        font-size: 23px;
    }
    .activity td,
    .activity th {
/*         padding: 25px 5px; */
    }

    .activity-login-btn {
        padding: 9px 15px;
    }

    .container--p {
        padding: 30px 15px 0 15px;
    }

    .contentbox_content .graphic-imgArea {
        display: inline-block;
        margin-bottom: 20px;
    }
    .content_item{
/*         margin-bottom:15px; */
    }
    .contentbox_notice {
        margin: 0 0 0 0;
        padding: 0 15px;
    }
    .activity_banner {
        margin-bottom:10px;
    }
    .nav_link_fixed .col-3 {
        padding:0 0;
    }
    .js-trigger.active:before{
        bottom:0px;
    }
    .contentbox_notice.notice_01:before{
        left:auto;
        right:20%;
        top:-20px;
    }
    .contentbox_notice.notice_02:before{
        left:20%;
        right:auto;
        top:-20px;
    }
    .contentbox_notice.notice_03:before{
        left:auto;
        right:20%;
        top:-20px;
    }
    .contentbox_notice.notice_05:before{
        left:20%;
        right:auto;
        top:-20px;
    }
    .common-info{
        left:2px;
        top:2px;
        padding:0px 3px;
        font-size:12px;
        line-height:20px;
    }
    .popular_group{
        position: relative;
        padding: 18px 0 3px 0;
        overflow: auto;
        white-space: nowrap;
        display: block;
    }
    .popular_list{
        display: inline-block;
        max-width:250px;
        vertical-align: top;
    }
    .popular_list{
        white-space: normal;
    }
	
}

@media(max-width:575px) {
    .activity tr:not(:first-child) td:last-child {
        width: 105px;
    }
    .common-line i{
        width:40px;
    }
}
@media screen and (max-width:991px) {
    .subnotice-title {
        letter-spacing: 1px;
    }
}

@media screen and (max-width:374px) {
    .subnotice-title {
        font-size: 30px;
        padding: 0;
    }
}
.section-bg {
	background:#f1ffcd no-repeat bottom center;
}
.section-bg2 {
	background:#f1ffcd no-repeat bottom center;
}

.navbar-light .navbar-nav .nav-link {
    color: #ff4736;
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
  color: rgb(255 0 137 / 70%);
}