/* common */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR&family=Noto+Sans+KR:wght@100..900&display=swap');
@font-face {
    font-family: ibm-bold;
    src: url(../font/IBM_Plex_Sans_KR/IBMPlexSansKR-Bold.ttf);
  }
@font-face {
	font-family: ibm-semibold;
	src: url(../font/IBM_Plex_Sans_KR/IBMPlexSansKR-SemiBold.ttf);
}
@font-face {
	font-family: ibm-medium;
	src: url(../font/IBM_Plex_Sans_KR/IBMPlexSansKR-Medium.ttf);
}
@font-face {
	font-family: ibm-regular;
	src: url(../font/IBM_Plex_Sans_KR/IBMPlexSansKR-Regular.ttf);
}
* {
	font-family: var(--fw-regular);
}

body {
	background: #111;
}
section {
	padding: 140px 0;
	box-sizing: border-box;
}
.container {
	margin: 0 auto;
	padding: 0 40px;
	width: 100%;
	max-width: 1440px;
	box-sizing: border-box;
}
.d-none {
	display: none;
}


/* header */
header {
	position: fixed;
	/*max-width: 1380px;*/
	height: 80px;
	display: flex;
	align-items: center;
	top: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to bottom, rgba(0,0,0,0.95), rgba(0,0,0,0.2));
	z-index: 99;
}
header > div {
	margin: 0 auto;
	padding: 0 30px;
	width: 100%;
	max-width: 1440px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
}
header h1 {
	height: 60px;
}
/* temp */
header h1>div, header h1>div div {
	height: 60px;
}
header h1>div div {
	line-height: 60px;
}
/* end temp */
header h1 img {
	height: 100%;
}
header ul {
	display: flex;
	align-items: center;
	justify-content: end;
}
header ul li {
	margin-left: 30px;
	padding: 0 10px;
	color: #fff;
	cursor: pointer;
	font-size: 17px;
	font-family: 'Noto Sans KR', sans-serif;
	font-weight: 400;
}
header ul li:hover {
	color: var(--main-color);
	font-family: 'Noto Sans KR', sans-serif;
	font-weight: 500;
}
header ul li.active {
	color: var(--main-color);
	font-family: 'Noto Sans KR', sans-serif;
	font-weight: 500;
}


/* main */
main {
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}

/* main banner */
.main-banner {
	height: 98vh;
	max-height: 920px;
	display: flex;
	align-items: center;
	background-image: url(../image/main-banner.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.main-banner .container > div > p {
	color: #fff;
	word-break: keep-all;
}
.main-banner .semi-title {
	font-size: 28px;
	font-family: var(--fw-medium);
}
.main-banner .main-title {
	font-size: 75px;
	font-family: var(--fw-medium);
}
.main-banner .main-title span:first-child {
	color: var(--main-color);
	font-family: var(--fw-semibold);
}
.main-banner .main-title span:last-child {
	background-color: var(--main-color);
	font-family: var(--fw-semibold);
}
.main-banner button {
	padding: 1em 1.65em;
	display: flex;
	align-items: center;
	border: 1px solid var(--main-color);
	border-radius: 30px;
	background-color: var(--main-color);
	box-sizing: border-box;
	cursor: pointer;
	transition: .25s;
	margin-top: 8em;
}
.main-banner button:hover {
	background-color: #BA5012;
	border: 1px solid #BA5012;
}
.main-banner button:hover > p {
	color: #fff;
}
.main-banner button:hover > .icon-container > .icon{
	background-color: #fff;
}
.main-banner button > p {
	font-size: 22px;
	font-family: var(--fw-medium);
	color: #fff;
	margin-right: 8px;
}
.main-banner button > .icon-container {
	width: 2.5em;
	height: 2.5em;
}


/* how section */
.how-section.how-sec {
	padding: 0 !important;
	margin-top: 35px;
	margin-bottom: 35px;
}
.how-section.how-sec > .container > div {
	display: flex;
	flex-direction: column;
	gap: 35px;
}
.how-section {
	padding-bottom: 0;
}
.how-section .title-wrap p,
.how-section .title-wrap p span {
	word-break: keep-all;
	text-align: center;
	font-family: var(--fw-semibold);
	color: #fff;
}
.how-section .title-wrap p {
	font-size: 70px;
}
.how-section .title-wrap p span {
	display: inline-block;
}
.how-section .title-wrap p span:nth-of-type(1),
.how-section .title-wrap p span:nth-of-type(2),
.how-section .title-wrap p span:nth-of-type(3) {
	color: var(--main-color);
}
.inquiry-wrap {
	margin-top: 60px;
	margin-bottom: 55px;
	padding-bottom: 55px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	box-sizing: border-box;
}
.inquiry-wrap > p {
	margin-bottom: 38px;
	text-align: center;
	color: #fff;
	font-size: 24px;
	font-family: var(--fw-medium);
}
.inquiry-wrap > p > span {
font-family: var(--fw-medium);
	background-image: linear-gradient(120deg, var(--main-color) 100%, var(--main-color) 100%);
 	background-repeat: no-repeat;
	background-size: 100% 26%;
 	background-position: 0 88%;
	transition: background-size 0.28s ease-in;
}
.inquiry-wrap > div {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 60px;
}
.inquiry-box {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
}
.inquiry-box > p {
	font-size: 48px;
	font-family: var(--fw-semibold);
}
.inquiry-box.m-box > p {
	color: #387BFF;
}
.inquiry-box.w-box > p {
	color: #D96CAA;
}
.inquiry-box > div {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.inquiry-box .inquiry-img {
	width: 124px;
}
.inquiry-box .inquiry-img > img {
	width: 100%;
}
.inquiry-box > div > p {
	width: 152px;
	height: 44px;
	line-height: 44px;
	text-align: center;
	border-radius: 30px;
	font-size: 20px;
	font-family: var(--fw-medium);
	color: #fff;
}
.inquiry-box.m-box > div > p {
	background-color: #387BFF;
}
.inquiry-box.w-box > div > p {
	background-color: #D96CAA;
}
.how-wrap {
	margin: 0 auto;
	width: 68%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.how-wrap > p,
.how-wrap > p span {
	font-size: 32px;
	font-family: var(--fw-medium);
	word-break: keep-all;
	text-align: center;
	color: #fff;
}
.how-wrap > p span {
	display: inline-block;
	background-color: #bbb;
	color: #111;
	border-radius: 2px;
}
.how-box {
	margin-top: 30px;
	padding: 2em 1.6em;
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	border-radius: 20px;
	box-sizing: border-box;
	background-color: #191919;
}
.how-box > div {
	width: calc(100% / 3);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.how-box > div > div  {
	position: relative;
	width: 100%;
}
.how-box > div > p,
.how-cont > p {
	width: 100%;
	padding-top: 3px;
	text-align: center;
	word-break: keep-all;
	font-size: 16px;
	color: #fff;
	box-sizing: border-box;
}
.how-box > div > p {
	padding: 0.35em 0.5em;
	background-color: #333;
	border-right: 1px solid rgba(255, 255, 255, 0.1);
	color: #eee;
	font-family: var(--fw-medium);
}
.how-box > div:last-of-type > p:first-of-type {
	border: none;
}
.how-box > div img {
	margin-bottom: 8px;
	width: 100%;
	object-fit: cover;
}
.our-how .how-box > div img {
	
}
.how-wrap:nth-child(1) .how-box > div:nth-of-type(2) img {
/* 	transform: scale(-1, 1); */
}
.how-wrap.our-how > p span {
	background-color: var(--main-color);
	color: #fff;
}
/*.how-wrap.our-how .how-box > div img {
	transform: scale(-1, 1);
}*/
.how-cont {
	height: 120px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.our-how .how-box {
	background-color: #333;
	border: 2px solid var(--main-color);
}
.our-how .how-box > div > p {
	background-color: #FFE2D1;
	color: var(--main-color);
	border-color: rgba(0,0,0,0.5);
}
.our-how .how-cont > p {
	margin: 0 auto;
	width: 85%;
	font-size: 20px;
	font-family: var(--fw-medium);
}
.our-how .how-box > div > p:first-child {
	width: 100%;
	font-family: var(--fw-semibold);
}
.our-how .how-next .icon-container {
	position: absolute;
	width: 22px;
	height: 22px;
	top: 50%;
	transform: translateY(-50%);
	right: -11px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(255, 255, 255, 0.7);
	box-shadow: 0 4px 4px rgba(0,0,0,0.25);
	border-radius: 50%;
	z-index: 10;
	display: none;
}
.our-how .how-next .icon-container .icon {
	width: 80%;
	height: 80%;
}

/* benefit section */
.benefit-wrap {
	padding-bottom: 0 !important;
}
.benefit-wrap .container {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.benefit-wrap .title-wrap p {
	text-align: center;
	word-break: keep-all;
}
.benefit-wrap .title-wrap p:first-child {
	font-size: 85px;
	font-family: var(--fw-bold);
	color: var(--main-color);
}
.benefit-wrap .title-wrap p:last-child {
	font-size: 36px;
	color: #fff;
}
.process {
	margin: 2.8em 0 5em;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px;
}
.process > p {
	padding: 0 1.2em;
	height: 40px;
	line-height: 40px;
	font-size: 18px;
	border: 1px solid #fff;
	border-radius: 30px;
	color: #fff;
	box-sizing: border-box;
}
.benefit-box-wrap {
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}
.benefit-box-wrap > div {
	padding: 1.5em;
	height: 450px;
	background-color: #252525;
	overflow: hidden;
	box-sizing: border-box;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}
.benefit-box-wrap > div::before {
	content: "";
	background-color: rgba(0,0,0,0.5);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.benefit-cont > p {
	font-size: 36px;
	font-family: var(--fw-medium);
	color: #fff;
	word-break: keep-all;
	position: absolute;
	top: 0.85em;
	left: 0.85em;
}
.benefit-cont > p > span {
	display: inline-block;
	font-family: var(--fw-medium);
	border-radius: 5px;
	background-color: var(--main-color);
}
.benefit-box-wrap > div:nth-child(1) {
	background-image: url(../image/benefit01.jpg);
}
.benefit-box-wrap > div:nth-child(2) {
	background-image: url(../image/benefit02.jpg);
}
.benefit-box-wrap > div:nth-child(3) {
	background-image: url(../image/benefit03.jpg);
}
.benefit-box-wrap > div:nth-child(4) {
	background-image: url(../image/benefit04.jpg);
}

/* career section */
.career-wrap {
	background-color: #F4F1EB;
/*	padding-top: 0 !important;
	padding-bottom: 0 !important;*/
}
.career-wrap .container {
	display: flex;
	align-items: center;
	justify-content: center;
}
.career-wrap .container > div {
	padding: 1.5em;
	margin-left: 1em;
	/*padding-bottom: 0 !important;*/
	width: 60%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
}
.career-wrap .container > div:first-child {
	width: 44%;
}
.career-wrap .container > div > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: none;
}
.career-wrap .title-wrap > p {
	word-break: keep-all;
}
.career-wrap .title-wrap > p:first-of-type {
	padding: 0.35em 0.8em;
	margin-bottom: 8px;
	width: fit-content;
	color: #fff;
	font-size: 17px;
	background-color: #333;
	border-radius: 30px;
}
.career-wrap .title-wrap > p:nth-of-type(2) {
	color: #222;
	font-size: 52px;
	margin-bottom: 5px;
	letter-spacing: normal;
}
.career-wrap .title-wrap > p:nth-of-type(2) span {
	display: inline-block;
	text-align: center;
	color: #000;
	font-size: 60px;
	font-family: var(--fw-bold);
	letter-spacing: .1rem;
}
.career-wrap .title-wrap > p:last-of-type span {
	font-family: var(--fw-medium);
	background-color: var(--main-color);
	word-break: keep-all;
}
.career-wrap ul {
	margin: 12px 0 34px;
	padding: 1.35em 1em;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 5px;
	box-sizing: border-box;
}
.career-cont {
	margin-top: 16px;
	width: 100%;
	font-size: 22px;
	font-family: var(--fw-medium);
	color: #444;
	word-break: keep-all;
	letter-spacing: 1px;
}
.career-cont span {
	display: inline-block;
	font-family: var(--fw-semibold);
	font-size: 32px;
	color: var(--main-color);
}
.career-wrap ul li {
	padding: 1em;
	width: calc((100% - 4px) / 3);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}
.career-wrap ul li:nth-of-type(7),
.career-wrap ul li:nth-of-type(9) {
	width: calc(80% / 2);
}
.career-wrap ul li span {
	display: inline-block;
	color: #62351B;
	font-size: 18px;
	font-family: var(--fw-medium);
	text-align: center;
}
.career-wrap ul li p {
	color: #111;
	font-size: 50px;
	font-family: var(--fw-bold);
	text-align: center;
	white-space: nowrap;
	text-shadow: 2px 2px 5px rgba(98, 53, 27, 0.4);
}
.career-wrap ul > .line {
	padding: 0;
	width: 2px !important;
	height: 65px;
	background-color: #aaa;
	white-space: nowrap;
}
.career-wrap ul > .line.m-line {
	display: none;
}
.career-search {
	display: flex;
	gap: 8px;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.career-search > p {
	font-size: 26px;
	color: #333;
	font-family: var(--fw-medium);
}
.career-search > div {
	height: 46px;
}
.career-search > div > img {
	height: 100%;
}
.career-img-wrap {
	width: 44%;
	position: absolute;
	top: -2px;
	left: 0;
	bottom: -2px;
	background-image: url(../image/career-img.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.o-hidden {
	overflow: hidden;
}


/* background wrap */
.bg-wrap {
	background-image: url(../image/bg-large.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}


/* interview section */
.interview-wrap {
	padding-bottom: 0;
	margin-bottom: 35px;
}
.interview-wrap .title-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 60px;
}
.interview-wrap .title-wrap p {
	word-break: keep-all;
	text-align: center;
}
.interview-wrap .title-wrap p:first-child {
	padding: 0.25em 1em;
	width: fit-content;
	color: #fff;
	font-size: 30px;
	font-family: var(--fw-semibold);
	box-sizing: border-box;
	border-radius: 30px;
}
.interview-wrap .title-wrap p:nth-child(2),
.interview-wrap .title-wrap p:last-child span {
	color: #fff;
	font-size: 65px;
	font-family: var(--fw-semibold);
}
.interview-wrap .title-wrap p:last-child span {
	margin-top: -10px;
	color: var(--main-color);
	font-family: var(--fw-bold);
	word-break: keep-all;
	text-align: center;
}
.interview-wrap .title-wrap p:last-child span .zero {
	font-size: 76px;
	font-family: var(--fw-bold);
}
.video-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.video-wrap > div {
	width: 75%;
	padding-top: 45%;
	position: relative;
}
.video-wrap > div > video {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: contain;
}


/* curriculum section */
.curriculum-wrap {
	padding-bottom: 0;
	margin-bottom: 35px;
}
.curriculum-wrap .title-wrap p {
	margin: 0 auto;
	text-align: center;
	word-break: keep-all;
	font-size: 70px;
	color: #fff;
	font-family: var(--fw-semibold);
}
.curriculum-wrap .title-wrap p span {
	display: inline-block;
	font-family: var(--fw-semibold);
}
.curriculum-wrap .title-wrap p span:first-child {
	display: inline-block;
	color: var(--main-color);
	font-family: var(--fw-semibold);
}
.curriculum-wrap > .container {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.curriculum-wrap > .container > div:last-of-type {
	margin-top: 78px;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	row-gap: 40px;
}
.curriculum-box {
	width: calc((100% - 30px) / 2);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
}
.curriculum-box > p {
	text-align: center;
	word-break: keep-all;
	color: #fff;
}
.curriculum-box > p:first-of-type {
	padding: 0.4em 0.8em;
	width: fit-content;
	box-sizing: border-box;
	font-size: 17px;
	color: var(--main-color);
	border-radius: 30px;
	border: 1px solid var(--main-color);
}
.curriculum-box > p:nth-of-type(2) {
	font-size: 22px;
	font-family: var(--fw-medium);
}
.curriculum-box > p:nth-of-type(2) span {
	display: inline-block;
	font-size: 26px;
	font-family: var(--fw-semibold);
	color: var(--main-color);
}
.curriculum-box > p:last-of-type {
	width: 50%;
	font-size: 16px;
	margin-bottom: 10px;
	color: #ddd;
}
.curriculum-box > p:last-of-type span {
	border-bottom: 2px solid var(--main-color);
}
.curriculum-box > img {
	width: 100%;
	object-fit: cover;
}
.curriculum-wrap button {
	margin-top: 68px;
	padding: 0.6em 1.4em;
	background-color: var(--main-color);
	color: #fff;
	font-size: 20px;
	font-family: var(--fw-medium);
	border-radius: 5px;
	border: 1px solid var(--main-color);
	box-sizing: border-box;
}


/* patent section */
.patent-wrap {
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	margin-bottom: 35px;
}
.patent-wrap > .container {
	padding: 0;
	max-width: none;
}
.patent-wrap .title-wrap > div {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.patent-wrap .title-wrap > div > img {
	height: 175px;
}
.patent-wrap .title-wrap > div > p {
	font-size: 65px;
	color: #E8E5E0;
	font-family: var(--fw-medium);
	text-align: center;
}
.patent-wrap .title-wrap > div > p > span {
	display: inline-block;
	color: #E8E5E0;
	font-family: var(--fw-bold);
	background: linear-gradient(to right, #E4D699, #B59139);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}
.patent-wrap .title-wrap > p {
	font-size: 20px;
	color: #fff;
	font-family: var(--fw-regular);
	margin: 60px auto;
	width: 50%;
	text-align: center;
	word-break: keep-all;
}
#slider {
   overflow: hidden;
   position: relative;
   width: 100%;
   /*height: 365px;*/
}
.image-box {
	/*원본+클론의 총 합*/
   width: 3060px;
   height: 100%;
   display: flex;
   gap: 15px;
   flex-wrap: nowrap;
}
.slide-img {
   animation: bannermove 10s linear infinite;
}
.image-box > div {
  min-width: 240px;
  max-width: 240px;
  height: auto;
}
.image-box > div img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@keyframes bannermove {
  0% {
      transform: translate(0, 0);
  }
  100% {
      transform: translate(-50%, 0);
  }
}


/* compare section */
/*.compare-wrap {
	background-image: url(../image/compare-sec-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}*/
.compare-wrap {
	padding-bottom: 0;
	margin-bottom: 35px;
}
.compare-wrap .title-wrap p {
	font-size: 75px;
	color: #fff;
	font-family: var(--fw-medium);
	text-align: center;
	word-break: keep-all;
}
.compare-wrap .title-wrap p:first-child {
	color: #fff;
}
.compare-wrap .title-wrap p:nth-child(2) span {
	display: inline-block;
	color: #fff;
	background-color: var(--main-color);
	font-family: var(--fw-medium);
	border-radius: 5px;
	padding: 0 4px;
}
.compare-wrap .title-wrap p:first-child span {
  position: relative;
  display: inline-block;
  color: var(--main-color);
  font-family: var(--fw-medium);
  text-transform: uppercase;
  animation-delay: calc(.1s * var(--i));
  text-emphasis: filled dot;
}
.compare-wrap article {
	width: 100%;
	font-size: 30px;
	color: #fff;
	text-align: center;
}
.compare-box-wrap {
	margin-top: 85px;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.compare-box {
	padding: 1em 1em 1.8em;
	width: calc((100% - 60px) / 3);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: rgba(255,255,255,0.15);
	border-radius: 5px;
	box-sizing: border-box;
}
.compare-box > img {
	width: 100%;
	object-fit: contain;
}
.compare-box > div {
	margin: 1em 0;
	width: 42px;
	height: 42px;
}
.compare-box > p {
	width: 80%;
	font-size: 22px;
	font-family: var(--fw-medium);
	color: #fff;
	text-align: center;
	word-break: keep-all;
}


/* profit section */
.profit-wrap .title-wrap > p {
	margin-bottom: 55px;
	color: #fff;
	font-size: 70px;
	font-family: var(--fw-semibold);
	text-align: center;
	word-break: keep-all;
}
.profit-box {
	display: flex;
}
.profit-table {
	width: 90%;
	margin: 0 auto;
}
.profit-table {
	color: #fff;
}
.table-wrap {
	margin: 10px 0;
	width: 100%;
	border-collapse: collapse;
}
.table-wrap th, .table-wrap td {
	padding: .95rem;
	box-sizing: border-box;
	text-align: center;
	font-size: 15px;
	border: 1px solid #d4d4d4;
	font-size: 22px;
}
.table-wrap thead td {
	border: 1px solid var(--main-color);
	background: var(--main-color);
	font-family: var(--fw-medium);
}
.table-wrap tbody tr {
	height: 86px;
	box-sizing: border-box;
}
.table-wrap td span {
	font-size: 16px;
	font-family: var(--fw-regular);
}
.table-wrap tr td:first-of-type {
	border-left: 0;
}
.table-wrap tr td:last-of-type {
	border-right: 0;
	font-family: var(--fw-medium);
}
.profit-table > p {
	font-family: var(--fw-medium);
	word-break: keep-all;
}
.profit-table > p:first-of-type {
	font-size: 25px;
	color: #EEEEEE;
	text-align: left;
}
.profit-table > p:last-of-type {
	font-size: 18px;
	color: #D7D7D7;
	text-align: right;
}

.br-none {
	border-right: 0;
}
.bl-none {
	border-left: 0;
}
.bt-none {
	border-top: 0;
}
.bl-bottom {
	border-bottom: 0;
}


/* review section */
.review-wrap {
	background-color: #F4F1EB;
	padding: 0 30px;
}
.review-wrap .container {
	display: flex;
	height: 100vh;
}
.review-title {
	width: 40%;
	height: 100%;
	margin-top: 5em;
	position: relative;
}
.review-title h3 {
	color: #111111;
	font-size: 48px;
}
.review-title > div > h3:first-child {
	margin-top: 30px;
	margin-right: 10px;
}
.review-title h3 span {
	color: #D76421;
}
.review-image {
	position: absolute;
	width: 25em;
	height: 25em;
	left: 0;
	bottom: -5px;
}
.reviw-box {
	position: relative;
	width: 60%;
	display: flex;
	gap: 1em;
	overflow: hidden;
}
.lists-slider {
	position: absolute;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	width: 300px;
}
.slider1 {
	right: 400px;
}
.slider2 {
	right: 70px;
}
.review-1,
.review-2,
.review-3 {
	width: 100%;
	height: auto;
}
.review-content-box {
	padding: 1em;
	display: flex;
	flex-direction: column;
	gap: 10px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2);
}
.review-text {
	font-size: 14px;
}
.slider1, .slider2 {
  animation-iteration-count: infinite;
  animation-duration: 15s;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
.slider1 {
  animation-name: slidedown;
}
.slider2 {
  animation-name: slideup;
}

@keyframes slidedown {
  0% {
    transform: translateY(-50%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes slideup {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}


/* video section */
.video-section {
	background-image: url(../image/video-sec-bg.png);
	background-repeat: repeat;
	background-position: center;
	background-size: contain;
}
.video-section .title-wrap p {
	text-align: center;
	word-break: keep-all;
}
.video-section .title-wrap p:nth-of-type(1) {
	font-size: 40px;
	font-family: var(--fw-medium);
	color: #eee;
}
.video-section .title-wrap p:nth-of-type(2) {
	font-size: 65px;
	font-family: var(--fw-semibold);
	color: #fff;
}
.video-section .title-wrap p:nth-of-type(1) span {
	position: relative;
	display: inline-block;
	color: var(--main-color);
	font-family: var(--fw-medium);
	text-transform: uppercase;
	animation-delay: calc(.1s * var(--i));
	text-emphasis: filled dot;
}
.video-section .title-wrap p:nth-of-type(2) span {
	display: inline-block;
	color: var(--main-color);
	font-family: var(--fw-semibold);
}
.review-video {
	margin: 74px auto 0;
	width: 90%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 25px;
}
.review-video > div {
	width: calc((100% - 50px) / 2);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
}
.review-video video[poster] {
	width: 100%;
	height: 100%;
}


/* inquire section */
.inquire-wrap .title-wrap p,
.inquire-wrap .title-wrap span {
	text-align: center;
	word-break: keep-all;
}
.inquire-wrap .title-wrap p:first-child {
	color: #E8E5E0;
	font-size: 42px;
	font-family: var(--fw-medium);
}
.inquire-wrap .title-wrap span {
	display: block;
	color: var(--main-color);
	font-size: 65px;
	font-family: var(--fw-bold);
}
.inquire-box {
	margin-top: 100px;
	display: flex;
	 justify-content: center;
	align-items: center;
	gap: 40px;
}
.inquire-box > div {
	width: 50%;
	height: 600px;
}
.inquire-box > div > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.inquire-form {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.certify-btn > button {
	height: calc(100% - 2px);
	padding: 0.7em 2em;
	font-size: 16px;
	border: 0;
	background-color: #E2E2E2;
	color: #000;
	font-family: var(--fw-medium);
	border-radius: 0 3px 3px 0;
	cursor: pointer;
	position: absolute;
	right: 1px;
	top: 50%;
	transform: translateY(-50%);
	transition: .25s;
}
.certify-btn > button:hover {
	background-color: #CDCDCD;
}
.certify-btn > button.disabled {
	background-color: #aaa;
	color: #444;
	cursor: default;
}
.certify-btn > button.disabled:hover {
	background-color: #aaa;
	color: #444;
	cursor: default;
}
.contact-form {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.inquire-form > div > input,
.inquire-form > textarea {
	padding: 0 20px;
	width: 100%;
	height: 60px;
	background-color: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 5px;
	box-sizing: border-box;
	color: #fff;
	font-size: 18px;
}
.inquire-form > textarea {
	height: 226px;
	padding: 20px;
}
.inquire-form > div > input::placeholder,
.inquire-form > textarea::placeholder {
	font-size: 18px;
	color: #ccc;
}
.check-wrapper {
	min-height: 1.5em;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	gap: 5px;
}
.check-wrapper > p {
	width: 100%;
	color: #b2b2b2;
	font-size: 14px;
	margin-top: 6px;
}
.check-wrapper .checkbox {
	width: 24px;
	height: 24px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.check {
	display: block;
	position: relative;
	cursor: pointer;
	font-size: 22px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.checkbox .check input {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	cursor: pointer;
}
.checkmark {
	position: absolute;
	width: 18px;
	height: 18px;
	top: -8px;
	left: -9px;
	background: #fff;
	border: 2px solid rgba(255, 255, 255, 0.15);
	border-radius: 3px;
	transition-property: background-color, border-color;
	transition-duration: .25s;
	box-sizing: border-box;
}
.check-wrapper .check input:checked~.checkmark {
	background-color: #4d4d4d;
}
.check-wrapper .check .checkmark:after {
	left: 5px;
	top: 2px;
	width: 3px;
	height: 8px;
	border: solid white;
	border-width: 0 2px 2px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
.check-wrapper .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}
.check-wrapper .check input:checked~.checkmark:after {
	display: block;
}
.check-wrapper .description {
	display: flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	transition: .25s;
}
.check-wrapper .description>label {
	font-size: 18px;
	color: #ccc;
}
.check-wrapper .description>span {
	margin-left: 6px;
	font-size: 15px;
	color: #A8A8A8;
	text-decoration: underline;
	text-decoration-color: #A8A8A8;
	transition: .25s;
}
.check-wrapper .description>span:hover {
	color: #fff;
	text-decoration-color: #fff;
}
.inquire-form > button {
	height: 60px;
	border-radius: 5px;
	background-color: var(--main-color);
	color: #fff;
	border: none;
	font-size: 20px;
	font-family: var(--fw-medium);
	cursor: pointer;
	transition: .25s;
}
.inquire-form > button:hover {
	background-color: #C85B1B;
}
.inquire-form > button.disabled {
	background-color: #545454;
	color: #C7C7C7;
	cursor: default;
}

/* footer */
.footer {
	padding: 2em 0 3em;
	background-color: #222;
}
.footer-cont {
	display: flex;
	flex-direction: column;
}
.footer-cont > ul {
	display: flex;
	flex-wrap: wrap;
}
.footer-cont > ul > li {
	margin-right: 12px;
	font-size: 18px;
	color: #888;
}
.footer-cont > ul > li > span {
	font-family: var(--fw-medium);
}
.footer p {
	margin-top: 20px;
	font-size: 18px;
	font-family: var(--fw-medium);
	color: #999;
}
.footer .m-menu {
	display: none;
}


/* popup */
.agreement-popup {
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 999;
}
.agreement-popup>div {
	padding: 2em 1.5em 1.8em;
	position: absolute;
	width: 600px;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	background: #fff;
	box-shadow: 3px 6px 12px rgba(0, 0, 0, 0.2);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.agreement-popup h3 {
	padding-bottom: 1em;
	margin-bottom: 1em;
	margin-top: 0;
	border-bottom: 1px solid #333;
}
.agreement-popup p {
	font-family: var(--fw-medium);
}
.agreement-popup span {
	margin-top: 4px;
	margin-bottom: 2em;
	display: block;
	color: #333;
	word-break: keep-all;
}
.agreement-popup button {
	margin: 0 auto;
	padding: 0.6em 1.8em;
	width: fit-content;
	border: none;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 500;
	box-sizing: border-box;
	background: #EDEDED;
	cursor: pointer;
	transition: .25s;
}
.agreement-popup button:hover {
	background: #e7e7e7;
}

/* alert */
.alert-wrap {
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 999;
	/*            display: none;*/
}
.alert-wrap>.alert {
	padding: 1.8em 1.25em 1.4em;
	position: absolute;
	width: 330px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	background: #fff;
	border-radius: 5px;
	box-shadow: 3px 6px 12px rgba(0, 0, 0, 0.2);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.alert p {
	margin: 15px 0 24px;
	text-align: center;
}
.alert button {
	margin: 0 auto;
	padding: 0.6em 1.8em;
	width: fit-content;
	border: none;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 500;
	box-sizing: border-box;
	background: #EDEDED;
	color: #111;
	cursor: pointer;
	transition: .25s;
}
.alert button:hover {
	background: #e7e7e7;
}