/* main */
#main {
   padding-top: 6.5rem;
}
/* font */
.title {
   font-size: 3rem;
   font-weight: bold;
   line-height: 120%;
   color: black;
}
hr {
   width: 6.25rem;
   border: 2px solid #FD5C14;
   margin-top: 3rem;
   margin-bottom: 3.75rem;
}

/* background */
.background-white {
   width: 100%;
   height: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: white;
}
.background-gray {
   width: 100%;
   height: auto;
   display: flex;
   align-items: center;
   justify-self: center;
   background-color: #F6F6F6;
}

/* 첫번째 페이지 */
.first {
   align-items: center;
   column-gap: 10.6875rem;
   padding-top: 8rem;
   padding-bottom: 13.375rem;
}
/* wrap */
.first > .wrap {
   display: flex;
   flex-direction: column;
   row-gap: 2.25rem;
}
.first .text-orange {
   font-size: 2.5rem;
   font-weight: bold;
   list-style: 120%;
   letter-spacing: -0.03em;
   color: #FD5C14;
}
.first .text-title {
   font-size: 4.5rem;
   font-weight: bold;
   line-height: 120%;
   letter-spacing: -0.03em;
   color: black;
}
.first .text-normal {
   font-size: 2rem;
   line-height: 120%;
   letter-spacing: -0.03em;
   color: black;
}
/* grid */
.first > .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 1.5rem;
}
.first .box {
   width: 17.5625rem;
   height: 17.5625rem;
   border-radius: 50%;
}
.first .box > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}

/* 회사 소개 */
.introduction {
   display: flex;
   align-items: flex-start;
   justify-content: center;
   column-gap: 1rem;
   padding-top: 9.875rem;
}
/* CEO 이미지 */
.introduction > .ceo-image-wrap {
   width: 29rem;
   height: 34.5625rem;
}
.introduction .ceo-image {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
/* 내용 */
.introduction > .content {
   max-width: 44.25rem;
   display: flex;
   flex-direction: column;
}
.introduction > .content > .hr-wrap {
   width: 6.25rem;
}
.introduction > .content hr {
   border: 2px solid #FD5C14;
   margin-top: 3rem;
   margin-bottom: 4.25rem;
}
.introduction > .content > .description {
   font-size: 1.75rem;
   list-style: 120%;
   color: black;
}

/* 기업 역량 */
.ability {
   flex-direction: column;
   row-gap: 3rem;
   padding-top: 7.5rem;
   padding-bottom: 12.5rem;
}
.ability > .content {
   display: flex;
   align-items: center;
   column-gap: 1.5rem;
}
.ability .description {
   width: 29rem;
   display: flex;
   flex-direction: column;
   align-items: center;
}
.ability .image-box {
   width: 13.75rem;
   height: 13.75rem;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background-color: #F6F6F6;
}
.ability .image-wrap {
   width: 8.75rem;
   height: 8.75rem;
}
.ability .image-wrap > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}
.ability .text-bold {
   font-size: 1.75rem;
   font-weight: bold;
   line-height: 120%;
   margin-top: 2.25rem;
   margin-bottom: 1.25rem;
   color: black;
}
.ability .text-normal {
   font-size: 1.5rem;
   line-height: 120%;
   text-align: center;
   color: black;
}

/* 비전 */
.vision {
   width: 100%;
   height: 37rem;
   position: relative;
}
.vision > .image-wrap {
   display: flex;
   width: 100%;
   height: 100%;
}
.vision > .image-wrap > img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   filter: brightness(0.5);
}
.vision > .container {
   width: 100%;
   position: absolute;
   top: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: 8.75rem 0;
}
.vision > .container > .title {
   font-size: 3rem;
   font-weight: bold;
   line-height: 120%;
   color: white;
}
.vision > .container > hr {
   width: 6.25rem;
   border: 2px solid white;
   margin-top: 3rem;
   margin-bottom: 3.75rem;
}
.vision > .container > .description {
   display: flex;
   flex-direction: column;
   align-items: center;
   row-gap: 1.5rem;
}
.vision > .container > .description  > .text-bold {
   font-size: 3.1rem;
   font-weight: bold;
   line-height: 120%;
   color: white;
}
.vision > .container > .description > .text-normal {
   font-size: 1.875rem;
   line-height: 120%;
   color: white;
}

/* 연혁 */
.history {
   flex-direction: column;
   padding: 12.5rem 0;
}
.history .text-bold {
   font-size: 2rem;
   font-weight: bold;
   line-height: 120%;
   color: black;
}
.history .text-normal {
   font-size: 1.875rem;
   line-height: 120%;
   color: black;
}
/* 그래프 */
.history > .grap-wrap {
   display: flex;
   flex-direction: column;
   row-gap: 0.125rem;
}
.history ol {
   height: 100%;
   display: flex;
   margin: 0;
}
.history ol li {
   display: flex;
   align-items: flex-start;
   column-gap: 3.75rem;
   list-style: none;
}
.history .title-wrap {
   display: flex;
   align-items: flex-start;
}
.history .circle-wrap {
   height: 100%;
   position: relative;
   margin-top: 0.625rem;
   margin-right: 3.75rem;
   margin-left: 4.25rem;
}
.history .circle-wrap::after {
   content: '';
   position: absolute;
   top: 1.75rem;
   bottom: 0.25rem;
   left: 50%;
   transform: translateX(-50%);
   width: 3px;
   background-color: #909090;
}
.history .circle {
   width: 1.5rem;
   height: 1.5rem;
   border-radius: 50%;
   background-color: #FE5714;
}
.history .content {
   display: flex;
   flex-direction: column;
   row-gap: 2.875rem;
   margin-bottom: 4.5rem;
}

/* 교육 서비스 */
.service {
   flex-direction: column;
   padding: 12.5rem 0;
}
.service > .container {
   display: flex;
   flex-direction: column;
   align-items: center;
   row-gap: 12.5rem;
}
.service > .container > .wrap {
   display: flex;
   align-items: center;
   column-gap: 6.25rem;
}
.service > .container > .bakcground-blue {
   align-items: flex-start;
   background-color: #382BF1;
   border-radius: 3.125rem;
   padding: 0 6.125rem;
   padding-top: 7.5rem;
}
/* 랜딩 이미지 */
.service .landing-1,
.service .landing-2 {
   width: 45.75rem;
   height: 37.5rem;
}
.service .landing-1 > img,
.service .landing-2 > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}
.service .landing-3 {
   width: 32rem;
   height: 32.375rem;
}
.service .landing-3 > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}
/* 내용 */
.service .content-wrap {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   row-gap: 2.25rem;
}
.service .content-wrap > .content-inner-wrap {
   display: flex;
   flex-direction: column;
   row-gap: 1.25rem;
}
.service .content-title {
   font-size: 2rem;
   font-weight: bold;
   line-height: 120%;
   color: #FF5414;
}
.service .content-sub-title {
   font-size: 3rem;
   font-weight: bold;
   line-height: 120%;
   color: black;
}
.service .content-description {
   max-width: 35.125rem;
   font-size: 1.625rem;
   line-height: 140%;
   color: black;
}
.service a {
   display: flex;
   align-items: center;
   column-gap: 0.75rem;

   font-size: 1.625rem;
   line-height: 120%;
   letter-spacing: -0.03em;
   color: #FE5714;
   text-decoration: none;
}

/* 협력 기업 */
.company {
   flex-direction: column;
   padding: 12.5rem 0;
}
.company > .logo-grid {
   width: 90rem;
   display: grid;
   justify-items: center;
   align-items: center;
   gap: 3rem;
   grid-template-columns: repeat(4, 1fr);
}
.company > .logo-grid.last-row {
   display: flex;
   justify-content: center;
   column-gap: 7.5rem;
   margin-top: 3rem;
}
.삼성, .HD현대, .LG, .국가유산청, .서울특별시, .충청북도기업진흥원 { height: 4.125rem; } /* 66px */
.스타벅스 { height: 1.6875rem; } /* 27px */
.CJ { height: 5.875rem; } /* 94px */
.정관장, .한화, .HD현대인프라코어 { height: 2.9375rem; } /* 47px */
.HUmetro { height: 3.875rem; } /* 62px */
.서울시설공단, .용인시, .롯데백화점, .꾸띠끄 { height: 5rem; } /* 80px */
.근로복지공단 { height: 2.3125rem; } /* 37px */
.서울특별시교육청 { height: 4.875rem; } /* 78px */
.한국체육산업개발주식회사 { height: 6rem; } /* 96px */
.company img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}

/* 정부 지원 사업 */
.award {
   flex-direction: column;
   padding: 12.5rem 0;
}
.award > .content {
   display: flex;
   flex-direction: column;
   align-items: center;
   row-gap: 3.75rem;
}
.award .content-title {
   font-size: 1.875rem;
   line-height: 120%;
   color: black;
}
.award .image-container {
   display: flex;
   align-items: center;
   column-gap: 1.5rem;
}
.award .image-wrap {
   height: 19.4375rem;
}
.award .image-wrap > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}

/* 오시는 길 */
.map {
   flex-direction: column;
   padding: 12.5rem 0;
}
.map > .wrap {
   display: flex;
   flex-direction: column;
   row-gap: 3rem;
}
.map > .wrap > .address {
   font-size: 1.5rem;
   font-weight: bold;
   line-height: 100%;
   letter-spacing: -0.03em;
   color: black;
}
.map > .wrap > .map-image {
   height: 37.5rem;
}
.map > .wrap > .map-image > img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}