.bg-color {
	background-color:rgb(83,193,245);;
}

.white-bg{
  background-color: #FFF;
}
		
.black-bg-color {
	background-color:rgb(54,56,68);
}

.gray-bg-color {
	background-color:rgb(221,221,221);
}

.deep-gray-bg-color {
	background-color:rgb(94,93,94);
}

.red-bg-color {
	background-color:rgb(28,92,139);
}

.red-deeper-bg-color {
	background-color:rgb(210,35,57);
}

.blue-bg-color {
	background-color:rgb(26,160,229);
}

.deep0-purple-bg-color {
	background-color:rgb(122,118,181);
}

.deep0-blue-bg-color {
	background-color:rgb(41,197,211);
}

.white-font {
	color: white!important;
}

.blue-font {
	color: #0070aa;
}

.red-font {
	color: rgb(209,63,21)
}

.orange-font {
	color: rgb(228,108,12)
}


.gray-header-border-bottom {
	border-bottom-style: solid;
	border-width: medium;
	border-bottom-color: white;
}

.gray-border-bottom {
	border-bottom-style: solid;
	border-width: thin;
	border-bottom-color: rgb(180, 180, 181);
}

.white-border-bottom {
	border-bottom-style: solid;
	border-width: thin;
}

.function-bg-color h4{
	color:rgb(104,103,104);
}

.square-line {
	width: 100%; 
	height: 35px; 
	background: #0e6db9;
	position: absolute;
	margin: -17px 0 0 0px;
}

.right-triangle {
	width: 0;
	height: 0;
	border-top: 17px solid transparent;
	border-left: 25px solid #0e6db9;
	border-bottom: 17px solid transparent;
	margin: -17px 0 0 -1px;
}

.bubble {
   width: 80%; 
   height: 35px;    
   position: absolute;
   -moz-border-radius: 12px; 
   -webkit-border-radius: 12px; 
   border-radius: 12px;
   margin: -17px 0 0 -1px;
   float:left;
}

.light-blue-bg {
	background: rgb(215,239,248);
}

.deep-blue-bg {
	background: #0e6db9;
}

.margin-top-1 {
    margin-top: -1% !important;
}

.white-border {
	border-style: solid;
	border-color: white;
	padding: 15px;
}

.grey-border {
	border-style: solid;
	border-color: rgba(45,62,80);
}

.wipg_block_theme {
 	padding:3%!important;
	background-color: rgba(28,92,139, .7)!important;
}

.wePresent-logo {
	width:70% !important;
}

@media only screen and (min-width: 1200px) {
	.spec-context-font {
		font-size:20px !important; line-height:26px !important;
	}
}

@media only screen and (max-width: 1199px) {
	.spec-context-font {
		font-size:20px !important; line-height:26px !important;
	}
}

@media only screen and (max-width: 991px) {
	.spec-context-font {
		font-size:20px !important; line-height:26px !important;
	}
}
@media only screen and (max-width: 768px) {
	#slider h1 {
		font-size:30px;
		line-height:35px;
		text-align:left;
	}
	#slider h2 {
		font-size:27px;
		line-height:27px;
		text-align:left;
	}
	#slider h3 {
		font-size:20px;
		line-height:20px;
		text-align:left;
	}
	.spec-context-font {
		font-size:15px !important; line-height:26px !important;
	}
	.spec-title-font {
		font-size:20px !important; line-height:1.5 !important;
	}
}

.product-container {
    position: relative;
}

.barco-container {
    position: relative;
}

.product-img {
    position: absolute;
    top: 11px;
    right: 33px;
    z-index: 10;
    float: right;
}

.barco-img {
    position: absolute;
    top: -40px;
    right: 100px;
    z-index: 10;
    float: right;
}

.blue-font {
	color: rgb(0, 99,174);
}
.white-font {
	color: white!important;
}
.font-weight-400 > h4 {
    font-weight: 400;
}

.section-3-bg {
	background-color:#f47722;
	-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
	-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
	box-shadow:0 0 15px rgba(0,0,0,0.4);
	background-image: url(../images/productSM-500/SM-500-DUO_intro-page_02.jpg);
    background-repeat: no-repeat;
    background-position: right center;
    /* margin: 0px 0px 60px; */
    z-index:0;
}

.white-font {
	color: white!important;
}

.yellow-font {
	color: yellow!important;
}

.orange-font {
	color: #fe6600!important;
}

.white-link a{
	color: white!important;
}

.white-link a:hover{
	color: #e8df32!important;
}

.white-link a:hover i{
	color: #e8df32!important;
}

.white-link a:hover h3{
	color: #e8df32!important;
}

.black-font {
	color: black;
}
.spec-context-font div {
    font-weight: normal;
}

.border-top-line {
	border-top: 1px solid black; /* 添加上方黑線 */
    padding-top: 10px; /* 可選：添加上方間距 */
}

.product-container {
	position: relative; /* 使得子元素可以相對於此容器進行定位 */
    padding-left: 50px;
}

.product-image {
	position: absolute; /* 將圖片定位到容器的左上角 */
	top: -15px; /* 與容器頂部對齊 */
	left: 0; /* 與容器左側對齊 */
	width: 50px; /* 圖片寬度 */
	height: auto; /* 圖片高度 */
	z-index: 1; /* 確保圖片位於最上層 */
}

.image-002 {
	position: absolute;
	top: 10px;
	right: 10%;
	width: 15%;
	z-index: 10;
}

.image-006 {
	position: absolute;
	top: 10px;
	right: 10%;
	width: 15%;
	z-index: 10;
}

.image-008 {
	position: absolute;
	top: 10px;
	right: 10%;
	width: 25%;
	z-index: 10;
}


.center-top-container {
	position: relative; /* 使得子元素可以相對於此容器進行定位 */
	padding-bottom: 10%;
}
.center-top-image {
	position: absolute; /* 將圖片定位到容器的中間上方 */
	top: -15px; /* 與容器頂部對齊 */
	left: 50%; /* 將圖片的左側與容器的水平中心對齊 */
	/* width: 40%; */
	transform: translateX(-50%); /* 將圖片往左移自身寬度的一半，使其在水平方向上居中 */
	z-index: 1; /* 確保圖片位於最上層 */
}


.equal-height {
  display: flex;
  flex-wrap: wrap;
}
  
.equal-height [class*="col-"] {
  display: flex;
  flex-direction: column;
 }
  
.equal-height .content {
  flex: 1;
}

.orange-line {
  width: 100%; /* 設定寬度為100% */
  height: 15px; /* 設定高度為10px */
  background-color:rgb(234,95,24); /* 設定背景顏色 */
}

.section-container {
	position: relative; /* 使得子元素可以相對於此容器進行定位 */
	display: flex;
    justify-content: center; /* 水平置中 */
    align-items: center; /* 垂直置中 */
    flex-wrap: wrap; /* 自動換行 */
}

.section-image {
    position: absolute;
    left: 0;
    height: auto;
    z-index: 1;
    max-width: 100%; /* 圖片寬度最大不超過容器寬度 */
    height: 90%; /* 外部div高度 */
}

.section-image-1 {
    max-width: 85%;
    margin-top: 20%;
    margin-left: 25%;
}

.section-image-002 {
    max-width: 85%;
    margin-top: 10%;
    margin-left: 15%;
}

.section-image-2 {
    max-width: 100%;
    /* height: 120% */;
    margin-top: -20%;
    padding-left: 1%;
}

.section-image-1-008 {
    max-width: 85%;
    margin-top: 10%;
    margin-left: 25%;
}

.section-image-2-008 {
    max-width: 100%;
    /* height: 120%; */
    margin-top: -10%;
    padding-left: 1%;
}