@font-face {
  font-display: swap;
}
body{
	font-family:'微軟正黑體', '蘋方', 'Noto Sans TC', sans-serif;
	font-size:16px;
	}
.WapNo{	
	white-space:nowrap;
	}
	
/*我要預約*/
.BACKTOP{
	position:fixed;
	z-index:999;
	padding-bottom:50px;
	bottom:0px;
	right:50px;
	display:block;
	text-align:center;
	font-family:'微軟正黑體', '蘋方','Noto Sans TC',"Noto Sans","Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Verdana", "sans-serif";
	font-weight:900;

	}

.GObook{
	position:fixed;
	z-index:998;
	padding-bottom:150px;
	bottom:0px;
	right:50px;
	display:block;
	text-align:center;
	font-family:'Noto Sans TC',"Noto Sans","Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Verdana", "sans-serif";
	font-weight:900;

	}

/*Go Event*/
.GEvent{
	position:fixed;
	z-index:999;
	padding:28px;
	bottom:100px;
	right:38px;
	display:block;
	text-align:center;
	font-family:'Noto Sans TC',"Noto Sans","Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Verdana", "sans-serif";
	}

.Gimgshadow{
	box-shadow:1px 1px 5px #333;
	}
#red_book{
	background-color:#FF0004;
	color:#fff; 
	font-size:1.5em; 
	display:block; 
	padding:15px; 
	border-radius:8px; 
	box-shadow:1px 1px 2px #333333;
	text-decoration:none;
	}	

	
	
.GEvent_m{
	position:fixed;
	z-index:666;
	padding:18px;
	bottom:30px;
	right:10px;
	display:block;
	text-align:center;
	font-family:'Noto Sans TC',"Noto Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Verdana", "sans-serif";
	}	
#red_book_m{
	background-color:#FF0004;
	color:#fff; 
	font-size:1em; 
	display:block; 
	padding:6px; 
	border-radius:5px; 
	box-shadow:1px 1px 1px #333333;
	text-decoration:none;
	}	
	
#booking{
	position:relative;
	z-index:888;
	}	

/*END---我要預約*/


#BB-gray { font-size: 0.8em; padding: 2px 15px; list-style: none; margin-bottom: 1px; text-decoration: none; }
#BB-gray > li { display: inline-block; padding: 0px; }
#BB-gray > li + li:before { content: ">"; padding: 0 5px; }
#BB-gray > li > a { text-decoration: none; }

#BB-gray { color: #666; }
#BB-gray > li { color: #666; }
#BB-gray > li + li:before { color: #666; }
#BB-gray > li > a { color: #666; }



.head {
  font-family:'Noto Sans TC', sans-serif;
  position: relative;
  color: #fff;
}

.MainBk01{
	background-color:#fff;
	background-size:cover;
	background-position:center center;
	padding:6% 1% 8% 1%; 
	color:#000;
	ont-family:'Noto Sans TC', sans-serif;
	}

.TpArea{
	position:absolute; z-index:1; top:8%; left:12%; width:80%; 
	font-size:0.7em;
	}


.OlineBigT{
	font-size:1.8em;
	font-weight:bold;
	margin-bottom:25px;
	}
.OlineTitle{
	-webkit-transition: 0.5s ease-in-out;
    	-moz-transition: 0.5s ease-in-out;
    	-o-transition: 0.5s ease-in-out;
    	transition: 0.5s ease-in-out;
	}

.OlineTitle.mymove:hover {
    -webkit-transform: translate(0,1.5em);
    -moz-transform: translate(0,1.5em);
    -o-transform: translate(0,1.5em);
    -ms-transform: translate(0,1.5em);
    transform: translate(0,1.5em);
  }
.OlineTwords{
	color:#fff; 
	background-color:#353535; 
	padding:3px 6px;
	font-size:1.3em;
	font-weight:500;
	margin-bottom:8px;
	} 
.Ot-img-01{
	background-size:cover;
	background-image: url(../images/client/course/pd/z9_back.jpg);
}
.Ot-img-02{
	background-size:cover;
	background-image: url(../images/client/course/pd/z9_back.jpg);
}

.PadingBtm{
	padding-bottom:25px;
	}
.MarginBtm{
	margin-bottom:25px;
	}
.PdArea_02{
	padding:2.5% 8% 3% 8%; 
	background-color:#372B49; 
	color:#fff;
	}
.PdArea_02 h2{
	color:#fff; 
	font-size:1.15em;
	line-height:1.8em;
	}
.PdA2sub{
	font-size:1em;
	}
.PdArea_002{
	padding:6% 8% 6% 8%; 
	background-color:#372B49; 
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
	color:#fff;
	}
.PdArea_03{
	width: 100%;
    margin: 0 auto;
    height: auto;
    padding: 5% 5% 1% 5%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
    line-height: 28px;	
	}
.p-out-01{
	background-size:cover;
	background-image:url(../images/client/course/Sketching/bk-pic-0612.png);
}	
.p-out-02{
	background-size:cover;
	background-image:url(../images/student/event/TOF_bk.jpg);
	color: #fff;
}

.Area_03{
	background-color:#fff; 
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
	padding:5%; color:#000;
	line-height:1.5em;
	}
.ContTL{
	color: #394e77;
	font-size: 1.6em;
	font-weight: 800;
	line-height: 1.5em;
	}
.ContWd{
		line-height:1.8em;
		font-size:1.1em;
		padding:6px;
	}
.p-out-03{
	background-size: cover;
	background-image: url(../images/client/course/indesign/IDon.jpg);
}
.p-out-04{
	background-size:cover;
	background-image: url(../images/client/course/AE/online/vd_back.png);
}

.PdArea_04{
	padding:5% 7%; 
	background-color:#323235; 
	color:#fff;
	}
.PdArea_05{
	background-image:url(../images/client/course/pd/pd_zback_05.png);
	background-size:cover;
	background-position:bottom;
	padding:5% 7%; 
	}
.PdArea_06{
	padding:5% 5%; 
	background-color:#323235; 
	color:#fff;
	}
.PdArea_06 a{
	text-decoration:none;
	color:#fff;
	}
.A06_StIntro{
	font-size:1em; 
	font-weight:200;
	}
.PdArea_06 a:hover{
	text-decoration:none;
	color:#E0FFE8;
	}
.PdArea_07{
	background-image:url(../images/client/course/pd/pd_zback_06.png);
	background-repeat:no-repeat;
	background-position: bottom;
	background-size:cover;
	padding:5% 10% 3% 10%;
	z-index:2;
	}
.PdArea_08{
	padding:5% 0px 9% 0px; 
	background-color:#d8d8d8;
	z-index:2;
	
	}
.Z8OvPic{
	border:1px solid #888; border-radius:15px; margin-bottom:15px; margin-top:15px;
	}
.Z8OvHead{
	font-size:1.5em; 
	font-weight:bold; 
	line-height:1.5em;
	}
.PdArea_09{
	width: 100%;
    margin: 0 auto;
    height: auto;
    padding: 3% 10% 0% 12%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
    line-height: 28px;
	background-color:#2c2e30;
	}
.p-img-01{
	background-size: cover;
	background-image: url(../images/client/course/indesign/IDfee.jpg);
	color: #000;
}
.OpDay{
	background-color:#fff;
	padding:20px; 
	width:100%; 
	margin-top:25px;
	margin-bottom:25px;

	}
.Area1H1{
	font-size:1em; text-shadow:1px 1px 5px rgba(0,0,0,0.6);
	}
.Area1SubT{font-size:0.9em; line-height:2em;}

.TextAl{text-align:center;
}
.PicSize{
	width:100%;
	max-width:200px;
	}
.RT18E{
	font-size:1.1em; 
	line-height:1.2em;
	font-weight:700;
	}
.RTT15B18H{
	font-size:1.4em; 
	font-weight:800; 
	line-height:1.2em;
	}
.RT_SQTT{
	padding:10px 10px 10px 10px;
	border:1px solid #333; 
	margin-left:0px;
	margin-bottom:10px;
	font-size:1.5em;
	line-height:1.5em;
	text-align:center;
	}
.TheLine01{
	border-right:0px solid #CCC;
	}
.WhitTop2Em{
	line-height:1.5em; margin-top:0px; font-size:2em;
	}
.TrHead{
	color:#fff; background-color:#000; padding:15px 16px 15px 16px; font-size:1.3em;
	}
.BkWhite{
	padding:45px 25px 25px 25px; background-color:rgba(255,255,255,0.9); border-radius:15px 15px 15px 15px;
	}
.TopM{margin-top:1%
	}	
.HeadWord01{
	color:#87a84e; font-size:3.6em; font-weight:800;
	}
.TeaInfo{
	color:#5c6845; font-weight:400; font-size:0.8em;
	}
.EvenTime{font-size:1.3em; font-weight:800; color:#DC2326;
	}
.BH_01{
	font-size:0.9em;
	}

.BH_03{
	font-size:1em; font-weight:200;
	}
.ZoneS_01{
	padding:15% 5% 12% 5%
	}
.TextA2{
	text-align:center;
	}
	
.StPicst{border:5px solid #fff; box-shadow:1px 1px 5px #000;}

.ArIc::after{
	content:url(../images/client/course/rhino/green-arror-s.png);
	position:absolute; margin-left:15px; margin-top:-28px;
	/*font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f04b";
	margin-left:25px; color:#85a9aa; margin-bottom:25px;*/
	}

	
@media only screen and (max-width: 374px) and (min-width: 767px) {
.BH_01{
	font-size:1.5em;
	}

.BH_03{
	font-size:1.2em; font-weight:200;
	}
.ZoneS_01{
	padding:18% 5% 12% 5%
	}
.TextA2{
	text-align:center;
	}

}
@media only screen and (max-width: 991px) and (min-width: 768px) {
	.ZoneS_01{
	padding:10% 5% 10% 5%
	}
	.TextA2{
	text-align:center;
	}	
	}

	
@media (min-width: 992px) {
	
.BH_01{
	font-size:2em;
	}

.BH_03{
	font-size:1.8em; font-weight:200;
	}
	
.ZoneS_01{
	padding:5%;
	}	
	
.TextA2{
	text-align:center;
	}	
.MainBk01{
	background-color:#fff;
	background-size: cover;
	background-position:botton center;
	padding:2% 0% 2% 0%; 
	color:#000;
	ont-family:'微軟正黑體', sans-serif;
	}
.TpArea{
	position:absolute; z-index:1; top:25%; left:12%; width:40%;
	}
	
.Area1H1{
	font-size:1.4em; text-shadow:1px 1px 5px rgba(0,0,0,0.6);
	}
.Area1SubT{font-size:1.8em; line-height:2em;}
.PadingBtm{
	padding-bottom:15px;
	}
.PadingBtm2{
	padding-bottom:30px;
	}
.PdArea_02 h2{
	color:#000; 
	font-size:1.8em;
	line-height:1.8em;
	}
.PdA2sub{
	font-size:1.15em;
	}
.PdArea_02{
	padding:8% 2% 5% 2%; 
	background-color:#372B49; 
	color:#fff;
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
	}
.PdArea_03{
	width: 100%;
    margin: 0 auto;
    height: auto;
    padding: 3% 12% 3% 12%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
    line-height: 28px;	
	}
.PdArea_06{
	padding:5% 10%; 
	background-color:#233235; 
	color:#fff;
	}
.OpDay{
	background-color:#fff;
	padding:20px; 
	width:100%; 
	margin-top:25px;
	margin-bottom:25px;
	}
.TextAl{text-align:left;
}
.PicSize{
	width:100%;
	}
.RT18E{
	font-size: 1.2em;
	line-height: 1.3em;
	}
.RTT15B18H{
	font-size:1.6em; 
	font-weight:800; 
	line-height:1.2em;
	}
.RT_SQTT{
	padding: 10px 10px 10px 10px;
	border: 1px solid #333;
	margin-left: 6px;
	font-size: 1.5em;
	line-height: 1.5em;
	text-align: center;
	}
.TheLine01{
	border-right:1px solid #CCC;
	}
.WhitTop2Em{
	line-height:1.8em; margin-top:-30px; font-size:1.8em;
	}

.TrHead{
	color:#fff; background-color:#000; padding:15px 35px 15px 120px; font-size:2.5em;
	}
.BkWhite{
	padding:45px 25px 25px 25px; background-color:rgba(255,255,255,0.9); border-radius:15px 15px 0px 0px;
	}
.TopM{margin-top:15%
	}
.HeadWord01{
	color:#87a84e; font-size:3.8em; font-weight:800;
	}
.TeaInfo{
	color:#5c6845; font-weight:600; font-size:0.85em;
	}
.EvenTime{font-size:1.6em; font-weight:800; color:#DC2326;
	}
.TpArea{
	position:absolute; z-index:1; top:25%; left:10%; width:80%; 
	font-size:1em;
	}
.ContWd{
		line-height:1.8em;
		font-size:1.3em;
		padding:6px;
	}
}