/* Company Header */
:root {
  --dark-company-grey: #2e2e2e;
  --h3-border-line: #cbcbcb;
}

.main {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow-x: hidden;
}

.underline_style {
  /* position */
  position: relative;
  /* z-index */
  z-index: -1;
}

.underline_style::after {
  /* content */
  content: '';
  /* position */
  position: absolute;
  left: 0;
  bottom: -1px;
  /* size */
  width: 100%;
  height: 1px;
  /* background */
  background-color: var(--main-color);
}

.company_header {
  /* size */
  width: 100%;
  height: auto;

}

/* Content Wrapper */
.content_wrapper p,
.content_wrapper h4 {
  /* font */
  font-family: var(--font-kr);
  font-size: 14px;
  /* text */
  line-height: 25px;
  /* text */
  word-break: keep-all;
}

.content_wrapper p {
  /* font */
  font-weight: lighter;
  /* size */
  width: 100%;
}

/* Company Header contents */
.header_contents_wrapper {
  /* size */

  width: 100%;
  height: 100%;
  /* margin */
  margin: 0 auto;
  /* flex */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 40px;
}

.header_contents_wrapper > h1 {
  max-width: 1050px;
  width: 100%;
  font-family: var(--font-kr);
  font-size: 2.5rem;
  line-height: 55px;
  color: var(--dark-company-grey);
}

/* Header description */
.header_contents_wrapper > p {
  /* size */
  max-width: 440px;
  width: 100%;
  /* font */
  font-family: var(--font-kr);
  font-size: 25px;
  font-weight: lighter;
  line-height: 35px;
  color: var(--dark-company-grey);
}

/* Company button */
.company_header_btn_wrapper {
  /* flex */
  display: flex;
  align-items: center;
  gap: 10px;
}

.designer,
.seller {
  /* size */
  width: 250px;
  /* padding */
  padding: 15px 0;
  /* font */
  font-family: var(--font-kr);
  font-size: 1.2rem;
  font-weight: bold;
  color: var(--white-color);
  /* border */
  border-radius: 38px;
  /* cursor */
  cursor: pointer;
}
/* 디자이너 */
.designer {
  /* background */
  background-color: var(--point-color);
}

/* 셀러 */
.seller {
  /* background */
  background-color: var(--main-color);
}

/* Company Header */
@media screen and (max-width: 1034px) {
  .company_header {
    /* size */
    height: auto;
    /* padding */
    
  }
  /* Company Header contents */
  .header_contents_wrapper {
    /* flex */
    gap: 10px;
  }
  .header_contents_wrapper > h1 {
    max-width: 1050px;
    width: 100%;
    font-family: var(--font-kr);
    font-size: 20px;
    line-height: 25px;
    color: var(--dark-company-grey);
  }
  /* Header description */
  .header_contents_wrapper > p {
    /* font */
    font-size: 12px;
    line-height: 19px;
  }
  /* Company button */
  .designer,
  .seller {
    /* size */
    width: 120px;
    /* padding */
    padding: 8px 0;
    /* font */
    font-size: 9px;
  }
}

/* MAIN CONTENT
============================================================== */
/* Company content */
.company_content_wrapper {
  /* max-width */
  max-width: 800px;
  width: 90%;
}
/* Company Intro */
.company_intro {
  /* flex */
  display: flex;
  flex-direction: column;
  align-items: center;
  /* padding */
  padding: 150px 0;
}
/* Company Intro subtitle */
.company_subtitle {
  /* size */
  width: 100%;
  /* font */
  font-family: var(--font-kr);
  font-weight: normal;
  font-size: 65px;
  /* padding */
  margin-bottom: 70px;
}

/* 공통으로 사용될 list */
.lists_style{
	font-weight: lighter;
	width: 100%;
	margin-bottom: 40px;
}

.lists_style li{
	font-family: var(--font-kr);
	font-size: 14px;
	line-height: 25px;
	word-break: keep-all;
	margin-bottom: 10px;
}

.lists_style li:last-child{
	margin-bottom: 0px;
}

/* FIRST CONTENT
============================================================== */
/* introduce, value, service_intro */
.introduce,
.value, 
.service_intro {
  /* size */
  width: 100%;
  /* flex */
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

/* 상단 회사소개, 회사가치 */
/* h3 */
:is(.introduce, .value, .service_intro) h3 {
  /* font */
  font-family: var(--font-kr);
  font-size: 16px;
  /* size */
  width: 25%;
  /* text */
  white-space: nowrap;
}

/* div */
:is(.introduce, .value, .service_intro) div {
  /* size */
  width: 70%;
}

/* 소개 */
.introduce {
  /* margin */
  margin-bottom: 40px;
}

/* 서비스 */
.service_intro{
	/* margin */
	margin-bottom: 40px;
}

/* SECOND CONTENTS
============================================================== */
/* 소개 첫번째 단락 */
.introduce > div > p:first-child {
  /* margin */
  margin-bottom: 20px;
}

/* 회사 핵심가치 */
.value > .content_wrapper, .service_intro > .content_wrapper {
  /* flex */
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Vision / solve */
.vision,
.solve {
  /* size */
  width: 100%;
  /* flex */
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

/* 상단 비전, 회사가 해결하고자 하는 것 */
/* h3 */
:is(.vision, .solve) h3 {
  /* font */
  font-family: var(--font-kr);
  font-size: 16px;
  /* size */
  width: 25%;
}

/* Company vision */
.company_vision {
  /* padding */
  padding-bottom: 150px;
}

/* OMAV Vision */
.vision {
  /* margin */
  margin-bottom: 50px;
}
.vision > .content_wrapper {
  /* flex */
  display: flex;
  flex-direction: column;
}
.vision > .content_wrapper > img {
  /* size */
  max-width: 100%;
  width: 100%;
}

.vision > .content_wrapper {
  /* size */
  width: 70%;
}

.vision > .content_wrapper > p:nth-of-type(1) {
  /* margin */
  margin: 15px 0;
}

/* sovle */
.solve > .content_wrapper {
  /* size */
  width: 70%;
}

.solve > .content_wrapper > h4,
.solve > .content_wrapper p {
  /* margin */
  margin-bottom: 20px;
}

/* MEMBER CONTENTS
============================================================== */

.company_member {
  /* margin */
  margin-bottom: 100px;
}

.people {
  /* size */
  width: 100%;
  /* flex */
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.people > h3 {
  /* font */
  font-family: var(--font-kr);
  font-size: 16px;
  /* size */
  width: 25%;
}

.people > .content_wrapper {
  /* size */
  width: 70%;
  /* flex */
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5%;
}

/* Figure member profile wrapper */
.member_profile {
  /* size */
  width: 45%;
  /* margin */
  margin-bottom: 18px;
}

/* member info */
.member_info {
  /* text */
  white-space: nowrap;
}

/* Img wrapper */
.img_wrapper {
  /* size */
  width: 240px;
  height: 240px;
  /* overflow */
  overflow: hidden;
  /* If img not found */
  background-color: var(--main-color);
  /* margin */
  margin: 0;
}

.img_wrapper > img {
  /* size */
  width: 100%;
  height: 100%;
}

/* HISTORY CONTENTS
============================================================== */

.company_history {
  /* margin */
  margin-bottom: 50px;
}

.history {
  /* size */
  width: 100%;
  /* flex */
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.history > h3 {
  /* font */
  font-family: var(--font-kr);
  font-size: 16px;
  /* size */
  width: 25%;
}

.history > .content_wrapper {
  /* size */
  width: 70%;
}

/* 연도별 연혁 */
.years {
  /* margin */
  margin-bottom: 20px;
  /* padding */
  padding-left: 15px;
  padding-right: 10px;
  /* list */
  list-style: square;
}

.years > li {
  /* font */
  font-family: var(--font-kr);
  font-size: 16px;
  font-weight: lighter;
  /* text */
  line-height: 28px;
}

/* MAP
============================ */
#map {
}
.map_wrapper > .content_wrapper {
  /* padding */
  padding-bottom: 30px;
}
.map_wrapper > .content_wrapper > ul > li {
  /* font */
  font-family: var(--font-kr);
  font-size: 13px;
  font-weight: 600;
  /* margin */
  margin-bottom: 30px;
}

/* Company main Responsive */
/* 800 */
@media screen and (max-width: 800px) {
  /* Public Common 
  ==================================*/
  .company_subtitle {
    /* font */
    font-size: 40px;
  }
  .company_content_wrapper > article > h3 {
    /* border */
    border-bottom: 1px solid var(--h3-border-line);
    /* padding */
    padding-bottom: 15px;
  }
  /* Company Intro */
  .company_intro {
    /* padding */
    padding: 70px 0;
  }
  /* INTRODUCE / VALUE
  ================================== */
  .introduce,
  .value,
  .service_intro {
    /* flex */
    flex-direction: column;
  }
  :is(.introduce, .value, .service_intro) h3 {
    /* size */
    width: 100%;
    /* margin */
    margin-bottom: 20px;
  }
  :is(.introduce, .value, .service_intro) div {
    /* size */
    width: 100%;
  }
  /* VISION / SOLVE
  ===================================*/
  .vision,
  .solve {
    /* flex */
    flex-direction: column;
  }
  /* h3 */
  :is(.vision, .solve) h3 {
    /* size */
    width: 100%;
    /* margin */
    margin-bottom: 20px;
  }
  :is(.vision, .solve) > .content_wrapper {
    /* size */
    width: 100%;
  }
  /* MEMBER
  ===================================*/
  .people {
    /* flex */
    flex-direction: column;
    align-items: center;
  }
  /* profile figure wrapper */
  .member_profile {
    /* size */
    width: auto;
  }
  /* member info */
  .member_info {
    /* text */
    white-space: wrap;
    /* size */
    width: 240px;
  }
  /* title */
  .people > h3 {
    /* size */
    width: 100%;
    /* margin */
    margin-bottom: 20px;
  }
  .people > .content_wrapper {
    /* size */
    width: 100%;
    /* flex */
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0;
  }
  /* HISTORY
  ===================================*/
  .history {
    /* flex */
    flex-direction: column;
  }
  /* title */
  .history > h3 {
    /* size */
    width: 100%;
    /* margin */
    margin-bottom: 20px;
  }
  .history > .content_wrapper {
    width: 100%;
    /* text */
    word-break: keep-all;
  } /* 연도별 연혁 */
  .years {
    /* margin */
    margin-bottom: 40px;
  }

  .years > li {
    /* padding */
    padding-bottom: 17px;
    /* text */
    line-height: 20px;
  }
  /* Map 
  ================================*/
}

/*  768  */
@media screen and (max-width: 768px) {
  /* Header description */
  .header_contents_wrapper > h1 {
    /* font */
    font-size: 1.1rem;
  }
}