﻿@import url("../../../icon_new_6.6/css/all.min.css");
/* css reset 歸0 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,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%;line-height:1.5em}
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}
body *{font-family:"Noto Sans TC",sans-serif}
a{text-decoration:underline}
a:hover{text-decoration:none}
ul,li,h1,h2,h3,dd,dl,p{margin:0;padding:0}
ul,li,ol{list-style-type:none}
.bg_padding{padding:1%}
.bgcolor1{background: radial-gradient(circle farthest-side at center, #ffbd3a 10%, #f5a012 73%, #ef8d22 100%);}
.bgcolor2{background: radial-gradient(circle farthest-side at center, #74b4d7 10%, #2a8aba 73%, #22759f 100%);}
.bgcolor3{background: radial-gradient(circle farthest-side at center, #73d1d0 10%, #1f9e9c 73%, #218685 100%);}
.bgcolor4{background: radial-gradient(circle farthest-side at center, #ef8d22 10%, #ed7524 73%, #ec4e17 100%);}
.bgcolor5{background-color:#10908e}
*{transition:all .5s}
#event_master *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
small{font-size: 0.9rem;}

/*DIY--設計可增加用樣式*/
:root {
  --markhit: rgb(182, 5, 5);
  --gray-light: #fafafa;
  --gray: #5a5b5c;
  --gray-light: #fafafa;
  --purple: #983d90;
}
.group_part{color: #bcffe9;font-size:2.5rem;}
.group_part,.part_des,.course dd,.offer{text-align:left}
.part_des span{color:rgb(253 185 52)}
.offer{margin:1rem 0}
.media_title{font-size: 2.5rem;margin: 3rem auto 1rem;font-family: 'Noto Serif TC', serif;clip-path: polygon(100% 0, 95% 50%, 100% 100%, 0% 100%, 5% 50%, 0% 0%);
    background: linear-gradient(to right, #cd6d13 0%, #fee5c7 15%, #fcfaf6 85%, #ddba93 100%);padding: 0.3rem 7rem;color: #ca3b09;font-weight: 900;text-align: center;width: max-content;}
.group_part.H{font-size:3.5rem;color: white;margin: 3% 0 2%;border-bottom: solid 1px;}
.group_part.H::before {content: url('../images/1311026_arrow1.png');display: inline-block;width: 75px;height: 60px;margin-right: 8px;}
.group_part.H strong{font-weight: 900;font-family: 'Noto Serif TC', serif;font-size: 4.2rem;border-bottom: solid 8px;}
.part_des dt{font-size: 1.6rem;color: white;border: solid 1px;padding: 0.1rem 1.8rem;width: max-content;margin: 0.5rem 0;}
.part_des dd{font-size:1.8rem;margin-bottom: 2.0rem;color: antiquewhite;}
.offer dt{padding: 0.3rem;font-size: 2.2rem;text-align: center;color: white;clip-path: polygon(100% 0, 99% 50%, 100% 100%, 0% 100%, 1% 50%, 0% 0%);background: radial-gradient(circle farthest-side at center, #74b4d7 10%, #2a8aba 73%, #22759f 100%);margin-bottom: 0.5rem;}
.offer dt strong{color: #ffe23f;font-family: 'Noto Serif TC', serif;}
.more {text-align: center;}
.more a{font-size: 1.8rem;border-radius: 2rem;padding: 0.8px 1.5rem;background-color: #ffbd3a;color: #10618a;text-decoration: none;margin-bottom: 3%;display: inline-block;line-height: 3.8rem;}
.ps{font-size:1.1rem;padding: 0.8rem 0 1%;color: white;}
.course dt{font-size: 1.8rem;border-bottom: solid 4px #FFF;color: #0a618c;background: linear-gradient(90deg, transparent 0%, #ffffff99 17%, #fffffff2 83%, transparent 100%);line-height: 2.2rem;padding: 0.8rem;margin-bottom: 0.8rem;}
.offer dd{line-height: 3.0rem;font-size: 1.8rem;padding: 0 3%;color: white}
.offer dd:nth-last-child(1){text-align: center;}
.offer dd .sale{font-size: 2.2rem;}

.list_gift{margin: 1% 1% 2%;line-height: 2.8rem;font-size: 1.5rem;background-color: #fffffff2;border-radius: 1.0rem;padding: 0.5rem 2.5rem;color: #e3550e;border-left: solid 8px;}
.course dd{font-size:1.2rem}
.course dd strong{border-left: solid 4px;font-size: 1.3rem;background-color: white;padding: 0.1rem 1.2rem;margin: 0.5rem 0 0.5rem;display: inline-block;color: #ec5419;}
.sale{font-size:1.5rem;color: #ec5419;font-weight: bold;}
.media_show{line-height:2rem}
.mooc_sort{background-color:#ddf5ed;font-size:1.4rem;color:#305a4d}
.mooc_table{margin-bottom: 2.0rem;}
.mooc_table tr:nth-of-type(odd) td{background-color:var(--gray-light)}
.table_style{font-size:1.1rem}
.table_style th{background-color:#94d5c0;padding:.5rem;border-right:1px dotted var(--gray)}
.table_style td{padding:.5rem;background-color:#fff;border-bottom:1px dotted var(--gray)}
.new::before,.hot::before{color:#fff;padding:.25rem;margin:0 .25rem;font-size:.9rem}
.new::before{content:"NEW";background:var(--purple)}
.course{padding: 0 1.8rem 2rem;background-color: #ffebc5b0;}
#app{width:100%;}
#app .slide_out{margin:1rem 0}
.VueCarousel-slide{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;text-align:left}
.media{padding: .5rem 3.5rem 5%;color: antiquewhite;}
.media_hit{font-size: 1.5rem;margin-bottom: 0.5rem;color: #ffffff;border: dotted 1px;text-align: center;padding: 0.2rem 1.0rem;}
.media_hit strong{background-color: #ca3b09;padding: 0.0rem 0.5rem;margin: 0.2rem 0.5rem;display: inline-block;border-radius: 0.6rem;font-size: 1.3rem;}
.media_name{margin-bottom: 0.5rem;font-size: 1.2rem;border-bottom: solid 1px;width: max-content;}
.media_name strong{font-size: 1.6rem;margin-right: 0.3rem;border-bottom: solid 4px;letter-spacing: 0.3rem;}
button.VueCarousel-navigation-button.VueCarousel-navigation-prev{left:3%}
button.VueCarousel-navigation-button.VueCarousel-navigation-next{left:89%}
.page_note{}
.offer{border:0px rgb(205, 82, 37) solid;border-radius: 1rem;padding: 1rem;}
.Vuetabs {margin-bottom: -2px; }
.Vuetabs ul {/*     list-style-type: none; margin-left:; */}
.Vuetabs a{cursor: pointer;padding: 1rem;transition: background-color 0.2s;background-color: #94D5C0;}
.Vuetabs a:last-child {}
.Vuetabs a:hover {background-color: #690a6c; color: #fff;}
.Vuetabs a.active {background-color: #690a6c;color: #fff; cursor: default;}
.tabVuecontent { }
.service_link li{background-color: #ca3b09;padding: 0.5rem 1.5rem;border-radius: 2rem;}
.service_link li a{color: white;}
.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}

.offer_limit{background:#0a5755;color: #ffbd3a;font-size: 1.5rem;padding: 1rem 0.5rem;}
.offer_limit strong{background: rgb(187, 52, 52);color: #ffbd3a;padding: 0 0.5rem;margin: 0 1rem;}

#BodyContent{width:100%;padding:0;margin:0}
#BodyContainer_event{width:100%;margin:0}
#BodyHeader_event_rwd,#topli{display:none}
#event_master,#event_sec,#event_third,#event_fourth,#event_fifth{margin:0 auto;display:inline-block;width:1200px;padding:0}
#Master_title{display:block}
#Master_title img{margin: 0 auto;}
#noie{color:#fff;width:100%;height:60px;text-align:center;border:1px solid #069;background-color:#39c;_z-index:9999;z-index:9999;position:fixed;_top:expression(documentElement.scrollTop + "px");left:0;top:0}
#noie a{color:#fc0}
.hottxt{color:#ffd942;font-size:13px}
#BodyHeader_event,#header-share{width:100%;float:left}
#BodyHeader_event a,#BodyHeader_event #header-share{font-size:1.1em}
#BodyHeader_event #header-share{margin:0 auto;background-color:#fff}
#BodyHeader_event #header-share img{margin-bottom:5px;display:inline}
#BodyHeader_event a{color:#333}
#BodyHeader_event a:hover{color:#666}

#askarea SELECT{color:#000;background-color:#fff}
#askarea_out{background-color:#979797;}
#askarea{width:1200px;margin:0 auto;padding:1rem 5rem;text-align:left}
#askarea .asktitle{color:#fff;text-align:center;font-size:1.4rem}
#formlist SELECT,#formlist input{border-radius:.3rem;background-color:#fff;border:#fff;padding:.25rem}
#formlist input[name="sContent"]{width:80%}
#formlist label{display:block;margin:1rem 0;color:#fff;font-size:1.2rem}
#formlist img{display:inline-block}
#formlist input{color:#a1a1a1}
#formlist input[type="submit"],#formlist input[type="reset"]{background-color:#eb543f;color:#fff}
label > select{margin:0 1rem}
#formlist{justify-content:space-around}
#BodyFooter_rwd,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li{width:100%}
#BodyFooter_rwd{float:left;background-color:#fff}
#BodyFooter_rwd a:hover{text-decoration:none}
#BodyFooter_rwd #footer_line{width:90%;height:auto;margin:1% 5%;display:block;float:left;text-align:center;border-top:thin solid #999}
#BodyFooter_rwd #footer_inline a{color:#000;font-size:1em}
#BodyFooter_rwd #footer_inline ul{float:left;padding:0;margin:3% auto 0}
#BodyFooter_rwd #footer_inline ul li{display:inline;line-height:2em;font-size:1em;clear:both;margin-right:.5em}
#BodyFooter_rwd #footer_inline ul li img{width:10%;height:auto;vertical-align:middle;display:inline}
#BodyFooter_rwd #footer_address{margin:0 auto auto;text-align:center}
#BodyFooter_rwd #footer_address a{color:#000}
#BodyFooter_rwd #footer_address ul{padding:0;margin-bottom:1%;text-align:center}
#BodyFooter_rwd #footer_address ul li{margin-right:0;line-height:2em;text-align:center;font-size:1em;list-style-type:none;display:inline-block}
/* Footer end */

@media all and (min-width: 1px) and (max-width: 1200px) {
  @media (max-width: 1024px) {
    .mooc_sort{font-size: 1.1rem;}
    .slide_out{padding: 1rem;}
    button.VueCarousel-navigation-button.VueCarousel-navigation-prev{left:4%}
    button.VueCarousel-navigation-button.VueCarousel-navigation-next{left:85%}
    }
    #BodyHeader_event,.hottxt,#noie{display:none}
    #BodyContent{width:100%;padding:0}
    #BodyContainer_event{width:100%}
    #BodyHeader_event_rwd{text-align:center;width:100%;height:auto;margin:0 auto;background-color:#fff;position:fixed;top:0;float:left;z-index:9;display:initial}
    #BodyHeader_event_rwd img{height:auto;margin:2.5% auto}
    @media screen and (orientation: portrait) {
    #BodyHeader_event_rwd img{max-width:50%}
    }
    @media screen and (orientation: landscape) {
    #BodyHeader_event_rwd img{max-width:25%}
    }
    #Master_title{display:block}
    @media all and (orientation: portrait) {
    #Master_title{margin-top:15%}
    }
    @media screen and (orientation: landscape) {
    #Master_title{margin-top:10%}
    }
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth{margin:0 auto;display:inline-block;width: 100%;padding: 0 2%;}
    #askarea{width:100%;padding:.8rem}
    #askarea .asktitle{font-size:1.1rem}
    #askarea .asktitle > p{line-height:2.2rem}
    #formlist{margin:0 auto}
    #formlist label{font-size:1rem}
    #formlist input[name="sContent"],#formlist label,#formlist SELECT,#formlist input{width:100%;margin:.25rem 0}
    #formlist input[type="submit"],#formlist input[type="reset"]{width:calc(100% / 4.5)}
    #topli,#topli a{color:#fff;text-decoration:none}
    #topli{width:50px;height:50px;text-align:center;border-radius:9999em;background-color:#000;opacity:.4;position:fixed;line-height:50px;font-size:15px;display:initial}
    @media screen and (orientation: portrait) {
    #topli{right:1%;bottom:8%}
    }
    @media screen and (orientation: landscape) {
    #topli{right:1%;bottom:15.8%}
    }
    #BodyFooter_rwd,#footer_line,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li{width:100%;float:left}
    #BodyFooter_rwd{background-color:#fff;margin-top:5%}
    #BodyFooter_rwd #footer_line{margin:5% auto 3%;display:block;height:auto;text-align:center;border-top:thin solid #999}
    #BodyFooter_rwd #footer_inline a{color:#000;line-height:2em}
    #BodyFooter_rwd #footer_inline ul{padding:0;margin-bottom:1%;text-align:center}
    #BodyFooter_rwd #footer_inline ul li img{width:40%;height:auto;margin:0 auto}
    #BodyFooter_rwd #footer_inline ul li{display:inline-block;margin-right:auto;line-height:2em;font-size:1em;clear:both}
    #BodyFooter_rwd #footer_address{margin:0 auto auto;text-align:center}
    #BodyFooter_rwd #footer_address a{color:#000;line-height:2em}
    #BodyFooter_rwd #footer_address ul{padding:0;text-align:center;margin-bottom:1%;clear:both}
    #BodyFooter_rwd #footer_address ul li{display:block;line-height:2em;text-align:center;font-size:.8em}
  /* Footer end */
}

@media screen and (max-width: 767px) and (orientation: portrait) { 
	.group_part.H {font-size: 1.5rem;}
	.group_part.H strong {font-size: 2.2rem;}
	.part_des dt,.part_des dd {font-size: 1.2rem;}
	.group_part {font-size: 1.5rem;}
	.more a {font-size: 1.1rem;}
	.course dt {font-size: 1.3rem;line-height: 1.8rem;padding: 0.3rem;margin-bottom: 0.3rem;}
	.course {padding: 0 0.8rem 2rem;}
	.media_title {font-size: 1.5rem;margin: 1rem auto 1rem;padding: 0.3rem 2rem;width: fit-content;}
	.media {padding: .5rem 1.5rem 1%;}
	.offer dt {font-size: 1.5rem;}
	.offer dd {line-height: 2rem;font-size: 1.2rem;}
	.list_gift {line-height: 1.8rem;font-size: 1.2rem;padding: 0.5rem 1.5rem;}
}