@charset "utf-8";

/* 以下是修正研華網站header CSS的衝突，請勿刪除 */
#advan-header .row-maxwidth-100pct {
    padding: 0 !important;
}

#advan-content .row-maxwidth-98pct {
    width: 100% !important;
    max-width: unset !important;
}
#imart-single-page .row-maxwidth-95pct{
	  width: 100% !important;
      max-width: unset !important;
}
#imart-single-page .row-fluid{
	clear: none!important;
}


#Site_UBX  a{
	text-decoration: none;
/*	color: #ffffff;*/
}
#Site_UBX  img{
	max-width: 100%; 
	height: auto;
	display: block;
}
#Site_UBX .fa-classic,#Site_UBX .fa-light,#Site_UBX .fa-regular,#Site_UBX .fa-solid, 
#Site_UBX .fa-thin, #Site_UBX .fal, #Site_UBX .far, #Site_UBX .fas, #Site_UBX .fat{
 font-family: "Font Awesome 6 Pro";
}
#Site_UBX    *{
	line-height: 1.3;
	font-family:"Microsoft JhengHei", Arial, sans-serif;
/*	transition: 0.3s ease;*/
}

#Site_UBX    *,
#Site_UBX    ::after,
#Site_UBX    ::before {
    box-sizing: border-box;
	}

/* 此處設定所有的文字大小 */
/*
#Site_UBX    h1 {
    font-size: 36px!important;
}

#Site_UBX    h2 {
    font-size: 26px!important;
	font-weight: bold!important;
}

#Site_UBX    h3 {
    font-size: 18px!important;
}

#Site_UBX    h4 {
    font-size: 16px !important;

}

#Site_UBX    h5 {
    font-size: 14px !important;
	font-weight: normal;
}
*/

#Site_UBX    p {  
    line-height: 1.5 !important;
}

#Site_UBX   li{
	line-height: 1.3!important;
	list-style: disc;
}

.clearfix {
    clear: none;
}

 .js_scrollTop {
    position: fixed;
    z-index:1000;
    bottom: 0px;
    right: 20px;
    width: 42px;
    height: 42px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    border: 1px solid #FFF;
    opacity: 0;
    transition: .7s;
    cursor: pointer;
}

.js_scrollTop::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: "";
    width: 50%;
    height: 50%;
    margin: -11px 0 0 -11px;
    background: url(css-img/arrow_white.svg) center center no-repeat;
    background: url(css-img/arrow_white.png) center center no-repeat;
    background-size: contain;
    transform: translateY(-1px) rotate(-180deg);
}

.js_scrollTop.show {
    z-index: 99;
    opacity: 1;
    bottom: 75px;
}

/*----------------------------------------
KV
----------------------------------------*/
.Site_UBX #Site_UBX-kv{
   background: #1b6ee0 url("../images/Site_UBX_tab01_kv.jpg") center center no-repeat;
   background-size: cover;
    height: 410px;
}
.Site_UBX #Site_UBX-kv .contents{
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}

.Site_UBX #Site_UBX-kv .contents .boxs{
	display: flex;
	justify-content: space-between;
	align-items: center;
/*	padding-top: 50px;*/
	width: 100%;
}
.Site_UBX #Site_UBX-kv .contents .boxs h1{
	font-size: 48px;
	font-weight: bold;
	color: #ffffff;
	 text-shadow:
    0 0 2px #fff,      
    0 0 7px #00f6ff,   
    0 0 15px #00f6ff;
}
.Site_UBX #Site_UBX-kv .contents .boxs  .sub{
	font-size:36px;
	color: #ffffff;
	font-weight: 200;
	 text-shadow:
    0 0 2px #fff,      
    0 0 7px #00f6ff,   
    0 0 15px #00f6ff;
}
.Site_UBX #Site_UBX-kv .contents .boxs .img{
	padding: 4px 0 0;
	margin-right: -95px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
    height: 400px;
	width: 50%;
	
/*	margin-bottom: -200px;*/
}
@media (max-width: 1260px){
	.Site_UBX #Site_UBX-kv .contents .boxs{
		overflow: hidden;
	}	
	.Site_UBX #Site_UBX-kv .contents .boxs{
		margin-right: 0px;
		}
}
@media (max-width: 1200px){
	.Site_UBX #Site_UBX-kv .contents  {
		padding: 0 0 0 20px;
	}	
	.Site_UBX #Site_UBX-kv .contents .boxs{
		overflow: hidden;
		height: 410px;
		position: relative;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .sub{
/*		font-size:4vw;		*/
		width:80%;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .txt{
		width: 52%;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .img{
		position: absolute;
		top:50px;
		right: -10px;
		margin-right: 0;
	}
}

@media (max-width: 991px){
	.Site_UBX #Site_UBX-kv{
	height: auto;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs{
	display: block;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .txt{
		width: 100%;
		padding: 30px 0 30px;
		text-align: left;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .img{
		height: auto;
		width: 100%;
		align-items: flex-end;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .img img{
	     text-align: right;
		width: 100%;
		max-width:500px;
	}
		.Site_UBX #Site_UBX-kv .contents .boxs .sub{
		font-size:36px;
			width: 40%;
	}
}

@media (max-width: 991px){
.Site_UBX #Site_UBX-kv .contents  {
		padding: 0 0 0 0px;
	}	
	.Site_UBX #Site_UBX-kv .contents .boxs .txt{
		padding: 30px 20px;
	}	
}
@media (max-width: 680px){
	.Site_UBX #Site_UBX-kv .contents .boxs{
		height: auto;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .sub{
		width: 100%;
	}
	.Site_UBX #Site_UBX-kv .contents .boxs .img{
		position: static;
		height:300px;
	}	
}



/*----------------------------------------
menu tab
----------------------------------------*/
.Site_UBX  #tab-Navs {
	justify-content: center;
	margin: 0 0;
}
.Site_UBX  .adv-jumbotron-carousel{
	background: #031344; 
	padding: 50px 0 0;
}
.Site_UBX .tab-01-bg{
	background: #031344 url(../images/Site_UBX_tab01_bg-01.jpg) top center no-repeat;
    background-size: cover;
	
}
.Site_UBX .tab-02-bg{
	background: #f9f9f9;
	
}

.Site_UBX  #tab-carousel .mw-1200{
	max-width: 100%!important;
}

.Site_UBX  #tab-Navs .adv-jumbotron-carousel-navs{
	
}
/*----------------------------------------
 menu tab.Site_UBX  .content03 .tables
----------------------------------------*/
/* 隱藏所有內容區塊 */
.Site_UBX  #tab-carousel .content {
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.Site_UBX  #tab-carousel .col-12{
	max-width: 100%!important;
	margin: 0 auto!important;
}

/* 顯示並淡入 */
.Site_UBX  #tab-carousel .content.active {
  display: block;
  opacity: 1;
}
.Site_UBX  #horizontal-tab{
	margin: 0 auto;
	text-align: center;
}

.Site_UBX  #tab-Navs{
	justify-content: center;
	margin: 0 0px;
    box-sizing: border-box!important;
}

/*
.adv-jumbotron-carousel-nav{
	margin: 0px 0px;
	padding: 50px 10px;
}
*/

.Site_UBX  #horizontal-tab .adv-jumbotron-carousel-nav h3, .Site_UBX  #horizontal-nav .adv-jumbotron-carousel-nav h3{
	max-width: 90%!important;
	background-color: #ffffff!important;
	color: #004280;
	font-size: 18px;
	font-weight: bold;
	border: solid 1px #004280;
	padding: 15px 10px;
	margin: 0 auto;
		transition: 0.3s ease;
}
.Site_UBX  #horizontal-tab .adv-jumbotron-carousel-nav:nth-child(3) h3, 
.Site_UBX  #horizontal-nav .adv-jumbotron-carousel-nav h3{
	border-right:none;
}

.Site_UBX  #horizontal-tab .adv-jumbotron-carousel-nav.active h3, 
.Site_UBX  #horizontal-tab .adv-jumbotron-carousel-nav h3:hover{
	background-color: #f39a00!important;
	color: #ffffff;
	border: none;
}

.fixed-bottom {
  position: fixed;
  top:0;
  left: 0;
  right: 0;
  z-index: 999;
  max-width: 100%!important;
  margin: 0px auto!important;
  padding: 20px 0 30px!important;
}

 .Site_UBX .adv-jumbotron .adv-jumbotron-content{
	    -webkit-box-flex: 0;
         -ms-flex: 0 0 100%!important;
        flex: 0 0 100%!important;
        max-width: 100%!important;
}
@media (max-width:1024px){
  .fixed-bottom {
  position: fixed;
  top:80px;
  left: 0;
  right: 0;
  z-index: 999;
  max-width: 100%!important;
  margin: 0px auto!important;
  padding: 15px 0px!important;
}
}

@media (min-width: 768px) {
 .Site_UBX    .adv-jumbotron .adv-jumbotron-content {
        -webkit-box-flex: 0;
         -ms-flex: 0 0 100%!important;
        flex: 0 0 100%!important;
        max-width: 100%!important;
    }
	 }
@media (max-width: 768px) {
.Site_UBX    .adv-jumbotron .adv-jumbotron-content {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%!important;
        flex: 0 0 100%!important;
        max-width: 100%!important;
    }
 }
@media (max-width: 580px){
.Site_UBX	.col-3,.Site_UBX .col-md-3{
		flex: 0 0 33%!important;
		max-width: 33%!important;
	}
.Site_UBX	.adv-jumbotron .adv-jumbotron-content{
		margin: 0 auto;
	}	
.Site_UBX  #horizontal-tab .adv-jumbotron-carousel-nav h3, .Site_UBX  #horizontal-nav .adv-jumbotron-carousel-nav h3{
	
}	

	.Site_UBX #horizontal-tab .adv-jumbotron-carousel-nav h3, .Site_UBX #horizontal-nav .adv-jumbotron-carousel-nav h3{
		padding: 12px 10px;
	}
}




/*----------------------------------------
item01
----------------------------------------*/

.Site_UBX .content01 .adv-jumbotron-carousel{
background-color: #031344;    
	padding: 50px 10px 0;
}	
.Site_UBX #horizontal-tab .adv-jumbotron{
	padding: 0 0;
}

.Site_UBX #horizontal-tab .content01 .adv-jumbotron .container01{
	background: #031344 url("../images/Site_UBX_tab01_bg-01.jpg") center top no-repeat;
	background-size: cover;
	padding: 0 20px 50px;
}
.Site_UBX .content01  .container01{
	padding: 0 20px 50px;
}
.Site_UBX .content01  .container01 .intro{
	font-size: 16px;
	color: #ffffff;
	font-weight: bold;
	max-width: 1000px;
	text-align: center;
	margin: 0 auto;
	padding: 50px 0 0;
}

.Site_UBX .content01  .container01  .line{
	border-bottom: solid 1px #008cd6;
	max-width: 1100px;
    background-color: #008cd6;
	height: 1px;	
	margin: 30px auto;
}
.Site_UBX .content01 .container01 .title{
	font-size: 36px;
	font-weight: bold;
	color: #ffffff;
	padding: 30px 20px;
}

.Site_UBX .content01  .container01  .cards{
	max-width: 1150px;
	padding: 0 30px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
    gap:20px;
}
.Site_UBX .content01  .container01  .cards .card{
	 width: 350px; 
	max-width: 350px;
     background-color: #ffffff;
}
.Site_UBX .content01  .container01  .cards .card .img{	
	height: 363px;
	width: 350px;
	overflow: hidden;
	position: relative;
		transition: 0.3s ease;
}
.Site_UBX .content01 .container01 .cards .card .img img{
	max-width: 350px;
		transition: 0.3s ease;
}
.Site_UBX .content01  .container01  .cards .card:hover .img img{
	transform: scale(1.1);
}
.Site_UBX .content01  .container01  .cards .card .img .title{
	position: absolute;
	top: 20px;
	left: 20px;
	font-size: 30px;
	font-weight: bold;
	color: #ffffff;
	text-align: left;
	padding: 0 0;
}


.Site_UBX .content01  .container01  .cards .card .text-box{
	padding: 20px 20px;
	display: flex;
	justify-content:flex-start;
	text-align: left;
	align-items: flex-start;
}

.Site_UBX .content01  .container01  .cards .card .text-box .txt{
	width: 50%;
}
.Site_UBX .content01  .container01  .cards .card .text-box .txt .sub{
	color: #004280;
	font-size: 18px;
	font-weight: bold;
	padding: 0 0 10px;
}
.Site_UBX .content01  .container01  .cards .card .text-box .txt  li{
		list-style: none!important;
}
.Site_UBX .content01  .container01  .cards .card .text-box .txt  li a{

	font-size: 14px;
	color: #23262d;
	padding: 0 0 10px;
	width: 100%;
/*	transition: 0.3s ease;*/
}
.Site_UBX .content01  .container01  .cards .card .text-box .txt  li:hover a{
   color:  #f39a00;
}
.Site_UBX .content01  .container01  .cards .card .text-box .txt li i{
	padding: 0 10px 0px;
	color:  #0a91d8;
}

.Site_UBX .content01  .container01  .cards .card .text-box .txt li:hover i{
	padding: 0 10px 0px;
	color: #f39a00;
}

@media (max-width:991px){
	.Site_UBX .content01 .container01 .cards{
		padding: 0 0;
	}
}
/*
@media (max-width:768px){
    .adv-jumbotron .adv-jumbotron-content {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;	
}
*/
@media (max-width:580px){
	.Site_UBX .content01  .adv-jumbotron .adv-jumbotron-content{
		margin: 0 auto;
	}

	.Site_UBX .content01 .container01 .cards .card{
		width: 100%;
		max-width: 350px;
		margin: 0 auto;
	}
	.Site_UBX .content01  .container01  .cards .card .img{	
	height: auto;
	width: 100%;
		max-width: 350px;
		margin: 0 auto;
	overflow: hidden;
	position: relative;
}
}

@media (max-width:350px){
	.Site_UBX .content01  .container01  .cards .card .text-box{
	display: block;
}
	.Site_UBX .content01 .container01 .cards .card .text-box .txt{
		width: 100%;
	}
}
/*
----------------------------------------
粒子效果
----------------------------------------
*/
.Site_UBX .content01  #pg-canvas {
    position: absolute; /* 固定在背景 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* 讓它在其他內容的下方 */
}

.Site_UBX .content01  .container01 {
    position: relative;
    z-index: 0; /* 讓內容在畫布上方 */
    
/*    padding-top: 20vh;*/
}
		
		@media(max-device-width:580px){
			#AISuite .block-AITutorial .list-tutorial > .list{
				display: block;
			}
		}

/*----------------------------------------
item02
----------------------------------------*/
.Site_UBX .content01 .container02{
	max-width: 1240px;
	margin: 0 auto;
	padding: 50px 20px;
}

.Site_UBX .content01 .container02 .title{
	    font-size: 36px;
    font-weight: bold;
    color: #000000;
    padding: 30px 20px 20px;
}

.Site_UBX .content01 .container02 .text-container{
	display: flex;
	justify-content: space-around;
	padding: 0 20px;
}
.Site_UBX .content01 .container02 .item{
	margin-bottom: 60px;
}
.Site_UBX .content01 .container02 .text-container.dir-r{
	direction: rtl;
}

.Site_UBX .content01 .container02 .text-container .left-container,
.Site_UBX .content01 .container02 .text-container .right-container{
	width: 50%;
	direction: ltr;
}
.Site_UBX .content01 .container02 .text-container .left-container .text-box{
	background: #2f3944;
	width: 540px;
	padding: 10px 30px 20px;
	margin-top: -85px;
}
.Site_UBX .content01 .container02 .text-container.dir-r .left-container {
	padding: 0 30px;
}

.Site_UBX .content01 .container02 .text-container .left-container .text-box .title-box{
	display: flex;
	align-items: center;
	padding: 0 0 10px;
}
.Site_UBX .content01 .container02 .text-container .left-container .text-box .title-box .sub{
	color: #00b4ff;
	font-size: 24px;
	font-weight: bold;
	padding-left: 20px;
	text-align: left;
}

.Site_UBX .content01 .container02 .text-container .left-container .text-box .title-box .sub::before{
 content: ''; /* 這是偽元素的核心，必須有 content */
  display: block; /* 讓它成為一個區塊元素，可以設定寬高 */
  width: 40px; /* 線條寬度 */
  height: 2px; /* 線條高度 */
  background-color: #fff; 
  margin-bottom: 10px;	
}

.Site_UBX .content01 .container02 .text-container .left-container .text-box p{
	color: #ffffff;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
}
.Site_UBX .content01 .container02 .text-container .left-container .btn{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 0 0;

}
.Site_UBX .content01 .container02 .text-container .left-container .btn a{
	width: 185px;
	color: #ffffff;
	font-size: 18px;
	padding: 10px 0;
	font-weight: bold;
	background: #f39a00;
	border: solid 1px #f39a00;
	text-align: center;
	 overflow: hidden; 
	z-index: 0;
	position: relative;
	margin-bottom: 20px;
	display: inline-block;
	
}
.Site_UBX .content01 .container02 .text-container .left-container .btn a:nth-child(1){
	margin-right: 20px;
	
}
.Site_UBX .content01 .container02 .text-container .left-container .btn a::before {
      content: ''; 
	position: absolute; 
	top: 0; 
	 left: 0;
    width:0;  
	height: 100%; 
	background: #ffffff;
     z-index: -1; 
	transition: 0.5s;
    }
.Site_UBX .content01 .container02 .text-container .left-container .btn a:hover { color: #f39a00; 	transition: 0.3s ease;}

.Site_UBX .content01 .container02 .text-container .left-container .btn a:hover::before { width:100%; }

.Site_UBX .content01 .container02 .text-container .right-container{
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 20px 0;
}

.Site_UBX .content01 .container02 .text-container .right-container .img{
	width: 30%;
    display: flex;
	flex-direction: column;
	align-items: center;
}

.Site_UBX .content01 .container02 .text-container .right-container .img P{
	color: #406180;
	font-size: 14PX;
	margin: 10px 10px!important;
}
.Site_UBX .content01 .container02 .text-container .right-container .txt{
	width: 70%;
	padding-left: 30px;
}
.Site_UBX .content01 .container02 .text-container .right-container .txt p{
	font-weight: bold;
	font-size: 14px;
	color: #333333;
	text-align: left;
}

.Site_UBX .content01 .container02 .text-container .right-container .txt ul{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	
}
.Site_UBX .content01 .container02 .text-container .right-container .txt ul li{
	padding-right: 20px;
	font-weight: bold;
	font-size: 14px;
	color: #333333;
    line-height: 1.5!important;
	list-style: none!important;
	text-align: left;
}

.Site_UBX .content01 .container02 .text-container .right-container .txt ul li .fa-circle-check{
	color: #0a91d8;
	padding-right: 5px;
}


@media (max-width:1240px){

	.Site_UBX .content01 .container02 .text-container .left-container .text-box{
		width: 90%;
	}
	.Site_UBX .content01 .container02 .text-container.dir-r .left-container{
		padding: 0 0;
        display: flex;
	
		flex-direction: column;
		align-items: flex-end;
		
	}
	.Site_UBX .content01 .container02 .text-container .right-container .txt ul li{
/*		padding-right: 0;*/
	}
}

@media (max-width:991px){
	.Site_UBX .content01 .container02 .text-container .right-container{
		display: block;
		
	}
	.Site_UBX .content01 .container02 .text-container .right-container .txt{
		width: 100%;
		padding-left: 0px;
	}
	.Site_UBX .content01 .container02 .text-container .right-container .img{
		display: flex;
		justify-content: flex-start;
		flex-direction: row;
/*		align-items: flex-end;*/
		width: 100%;
		padding: 0 0 10px;
		text-align: left;
	}
	.Site_UBX .content01 .container02 .text-container .right-container .img img{
		max-width:120px!important;
		height: auto!important;
	}
}

@media (max-width:580px){
	.Site_UBX .content01 .container02 .text-container{
		display: block;
	}
	.Site_UBX .content01 .container02 .text-container .left-container, 
	.Site_UBX .content01 .container02 .text-container .right-container{
		width: 100%;
	}
	.Site_UBX .content01 .container02 .item .img-bg img{
		height:200px!important;
		width: auto;
		object-fit: cover;
	}
	.Site_UBX .content01 .container02 .text-container .left-container .text-box{
		margin-top: -50px;
	}
	.Site_UBX .content01 .container02 .text-container .left-container .text-box{
		width: 100%;
	}
	.Site_UBX .content01 .container02 .item{
		margin-bottom: 30px;
	}
}


/*----------------------------------------
tab02 content02
----------------------------------------*/
.Site_UBX .content02 .container01{
	padding: 30px 0;
	background-color: #f9f9f9;
}
.Site_UBX .content02 .container01 .intro{
	max-width: 900px;
	text-align: center;
		font-size: 18px;
	font-weight: bold;
	margin: 0 auto;
	padding: 10px 0 20px;
}
.Site_UBX .content02 .container01 .intro span{
	color: #008cd6;
	font-size: 18px;
	font-weight: bold;
}
.Site_UBX .content02 .container01 .row-card{
	max-width: 1200px;
	margin: 0 auto;
	padding: 50px 0 50px;
}
.Site_UBX .content02 .container01 .row-even {
	background-color: #cce1f1;
} 
.Site_UBX .content02 .container01 .row-card .title{
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 10px;
	border-bottom: solid 5px #004280;
	color: #004280;
}

.Site_UBX .content02 .container01 .row-card .card-box{
	padding: 30px 0 0px;
	display: flex;
	justify-content: space-between;
	gap:5px;
}
.Site_UBX .content02 .container01 .row-card .card-box.card-4 .card{
	border: solid 1px #e6e6e6;
	width: 100%;
	max-width: 289px;
	margin: 10px 0;
	background-color: #ffffff;
}
.Site_UBX .content02 .container01 .row-card .card-box.card-3 .card{
	border: solid 1px #e6e6e6;
	width: 100%;
	max-width: 390px;
	margin: 10px 0;
}
.Site_UBX .content02 .container01 .row-card .card-box.card-2 .card{
	border: solid 1px #e6e6e6;
	width: 100%;
	max-width: 289px;
	object-fit: cover;
	margin: 10px 0;
}
.Site_UBX .content02 .container01 .row-card .card-box .card img{
	object-fit: cover;
}
.Site_UBX .content02 .container01 .row-card .card-box .card .txt{
	background-color: #ffffff;
	padding: 20px 10px 20px 20px;
	text-align: left;
}

.Site_UBX .content02 .container01 .row-card .card-box .card .txt .sub{
	color: #799ab9;
	font-size: 14px;
	padding: 0 0 10px;
}
.Site_UBX .content02 .container01 .row-card .card-box .card .txt .sub span{
	color:#787878;
}

.Site_UBX .content02 .container01 .row-card .card-box .card .txt .model a{
	color: #212529;
	font-weight: bold;
	font-size: 20px;
	padding: 0 0 10px;
}
.Site_UBX .content02 .container01 .row-card .card-box .card .txt .model:hover a{
	 color: #f39a00;
}
.Site_UBX .content02 .container01 .row-card .card-box .card .txt .model i{
	padding: 0 10px 0px;
    color: #078fd7;
/*	transition: 0.3s ease;*/
}
.Site_UBX .content02 .container01 .row-card .card-box .card .txt .model:hover i{
	  color: #f39a00;
}
/*
.Site_UBX .content02 .container01 .row-card .card-box .card:hover i{
	transform: translateX(8px);
}
*/

.Site_UBX .content02 .container01 .row-card .card-box .card .txt .Price{
	font-size: 14px;
	color: #787878;
}

.Site_UBX .content02 .container01 .row-card .card-box .card.card-img{
	padding: 20px 20px;
	 background: linear-gradient(to bottom, #15a9fb 0%, #4f52ee 91%);
/*	margin: 0 auto;*/
	width: 100%;
} 
.Site_UBX .content02 .container01 .row-card .card-box .card.card-img img{
	margin: 0 auto;
}
.Site_UBX .content02 .container01 .row-card .card-box .card.card-img .btn{
	padding: 10px 0 0;
}
.Site_UBX .content02 .container01 .row-card .card-box .card.card-img .btn a{
	width: 185px;
    color: #ffffff;
    font-size: 18px;
    padding: 10px 0 ;
    font-weight: bold;
    background: #f39a00;
    border: solid 1px #f39a00;
    text-align: center;
    overflow: hidden;
    z-index: 0;
    position: relative;
}

.Site_UBX .content02 .container01 .row-card .card-box .card.card-img .btn a:hover{
	    color: #f39a00;
    transition: 0.3s ease;
}

.Site_UBX .content02 .container01 .row-card .card-box .card.card-img .btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #ffffff;
    z-index: -1;
    transition: 0.5s;
}

.Site_UBX .content02 .container01 .row-card .card-box .card.card-img .btn a:hover::before {
	width:100%; 
}

.Site_UBX .content02 .container01 .row-card.item02{
	display: flex;
	justify-content: space-between;
	gap:5px;
	
}

.Site_UBX .content02 .container01 .row-card.item02 .card-2{
	display: block;
	width: 100%;
	max-width: 600px;	
	padding-right: 8px;
}
.Site_UBX .content02 .container01 .row-card.item02 .card-2 .box{
	display: flex;
	justify-content: space-between;
	gap:5px;
	padding: 30px 0px 0 0;
}
.Site_UBX .content02 .container01 .row-card .card-box.card-4 .card,
.Site_UBX .content02 .container01 .row-card .card-box.card-3 .card,
.Site_UBX .content02 .container01 .row-card .card-box.card-2 .card
{
	transition: 0.3s ease;
}
.Site_UBX .content02 .container01 .row-card .card-box.card-4 .card:hover,
.Site_UBX .content02 .container01 .row-card .card-box.card-3 .card:hover,
.Site_UBX .content02 .container01 .row-card .card-box.card-2 .card:hover{
	box-shadow: 2px 2px 10px #d3d0d0;
	
}

@media (max-width:1240px){
	.Site_UBX .content02 .container01 .row-card{
		padding: 50px 20px;
	}
	.Site_UBX .content02 .container01 .row-card .card-box{
		flex-wrap: wrap;
		justify-content: center;
		gap:20px;
	}
	.Site_UBX .content02 .container01 .row-card .card-box.card-4 .card,
	.Site_UBX .content02 .container01 .row-card .card-box.card-3 .card,
	.Site_UBX .content02 .container01 .row-card.item02 .card-2 .box .card{
		max-width:350px;
	}
	.Site_UBX .content02 .container01 .row-card .card-box .card img,
	.Site_UBX .content02 .container01 .row-card.item02 .card-2 .box img{
		width: 100%;
		max-width: 350px!important;
	}
	.Site_UBX .content02 .container01 .row-card.item02{
		flex-wrap: wrap;
		justify-content: center;
		gap:20px;
	}
	.Site_UBX .content02 .container01 .row-card.item02 .card-2{
		max-width: 100%;
	}
	.Site_UBX .content02 .container01 .row-card.item02 .card-2 .box{
		justify-content: center;
		flex-wrap: wrap;
		gap:20px;
	}
}


/*----------------------------------------
tab02 content02  row-banner row-banner-bg
----------------------------------------*/
.Site_UBX .content02 .container02{
	max-width: 1240px;
	margin: 0 auto;
	padding: 50px 20px;
}
.Site_UBX .content02 .container02 .row-banner-bg{
	
	background: #031b3b url("../images/Site_UBX_tab02_banner-bg.png") center center no-repeat;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 50px 30px;
}
.Site_UBX .content02 .container02 .row-banner-bg .img,
.Site_UBX .content02 .container02 .row-banner-bg .txt
{
	width: 50%;
	margin: 0 auto;
	text-align: left;
	padding: 0 10px;
}
.Site_UBX .content02 .container02 .row-banner-bg .img img{
	text-align: center;
	max-width: 432px;
	margin: 0 auto;
}

.Site_UBX .content02 .container02 .row-banner-bg .txt .title img{
	max-width: 137px;
	
}

.Site_UBX .content02 .container02 .row-banner-bg .txt p{
	color: #ffffff;
	font-size: 16px;
	line-height: 1.5;
	padding: 10px 0;
}
.Site_UBX .content02 .container02 .row-banner-bg .txt .btn{
	padding: 0 0;
}
.Site_UBX .content02 .container02 .row-banner-bg .txt .btn a{
	    width: 185px;
    color: #ffffff;
    font-size: 18px;
    padding: 10px 0;
    font-weight: bold;
    background: #f39a00;
    border: solid 1px #f39a00;
    text-align: center;
    overflow: hidden;
    z-index: 0;
    position: relative;
}

.Site_UBX .content02 .container02 .row-banner-bg .txt .btn a:hover{
	    color: #f39a00;
    transition: 0.3s ease;
}

.Site_UBX .content02 .container02 .row-banner-bg .txt .btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #ffffff;
    z-index: -1;
    transition: 0.5s;
}

.Site_UBX .content02 .container02 .row-banner-bg .txt .btn a:hover::before {
	width:100%; 
}

.Site_UBX .content02 .container02 .row-banner{
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: 30px 30px;
}
.Site_UBX .content02 .container02 .row-banner .txt{
	width: 80%;
}
.Site_UBX .content02 .container02 .row-banner .title{
	color: #ffffff;
	font-size: 30px;
	padding: 0 0 10px;
	text-align: left;
	color: #000000;
}

.Site_UBX .content02 .container02 .row-banner ul{
	margin-left: 20px;
	text-align: left;
	color: #000000;
	font-size: 14px;
}

.Site_UBX .content02 .container02 .row-banner .bule-txt{
	color: #008cd6;
	font-size: 16px;
	text-align: left;
}
.Site_UBX .content02 .container02 .row-banner .btn{
	justify-content: flex-start;
	display: flex;
	padding: 20px 0;
}
.Site_UBX .content02 .container02 .row-banner .btn a{
	width: 185px;
    color: #ffffff;
    font-size: 18px;
    padding: 10px 0 ;
    font-weight: bold;
    background: #f39a00;
    border: solid 1px #f39a00;
    text-align: center;
    overflow: hidden;
    z-index: 0;
    position: relative;
	margin-right: 20px;
}

.Site_UBX .content02 .container02 .row-banner .btn a:hover{
	color: #f39a00;
    transition: 0.3s ease;
}

.Site_UBX .content02 .container02 .row-banner .btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #ffffff;
    z-index: -1;
    transition: 0.5s;
}

.Site_UBX .content02 .container02 .row-banner .btn a:hover::before {
	width:100%; 
}


@media (max-width:991px){
	.Site_UBX .content02 .container02 .row-banner{
		align-items: center;
	}
}

@media (max-width:580px){
	.Site_UBX .content02 .container02 .row-banner-bg,
	.Site_UBX .content02 .container02 .row-banner{
		display: block;
	}
	.Site_UBX .content02 .container02 .row-banner-bg .img, .Site_UBX .content02 .container02 .row-banner-bg .txt,
	.Site_UBX .content02 .container02 .row-banner .txt,
	.Site_UBX .content02 .container02 .row-banner .img{
		width: 100%;
	}
	 .Site_UBX .content02 .container02 .row-banner-bg .txt{
		padding: 30px 0 0;
	}
	.Site_UBX .content02 .container02 .row-banner .btn {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		
	}
	.Site_UBX .content02 .container02 .row-banner .btn a{
		margin: 10px 20px 10px 0;
		width: 160px;
		margin-right: 10px;
		
	}
	.Site_UBX .content02 .container02 .row-banner{
		padding: 30px 15px;
	}
}