/* 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;color: #2a2a2a;background: url("../images/line_bg.gif");}
#BodyContainer{margin:0 auto}
#BodyContentEvent,#event{width:100%}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
.bgcolor1{background:url(../images/1305068_bg.png) ;}
.w-full {width: 100%;}
img {max-width: 100%;height: auto;}
h1{font-size: 3rem}
h2{font-size: 2rem}

.flex{display: flex;}
[class*="flex"] {display: flex;flex-wrap: wrap;}
[class*="grid"] {display: grid;}


.author{width: 100%;left: 0;top: 0;}
.author dl{
    text-align: center;line-height: 1.4;margin-top: -1.5rem;
    width: 60%;display: inline-flex;
    font-size: 1.3rem;flex-direction: column;
}
.author dt { font-size: 1.6rem; }
.cover{width: 40%;top:0;margin-left: -43%;position: relative;}
.cover figure img{margin: 0 .7rem;display: block;}
.cover figure img:nth-child(2) { margin-block-start: 2rem; }
.cover figure figcaption{
    text-align: center;font-size: 1.35rem;margin-top: 0.8rem;
    font-weight: bold;letter-spacing: .15em;font-family: microsoft yahei;
}
.Vuetabs { margin: 2.5rem 3rem 0; justify-content: space-around; overflow: hidden; }
.Vuetabs a {
    width: 40%; line-height: 1.7em; margin: 0;
    font-family: "Microsoft YaHei"; cursor: pointer;
    padding: 0.7rem 2rem; transition: background-color 0.2s;
    background: #f1f1f180;
    border: 0px solid #ccc; text-align: center; font-size: 1.6rem;
}
.Vuetabs a:hover { background: var(--orange1); color: white;}
.Vuetabs a.b:hover { background: var(--blue1); }
.Vuetabs a.active { color: white; cursor: default; font-weight: bold; background: #e30714;  }
.Vuetabs a.b.active { color: white; cursor: default; font-weight: bold; background: #e30714;  }
.title{width: 100%;}
.title h2{
    width: 100%;background: linear-gradient(to right,#A07B25 0%,#E8D67F 30%,#F4ECA5 50%,#E8D67F 70%,#A07B25 100%);
    line-height: 1.9;height: 1.9em;font-size: 1.75rem;font-weight: bolder;font-style: italic;font-family: microsoft yahei;
    padding-left: 4rem;
}
.title_img{
    background: #00A58F;width: 100%;
    padding-left: 6rem;padding-bottom: 3rem; align-items: flex-end;
}
.bookcover{display: flex;}
.info{justify-content: center;margin-top: -5.5rem;}
figure { margin: 0 auto;padding: 0 1rem; }
.tips{border: 1px solid;width: auto;padding: 1%;display: table;}

h5{
    font-size: 2rem;text-align: center;background-color: #DF1516;color: white;padding: .2rem 2rem;margin:2rem auto .2rem;width: 40%;
    font-family:'Times New Roman', Times, serif;
}
.precision_hit{
    position: absolute;
    content: "";
    z-index: 1;
    width: 110px;
    height:100px;
    right: -2.8rem;
    top: 2%;
    text-align: center;
    background: #fff9ae;
    border-radius: 50%;
    font-size: 1.1rem;
    color: black;
    padding: 0.8rem 0 0;
    animation: move1 .6s linear alternate infinite;
}
@keyframes move1{0%{transform: scale(1);}100%{transform: scale(1.03);}}
.precision_hit a{color: black;}
.precision_hit :is(.new, .text_b) { display: block;font-weight: bold;font-size: 1.4rem;line-height: 1.3; }
.precision_hit .new{ color:#ff283d;font-size: .9rem;font-family: arial black; }
.hit_grid{grid-template-columns: 1fr 1fr;margin: .6rem 2.6rem;gap: .8rem;}
.hit, .hit_0{padding: 2%;background: #ffffff;border-radius: 16px;}
.hit_0 { grid-area: 1/1/3/3; }
.hit:nth-child(1){grid-area: 1/1/3/2;}
.hit:nth-child(2){grid-area: 1/2/2/3;}
.hit:nth-child(3){grid-area: 2/2/3/3;}
:is(.hit, .hit_0) p:first-child{color: #23448b}
:is(.hit, .hit_0) p:nth-child(2n+3){color: #ff283d}

#event_buy{text-align: center;}
.buy {padding: .6rem 0;background-color: #00A58F;margin-top: 2.8rem;color: white;}
.buy ul li{display: inline;font-size: 1.15rem;}
.buy ul li a{color: white;}
.buy a{padding: 0 2%;}
#event_note {
    text-align: center;
    float: left;
    width: 100%;
    padding-top: 1%;
    padding-bottom: 2%;
    background: linear-gradient(to right, #A07B25 0%, #E8D67F 30%, #F4ECA5 50%, #E8D67F 70%, #A07B25 100%);
    border-radius: 0 0 10px 10px;
}
#event_note ul{display: inline-block;}
#event_note li {
    font-size: 13px;
    line-height: 20px;
    text-align: left;
    list-style: none;
}


@media (max-width:767px){
    .cover{width: 100%;top:0;margin-left: initial;margin-top: -0.1rem;position: relative;z-index: 0;}
    .cover::after { position: absolute;content: '';width: 100%;height: 9rem;background: #00A58F;left: 0;top: 0;bottom: 0;z-index: -1; }
    .cover figcaption{text-align: center;margin: auto;}
    .title h2{line-height: normal;height: auto;padding-left: initial;padding: .5rem 0; text-align: center;font-size: 1.4rem;}
    .title_img{padding-left: initial;padding: 2rem; justify-content: center;}
    .author dl{width: 100%;padding: 1.2rem 0;background: #00A58F;margin: auto;}
    .info{margin-top: 2rem;}
    .hit_grid {grid-template-columns: 1fr;margin:2rem;}
    .hit:nth-child(1){grid-area: 1/1/2/3;}
    .hit:nth-child(2){grid-area: 2/1/3/3;}
    .hit:nth-child(3){grid-area: 3/1/4/3;}
    .precision_hit{right: 2%;}
    .m_br{display: block;}
}


/*各大相容檢視*/
@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 {
}