/*============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: 18px;
line-height: 2.3rem;
color: #000;
margin: 0;
}	

.blue-color-bg{
background:#484ca8;	
}

.light-blue-color-bg{
background:#6166be;		
}

.black-color-bg{
background:#2F2725;
}
.text-blue{
color: #5159F2;
}


.text-green{
color:#B6FF9F;
}
.pqc-pill{
background:#e22929;
color: #fff;
font-weight: 800;
font-size: 1.5rem;
margin-left: 1%;
padding:6px 15px;
vertical-align:bottom;
border-radius: 50px;
}

/*主banner區*/

.main-banner-cover{
padding:13% 0 14% 0;
background-image: url("../images/iot_security/security_chip_new2024_august/clm/main_banner.png");
background-size: cover;
background-position: center center;
/*border-radius: 0 0 250px 250px;*/
}

.iot-main-banner-title{
text-align: center;
}

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

.subtitle-h1{
display: block;
font-size: 44px;
font-weight: 500;
line-height: 3.5rem;
color:#fff;
padding:0 0 0 0;
}


.ra-title h2{
font-size: 58px;
line-height: 4rem;
color: #000;
font-weight: 800;
letter-spacing: -1px;
margin-top:2%;
text-align: center;
}
.subtitle-h2{
display: block;
font-size: 40px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin-bottom: 5%;
text-align: center;
}

/*自動化*/

.automation-bg-cover{
margin-top:2%;
padding:5% 0 5% 0;
border-radius: 150px;
}

.automation-title h4{
font-size: 40px;
color: #fff;
line-height: 3.3rem;
text-align: center;
margin-bottom: 1%;
}

.automation-title p{
color: white;
text-align: center;
}

.automation-pic{
padding:14% 0;
background: url("../images/iot_security/security_chip_new2024_august/clm/automation.png");
background-size: cover;
background-position: center center;
margin:4%;
}

.ra-bg-cover{
padding:3%;
margin:1%;
border-radius: 100px;
} 

.key-generator-title h4{
font-size: 33px;
color: #fff;
line-height: 3rem;
margin-bottom: 1%;
text-align: left;
}

.key-generator-title p{
color:#fff;
text-align: justify;
}
.key-generator-title img{
margin: 5% auto;
display: block;
width: 60%;
}


.btn-bg-cover{
margin-top:5%;
padding:5% 0 8% 0;
/*border-radius: 150px 150px 0 0;*/
}

.btn-title h4{
font-size: 40px;
margin-bottom: 5%;
color: #fff;
text-align: center;
}

.btn-green {
color: #fff;
background-color: #2F2725;
border-color: #fff;
}

.btn-green:hover {
color: #85FFF3;
background-color: #484ca8;
border-color: #5159F2;
}

/*
.btn {
border-radius:25px;
}
*/


/*....................*/

.word-break-h1{
display:block;
}

.word-break-subtitle-h1{
display:block;
}



.word-break-h3{
display:block;
}
.word-break-h4{
display:block;
}

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




/*media query*/

/*Large devices (desktops, less than 1200px)for筆電*/
@media screen and (max-width: 1600px) {

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

.subtitle-h1{
display: block;
font-size: 40px;
font-weight: 500;
line-height: 3.3rem;
color:#fff;

}

}
/*max-width: 1300px*/
@media screen and (max-width: 1400px) {
.pqc-pill{
font-size: 1.2rem;
}	
.main-banner-cover{
padding:12% 0 13% 0;
background-image: url("../images/iot_security/security_chip_new2024_august/clm/main_banner.png");
background-size: cover;
background-position: center center;
/*border-radius: 0 0 250px 250px;*/
}

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

.subtitle-h1{
display: block;
font-size: 30px;
font-weight: 500;
line-height: 2.5rem;
color:#fff;
}
	
.ra-bg-cover {
padding: 3%;
margin: 1%;
border-radius: 60px;
}
	
.ra-title h2{
font-size: 42px;
line-height: 4rem;
color: #000;
font-weight: 800;
letter-spacing: -1px;
margin-top:1%;
text-align: center;
}
	
.subtitle-h2{
display: block;
font-size: 30px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin-bottom: 5%;
text-align: center;
}

.automation-title h4,.key-generator-title h4, .btn-title h4{
font-size: 28px;
line-height: 2.8rem;
}
}

/*Large devices (desktops, less than 1199.98)*/
@media screen and (max-width: 1199.98px) {

.main-banner-cover {
padding: 12% 0px 12% 0;
background-image: url(../images/iot_security/security_chip_new2024_august/clm/main_banner.png);
background-size: cover;
background-position: center center;
/*border-radius: 0 0 60px 60px;*/
}
.iot-main-banner-title h1{
font-size: 38px;
line-height: 3rem;
color:#88F1FF;
font-weight: 800;
font-family: 'Roboto', sans-serif;
}

.subtitle-h1{
display: block;
font-size: 26px;
font-weight: 500;
line-height: 2rem;
color:#fff;
}
.ra-title h2{
font-size: 38px;
line-height: 3.5rem;
color: #000;
font-weight: 800;
letter-spacing: -1px;
margin-top:2%;
text-align: center;
}
	
.subtitle-h2{
display: block;
font-size: 28px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin-bottom: 5%;
text-align: center;
}
.automation-bg-cover{
margin-top:2%;
padding:10% 0 10% 0;
border-radius: 60px;
}
.automation-title p {
color: white;
text-align: left;
}
.automation-title h4,.key-generator-title h4, .btn-title h4{
font-size: 32px;
line-height: 2.8rem;
}
.btn-bg-cover{
margin-top:5%;
padding:5% 0 8% 0;
/*border-radius: 60px 60px 0 0;*/
}
	
.btn {
margin-bottom: 8%;
}
.word-break-h2{
display: block;
}
	
}


/*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: 11% 0px 13% 0;
background-image: url(../images/iot_security/security_chip_new2024_august/clm/main_banner.png);
background-size: cover;
background-position: center center;
/*border-radius: 0 0 60px 60px;*/
}
.iot-main-banner-title h1 {
font-size: 31px;
line-height: 2.5rem;
color: #88F1FF;
font-weight: 800;
font-family: 'Roboto', sans-serif;
}
.subtitle-h1{
display: block;
font-size: 22px;
line-height: 1.8rem;
font-weight: 500;
color:#fff;
}
.ra-title h2{
font-size: 32px;
line-height: 3.3rem;
color: #000;
font-weight: 800;
letter-spacing: 0px;
margin-top:2%;
text-align: center;
}
	
.subtitle-h2{
display: block;
font-size: 24px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin-bottom: 3%;
text-align: center;
}
.ra-bg-cover {
padding: 5%;
margin: 2%;
border-radius: 60px;
}

.automation-pic {
padding: 20% 0;
}	
.btn {
margin-bottom: 5%;
  }

}


/*Small devices (landscape phones, less than 768px)*/
@media screen and (max-width: 767.98px) { 
.pqc-pill{
font-size: 1rem;
}	
.main-banner-cover {
padding: 16% 0px 18%;
background-image: url(../images/iot_security/security_chip_new2024_august/clm/main_banner.png);
background-size: cover;
background-position: center center;
/*border-radius: 0 0 60px 60px;*/
}
.iot-main-banner-title h1 {
font-size: 25px;
line-height: 2rem;
color: #88F1FF;
font-weight: 800;
font-family: 'Roboto', sans-serif;
}
.subtitle-h1{
display: none;
font-size: 24px;
font-weight: 500;
color:#fff;
}
.ra-title h2{
font-size: 26px;
line-height: 2.6rem;
color: #000;
font-weight: 800;
letter-spacing: 0px;
margin-top:2%;
text-align: center;
}
	
.subtitle-h2{
display: block;
font-size: 24px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin-bottom: 3%;
text-align: center;
}
.automation-title h4,.key-generator-title h4, .btn-title h4{
font-size: 28px;
line-height: 2.6rem;
}
.word-break-h2{
display: inline;
}
}

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

@media screen and (max-width: 575.98px) { 
.pqc-pill{
display: none;
}	
.main-banner-cover {
padding:17% 0px 78% 0;
background-image: url(../images/iot_security/security_chip_new2024_august/clm/main_banner_phone_bg.png);
background-size: cover;
background-position: center center;
/*border-radius: 0 0 60px 60px;*/
}
.iot-main-banner-title h1 {
font-size: 32px;
line-height: 2.5rem;
color: #88F1FF;
font-weight: 800;
font-family: 'Roboto', sans-serif;
}
.ra-title h2{
font-size: 28px;
line-height: 2rem;
color: #000;
font-weight: 800;
letter-spacing: 0px;
margin-top:2%;
text-align: center;
}
	
.subtitle-h2{
display: block;
font-size: 22px;
font-weight: 500;
color:#000;
padding:0 0 0 0;
margin: 2% 0 8% 0;
text-align: center;
}
	
.automation-title h4{

text-align: left;
margin-bottom: 1%;
}

.automation-bg-cover {
margin-top: 0;
padding: 10% 0 0 0;
border-radius: 40px;
}

.automation-title p{
color: white;
text-align: left;
}	

.automation-pic{
padding:38% 0px 78% 0;
background: url("../images/iot_security/security_chip_new2024_august/clm/automation_phone.png");
background-size: cover;
background-position: center center;
}	
.ra-bg-cover {
padding: 8% 5%;
margin: 5% 0;
border-radius: 40px;
}
.key-generator-title img {
margin: 5% auto;
display: block;
width: 80%;
}
.key-generator-title p {
color: #fff;
text-align: left; 
}
.btn-bg-cover{
margin-top:10%;
padding:17% 0 17% 0;
/*border-radius: 60px 60px 0 0;*/
}
.automation-title h4,.key-generator-title h4, .btn-title h4{
font-size: 26px;
line-height: 2.4rem;
}

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

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