/* 
講座所有頁說明: 請看 lecture.css 開頭
*/

/* 
備住:
 - container 位置跟lecture-it, lecture-design 不一樣
 - agenda-timeline, .session-table 是電腦優先 (max-width: 768px)
*/

/************************************** 
    agenda-timeline - start
***************************************/
/* NOTE: 大版 width 768px up */
.agenda-timeline {
    position: relative;
    padding-left: 20%;
}

/* Vertical line */
.agenda-timeline-item {
    position: relative;
    padding-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.agenda-timeline-item::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 7px;
    bottom: -10px;
    width: 5px;
    background-color: #e0e0e0;
}
.agenda-timeline-item:last-child::before {
    content: none;
}

/* Time slot */
.agenda-time-slot {
    position: absolute;
    left: -20%;
    width: 20%;
    padding-right: 20px;
    color: #808080;
    font-size: var(--fzSm);
    padding-top: 4px;
    font-weight: bolder;
    text-align: right;
}
/* Timeline dot */
.agenda-timeline-dot {
    position: absolute;
    left: -7px;
    top: 7px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #a9a9a9;
    -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
    transition: background-color 0.3s, -webkit-box-shadow 0.3s;
    -o-transition: background-color 0.3s, box-shadow 0.3s;
    transition: background-color 0.3s, box-shadow 0.3s;
    transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
}
.agenda-timeline-dot:hover,
.agenda-timeline-dot:focus,
.agenda-timeline-dot:active {
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.agenda-timeline-content {
    padding-left: 20px;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}

.agenda-timeline .agenda-timeline-content {}

.agenda-timeline-title {
    font-size: 18px;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 10px;
    -webkit-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
    color: #333333;
}


.agenda-timeline-title_1 ul li{
    
}

.agenda-speaker-block {
    margin-top: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 1%;
}
.agenda-speaker-modal-btn {
    width: 49%;
    position: relative;
    border: 1px solid #eeeeee;
    -webkit-box-shadow: 0px 2px 2px #aaaaaa;
            box-shadow: 0px 2px 2px #aaaaaa;
    padding: 15px;
    margin-bottom: 2%;
    text-align: left;
    /* transform: translateY(0px); */
}
.agenda-speaker-modal-btn:hover,
.agenda-speaker-modal-btn:focus,
.agenda-speaker-modal-btn:active {
    -webkit-box-shadow: 0px 0px 2px 1px #6f6f6f;
            box-shadow: 0px 0px 2px 1px #6f6f6f;
    /* transform: translateY(2px); */
}
.agenda-speaker-modal-btn::after {
    content: "\f002";
    font-family: "Font Awesome 5 Free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;    
    font-weight: 900;
    position: absolute;
    right: 0;
    bottom: 0;
    color: #45454585;
    opacity: 0;
    right: 5px;
    bottom: 5px;
    font-size: 18px;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
.agenda-speaker-modal-btn:hover::after {
    opacity: 1;
}

.agenda-speaker-topic {
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    position: relative;
    word-wrap: break-word;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.agenda-speaker-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-top: 1px solid #eeeeee;
    padding-top: 10px;
}
.agenda-speaker-avatar {
    width: 40px;
    height: 40px;
    -webkit-box-shadow: 0 0 0 3px #dddddd;
            box-shadow: 0 0 0 3px #dddddd;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 15px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.agenda-speaker-avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

.agenda-speaker-info {    
    font-size: var(--fzSm);
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}

.agenda-speaker-title {
    color: #777777;
    margin-bottom: 2px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    position: relative;
    word-wrap: break-word;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.agenda-speaker-name {    
    font-size: var(--fz4);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    position: relative;
    word-wrap: break-word;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}


/* NOTE: 小版 width 768px down */
@media (max-width: 768px) {
    .agenda-timeline {
        padding-left: 5px;
    }    
    
    .agenda-timeline-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .agenda-timeline-item::before {}
    
    .agenda-time-slot {
        position: relative;
        left: 0;
        width: 100%;
        padding-right: 0;
        padding-left: 18px;
        margin-bottom: 5px;
        text-align: left;
    }
    
    .agenda-timeline-dot {
        top: 6px;
        left: -6px;
    }
    
    .agenda-timeline-content {}

    .agenda-timeline .agenda-timeline-content {}

    .agenda-timeline-title {}

    .agenda-speaker-block {}
    .agenda-speaker-modal-btn {
        width: 100%;
        -webkit-box-shadow: 0px 0px 1px #aaaaaa;
                box-shadow: 0px 0px 1px #aaaaaa;
    }
    .agenda-speaker-modal-btn::after {
        opacity: 1;
    }
    .agenda-speaker-modal-btn:hover,
    .agenda-speaker-modal-btn:focus,
    .agenda-speaker-modal-btn:active {}
    .agenda-speaker-topic {}
    .agenda-speaker-row {}
    .agenda-speaker-avatar {}

    .agenda-speaker-avatar img {}

    .agenda-speaker-info {}

    .agenda-speaker-title {}
    .agenda-speaker-name {}
}
    
/************************************** 
    agenda-timeline - end
***************************************/



/************************************** 
    brand event pages - start
***************************************/
.main-event-brand {}

/* banner */
.content-bn-lecture.event-brand {
    padding: 0;
}
.content-bn-lecture.event-brand .container-content {}
.content-bn-lecture.event-brand .container-content .row {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.content-bn-lecture.event-brand .container-content .col-text {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 75%;
    padding: 0;
    border-width: 0px;
}
.content-bn-lecture.event-brand .container-content .col-text .img {
    padding: 0;
    border-width: 0px;}

.content-bn-lecture.event-brand .container-content .col-imgbox {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 75%;
    padding: 0;
    border-width: 0px;
}
.content-bn-lecture.event-brand .container-content .col-imgbox .img {
    padding: 0;
    border-width: 0px;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

@media screen and (min-width: 992px) {
    /* banner */
    .content-bn-lecture.event-brand {}
    .content-bn-lecture.event-brand .container-content {}
    .content-bn-lecture.event-brand .container-content .col-text {
        width: 50%;
    }
    .content-bn-lecture.event-brand .container-content .col-text .img {}
    .content-bn-lecture.event-brand .container-content .col-imgbox {
        width: 50%;
    }
    .content-bn-lecture.event-brand .container-content .col-imgbox .img {}
}






/* section */
.section-lecture.event-brand {
    padding: 0;
    background-color: #ffffff;
    color: #2c2b5e;
}

/* breadcrumb */
/* NOTE: 因為需要背景色，放在.event-brand-intro底下 */
.section-lecture.event-brand .nav-breadcrumb {
    background-color: #000000;
}

.nav-breadcrumb_1{

}


.section-lecture.event-brand .nav-breadcrumb_1 .breadcrumb-item a {
   color: #000000;
}


.section-lecture.event-brand .nav-breadcrumb .breadcrumb {
    font-weight: bolder;
    /* text-shadow: 1px 1px 2px #ffffff, 0px 0px 2px #ffffff; */
}
.section-lecture.event-brand .nav-breadcrumb .breadcrumb-item {
    color: #ffffff;
}
.section-lecture.event-brand .nav-breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.section-lecture.event-brand .breadcrumb-item + .breadcrumb-item::before {
    color: #ffffff;
}

.section-lecture.event-brand .event-brand-intro_1  .breadcrumb-item + .breadcrumb-item::before {
    color: #000000;
}

.event-brand-intro_1 .breadcrumb-item{
    color: #000000;
}

/* container */
.section-lecture.event-brand .container-event-brand {
    padding: 0 15px;
}
.section-lecture.event-brand .container-event-brand .regist-form {
    -webkit-box-shadow: 0 0 5px #80808052;
            box-shadow: 0 0 5px #80808052;
}


@media screen and (min-width: 992px) {
    /* setion */
    .section-lecture.event-brand {}
    .section-lecture.event-brand .nav-breadcrumb .breadcrumb-item {}
    .section-lecture.event-brand .nav-breadcrumb .breadcrumb-item a {}
    .section-lecture.event-brand .breadcrumb-item + .breadcrumb-item::before {}
    
    /* container */
    .section-lecture.event-brand .container-event-brand {}
    .section-lecture.event-brand .container-event-brand .regist-form {}

    /* .section-lecture.event-brand .event-brand-intro .text {} */
}


/* intro */
.event-brand-intro {
    background-color: #000000;
    color: #ffffff;
    padding: 20px 0px 30px;
}


.event-brand-intro_1 {
    background-color:#cdeefa;
    color: #ffffff;
    padding: 30px 0px 30px;
}

.event-brand-intro_1 h1{
    color: #3d3b3a;
  
}

.event-brand-intro_1 p{
    color: #3d3b3a;
}


.event-brand-intro_1 .session-table th{
    color: #000000;
}




.event-brand-intro .container-event-brand {}
.event-brand-title {
    font-size: var(--fztSecContenTitle);
    text-align: center;
    padding: 0 10px 0;
    margin: 10px 0;
}
.event-brand-subtitle {
    font-size: var(--fz4);
    text-align: center;
    margin: 10px 0;
}

@media screen and (min-width: 992px) {
    /* intro */
    .event-brand-intro {}
    .event-brand-intro .container-event-brand {}
    .event-brand-title {}
    .event-brand-subtitle {}
}

/* intro's session table */
.session-table {
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0 10px;
    table-layout: auto; /* 讓瀏覽器根據內容決定欄位寬度 */
}

.session-table th {
    padding: 10px 15px 0;
    text-align: left;
    font-weight: normal;
    color: #fff;
    white-space: nowrap; /* 防止表頭換行 */
}

.session-table td {
    background-color: #fff;
    color: #333;
    padding: 10px 15px;
}

.session-row {}
.session-head {
    font-size: var(--fz2);
    font-weight: bold;
    margin-left: 10px;
}

/* 設定最小寬度，防止欄位過窄 */
.session-table tr.session-row td:first-child {
    border-radius: 5px 0 0 5px;
    position: relative;
    min-width: 100px;
    white-space: nowrap;
}

.session-table tr.session-row td:nth-child(2) {
    min-width: 120px;
    white-space: nowrap;
}

.session-table tr.session-row td:last-child {
    border-radius: 0 5px 5px 0;
    /* 地址欄位自動佔用剩餘空間 */
    width: auto;
}

.session-table .sold-out-badge {
    position: absolute;
    left: -36px;
    top: 16px;
    background-color: #e53935;
    color: white;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 3px;
}

.session-table .date {
    font-size: var(--fz2);
    font-weight: bold;
}

.session-table .date small {
    font-size: 60%;
    font-weight: bolder;
    margin-left: 3px;
    margin-right: 3px;
}

.session-table .week {
    font-size: var(--fzSm);
    font-weight: bolder;
    margin-left: 5px;
}


.session-table .time {
    font-size: var(--fzSm);
    font-weight: bolder;
    margin-top: 5px;
}


.leature_bigbox{
    display: flex;
    align-items: center;
     margin-top: 20px;
     margin-bottom: 20px;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}

.leature_box{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background-color: #fff;
    border-radius: 13px;
    width: 23%;
    padding: 10px 20px;
    margin: 10px;
    height: 120px;
    position: relative;
  
   
}

.leature_box h1{
    font-size: 25px;
   
  
}

.sold-out-title{
    width: 60px;
    height: 60px;
    background: rgb(192, 2, 2);
    color: white;
    border-radius: 50px;
    position: absolute;
    top: -20px;
    left: -30px;
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}



.timer_box {

border: solid 2px #01719d;




}

.timer_box h1{
 padding: 8px;
 color: #01719d;
    font-size: 32px; 
    margin: 0;
}

.timer_box span{

    font-size: 25px; 
}

.timer_box{
    text-align: center;
}

.leature_box hr{
    border-top: solid 1px #3d3b3aa9;
    height: 1px;
    width: 100%;
    margin: 8px auto;
}

.leature_box p{
    font-size: 16px;
}

.container-content_1 img{
    width: 100%;
}

.nav-tabs_1{
    display: flex;
    justify-content: flex-start!important;
}

.modal-speakerbox_1{
    display: flex;
        align-items: center;
        justify-content: center;
        margin: 30px 0 15px 0;
     
    
}


.event-brand-agenda-nav_1 .nav-link:hover, .event-brand-agenda-nav_1 .nav-link:focus {
    color: white!important;
}

.modal-speakerbox_1 .modal-speaker-avatarbox{
    width: 190px;
    height: 190px;
    margin: auto;
    border-radius: 50%;
    border: 2px solid var(--course-color-brand2);
    overflow: hidden;
}

.modal-speakerbox_1 .modal-speaker-avatarbox img{
    width: 100%;
   
}

.modal-speaker-titlebox_1{
    display: flex;
    text-align: center;
 align-items: center;
font-size: 21px;
margin-left: 9px !important;




}

.event-brand-agenda-nav_1 .nav-link:first-child {
    width: 100%;
    color: white;
    background-color: #2c2b5e;
}

.event-brand-agenda-nav_1 .nav-link:hover, .event-brand-agenda-nav .nav-link:focus {
    color: white;
}


.modal-speaker-titlebox_1 br{
    display: none;
}


.modal-speaker-expbox_1{
margin-top: 8px;
}

.modal-speaker-expbox_1 ul li{
    list-style-type: disc!important;
}


.modal-speaker-expbox_1 ul {
    padding-left: 30px;
}

.agenda-timeline-content_1 ul li{
    list-style: disc!important;
}

.agenda-timeline-content_1 ul {
  padding-left: 15px;
}


@media (max-width: 768px) {
    /* intro's session table */
    .session-table {
        border-spacing: 0;
    }
    
    .session-table thead {
        display: none; /* 在手機上隱藏表頭 */
    }
    
    .session-table, .session-table tbody, .session-table tr {
        display: block;
        width: 100%;
    }
    
    .session-table tr {
        margin-bottom: 20px;
        border-radius: 5px;
        overflow: hidden;
        background-color: #fff;
    }
    
    .session-table td {
        display: block;
        width: 100%;
        position: relative;
        padding-top: 30px; /* 為標籤留出空間 */
        text-align: left;
        border-bottom: 1px solid #eee;
        white-space: normal; /* 在手機版允許換行 */
    }
    
    .session-table td:before {
        content: attr(data-label);
        position: absolute;
        left: 15px;
        top: 10px;
        font-weight: bold;
        font-size: 12px;
        color: #999;
    }
    
    .session-table td:last-child {
        border-bottom: none;
    }
    
    .session-row {}
    .session-head {
        font-size: var(--fz2);
        font-weight: bold;
        margin-left: 0;
    }
    .session-table tr.session-row td:first-child,
    .session-table tr.session-row td:last-child {
        border-radius: 0;
    }
    
    .session-table tr.session-row td:first-child {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }
    
    .session-table tr.session-row td:last-child {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }
    
    .session-table .sold-out-badge {
        left: auto;
        right: 15px;
        top: 10px;
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
    }

    .leature_box{
        width: 43%;
    }


    .timer_box h1{
        font-size: 25px; 
    }

    .timer_box{
        margin-top: 15px;
    }

    .event-brand-agenda-nav_1 .nav-link:first-child{
width: 100%;
    }

    .modal-speakerbox_1 {
        flex-direction: column;
    }

    .modal-speaker-titlebox_1 br{
        display: block;
    }
    
    .modal-speaker-titlebox_1{
        flex-direction: column;
        margin-top: 10px;
    }

    .modal-speaker-expbox_1 ul {
        padding-left: 0px;
    }
    
}







/* regist */
.event-brand-regist {  
    background-color: #e53935;
    background: url('../images/lecture/bg-brand01.webp') no-repeat center center/cover;
    padding: 40px 10px 10px;
}
.event-brand-regist .container-event-brand > .row {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.event-brand-regist .head {
    text-align: center;
    margin-bottom: 5%;
    font-size: var(--fz2);
}

.section-lecture.event-brand .notes-container {
    font-weight: bolder;
    padding: 1rem 0;
    margin: 20px 0 0px;
}

/* 注意事項 */
.section-lecture.event-brand .notes-container .notes-title {
    font-size: var(--fzhead);
    margin-bottom: 5px;
    color: #333333;
}
.section-lecture.event-brand .notes-container .notes-list {
    line-height: 1.6;
}
.section-lecture.event-brand .notes-container .notes-list li {
    font-size: var(--fzSm);
    color: #333333;
    line-height: 1.6;
    margin-bottom: 0.5rem;
}

/* regist form */
/* .section-lecture.event-brand .regist-form {
    height: 100%;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    background-color: #ffffff;
    border-radius: 10px;
    padding: 20px 20px 30px;
}
.section-lecture.event-brand .regist-form .head {
    font-size: var(--fztSecContenTitle);
    text-align: center;
}
.section-lecture.event-brand .regist-form .form-group {}
.section-lecture.event-brand .regist-form .form-input {}
.section-lecture.event-brand .regist-form .form-note {
    font-size: var(--fzSm);
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    line-height: 1.6;
}
.section-lecture.event-brand .regist-form .form-check {
    margin-top: 10px;
}
.section-lecture.event-brand .regist-form .read-link {
    color: #333333;
}
.section-lecture.event-brand .regist-form .submit-btn {}
.section-lecture.event-brand .regist-form .submit-btn:hover {} */

@media screen and (min-width: 992px) {
    /* regist */
    .event-brand-regist {
        padding: 60px 10px;
    }
    .event-brand-regist .row-grid {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 10px 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: auto;
        grid-template-rows: auto;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        grid-column-gap: 10px;
    }
    .event-brand-regist .row-grid > *:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .event-brand-regist .row-grid > *:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .event-brand-regist .feature {
        border-radius: 50px;
    }
    .event-brand-regist .head {
        font-size: var(--fztSecContenTitle);
    }
    .section-lecture.event-brand .notes-container {}
    .section-lecture.event-brand .notes-container .notes-title {}
    .section-lecture.event-brand .notes-container .notes-list {}
    .section-lecture.event-brand .notes-container .notes-list li {}

    /* regist form */
    /* .section-lecture.event-brand .regist-form {
        margin-top: 0;
        max-width: 100%;
    }
    .section-lecture.event-brand .regist-form .head {
        font-size: var(--fztSecContenTitle);
    }
    .section-lecture.event-brand .regist-form .form-group {}
    .section-lecture.event-brand .regist-form .form-input {}
    .section-lecture.event-brand .regist-form .form-note {}
    .section-lecture.event-brand .regist-form .form-checkbox {}
    .section-lecture.event-brand .regist-form .submit-btn {}
    .section-lecture.event-brand .regist-form .submit-btn:hover {} */
}




/* gift */
.event-brand-gift {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    padding: 30px 15px;
}
.event-brand-gift .title {
    font-size: var(--fztSecContenTitle);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 100%;
    text-align: center;
}
.event-brand-gift .title .deco-gift {
    position: relative;
}
/* .event-brand-gift .title .deco-gift::before {
    content: '';
    background-color: #eee;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    position: absolute;
    top: -2px;
    left: 50%;
    transform: translateX(-50%);
} */
.event-brand-gift .title .deco-gift .img {
    max-width: 33px;
    display: block;
    margin: 0 auto 5px;
    position: relative;
    z-index: 1;
}

.gift-item {
    text-align: center;
}
.gift-item img {
    max-width: 800px;
    width: 100%;
    margin: auto;
}



@media screen and (min-width: 992px) {

    /* gift */
    .event-brand-gift {
        /* flex-direction: row; */
    }
    .gift-item {}
    .gift-item img {
    }
}



/* agenda */
.event-brand-agenda {
    background-color: #ccd4db;
    background-position: top center;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url('../images/lecture/bg-brand02.webp');
    padding: 50px 20px 0px;
    /* margin-bottom: 50px; */
}
.event-brand-agenda .container-event-brand {}
.event-brand-agenda .agenda-title {
    font-size: var(--fztSecContenTitle);
    text-align: center;
    margin-bottom: 20px;
    color: #636363;
}
.event-brand-agenda .row {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
/* agenda header */
.event-brand-agenda-header {
    background-color: #ffffff;
    padding: 20px 15px;
    border-radius: 10px;
    -webkit-box-shadow: 3px -3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 3px -3px 6px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}
.event-brand-agenda-header .head {
    font-size: var(--fz2);
    font-weight: bolder;
    text-align: center;
    margin-bottom: 3%;
}

.agenda-header-summary {
    max-width: 930px;
    margin: 1% auto;
}
.agenda-header-summary .h4,
.agenda-header-summary h4,
.agenda-header-summary .h5,
.agenda-header-summary h5,
.agenda-header-summary .h6,
.agenda-header-summary h6 {
    margin: 1% 0;
}
.agenda-header-summary ul li {
    list-style: disc;
    margin-left: 20px;
}


/* agenda content */
.event-brand-agenda-content {}
.event-brand-agenda-nav {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 30px 0 0;
    gap: 5px;
    border-width: 0;
    margin-bottom: 0px;
}
.event-brand-agenda-nav .nav-link {
    width: 90%;
    padding: 15px 25px;
    font-size: var(--fz4);
    font-weight: bolder;
    color: #3f3f3f;
    background-color: #e9e9e9;
    -webkit-box-shadow: 0px -2px 2px rgba(0, 0, 0, 0.1);
            box-shadow: 0px -2px 2px rgba(0, 0, 0, 0.1);
    border-bottom: 2px solid #cacaca;
    border-left-width: 0px;
    border-right-width: 0px;
    border-radius: 3px;
}
.event-brand-agenda-nav .nav-link:hover,
.event-brand-agenda-nav .nav-link:focus {
    color: #333333;
}
.event-brand-agenda-nav .nav-link:first-child {
}
.event-brand-agenda-nav .nav-link.active {
    border-color: transparent;
    /* -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1; */
}
.event-brand-agenda-tab-content {
    padding-top: 20px;
    background-color: #ffffff;
    border-radius: 3px 3px 10px 10px;
}
.event-brand-agenda-tab-content .tab-pane {
    margin-bottom: 1rem;
    padding: 15px;
}


@media screen and (min-width: 992px) {
    /* agenda */
    .event-brand-agenda {
        /* padding: 50px 20px 30px; */
    }
    .event-brand-agenda .row {}

    /* agenda header */
    .event-brand-agenda-header {
        padding: 20px 20px 30px;
    }
    .event-brand-agenda-header .head {
        margin-bottom: 1%;
    }
    .agenda-header-summary {}
    .agenda-header-summary .h4,
    .agenda-header-summary h4,
    .agenda-header-summary .h5,
    .agenda-header-summary h5,
    .agenda-header-summary .h6,
    .agenda-header-summary h6 {}

    /* agenda content */
    .event-brand-agenda-content {}

    .event-brand-agenda-nav {
        margin: 0 0 1px;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    }
    .event-brand-agenda-nav .nav-link {
        width: auto;
        padding: 15px 20px;
        border-radius: 6px 6px 0 0;
        background-color: #ffffff;
        margin-right: 20px;
        -webkit-box-shadow: 0px -5px 6px rgba(0, 0, 0, 0.1);
                box-shadow: 0px -5px 6px rgba(0, 0, 0, 0.1);
    }
    .event-brand-agenda-nav .nav-link:last-child {
        margin-right: 0px;
    }
    .event-brand-agenda-nav .nav-link.active {
        -webkit-box-ordinal-group: unset;
            -ms-flex-order: unset;
                order: unset;
    }
    .event-brand-agenda-tab-content {
        padding-top: 30px;
    }
    .event-brand-agenda-tab-content .tab-pane {        
        margin-bottom: 2rem;
    }
    .event-brand-agenda-tab-content .tab-pane {}
}




/* lightbox -原廠活動活動頁 */
.lecture-modal-event-brand {}
.lecture-modal-event-brand .modal-dialog {}
.lecture-modal-event-brand .modal-content {}
.lecture-modal-event-brand .btn-close {}
.lecture-modal-event-brand .modal-content .modal-body {
    padding: 16px 40px 50px;
}
.lecture-modal-event-brand .modal-body .modal-speakerbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 16px;
    padding-bottom: 8px;
}
.lecture-modal-event-brand .modal-speaker-avatarbox {
    width: 150px;
    height: 150px;
    margin: auto;
    border-radius: 50%;
    border: 2px solid var(--course-color-brand2);
    overflow: hidden;
}
.lecture-modal-event-brand .modal-speaker-avatarbox .img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.lecture-modal-event-brand .modal-speaker-titlebox {
    text-align: center;
    min-width: 200px;
    margin: auto;
}
.lecture-modal-event-brand .modal-speaker-tag {
    border: 2px solid #dddddd;
    border-radius: 10px;
    padding: 2px 5px;
    margin: 2px auto 5px;
    display: inline-block;
    background-color: transparent;
    color: var(--text-bk);
    
}
.lecture-modal-event-brand .modal-speaker-title {
}
.lecture-modal-event-brand .modal-speaker-name {
    font-size: var(--fz2);
}
.lecture-modal-event-brand .modal-speaker-expbox {
    padding-left: 25px;
}
.lecture-modal-event-brand .modal-speaker-expbox ul {}
.lecture-modal-event-brand .modal-speaker-expbox li {
    list-style: disc;
}
.lecture-modal-event-brand .modal-sessionbox {
    border-top: 2px solid #eeeeee;
    padding-top: 15px;
}
.lecture-modal-event-brand .modal-sessionbox .modal-sessionbox-head {
    margin: 10px 0;
}

@media screen and (min-width: 992px) {
    /* lightbox -原廠活動活動頁 */
    .lecture-modal-event-brand {}
    .lecture-modal-event-brand .modal-dialog {}
    .lecture-modal-event-brand .modal-content {}
    .lecture-modal-event-brand .btn-close {}
    .lecture-modal-event-brand .modal-body {}
    .lecture-modal-event-brand .modal-body .modal-speakerbox {}
    .lecture-modal-event-brand .modal-speaker-avatarbox {
        max-width: 21%;
        margin: 0;
    }
    .lecture-modal-event-brand .modal-speaker-avatarbox .img {}
    .lecture-modal-event-brand .modal-speaker-titlebox {
        text-align: left;
        max-width: 33%;
        margin: 0;
    }
    .lecture-modal-event-brand .modal-speaker-tag {}
    .lecture-modal-event-brand .modal-speaker-title {}
    .lecture-modal-event-brand .modal-speaker-name {}
    .lecture-modal-event-brand .modal-speaker-expbox {
        max-width: 40%;
    }
    .lecture-modal-event-brand .modal-speaker-expbox ol li {}
    .lecture-modal-event-brand .modal-sessionbox {}
    .lecture-modal-event-brand .modal-sessionbox .modal-sessionbox-head {}
}






/* speaker */
/* .card-speaker-group {}
.card-speaker-group .card-speaker {
    height: auto;
    margin-bottom: 20px;
    padding: 15px 10px;
}
.card-speaker-group .card-speaker .row {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.card-speaker-group .card-speaker .speaker-imgbox {
    border-radius: 50%;
    overflow: hidden;
    width: 100%;
    max-width: 135px;
    margin: 10px auto;
    border: 2px solid #bebebe;
}
.card-speaker-group .card-speaker .speaker-imgbox .img {}
.card-speaker-group .card-speaker .speaker-name {
    font-size: var(--fz2);    
    text-align: center;
}
.card-speaker-group .card-speaker .speaker-title {
    font-size: 1rem;  
    text-align: center;
    border-bottom: 1px solid #e9e9e9;
    padding: 5px 0 15px;
    margin-bottom: 15px;
}
.card-speaker-group .card-speaker .speaker-info {
    font-size: 1rem;
    margin-left: 10px;
    margin-right: 10px;
}
.card-speaker-group .card-speaker .speaker-info ul li {
    list-style: disc;
}

@media screen and (min-width: 992px) {
    .card-speaker-group {}
    .card-speaker-group .card-speaker {}
    .card-speaker-group .card-speaker .row {}
    .card-speaker-group .card-speaker .speaker-imgbox {}
    .card-speaker-group .card-speaker .speaker-imgbox .img {}
    .card-speaker-group .card-speaker .speaker-name {
        text-align: left;
    }
    .card-speaker-group .card-speaker .speaker-title {
        text-align: left;
        border-width: 0px;
        padding: 0;
    }
    .card-speaker-group .card-speaker .speaker-info {}
} */



/* cta */
.event-brand-cta {
    background-color: #ccd4db;
    padding: 0px 15px 30px;
}
.section-lecture.event-brand .event-brand-cta .container-event-brand {
    /* background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeebeb));
    background: -o-linear-gradient(top, #ffffff 0%, #eeebeb 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #eeebeb 100%); */
    background: url('../images/lecture/bg-event-brand-cta.webp?0502') center center / cover;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    padding-left: 0;
    padding-right: 0;
    color: #ffffff;
    text-shadow: 0 0 5px #0f0c74;
}
.event-brand-cta .container-event-brand .deco-ribbon {
    position: absolute;
    top: 4%;
    right: -16%;
    width: 60%;
    -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
            transform: rotate(30deg);
}
.event-brand-cta-textbox {
    text-align: center;
    padding: 20px 10px;
    position: relative;
    /* border: 1px solid #e3e3e3; */
    /* text-shadow: 0 2px 5px #faf4ff; */
    z-index: 1;
    opacity: 0.9;
}
.event-brand-cta-textbox .head {
    font-size: var(--fz2);
    /* font-size: 15px;
    letter-spacing: 1px;
    background-color: #0000009c;
    display: inline-block;
    padding: 5px 8px 5px 12px;
    border-radius: 20px;
    text-align: center; */
    margin-bottom: 0.5rem;
}
.event-brand-cta-textbox .subhead {
    font-size: var(--fz2);
    margin-top: 0.5rem;
    margin-bottom: 2rem;
}
.event-brand-cta-textbox .btn {
    position: relative;
    overflow: hidden;
    border: 1px solid #866eff;
    background-image: -o-linear-gradient(left, #bdb2f5 0%, #887eb9 33%,#5a5191 100%);
    background-image: -webkit-gradient(linear, left top, right top, from(#bdb2f5), color-stop(33%, #887eb9),to(#5a5191));
    background-image: linear-gradient(to right, #bdb2f5 0%, #887eb9 33%,#5a5191 100%);
    color: #ffffff;
    border-width: 0px;
    -webkit-box-shadow: 1px 1px 5px rgba(62, 60, 77, 0.5);
            box-shadow: 1px 1px 5px rgba(62, 60, 77, 0.5);
    text-shadow: none;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.event-brand-cta-textbox .btn:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: 0px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #ffffffab;
    -webkit-animation: shiny-btn 3s ease-in-out infinite;
            animation: shiny-btn 3s ease-in-out infinite;
}
.event-brand-cta-textbox .btn:hover:before {
    -webkit-animation-play-state: paused;
            animation-play-state: paused;
}

@-webkit-keyframes shiny-btn {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

@keyframes shiny-btn {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

@media screen and (min-width: 992px) {
    /* cta */
    .event-brand-cta {}
    .section-lecture.event-brand .event-brand-cta .container-event-brand .event-brand-cta .container-event-brand {}
    .event-brand-cta .container-event-brand .deco-ribbon {
        position: absolute;
        top: 12%;
        right: -6%;
        width: 100%;
        max-width: 500px;
        -webkit-transform: rotate(30deg);
            -ms-transform: rotate(30deg);
                transform: rotate(30deg);
    }
    .event-brand-cta-textbox .head {
        font-size: var(--fztSecContenTitle);
    }
    .event-brand-cta-textbox .subhead {}
    .event-brand-cta-textbox .btn {}
}




/*  */
.event-brand-last {
    background-color: #ccd4db;
    padding-bottom: 10px;
}
.event-brand-last .container-event-brand {

}
/************************************** 
    design event pages - end
***************************************/