:root {
	--mach-about-title-size: 50px;
	--mach-about-text-size: 16px;
	--mach-about-text-line-height: 2;
}

.mach-padding-top {
	font-size: var(--mach-about-title-size);
	padding: 2em 0 1em 0;
}

.mach-about-con h1 {
	font-size: 40px;
    color: var(--color-primary);
    line-height: 1;
    text-align: center;
	margin-bottom: 45px
}
.mach-about-con h1::after {
  content: "";
  background: var(--color-primary);
  width: 40px;
  height: 4px;
  margin: 11px auto 0;
  display: block;
}

.mach-about__conpic, .mach-about__right {
	width: 100%;
	height: 100%;
}

.mach-about__conpic img {
	width: 100%;
	object-fit: cover;
}
 
.mach-about__right h2 {
	font-family: var(--title-font-family);
	font-size: 32px;
	color: var(--title-text-color);
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 0.4em;
}

.mach-about__right .rich-text {
	font-family: var(--font-family);
	font-size: var(--mach-about-text-size);
	color: var(--text-color);
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 0.8em;
}

.mach-about__right .main-href a {
	display: block;
	font-family: var(--font-family);
	font-size: var(--mach-about-text-size);
	font-weight: 800;
	line-height: normal;
	text-align: center;
	padding: 16px 40px;
	align-items: flex-start;
	background-color: var(--color-primary);
	color: #fff;
	cursor: pointer;
	border-radius: var(--button-radius);
	margin-top: 20px;
}

.mach-about__right .main-href a:hover {
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%), var(--color-primary);
}

@media (min-width: 992px) {
	.mach-about__conpic {
		padding-right: 20px;
	}
}

@media (max-width: 992px) {
	.mach-about__right {
		padding-top: 0.5em;
	}
}


@media screen and (max-width: 1500px) {
	:root {
	  --mach-about-title-size: 44px;
	  --mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 1280px) {
	:root {
		--mach-about-title-size: 38px;
		--mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 1200px) {
	:root {
		--mach-about-title-size: 38px;
		--mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 992px) {
	:root {
		--mach-about-title-size: 32px;
		--mach-about-text-size: 14px;
	}
  }
  
  @media screen and (max-width: 768px) {
	:root {
		--mach-about-title-size: 26px;
		--mach-about-text-size: 14px;
	}
  }
  
  @media screen and (max-width: 576px) {
	:root {
		--mach-about-title-size: 20px;
		--mach-about-text-size: 14px;
	}
  }
  
  
  
  
  
  
@media screen and (max-width: 1440px) {
  .mach-about-con h1 {font-size: 36px;}
  .mach-about__right h2{font-size: 30px;}
}
@media screen and (max-width: 1281px) {
  .mach-about-con h1 {font-size: 34px;}
  .mach-about__right h2{font-size: 28px;}
}
@media screen and (max-width: 1171px) {
  .mach-about-con h1 {font-size: 30px;}
  .mach-about__right h2{font-size: 26px;}
}
@media screen and (max-width: 992px) {
  .mach-about-con h1 {font-size: 26px;}
  .mach-about__right h2{font-size: 22px;}
}
@media screen and (max-width: 768px) {
  .mach-about-con h1 {font-size: 24px;}
  .mach-about__right h2{font-size: 20px;}
}
@media screen and (max-width: 480px) {
  .mach-about-con h1 {font-size: 22px;}
}