@charset "utf-8";
/* CSS Document */


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, 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,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "新細明體", PMingLiU, sans-serif;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {line-height: 1; height:100%;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
a{
	/*text-decoration:none;*/
	color: #ffffff;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* =RESET ALEXANDRE (alex@burocratik.com)
------------------------------------------------------------------------*/ 
abbr, span.abbr{border-bottom: none;} 
.clear{clear:both; height: 0;}
.hide{position: absolute; top: -9999px; left: -9999px; overflow: hidden;}
.hidetext {text-indent: 100%;white-space: nowrap;overflow: hidden;}



/*enrich header*/
.box{ max-width: 1024px; margin: 0 auto; }
.top{ width: 100%; height:40px; background-color: #ffffff;}
.logo{ height: 40px; text-align: left; float: left;}
.fb{ width: 148px; height: 27px;  position: absolute; right:29%; top:1%;}

/*main & sign up*/
.main_bg{ width: 100%; height: 580px; background-image: url(../images/MPS-bg.jpg); background-size: cover; }
.pic{ float: left; padding-top: 120px;}
.speakers_frame{ width: 584px; height: 580px; float: left; }
.speakers{width: 150px; height: 480px; background-color: #fff; margin:15px; }
.speakers img{ display:block; margin:auto; top:10px;}
.signup_box{
	width: 29%; 
	height: 150px; 
	float: left; 
	background-color: #fff; 
	border:10px solid #fff100; 
	margin-left: 6%; 
	margin-top: -130px;
	z-index:888;
	position:relative;
	}
.signup{width: 96%; height: 140px; float: left; background-color: #fff; border:6px solid #ec0000; }
.signup_red{width: 100%; height: 140px; float: left; background-color: #fff100; }
.red{ font-size: 64px; color: #ec0000;}
.black{ font-size: 40px; color: #000; font-weight: 900; margin-left: -20px;}
.bgColor p { font-size: 20px; text-align: center; }
.signup h1 {
	color:#000;
	font-size:24px; 
	text-align:center;
	margin-top:10px;
	}
.signup h2 {
	color:#000;
	text-align:center;
	font-size:24px; font-weight: 900;
	margin:5px;
	}
.signup h4 {color:#ff0000;	text-align:center;font-size:48px; font-weight: 600;	margin:5px; margin: 20px;}
.signup h5 {color:#000000;	text-align:center;font-size:24px; margin:5px;	}
.signup h6 {color:#fff100;	text-align:center;font-size:18px; font-weight: 600;	margin:5px;	}
.bgColor { width:80%; margin: 0 auto; border-radius:10px; }	

.list {	width:100%;	height:auto;}
.list li {
	width:50%; /*min-height:44px;*/
	border:1px solid #fd0000;
	padding:10px 20px 10px 10px;
	position:relative;
	margin: 0 auto;
	line-height:22px;
	}
.list li a {display:block;color:#fd0000; text-align: center; font-size: 24px; font-weight: 800;}	
.list li img {
	display:block;
	position:absolute;
	top:15%;
	right:-13px;
	}	
.list li i {
	color:#868686;
	font-size:13px;
	font-style:normal;
	}
.type li p.infoDot {
	color:#868686;
	font-size:15px;
	line-height:22px;
	margin-top:10px;
	}
.bg_Triangle{ width:100%; height:150px;  position:  absolute; margin-top:-150px; z-index:1; background-image:url(../images/Triangle_1.png); background-repeat:no-repeat; background-position:bottom; background-size:contain;}


/*content*/
.content{ width: 100%; height: 600px; background-color: #fff;  margin-top: 100px;  margin-bottom: 40px;}
.content_1{ width: 96%; padding: 2%; text-align:center; line-height: 1.6; font-size: 20px; letter-spacing: 1px; margin-bottom: 40px;}
.content_t{ width: 240px; background-color: #ffffff; padding: 10px 25px; border: 4px solid #000; font-size: 40px; text-align: center; margin: 0 auto;}
.content_2{ width: 96%;  padding: 2%; text-align:center; color: #e6231c; line-height: 1.6; font-size: 32px; letter-spacing: 1px; margin: 0 auto; }

/*agenda*/
.col-md-12 col-sm-12 { padding: 10px;}
#agenda{  overflow: hidden;  padding: 40px 20px;}
.flex_box{ display: flex;}
.flex_box_r{flex: 3;}
#agenda .section-title h1{ background-color: #fff;;}
.timeline {
  border-left: 5px solid #cd1b24;
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
  margin: 50px auto;
  position: relative;
  list-style: none;
  text-align: left;
  font-size: 20px;
  max-width: 800px;
}
.timeline h3 { margin: 10px 0;	letter-spacing: 0; font-size: 24px; font-weight: 800; line-height: 1.4;}
.timeline p{ line-height: 30px; font-size: 18px; margin: 0 0 10px; letter-spacing: 1.2px; color: #cd1b24;font-weight: 600;}
.timeline .event {
  border-bottom: 1px solid rgba(160, 160, 160, 0.2);
  /* padding-bottom: 15px; 
  margin-bottom: 15px;
  background-image: linear-gradient(45deg, #fff 20%,#e4e4e4 50%);*/
  padding: 15px 20px;  
  position: relative;
}
.timeline .event:nth-child(odd){ background: #f2f2f2;}
.timeline .event:nth-child(even){ background: #fff;}
.timeline .event:last-of-type {
  margin-bottom: 0;
  border: none;
}
.timeline .event:before,
.timeline .event:after {
  position: absolute;
  display: block;
  top: 0;
}
.timeline .event:before {
  color: #cd1b24;
  content: attr(data-date);
  font-size: 24px;
  position: relative;
  font-weight: bold;
}
.timeline .event:after {
    box-shadow: 0 0 0 5px #cd1b24;
    left: -8px;
    background: #f2f2f2;
    border-radius: 50%;
    height: 10px;
    width: 10px;
    content: "";
    top: 25px;
    transform: rotate(45deg);
}
#pricing { text-align: center; background: #dbdcdc;}
.section-title h1 {
    display: inline-block;
    padding: 10px 25px;
    border: 4px solid #000;
    position: relative;
    font-size: 40px;
}

/*Map&Notice*/
.notice{width: 100%; background-color: #fff; padding-top: 3%; padding-bottom: 3%;}
.notice_c{ color: #000; font-size: 20px; margin: 5px 5px 20px 5px;; text-align: left; line-height: 1.6; letter-spacing: 1px; }
.notice_title{ width: 298px; height: 28px; background-color: #000000;color: #ffffff; font-size: 22px; text-align: center; line-height: 30px; margin: 0 auto;}
.notice_2{ width: 95%; float: left; padding-left: 5%; margin-top: 2%;}
.notice_1 img { margin-left: 24%; margin-top: 12%; }
.map_bg{width: 100%; background-color: #dbdcdc; padding-top: 3%; padding-bottom: 3%;}
.map_info{width:300px ; float: left; padding: 2%;  margin-left: 3%;}
.map{ width: 100%; margin-left: 6%;}
.mapouter{ overflow:hidden; width:450px; height:250px; float: left; margin-top: 20px; margin-bottom: 20px;}
.gmap_canvas {background:none!important; width:450px; height:250px;}

.notice1{width: 90%; background-color: #666666; padding-left: 10%; padding-top: 1%; padding-bottom: 1%;}
.notice1_t{ color: #000000; font-size: 18px; margin: 5px; text-align: left; line-height: 1.4; letter-spacing: 1px; }
.notice1_2{ width: 80%; float: left; padding-left: 20%;}

/*sponsor*/
.sponsor{width: 100%; height: 100px; background-color: #000; margin-bottom: auto;}
.sponsor_1{ font-size: 24px; color: #fff; float: left; margin-top: 5%; margin-left: 16%; width: 120px;}
.sponsor_logo{ max-width: 280px; float:left; margin-top:3%; margin-right: 2%; }


.flex_box_r span, .event span {
    font-weight: 600;
}

@media screen and (min-width: 320px) and (max-width: 768px) {
.top{ width: 100%; height: 35px; background-color: #fff;}
.fb{display: none;}
.logo{ width: 40%; height: auto; }
.main_bg{ width: 100%; height: 500px; background-color: #fec204; padding-bottom: 10%; }	
.pic{ width: 90%; padding-left: 6%; padding-top: 50px;}
.speakers_frame { display: none;}
.signup_box { width: 70%; height: auto; margin: -2% 15% 2% 15%;}	
.signup {width: 96%; height: auto;}
.signup_red{width: 90%; height: 150px; float: left; background-color: #ff0000; margin: 5%; }
.signup_red h4 { font-size: 44px; font-weight: 600; }
.signup_red h6 { font-size: 16px; font-weight: 600; }
.black { font-size: 32px; color: #000; font-weight: 900;}
.bgColor p { font-size: 16px; color: #6d6d6d; margin-bottom: 20px;}
.content { margin: 0;height: 950px;}
.notice_title{ height: auto;}
.notice_1 { display: none;}	
.notice_2 { width: 90%; }
.notice1{ width: 100%; padding: 0;}
.notice1_2 { width: 92%; margin: 4%; padding: 0; }
.sponsor{width: 100%; height: 210px;}
.sponsor_1{ margin-left: 35%; margin-top: 5%;}
.sponsor_logo{margin-left: 12%; margin-bottom: 2%; }
.content_1{ width:90%; padding: 5%; }
.content_2{ font-size: 22px;}
.map{ margin: 0 auto; }
.mapouter{ width: 90%; margin: 5%;}
.gmap_canvas {background:none!important; width:450px; height:300px;}
.map_info{ padding: 5%; }
.content_t{margin-top: 30px;}
}


