

/*============Glogbal Style================ */
html,
body {
height: 100%;
font-family: 
"Microsoft JhengHei",
"Segoe UI",
-apple-system, BlinkMacSystemFont,
"PingFang TC",
sans-serif;
}



/*banner箭頭的位置*/
.carousel-control-next, .carousel-control-prev{
 width: 8%;
}


.product-tag {
display: inline-block;
background:#000;
padding:3px 15px;
color: #fff;
font-size: 28px;
margin-bottom: 1%;
font-weight: 600;
}


/*2026資安展01*/

.cybersec01-tag {
/*display: inline-block;*/
color: #73ceff;
font-size: 18px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-tag img{
margin-right:1%;
vertical-align: sub;
width: 3%;
}

.cybersec01-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/cybersec_20260407.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
/*z-index: 1;*/

}

.cybersec01-position{
position: absolute;
top: 66%;
left: 9%;
}

.cybersec02-position{
position: absolute;
top: 66%;
left: 36%;
}

.cybersec01-banner-title{
border-left: 3px solid #ef727a; 
}

.cybersec01-banner-title h1{
font-size: 27px;
line-height: 2.5rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}


/*2026資安展02*/
.cybersec-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/cybersec_20260401.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
z-index: 1;
}




/*kms*/
.kms-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/kms_20260203.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
/*z-index: 1;*/

}

.kms-position{
position: absolute;
top: 30%;
left:16%;
z-index: 999;
}
.kms-banner-title h1{
font-size: 62px;
line-height: 5rem;
color:#fff;
font-weight: 900;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
}
.kms-banner-title p{
font-size:28px;
color: #fff;
line-height: 3rem;
}

/*matter*/
.matter-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/matter_20260203.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
}
.matter-position{
position: absolute;
top: 30%;
left:8%;
}
.matter-banner-title h1{
font-size: 62px;
line-height: 5rem;
color:#fff;
font-weight: 900;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
}
.matter-banner-title p{
font-size:28px;
color: #fff;
line-height: 2.8rem;
width: 870px;
text-align: justify;
}

/*idexpert*/
.idexpert-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/idexpert_20260203.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
}
.idexpert-position{
position: absolute;
top: 30%;
left:20%;
}
.idexpert-banner-title h1{
font-size: 62px;
line-height: 5rem;
color:#fff;
font-weight: 900;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
}
.idexpert-banner-title p{
font-size:28px;
color: #fff;
line-height: 2.8rem;
}

/*fastID*/
.fastid-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/fastid_20260203.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
}
.fastid-position{
position: absolute;
top: 32%;
right:20%;
}
.fastid-banner-title h1{
font-size: 62px;
line-height: 5rem;
color:#fff;
font-weight: 900;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
}
.fastid-banner-title p{
font-size:30px;
color: #fff;
line-height: 2.8rem;
}

/*fastsign-cloud*/
.fastsign-cloud-banner-cover{
padding:18% 0;
background-image:url("../images/index/banner/2026/fastsign_20260203.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
}
.fastsign-cloud-position{
position: absolute;
top: 32%;
left:19%;
}
.fastsign-cloud-banner-title h1{
font-size: 60px;
line-height: 5rem;
color:#000;
font-weight: 900;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
}
.fastsign-cloud-banner-title p{
font-size:30px;
color: #000;
line-height: 2.8rem;
}



/*Large devices (desktops, less than 1200px)for筆電*/
@media screen and (max-width: 1600px) {


/*2026資安展01*/

.cybersec01-position{
position: absolute;
top: 66%;
left: 9%;
}

.cybersec02-position{
position: absolute;
top: 66%;
left: 39%;
}

.cybersec01-banner-title h1{
font-size: 26px;
line-height: 2.5rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}
	

.product-tag {
font-size: 24px;
margin-bottom: 1%;
}
			
	
/*kms*/	
.kms-position{
position: absolute;
top: 30%;
left:17%;
}
	
.kms-banner-title h1{
font-size: 56px;
line-height: 4.5rem;
}

.kms-banner-title p{
font-size:25px;
color: #fff;
line-height: 2.2rem;
}
	
/*matter*/
.matter-position{
position: absolute;
top: 26%;
left:6%;
}
.matter-banner-title h1{
font-size: 53px;
line-height: 4.8rem;
margin-bottom: 6px;
}
.matter-banner-title p{
font-size:28px;
line-height: 2.8rem;
width: 740px;
}
	
/*idexpert*/
.idexpert-position{
position: absolute;
top: 30%;
left:20%;
}
.idexpert-banner-title h1{
font-size: 58px;
line-height: 5rem;
margin-bottom: 6px;
}
.idexpert-banner-title p{
font-size:23px;
line-height: 2.5rem;
}
	
/*fastid*/
.fastid-banner-title h1{
font-size: 58px;
line-height: 5rem;
margin-bottom: 6px;
}
.fastid-banner-title p{
font-size:26px;
line-height: 2.5rem;
}	
		
/*fastsign-cloud*/

.fastsign-cloud-banner-title h1{
font-size: 54px;
line-height: 5rem;
margin-bottom: 6px;
}
.fastsign-cloud-banner-title p{
font-size:25px;
line-height: 2.5rem;
}
	
	
}



/*高度不夠, 專為新的 IDE banner 設立此段點 */
@media screen and (max-width: 1300px) {

/*2026資安展01*/
.cybersec01-tag {
/* display: inline-block; */
color: #73ceff;
font-size: 16px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-position{
position: absolute;
top: 64%;
left: 9%;
}

.cybersec02-position{
position: absolute;
top: 64%;
left: 41%;
}

.cybersec01-banner-title h1{
font-size: 20px;
line-height: 1.8rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}
		
	
	
.product-tag {
font-size: 23px;
margin-bottom: 5px;
}
/*kms*/
.kms-banner-title h1{
font-size: 48px;
margin-bottom: 1px;	
}

.kms-banner-title p{
font-size:20px;
color: #fff;
line-height: 2.2rem;
}
	
/*matter*/
.matter-position{
position: absolute;
top: 26%;
left:6%;
}
.matter-banner-title h1{
font-size: 43px;
line-height: 4.6rem;
margin-bottom: 4px;
}
.matter-banner-title p{
font-size:20px;
line-height: 2.2rem;
width: 600px;
}
/*idexpert*/
.idexpert-position{
position: absolute;
top: 30%;
left:20%;
}
.idexpert-banner-title h1{
font-size: 48px;
line-height: 4rem;
margin-bottom: 6px;
}
.idexpert-banner-title p{
font-size:18px;
line-height: 2rem;
}
	
/*fastid*/
.fastid-position{
position: absolute;
top: 30%;
right:19%;
}
.fastid-banner-title h1{
font-size: 48px;
line-height: 4rem;
margin-bottom: 6px;
}
.fastid-banner-title p{
font-size:24px;
line-height: 2rem;
}
	
/*fastsign-cloud*/

.fastsign-cloud-banner-title h1{
font-size: 43px;
line-height: 4rem;
margin-bottom: 6px;
}
.fastsign-cloud-banner-title p{
font-size:24px;
line-height: 2rem;
}
	
}



/*Large devices (desktops, less than 1200px)*/
@media screen and (max-width: 1199.98px) {

	
	
/*2026資安展01*/
.cybersec01-tag {
/* display: inline-block; */
color: #73ceff;
font-size: 14px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-banner-cover {
padding: 23% 0px;
}		
		
.cybersec01-position{
position: absolute;
top: 64%;
left: 5%;
}

.cybersec02-position{
position: absolute;
top: 64%;
left: 39%;
}

.cybersec01-banner-title h1{
font-size: 18px;
line-height: 1.8rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}	
	
	
	
/*cybersec start 02*/	
.cybersec-banner-cover {
padding: 23% 0px;
}		
	
	
	
.product-tag {
font-size: 20px;
margin-bottom: 5px;
}	

.kms-banner-cover {
padding: 23% 0px;

}	
.kms-banner-title h1{
font-size: 40px;
line-height: 4rem;	
margin-bottom: 1px;	
}

.kms-banner-title p{
font-size:17px;
line-height: 1.8rem;
}

/*matter start*/
.matter-banner-cover{
padding:23% 0;
}
.matter-position{
position: absolute;
top: 23%;
left:5%;
}
.matter-banner-title h1{
font-size: 39px;
line-height: 4rem;
margin-bottom: 6px;
}
.matter-banner-title p{
font-size:19px;
line-height: 1.8rem;
width: 532px;
}	
	
/*idexpert*/
.idexpert-banner-cover{
padding:23% 0;
}	
.idexpert-position{
position: absolute;
top: 30%;
left:20%;
}
.idexpert-banner-title h1{
font-size: 45px;
line-height: 4rem;
margin-bottom: 6px;
}
.idexpert-banner-title p{
font-size:16px;
line-height: 2rem;
}

/*fastid*/
.fastid-banner-cover{
padding:23% 0;
}	
.fastid-position{
position: absolute;
top: 30%;
right:18%;
}
.fastid-banner-title h1{
font-size: 42px;
line-height: 4rem;
margin-bottom: 6px;
}
.fastid-banner-title p{
font-size:20px;
line-height: 2rem;
}
	
/*fastsign-cloud*/
.fastsign-cloud-banner-cover{
padding:23% 0;
}	
.fastsign-cloud-banner-title h1{
font-size: 37px;
line-height: 4rem;
margin-bottom: 4px;
}
.fastsign-cloud-banner-title p{
font-size:20px;
line-height: 2rem;
}
		
}


/*Medium devices (tablets, less than 992px)*/

/*.col<576px(Extra small)/ .col-sm-≥576px(Small)/.col-md-≥768px(Medium)/
.col-lg-≥992px(Large)/.col-xl-≥1200px(Extra large)*/
@media screen and (max-width: 991.98px) {

	
/*2026資安展01*/
.cybersec01-tag {
/* display: inline-block; */
color: #73ceff;
font-size: 14px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-banner-cover {
padding: 25% 0px;
}		
		
.cybersec01-position{
position: absolute;
top: 64%;
left: 5%;
}

.cybersec02-position{
position: absolute;
top: 64%;
left: 45%;
}

.cybersec01-banner-title h1{
font-size: 18px;
line-height: 1.8rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}	
		
	
/*cyversec02 start */
.cybersec-banner-cover {
padding: 25% 0px;
}		
	
.product-tag {
font-size: 15px;
margin-bottom: 3px;
}	
/*kms*/	
.kms-position{
position: absolute;
top: 32%;
left:16%;
}
.kms-banner-cover {
padding: 25% 0px;
}	
.kms-banner-title h1{
font-size: 32px;
line-height: 3rem;	
margin-bottom: 1px;	
}

.kms-banner-title p{
font-size:15px;
line-height: 1.5rem;
}
	
/*matter*/
.matter-banner-cover{
padding:23% 0;
}
.matter-position{
position: absolute;
top: 23%;
left:5%;
}
.matter-banner-title h1{
font-size: 31px;
line-height: 3.8rem;
margin-bottom: 2px;
}
.matter-banner-title p{
font-size:19px;
line-height: 1.8rem;
width: 430px;
}
	
/*idexpert*/
.idexpert-banner-cover{
padding:23% 0;
}

.idexpert-banner-title h1{
font-size: 33px;
line-height: 3.5rem;
margin-bottom: 2px;
}
.idexpert-banner-title p{
font-size:18px;
line-height: 1.8rem;
width: 400px;
margin: 0 auto;
}	
	
/*fastid*/
.fastid-banner-cover{
padding:23% 0;
}
.fastid-banner-title h1{
font-size: 33px;
line-height: 3.5rem;
margin-bottom: 2px;
}
.fastid-banner-title p{
font-size:18px;
line-height: 1.8rem;
margin: 0 auto;
}		
	
/*fastsign-cloud*/
.fastsign-cloud-banner-cover{
padding:23% 0;
}
.fastsign-cloud-banner-title h1{
font-size: 29px;
line-height: 3.5rem;
margin-bottom: 2px;
}
.fastsign-cloud-banner-title p{
font-size:18px;
line-height: 1.8rem;
margin: 0 auto;
}		
	
				
	
}

/*Small devices (landscape phones, less than 768px)*/
@media screen and (max-width: 767.98px) { 

	
/*2026資安展01*/
.cybersec01-tag {
/* display: inline-block; */
color: #73ceff;
font-size: 14px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-banner-cover {
padding: 65% 0px;
background-image:url("../images/index/banner/2026/cybersec_20260407_phone.png");
}		
		
.cybersec01-position{
position: absolute;
top: 30%;
left: 10%;
}

.cybersec02-position{
position: absolute;
top: 51%;
left: 10%;
}

.cybersec01-banner-title h1{
font-size: 22px;
line-height: 1.8rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}	
		
		
	
/*cybersec02*/	
.cybersec-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/cybersec_20260401_phone.png");
}	
		

.product-tag {
font-size: 23px;
margin-bottom: 3px;
}
	
/*kms*/	
.kms-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/kms_20260203_phone.png");
}
.kms-position{
position: absolute;
top: 11%;
left:0%;
}	
.kms-banner-title h1{
font-size: 46px;
line-height: 4rem;	
margin-bottom: 1px;	
}		
.kms-banner-title p{
font-size:25px;
line-height: 2.7rem;
}

/*matter*/
.matter-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/matter_20260203_phone.png");
}
.matter-position{
position: absolute;
top: 11%;
left:1%;
}	
.matter-banner-title h1{
font-size: 45px;
line-height: 5rem;	
margin-bottom: 1px;	
}		
.matter-banner-title p{
font-size:25px;
line-height: 2.7rem;
width: 560px;
}
/*idexpert*/
.idexpert-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/idexpert_20260203_phone.png");
}
.idexpert-position{
position: absolute;
top: 11%;
left:1%;
}	
.idexpert-banner-title h1{
font-size: 45px;
line-height: 5rem;	
margin-bottom: 1px;	
}		
.idexpert-banner-title p{
font-size:25px;
line-height: 2.7rem;
width: auto;
text-align: justify;	
}	

/*fastid*/
.fastid-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/fastid_20260203_phone.png");
}
.fastid-position{
position: absolute;
top: 11%;
left:1%;
}	
.fastid-banner-title h1{
font-size: 45px;
line-height: 5rem;	
margin-bottom: 1px;	
}		
.fastid-banner-title p{
font-size:25px;
line-height: 2.7rem;
text-align: justify;	
}	

/*fastsign-cloud*/
.fastsign-cloud-banner-cover{
padding:65% 0;
background-image:url("../images/index/banner/2026/fastsign_20260203_phone.png");
}
.fastsign-cloud-position{
position: absolute;
top: 11%;
left:1%;
}	
.fastsign-cloud-banner-title h1{
font-size: 45px;
line-height: 4rem;	
margin-bottom: 1px;	
}		
.fastsign-cloud-banner-title p{
font-size:26px;
line-height: 2.7rem;
text-align: justify;	
}	
		
	
}

/*Extra small devices (portrait phones, less than 576px)*/

@media screen and (max-width: 575.98px) { 

	
	
/*2026資安展01*/
.cybersec01-tag {
/* display: inline-block; */
color: #73ceff;
font-size: 14px;
margin-bottom: 3%;
font-weight: 800;
text-align: left;
}
.cybersec01-banner-cover {
padding: 80% 0px;
background-image:url("../images/index/banner/2026/cybersec_20260407_phone.png");
}		
		
.cybersec01-position{
position: absolute;
top: 28%;
left: 10%;
}

.cybersec02-position{
position: absolute;
top: 52%;
left: 10%;
}

.cybersec01-banner-title h1{
font-size: 18px;
line-height: 1.5rem;
color:#fff;
font-weight: 500;
font-family: 'Roboto', sans-serif;
margin-bottom: 6px;
text-align: left;
}	
			

	
/*cybersec02*/	
.cybersec-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/cybersec_20260401_phone.png");
}		
	
.product-tag {
font-size: 18px;
margin-bottom: 5px;
}
	
/*kms*/	
.kms-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/kms_20260203_phone.png");
}
.kms-position{
position: absolute;
top: 5%;
left:0%;
}	
.kms-banner-title h1{
font-size: 40px;
line-height: 3.5rem;	
margin-bottom: 1px;	
}		
.kms-banner-title p{
font-size:18px;
line-height: 2.2rem;
}
/*matter*/
.matter-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/matter_20260203_phone.png");
}
	
.matter-position{
position: absolute;
top: 5%;
left:0%;
}	
.matter-banner-title h1{
font-size: 40px;
line-height: 3.2rem;	
margin-bottom: 1px;	
}		
.matter-banner-title p {
font-size: 18px;
line-height: 2rem;
width: 330px;
}
/*idexpert*/
.idexpert-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/idexpert_20260203_phone.png");
}
	
.idexpert-position{
position: absolute;
top: 8%;
left:0%;
}	
.idexpert-banner-title h1{
font-size: 34px;
line-height: 3.2rem;	
margin-bottom: 1px;	
}		
.idexpert-banner-title p {
font-size: 18px;
line-height: 2.2rem;
text-align: justify;
}
	
/*fastid*/
.fastid-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/fastid_20260203_phone.png");
}
	
.fastid-position{
position: absolute;
top: 8%;
left:0%;
}	
.fastid-banner-title h1{
font-size: 42px;
line-height: 3.5rem;	
margin-bottom: 1px;	
}		
.fastid-banner-title p {
font-size: 22px;
line-height: 2.2rem;
text-align: justify;
}
	
/*fastsign-cloud*/
.fastsign-cloud-banner-cover{
padding:80% 0;
background-image:url("../images/index/banner/2026/fastsign_20260203_phone.png");
}
	
.fastsign-cloud-position{
position: absolute;
top: 8%;
left:0%;
}	
.fastsign-cloud-banner-title h1{
font-size: 42px;
line-height: 3.5rem;	
margin-bottom: 1px;	
}		
.fastsign-cloud-banner-title p {
font-size: 22px;
line-height: 2.2rem;
text-align: justify;
}
		
	
	
}


/*Extra large devices (large desktops)
// No media query since the extra-large breakpoint has no upper bound on its width*/