@import url("./fontawesome-free-6.0.0-web/css/all.min.css");
/* Event 重設 */
#EventContainer section h1{padding: initial;}
#EventContainer section h1::before{content: initial;}
img {display: initial;margin: auto}
#EventContainer .bgcolor0 {background: #FFFFFF;}
#EventContainer .bgcolor1{padding:2.5% 0 0;}
#EventContainer .bgcolor1,#EventContainer .bgcolor2{background:url(../images/1102002_line_basemap3.png)repeat-y left top,url(../images/1102002_line_basemap4.png)repeat-y right top,linear-gradient(45deg, #b4f4ff, #ffe3ef);    background-attachment: fixed;}
#EventContainer .bgcolor3 {background: url(../images/1102002_line_basemap3.png)repeat-y left top,url(../images/1102002_line_basemap4.png)repeat-y right top,#e9faff !important;background-attachment: fixed;}
#EventContainer .bgcolor4 {background: url(../images/1102002_line_basemap5.png)repeat-y left top,url(../images/1102002_line_basemap6.png)repeat-y right top,#fff0b1;background-attachment: fixed;}
#EventContainer .bgcolor5 {background: #E4E4E4;}
#Ask {background: #3693A2 !important;}
#Ask input[type="submit"], #Ask input[type="reset"] {color: #262a64 !important;background-color: #ffc43c !important;}
/* 標題大小 */
h1 {font-size: 3rem;}
h2 {font-size: 2rem;}
h3 {font-size: 1.5rem;}
.target-fix {position: relative;top: -4rem;display: block;visibility: hidden;}

/* 主圖 */
[class*="grid"]{display: grid;}
[class*="flex"]{display: flex;flex-wrap: wrap;}
.banner_grid{background:url(../images/1102002_basemap_icon.png)no-repeat center / 100%,url(../images/1102002_radiation.png)no-repeat top center / 100%,linear-gradient(to top,#f0fdff 0%, #096b94 50%,#6b1185 100%);grid-template-columns: repeat(5,20%);grid-template-rows: repeat(5,20%);width: 100%;padding:50px 0 0;}
.banner_title {grid-area: 1/1/2/6;position: relative;display: grid;justify-content: center;}
.sub-menu_flex dt{    font-size: 1.8rem;
border-radius: 3px;
font-weight: bold;
margin: 0 6px 9px;
color: #ffffff;
background: linear-gradient(45deg, #ff5d1d, #f31204);
text-align: center;}
.sub-menu_flex{
padding: 20px 0 25px;
grid-area:5/2/6/5;
border-radius: 10px;    justify-content: space-between;
}
.hand{grid-area: 3/3/6/4;display: grid;justify-items: center;align-content: flex-end;position: relative;}
.book{grid-area: 2/1/6/6;display: grid;justify-items: center;align-items: flex-end;}
.round{width: 110px;height: 110px;background: radial-gradient(ellipse at center, #fffced 0%,#fff200 100%);border-radius: 50%;text-align: center;font-size: 1.25rem;line-height: 26px;padding: 36px 11px 0;box-sizing: border-box;	color: #4c4806;	box-shadow: 0px 26px 29px -17px #3d9bac;	position: relative;}
.round:before{width: 35px;height: 35px;border-radius: 50%;background: #ffe756;position: absolute;margin: auto;left: 0;right: 0;top: 0;    font-family: "Font Awesome 6 Free";font-weight: 900;line-height:35px;}
.banner_grid .round:nth-of-type(3):before{content: "\f5dc";}
.banner_grid .round:nth-of-type(4):before{content: "\e131";}
.banner_grid .round:nth-of-type(5):before{content: "\f0ec";}

.banner_grid .round:nth-of-type(3){grid-area: 4/2/4/3;}
.banner_grid .round:nth-of-type(4){grid-area: 4/4/4/4;transform: translate(0px, -78px);}
.banner_grid .round:nth-of-type(5){    grid-area: 4/5/4/5;}
.sub-menu_flex dl{width: calc(100%/2 - 15%);text-align: center;background: #fff;padding: 20px 0;border-radius: 8px;box-shadow: 0px 46px 24px -46px rgb(128 150 172);}
.sub-menu_flex dd{display: inline-block;margin: 0 5px;/*margin: 0 10px;*/}
.sub-menu_flex dd a{font-size: 1.125rem;color: #e03b51;display: block;line-height: 40px;}
.book-shop{margin:10px 0;}
#Master_title h1 {font-size: 4rem;}
.sub-menu dl {width: calc(100%/2);}
/* 圖說關聯記憶 */
.title{font-family: MStiffHeiHK;font-size:4rem;text-align: center;    color: #214f83;}
.title small{font-size: 3rem;margin: 0 10px 0;transform: translateY(-8px);display: inline-block;}
.title+p{font-size: 1.6rem;margin: 10px 0 28px;text-align: center;letter-spacing: 1px;color: #222;}
.book-content-flex {background:white;border-radius: 10px;box-shadow: 0px 46px 24px -46px rgb(128 150 172);}
.book-content {width: calc(100%/3);padding: 1rem 1.3rem;box-sizing: border-box;text-align: center;}
.book-content ul li{display: inline-block;    margin: 0 20px;font-size: 1.125rem;color:#222}
.book-title {font-size:1.85rem;    margin: 6px 0 0;    color: #214f83;font-weight: bold;}
.book-content dl{display: inline-block;}
.book-content dl dt{background: #ed3b4b;font-size: 1.45rem;color: white;margin: 10px 0;border-radius: 5px;}
.book-content dl dd {text-align: justify;margin:0.25rem 10px 0 30px;list-style-type: disc;display: list-item;    line-height: 27px;color:#222}
.book-content dl dd strong,::marker{color:#ed3b4b}
.book-content .book-shop {width: auto;display: block;}
.book-content .book-shop a {display: inline-block;background: #ffc43c;color: #183153;box-shadow: 0px 5px 0px 0px #262a64;border: solid 1px #262a64;border-radius: 5px;margin: 0.5rem;padding: 0.25rem 1rem;text-decoration: none;font-size: 1.35rem;width: auto;}
.book-shop a:hover {background: #ffe182;}  
.book-content dl{display: inline-block;}
.book-content dl dt{background: #ed3b4b;font-size: 1.45rem;color: white;margin: 10px 0;border-radius: 5px;}
.book-content dl dd {text-align: justify;margin:0.25rem 10px 0 30px;list-style-type: disc;display: list-item;    line-height: 27px;color:#222}
.book-content dl dd strong,::marker{color:#ed3b4b}
.book_item{width: calc(100%/2 - 80px);margin: 0 40px;}
.unique {width: 100%;padding: 15px 0 30px;}
/* 高普考金評量 */
.multi_list_flex{margin:0 0 20px;justify-content: center;}
.multi_list_flex+dl dd:nth-of-type(1){list-style-type: none;text-align: center;display: block;font-size: 1.120rem;margin: 0;color: #ed3b4b;}
.multi {width: calc(100%/5);}
.multi img {width: 70%;}
.classmap{text-align: center;}
.classmap ul{margin: 0 0 1% 0;justify-content: center;width: 100%;}
.classmap li {padding: 1.3% 0 0.5%;margin: 0 1%;white-space: nowrap;vertical-align: inherit;color: #183153;font-size: 1.3em;line-height: 1.1em;border-radius: 10%;font-family: "Microsoft YaHei";width: 365px;background-color: #FFC43C;font-weight: bold;overflow: hidden;}
.classmap li img{ width: 100%;margin: 4% 0;}
.classmap li a {color: #183153;letter-spacing: 1px;font-size: 0.65em;font-weight: normal;}
/* 爭點即時通 */
.twice {width: calc(100%/2);}
#Ask {background: #0D6894 !important;}

#EventContainer .aside {text-align: center;background: #fff;padding: 20px 0;border-radius: 8px;box-shadow: 0px 46px 24px -46px rgb(128 150 172);position: fixed;right: 0;bottom: 13%;}
.aside dt {font-size: 1.5rem;border-radius: 3px;font-weight: bold;margin: 0 6px 9px;color: #ffffff;background: linear-gradient(45deg, #4D4091, #681385);text-align: center;padding: 0 20px;}
.aside a {font-size: 1.125rem;color: #335FAB;display: block;}
.activity-cart {margin: 2rem auto 1rem;width: 100%;text-align: center;}
.activity-cart a {background: radial-gradient(ellipse at center, #fffced 0%,#fff200 100%);color: #4c4806;font-size: 1.5rem;padding: 0.5rem 1rem 0.5rem 3rem;position: relative;border-radius: 8px;}
.activity-cart a:before {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: #ffe756;
    position: absolute;
    margin: auto;
    left: 0;
    margin: auto 0.5rem;
    content: "\f625";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    line-height: 35px;
}
.pop-up {width: 100%;text-align: center;background: linear-gradient(to right, #ffffff00 0%, #ffe756 10%, #ffe756 90%, #ffffff00 100%);color: #4c4806;padding: 0.5rem 2rem;font-size: 1.25rem;}
.pop-day {font-weight: bold;font-size: 1.5rem;background: radial-gradient(ellipse at center, #ffffff 0%,#ffe756 100%);padding: 0.25rem 0;margin-right: 0.5rem;display: inline-block;}
.pop-day i {font-size: 1.75rem;}
.shine {animation: myfirst 1.5s infinite alternate ease-in-out;position: relative;}
@keyframes myfirst{
    0%{opacity:1}
    15%{opacity:0}
    25%{opacity:1}
    100%{opacity:1}
}
.pop-up a {margin: 0.25rem;border-radius: 1rem;padding: 0.125rem 0.5rem;text-decoration: none;background-color: #4c4806;color: white;display: inline-block;}

/* Cookie */
.CookieConsent {background: rgb(43 55 59 / 80%) !important;}
.CookieConsent button {width: auto;position: initial;opacity:initial;}
#askarea .asktitle a {color:#FFF;}

@media (min-width: 1201px) {
    #event_master, #event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth, #event_seventh, #event_eighth, #event_ninth{width: 1200px;margin: auto;padding: 2rem 1rem;}
    .pop-up {margin: 2rem auto 1rem;}
}
@media (max-width: 1200px) {
    #event_master, #event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth, #event_seventh, #event_eighth, #event_ninth{padding: 1rem 0.25rem;}
    .classmap li {width: calc(100%/3 - 1rem);}
    #EventContainer .aside {width: 100%;background: linear-gradient(45deg, #4D4091, #681385);bottom: 0;border-radius: 8px 8px 0 0;padding: 5px 0;z-index:1;}
    #EventContainer .aside dt {background: linear-gradient(45deg, #BDDDE7, #0F6593);}
    #EventContainer .aside dd {display: inline-block;margin: auto 0.25rem;}
    #EventContainer .aside a {color: white;}
    .pop-up {margin: 5rem auto 1rem;position: relative;}    
}
@media(max-width:1500px){
    .banner_grid {padding: 50px 0 0;    background: url(../images/1102002_basemap_icon.png)no-repeat center / 100%,url(../images/1102002_radiation.png)no-repeat top center / 190%,linear-gradient(to top,#f0fdff 0%, #096b94 50%,#6b1185 100%);}
    .sub-menu_flex {grid-area: 5/1/6/6;}
    .sub-menu_flex dl {margin: 0 2%;}
    }
    @media (min-width:992px) and (max-width:1199px) {
    .sub-menu_flex {grid-area: 5/1/6/6;}
    picture img {width: 70%;}
    }
    @media (min-width:768px) and (max-width:991px) {
    .multi {width: calc(100%/2);}
    .sub-menu_flex {grid-area: 5/1/6/6;margin: 0 20px;}
    picture img {width: 70%;}
    }
    @media (max-width:767px) {
    .bgcolor1,.bgcolor2{background:url(../images/1102002_line_basemap3.png)repeat-y left top /40%,url(../images/1102002_line_basemap4.png)repeat-y right top /40%,#f0fdff;    background-attachment: fixed;}
    .bgcolor3 {background: url(../images/1102002_line_basemap3.png)repeat-y left top /40%,url(../images/1102002_line_basemap4.png)repeat-y right top /40%,#e9faff;background-attachment: fixed;}
    .bgcolor4 {background: url(../images/1102002_line_basemap5.png)repeat-y left top /40%,url(../images/1102002_line_basemap6.png)repeat-y right top /40%,#fff0b1;background-attachment: fixed;}
    .banner_grid {align-items: initial;padding: 9% 0 0;background: url(../images/1102002_radiation_m.png)no-repeat top center / 100%,linear-gradient(to top,#f0fdff 0%, #096b94 50%,#6b1185 100%);}
    .banner_title {grid-area: 1/2/2/5;}
    .title {font-size:2.4rem;}
    
    .sub-menu_flex dl {width: calc(100%/1);text-align: center;    margin: 0 0 13px;}
    .book-content, .book_item {width: 100%;}
    .multi {width: calc(100%/2);}
    .CookieConsent button {font-size: .85rem !important;margin: auto auto 5px auto !important;}
    .CookieConsent {font-size: .85rem;justify-content: center !important;}
    .CookieConsent > div {margin: 5px !important;flex: auto !important;}
    .title+p {font-size: 1.3rem;margin: 4px 0 28px;}
    .classmap li {margin: 0.5rem auto;width: 100%;}
    .round {width: 60px;height: 60px;font-size: 0.6rem;padding:20px 5px 0;    line-height: 15px;}
    /*
    .sub-menu_flex {margin: 0 19px 14px;grid-area:4/1/7/6;padding: 20px 0 0;}
    .banner_grid .round:nth-of-type(3) {grid-area: 3/2/3/3;transform: translate(0px, 45px);}
    .banner_grid .round:nth-of-type(5) {grid-area:3/5/4/5;}
    .book {    grid-area:2/1/4/6;}
    .hand {grid-area:2/3/2/3;}
    */
    .round:before {width: 20px;height: 20px;line-height: 20px;}
  
    .sub-menu_flex {grid-area: 3/1/6/6;}
    .hand {grid-area: 2/3/3/4;}
    .book {grid-area: 1/1/3/6;}
    .banner_grid .round:nth-of-type(3) {grid-area: 2/2/4/3;margin-top: 1.25rem;}
    .banner_grid .round:nth-of-type(4) {grid-area: 3/4/4/4;}
    .banner_grid .round:nth-of-type(5) {grid-area: 2/5/4/5;}
    .activity-cart {margin: auto auto 0.5rem;}
    .activity-cart a {display: block;}    
    .pop-up {margin: auto auto 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 {
}