.banner-description-box p {
max-width: 600px;
}
.template-05{
padding: var(--section-gap) var(--pad-space) 0 var(--pad-space)
}
.template-05>div{
width: 100%;
max-width: 1250px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr;
grid-gap: 60px;
}
.template-05-content th,
.template-05-content td{
font-family: var(--ch-font);
font-size: var(--xd-19px);
font-weight: 400;
margin: 0;
text-align: center;
vertical-align: middle;
color: #4B4A4A;
height: 95px;
}
.template-05-content th{
color: white;
font-weight: 500;
}
.template-05-content a{
background: white;
border: 1px solid #707070;
padding: 8px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 100%;
margin: 0 auto;
}
.template-05-content thead tr th:nth-child(1),
.template-05-content thead tr th:nth-child(3) {
width: 35%;
}
.template-05-content thead tr th:nth-child(2),
.template-05-content thead tr th:nth-child(4){
width: 15%;
}
.template-05-content-mobile{
display: none;
}
.template-05-content table{
table-layout: fixed;
border-collapse: separate;
border-spacing: 0;
margin: 0;
}
.template-05-content th,
.template-05-content td{
border: unset;
border-block-start:unset !important;
}
.template-05-content th{
background: var(--main-color);
}
.template-05-content tbody tr td:nth-child(odd) {
background-color: #F7F7F7;
}
.template-05-content tbody tr td:nth-child(even) {
background-color: #E8E8E8;
}
.template-05-content thead th:first-child{
border-radius: 20px 0 0 0;
}
.template-05-content thead th:last-child{
border-radius: 0 20px 0 0;
}
.template-05-content tbody tr:last-child td:first-child{
border-radius: 0 0 0 20px;
}
.template-05-content tbody tr:last-child td:last-child{
border-radius: 0 0 20px 0;
}
.template-05-content thead tr th:not(:last-child){
border-right:2px solid white;
}
.template-05-content tbody tr td{
border-right: 2px solid #DBDBDB;
}
.template-05-content tbody tr td:first-child{
border-left: 2px solid #DBDBDB;
}
.template-05-content tbody tr td{
border-bottom: 2px solid #DBDBDB;
}
.template-05-content.mobile-mode{
display: none;
}
@media only screen and (max-width:950px){
.banner-description-box p {
max-width: 500px;
}
}
@media only screen and (max-width:1024px){
.template-05-content th, .template-05-content td{
font-size: 15px;
}
}
@media only screen and (max-width:767px){
.banner-description-box p {
max-width: unset;
}
.template-05-content.desk-mode{
display: none;
}
.template-05-content.mobile-mode{
display: block;
}
.template-05-content th, .template-05-content td{
padding: 15px;
height: auto;
}
.template-05-content td{ }
}
@media only screen and (max-width:600px){
.template-05-content thead th:first-child{
border-radius: 10px 0 0 0;
}
.template-05-content thead th:last-child{
border-radius: 0 10px 0 0;
}
.template-05-content tbody tr:last-child td:first-child{
border-radius: 0 0 0 10px;
}
.template-05-content tbody tr:last-child td:last-child{
border-radius: 0 0 10px 0;
}
.template-05-content th, .template-05-content td{
padding: 15px 5px;
height: auto;
font-size: 13px;
}
}