

/*============Glogbal Style================ */
html,
body {
height: 100%;
font-family:"微軟正黑體", "Microsoft JhengHei", "Segoe UI Semibold", "Segoe UI", "Lucida Grande";
}

p {
font-family:"微軟正黑體", "Microsoft JhengHei", "Segoe UI Semibold", "Segoe UI", "Lucida Grande";
font-size: 17px;
line-height: 2.3rem;
color: #000;
margin: 0;
}	

.bg-color-grey{
background:#F5F5F5;
}

.bg-color-black{
background:#2F2725;	
}

.complete-solution-title img {
vertical-align: sub;
width: 9%;
margin-right: 2%;
}

.main-banner-cover{
padding:18% 0;
background-image:url("../images/iot_security/2025_iot_security/index/iot_main_banner_0911.png");
background-size: cover;
background-position: center center;
background-color: #000;
position: relative;
}

.banner-title-position{
position: absolute;
top: 30%;
left:-5%;
}

.iot-main-banner-title-slogan{
font-size: 29px;
background:#e7233b;
color: #fff;
padding:2px 10px;
margin-bottom: 2%;
display: inline-block;
font-weight: 500;
}

.iot-main-banner-title h1{
font-size: 64px;
line-height: 3.5rem;
color: #fff;
font-weight: 600;
/*text-align: center;*/
}

.iot-subtitle-h1{
color: #fff;
font-size:30px;
/*text-align: center;*/
display: block;
font-weight: 500;
margin-bottom: 1%;
}

.iot-dot-h1{
font-size:18px;
padding: 0 2%;
}

.iot-title h1{
font-size:48px;
color: #0D7CBE;
line-height: 4rem;
font-weight: 800;
}

.iot-title h2{
font-size: 56px;
line-height: 5rem;
color: #000;
font-weight: 800;
padding:0 0 1% 0;
}

.iot-subtitle-h2{
font-size:30px;
margin-bottom: 3%;
display: block;
}

.iot-title h4{
font-size: 32px;
line-height: 2.8rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}

.iot-product-title-line{
font-size:25px;
color: #fff;
padding:0.5% 0%;
margin:0 0 2% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}

.iot-product-title{
font-size:25px;
background:#2F2725;
color: #fff;
padding:0.5% 1.8%;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}

.card-body p {
display: block;
color: #000;
line-height: 2.2rem;
}

.card-body p:hover {
display: block;
color: #000;
line-height: 2.2rem;
}


.divide-line{
border: 1px solid #2A81D1;
display: block;
}


.check-icon img{
width: 30px;
font-size: 20px;
margin: 0 2% 0 0 ;
}

.check-icon {
font-size: 19px;
display: block;
margin:3% 0 0 0;
}

.matter-solution-box{
margin-bottom:2%;
}

.sdk-token-pic{
display: block;
width:80%;
text-align: center;
}

.fp300-token-pic{
display: block;
width:70%;
text-align: center;
}


.iot-fido-image{
display:block;
width:40%;
margin:2% 0 2% 0 ;
}

.trustend-logo{
display: block;
margin:5% 0 1% 0;
width: 50%;
}

/*
.iot-contact-icon-image p{
display: inline;
}
*/


/*車聯網*/
.iov-cover{
margin:6% 0;
padding-top:5%;
padding-bottom: 5%;
}

.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}	
.iov-box{
margin:2% 0;
}	

.iot-token-box{
padding: 4%;
margin:0 3%;
}

.black-card-body {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 1.25rem;
/*background: #2F2725;*/
}

.black-card {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex
;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
/*background-color: #fff;*/
background-clip: border-box;
border: 0px solid rgba(0, 0, 0, .125);
border-radius: .25rem;
}

/*圖片倒圓角*/

.image-radius img{
border-radius: 300px;
}

.image-left-radius img{
border-radius: 300px 0 0 300px;	
}

.image-right-radius img{
border-radius: 0 300px 300px 0;	
}


/*CLM區*/
.clm-box img{
max-width:80%;/*圖片1920px時過大,1200又過小,so在此縮小,1200斷點再放大*/
}


/*符合國際資安標準*/

.standard-cover{
margin:6% 0;
padding-top:5%;
padding-bottom:5%;	
}

/*
.standard-box{
margin:5% 0;
}	
*/

/*word-break*/

.word-break-h1{
display:block;
}
.word-break-subtitle-h1{
display:block;
}

.word-break-p-h1{
display:block;
}

.word-break-p-h2{
display:block;
}
.word-break-h2{
display:block;
}

.word-break-h4{
display:block;
}


.iot-section-padding{
padding:3% 0;
}

/*
.footer-area {
padding: 50px 0 20px 0;
background-color: #302f32;
}
*/

.corporate-logo p{
margin-bottom: 10%;
}


.application-title h4{
font-size: 32px;
line-height: 2.8rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}



/*為什麼選擇全景*/
.why-changing-cover{
margin:6% 0 1% 0;
padding-top:5%;
padding-bottom:5%;
}

.why-changing-title h2{
font-size: 56px;
line-height: 5rem;
color: #fff;
font-weight: 800;
}

.why-changing-title h5{
font-size: 24px;
color: #fff;
}

.why-changing-title p{
display: inline-block;
color: #fff;
}

.why-changing-title img{
width: 18%;
margin-right:2%
}

.why-changing-box{
margin-bottom: 3%;
}



/*media query*/

/*Large devices (desktops, less than 1200px)for筆電*/
@media screen and (max-width: 1600px) {

.iot-main-banner-title h1{
font-size: 64px;
line-height: 4rem;
color: #fff;
font-weight: 400;

}

.iot-subtitle-h1{
color: #fff;
font-size:28px;
text-align: center;
display: block;
font-weight: 500;
}

.iot-title h1{
font-size:46px;
color: #0D7CBE;
line-height: 4rem;
font-weight: 800;
}

.iot-title h2{
font-size: 50px;
line-height: 4.5rem;
color: #000;
font-weight: 800;
padding:0 0 1% 0;
}

.iot-title h4{
font-size: 28px;
line-height: 2.8rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}

.iot-product-title-line{
font-size:23px;
color: #fff;
padding:0.5% 0%;
margin:0 0 2% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}

.iot-product-title{
font-size:23px;
background:#2F2725;
color: #fff;
padding:0.5% 1.8%;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}

.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}
.check-icon img{
width: 30px;
margin: 0 2% 0 0 ;
font-size: 20px;
}

.check-icon {
display: block;
font-size: 18px;
margin: 3% 0 1% 0;
}
	
}


/*Large devices (desktops, less than 1200px)for筆電*/
@media screen and (max-width: 1300px) {
.main-banner-cover{
padding:18% 0;
}
.banner-title-position{
position: absolute;
top: 26%;
left:-4%;
}

.iot-main-banner-title-slogan{
font-size: 23px;
}	
.iot-main-banner-title h1{
font-size: 50px;
line-height: 3rem;
}

.iot-subtitle-h1{
font-size:21px;
}

.iot-title h1{
font-size:38px;
color: #0D7CBE;
line-height: 4rem;
font-weight: 800;
}	
.iot-title h2{
font-size: 46px;
line-height: 4rem;
color: #000;
font-weight: 800;
padding:0 0 1% 0;
}
.iot-subtitle-h2{
font-size:27px;
margin-bottom: 3%;
display: block;
}
.iot-title h4{
font-size: 28px;
line-height: 2.6rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}

	
.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}	
.iot-product-title-line{
font-size:19px;
color: #fff;
padding:0.5% 0%;
margin:0 0 2% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}

.iot-product-title{
font-size:17px;
background:#2F2725;
color: #fff;
padding:0.5% 1.8%;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}

	
.clm-box img{
max-width:120%;/*圖片1920px時過大,1200又過小,so在此縮小,1200斷點再放大*/
}


.trustend-logo{
display: block;
margin:6% 0 2% 0;
width: 60%;
}	
.iot-fido-image{
display:block;
width:60%;
margin:2% 0 2% 0 ;
}	
}


/*Large devices (desktops, less than 1200px)*/
@media screen and (max-width: 1199.98px) {
.main-banner-cover{
padding:20% 0;
}
	
.banner-title-position{
position: absolute;
top: 25%;
left:-3%;
}
	
.iot-main-banner-title h1{
font-size: 46px;
line-height: 3rem;
}
	
.iot-subtitle-h1{
font-size:20px;
}

.iot-product-title-line{
font-size:20px;
color: #fff;
padding:0.5% 0%;
margin:0 0 2% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}

.iot-product-title{
font-size:20px;
background:#2F2725;
color: #fff;
padding:0.5% 1.8%;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}
		
.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}	
	
.clm-box img {
max-width: 100%;
text-align: center;
}

.word-break-p-h2{
display: inline;
}
}	
/*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) {
.main-banner-cover{
padding:19% 0;
}
.banner-title-position{
position: absolute;
top: 24%;
left:0%;
}
	
.iot-main-banner-title-slogan{
font-size: 20px;
}

	
.iot-main-banner-title h1{
font-size: 35px;
line-height: 2.5rem;
}

.iot-subtitle-h1{
color: #fff;
font-size:16px;
}
	
.iot-title h1{
font-size:34px;
color: #0D7CBE;
line-height: 4rem;
font-weight: 800;
}		
.iot-title h2 {
font-size: 40px;
line-height: 3rem;
color: #000;
font-weight: 800;
padding: 0 0 2% 0;
}
.iot-subtitle-h2 {
font-size: 24px;
margin-bottom: 3%;
display: block;
}
.iot-title h4{
font-size: 32px;
line-height: 2.6rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}

.iot-product-title-line{
font-size:24px;
color: #fff;
margin:2% 0 1% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}

.iot-product-title{
font-size:24px;
background:#2F2725;
color: #fff;
margin:2% 0 1% 0;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}
	
.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}	
	
.check-icon {
display: block;
font-size: 18px;
margin: 1% 0 0 0;
}

.trustend-logo{
display: block;
margin:5% 0 1% 0;
width: 40%;
}
	
.sdk-token-pic{
display: block;
width:60%;
text-align: center;
}

.fp300-token-pic{
display: block;
width:50%;
text-align: center;
}
	
.word-break-p-h1{
display: inline;
}		
	
}


/*Small devices (landscape phones, less than 768px)*/
@media screen and (max-width: 767.98px) { 
.main-banner-cover{
padding:58% 0;
background-image:url("../images/iot_security/2025_iot_security/index/iot_main_banner_for_phone_0901.png");
}
	
.banner-title-position{
position: absolute;
top: 10%;
left:4%;
}
	
.iot-main-banner-title-slogan{
font-size: 26px;
margin-bottom: 2%;
}
	
.iot-main-banner-title h1{
font-size: 46px;
line-height: 2.5rem;
}

.iot-subtitle-h1{
font-size:19px;
}

.iot-title h2 {
font-size: 38px;
line-height: 3.3rem;
color: #000;
font-weight: 800;
padding: 0 0 2% 0;
}

.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}	
	
.word-break-h2-for-phone{
display:block;
}
.word-break-h2{
display:inline;
}

.iov-cover {
margin: 10% 0;
padding-top: 11%;
padding-bottom: 11%;

}
.standard-cover {
margin: 10% 0;
padding-top: 11%;
padding-bottom: 11%;
}

}

/*Extra small devices (portrait phones, less than 576px)*/

@media screen and (max-width: 575.98px) { 
.main-banner-cover{
padding:75% 0;
background-image:url("../images/iot_security/2025_iot_security/index/iot_main_banner_for_phone_0901.png");
}
.banner-title-position{
position: absolute;
top: 10%;
left: 4%;
}
	
.iot-main-banner-title-slogan{
font-size: 22px;
margin-bottom: 4%;
}	

.iot-main-banner-title h1{
font-size: 30px;
line-height: 2rem;
}
	
.iot-dot-h1{
font-size:10px;
padding: 0 2%;
display: inline;
}	
	
.iot-subtitle-h1{
color: #fff;
font-size:20px;
text-align: left;
display: block;
line-height: 2.5rem;
text-align: justify;
margin-bottom: 2%;
}	

.iot-title h1{
font-size:20px;
color: #0D7CBE;
line-height: 2rem;
font-weight: 800;
}	
	
.iot-title h2{
font-size: 29px;
line-height: 2.5rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}
	
.iot-subtitle-h2{
font-size:21px;
margin-bottom: 3%;
line-height: 2.2rem;
display: block;
}

.iot-title h4{
font-size: 22px;
line-height: 2rem;
color: #000;
font-weight: 800;
padding:2% 0 2% 0;
}	
	
.iot-main-banner-title p{
display: none;
}
	
.iot-product-title-line{
font-size:20px;
color: #fff;
padding:6% 0% 1% 0;
margin:0 0 2% 0;
font-weight: 600;
display: inline-block;
border-radius: 3px 3px 3px 3px;
}
	
.iot-token-box{
padding: 15% 4%;
margin:0 3%;
}

.iot-product-title{
font-size:20px;
background:#2F2725;
color: #fff;
margin:2% 0 ;
padding:1% 1.8%;
font-weight: 600;
display: inline-block;
border-radius: 2px 2px 2px 2px;
}	
	

.application-title h4 {
font-size: 22px;
line-height: 2rem;
color: #000;
font-weight: 800;
padding: 2% 0 2% 0;
}	

/*車聯網*/
.iov-cover{
margin:6% 0;
padding-top:5%;
padding-bottom: 5%;
}

.iov-cover h2, .iov-cover h4, .iov-cover p, .iov-cover ul, .iov-cover li {
 color: #fff;
}		
	
.sdk-token-pic{
display: block;
width:80%;
text-align: center;
}

.fp300-token-pic{
display: block;
width:70%;
text-align: center;
}

.word-break-subtitle-h1{
display: inline;
}	
.word-break-p-h1{
display:inline;
}

.word-break-h2{
display:inline;
}
.word-break-h2-phone{
display: block;
}
	
.word-break-subtitle-h1-phone{
display: block;
}		
	


}

/*Extra large devices (large desktops)
// No media query since the extra-large breakpoint has no upper bound on its width*/