@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Noto+Serif+TC:wght@200..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
/* 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 */

body{margin:0 auto;padding:0;font-family: 'Noto Sans TC', sans-serif;background:url(../images/bg_line.gif) #fffbee;}
#BodyContainer{margin:0 auto}
#BodyContentEvent{width:100%}
#event{background:white;}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
h1{font-size: clamp(3rem, 5vw, 4rem);font-weight: 700;color:white;text-shadow: 5px 5px 5px #1c1c1c;}
h2{
  font-size: clamp(1.3rem, 5vw, 1.7rem);text-align: left;color: #231815; background: linear-gradient(to right,#fdcf00 70%, transparent 100%);
  font-family: "Noto Serif TC", serif;font-weight: 800;letter-spacing: 0.15rem;width: fit-content;padding: 0.2rem 3rem 0.2rem 1rem;display: flex;justify-content: flex-start;align-items: center;
}
.second_gruop h2{background: linear-gradient(to right,#aa8120 70%, transparent 100%);color: white;}
h3{font-size: clamp(1.25rem, 5vw, 2rem);text-align: center;font-family: "Noto Serif TC", serif;font-weight: 600;}
.banner{
  display: flex;flex-wrap: wrap;text-align: center;justify-content: center;align-items: center;background: url("../images/1508033_main_bg.png") no-repeat center top / cover;padding: 3.6rem 2rem 2.6rem;  
}
.focus{
  flex: 0 38%;font-family: "Noto Serif TC", serif;font-weight: 600;background: linear-gradient(to right, transparent 0% , white 45%);
  padding:.35rem;border-radius:.5rem;display: flex;flex-wrap: wrap;justify-content: center;
}
.focus dl{display: flex;align-items:center;padding: 0 1.2rem;justify-content: flex-end;gap: 0.5rem;}
.focus dt{
  display: flex;justify-content: center;padding: 0;margin: 0; align-items: center;background: #fdcf00;color: #231815;
  font-weight: normal;font-size: clamp(1.2rem, 3vw, 1.5rem);padding: .5rem;
}
.focus dd{text-align: justify;text-align-last: justify;padding: 0 10px;font-size: clamp(1.3rem, 3vw, 1.6rem);}
.first_gruop{padding: 2rem 4.2rem 1.5rem;background: linear-gradient(to bottom, #fff0c4 0%, transparent 15%);position: relative;}
.first_gruop::before{ content: ""; position: absolute; bottom: 0; left: 0;right: 0; width: 82%; height: 3px; background:#fff0c4;margin: 0 auto;}
.text-group{display:flex;flex-direction:column;justify-content:center;color:#231815;}
.text-group dd:is(:nth-child(1), :nth-child(2)) {border-bottom: 1px solid #245270;padding-bottom: 5px;margin-bottom: 5px;}
.bookcover img{margin: 0 1px;filter: drop-shadow(-3px 6px 6px #bbbbbb);}
.info_group{padding: 2rem 0rem;}
.info_group .info_title_b{color: #aa8120;}
.info_x{font-family: "Roboto", sans-serif;font-weight: 200;margin: 0 0.45rem;font-size: 0.85em;}
.info_card{width: calc(100%/4 - 2px);margin: 0 1px;background: #fff7e9;}
.info_card dt { font-size: 1.2rem; background: linear-gradient(to bottom, #b88920 0%, #a87513 45%, #8c5708 100%); color: #ffffff; text-align: center;padding: 0.6rem 0; }
.info_card dd{padding: 5%;}

/*書單*/
.booklist{padding: 1.3rem 5rem;}
.books, .books th, .books td {border: 1px solid white;border-collapse: collapse;text-align: center;padding: 3px 5px;}
.books tr:nth-of-type(odd) {background: #fff7e9;}
.books th{background: #fdcf00;color: #231815;font-weight: normal;}
.books th{background: #fdcf00;color: #231815;font-weight: normal;}
.second_gruop .books th{color: white;}
.second_gruop{padding: 2rem 4.2rem 0rem;}
.second_gruop .books th{background: linear-gradient(to bottom, #8c5708 0%, #a87513 45%, #b88920 100%);}
.books td:nth-child(4){color: red}
.books p{text-align: left}
.bookcover{flex-direction: row;flex-wrap: wrap;align-items: center;margin: 1rem auto;}
.bookcover2{font-size: 1.3rem;color: #aa8120;}

#event_classlink { width:100%; padding: 5% 0; text-align: center}
#event_classlink .title{ font-size: 2.2rem; color: #aa8120; }
#event_classlink p { font-size: 1.2rem; line-height: 1.7em; color: #5f4409; }
#event_classlink p a{text-decoration: underline}


@media (max-width: 767px){
  .banner{padding: 1.5rem 2rem;gap: 1rem;}
  .banner{flex-direction: column;}
  @media screen and (max-width: 360px){.banner{padding: 1rem;}h1{font-size: 2.5rem;}.focus dl{padding: 0;}.focus dd{font-size: 1.1rem;} }
  @media screen and (max-width: 690px){.bookcover2{padding: 0rem 1rem;flex-direction: column;} }  
  .focus{flex: 0 100%;}
  .booklist{margin: 2rem 0rem;}
  .bookcover{gap: 1rem;}
  .first_gruop, .second_gruop{padding: 2rem 1.7rem 0rem;}
  .info_card{width: calc(100%/2 - 2px);margin: 1rem auto 0;}
  .info_group{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 {
}