/*===============================================
 *	Intro
===============================================*/
.intro h2{font-size:46px;position: relative;padding: 10px 0 20px;margin-bottom: 30px;font-weight: bold;background: linear-gradient(90deg, #0881b1 0% 50%, #08b177 50%);background-repeat: no-repeat;background-size: 80px 5px;background-position: bottom;}


@media only screen and (max-width: 1024px) {
    .intro ul li h3{font-size: 20px;}
}
@media only screen and (max-width: 960px) {
    .intro h2{font-size:32px ;}
}
@media only screen and (max-width: 568px) {
    .intro h2{font-size: 24px;}
}

/*===============================================
 *	Product-content
===============================================*/
.product-content ul{gap: 1vw;flex-wrap: wrap;}
.product-content ul li{width: 48%;}

.product-txt h3{font-size: 30px;font-weight: bold;margin-bottom: 10px;}
.product-txt h3 span{font-size: 20px;}
.product-txt p{margin-bottom: 10px;}
.main-features h4{font-size: 22px;font-weight: bold; position: relative;border-bottom: solid 4px #c1d9e7;margin-bottom: 20px;}
.main-features h4::after{position: absolute;content: " ";display: block;border-bottom: solid 4px var(--site-primary);bottom: -4px;width: 60px;}
.main-features dl{position: relative;padding-left: 20px;margin-bottom: 20px;}
.main-features dl::before{content: "";display: inline-block;position: absolute;top: 0;left: 0;bottom: -7px;width: 4px;
height: 100%;border-radius: 5px;background: var(--site-primary);}
.main-features dl dt,.main-features dl dd span{font-size: 18px;font-weight: bold;}

.product-table,.rental-table{width: 100%;border-collapse: separate;border-bottom: 1px solid #ccc;}
.product-table thead,.rental-table thead{font-size:28px;font-weight: bold;}
.product-table thead th, .rental-table thead th {padding: 20px 0 22px;}
.rental-table thead th span{font-size:18px;font-weight: bold;}
.product-table thead th,.rental-table thead th{border-radius:6px 6px 0 0;font-weight: bold;}

.product-table tbody th,.rental-table tbody th{background: #dff6ff;border: 1px solid #ccc;text-align: center;border-bottom: none;width: 25%;font-size: 18px; font-weight: bold;padding: 15px 0 17px;line-height: 1;}
.rental-table tbody th span{font-size: 15px;}
.product-table tbody td,.rental-table tbody td{border: 1px solid #ccc;border-left: none;border-bottom: none;padding: 15px 0 17px 15px;background: #fff;}
.product-table tbody td{font-size: 17px;}
.rental-table tbody td{font-size: 20px;}
.rental-table tbody td em{font-size: 16px; border-radius: 6px;padding: 5px;margin-left: 20px;letter-spacing: 0;}
.product-table tbody td span,.rental-table tbody td span{font-size: 14px;}
.rental-table{margin-bottom: 5px;}

.annotation{font-size:14px ;text-align: right;margin-bottom: 20px;}

.attention h4{font-size: 22px;font-weight: bold; position: relative;border-bottom: solid 4px #f0d8dd;margin-bottom: 10px;}
.attention h4::after{position: absolute;content: " ";display: block;border-bottom: solid 4px #d52951;bottom: -4px;width: 60px;}
.attention dl{margin-bottom: 5px;}
.attention dl dt{font-size: 18px;font-weight: bold;}
.product-sub .border-box{}
.product-sub .border-box p,.product-sub .border-box img{width: 50%;}
.border-box .row{padding:20px 0px 25px 60px;align-items: center;}
.border-box .row img{max-width: 429px;margin: 0 auto;}

.note{margin-bottom: 4%;}

@media only screen and (max-width: 1024px) {
    .product-txt h3{font-size: 24px;}
    .product-txt h3 span{font-size: 18px;}
    .product-table tbody th{line-height: 1.5;}
    .rental-table tbody th{font-size: 17px;width: 35%;}
    .rental-table tbody th span{font-size: 12px;}
    .rental-table tbody td em{margin-left: 0;font-size: 14px;}
    
}
@media only screen and (max-width: 960px) {
    .product-table thead, .rental-table thead{font-size: 24px;}
    .product-table thead th, .rental-table thead th{padding: 10px 0 12px;}
    .rental-table tbody td{font-size: 18px;}
    .border-box .row{padding:10px 20px; gap: 15px;}
    .note h3{font-size: 24px;}
}
@media only screen and (max-width: 568px) {
    .intro p{margin-bottom: 10px;}
    .product-content ul{flex-direction: column;gap: 20px;}
    .product-content ul li{width: 100%;}
    .product-table tbody th, .rental-table tbody th{padding:10px 0 12px;font-size: 16px;}
    .product-table tbody td, .rental-table tbody td {padding: 10px 0 12px 10px;font-size: 16px;}
    .rental-table tbody td em{margin-left: 5px;}
    .border-box .row{flex-direction: column;padding: 10px 20px 20px;}
    .product-sub .border-box p, .product-sub .border-box img {width: 100%;}
}