@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@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/line_bg.gif)*/ #d9cccc;background-image: radial-gradient(#ded0d0/*#e1d4d4cc*/ 71%, transparent 71%);background-size: 120px 120px;color: var(--font-black);font-family: Arial, '微軟正黑體', 新細明體, 'LiHei Pro', sans-serif;}
#BodyContainer{margin:0 auto}
#BodyContentEvent,#event{width:100%}
#event {background:linear-gradient(180deg,#f7e052 80% ,#fffcdb 100%);}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
.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_light_green: #008083;
    --font_green: #02494a;
    --font_red: #B61D22;
    --font_light_ocher: #BB9C45;
    --font_ocher: #86632C;
    --orange: #e69f00;
    --pale_yellow:#fffbc7;
    --yellow:#fff59c;
    --text_t1: 4rem;
    --text_t2: 3.8rem;
    --text_t3: 3rem;    
    --text_t4: 1.8rem;    
    --text_t5: 1.6rem;
    /* --font_blue: #005688;
    --font_blue2: #002A55;
    --font_blue3: #0082CD; */
    /* --linear1: linear-gradient(to right, var(--font_blue), var(--font_blue2)); */
}
small{font-size: smaller;}

/* main */
.master_container{}
.master_logo{background: #fffcdb;width: 100%;margin: auto;}
.master_title{font-size: var(--text_t3);}
.master_right{font-size: 1.3rem;}
/* .master_container dd {margin: 0 2%;font-size: 1.45rem;} */
/* .key123 {background-color: #000;padding: 8px 6px 5px;border-radius: 0 0 25px 25px;width: 75%;color: #fff;} */

/* main end */
article img{ max-width: 100%; height: auto;margin: auto; }
.h1{font-size: calc(var(--text_t4) + .2rem);}
figcaption{font-size: calc(var(--text_t5) - .3rem);color:var(--pale_yellow);text-align: center;font-family: serif;font-weight: bold;}
.feature_box { justify-content: center;position: relative;align-items: flex-start;padding: .8rem 0;row-gap:5rem;}
.feature_box1 { width: 47%;justify-content: center;row-gap: 2rem;align-items: center;margin: auto;padding: 2rem;}

.point_m{display: none;}
.feature_box_container .point ,.master_container .point_m{padding: .5rem 0 1.5rem;font-family: "華康超明體", "Noto Serif TC", serif;}
.feature_box_container .point img ,.master_container .point_m img{display: inline;padding:0 .125rem .1rem 0;}
.feature_box_container .point dd {margin: 0 1rem;font-size: var(--text_t4);}

.feature_box_container figcaption {padding: .2rem;margin-block-start: -1.5rem;background: #704274;border-radius: .5rem .5rem 0 0;}
.feature_box_container figcaption span {font-family: "Microsoft YaHei";display: inline-block;padding: 0.3rem 1.5rem .3rem .8rem;margin-right: 0.6rem;}
.feature_box_container > figure {display: flex;flex-wrap: wrap;flex-direction: column;text-align: center;width: 255px;margin: 1rem .125rem 2.35rem .65rem;}
.feature_box_container > figure:nth-child(4) , .feature_box_container > figure:nth-child(5){margin: 0 .125rem 0 .65rem;}
:is(.feature_box, .feature_box1) figure img { margin: 0 auto;width: 100%;border-radius: 0 0 .5rem .5rem;}
.feature_box_container { justify-content: center;width: 65%;}
.feature_box_container:nth-child(1) { row-gap: 3.5rem;width: 32% }
.book_box {text-align: center;}
.book_box figcaption span{ padding: 0;margin: 0 .2rem;font-size: larger;}
.cover{margin: 0 0 0 .7rem;}
.cover figure {justify-content: center;}
.cover figure .big_book{width: 270px;margin-top: -14%;margin-bottom: 6%;}
.cover figcaption {font-size: 1.1rem;background:var(--orange);color:var(--font-black);padding: .15rem .8rem 0;border-radius: .5rem;width: fit-content;position: relative;top: -1rem;right: -7.5rem;}

.author {width: 100%;padding: 0 2% 2%;border-radius: .5rem;margin: 0 0 0 .5rem;}
.author dl{font-weight: bold;background: linear-gradient(0deg, var(--pale_yellow) 91.6%, #ffffff00 91.6%);}
.author dt {font-size: calc(var(--text_t5) - .3rem);color: #005e94;font-weight: bold;}
.author dt mark{font-size: smaller;line-height: 1.5rem;display: inline-block;background: var(--font_red);color: #fff;clip-path: polygon(0% 0%, 85% 0, 100% 50%, 85% 100%, 0% 100%);padding: .1rem .7rem .05rem .6rem;letter-spacing: .35rem;}
.author dt span {font-size: 2.5rem;vertical-align: sub;margin: 0;padding: 0 0 0 .8rem;letter-spacing: .8rem;color: #000000;font-weight: bolder;font-family: "Microsoft YaHei";}
.author dd {font-size: 1.25rem;color: var(--font_red);border-bottom:2px #f7e052 dotted;padding-bottom: 0.3rem;margin-bottom: 0.3rem;}
.author dd:last-child {border-bottom: 0px;padding: .3rem 0;margin-bottom: 0.3rem; }
.author dd li {font-size: 1.05rem;color: #000;font-family: '微軟正黑體', 'LiHei Pro', sans-serif;text-align: left;list-style-type: none;padding: .125rem .6rem 0;margin: .125rem .4rem;}
.author dd li:nth-child(odd){background: #ffffff;}

.buy {padding:.5rem 0;background: linear-gradient(to right, var(--font_green) 0%, var(--font_light_green) 28%, var(--font_light_green) 72%, var(--font_green) 100%);}
.buy ul li{display: inline;font-size: calc(var(--text_t5) + .1rem);color:#fff;font-family: '微軟正黑體', 'LiHei Pro', sans-serif;}
.buy ul li a{color:var(--yellow);}
#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, #f6df51 0%, #fdf4b5 28%, #fdf4b5 72%, #f6df51 100%);border-radius: 0 0 10px 10px;}
#event_note p{font-size: .95rem;line-height: 22px;margin-left: 32%;color: #000;}

/* .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 - 0px);padding: 15px 0 0 0;border-radius: 0 0 10px 10px;margin: 0;text-align: center;position: relative;justify-content: center;}
.master_list.r {margin-left: -6.5%;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: 600;flex-direction: column;}
.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% 22% 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); }
.master_list h3 span{ color: var(--font_red); }
:is(.quiz_flex, .quiz_flex_container) { justify-content: center;background: rgb(255, 255, 255); }
.quiz_flex { margin-block-end: 2rem;border: 1px solid var(--font_light_ocher);}
.quiz_group:nth-of-type(2) .quiz_flex {clip-path:none;}
.quiz_flex .quiz:first-child{width:100%;text-align: left;}
.quiz_group{ margin: 0 1rem 1rem;font-size: 1.1rem;}
.quiz_group h3{ font-size: calc(var(--text_t4) + .2rem);color: var(--font_red);line-height: 2; }
.quiz p:first-of-type{font-weight: bolder;color: #23448b;}
.quiz{width: 100%;padding: 0 15px;}
.quiz:nth-of-type(1){background: #f1f1f1;border-bottom: 1px solid var(--font_light_ocher);}
.quiz_group:nth-of-type(2) .quiz{background: none;border-bottom: thin dotted var(--font_light_ocher);}
.quiz_group:nth-of-type(2) .quiz:nth-of-type(n+1):nth-of-type(-n+2){border-bottom: none;}
.quiz p{margin: 7px 0;line-height: 24px;text-align: justify;}
.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;font-size: 1.3rem;}
.quiz p:nth-child(3){color: var(--font_red)}
.quiz_group:nth-of-type(2) .quiz p:nth-child(3){background: #f1f1f1;width: fit-content;padding: 0 .2rem;} */

/*Tab*/
*:before, *:after {margin: 0;padding: 0;box-sizing: border-box;}
/* .tabbox {margin: 0 auto;padding: 2% 3% 1%;text-align: center;} */
/*.content > div {
	display: none;
    padding:3% 2% 1%;
	background-color: #fbf8ff;
    border-radius: 0 0 8px 8px;
}*/
.tabbox input {display: none;}
.tab_title {font-size: 1.7rem;display: inline-block;text-align: center;width: calc(100%/3 - 5px);border-bottom:1px #e9716e solid;padding: 2px 0;color: #ff9800;}
.tab_title:hover {cursor: pointer;position: relative;background-color: #e9e9e9;border-radius: 20px 20px 0 0;}
input:checked + .tab_title.a, input:checked + .tab_title.b {border: 3px #e9716e solid;border-bottom: 3px #fff solid;border-radius: 20px 20px 0 0;color: #f55865;}
#tab1:checked ~ .content #content1,
#tab2:checked ~ .content #content2,
#tab3:checked ~ .content #content3{ display: block;text-align: left;}
@media (width >= 768px) and ( width < 1200px) {
    :is(.master_title, .master_title2) .h1{justify-content: center;}    
    .master_title2 .h1 {padding: 0 2rem;}
}
@media (width >= 768px) and ( width < 830px) {
    .book_box { position: initial;transform: revert; }
    .cover {margin:0 .25rem 0 2.8rem;}
    .cover figcaption {top: -.5rem;right: -6rem;}
    .feature_box_container:nth-child(1) {width: 35%;}
    .feature_box_container > figure {width: 235px;}
    .author {margin: 0 0 0 1rem;}
    .feature_box_container .point, .master_container .point_m {padding: .25rem 0 1.25rem;}
    #event_note p {margin-left: 30%;}
    .cover figure .big_book {margin-top: -15%;margin-bottom: 3%;}

    @media (width >= 768px) and ( width < 800px) {
    .feature_box_container > figure {width: 210px;}
    }
}
@media ( width < 767px ) {
    :root{--text_t1: 2.8rem;--text_t2: 2.6rem;--text_t3: 2.3rem;--text_t4: 1.4rem;--text_t5: 1.3rem;}
    .master_container { flex-direction: column; }
    .master_container dd {font-size: 1.2rem;line-height: 1.3rem;padding: 5px 0 4px;}
    .master_logo { width: initial;row-gap: 1.2rem }
    .master_title { width: initial; }
    .master_title .h1 { padding: 0;gap: 1rem;text-align: center; }
    @media screen and ( width < 480px ) {.master_title2 .h1 {font-size: calc(var(--text_t3) + .1rem)}}
    @media screen and ( width < 320px ) {.master_title .h1 div:nth-child(2) span {font-size: 0.8em;}}
    .master_title .h1 div:nth-child(1){margin: auto;}
    .master_title .h1 div:nth-child(2){ width: initial;margin: auto;clip-path: initial;padding: 1rem;}
    .master_title .h1 div:nth-child(2) span {display: block;}
    .master_title .h1 div:nth-child(2) span:nth-child(2){display: none;}
    .master_title .info { padding: 1.5rem;}
    .master_title .info br {display: none;}
    .master_title2 {width: 100%;}
    .master_title2 .h1{text-align: center;justify-content: center;padding: 2rem 0;}
    .master_title2 .h1>div{width: 100%;}
    .master_title2 .h1>div:nth-last-of-type(1){width: fit-content;}
    .master_logo span {height: 1rem;}

    .point_m{display: inline-flex;}
    .feature_box_container .point{display: none;}
    .master_container .point_m dd {font-size: 1.45rem;padding: 0 .5rem;line-height: 2.25rem;}
    .master_container .point_m {padding: 1rem 0 0;}

    .allow{right: 1rem;}
    .feature_box {flex-direction: column;margin: 1rem auto 0;row-gap: 1rem;}
    .feature_box_container { width: initial;justify-content: center;margin: auto;}
    .feature_box_container:nth-child(1) {width: 100%;}
    .feature_box_container:nth-child(2) {align-self: center;}
    .feature_box_container figure:nth-child(even) figcaption, .feature_box figure:nth-child(odd) figcaption { text-align: center;}
    .feature_box_container > figure ,.feature_box_container > figure:nth-child(4), .feature_box_container > figure:nth-child(5) {width: 88%;margin: 1.5rem auto;}
    :is(.feature_box, .feature_box1) figure img {width: auto;}
    .book_box {order: 1;margin: auto;width: 88%;}
    .book_group {flex-direction: column;row-gap: 1rem;}
    .cover{margin: auto;}
    .cover figure { align-items: center; }
    .cover figure .big_book {width: 220px;margin-top:-5%;margin-bottom: 0;}
    .cover figcaption {top: 0;right: -8.25rem;}
    figcaption {font-size: 1.25rem;}
    .author {padding: 1rem 0;width: 100%;margin: auto;}
    .author dd li {font-size: 1.05rem;margin: .125rem 1rem;}
    .author dt mark {font-size: larger;padding: .2rem .7rem .05rem .6rem;}
    /* .key123 {width: auto;} */
    .buy ul li {display: block;}
    #event_note p {font-size: .9rem;margin-left: 5%;}
}

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