/* Fu_Banner >> fix background (背景固定) */
.markets-top-banner.richcontent .fix_bg.RC_BG {
    background-attachment: fixed;
}



/**************  標題底 (Title) >> 藍線  **************/
.title_underline_Blue .markets-solutions-overview h2,
.title_underline_Blue .markets-solutions-applications h2,
.title_underline_Blue .markets-solutions-benefits h2 {
    border-bottom: 2px solid #19a7c6;
    display: inline-block;
    padding: 5px 0px !important;
}




/* LI Section >> 文字整齊 */

.li-section li::before {
    list-style: none;
    content: "■ ";
    color: #2292D3;
    margin: 0 10px;
    margin-bottom: 0px;
    margin-bottom: 0px;
    font-family: "Arial";
    font-size: 0.75em;
    position: relative;
	display: block;
	line-height: 1.3em;
	top: -5px !important;
}


.li-section li span {
	display: inline-block;
	position: relative;
	left: 25px;
	top: -25px;
}



/* 要在前台隱藏 (用 html 來寫 LightBox, 不希望 html 高度顯示於前台) */
.no_height, #no_height {
	height: 0px;
}


/* 要在前台隱藏 (用 html 來 import 物件時, 如 : Java..等,不希望顯示於前台) */
.no_display, #no_display, .import_java, #import_java {
	display: none;
	height: 0px;
}


/* Case Study Two >> 只選兩則時,撐滿螢幕 */
.case_study_two .markets-solutions-case-studies .case-study-item {
    width: 50%;
}



/*  Bold Title */
.title_bold .Full_Width_Rich_Content .markets-top-banner.richcontent h3.RC_LTitle,
.title_bold .Full_Width_Rich_Content .markets-top-banner.richcontent h3.RC_LTitle,
.title_bold .Rich_Content .markets-top-banner.richcontent h3.RC_LTitle,
.title_bold .Rich_Content .markets-top-banner.richcontent h3.RC_LTitle {
    font-weight: 500;
}



/**************   Secondary Menu >> Button  **************/

/* Button Line (Book Showroom) */
.secondary-navigation #Register_Button_Line, .secondary-navigation #Register_Button_Line {
    background-color: #fff;
    color: #019bb9;
    padding: 3px 20px 5px;
    border-radius: 30px;
    font-size: 18px;
    border: solid 1px #019bb9;
    transition: all 0.3s ease-in-out 0s;
}

.secondary-navigation a #Register_Button_Line:hover{
/*background-color: #00afd1;*/
background-color: #000;
/*border: solid 1px #019bb9;*/
border: solid 1px #000;
color: #fff;
padding: 3px 20px 5px;
border-radius: 30px;
transition: all 0.3s linear 0s;
}


/* Button_Solid (Book Showroom) */
.secondary-navigation #Register_Button, .secondary-navigation #Register_Button {
font-size: 18px;
background-color: #00afd1;
color: #fff;
	padding: 3px 20px 5px;
/*padding: 3px 20px 7px;*/
border-radius: 30px;
transition: all 0.3s ease-in-out 0s;
}

.secondary-navigation a #Register_Button:hover{
background-color: #000;
color: #fff;
	padding: 3px 20px 5px;
/*padding: 3px 20px 7px;*/
border-radius: 30px;
transition: all 0.5s linear 0s;
}

.secondary-navigation div.container table > tbody > tr > td a {
  /*  font-size: 18px;  */
}




/**************   Secondary Menu(Black) >> 變黑  **************/

/*避免main menu反白的問題*/
.dark #primary-menu > ul > li.current > a {
    background-color: transparent;
    border-bottom: 1px solid transparent;
}

.dark #primary-menu > ul > li.current:hover > a {
    background-color: #fff;
}
/*END 避免main menu反白的問題*/

.secondary-navigation.Dark_Sec_NavMenu.fixed,
.Dark_Sec_NavMenu .secondary-navigation.fixed,
.device-lg .secondary-navigation.Dark_Sec_NavMenu.fixed,
.Dark_Sec_NavMenu .device-lg .secondary-navigation.fixed {
    background-color: rgba(0,0,0,0.93) !important;
    border-bottom: 1px solid #333 !important;
    border-top: 1px solid #eee !important;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    opacity: 1.0;
}

#header.dark{
	z-index:100;
}

.Dark_Sec_NavMenu section#content .sec-nav-destop ul.Navigation_dropmenu {
    border-color: #2292d3 #171b20 #171b20;
}

/* 黑選單下拉邊框(dropdown menu) */
.Dark_Sec_NavMenu .sec-nav-destop ul.Navigation_dropmenu {
    border-color: #2292d3 #313943 #313943 !important;
}

/* 黑選單陰影( fixed menu shadow) */
.Dark_Sec_NavMenu .device-lg .secondary-navigation.fixed {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3) !important;
}

.secondary-navigation.Dark_Sec_NavMenu,
.Dark_Sec_NavMenu .secondary-navigation {
    background-color: #000;
    border-bottom: 1px solid #666;
	border-top: 1px solid #333;
}

.secondary-navigation.Dark_Sec_NavMenu div.container table > tbody > tr > td a,
.Dark_Sec_NavMenu .secondary-navigation div.container table > tbody > tr > td a {
    color: #fff;
	transition: all 0.2s ease-in-out 0s;
}


.secondary-navigation.Dark_Sec_NavMenu div.container table > tbody > tr > td a:hover,
.Dark_Sec_NavMenu .secondary-navigation div.container table > tbody > tr > td a:hover {
    color: #33c4ee;
}


.Dark_Sec_NavMenu .sec-nav-destop ul.Navigation_dropmenu {
    background-color: #171b20 !important;
    border-color: #2292d3 #bdc6ca #bdc6ca;
	border-top: 2px solid #2292d3;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 13px 42px 1px rgba(0, 0, 0, 0.07);
    display: none;
    left: 85px;
    position: absolute;
    width: 260px;
}


.Dark_Sec_NavMenu .sec-nav-destop .Navigation_dropmenu .dropmenu_item a {
    color: #bdc6ca;
    display: block;
    padding: 15px 0 10px 20px;
}

.Dark_Sec_NavMenu .sec-nav-destop .Navigation_dropmenu .dropmenu_item a:hover {
color: #00e4ff;
background-color: #2c343d;
}


.Dark_Sec_NavMenu .sec-nav-mobile .list-group-item.noborder {
    text-align: center;
}


/**************   Secondary Menu(Transparncy) >> 透明度  **************/

.device-lg .secondary-navigation.fixed {
    background-color: rgba(255,255,255,0.97);
}




.Dark_Sec_NavMenu .secondary-navigation a #Register_Button:hover {
background-color: rgba(0,0,0,0.0);
color:#00e4ff;
border-color: 2px solid rgba(0,228,255,0.5) !important;
padding: 3px 20px 5px;
border-radius: 30px;
transition: all 0.5s linear 0s;
}


/**************  Light Box Video  **************/

.modal-content .close {
    font-size: 25px;
}

.modal-header h4 {
    color: #000;
    font-size: 1.2em !important;
    font-weight: 400 !important;
	padding-bottom: 0px !important;
}


.modal-header {
    border-bottom: none !important;
    padding: 15px 15px 11px 17px !important;
}

.modal-body {
	padding: 5px !important;
	overflow: auto;
}

.fluid-width-video-wrapper {
    min-height: 400px;
    padding-top: 50%;
}

.fluid-width-video-wrapper iframe,
.fluid-width-video-wrapper object,
.fluid-width-video-wrapper embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.modal-dialog {
	max-width: 915px;
    width: 97%;
}





/* Copied from 7.html */

.content-wrap {
	padding-bottom: 0;
	padding-top: 0;
}

/**
 * Vertical Fixed Navigation
 * Modified to keep only the required features
 * https://github.com/CodyHouse/vertical-fixed-navigation
 */

#cd-vertical-nav {
	position: fixed;
	right: 50px;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 99;
}

#cd-vertical-nav li {
	text-align: right;
	list-style: none;
}

/* Unset styles from template CSS files */
/* See file/template/1/style.css */
#cd-vertical-nav li::before {
	display: none;
}

#cd-vertical-nav a {
	display: inline-block;
	/* prevent weird movements on hover when you use a CSS3 transformation - webkit browsers */
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

#cd-vertical-nav a:after {
	content: "";
	display: table;
	clear: both;
}

#cd-vertical-nav a span {
	float: right;
	display: inline-block;
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-ms-transform: scale(0.5);
	-o-transform: scale(0.5);
	transform: scale(0.5);
}

#cd-vertical-nav a:hover span, #cd-vertical-nav a.is-selected span {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

/* Navigation-Dot >> 右邊導航點 (0.css) */

#cd-vertical-nav .cd-dot {
	position: relative;
	/* we set a top value in order to align the dot with the label. If you change label's font, you may need to change this top value*/
	top: 8px;
	height: 12px;
	width: 12px;
	border-radius: 50%;
	/*background-color: #0ca5d2;*/
	background-color: rgba(164, 165, 165, 0.85) !important;
	-webkit-transition: -webkit-transform 0.2s, background-color 0.5s;
	-moz-transition: -moz-transform 0.2s, background-color 0.5s;
	transition: transform 0.2s, background-color 0.5s;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	box-shadow: 0 0 7px rgba(255, 255, 255, 0.5);
	border: 1px solid rgba(255, 255, 255, 0.7);
}





div.markets-solutions-overview,
div.markets-solutions-applications,
div.markets-solutions-recommend-products {
    padding: 100px 0;
}





@media all and (max-width: 991px) {
	#cd-vertical-nav {
		right: 20px;
	}
}





@media all and (max-width: 480px) {
	#cd-vertical-nav {
		right: 10px;
		display: none;
	}
}




/*---------------------------------- RWD ----------------------------------------------*/




/* 一般pc小螢幕 */
@Media (min-width: 980px) and (max-width: 1199px) {

	ul.tab-nav:not(.tab-nav-lg) li a {
    padding: 0 20px 0 10px !important;
}

}






/* 平板電腦、橫向手機和一般桌機解析度 */

@Media (min-width: 768px) and (max-width: 979px) {

	/* Benefits */
	.markets-solutions-benefits h4 {
    font-size: 1em;
    line-height: 1.5em;
}


	/* Case Study Two >> 只選兩則時,撐滿螢幕 */
.case_study_two .markets-solutions-case-studies .case-study-item {
    width: 100%;
}


	ul.tab-nav:not(.tab-nav-lg) li a {
		padding: 0 20px 0 10px !important;
	}

	.markets-solutions-applications .app-block-container p {
		text-align: left;
		font-weight: 300 !important;
		height: unset !important;
		max-height: unset !important;
	}

.markets-solutions-applications .app-block .btn-group {
    position: relative !important;
    bottom: 0px;
    text-align: center;
    display: block;
}

	.markets-solutions-applications .app-block-container {
		width: 100%;
		margin-bottom: 30px;
	}

	.markets-solutions-overview h2, .markets-solutions-applications h2, .markets-solutions-benefits h2 {
		font-size: 40px;
		line-height: 55px;
	}
}









/* 橫向智慧手機到竪立平板電腦解析度 */

@Media (max-width: 767px) {


	/* Case Study Two >> 只選兩則時,撐滿螢幕 */
.case_study_two .markets-solutions-case-studies .case-study-item {
    width: 100%;
}


	.secondary-navigation #Register_Button_Line,
	.secondary-navigation a #Register_Button_Line:hover,
	.secondary-navigation #Register_Button,
	.secondary-navigation a #Register_Button:hover {
	 /*display: inline;*/
	font-size: 1.1em;
	display: inline-block;
    padding: 5px 40px 5px;
	width: 50%;
}



	.cd-section div.markets-solutions-applications .app-image {
    width: 280px;
    height: 280px;
}



	#content .markets-solutions-overview p {
		max-width: 90%;
		text-align: left;
	}

	.markets-solutions-applications p {
    text-align: left;
}


	#feature_highlights .markets-solutions-applications .app-block-container p {
		text-align: left;
		max-width: 90%;
	}


	.applications_section.markets-solutions-applications .app-block-container p {
    height: unset !important;
    max-height: unset !important;
}


	.markets-solutions-applications .app-block-container {
		float: none;
		display: block;
		margin: 20px 0 50px;
	}


	div.markets-solutions-applications .app-block {
		margin: 50px auto;
	}
}






/* 比手機大-比平板小-解析度 */
@Media (min-width: 481px) and (max-width: 600px) {

	.secondary-navigation #Register_Button_Line,
	.secondary-navigation a #Register_Button_Line:hover,
	.secondary-navigation #Register_Button,
	.secondary-navigation a #Register_Button:hover {
	 /*display: inline;*/
	font-size: 1.1em;
	display: inline-block;
    padding: 5px 40px 5px;
	width: unset;
}


	#content .markets-solutions-case-studies .case-study-item .hover_block p {
    line-height: 1.3em;
}

}









/* iPhone 6 & 6 plus > 4.7吋--手機及其他更小解析度 */

@Media (min-width: 373px) and (max-width: 414px) {

	.secondary-navigation #Register_Button_Line,
	.secondary-navigation a #Register_Button_Line:hover,
	.secondary-navigation #Register_Button,
	.secondary-navigation a #Register_Button:hover {
	 /*display: inline;*/
	font-size: 1.1em;
	display: inline-block;
    padding: 5px 40px 5px;
	width: unset;
}

	#content .markets-solutions-case-studies .case-study-item .hover_block p {
    line-height: 1.3em;
}


#content .markets-solutions-overview p {
    text-align: left;
    max-width: 100% !important;
}



.applications_section.markets-solutions-applications .app-block-container p {
    height: unset !important;
    max-height: unset !important;
}


	.markets-solutions-applications .app-block-container {
		float: none;
		display: block;
	}
	div.markets-solutions-applications .app-block {
		margin: 50px auto;
	}


		div.markets-solutions-overview,
	div.markets-solutions-applications,
	div.markets-solutions-recommend-products {
		padding-top: 70px;
	}
	.markets-top-banner.swiper_wrapper .text-block {
		padding: 35px 30px;
	}
	.markets-top-banner.swiper_wrapper .text-block h3 {
		font-size: 2.5em;
		margin-bottom: 20px;
	}
	#fu_Banner .markets-top-banner.richcontent h4 {
		font-size: 1.2em;
		font-weight: 500;
		opacity: 1;
	}
	.markets-solutions-applications p,
	.markets-solutions-overview p {
		text-align: left;
	}
	#feature_highlights .markets-solutions-applications .app-block-container p {
		text-align: left !important;
		max-width: 100% !important;
	}





	#content .markets-solutions-overview p {
		max-width: 100%;
		padding: 10px 10px 0 0;
	}
	.markets-solutions-benefits .row {
		padding: 25px !important;
	}

/*
.markets-solutions-applications .app-block-container {
		padding: 0 !important;
	}
*/


	#content p, #content .paragraph {
		line-height: 1.5 !important;
	}

	.tab-container .tab-content .col-md-4 {
		padding-left: 0 !important;
	}

	.tab-content .ss-pull-left {
		padding-left: 0px !important;
		padding-top: 10px !important;
	}

	#home_footer_bar .bar_item {
		padding: 20px;
	}
}




















/* 橫向智慧手機及其他更小解析度 */

@Media (max-width: 480px) {

	.secondary-navigation #Register_Button_Line,
	.secondary-navigation a #Register_Button_Line:hover,
	.secondary-navigation #Register_Button,
	.secondary-navigation a #Register_Button:hover {
	 /*display: inline;*/
	font-size: 1.1em;
	display: inline-block;
    padding: 5px 40px 5px;
	width: unset;
}


	#content .markets-solutions-case-studies .case-study-item .hover_block p {
    line-height: 1.3em;
}


#content .markets-solutions-overview p {
    text-align: left;
    max-width: 100% !important;
}



.applications_section.markets-solutions-applications .app-block-container p {
    height: unset !important;
    max-height: unset !important;
}

	.markets-solutions-applications .app-block-container {
		float: none;
		display: block;
	}
	div.markets-solutions-applications .app-block {
		margin: 50px auto;
	}

	.markets-solutions-applications .app-block-container {
		float: none;
		display: block;
		margin-bottom: 40px;
	}


		div.markets-solutions-overview,
	div.markets-solutions-applications,
	div.markets-solutions-recommend-products {
		padding-top: 70px;
	}
	.markets-top-banner.swiper_wrapper .text-block {
		padding: 35px 30px;
	}
	.markets-top-banner.swiper_wrapper .text-block h3 {
		font-size: 2.5em;
		margin-bottom: 20px;
	}
	#fu_Banner .markets-top-banner.richcontent h4 {
		font-size: 1.2em;
		font-weight: 500;
		opacity: 1;
	}
	.markets-solutions-applications p,
	.markets-solutions-overview p {
		text-align: left;
	}
	#feature_highlights .markets-solutions-applications .app-block-container p {
		text-align: left !important;
		max-width: 100% !important;
	}







	#content .markets-solutions-overview p {
		max-width: 100%;
		padding: 10px 10px 0 0;
	}
	.markets-solutions-benefits .row {
		padding: 25px !important;
	}



/*
.markets-solutions-applications .app-block-container {
		padding: 0 !important;
	}
*/


	#content p, #content .paragraph {
		line-height: 1.5 !important;
	}

	.tab-container .tab-content .col-md-4 {
		padding-left: 0 !important;
	}

	.tab-content .ss-pull-left {
		padding-left: 0px !important;
		padding-top: 10px !important;
	}

	#home_footer_bar .bar_item {
		padding: 20px;
	}
}




/*2019 10 31 add by Red*/

.markets-solutions-applications .app-block-container p {
    text-align: left;
    font-weight: 300 !important;
}
.Brackets .text-block {
	padding: 30px 40px !important;
}

.Brackets .wording_block:before, .Brackets .wording_block:after {
	content: '';
	display: block;
	height: 100%;
	width: 52px;
	border: 15px solid #e8ecee;
	position: absolute;
	top: -5px;
}


.Brackets .wording_block:before { left: 0; border-right: 0; }
.Brackets .wording_block:after { right: 0; border-left: 0; }

.row a.play_btn:before{
	background: rgba(0%,0%,0%,.3) url(../images/icons/Play_Icon_Mline.png) no-repeat center center;
}

/* 191113 Red for hr page*/
.Sec_hide .secondary-navigation {
    display: none;
}

/* Button_line >> Rich Content */
.Button_Line .markets-top-banner.richcontent a.btn.btn-primary {
	color: #07a5d3 !important;
	font-weight: 500;
	background-color:#fff !important;
	border: 2px solid#07a5d3 !important;
	border-radius: 30px;
	text-shadow: none;
	box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, .1) !important;
	transition: all 0.3s ease-in-out 0s;
}



	/* Button_Line > Hover  */
.Button_Line .markets-top-banner.richcontent a.btn.btn-primary:hover {
	color: #fff !important;
	background-color: #000 !important;
	border: 2px solid #000 !important;
	border-radius: 30px;
	transition: all 0.2s linear 0s;
}