﻿/*預設*/
#event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth{padding: 1rem;}
#Master_title{height: auto !important;}
main img{margin: auto;}
main .bgcolor0{background: linear-gradient(to bottom, #ffffff 60%,#edebd6 100%) !important;position: relative;overflow: hidden;z-index: 0;}
main .bgcolor0:before, main .bgcolor0:after{position: absolute;content: '';z-index: -1;}
main .bgcolor0:before{width: 151px;height: 13px;top: 30%;left: -3rem;background: url(../../images/1206051_2_1.png);}
main .bgcolor0:after{width: 384px;height: 50px;top: 30%;right: -6rem;background: url(../../images/1206051_2_3.png);}
main .bgcolor1{background-color: #edebd6;}
main .bgcolor5{background: linear-gradient(to bottom, #f1740d 60%, #f58656 100%) !important;padding: 2rem 0;}
main .bgcolor6{background-color: #f1740d !important;}
main ~ #Ask{background-color: var(--purple);}
iframe{margin: auto;}
/*標題大小*/
article h1{font-size: 2rem; }
article h2{font-size: 1.875rem; }
article h3{font-size: 2.2rem;text-align: center;padding: 0.3em 0;color: white; }
:root{
    --yellow:#f9f100;
    --red: #d32d2f;
	--blue: #4464a1;
	--purple: #970582;
	--black: #201513;
	--green:#5b8035;
}
/*Event 主圖*/
#Master_title{z-index: 2;text-align: center;}
#Master_title h1{font-size: 7.3rem;}
#Master_title h1 strong{color: var(--purple);}
.master_des{font-size: 4.4rem;}
.master_des span{width: 6rem;height: 6rem;background-color: var(--purple);color: white;border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;margin: auto -5px;}
.master_des span:nth-of-type(n+1):nth-of-type(-n+2){color: var(--yellow);}
.master_des a{margin-left: 2rem;font-size: 2.8rem;}
.master_des a i{padding: 0 0.5rem 0 0;}
.slogan{background-color: var(--purple);color: white;padding: 0.5rem 0;font-size: 2.25rem;}
/*科目*/
#subjectTabs .subject-list a.active{background: var(--purple);color: white;font-weight: bold;font-size: 2.4rem;}
#subjectTabs .subject-list a{cursor:pointer;width:calc(100%/2);justify-content:center;border-right:1px solid #FFF;box-sizing:border-box;text-decoration:none;align-items:center;background:linear-gradient(to right,#e4e4e4 50%,#c7c7c7 100%);font-size:2.1rem;text-align:center;margin:2rem auto 0;padding:.5rem;}
#subjectTabs .subject-list a:last-of-type{border: none;}
/*場次*/
.session{font-size: 1.75rem;color: var(--yellow);padding: 0.5rem;width: 100%;background-color: var(--blue);border-radius: 1rem 1rem 0 0;transition: .3s ease-in-out;}
.session a{margin-right: 1rem;}
.session+.video-wrap .embed-container iframe{border-radius: 0 0 1rem 1rem;}
.lecture-content:nth-of-type(1) .session{background-color: var(--green);}
.lecture-content:nth-of-type(3) .session{background-color: var(--red);}
.lecture-content{padding: 3rem 0;}
.lecture-content:not(:last-of-type){border-bottom: 2px dashed hsla(220, 40.60%, 72.90%,80%);}
.lecture-content > dl{font-weight: bold;font-size: 1.2em;display: flex;flex-wrap: wrap;align-items: flex-start;}
.lecture-content > dl > dt{font-size: 3.3rem;width: 35%;}
.lecture-content dl dt small{font-weight: lighter;margin-left: 1rem;font-size: 1.75rem;}
.lecture-content > dl > dt > span{color: var(--blue);display: block;font-size: 2.5rem;padding-left: 0.5rem;border-left:solid 8px var(--blue);transition: .3s ease-in-out;}
.lecture-content:nth-of-type(1) > dl > dt > span{color: var(--green);border-color: var(--green);}
.lecture-content dl dt>span span{margin: 0 -0.6rem;}
.lecture-content:nth-of-type(3) > dl > dt > span{color: var(--red);border-color: var(--red);}
.lecture-content > dl > dd{width: 65%;color: white;font-weight: bold;font-size: 1.8em;text-align: center;text-indent: initial;margin: auto;box-shadow: rgb(103 103 103 / 60%) 0px 18px 7px -12px;border-radius:1rem;}
.lecture-content > dl:hover > dt > span{filter:brightness(1.15);}
.lecture-content dl dd:hover .session{letter-spacing:0.02rem;filter:brightness(1.15);}
.lecture-content dl dd:hover .video-wrap::before{filter:brightness(1.02);width: 80px;height: 80px;}
.lecture-content dl dd a{font-size: 1.75rem;text-decoration: none;color: white;}
.lecture-content dt a{text-decoration: none;border-radius: 2rem;padding: 0.25rem 0.75rem;margin: auto 0.25rem;display: inline-block;}
.video-wrap{width: 100%;position: relative;}
.video-wrap::before{_content: "";position: absolute;width: 65px;height: 65px;left: 0;right: 0;margin: auto;top: 0;bottom: 0;background: url(../../images/play.svg) no-repeat;background-size: 100%;fill: #212121;fill-opacity: .8;transition: all 0.3s linear;z-index: 2;}
.video-wrap img, .video-wrap iframe{border: 2px solid var(--blue);width: 100%;border-radius: 0 0 1rem 1rem;}
.lecture-content:nth-of-type(1) .video-wrap img, .lecture-content:nth-of-type(1) .video-wrap iframe{border-color: var(--green);}
.lecture-content:nth-of-type(3) .video-wrap img, .lecture-content:nth-of-type(3) .video-wrap iframe{border-color: var(--red);}
.embed-container{position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;}
.embed-container iframe{border-radius: 1rem}
.embed-container iframe, .embed-container object, .embed-container embed{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.fake{padding: 2rem 3rem;background: url(../../images/1206051_2_3.png) no-repeat center 100% #FFF;background-position-y: 95%;border-radius: 0 0 1rem 1rem;border: 2px solid var(--blue);display: flex;flex-wrap: wrap;}
.fake dl{color: var(--blue);}
.fake dl dt{font-size: 5rem;margin-left: 4rem;text-align: left;}
.fake dl dt span{display: block;font-size: 2rem;position: relative;width: fit-content;padding: 0 0 0 1rem;}
.fake dl dt span::before{width: 5rem;background-color: black;height: 2px;position: absolute;content: '';right: 100%;top: 50%;}
.lecture-content .fake dl dd{font-size: 3rem;margin: auto;position: relative;width: fit-content;padding: 0 1rem 0 0;}
.fake dl dd::after{width: 7rem;background-color: black;height: 2px;position: absolute;content: '';left: 100%;top: 50%;}
.fb-circle{width: 18rem;height: 18rem;border-radius: 50%;position: relative;background: linear-gradient(145deg, rgb(68 100 161 / 25%) 30%, rgb(68 100 161 / 60%) 50%);margin: 2rem 0 0 auto;}
.video-wrap .fb-circle img{border: initial;border-radius: 0 0 45% 45%;position: absolute;bottom: 0;left: 0;right: 0;height: 340px;object-fit: cover;}
.lecture-content:nth-of-type(1) .fake{border: 2px solid var(--green);}
.lecture-content:nth-of-type(1) .fb-circle{background: linear-gradient(145deg, rgb(89 126 53 / 25%) 30%, rgb(89 126 53 / 70%) 50%);}
.lecture-content:nth-of-type(1) .fake dl{color: var(--green);}
.lecture-content:nth-of-type(3) .fake{border: 2px solid var(--red);}
.lecture-content:nth-of-type(3) .fb-circle{background: linear-gradient(145deg, rgb(211 45 47 / 35%) 30%, rgb(211 45 47 / 80%) 50%);}
.lecture-content:nth-of-type(3) .fake dl{color: var(--red);}
.lecture-content .materials{font-size: 2rem;}
.lecture-content .materials a{background-color: initial;color: black;text-decoration: underline;margin: 0.5rem auto;padding: 0 0 0 0.25rem;}
/*合照*/
.message{text-align: center;}
.message dt{font-size: 3rem;color: #fff6cc;}
.message dd{color: white;font-size: 1.25rem;}
.message dd a{background-color: #fff6cc;border-radius: 2rem;padding: 0.25rem 0.75rem;color: black;font-weight: bold;margin: 0.25rem;text-decoration: none;display: inline-block;}
.group-title{padding-top: 3%;}
.group-wrap{text-align: center;}
.group-photo img{border-radius:1em;display: inline-block;width: calc(100% / 4 - 0.25rem);}
.group-wrap p{color: white;padding: 2% 0;}
.lecture-content .download{font-size: 1.9rem;}
.lecture-content .download a{padding: 0;margin: auto;text-decoration: underline;}
.download::before{content: '\f56d\00a0解答下載：';font-family:"Font Awesome 6 free";font-weight: 900;}
.handout::before{content: '\f56d\00a0講義：';font-family:"Font Awesome 6 free";font-weight: 900;}
@media screen and (min-width: 1201px){	
	#event_master, #event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth{width: 1200px;margin: auto;}
	.md\:-top-4{top: -1rem !important;}	
	.slogan{letter-spacing: 0.5rem;}
	.lecture-content > dl:hover > dt > span{margin-left: 1rem;}
}
@media screen and (max-width: 1200px){
	.fake{padding: 1rem 2rem 2rem;}	
	.fb-circle{margin: 4rem 0 auto auto;width: 14rem;height: 14rem;}
	.video-wrap .fb-circle img{height: 260px;}	
}
@media screen and (max-width: 1023px){
	.lecture-content > dl > dt{width: 100%;padding-left: 0;text-align: center;}
	.lecture-content > dl > dt > span{border-left:none;padding-left: 0;}
	.lecture-content dl dd{width: 95%;}
	.session a{display: block;margin-right: 0;}
}
@media screen and (max-width: 1200px) and (orientation: portrait){
	.message dt{font-size: 2rem;}
	.lecture-content{padding: 2rem 0;}
	.master_des a{display: block;margin: auto;}	
}	
@media screen and (min-width: 768px) and (max-width: 1199px){
	#Master_title h1{font-size: 5rem;}
	.master_des{font-size: 3rem;}
	.master_des span{width: 5rem;height: 5rem;}
	.lecture-content > dl > dt{font-size: 2.8rem;}
	.md\:-top-4{top: -1rem !important;}
	section .sm\:block{display: initial;}
	.fake dl dt{margin-left: 2rem;}
	.fake dl dt span::before{width: 4rem;}
	.fake dl dd::after{width: 6rem;}
}
@media screen and (max-width: 767px) and (orientation: portrait){
	main .bgcolor0:before, main .bgcolor0:after{opacity: 0.3;}
	main .bgcolor0:after{right: -12rem;}
	.slogan{font-size: 1.1rem;}
	#Master_title h1{font-size: 2.75rem;}
	.master_des{font-size: 3rem;}
	.master_des span{width: 4rem;height: 4rem;}
	.master_des a{font-size: 2rem;}	
	#subjectTabs .subject-list a{font-size: 1.2rem;}
	#subjectTabs .subject-list a.active{font-size: 1.25rem;}	
	.lecture-content dl dd{font-size: 1.5rem;}
	.lecture-content > dl > dt{font-size: 2rem;}	
	.group-photo img{margin: 2% 0;}
	.sm\:-top-2{top:-0.5rem !important;}
	.video-wrap{width: 100%;}
	.message dd a{display: block;padding: 0.25rem;}
	.fake{padding: 0 2rem 1rem;}
	.fake dl dt{font-size: 3rem;line-height: 3rem;}
	.fake dl dt span{font-size: 1.5rem;}
	.lecture-content .fake dl dd{font-size: 2rem;}	
	.fb-circle{margin: 2rem auto auto;}
	.video-wrap::before{top: 30%;bottom: auto;}
	.lecture-content dl dt>span span{margin: 0;}
	.lecture-content .materials{font-size: 1.5rem;}
	.lecture-content .download{font-size: 1.35rem;}
	.lecture-content .sm\:text-left{text-align: left;padding: 0 0 0 1rem;}
	.group-photo img{width: calc(100% / 2 - 0.25rem);}
	.lecture-content dl dt small {margin-left: 0.5rem;font-size: 1rem;}
	.lecture-content > dl > dt > span{font-size: 2rem;}
}