/*------------------- developed by JJD front-end developer ------------------*/
/*-------------------------------Apr 2022--------------------------------*/
/*------------------- developed by JJD front-end developer ------------------*/
/*-------------------------------Dec 2020--------------------------------*/
.beforeHover {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: all 0.3s;
}
.afterHover {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}
.transition {
  transition: all 0.3s;
}
.alsliWrap {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  margin-top: 15px;
}
.alsliSin {
  width: calc( (100% - 50px) / 3 );
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-size: 22px;
  color: #18251C;
  font-weight: 600;
  text-align: center;
}
.alsliImg {
  width: 100%;
  height: 400px;
  border-radius: 15px;
  overflow: hidden;
}
.alsliImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.location {
  width: 100%;
  height: 500px;
  border-radius: 15px;
  overflow: hidden;
}
.location iframe {
  width: 100%;
  height: 100%;
}
.conatcttltle {
  width: 100%;
  font-size: 22px;
  color: #18251C;
}
.conatctWrap {
  width: 100%;
  gap: 40px;
  display: flex;
  margin-top: 30px;
}
.conatctIn {
  width: calc( (100% - 40px ) / 2);
  border-radius: 15px;
  overflow: hidden;
}
.conatctForm {
  padding: 30px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  box-shadow: 0 0 5px 1px #00000026;
}
.conatctForm label {
  color: #425147;
}
.conatctForm label span {
  color: #E60023;
}
.conatctForm .headBlock {
  width: 100%;
  font-size: 16px;
  color: #1C311E;
  line-height: 1.5em;
}
.conatctForm .headBlock .mainH {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
}
.conatctFormIn {
  width: 100%;
  gap: 25px;
  display: flex;
  flex-wrap: wrap;
}
.conatctFormG {
  width: 100%;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
.conatctFormFoot {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 15px;
  border-top: 1px solid #F2F5F3;
  padding-top: 30px;
}
.conatctImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blogWrap {
  gap: 50px;
}
.blogL {
  width: calc(70% - 50px);
  display: flex;
  gap: 50px;
  flex-wrap: wrap;
}
.blogLIn {
  width: 100%;
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
  padding-bottom: 50px;
  border-bottom: 1px solid rgba(135, 138, 149, 0.5);
}
.blogLIn:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.blogR {
  width: 30%;
  display: flex;
  gap: 30px;
  align-items: flex-start;
  flex-wrap: wrap;
  flex-direction: column;
}
.blogRIn {
  width: 100%;
  display: flex;
  gap: 30px;
  padding: 30px;
  background-color: #f5f5f5;
  border-radius: 15px;
  flex-wrap: wrap;
}
.blogBanner {
  width: 100%;
  height: 550px;
  border-radius: 20px;
  overflow: hidden;
}
.blogBanner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blogSect {
  width: 100%;
  display: flex;
  gap: 30px;
  font-size: 16px;
  color: #1C311E;
  font-weight: 500;
}
.blogSect li {
  width: auto;
  display: flex;
  gap: 5px;
  cursor: pointer;
  transition: all 0.3s;
}
.blogSect li:hover {
  color: #0E8E39;
}
.blogSect li span {
  color: #0E8E39;
  font-weight: 500;
}
.blogHead {
  width: 100%;
  line-height: 1.5em;
  font-size: 32px;
  font-weight: 600;
  color: #18251C;
}
.blogData {
  width: 100%;
  display: flex;
  gap: 15px;
  font-size: 16px;
  font-weight: 400;
  color: #878a95;
  flex-direction: column;
  line-height: 1.5em;
}
.blogSubH {
  width: 100%;
  font-size: 18px;
  font-weight: 600;
  color: #18251C;
}
.blogLink {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 15px;
  font-size: 14px;
}
.blogLink a {
  width: 100%;
  display: flex;
  gap: 5px;
  align-items: center;
  transition: all 0.3s;
}
.blogLink a:hover {
  color: #0E8E39;
}
.blogLink [class^="tl_"] {
  font-size: 12px;
}
.blogSearch {
  width: 100%;
  border: 1px solid #878a95;
  display: flex;
  border-radius: 10px;
  overflow: hidden;
}
.blogSearch input {
  flex: 1;
  border: 0;
  padding: 10px 15px;
  font-size: 13px;
  color: #878a95;
}
.blogSearch .btnOne {
  border-radius: 0;
}
.blogRel {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-size: 14px;
}
.blogRel li {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 15px;
}
.blogRelImg {
  flex: 1;
  height: 90px;
  border-radius: 10px;
  overflow: hidden;
}
.blogRelImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blogRelCont {
  font-weight: 600;
  line-height: 1.2em;
  flex: 2;
  display: flex;
  gap: 10px;
  flex-direction: column;
}
.blogRelDate {
  font-size: 13px;
  color: #878a95;
  display: flex;
  gap: 5px;
  align-items: center;
}
.blogTagWrap {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  font-weight: 400;
}
.blogTagWrap ul {
  width: auto;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
.blogTagWrap ul li {
  width: auto;
  display: flex;
}
.blogTagWrap ul li a {
  padding: 10px 15px;
  border: 1px solid #dfdfdf;
  font-size: 13px;
  line-height: 1em;
  background-color: #f5f5f5;
  border-radius: 6px;
  color: #767676;
  transition: all 0.3s;
}
.blogTagWrap ul li a:hover {
  background-color: #0E8E39;
  color: #fff;
  border-color: #0E8E39;
}
.blogTagHead {
  width: auto;
  font-weight: 600;
}
.blogSocial {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  font-weight: 400;
}
.blogSocialHead {
  width: auto;
  font-weight: 600;
}
.blogSocial ul {
  width: auto;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  font-size: 35px;
}