

	.noto-sans-tc-normal {
	  font-family: "Noto Sans TC", sans-serif;
	  font-optical-sizing: auto;
	  font-weight: 400;
	  font-style: normal;
	}

	body {
		border:0;
		padding: 0;
		margin: 0;
		font-family: 'Noto Sans TC';

	}
	
	#searchnews {
		background-color: transparent;
		border: 0;
		width: 10px;
	}

	
	#searchwrap {
	   border: solid 1px #DC6E18;
	   border-radius: 16px;
		display: flex;
		height: 30px;
		align-items: center;
	}
	
	a {
		border: none;
		text-decoration: none;
		color: unset;
	}

	/* Banner */
	#mainframe {
		width:100%;
		border:0;
		padding:0;
	}

	#banner {
		background-color: #EBB354;
		width:100%; height: 134px;
		display: flex;
		align-items: center;
		justify-content: center;

	}

	#logo1 {
		margin-right: 36px;
	}

	#logo2 {
		width: 44px;
	}

	#logo3, #logo4, #logo5 {
		margin-right: 101px;
	}

	/* Menu */

	#menubar {
		background: linear-gradient(90deg, #DC6C16 76%, #FFFFFF 100%);
		width:100%;
		height: 68px;
		display: flex;
		align-items: center;
	}

	#menubar_1 {
		width: 1200px;
		min-width:1200px;
		max-width: 1200px;
		margin: 0 auto;
		justify-content: space-between;
		display: flex;
	}

	.menu_home {
		min-width: 35px;
		height: 30px;
		padding: 0 11px;
		margin-top: 4px;
	}

	.menu_item {
		/*float: left;*/
		min-width: 49px;
		padding: 0 11px;
	}

	.menu_item a {
		color: #FFFFFF;
		text-decoration: none;
		font-size: 25px;
	}

	.menu_item.active {		
		/*float: left;*/
		min-width: 49px;
		padding: 0 11px;
		background-color: #FFFFFF;
		border-radius: 4px;
	}

	.menu_item a.active {
		color: #DC6C16;
		text-decoration: none;
		font-size: 25px;
	}

	/* Adv */
	#top_adv_bar {
		width: 728px;
		margin: 0 auto;
		padding: 20px 0px;
	}

	#top_adv_bar img {
		width: 728px;
	}

	#leftadv {
		float: left;
		width:160px;
		min-height: 600px;
	}


	/*Main Area*/
	#pre_mainarea {
		width: 100%;
	}

	#mainarea {
		margin: 0 auto;
		width: 1568px;
	}

	#maincontent {
		float: left;
		width: 1200px;
		min-width:1200px;
		max-width: 1200px;
		padding: 0 24px;
	}

	#main_left_content {
		width: 876px;
		float: left;
	}
	
	#maincontent_about {
		width: 1200px;
		min-width: 1200px;
		max-width: 1200px;
		margin: 0 auto;
	}


	.realtime_searchbar {
		font-size:24px;
		display: flex;
		flex-direction: row;
		
	}
	
	.realtime_searchbar_color {
		font-size:24px;
		border-bottom: 3px solid;
		border-image: linear-gradient(to right, #DC6C16, #EBB354, #DC6C16, #EBB354) 1 100%;
		border-image-slice: 1;
	}
	
	#beforesearch {
		flex: 1;
	}
	
	.bottom10 {
		padding-bottom: 10px;	
	}

	#searchbar_left {
		flex: 3;
		padding-right: 20px;
	}

	#searchnews {
		width: 70%
	}

	#searchbar_right {
		background-color: #F2F2F2;
		border-radius: 16px;
		font-size: 20px;
		flex: 8; 
	}

	#realtime_heading {
		color: #DC6C16;
		padding: 0 16px;
	}
	
	#realtime_roller {
		display: inline-block;
		color: #0071A9;
		overflow: hidden;
		max-height: 25px;
	}

	#realtime_roller p {
		padding-top: 0;
		margin-top: 0;
	}

	#realtime_block {
		width: 621px;
		float: left;
		border-top: 3px solid;
		border-image: linear-gradient(to right, #DC6C16, #EBB354, #DC6C16, #EBB354) 1 100%;
		border-image-slice: 1;
	}
	
	#realtime_photo {
		height: 350px;
		overflow: hidden;
		
	}
	
	#realtime_photo img {
		width: 100%;
	}
	
	#realtime_cat {
		width: 48px;
		height: 24px;
		border-radius: 5px;
		gap: 10px;
		padding-right: 8px;
		padding-left: 8px;
		background: #DC6C16;
		color: white;
		position: relative;
		top: -50px;
		text-align: center;
		left: 10px;
	}
	
	#realtime_title {
		max-width: 100%;
		height: 80px;
		padding-top: 5px;
		padding-right: 15px;
		padding-bottom: 5px;
		padding-left: 15px;
		color: white;
		background: linear-gradient(270deg, #EBB253 0%, #E49136 14%, #DC6E18 100%);
		font-size: 24px;
	}
	
	#realtime_short_block {
		float: right;
		border-top: 3px solid; 
		/*border-image: linear-gradient(to right, #DC6C16, #EBB354, #DC6C16, #EBB354) 1 100%;*/
		border-image: url(../images/subtitle_underline.png);
		border-image-slice: 1;
	}
	
	.short_block {
		width: 223px;
		height: 77px;
		border-bottom: solid 1px #C1C1C1; 
		margin: 5px 0; 
		padding-bottom: 8px;
	}
	
	.short_block:last-child {
		width: 223px;
		height: 77px;
		margin: 5px 0;
		border-bottom: none;
	}
	
	.short_block_type {
		width: 44px;
		height: 24px;
		border-radius: 5px;
		padding-right: 8px;
		padding-left: 8px;
		background: #DC6C16;
		color: white;
	}
	
	.short_block_date {
		color: #7F7F7F;
		padding-left: 20px;
	}
	
	#realtime_block_3, #realtime_block_3a {  /* Block for 1/3 width, with images */
		border-top: 1px solid #E1E1E1;
		clear: both;
		padding: 10px 0;
		
	}
	
	#realtime_block_3 > div:nth-child(3n+1) {
		float: left;
		width: 278px;
		height: 257px;
		margin-left: 0px;
	}
	
	#realtime_block_3a > div:nth-child(3n+1) {
		float: left;
		width: 278px;
		margin-left: 0px;
	}
	
	#realtime_block_3 > div {
		float: left;
		width: 278px;
		height: 257px;
		margin-left: 21px;
	}
	
	#realtime_block_3 img {
		max-width: 278px;
		max-height: 156px;
	}
	
	#realtime_block_3a > div {
		float: left;
		width: 278px;
		margin-left: 21px;
	}
	
	.rt_block_3_each > div:first-child {
		float: left; 
	}
	
	.rt_block_3_each > div:last-child {
		float: right;
		width: calc(100% - 10px); 
	}
	
	.rt_block_3_each_caption {
		height: 50px;
	}
	
	#heattopic_bar, #shorttopic_bar {
		font-size:24px;
		display: flex;
		flex-direction: row;
		border-bottom: 3px solid;
		border-image: linear-gradient(to right, #DC6C16, #EBB354, #DC6C16, #EBB354) 1 100%; border-image-slice: 1;
	}
	
	.topic_title {
		flex: 1;
		background: url(../images/title_bg.png) no-repeat;
		color: #FFFFFF;
		padding-left: 11px;
	}
	
	.short_title {
		flex: 1;
	}
	
	#realtime_block_3a .topic_title {
		flex: 5;
		font-size:24px;
		background: none;
		color: #000000;
		padding-left: 0px;
	}
	
	.bar_more {
		color: #818181;
		font-size:18px;
		text-align: right;
		flex: 5;
	}
	
	#realtime_block_3a .bar_more {
		color: #818181;
		font-size:16px;
		text-align: right;
		flex: 1;
		display: contents;
	}
	
	#realtime_block_3a .short_block {
		width: 100%;
		height: 77px;
		border-bottom: solid 1px #C1C1C1;
		margin: 5px 0;
		padding-bottom: 8px;
	}
	
	#realtime_block_3a .short_block:last-child {
		padding-bottom: 0px;
	}
	
	
	#main_middle_billboard {
		padding: 30px 0;
		text-align: center;
		vertical-align: middle;
	}
	
	
	#main_right_adv {
		float: right;
		width: 300px;
	}
	
	#right_adv1 img, #right_adv2 img {
		width: 300px;
	}
	
	#right_adv2 {
		margin-top: 10px;
	}
	
	.right_adv2_block {
		border-bottom: solid 1px #7F7F7F;
		padding: 5px 0;
	}
	
	.right_adv2_block img {
		width: 300px;
	}
	
	.right_adv2_block_text {
		padding: 3px 0;
	}
	
	.right_adv2_block_lowertext {
		color: #7F7F7F;
	}
	
	.right_adv2_block_lower_AD {
		float: left;
		font-size:15px;
	}
	
	.right_adv2_block_lower_AD span{
		border: 1px solid #7F7F7F;
		border-radius: 3px;
	}
	
	.right_adv2_block_lower_more {
		float: right;
		font-size:15px;
	}
	
	#short_adv {
		height: 972px;
		overflow-y: scroll;
		border: solid 1px #7F7F7F;
		background-color: #F2F2F2;
	}
	
	.shorts_overview {
		margin: 5px;
		background-color: #FFFFFF;
	}
	
	.shorts_overview_thumbnail {
		float: left;
		margin: 16px;
	}
	
	.shorts_overview_buttons {
		float: left;
		text-align: center;
		margin-top: 42px;
	}
	
	.shorts_overview_buttons img {
		max-width: 37px;
	}
	
	.shorts_overview_number {
		color: #C1C1C1;
		font-size: 13px;
	}
	
	.shorts_divheight40 {
		height: 40px; 
	}
	
	#rightadv {
		float: left;
		width: 160px;
	}
	
	#footer {
		background-color: #929292;
		width: 100%;
		text-align: middle;
		margin-top: 40px;
		padding: 15px 0;
	}
	
	#footer_company {
		text-align: center;
		color: #FFFFFF;
		font-size: 38px;
		font-weight: 700;
		line-spacing: 4%;
		margin: 23px 0;
	}
	
	#footer_company img {
		vertical-align: middle;
		margin-right: 16px;
	}
	
	#footer_company span {
		vertical-align: middle;
	}
	
	#footer_social_button {
		text-align: center;
		margin: 16px 0;
	}
	
	#footer_social_button a {
		margin: 0 15px;
	}
	
	#footer_link, #footer_info {
		text-align: center;
		margin: 16px 0;
		font-size: 18px;
	}
	
	#footer_link a {
		margin: 0 15px;
		font-size: 18px;
		color: #FFFFFF;
		text-decoration: none;
		white-space: nowrap;
	}
	
	#footer_info span {
		margin: 0 15px;
		font-size: 18px;
		color: #FFFFFF;
	}
	
	#footer_span img {
		vertical-align: middle;
	}
	
	#footer_copyright {
		text-align: center;
		margin: 15px 0;
		font-size: 15px;
		color: #FFFFFF;
	}
	
	#content_block {
		width: 615px;
		float: left;
	}
	
	#content_block_title {
		font-size:24px;
		border-bottom: 3px solid;
		border-image: linear-gradient(to right, #DC6C16, #EBB354, #DC6C16, #EBB354) 1 100%;
		border-image-slice: 1;
	}
	
	#content_title_article {
		font-size: 26px;
		line-height: 42px;
		font-weight: 700;
	}
	
	#content_date {
		font-size: 16px;
		line-height: 24px;
		color: #818181;
	}
	
	#content_photo_caption {
		font-size: 16px;
		line-height: 24px;
	}
	
	#content_text {
		font-size: 19px;
		line-height: 36px;
	}
	
	#commentry_list_item, .commentary_list_item {
		padding: 40px 0;
		display: flex;
		flex-wrap: wrap;
	}
	
	.commentry_item {
		flex-basis: 420px ;
		flex-shrink:0;
		margin-bottom: 37px;
	}
	
	.commentry_item:nth-child(2n) {
		margin-left: 32px;
	}
	
	.commentry_item > div {
		padding: 11px 0;
	}
	
	.commentary_list_item_image {
		flex-basis: 388px;
		flex-shrink:0;
		border: 6px solid;
		border-image: linear-gradient(317.97deg, #FFB303 17.33%, #E49136 27.6%, #FFFFFF 38.24%, #EB8A3F 50.72%, #FFDF94 75.31%, #FEAB69 90.72%) 1 100;
		
	}
	
	.commentary_list_item_image img {
		max-width: 388px;
	}
	
	.commentary_list_item_textblock {
		flex-basis: 450px;
		flex-shrink:0;
		border-bottom: 1px solid #C7C7C7;
		margin-left: 25px;
		display: flex;
		flex-flow: wrap;
	}
	
	.commentary_list_item_title {
		font-size: 20.5px;
		line-height: 24px;
		font-weight: 700;
		border-bottom: 3px solid;
		border-image: linear-gradient(270deg, #EBB253 0%, #E49136 28.5%, #DC6E18 100%) 1 100;
		padding-bottom: 10px;
		max-height: 100px;
		height: 50px;
	}
	
	.commentary_list_item_content {
		font-size: 18px;
		line-height: 30px;
		align-self: flex-end;
	}
	
	.leftline {
		float: left;
		width: 4px;
	}
	
	.commentry_text {
		float: right;
		width: 416px;
	}
	
	.commentry_text div:first-child {
		font-size: 20px;
		line-height: 25px;
		font-weight: 700;
		padding: 0 17px;
	}
	
	.commentry_text div:last-child {
		font-size: 16px;
		line-height: 26px;
		padding: 0 17px;
	}
	
	
	ul.pagination {
		display: flex;
		list-style: none;
	}
	
	ul.pagination > li {
		flex-basis: 20px;
		color: blue;
	}
	
	.about_logo {
		text-align: center;
		margin: 30px 0;
	}
	
	.about_title {
		width: 100%;
		background-image: url(/images/BACK1089A.png);
		color: white;
		text-align: center;
		font-family: Noto Sans TC;
		font-weight: 700;
		font-style: Bold;
		font-size: 30px;
		line-height: 66px;
		letter-spacing: -4%;
		margin: 30px 0;
	}
	
	.about_text {
		width: 100%;
		font-family: Noto Sans TC;
		font-weight: 500;
		font-style: Medium;
		font-size: 18px;
		line-height: 42px;
		letter-spacing: -4%;
		text-align: center;
		color: #DC6C16;
		margin: 30px 0;
	}
	
	.about_text > h5 {
		background-color: #EEEEEE;
		color: #7C0000;
		font-size: 18px;
	}
	
	.about_text > span {
		margin-right: 20px;
	}
	
	.fantasticmedia {
		font-size: 26px;
	}
	
	.about_logos {
		display: flex;
		width: 768px;
		justify-content: space-between;
		margin: 0 auto;
	}
	
	#maincontent_about hr {
		margin: 50px 0;
	}
	
/* MOBILE RWD */

@media (max-width: 768px) {
  body {
    
  }
  
  #logo1 {
	  max-width: 30vw;
	  margin-right: 4vw;
  }
  
  #logo2 {
	  margin-right: 2vw;
	  width: unset;
  }
  
  #logo3, #logo4, #logo5, #logo6 {
	  margin-right: 2vw;
	  max-width: 23vw;
  }
  
  #banner {
	  height: 10vh;
  }
  
  #logo1 img{
	  max-width: 30vw;
  }
  
  
  #logo2 img {
	  max-width: 15vw;
	  max-height: 5vh;
  }
  
  #logo3 img, #logo4 img, #logo5 img, #logo6 img {
	  max-width: 11vw;
  }
  
  #leftadv, #main_middle_billboard {
	  display: none;
  }
  
  #top_adv_bar {
	  max-width: 100%;
  }
  
  #top_adv_bar img {
	  max-width: 100%;
  }
  
  #maincontent, #mainarea {
	  width: 100%;
	  float: none;
	  min-width: 100%;
	  max-width: 100%;
	  padding: 0 !important;
	  margin: 0;
  }
  
  #main_left_content {
	  width: 90vw;
	  float: none;
	  padding: 0 5vw;
	  margin: 0;
  }
  
  #menubar {
	  width: 100%;
	  overflow-x: scroll;
  }
  
  #menubar_1 {
	justify-content: flex-start;
	display: flex;
  }
  
  #realtime_block {
	  width: 100%;
	  float: none;
	  min-width: 100%;
	  max-width: 100%;
	  
  }
  
  #realtime_photo {
	  width: 100%;
	  min-width: 100%;
	  max-width: 100%;
	  height: 66vw;
	  
  }
  
  #beforesearch {
		flex: none;
	}
  
  #realtime_short_block {
	  float: none;
  }
  
  #realtime_block_3 > div {
	  margin-left: 0px;
	  float: none;
	  width: 100%;
	  height: unset;
	  padding: 0px;
	  clear: both;
  }
  
  #realtime_block_3a > div, #realtime_block_3a > div:nth-child(3n+1) {
	  float: none;
	  width: 100%;
	  margin-left: 0;
  }
  
  #realtime_block_3 > div:nth-child(3n+1) {
	  width: 100%;
	  height: unset;
	  float: none;
	  padding: 0px;
  }
  
  #realtime_block_3 img {
	max-width: 90%;
	max-height: unset;
  }
  
  .realtime_searchbar {
	  width: 100%;
	  padding-top: 15px;
  }
  
  .topic_title {
	  flex: 20;
  }
  
  .rt_block_3_each, .rt_block_3_each > div:first-child {
	  
  }
  
  
  .rt_block_3_each_caption {
	  width: 70vw;
	  min-height:40px;
	  height: unset;
  }
  
  .short_block, .short_block:last-child {
	  width:94%;
	  height: unset;
	  margin: 10px;
  }
  
  .commentary_list_item_image {
		flex-basis: 100%;
		
	}
	
   .commentary_list_item_image img {
		max-width: 86vw;
	}
	
  .commentary_list_item_textblock {
	  flex-basis: 100%;
	  margin-left: 0;
	  
  }
  
  .commentary_list_item_title {
	  border-bottom: none;
  }
  
  .commentary_list_item_content {
	  font-size: 16px;
  }
  
  ul.pagination {
	padding-left: 5vw;
  }
  
  #content_block {
	width: 100%;
	float: none;
  }
  
  #content_block_width {
	  width: 100%;
	  float: left;
  }
  
  #main_right_adv {
	  float: none;
	  width: 100%;
	  margin-top: 10vh;
  }
  
  #right_adv1, #right_adv1 img {
	  width: 100%;
  }
  
  
  #footer_info span, #footer_copyright span{
	  display: block;
  }
  
  #footer_link, #footer_info {
	  line-height: 30px;
	  margin: 10px 0;
  }
  
  #maincontent_about {
	  width: calc(100% - 20px);
	  max-width: unset;
	  min-width: unset;
	  padding: 0 10px;
  }
  
  .commentry_item > img {
	  width: calc(100vw - 39px);
  }
  
  .commentry_item:nth-child(2n) {
	  margin-left: 0px !important;
  }
	  
  
  .about_logo > img {
	  width: 50vw;
  }
  
  .about_logos {
	  width: 100%;
	  justify-content: space-around;
	  flex-wrap: wrap;
  }
  
  .about_text {
	  text-align: left;
  }
  
  .about_text > span {
	  display: block;
  }
}
	
	