﻿.bgcolor0{background:url(../images/0811028_6_bg0.png) center, linear-gradient(to bottom, #86a9d9 0%,#c0d4ef 48%,#ffffff 80%,#ffffff 100%);}
.bgcolor1{background:url(../images/0811028_6_bg0.png) center, linear-gradient(to top,  #ffeb16 0%,#ffffff 71%);}
.bgcolor2{background:url(../images/1107058_tv.png) center}
.fcolor1{color:#eb4944;}
.mr-1{margin-right:0.25rem;}
.mr-2{margin-right:0.5rem;}
.pl-4{padding-left:1rem;}
.sp-my{margin-top:-15px;}
.overflow-hidden{overflow:hidden;}
ul, li{list-style-type:none;}
/*event*/
#Master_title{justify-content:center;align-items:center;margin:auto;padding:0 0 1rem;}
#Master_title h1{justify-content:center;align-items:center;color:#0165a1;font-size:7rem;line-height:8.5rem;margin:1rem auto;font-family:MElleHK, 'Noto Serif TC', serif;text-shadow:2px 0 2px white, -2px 0 2px white, 0 2px 2px white, 0 -2px 2px white, 0 0 15px white;}
.lec-circle{text-shadow:initial;width:100%;text-align:center;}
.lec-circle span{background-color:#0165a1;color:white;font-size:6rem;width:8rem;height:8rem;line-height:8rem;border-radius:100%;display:inline-flex;align-items:flex-end;justify-content:center;}
.lec-circle b{font-family:MElleHK, 'Noto Sans TC', sans-serif;}
.des-wrap{width:35%;font-size:2rem;}
.lec-des{background:linear-gradient(to right,  #7a88b9 0%,#3798c5 100%);border-radius:1.5rem;color:white;position:relative;display:inline-block;padding:0 1rem 0 2.5rem;text-align:left;margin-bottom:2rem;}
.lec-des::before{content:'';top:1px;left:10px;border-radius:5rem 0 0 5rem;position:absolute;height:98%;width:8px;background:linear-gradient(to bottom,  #FFEF49 0%,#FFF26B 100%);}
.lec-des2{color:#3257a7;font-family:"CHei3HK","Microsoft YaHei";transform:rotate(15deg);position:relative;}
.lec-line::before{content:'';width:3px;height:6rem;background-color:#3257a7;top:-25px;left:4rem;position:absolute;transform:rotate(-25deg);}
.lec-line::after{content:'';width:3px;height:6rem;background-color:#3257a7;top:-25px;right:4rem;position:absolute;transform:rotate(30deg);}
.teacher-cont{justify-content:center;align-items:flex-start;}
.tea-box{display:flex;flex-wrap:wrap;width:calc(100%/6);}
.tea-box img{margin:auto;}
.tea-box dl{display:inline-flex;align-items:center;width:100%;margin:-1rem auto auto;justify-content:center;}
.tea-box dl dt{width:4.5rem;height:4.5rem;background:linear-gradient(to bottom, #d3ba9d 2%,#4a2700 10%,#080808 80%);border:5px solid #fbd268;color:white;border-radius:100%;display:flex;flex-wrap:wrap;;align-items:center;justify-content:center;font-weight:bold;z-index:2;text-align:center;}
.tea-box dl dd{background:linear-gradient(to bottom, #fec02f 0%,#f4e3a6 50%,#d9aa4c 80%,#e4a52b 100%);border:3px solid #f4c93c;color:#120d09;border-radius:2rem;padding:0.25rem 1rem 0.25rem 2.5rem;font-size:1.5rem;font-weight:bold;margin-left:-2rem;}
.tea-box dd small{font-size:1rem;font-family:initial;margin-left:0.25rem;}
/* 精彩實戰解題 */
#event_master h2{font-size:3rem;text-align:center;padding:0.5rem 0 1rem;color:#eb4944;}
.showtime{background-color:#3f488d;border-radius:1.5rem 1rem 1rem 1rem;margin:1rem auto 3rem;padding:0 0 1rem;}
.mb-0{margin-bottom:0;}
.showtitle{}
.venue{background-color:white;color:#3f488d;font-size:2rem;font-weight:bold;border-radius:3rem;border:8px solid #3f488d;padding:0.25rem 2rem 0.25rem 1.5rem;position:relative;top:-1rem;width:fit-content;}
.venue i{padding:0 0.5rem 0 0;}
.address{color:white;font-size:1.75rem;padding:0.5rem 0 0 1rem;}
.showtime ul{display:flex;flex-wrap:wrap;justify-content:center;}
.showtime ul li{background-color:white;margin:1rem 0.5rem;padding:1rem;width:calc(95%/2);font-size:1.75rem;}
.date{border-right:1px solid #f4c93c;padding:0 2rem;margin:1rem 1rem auto 0;}
.topic{border-radius:1rem;padding:0 1rem;margin:auto 1rem auto auto;font-size:1.55rem;background-color:#4a2700;color:white;}
.coming{color:#eb4944;font-size:3rem;font-weight:bold;text-align:center;padding:1rem 0;}
.gift{font-size:2rem;align-items:center;width:fit-content;margin:auto;padding:2rem 1rem;}
.gift i{font-size:5rem;transform:rotate(-5deg);color:#eb4944;}
.gift li{padding:0 0 0 2rem;}
.schedule{text-align:center;padding:0.5rem 0;}
.schedule a{cursor:pointer;color:white;font-size:1.75rem;border:1px solid;padding:0 0.75rem;text-decoration:none;}
.raffle{background:linear-gradient(45deg, #eb4944, #9c27b0);color:white;transform:skewX(-10deg);display:inline-block;padding:0 1rem;margin:auto 0.75rem auto 0;font-size:1.75rem;}
.stream{width:calc(100%/2 - 4rem);margin:2rem auto;box-shadow:rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;border-radius:0.5rem;overflow:hidden;}
.stream a{position:relative;display:block;}
.stream i{color:#FF0000;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;z-index:2;font-size:4rem;background-color:white;width:60px;height:40px;display:flex;align-items:center;justify-content:center;}
.video-placeholder{position:relative;width:100%;padding-bottom:56.25%;height:0;}
.video-placeholder iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;}
/* aside */
.guide-btn{width:100%;bottom:0;left:0;position:fixed;z-index:3;margin:0;}
.guide-btn > div{width:100%;background:linear-gradient(to bottom, #fec02f 0%,#f4e3a6 50%,#d9aa4c 80%,#e4a52b 100%);padding:1rem 0;justify-content:center;}
.guide-btn a{color:#120d09;margin:auto 1.5rem;font-size:1.5rem;text-decoration:none;z-index:2;}
.guide-btn:before{display:block;width:0;height:100%;position:absolute;right:0;bottom:0;background:linear-gradient(90deg,#fec02f 0%,#f4e3a6 45%,#e4a52b 100%);content:'';animation:infobe 10s infinite;}
.askclick{background:linear-gradient(to bottom, #fec02f 0%,#f4e3a6 50%,#d9aa4c 80%,#e4a52b 100%);color:#120d09;right:0;border-radius:1rem 0 0 1rem;}
@-webkit-keyframes infobe{
    0%{right:0;left:auto;width:0}
    10%{right:auto;left:0;width:0}
    48%{right:auto;left:0;width:100%}
    52%{right:0;left:auto;width:100%}
    90%{right:0;left:auto;width:0}
    100%{right:0;left:auto;width:0}
}
@keyframes infobe{
    0%{right:0;left:auto;width:0}
    10%{right:auto;left:0;width:0}
    48%{right:auto;left:0;width:100%}
    52%{right:0;left:auto;width:100%}
    90%{right:0;left:auto;width:0}
    100%{right:0;left:auto;width:0}
}
#community_full{width:calc(100%/3*2);}
.platform .youtube-wrap{width:calc(100%/3);background-color:#D01818;padding:0.75rem 0;color:#ffed00;}
.platform a{font-size:1.3em;color:white;font-weight:bold;}
.social-qr{height:100%;}
.get_resource img{display:none;}
.bulletin{position:fixed;top:25%;right:0.25rem;text-align:right;}
.bulletin i{display:block;margin-bottom:0.5rem;}
.bulletin i:hover{transform:initial;}
.click_tag:hover{color:white;}
#askarea_out{background-color:#0165A1;}
#askarea input[type="submit"], #askarea input[type="reset"]{background-color:#fbd268;}
#back-top a{color:#f77e63;}
.askclick{bottom:auto;}
.announce{bottom:calc(10% + 128px);top:auto;}
@media screen and (min-width:1201px) and (max-width:1920px){
    .tea-box dl dd{font-size:1.25rem;}
    @media screen and (max-width:1280px){
        .tea-box dl dd{font-size:1.1rem;}
        .tea-box dl dd small{display:inline-block;}
    }
}
@media screen and (min-width:1201px){   
    .row100{width:100%;}
    /*資料集中1200px寬外框*/
    #event_master{padding:2rem;}
    #event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{margin:2% auto;padding:10px;}
    #Master_title{padding:0;}
    .gift{display:flex;flex-wrap:wrap;}
    .askclick{font-size:1.5rem;}
    .lec-circle b{font-weight:500;}
}
@media screen and (max-width:1535px){
    #community_full .get_resource{align-items:flex-start;}
    .get_resource ul{margin:0 auto auto;}
    .get_resource li{width:100%;}
}
@media screen and (max-width:1200px){   
    #BodyContainer_event #Master_title{margin-top:10%;padding-top:2rem;}
    #Master_title h1{width:100%;}
    .tea-box{width:calc(100%/3 - 2rem);}   
    .teacher-cont{margin:auto;}
    .sm\:block{display:block;} 
    .sm\:hidden{display:none;}
    .showtime ul li{width:90%;}
    .gift i{float:left;padding:0 0.5rem;}
    .guide-btn a{margin:auto;}
    .guide-btn a:nth-of-type(2){margin:auto 1.5rem;}
    .announce{bottom:calc(10% + 103px);top:auto;}
}
@media screen and (min-width:768px) and (max-width:1199px){
    #Master_title h1{margin-bottom:1rem;}  
    #Master_title h1{font-size:5.5rem;line-height:6rem;}  
    .lec-circle span{font-size:5.5rem;line-height:8.5rem;}  
    .coming{font-size:2.6rem;}
    .gift{font-size:1.6rem;}
    .gift i{font-size:5rem;}
}
@media screen and (max-width:767px){   
    #Master_title h1{font-size:3.8rem;line-height:4.5rem;}    
    .lec-circle span{font-size:3.75rem;width:5rem;height:5rem;line-height:5.5rem;}
    .teacher-cont{margin:auto .6rem;gap:1rem .8rem;}
    .tea-box{width:calc(100%/2.05 - 6px);}
    .tea-box dl{position:relative;}
    .tea-box dl dt{position:absolute;left:0;width:4rem;height:4rem;line-height:1.25rem;}
    .tea-box dl dd{width:100%;margin:auto;padding:0.25rem 0 0.25rem 4rem;font-size:1.15rem;}
    .tea-box dl dd small{font-size:0.75rem;}
    .tea-box img{height:180px;width:auto;}    
    .lec-time dl{width:80%;}
    #event_master h2{font-size:1.75rem;}
    .platform .youtube-wrap, .platform .member-wrap, #community_full{width:100%;}
    .lec-circle{margin-top:0;}
    .bulletin{top:initial;bottom:35%;}    
    .guide-btn a{font-size:1.125rem;}
    .guide-btn a i{display:none;}
    .guide-btn > div{padding:0.5rem 0;}
    .address{padding:0;text-align:center;width:100%;} 
    .showtime ul li, .address, .schedule a{font-size:1.4rem;}
    .date{border-right:0;border-bottom:2px solid #f4c93c;padding:0 0 0.25rem 0;margin:auto auto 0.5rem;display:block;}
    .showtime ul li{text-align:center;}
    .venue{margin:auto;}
    .coming{font-size:2.3rem;}
    .gift{font-size:1.2rem;padding:1rem;}
    .raffle{font-size:1.1rem;}
    .gift i{font-size:3.5rem;}
    .guide-btn a:nth-of-type(2){margin:auto 0.75rem;}
    .topic{font-size:1.25rem;}
    #community_full{width:100% !important;}
    .stream{width:95%;margin:1rem auto;}
    @media screen and (width < 360px){
        #Master_title h1, .lec-circle span{font-size:3rem;} 
        .tea-box{width:76%;} 
        .tea-box img{height:150px;}
    }
}