/* 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:#ddcdaa url(../images/1406039_bg.png) no-repeat center top / 100% fixed  /*url("../images/line_bg.gif") #fffef5*/;color: var(--font-black);}
#BodyContainer{margin:0 auto}
#BodyContentEvent,#event{width:100%}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
.hit_bgcolor1{background: #fff url(../images/1406039_hit_bg.png) no-repeat center top / 100%;}
.bgcolor1{background-color: white;}
.bgcolor2{background-color: white;display: flex;flex-wrap: wrap;}
.bgcolor3{background-color: #EBEBEB;}
.bgcolor4{background-color: #F6F6F6;}
.bgcolor5{background-color: #EBEBEB;}
[class*="flex"] {display: flex;flex-wrap: wrap;}
:root {
    --ff1: "Noto Serif TC", serif;
    --font-black: #231815;
    --font_green: #008183;
    --font_red: #B61D22;
    --font_black: #231815;
    --font_ocher: #BB9C45;
    --font_orange: #EA5E00;
    --text_t1: 4rem;
    --text_t2: 3.8rem;
    --text_t3: 3rem;    
    --text_t4: 1.8rem;    
}
small{font-size: smaller;}
article img{ max-width: 100%;height: auto;margin: auto; }
.h1 {font-size: var(--text_t1);color: var(--font_green);justify-content: center;align-items: center;text-align: center;padding-bottom: .5rem;margin-bottom: .2rem;border-bottom: 1px dashed var(--font_ocher);}
.h1 span {font-size: var(--text_t3);font-family: var(--ff1);font-weight: 700;color: var(--font_black);    display: inline-block;text-align: right;}
.master_container {font-family: var(--ff1);font-weight: 900;font-style: normal;    font-size: var(--text_t1);justify-content: space-around;align-items: center;margin: 0 6% 0 0;line-height: 1.4;letter-spacing: 0.08rem;padding: 0 0 0 4rem;width: 94%;border-radius: 0 0 30px 0;filter: drop-shadow(0px 6px 2px #a2a2a2);}
.master_container img { margin-top: 2.2rem; }
.master_title {width: 75%;font-size: var(--text_t3);font-family: var(--ff1);font-weight: 600;padding-block-start: 2rem;align-items: flex-start;justify-content: space-around;}
.master_title_content {font-size: var(--text_t4);margin-top: 0.5rem;text-align: center;padding-bottom: 0.2rem;margin-bottom: 0.2rem;border-bottom: 1px dashed var(--font_ocher);}
.master_title_content span { color: var(--font_orange);display: inline; }
.master_logo {width: 25%;background: linear-gradient(to bottom, #00585D 15%, #00585D 25%, #008183 50%, #00585D 75%, #00585D 100%);justify-content: center;align-items: center;padding: 2.5rem 0;border-radius: 0 0 30px 0;}
#event_master .money { margin: .5rem 0 0 0;text-align: center;font-weight:500; }
.money b{font-size: larger;}
.book_box { padding: 1.5rem 1.5rem 0;justify-content: center; }
figcaption , .money{ font-size: 1.2rem;color: var(--font_green);text-align: center;font-family: serif; }
figcaption span { font-size: 1.7rem;color: var(--font_green); }
.author { width: fit-content; }
.author dl{ font-size: 1.1rem;padding: 1rem 0;justify-content: center;column-gap: .6rem; }
.author dt{background: var(--font_green);color: white;border: solid 1px var(--font_ocher);border-radius: 20px;margin: 0 20%;justify-content: center;width: 60%;font-size: 1.3rem;font-family: var(--ff1);}
.author dt span{font-size: 1.9rem;background: white;color: var(--font_black);display: inline-flex;width: 100%;justify-content: center;border-radius: 0 0 20px 20px;}
.author dd { writing-mode: vertical-rl;text-orientation: upright;display: block; }
.book_group { justify-content: space-around; }
.feature_box {justify-content: center;gap: .5rem .2rem;align-items: flex-end;margin: auto;padding: 1rem 0 2.5rem;}
.feature_box1 {width: 47%;justify-content: center;row-gap: 2rem;align-items: center;margin: auto;padding: 2rem;}
:is(.feature_box, .feature_box1) figcaption{text-align: center;display: inline-block;border-radius: 0 0 20px 20px;background: linear-gradient(to bottom, var(--font_ocher) 30%, #9C7100 80%);color: white;}
:is(.feature_box, .feature_box1) figure {display: flex;flex-wrap: wrap;flex-direction: column-reverse;text-align: center;border: solid 1px var(--font_ocher);border-radius: 20px;padding-block-start: .6rem;}
:is(.feature_box, .feature_box1) figure img { margin: .4rem auto;}
.feature_box figure { width: calc(100%/2.1 - 5px); }
.buy {background: linear-gradient(to right, #00585D 15%, #00585D 25%, #008183 50%, #00585D 75%, #00585D 100%);padding: 15px 0;}
.buy ul li{display: inline;font-size: 1.5rem;color:#fff;}
.buy ul li a{color: #fff59c;}
#event_buy{text-align: center;}
.buy a{padding: 0 2%;}

#event_note{text-align:left;float:left;width:100%;padding-top: 3%;padding-bottom: 4%;background:linear-gradient(to right,#a8832b 0%,#d79c11 50%,#a8832b 100%);border-radius: 0 0 10px 10px;}
#event_note p{font-size:13px;line-height:20px;color:#000;margin-left:30%;color: #FFFFFF;}
.allow {position: absolute;text-decoration: none;width: 108px;height: 108px;border-radius: 50%;right: -9%;top: 6%;padding: 10px 0 0;color: white;background: var(--font_orange);line-height: 26px;text-align: center;font-size: 1.15rem;animation: move 1s ease-in forwards infinite;}
@keyframes move {
    0% { top: 6%; }
    50% { top: 7%; }
    100% { top: 6%; }
}
.allow span {display: block;font-size: larger;font-weight: bold;color: #fffec8;}

/*命中 hit*/
.master_box { position: relative;align-items: center; }
.master_list {width: calc(100% / 2 - 2rem);padding: 1rem 0;margin: auto;text-align: center;position: relative;justify-content: center;}
.master_list.r {width: 55%;padding: 0 3.5rem 0 2rem;margin-left: -10%;text-align: center;position: relative;}
.master_list.r.a h1 { width: 100%; }
.master_list .h1 {font-size: var(--text_t1);width: 100%;text-align: center;font-family: var(--ff1);margin: 0 0 2.5%;/*padding: 0;*/font-weight: 700;flex-direction: column;line-height: 4.7rem;}
.master_list .h1 img{margin: 0 auto .8rem;}
.master_list .h1 span { text-align: center; }
.master_list .h1 > div { justify-content: center; flex-direction: column;}
.master_list:nth-child(1) { order: 1; }
.master_list:nth-child(2) { order: 2; }
.master_list .booksize { margin: 5% 15% 0; }
.master_list figure { margin: 5% 16% 0;filter: drop-shadow(2px 4px 5px #4f4f4f70); }
.master_list h2 {font-size: 3.2rem;}
.master_list h3 { font-size: 2.6rem;font-family: var(--ff1);font-weight: 600;}
.master_list h3 span{ color: var(--font_red); }
:is(.quiz_flex, .quiz_flex_container) { justify-content: center;background: rgb(255, 255, 255); }
.quiz_flex { border:/* inset 4px var(--font_ocher)*/ 3px var(--font_ocher) solid;margin-block-end: 2rem; }
.quiz_flex .quiz:first-child{width:100%;text-align: left;}
.quiz_group{ margin: 0 1rem 1rem; }
.quiz_group h3{ font-size: 1.5rem;color: var(--font_red);line-height: 2;font-weight: bold;}
.quiz p:first-of-type{font-weight: bolder;color: var(--font_green);}
.quiz{width: 100%;padding: 1rem 1rem 0;font-size: 1.05rem;}
.quiz p{margin: 7px 0;line-height: 24px;text-align: justify;font-family: Verdana, "Microsoft JhengHei";}
.quiz h5{background: linear-gradient(45deg, #413d99, #ff5a62);color: #ffffff;text-align: center;font-size: 1.3rem;font-weight: 400;margin: 0 0 5px;border-radius: 25px;padding: 2px 0;    font-size: 1.6rem;}
.quiz p:nth-child(1){font-weight: bold}
.quiz p:last-child{color: var(--font_red)}
.quiz:nth-child(n+3) p{color: var(--font_red);font-weight: 400}
.quiz_subtitle{font-size: 1.2rem;}

/*Tab*/
.Vuecontainer {}
.Vuetabs {margin-bottom: -2px; }
.Vuetabs ul {/*list-style-type: none; margin-left:; */}
.Vuetabs a{cursor: pointer;width: calc(100%/3);font-size: 1.6rem;text-align: center;font-family: serif;font-weight: 500;color: #777;padding: .5rem 3rem;transition: 0.2s;border: 1px dotted #b8983caa;border-right: none;background-color:#faf7ee;}
.Vuetabs a:last-child {border-right: 1px solid #f6f4ee;}
.Vuetabs a:hover {background-color: #eee3cc;color: #333;}
.Vuetabs a.active {background-color: #fff;color: #9d7100;border-bottom: 2px solid #fff;cursor: default;}
.tabVuecontent { padding: 2rem; /*border: 1px solid #ccc;box-shadow: 3px 3px 6px #e1e1e1;*/}

.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}


@media (width > 768px) and ( width <= 1199px) {
    :root { --text_t1: 4rem;--text_t2: 3rem;--text_t3: 2.4rem;--text_t4: 1.9rem; }
    .allow { right: -5%; }
    h1 { padding: 1rem 3rem 3rem; }
    .author { font-size: 1.2rem; }
    .author dt span { font-size: 1.8rem; }
    .quiz { width: fit-content; }
}

@media (width > 830px) and (width <= 1050px) { h1 { align-items: center; }}

@media (width <= 830px) {
    :root { --text_t1: 3.5rem;--text_t2: 2.6rem;--text_t3: 1.6rem;--text_t4: 1.3rem; }  
    @media screen and (max-width: 385px) { :root { --text_t1: 2.5rem;--text_t2: 1.7rem;--text_t3: 1.3rem;--text_t4: 1.1rem; }  }
    h1 { flex-direction: column;padding: 1rem;align-items: center;margin: auto;gap: 1rem; }
    h1 img { margin-top: 0; }
    .master_list .h1, .master_title_content, .master_container { width: 100%;margin: auto;padding: 0; }
    .h1 span { text-align: center;font-size: var(--text_t2);}
    .cover { margin: auto; }
    .master_box { flex-direction: column-reverse; }
    .master_title, .bgcolor2, .master_title_content, .author { margin-top: 0; }
    .master_title_content { padding: 1rem;text-align: center; }
    @media screen and (max-width: 360px) { :root { --text_t3: 1.1rem; }  }
    .master_title { background: white;padding: 1rem 0 0;width: 60%; }
    .master_title::before { display: none; }
    .master_list { width: calc(100% / 1 - 0px);padding: 20px 20px 0 20px;flex-direction: column; }
    .master_list .h1 {line-height: 4.2rem;}
    .master_list .booksize { margin: auto; }
    .master_list.r {margin-left: 0;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
    .master_list.r.a {width: 60%;padding: 1.5rem 0 0;margin: auto;}
    #event_master .money {margin: .5rem 0 1.5rem 0;}
    .master_logo { width: 40%;padding: 3.5rem 0; }
    .book_group { width: 100%; }
    .allow { right: 0;top: -16%;animation: none; }
    figcaption, figcaption span { color: var(--font_black); }
    .quiz { width: fit-content; }
    .quiz_group h3{ font-size: 1.7rem;}
    .author { font-size: 1.2rem;padding: 1rem 0;width: fit-content; }
    .author dt { font-size: 1.4rem; }
    .author dt span { font-size: 1.7rem; }    
    .author dd { writing-mode: unset;text-orientation: unset; }
    .feature_box { justify-content: center; }
    .feature_box figure { width: fit-content; }
    .feature_box1 { display: none; }
    .buy ul li { width: 90%;margin: auto;display: flex;flex-wrap: wrap;justify-content: center; }
    #event_note p{margin-left: initial;text-align: center;}
}

@media (width <= 767px){
    .master_list h3 {font-size: 2.3rem;}
    .master_list {padding: 5px 20px 0 20px;}
    .master_list.r.a {width: 90%;}
    .tabVuecontent {padding: 1.5rem .5rem;}
}


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