/* css reset 歸0 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tfoot,thead{margin:0;padding:0;border:0;outline:0;font-size:100%}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
/* css reset 歸0 end */
:root{
	--blue1:#0052a3;
	--red1:#b40005;
}
body{margin:0 auto;padding:0;font-family: 'Noto Sans TC', sans-serif;background: url(../images/line_bg.gif);}
#BodyContainer{margin:0 auto}
#BodyContentEvent{width:100%}
#event{background:#f5f5f5}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
h1{font-size: 3rem}
h2{font-size: 2rem}
h3{font-size: 1.4rem}
article{background: linear-gradient(to right,#fff100 0%,white 12%,white 88%,#fff100 100%);}
.banner{position: relative;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
.banner img{max-width: 100%;height: auto;}
.banner .info{width: 76%;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.banner .info~div { width: 24%; }
.banner span{
    position: absolute;content: "";bottom: 2.8%;margin: auto;left: 0;right: 0;color: white;font-size: 1.8rem;
    text-align: center;font-weight: 500;
}
.bg1{background-color: #fef5ec;}
.bg2{background-color: #fff;}
.info figure{text-align: center;margin-left: 4%;}
.info ul{list-style: none;color: var(--blue1);font-size: 1.4rem;line-height: 1.7;font-weight: bold;letter-spacing: 0.02rem;margin-left: 6rem;}

/*書單*/
.booklist{margin: 0 4rem;padding: 0% 0 3%;}
.books{width: 100%;background-color: white;}
.books, .books th, .books td {border: 1px solid black;border-collapse: collapse;text-align: center}
.books th{background: linear-gradient(to bottom,lightyellow 40%,yellow 80%);color: #1a4981;padding: 0.2em;}
.books td{padding: 0.2em;}
.books td a{color: var(--blue1);}
.books td:nth-child(4){color: var(--red1)}
.books p{text-align: left;padding-left: 1%}
.books tr:nth-child(even) {background-color: #fff;}
.books tr:nth-child(odd) {background-color: #edf7f9;}
.books tr:nth-last-of-type(1) td {text-align: right;padding-right: 1.5rem;}
.ps{text-align: right;font-size: 0.9rem;color: #484848;}

/*經驗談*/
.books caption,.title{
	font-size: 2rem;text-align: center;background: var(--red1);border-radius: 12px 12px 0 0;
	padding: .1rem 2rem;color: white;width: fit-content;margin: auto;
}
.student{background: white;border-radius: 12px 12px 0 0;padding: 2rem;margin: 0 4rem 0;line-height: 1.6;}
.student a{color: var(--red1);}
.student dl{margin: 2% auto 1rem;padding-bottom: 1rem;border-bottom: dashed 1px var(--blue1);}
.student dt{font-size: 1.2rem;color: darkmagenta;font-weight: 700;}
.student dt span{font-size: 1.35rem;color: var(--blue1);margin-right: .3rem;}
mark{background: var(--red1);color: white;margin-left: .3rem;font-size: .8em;padding: 0 .3rem;border-radius: 6px;}
.more{text-align: right}
@media (max-width: 767px) {
	.banner .info{margin: 2rem auto 1rem;}
	.banner .info figure {width: auto;}
	.banner .info ul {margin: .5rem 1rem;font-size: 1.2rem;width: auto;}
	@media screen and (max-width:390px) { .banner .info ul {font-size: 1rem;} }
	.banner{align-items: center;flex-direction: column-reverse;}
	.banner span{font-size: 1.25rem;bottom: 1%;}
	.books caption, .title{font-size: 1.3rem;}
	.student{margin: 0rem 1rem;padding: 2rem 1rem;}
}
/*各大相容檢視*/
@media screen and (-webkit-min-device-pixel-ratio:0) { /*Webkit*/
}
@-moz-document url-prefix(){/*Firefox*/
}

@media \0screen\,screen\9 {/*IE 6 7 8*/
}

@media screen\0 {/*IE 8 9 10 11*/
}

@media print {
}