*{box-sizing:border-box}
section{padding:30px 0}
h1,h2,h3,h4,h5,h6{text-transform:capitalize;padding:10px 0;}
h1, h2, h3{margin:20px 0}
p{margin:15px 0 20px}
ul{list-style:none;padding:0;margin:0 0 20px 0;overflow:hidden}
li{margin-bottom:20px}
h3,h4,h5,h6{font-size:1.1em}
section img{display:inline-block;max-width:100% !important;height:auto !important;margin-bottom:20px}
section a{font-weight:bold}
section a.popup_form{font-weight:normal;display:inline-block}
.flex{display:flex;flex-wrap:wrap;justify-content:space-between;}
.flex-2>*{width:49%}
.flex-3>*{width:32%}
.flex-4>*{width:24%}
.item{padding:10px; background-color:#fff;box-shadow:0 0 10px #ddd;transition:box-shadow .3s}
.item:hover{box-shadow:0 0 10px #77b917; transition:box-shadow .3s}
.container{padding: 0}

/* table */
table{width:100%;background-color:#fff;}
table td,table th{border:1px solid #ddd;text-align:center;padding:10px}
table th,#solution table th a{color:#fff; background:#77b917}
table tr:nth-child(2n+1){background:#f1f8e7}

/*video*/
.video{padding-top:56.25%;position:relative;}
.video iframe{position:absolute;top:0;left:0;height:100%;width:100%}

/* common button */
a.article_zxIn{background-color: #77b917; color: #fff;font-weight:normal; padding:10px 20px; display: inline-block; margin:15px 0 20px; position: relative;transition: background-color .5s;}
a.article_zxIn::after{display: block;content: "";width: 100%; height: 100%; background-color: #06163a; position: absolute; top: 6px; left: 6px; z-index: -1;transition: background-color .5s;}
a.article_zxIn:hover{background-color: #06163a;transition: background-color .5s;}
a.article_zxIn:hover::after{background-color: #77b917;transition: background-color .5s;}

/*carousel*/
.carousel {max-width:1200px;display:flex;flex-direction:column;margin:0 auto;position:relative;}
.carousel .slide-indicators {display:flex;justify-content:center;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}
.carousel .slide-indicator {height:44px;width:50px;display:flex;justify-items:center;cursor:pointer;}
.carousel .slide-indicator:after {content:"";background-color:#878787;height:10px;margin-top:10px;width:40px;}
.carousel .slide-indicator.active:after,.slide-indicator:hover:after {background-color:#000000;}
.carousel #slide-container {scroll-snap-type:x mandatory;overflow-x:hidden;overflow-y:hidden;display:flex;align-items:center;height:100%;gap:10px;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;}
.carousel .slide {scroll-snap-align:center;position:relative;min-width:100%;padding-top:75%;}
.carousel .slide img {height:100% !important;width:100% !important;position:absolute;top:0;left:0;}
.carousel .arrow {color:#ffffff;height:20px;width:20px;background-color:#000000;position:absolute;padding:10px;opacity:.3;cursor:pointer;border:none;border-radius:0;box-sizing:unset;line-height:unset;display:flex;align-items:center;justify-content:center;}
.carousel .arrow:after{display:none}
.carousel .arrow.back {left:10px;top:50%;transform: translateY(-50%);}
.carousel .arrow.forward {right:10px;top:50%;transform: translateY(-50%);}
.carousel .arrow:hover {opacity:1;}

@media (max-width:1024px){
    table{display:block;overflow-x:scroll}
}
@media (max-width:768px){
    .flex-2>*,.flex-3>*,.flex-4>*{width:100% !important;}
}