/*============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;
}	


.iot-section-padding{
padding:3% 0;
}

/*主banner區*/
.main-banner-cover{
padding: 14% 0 14% 0;
background-image: url("../images/iot_security/2025_iot_security/token/main_banner_bg.png");
background-size: cover;
background-position: center center;
border-radius: 0;
/*background-color: #2fafd2;*/
}

.iot-main-banner-title img{
width: 45%;
margin-bottom: 1%;
}

.iot-main-banner-title h1{
font-size: 74px;
line-height: 5rem;
color: #88F1FF;
font-weight: 800;
font-family: 'Roboto', sans-serif;
}

.iot-title h2{
font-size: 65px;
line-height: 5rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}

.iot-title h3{
font-size: 43px;
/*	font-size: 50px;*/
line-height: 3.5rem;
color: #000;
font-weight: 800;
padding:0 0 2% 0;
}

.iot-token-pic img{
width:100%;
} 


/*media query*/

/*Large devices (desktops, less than 1200px)for筆電*/
@media screen and (max-width: 1600px) {
.iot-main-banner-title h1{
font-size: 70px;
line-height: 4rem;
color: #88F1FF;
}

.iot-title h2{
font-size: 62px;
line-height: 4rem;
color: #000;
font-weight: 800;
padding:0 0 5% 0;
}
	
.iot-title h3{
font-size: 40px;
line-height: 3.3rem;
color: #000;
font-weight: 800;
padding:0 0 1% 0;
}

}

/*max-width: 1300px*/
/* 程式碼簽署的應用情境區專用/改圖上文下*/
@media screen and (max-width: 1400px) {
.iot-main-banner-title h1{
font-size: 54px;
line-height: 4rem;
color: #88F1FF;
font-weight: bold;
}
.iot-title h2{
font-size: 58px;
line-height: 4rem;
color: #000;
font-weight: 800;
padding:0 0 5% 0;
}
	
}


/*Large devices (desktops, less than 1200px)*/
@media screen and (max-width: 1199.98px) {
.iot-main-banner-title h1{
font-size: 40px;
line-height: 4rem;
}

.iot-title h2{
font-size: 45px;
line-height: 4rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}


.iot-title h3{
font-size: 40px;
line-height: 3.3rem;
color: #000;
font-weight: 800;
padding:0 0 2% 0;
}

.iot-token-pic img{
float: none;
width: 100%;
} 	

}

/*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) {
.iot-main-banner-title h1{
font-size: 34px;
line-height: 3.5rem;
padding:0 0 1% 0;
text-align: center;
}

.iot-title h2{
font-size: 40px;
line-height: 4rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}

.iot-title h3{
font-size: 30px;
line-height: 2.3rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}	
}


/*Small devices (landscape phones, less than 768px)*/
@media screen and (max-width: 767.98px) { 
.iot-main-banner-title h1{
font-size: 38px;
line-height: 2.7rem;
}

.iot-title h2{
font-size: 40px;
line-height: 3.5rem;
color: #000;
font-weight: 800;
padding:0 0 5% 0;
}

.iot-title h3{
font-size: 35px;
line-height: 3rem;
color: #000;
font-weight: 800;
padding:0 0 3% 0;
}
	
}

/*Extra small devices (portrait phones, less than 576px)*/

@media screen and (max-width: 575.98px) { 
.main-banner-cover{
padding: 25% 0 88% 0;
background-image: url("../images/iot_security/2025_iot_security/token/main_banner_bg_phone.png");
background-size: cover;
background-position: center center;
border-radius: 0;
/*background-color: #2fafd2;*/
}
.iot-main-banner-title img{
width: 55%;
margin-bottom: 1%;
}

.iot-main-banner-title h1{
font-size: 31px;
line-height: 2.2rem;
}
	
.iot-title h2{
font-size: 28px;
line-height: 2.6rem;
color:#000;
font-weight: 800;
padding:5% 0;
}

.iot-title h3{
font-size: 23px;
line-height: 2.5rem;
color:#000;
font-weight: 800;
padding:0 0 3% 0;
}

.iot-title h4{
font-size: 22px;
line-height: 2rem;
color:#000;
font-weight: 800;
padding:0;
}


}


/*Extra large devices (large desktops)
// No media query since the extra-large breakpoint has no upper bound on its width*/