@import url("./font-face.css");

/* fixed_contact_box */
body,
html {
  max-width: 100vw;
  width: 100%;
  overflow-x: hidden;
}

/* fixed_contact_box */

/* 기존 애니메이션 */
@keyframes slide-in {
  from {
    opacity: 0;
    transform: translateX(200px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 롤링 애니메이션 */
@keyframes rollingleft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* 롤링 클래스 */
.buttonBox.rolling {
  animation: rollingleft 20s linear infinite;
}

@keyframes slide-in2 {
  to {
    opacity: 0;
    transform: translateX(-200px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes down-in {
  to {
    opacity: 0;
    transform: translateY(-100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* main */
#main_container {
  width: 100%;
  height: 737px;
  /* height: 651px; */
  padding-bottom: 22px;
  background-color: #0e1e31;
  display: -webkit-inline-box;
  
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;

  position: relative;

  margin-top:-86px;
}

#main_container .bottom_buttonBox .topslide{
  animation-delay: 0.7s !important;
  transform: translateX(200px);
  animation: slide-in 1s ease-out 2s forwards;
  opacity: 0;
}
.bottom_buttonBox{
  display: flex;
  align-items: center;
  gap: 20vw;
  margin-left: 30px;

}
.main_right_contents > .bottom_buttonBox button.first_button:hover {
  background-color: #0e1e31;
}

.main_right_contents > .bottom_buttonBox button.first_button:hover > a > p {
  color: #d8f30a;
}

.main_right_contents > .bottom_buttonBox button a > .more_arrow_wrapper > img:last-child {
  width: 34px;
  height: 34px;
  display: none;
}
.main_right_contents
  > .bottom_buttonBox button.first_button:hover
  a
  > .more_arrow_wrapper
  > img:last-child {
  display: block;
}

.main_right_contents
  > .bottom_buttonBox button.first_button:hover
  a
  > .more_arrow_wrapper
  > img:first-child {
  display: none;
}

.animation_wrapper {
  opacity: 1;
  /* transform: translateY(-100%); */
  /* animation: down-in 1s ease-out forwards; */
}
#main_container > .main_left_contents {
  /* width: 590px; */
  /* width: 38%; */
  margin-right: 9.6vw;
  padding-left: 6%;
  position: relative;
  margin-top: 86px;

}


.main_left_contents::after {
  display: none;
  z-index: 999;
  content: "";
  position: absolute;
  top: 0;
  right: -11vw; /* 처음에는 오른쪽 밖에 위치 */
  bottom: 0;
  width: 50px;
  background: linear-gradient(to right, rgb(14 30 49), rgba(255, 255, 255, 0));
  pointer-events: none;
 
  opacity: 0; /* 초기 상태에서 숨기기 */
  animation: fade-in 1s ease-out 1.5s forwards /* 애니메이션: 0.5초 후에 나타나도록 설정 */
}

@keyframes fade-in {
  0% {
    
    opacity: 0; /* 처음에는 보이지 않음 */
  }
  100% {
   
    opacity: 1; /* 나타남 */
  }
}


/* .main_right_contents::after {
  z-index: 999;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 30px;
  background: linear-gradient(to right, rgb(14 30 49), rgba(255, 255, 255, 0));
  pointer-events: none;
} */
#main_container > .main_left_contents > h2 {
  line-height: 64px;
  font-size: 48px;
  font-family: "Moderniz";
  margin-top: 50px;
  color: white;
  animation: slide-in2 1s ease-out forwards;
  opacity: 0;
  transform: translateX(-200px);
}
#main_container > .main_left_contents > p {
  animation: slide-in2 1s ease-out forwards;
  font-size: 20px;
  margin-top: 24px;
  color: white;
  opacity: 0;
  transform: translateX(-200px);

  line-height: 28px;
  font-family: 'SUIT';
  font-weight: 400;
}
#main_container > .main_left_contents > a {
  width: fit-content;
  background-color: #8056dc;
  animation: slide-in2 1s ease-out forwards;
  opacity: 0;
  transform: translateX(-200px);
  padding: 16px 24px;
  border-radius: 100px;
  color: white;
  margin-top: 30px;
  display: flex;
  align-items: center;
}
#main_container > .main_left_contents > a > div {
  line-height: 28px;
  font-size: 18px;
  font-weight: 500;
  color: white;
}
#main_container > .main_left_contents > a > img {
  margin-left: 10px;
}
.main_right_contents {
  /* position: relative; */
  /* margin-left: 271px; */
  padding-right: 25px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 136px;

  overflow: hidden;
  gap: 20px;


  /* position: absolute; */
  /* top: 0; */
  /* left: 50vw;  */
  /* bottom: 25px; */
  
}

.first_button.mobile {
  display: none;
}
.first_button.mobile,
.main_right_contents  .bottom_buttonBox  .first_button {
  /* width: 7.76vw; */
  /* height: fit-content; */
  /* height: 20vh; */

  margin-right: 14px;
  width: 260px;
  height: 70px;
  background-color: #d8f30a;
  border-radius: 40px;
  padding: 0 16px 16px;
  z-index: 9999;

  /* position: absolute; */
 


}

.first_button.mobile a{
  gap: 16px;
  display: flex;
  align-items: center;
}
.main_right_contents .buttonBox {
  display: flex;
  /* margin-left: 14px; */
  /* overflow: hidden; */

  /* background-color: #8056dc; */
}
/* 스와이퍼 테스트 */
.main_right_contents .buttonBox a {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.main_right_contents .buttonBox p {

    margin-top: 30px;
    font-family: 'KBO-Dia-Gothic-L';
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;

}


 .main_right_contents .buttonBox  > button {
  position: relative;
  width: 260px;
  height: 458px;

  border-radius: 40px;
  background-color: #e7eaf1;

  padding: 8px 8px 16px;

  opacity: 0;
  transform: translateX(200px);
  animation: slide-in 1s ease-out 2s forwards;

}
 







.main_right_contents > .bottom_buttonBox > .first_button{
  transform: translateX(200px);
  animation: slide-in 1s ease-out 2s forwards;
  opacity: 0;
  /* transition: 0.4s; */
}
.main_right_contents > .bottom_buttonBox > .first_button > a{
    gap: 20px;
    display: flex;
    height: 70px;
    align-items: center;
    justify-content: center;
}
.main_right_contents .buttonBox  > button img{border-radius: 40px;}
.main_right_contents .buttonBox > button:hover {
  background-color: #cfb9ff;
}


.main_right_contents .buttonBoxWrapper {
  /* width: 100%; */
  width: 1040px;
  margin-left: 30px;
  overflow: hidden;
}

.main_right_contents > .bottom_buttonBox .first_button,
.main_right_contents .buttonBox  button:nth-child(1),
.main_left_contents > h2 {
  animation-delay: 0.7s;
}

.main_right_contents .buttonBox  button:nth-child(2),
.main_left_contents > p {
  animation-delay: 0.9s;
}
.main_right_contents .buttonBoxWrapper  .buttonBox  button:nth-child(3),
.main_left_contents > a {
  animation-delay: 1.1s;
}

.main_right_contents .buttonBoxWrapper  .buttonBox  button:nth-child(4) {
  animation-delay: 1.3s;
}
.main_right_contents .buttonBoxWrapper  .buttonBox  button:nth-child(5) {
  animation-delay: 1.5s;
}
.main_right_contents .buttonBoxWrapper  .buttonBox  button:nth-child(6) {
  animation-delay: 1.7s;
}
.main_right_contents .buttonBoxWrapper  .buttonBox  button:nth-child(7) {
  animation-delay: 1.9s;
}

.main_right_contents .buttonBox .swiper-slide{
  /* width: 150px !important; */
}

@keyframes flowRolling {
  0% {
      transform: translateX(0);
  }
  100% {
      transform: translateX(-100%);
  }
}




.main_right_contents > button a > img:first-child {
  width: 100%;
  height: 342px;
  display: block;
  border-radius: 40px;
}
.main_right_contents > button a > p {
  font-size: 32px;
  line-height: 32px;
  /* margin: 24px 8px 52px; */
  font-weight: 300;
  color: #0e1821;
}
.main_right_contents > .bottom_buttonBox .first_button > a > p {
  color: #0e1821;
  font-size: 28px;
  font-weight: 400;
  line-height: 33px;

  text-align: left;
  /* padding-top: 24px; */
  /* margin: 0 0 16px 0;  */
  /* margin-bottom: 16px;  */

  font-family: 'Blinker-R';
  font-weight: 400;
}
.main_right_contents > .bottom_buttonBox .first_button > a > p > br{
  display: none;
}
.more_arrow_wrapper {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  background-color: #0e1821;
  justify-content: center;
  align-items: center;
}
.more_arrow_dark_wrapper {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  border: 1px solid #0e1821;
  justify-content: center;
  align-items: center;
  margin-left: 7px;

  /* position: absolute; */
  /* bottom: 16px; */
  /* left: 16px; */
}
/* main */

/* sub main */
#sub_main_contents {
  padding: 78px 0px 0 152px;
  display: flex;
  padding-bottom: 200px;
}
#sub_main_contents > .sub_main_info {
  margin-right: 80px;
}
#sub_main_contents > .sub_main_info > h2 {
  width: 390px;
  height: 260px;
  font-family: "Moderniz";
  font-size: 64px;
  background: url("/img/whatdoyouneed_bg.svg") left/390px 260px no-repeat;
  padding: 25px 18px;
  line-height: 76.8px;
  color: black;
}
#sub_main_contents > .sub_main_info > div:nth-child(2) {
  font-size: 20px;
  padding: 0 18px;
  border-bottom: 1px solid #d1d1d1;
  padding-bottom: 50px;
  margin-bottom: 50px;
}
#sub_main_contents > .sub_main_info > #site_type_tablist {
  width: 419px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
#sub_main_contents > .sub_main_info > #site_type_tablist > li {
  font-size: 18px;
  padding: 11px 17px;
  border-radius: 100px;
  border: 1px solid #8056dc;
  white-space: nowrap;
  cursor: pointer;
  font-weight: 500;
  line-height: 1.56;
  display: flex;
  align-items: center;
  transition: 0.4s ease-in-out;
}
#sub_main_contents > .sub_main_info > #site_type_tablist > li.active {
  background-color: #8056dc;
  color: white;
}
#sub_main_contents > .sub_main_info > #site_type_tablist > li > .and_circle {
  width: 4px;
  height: 4px;
  margin: 0 4px;
  border-radius: 50%;
  background-color: black;
  transition: 0.4s;
}
#sub_main_contents
  > .sub_main_info
  > #site_type_tablist
  > li.active
  .and_circle {
  background-color: white;
}
#sub_main_contents > .site_type_buttonlist {
  margin-right: 170px;
  display: flex;
  flex-wrap: wrap;
  column-gap: 22px;
  row-gap: 20px;
}
#sub_main_contents > .site_type_buttonlist  li {
  width: 31%;
  /* width: 361px; */
  /* min-height: 475px; */
  min-height: fit-content;
  padding: 15px;
  background: linear-gradient(
      to bottom,
      #0e1e31 50%,
      rgba(255, 255, 255, 0) 50%
    ),
    url(/img/whatdoyouneed_list_bg.svg);
  background-size: 100%; /* 또는 원하는 크기로 조정 */
  background-position: center bottom;
  background-repeat: no-repeat; /* 이미지를 반복하지 않도록 설정 */
  color: white;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
  opacity: 0;
  transition: 0.4s ease-in-out;
  transform: translateY(100px);
  cursor: pointer;
  
}
/* 스와이퍼 테스트 */
.main_right_contents .buttonBox > button img{
  width: 100%;
  height: 100%;
}
#sub_main_contents > .site_type_buttonlist  li  img {
  object-fit: cover;
  display: block;
}

#sub_main_contents > .site_type_buttonlist.scroll_motion  li {
  animation: upMotion 0.7s ease-in-out forwards;
}

@keyframes upMotion {
  form {
    transform: translateY(100px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes downMotion {
  form {
    transform: translateY(100px);
    opacity: 0;
  }
  to {
    transform: translateY(170px);
    opacity: 1;
  }
}

#sub_main_contents > .site_type_buttonlist  li  .more_arrow_wrapper {
  width: 50px;
  height: 50px;
  position: absolute;
  right: 6px;
  bottom: 6px;
}
#sub_main_contents > .site_type_buttonlist.scroll_motion  li:nth-child(2),
#sub_main_contents > .site_type_buttonlist.scroll_motion  li:nth-child(5) {
  animation: downMotion 0.7s ease-in-out forwards;
}
#sub_main_contents > .site_type_buttonlist li img {
  /* 사이즈가 커질때 깨짐 현상으로 현재 2700기준으로 맞춰진 패딩마진 */
    /* padding: 18px; */
    width: 100%;
    border-radius: 15px;
    border: none;
    margin-bottom: 18px;
}
#sub_main_contents > .site_type_buttonlist li h3 {
  font-size: 22px;
  font-family: "Moderniz";
  margin-bottom: 9px;
  color: white;
  line-height: 1;
}
#sub_main_contents > .site_type_buttonlist li h4 {
  font-size: 16px;
  margin-bottom: 20px;
  color: white;
}
/* sub main */

/* company_about_section */

#company_about {pointer-events: none;}
#company_about_section {
  padding-top: 0;
}
#company_about_section .company_about_wrapper {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
}
#company_about_section .company_about_images_left {
  width: 43.6vw;
  /* height: 736px; */
  height: 83vh;
  transition: 0.4s;
  background-color: #0e1e31;
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  position: relative;
  margin-right: 7.4vw;
}
#company_about_section .company_about_images_left img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -100px;
}
#company_about_section .company_about_content {
  width: 32.6vw;
  /* opacity: 0;
  transform: translateY(-100%); */

  
}


#company_about_section .company_about_content > h3 {
  line-height: 1.2;
  font-size: 64px;
  margin-bottom: 100px;
  font-family: "KBO-Dia-Gothic-M";
  font-weight: 500;
}
#company_about_section .company_about_content .compony_about_content_unit > h4 {
  font-size: 28px;
  line-height: 34.94px;
  margin-bottom: 10px;
  font-family: 'SUIT';
  font-weight: 700;
}
#company_about_section
  .company_about_content
  .compony_about_content_unit:nth-child(2) {
  margin-bottom: 60px;
}
#company_about_section .company_about_content .compony_about_content_unit > p {
  font-size: 16px;
  line-height: 25px;

  font-family: 'SUIT';
  font-weight: 400;
}
#company_about_section .company_about_content br {
  display: block;
}
/* company_about_section */

/* company_work_process */
#company_work_process {
  width: 100% !important;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 329px;
}
#company_work_process .work_mo{
  display: none;
}
.pin-spacer {
  width: 100% !important;
}
.company_about_list .pin-spacer{
  width: auto !important
}
.company_about_list,
.company_about_list li{
  list-style: none;
}
#main_page_scroll_motion {
  width: 100%;
  height: 100vh;
  position: relative;
}
#main_page_scroll_motion section {
  position: absolute;
  top: 0;
  left: 0;
}
#company_work_process > h2 {
  line-height: 1.2;
  font-size: 64px;
  /* margin-bottom: 60px; */
  opacity: 0;
  transform: translateY(-100px);

  font-family: "KBO-Dia-Gothic-M";
  font-weight: 500;

  position: relative;
  top: -60px;
}
.company_work_process_list {
  width: 881px;
  /* width: 567px; */
  margin-right: 185px;
  position: relative;
  display: flex;
  transform: translateY(-100%);
  opacity: 0;
}
.company_work_process_wrapper {
  width: 100% !important;
  display: flex;
  align-items: center;
  /* justify-content: flex-end; */
}
.company_work_process_list .process_number {
  width: 67px;
  height: 67px;
  border-radius: 50%;
  color: white;
  display: block;
  font-size: 30px;
  text-align: center;
  line-height: 67px;
  background-color: black;
  flex: none;
  font-family: "Moderniz";
  margin-right: 45px;
  transition: 0.4s;
}
.company_work_process_list #process_vertical_bar {
  border: 1px dashed black;
  position: absolute;
  left: 33.5px;
  z-index: 1;
  transition: 0.4s;
  display: none;
}
.company_work_process_list > div > button {
  width: 567px;
  display: flex;
  align-items: center;
  margin-bottom: 50px;
  position: relative;
  z-index: 2;

  pointer-events: none;
}
.company_work_process_list > div > button:last-child {
  margin-bottom: 0;
}
.company_work_process_list > div > button.active {
  align-items: flex-start;
}
.company_work_process_list button h3 {
  line-height: 35px;
  font-size: 28px;
  font-family: "SUIT";
  font-weight: 700;
}
.company_work_process_list button p {
  display: none;
}
.company_work_process_list button.active p {
  display: block;
  margin-top: 24px;
  font-family: "SUIT";
  font-weight: 400;
}
.company_work_process_list button.active .process_number {
  background-color: #d8f30a;
  color: black;
}
.company_work_process_list > h2 {
  font-size: 50px;
  margin-bottom: 0;
}
.company_work_process_img_wrapper {
  /* width: 839px; */
  width: 100%;
  height: 600px;
  background-color: #0e1e31;
  position: relative;
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
  transform: translateX(100%);
  opacity: 0;

  pointer-events: none;
}
.company_work_process_img_wrapper  img {
  transition: 0.4s;
  margin-top: 20px;
  position: absolute;
  top: 50%;
  
  margin-top: 100px;
  opacity: 0;
}
.company_work_process_img_wrapper > img:nth-of-type(1){width: 35vw; transform: translate(-25%, -50%);}
.company_work_process_img_wrapper > img:nth-of-type(2){width: 30vw; transform: translate(-24.5%, -50%);}
.company_work_process_img_wrapper > img:nth-of-type(3){width: 30vw; transform: translate(-18%, -50%);}
.company_work_process_img_wrapper > img:nth-of-type(4){width: 25vw; transform: translate(-17.5%, -50%);}
.company_work_process_img_wrapper > img.active {
  opacity: 1;
  margin-top: 0;
}
/* company_work_process */

/* company_about */
#company_about,
#company_about_mobile {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 329px;

  position: relative;
}

#company_about_mobile {
  display: none;
  padding: 0;
}
#company_about > h2,
#company_about_mobile > h2 {
  line-height: 1.2;
  font-size: 64px;
  margin-bottom: 60px;
  margin-top: 50px;
  opacity: 0;
  font-weight: 500;
  transform: translateY(-100%);

  font-family: "KBO-Dia-Gothic-M";
 


}
#company_about .company_about_list {
  position: relative;
  margin: 0 auto;
  display: flex;
  column-gap: 20px;
  opacity: 0;
}
#company_about_mobile .company_about_list {
  position: relative;
  margin: 0 auto;
  display: flex;
  column-gap: 20px;
}
#company_about_mobile .company_about_list {
  opacity: 1;
  flex-direction: column;
  align-items: center;
}

.company_about_list  li {
  width: 400px;
  /* height: 500px; */
  height: auto;
  flex: none;
  background: radial-gradient(
    124.21% 167.24% at 50% 94.44%,
    #0e1e31 45%,
    #ffffff 100%
  );
  border-radius: 40px;
  color: white;
  padding: 30px 40px;
  box-shadow: 6px 9px 30px 0px #00000040;
  position: relative;
  
}
.company_about_list  li:nth-child(5) {
  opacity: 1;
}
/* 
@keyframes aboutList01 {
  from {
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
  }
  50% {
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.5;
  }
  to {
    left: calc(50% - 490px);
    top: 295px;
    opacity: 1;
  }
}
@keyframes aboutList02 {
  from {
    left: calc(50% + 300px);
    top: 495px;
    opacity: 1;
  }
  50% {
    left: calc(50% + 400px);
    top: 395px;
    opacity: 0.5;
  }
  to {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
  }
}
@keyframes aboutList03 {
  from {
    left: calc(50% + 300px);
    top: 785px;
    opacity: 0;
  }
  50% {
    left: calc(50% + 400px);
    top: 885px;
    opacity: 0.5;
  }
  to {
    left: calc(50% + 490px);
    top: 295px;
    opacity: 1;
  }
}
@keyframes aboutList04 {
  from {
    left: calc(50% - 300px);
    top: 495px;
    opacity: 0;
  }
  50% {
    left: calc(50% - 400px);
    top: 395px;
    opacity: 0.5;
  }
  to {
    left: calc(50% - 490px);
    top: 885px;
    opacity: 1;
  }
}
@keyframes aboutList06 {
  from {
    left: calc(50% - 300px);
    top: 785px;
    opacity: 0;
  }
  50% {
    left: calc(50% - 400px);
    top: 885px;
    opacity: 0.5;
  }
  to {
    left: 50%;
    top: 1180px;
    transform: translateX(-50%);
    opacity: 1;
  }
}
@keyframes aboutList07 {
  from {
    top: 890px;
    opacity: 0;
  }
  50% {
    top: 990px;
    opacity: 0.5;
  }
  to {
    top: 885px;
    left: calc(50% + 490px);
    opacity: 1;
  }
} */
/* 
.company_about_list.scroll_motion > li:nth-child(2) {
  animation: aboutList02 0.8s ease-in-out forwards;
}
.company_about_list.scroll_motion > li:nth-child(3) {
  animation: aboutList03 0.8s ease-in-out forwards;
}
.company_about_list.scroll_motion > li:nth-child(4) {
  animation: aboutList04 0.8s ease-in-out forwards;
}
.company_about_list.scroll_motion > li:nth-child(5) {
  animation: aboutList06 0.8s ease-in-out forwards;
}
.company_about_list.scroll_motion > li:nth-child(7) {
  animation: aboutList0 0.8s ease-in-out forwards;
}
.company_about_list.scroll_motion > li:nth-child(8) {
  animation: aboutList07 0.8s ease-in-out forwards;
} */

.company_about_list  li.company_about_logo {
  display: flex;
  justify-content: center;
  align-items: center;
}
.company_about_list  li  img {
  width: 80px;
  height: 130px;
}
.company_about_list  li.company_about_logo  img {
  width: 271px;
  margin-bottom: 0;
}
.company_about_list  li  h3 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 15px;
  color: white;
}
.company_about_list  li  p {
  font-size: 18px;
  line-height: 1.5;
  font-weight: 400;
  color: white;
}
/* company_about */

/* company_award */
#company_award {
  display: flex;
  margin-top: -1100px;
}
#company_award > h2 {
  margin: 0 190px;
}
/* company_award */

.swiper {
  width: 100%;
  height: 500px;
}
.swiper-slide {

  display: flex;
  font-size: 24px;
}

.award_slide > .award_image_cover {
  width: 258px;
  height: 334px;
  border-radius: 40px;
  overflow: hidden;
  flex-shrink: 0;
}

.award_slide > .award_image_cover > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 40px;
}

.award_slide_contents {
  width: 259px;
  padding: 15px 0px 0 30px;
  height: 250px;
  box-sizing: border-box;
  flex: 1;
}
.award_slide_contents .award_slide_texts{
  margin-bottom: 102px;
}

.award_slide_contents > .award_slide_texts > .award_year {
  font-size: 24px;
  margin-bottom: 9px;
}
.award_slide_contents > .award_slide_texts > h3,
.award_slide_contents > .award_slide_texts > h4 {
  font-size: 18px;
  font-family: 'KBO-Dia-Gothic-M';

}
.award_slide_contents > .award_slide_texts > h4 {
  margin-bottom: 30px;
}
.award_slide_contents > .award_slide_texts > h4 {
  margin-bottom: 30px;
}
.award_slide_contents > .award_slide_texts > .award_organ {
  font-size: 16px;
  font-weight: 500;
  color: #7e7e7e;
}
.award_slide_indicator {
 position: absolute;
 top: 266px;
}
.award_slide_indicator > span {
  font-family: "Moderniz";
  font-size: 34px;
  font-weight: 900;
  margin-top: 20px;
}
.award_slide_indicator > span:last-child {
  color: #a8a8a8;
}
.award_slide_pagenation {
  /* width: 100%; */
  /* width: 990px !important; */
  top: 370px !important;
}
.award_slide_pagenation .swiper-pagination-bullet {
    margin-right: 10px;
    width: 25px;
    height: 25px;
    margin: 0 16px !important;
    border-radius: 999px;
    background-color: #d9d9d9;
    opacity: 1;
    transition: 0.4s ease-in-out;
}
.award_slide_pagenation .swiper-pagination-bullet-active {
  background-color: black;
}

/* company_welfare */
#company_welfare {
  padding: 200px 0 0 170px;
  color: #000000;
}
#company_welfare > h2 {
  font-family: "Moderniz";
  font-size: 64px;
  line-height: 77px;
  margin-bottom: 80px;
}
.company_location {
  display: none;
}
.company_location.mobile {
  display: none;
}

.swiper-button-box {
  display: block;
}
.swiper-button-box.mobile {
  display: none;
}
#company_welfare > .company_welfare_contents {
  display: flex;
}
#company_welfare > .company_welfare_contents .welfare_swiper{margin-right: 16px;}
#company_welfare > .company_welfare_contents > .company_welfare_texts {
  width: 444px;
  margin-right: 91px;
  flex: none;
}
#company_welfare > .company_welfare_contents > .company_welfare_texts > h3 {
  font-size: 38px;
  line-height: 51px;
  font-family: "KBO-Dia-Gothic-M";
  margin-bottom: 50px;
}
#company_welfare > .company_welfare_contents > .company_welfare_texts > p {
  font-family: "SUIT";
  font-weight: 400;
  font-size: 16px;
  line-height: 23px;
}
#company_welfare > .company_welfare_contents > .company_welfare_texts .company_location .title{
  font-family: "SUIT";
  font-weight: 400;
  line-height: 34px;
  font-size: 24px;
}
#company_welfare > .company_welfare_contents > .company_welfare_texts .company_location .sub_title{
  font-size: 24px;
  font-weight: 700;
}
#company_welfare .welfare_swiper .swiper-slide img{border-radius: 20px; overflow: hidden;}

#company_welfare
  > .company_welfare_contents
  > .company_welfare_texts
  .company_location {
  display: flex;
  align-items: center;
  margin-top: 20px;
}
#company_welfare
  > .company_welfare_contents
  > .company_welfare_texts
  .company_location
  > img {
  margin-right: 8px;
}
#company_welfare
  > .company_welfare_contents
  > .company_welfare_texts
  .naver_map_link {
  display: block;
  box-shadow: 9px 14px 20px 0px #00000040;
  padding: 10px 23px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  font-size: 16px;
  width: fit-content;
  font-weight: 500;
  margin-top: 30px;
  transition: 0.4s ease-in-out;
}
#company_welfare
  > .company_welfare_contents
  > .company_welfare_texts
  .naver_map_link:hover {
  background-color: #f2f2f2;
}
#company_welfare
  > .company_welfare_contents
  > .company_welfare_texts
  .naver_map_link
  > img {
  margin-right: 8px;
}

.bottom_buttonBox .swiper-button-box {
  width: auto; margin-top: 0;
  position: absolute;
  right: 100px;
}
.bottom_buttonBox .swiper-button-box .swiper-button-next {transform: rotate(0);}
.bottom_buttonBox .swiper-button-box .swiper-button-next,
.bottom_buttonBox .swiper-button-box .swiper-button-prev{
  background-color: transparent;
  width: 50px;
  height: 50px;
}



.swiper-button-box {
  width: 100%;
  justify-content: flex-end;
  display: flex;
  margin-top: 30px;
}





.swiper-button-box .swiper-button-next,
.swiper-button-box .swiper-button-prev {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #0e1821;
  position: static;
  margin-top: 0 !important;
}
.swiper-button-box .swiper-button-next::after,
.swiper-button-box .swiper-button-prev::after {
  display: none;
}
.swiper-button-box .swiper-button-next {
  transform: rotate(180deg);
  margin-left: 8px;
}
/* company_welfare */




/* company_contact */
#company_contact {
  gap: 100px;
  display: flex;
  width: 100%;
  justify-content: center;
  padding: 200px 0px 0 0px;
}
#company_contact > .company_contact_title > h2 {
  font-family: "Moderniz";
  font-size: 48px;
  margin-bottom: 20px;
}
.company_contact_form_wrapper {
  clip-path: polygon(0 0, 85% 0, 100% 15%, 100% 100%, 0 100%);
}
.company_contact_form {
  background-color: #eceff3;
  border-radius: 30px;
  padding: 34px 44px;
}
.company_contact_form > h3 {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 24px;
}
.company_contact_form label {
  font-size: 14px;
  margin-bottom: 4px;
  padding-left: 11px;
}
.company_contact_form input {
  display: block;
  width: 340px;
  border: none;
  padding: 11px 12px;
  border-radius: 100px;
  outline: none;
  line-height: 25px;
  margin-bottom: 20px;
  transition: 0.4s;
  margin-right: 16px;
}
.company_contact_form input::placeholder {

  font-weight: 300;
  color: #666d80;
  font-size: 16px;
  line-height: 25px;
}
.company_contact_form .project_dec textarea::placeholder {

  font-weight: 300;
  color: #A4ACB9;
  font-size: 16px;
  line-height: 25px;
}
.company_contact_form hr {
  background-color: #d2d2d2;
  border: none;
  width: 100%;
  height: 1px;
  margin-bottom: 20px;
}
.company_contact_form textarea {
  width: 100%;
  height: 90px;
  display: block;
  resize: none;
  border: none;
  outline: none;
  background-color: white;
  border: 1px solid #e7eaf1;
  border-radius: 10px;
  line-height: 25.6px;
  padding: 10px 12px 29px;
  box-sizing: border-box;
  font-family: "Pretendard";
  font-size: 16px;
}

.company_contact_form .input-column > div {
  width: 100%;
}
.company_contact_form .input-column {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.company_contact_form input:focus {
  border-color: 1px solid #8056dc;
}
.file-input-wrapper {
  width: fit-content;
  border: 1px solid #c1c7d0;
  border-radius: 100px;
  padding: 9px 16px;
  margin-top: 50px;
}
.file-input-wrapper button {
  display: flex;
  align-items: center;
  position: relative;
  font-size: 14px;
  line-height: 21.7px;
  cursor: pointer;
}
.file-input-wrapper input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
}
.file-input-wrapper button img {
  margin-right: 8px;
}
.company_contact_submit {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.company_contact_submit > button {
  display: flex;
  align-items: center;
  padding: 14px 24px;
  background-color: #8056dc;
  color: white;
  border-radius: 100px;
}
.company_contact_submit > button div {
  color: #E7E7E7;
}
.company_contact_submit > p {
  font-size: 14px;
  font-weight: 500;
}
.company_contact_submit > button img {
  margin-left: 8px;
}


/* 사이즈가 커질때 깨짐 현상으로 현재 2400기준으로 맞춰진 패딩마진 */
@media (min-width : 2400px){
  #sub_main_contents > .site_type_buttonlist li img {
      padding: 18px;
      width: 100%;
      border-radius: 15px;
      border: none;
      margin-bottom: 22px;
  }
}
/* 2200 이상일 때 */
@media (min-width: 2200px) {
  #sub_main_contents > .site_type_buttonlist  li  h3{
    font-size: 18px;
  }

}
/* 2000 이상 */
@media (min-width: 2000px) {
  #sub_main_contents{
    justify-content: space-between;
  }
  #sub_main_contents > .site_type_buttonlist{
    margin-right: 170px;
  }


}
@media (max-width: 1918px) {
  #sub_main_contents > .site_type_buttonlist  li {
    /* width: 31%; */
    /* min-height: fit-content; */
  }
}
@media (max-width: 1912px) {
  #company_about_section .company_about_content > h3 {
    margin-bottom: 50px;
    line-height: 1.2;
    font-size: 48px;
  }
}
/* company_contact */
@media (max-width: 1800px) {

  .company_contact_form input {
    width: 18vw;
  }

  .award_slide_pagenation {
    width: 100% !important;
  }

  #company_award > h2 {
    margin: 0 9vw 0 13vw;
  }
  #company_about,
  #company_about_mobile {
    padding-left: 14vw;
  }

  .company_about_list > li {
    width: 22vw;
    /* height: 550px; */
  }
  #sub_main_contents > .site_type_buttonlist {
    width: 80%;
  }

  #sub_main_contents > .sub_main_info {
    width: 30%;
  }
  #sub_main_contents > .site_type_buttonlist  li  h3 {
    line-height: 1.3;
  }

  .company_work_process_list {
    margin-right: 15vw;
  }
  #company_work_process {
    padding-left: 14vw;
  }
}
@media (max-width:1650px) {
  .award_slide_indicator > span{
    font-size: 26px;
  }

  #sub_main_contents > .site_type_buttonlist  li  h3{
    font-size: 18px;
  }
}

@media (max-width:1600px) {
  #company_award .swiper-slide {
    flex-shrink: 0 !important;
    margin-right: 30px;

  }

  .award_slide_contents > .award_slide_texts > .award_year{
    font-size: 24px;
  }
  .award_slide_contents > .award_slide_texts > h3, .award_slide_contents > .award_slide_texts > h4 {
    font-size: 16px;
}

}
@media (max-width: 1500px) {
  #sub_main_contents > .site_type_buttonlist li h3{
    font-size: 12px;
  }
}

@media (max-width: 1465px) {

  #sub_main_contents > .site_type_buttonlist  li {
    width: 30%;
    min-height: fit-content;
  }
  .award_slide_indicator > span{
    font-size: 20px;
  }
  .award_slide > .award_image_cover{
    width: 228px;
    height: 304px;
  }

}
@media (max-width:1440px) {
  #company_about_section .company_about_content > h3 {
    margin-bottom: 50px;
    line-height: 1.2;
    font-size: 40px;
  }


}

@media (max-width: 1300px) {
  #main_container > .main_left_contents{
    margin-right: 0;
  }
}
/****** 태블릿 ******/
@media (max-width: 1280px) {



  #fixed_contact_box {
    bottom: 20px;
    right: 20px;
  }

  #fixed_contact_box .contact_button_list {
    padding: 10px;
  }
  #fixed_contact_box .contact_button_list > li > a {
    font-size: 13px;
    row-gap: 15px;
  }
  #fixed_contact_box .contact_button_list > li > a img {
    width: 30px;
  }
  .company_about_list > li.company_about_logo > img {
    width: 50%;
  }
  #main_container {
    height: fit-content;
    flex-direction: column;
    align-items: flex-end;

    padding-bottom: 25px;
  }
  #main_container > .main_left_contents > h2 {
    width: 490px;
    font-size: 42px;
    
    line-height: 50px;
  }
  .main_right_contents {
    padding-right: 0;
    left: 451px;
  }
 
  .main_right_contents > .first_button {
    /* width: 18.2%; */
    /* height: 21.6vh; */

    width: 139px;
    height: 164px;

  }
  #company_work_process br{
    display: none;
  }

  #company_work_process .work_mo{
    display: block;
  }

  /* .more_arrow_wrapper {
    width: 50px;
    height: 50px;
    
  } */

  br {
    /* display: none; */
  }
  #main_container > .main_left_contents {
    /* width: 46.5%; */
    padding-left: 60px;
    margin-right: auto;
  }
  .main_right_contents > button > img:first-child {
    object-fit: cover;
    height: 285px;
  }
  #main_container > .main_left_contents > p {
    width: 490px;

    font-size: 18px;
  }
  .main_right_contents > button {
    border-radius: 20px;
    width: 15vw;
    height: 445px;
    padding: 6.67px 6.67px 20px;


  }
  .main_right_contents .buttonBox p{
    font-size: 20px;
    padding-left: 7px;
    margin-top: 20px;
  }
  .more_arrow_dark_wrapper{
    width: 50px;
    height: 50px;

    position: absolute;
    bottom: 13px;
    left: 13px;

  }
  #sub_main_contents > .site_type_buttonlist{
    margin-right: 0;
  }
  #sub_main_contents > .site_type_buttonlist li {
    width: 45%;
    min-height: 25vw;
    padding: 11px;
  }
  #sub_main_contents > .site_type_buttonlist li img {
    margin-bottom: 15px;
  }
  #sub_main_contents > .site_type_buttonlist.scroll_motion li:nth-child(2n) {
    animation: downMotion 0.4s ease-in-out forwards;
  }
  #sub_main_contents > .site_type_buttonlist.scroll_motion li:nth-child(5) {
    animation: upMotion 0.4s ease-in-out forwards;
  }
  #sub_main_contents > .sub_main_info {
    width: auto;
  }
  /* #sub_main_contents > .sub_main_info > h2 {
    line-height: 60px;
  } */
  #sub_main_contents > .sub_main_info > div:nth-child(2) {
    margin-bottom: 20px;
    padding-bottom: 18px;
    padding-top: 18px;
  }
  .company_about_list.scroll_motion > li {
    padding: 20px;
  }
  #company_about > h2,
  #company_about_mobile > h2 {
    font-size: 40px;
    margin-bottom: 40px;
    font-weight: 500;
    padding-left: 60px;
  }

  .company_about_list {
    padding-left: 60px;
  }
  .company_about_list > li {
    width: 25vw;
    /* height: 508px; */
    height: auto;
  }
  .company_about_list > li > h3 {
    font-size: 24px;
  }
  .company_about_list > li > p {
    font-size: 16px;
  }
  #company_about,
  #company_about_mobile {
    padding-left: 0;
  }
  #company_about_section .company_about_content {
    width: 41.15vw;
  }
  #company_about_section .company_about_content h3 {
    font-size: 38px;
    margin-block-end: 40px;
  }

  #company_work_process {
    padding-left: 60px;
  }
  .company_work_process_list {
    margin-right: 7vw;
  }
  #company_work_process > h2 {
    font-size: 40px;
    margin-bottom: 30px;
    position: absolute;
    top: 0px;
  }
  .company_work_process_img_wrapper{
    height: 100vh;
  }
  .company_work_process_list button h3 {
    font-size: 22px;
  }
  .company_work_process_list button.active p {
    font-size: 16px;
    line-height: 1.3;
    margin-top: 10px;
  }
  .company_work_process_img_wrapper > img {
    width: 45vw;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
  }

  .company_work_process_img_wrapper > img:nth-of-type(1){transform: translate(10%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(2){transform: translate(7.8%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(3){transform: translate(12%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(4){transform: translate(0%, -50%);}
 


  #company_about_section .company_about_images_left img {
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
    width: 50vw;
  }
  .company_work_process_img_wrapper > img:last-child {
    width: 35vw;
  }
  .company_work_process_list > div > button {
    margin-bottom: 36px;
  }
  .company_contact_form{
    width: 100%;
  }
  .company_contact_form input{
    width: 100%;
  }
  .company_contact_form .input-column{
    gap: 10px;
  }
  
  .designe{
    display: none;
  }

  #company_award > h2 {
    margin-left: 60px;
  }
  .award_slide_pagenation {
    width: 100% !important;
  }
  .award_slide_pagenation .swiper-pagination-bullet {
    /* width: 16px; */
  }
  #company_welfare {
    padding-left: 60px;
  }
  #company_welfare h2,
  #company_contact > .company_contact_title > h2 {
    font-size: 44px;
  }
  #company_contact {
    width: 100%;
    gap: 50px;
    padding: 50px 16px 0;
    flex-direction: column;
  }
  .company_contact_form_wrapper {
    padding: 0;
    margin: 0;
  }
  #sub_main_contents > .site_type_buttonlist li h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }
  #sub_main_contents {
    width: 100%;
    justify-content: space-between;
    padding: 60px 60px 250px;
  }
  #sub_main_contents > .site_type_buttonlist {
    /* display: grid; */
    grid-template-columns: repeat(3, 362px); /* 각 열의 너비를 362px로 설정 */
    gap: 22px 20px; /* 세로 및 가로 간격 */
  }
  #company_about_section
    .company_about_content
    .compony_about_content_unit:nth-child(2) {
    margin-bottom: 50px;
  }
  #main_container > .main_left_contents br{
    /* display: none; */
  }
  #main_container > .main_left_contents .main_left_dec br{
    display: none;
  }
  .award_slide_contents .award_slide_texts{
    margin-bottom: 105px;
  }



  /* .swiper-wrapper{left: 50% !important;} */

}


@media (max-width: 1277px) {
  #main_container > .main_left_contents > h2 {
    font-size: 36px;

  }
}

@media (max-width: 1150px) {
  .award_slide_indicator > span{
    font-size: 14px;
  }
  .award_slide_contents > .award_slide_texts > h3, .award_slide_contents > .award_slide_texts > h4 {
    font-size: 12px;
}
  .award_slide_contents > .award_slide_texts > .award_organ{
    font-size: 12px;
  }
  .award_slide_indicator{
    /* position: relative; */
    top: 190px;
  }
  .award_slide > .award_image_cover{
    width: 164px;
    height: 214px;
  }
  .award_slide_contents .award_slide_texts{
    margin-bottom: 30px;
  }
  #sub_main_contents > .site_type_buttonlist li h3 {
    font-size: 16px;
  }

  .company_contact_submit > button {
    padding: 8px 10px;
}
.company_contact_submit > p{
  font-size: 12px;
}
.company_work_process_list{ margin-right: 10vw;}
.company_work_process_list > div > button {
  width: 500px;
}
.company_work_process_img_wrapper > img:nth-of-type(1){width: 33vw; }
.company_work_process_img_wrapper > img:nth-of-type(2){width: 28vw; }
.company_work_process_img_wrapper > img:nth-of-type(3){width: 30vw; }
.company_work_process_img_wrapper > img:nth-of-type(4){width: 30vw; }


}
@media (max-width: 1100px) {
  .main_right_contents > .bottom_buttonBox .first_button{
    width: 170px;
   
  }

  /* .main_right_contents .bottom_buttonBox .first_button a{
    height: 50px;
  } */

  .main_right_contents .bottom_buttonBox .first_button a p{
    font-size: 20px;
  }

  /* .more_arrow_wrapper{
    width: 34px;
    height: 34px;
  } */

  .bottom_buttonBox .swiper-button-box{
    right: 50px;
  }

  .bottom_buttonBox .swiper-button-box .swiper-button-next, .bottom_buttonBox .swiper-button-box .swiper-button-prev{
    /* width: 40px; */
    /* height: 40px; */
  }
  #main_container .swiper-button-box .swiper-button-next img, .swiper-button-box .swiper-button-prev img{
    /* width: 40px; */
  }


  .bottom_buttonBox .swiper-button-box .swiper-button-next img, .bottom_buttonBox .swiper-button-box .swiper-button-prev img{
    /* width: 40px; */
  }

}




@media (max-width: 1030px) {
  #sub_main_contents > .site_type_buttonlist li h3 {
    font-size: 12px;
  }
}
@media (max-width: 945px) {
  .bottom_buttonBox .swiper-button-box .swiper-button-next, .bottom_buttonBox .swiper-button-box .swiper-button-prev{
    width: 40px;
    height: 40px;
  }

  .award_slide_contents{
    padding: 15px 0px 0 20px;
  }
  .award_slide_indicator > span{
    font-size: 10px;
  }
  .company_contact_submit > button{
    padding: 6px 8px;

  }
  .company_contact_submit > button div{
    font-size: 14px;
  }

  .company_work_process_list > div > button{
    width: 500px;
  }
  .company_work_process_list{
    margin-right: 14vw;
  }
  .company_work_process_img_wrapper > img {
    width: 34vw;
  }
  .company_work_process_img_wrapper > img:nth-of-type(1){transform: translate(20%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(2){transform: translate(12.8%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(3){transform: translate(24%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(4){transform: translate(25%, -50%);}
}
@media (max-width: 930px) {
  #sub_main_contents > .sub_main_info{
    margin-right: 60px;
  }
  #sub_main_contents > .site_type_buttonlist  li  h4{
    
    font-size: 14px;
  }

  .company_contact_form{
    padding: 26px 36px;
  }
  .company_contact_submit > button{
    padding: 8px 10px;

  }
  .company_contact_submit > p{
    font-size: 12px;
  }

}
@media (max-width: 900px) {
  #company_about_mobile .company_about_list li{
    position: relative;
  }
  /* .bottom_buttonBox .swiper-button-box{
    display: flex;
    right: 46px;

    transform: translateX(200px);
    animation: slide-in 1s ease-out 1s forwards;
    opacity: 0;

  } */
  .company_about_list > li.company_about_logo {
    top: 0;
  }

  /* .award_slide_contents .award_slide_texts{
    margin-bottom: 60px;
  } */
  .award_slide_indicator{
    position: relative;
    top: 0;
  }
  @keyframes upMotion {
    form {
      transform: translateY(50px);
      opacity: 0;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }

  @keyframes downMotion {
    form {
      transform: translateY(0);
      opacity: 0;
    }
    to {
      transform: translateY(50px);
      opacity: 1;
    }
  }


  .main_right_contents > .first_button{
    flex-shrink: 0;
  }

  .main_right_contents > button {
    width: 31%;
    height: fit-content;
    border-radius: 20px;
    padding-bottom: 16px;
  }
  .first_button.mobile {
  
    width: fit-content;
    display: flex;
    align-items: center;
    padding: 7px 16px;
    margin-right: 60px;
    opacity: 0;
    transform: translateX(200px);
    animation: slide-in 1s ease-out 1s forwards;
  }

  .first_button.mobile {
    animation-delay: 1.7s;
    display: none;
  }
  .more_arrow_wrapper {
    width: 24px;
    height: 24px;
    
  }

  .main_right_contents
  > .bottom_buttonBox button.first_button:hover
  a
  > .more_arrow_wrapper
  > img:last-child {
  width: 24px;
  height: 24px;
}
  .first_button a > p {
    font-size: 18px;
    padding-top: 0;
    margin-bottom: 0;
  }
  .main_right_contents > button > a img:first-child {
    height: 162px;
  }
  .more_arrow_dark_wrapper {
    display: none;
    width: 24px;
    height: 24px;
  }
  .more_arrow_dark_wrapper img {
    width: 80%;
  }
  #main_container {
    justify-content: flex-start;
    height: fit-content;
    align-items: flex-end;
    height: 691px;
    flex-direction: column;
    overflow: hidden;
  }

  #sub_main_contents {
    flex-direction: column;
  }
  #sub_main_contents > .sub_main_info > h2 {
    padding: 32px 9px 29px;
    line-height: 43px;
    font-size: 36px;
    padding-right: 0;
    width: 328px;
    height: 134px;
  }
  #sub_main_contents > .sub_main_info > div:nth-child(2) {
    font-size: 18px;
    line-height: 24px;
  }
  #sub_main_contents > .sub_main_info > #site_type_tablist {
    width: 100%;
    gap: 6px;
    padding-bottom: 40px;
  }
  #sub_main_contents > .sub_main_info > #site_type_tablist > li {
    font-size: 15px;
  }
  #sub_main_contents > .sub_main_info {
    margin: 0;
  }

  #sub_main_contents > .sub_main_info > div:nth-child(2) {
    padding: 10px;
  }
  #sub_main_contents > .site_type_buttonlist{width: auto;}
  #sub_main_contents > .site_type_buttonlist.scroll_motion {
    width: 100%;

    justify-content: space-between;
  }
  #sub_main_contents > .site_type_buttonlist li .more_arrow_wrapper {
    width: 5vw;
    height: 5vw;
  }
  #sub_main_contents > .site_type_buttonlist li {
    width: 46%;
    height: fit-content;
    transform: translateY(50px);
    padding: 10px;
  }

  #sub_main_contents > .site_type_buttonlist li img {
    height: 22vw;
  }
  #sub_main_contents > .site_type_buttonlist li:nth-child(2n) {
    transform: translateY(-50px);
  }
  #company_about_section {
    width: 100%;
    height: 100vh;
    overflow: hidden;
  }
  #company_about_section .company_about_content {
    /* padding: 5.78vh 60px 0; */
    font-size: 2.4vh;
    width: 100%;
    padding: 7vw 5vw 0;
  }
  #company_about_section .company_about_content > h3 {
    font-size: 36px;
    margin-bottom: 4.5vh;
    line-height: 1.2;
  }
  #company_about_section .company_about_wrapper {
    flex-direction: column;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }

  #company_about {
    padding: 0 26px 55px;
    display: none;
  }
  #company_about_mobile {
    margin-top: -3000px;
    height: fit-content;
    display: block;
  }
  #company_about_section .company_about_images_left img {
    width: 42vw;
    right: 5%;
    transform: translate(0, -50%);
  }
  #company_about_section .company_about_content .compony_about_content_unit {
    margin-bottom: 3.7vh;
  }


  #company_about_section
    .company_about_content
    .compony_about_content_unit
    > h4 {
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 1.5vh;
    font-weight: 700;
  }
  #company_about_mobile > h2 {
    font-size: 26px;
    margin-bottom: 4.3vh;
    padding-left: 0;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    opacity: 1;
    margin-top: 20vw;
  }
  #company_about_mobile > h2 br {
    display: block;
  }
  #company_about_mobile .company_about_list {
    padding-left: 0;
  }
  .company_about_list {
    opacity: 0;
  }
  .company_about_list  li  p {
    font-size: 3vw;
  }
  .company_about_list  li  h3 {
    font-size: 4.5vw;
  }
  .company_about_list  li {
    width: 90vw !important;
    height: 370px;
    opacity: 1;
    margin-bottom: 20px;
    padding: 5vw;
    flex: none;

    background: radial-gradient(124.21% 167.24% at 50% 94.44%, #0e1e31 45%, #ffffff 100%);
    border-radius: 40px;
    color: white;

box-shadow: 6px 9px 30px 0px #00000040;

  }
  #company_about_mobile .company_about_list  li {
    height: fit-content;
  }
  .company_about_list.scroll_motion > li {
    padding: 4vh;
    height: fit-content;
  }

  #company_award {
    margin-top: 39px;
    flex-direction: column;
  }
  #company_award > h2 {
    margin: 0 0 40px;
  }
  #company_award > h2 > img {
    width: 220px;
    margin: 0 auto;
    display: block;
  }
  .award_slide_contents > .award_slide_texts > .award_year {
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
  }
  .award_slide_contents > .award_slide_texts > h3,
  .award_slide_contents > .award_slide_texts > h4 {
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
  }
  .award_slide_contents > .award_slide_texts > h4 {
    margin-bottom: 10px;
  }
  .award_slide_contents > .award_slide_texts > .award_organ {
    font-size: 14px;
  }
  .award_slide > .award_image_cover {
    width: 164px;
    height: 214px;
    border-radius: 20px;
  }
  .swiper-slide.award_slide {
    padding: 0 16px;
  }
  .award_slide_contents {
    padding: 30px 10px;
  }
  .award_slide > .award_image_cover > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .swiper {
    height: fit-content;
  }
  .award_slide_pagenation {
    width: 100% !important;
    position: static;
    padding: 0 16px;
    border-radius: 2px;
  }
  #company_welfare {
    padding: 0 16px;
  }
  #company_welfare > .company_welfare_contents {
    flex-direction: column;
  }
  #company_welfare > h2 {
    font-size: 26px;
    line-height: 39px;
    padding: 80px 0 10px;
    margin-bottom: 0;
  }
  #company_welfare > .company_welfare_contents > .company_welfare_texts {
    width: 100%;
    margin-right: 0;
  }
  #company_welfare > .company_welfare_contents > .company_welfare_texts > h3 {
    font-size: 26px;
    line-height: 41px;
    margin-bottom: 10px;
  }
  #company_welfare
    > .company_welfare_contents
    > .company_welfare_texts
    .naver_map_link {
    margin-bottom: 40px;
    padding: 10px;
  }
  #company_welfare
    > .company_welfare_contents
    > .company_welfare_texts
    .company_location {
    margin-top: 10px;
  }
  #company_welfare
    > .company_welfare_contents
    > .company_welfare_texts
    .naver_map_link {
    margin-top: 10px;
    padding: 10px;
  }
  #company_welfare .swiper-slide {
    height: 300px !important;
  }
  .swiper-button-box {
    display: none;
  }
  .swiper-button-box.mobile {
    display: flex;
    justify-content: flex-end;

  }
  #company_welfare .company_welfare_texts .welfare_p br{
    display: none;
  }
  .moBr{display: block;}
  #company_contact .company_contact_title br{
    display: none;
  }
  #company_welfare > .company_welfare_contents > .company_welfare_texts .company_location .title{
    font-size: 16px;
    line-height: 19px;
  }
  #company_welfare > .company_welfare_contents > .company_welfare_texts .company_location .sub_title{
    font-size: 16px;
  }
  .company_location.mobile {
    /* display: flex !important; */
    justify-content: center;
    padding: 10px 30px;
  }
  .company_location.mobile img {
    margin-right: 10px;
  }
  #company_welfare
    > .company_welfare_contents
    > .company_welfare_texts
    .naver_map_link
    > img {
    width: 22px;
    height: 22px;
  }
  #company_welfare .swiper-button-box {
    margin-top: 20px;
    margin-bottom: 65px;
  }
  .swiper-button-box .swiper-button-next,
  .swiper-button-box .swiper-button-prev {
    width: 40px;
    height: 40px;
  }
  /* 어워즈 스와이퍼 버튼 */
  #company_welfare .swiper-button-box .swiper-button-next img{
    width: 22px;
  }
  #company_welfare .swiper-button-box .swiper-button-prev img {
    width: 22px;
  }

  #company_contact {
    width: 100%;
    padding: 0 16px;
    flex-direction: column;
  }
  #company_welfare h2,
  #company_contact > .company_contact_title > h2 {
    font-size: 26px;
  }
  .company_contact_form{
    width: 100%;
  }
  .company_contact_form_wrapper {
    margin-left: 0;
  }
  .company_contact_form {
    margin-top: 30px;
    padding: 34px 24px;
  }
  .company_contact_form > h3 {
    font-size: 26px;
  }
  .company_contact_form .input-column {
    flex-direction: column;
    gap: unset;
  }
  .company_contact_form input {
    width: 100%;
  }
  .company_contact_submit{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .company_contact_submit > p {
    font-size: 12px;
    width: 60%;
  }
  .company_contact_submit > button div {
    font-size: 15px;
  }
  .company_contact_submit > button {
    padding: 8px 13px;
    margin-left: auto;
  }
  .company_work_process_list {
    height: 371px;

    margin-right: 0;
    width: 100%;
    opacity: 0;
  }

  .company_work_process_wrapper {
    flex-direction: column-reverse;
    align-items: flex-end;
  }
  #company_work_process > h2 br {
    display: none;
  }
  .company_work_process_list button h3 {
    font-size: 2.6vh;
  }
  .company_work_process_list #process_button_box {
    width: 100%;
    /* padding: 30px 60px 0; */
    padding: 8vw 16px;
  }

  .company_work_process_list #process_button_box button {
    margin-bottom: 3vh;
    width: 100%;
  }
  .company_work_process_list button .process_number {
    width: 6vw;
    height: 6vw;
    line-height: 7vw;
    font-size: 3.5vw;
    margin-right: 9vw;
  }
  .company_work_process_list #process_button_box button > div:last-child {
    width: 70%;
  }
  #process_vertical_bar {
    display: none;
  }

  .company_work_process_img_wrapper {
    width: calc(75% - 16px);
    height: 32vh;
    opacity: 0;
    margin-top: 30px;
  }

  .company_work_process_img_wrapper img:nth-child(1) {width: 32%; transform: translate(-92%, -50%);}
  .company_work_process_img_wrapper img:nth-child(2) {width: 28%; transform: translate(-115%, -50%);}
  .company_work_process_img_wrapper img:nth-child(3) {width: 26%; transform: translate(-133%, -50%);}
  .company_work_process_img_wrapper img:nth-child(4) {width: 20.5%; transform: translate(-193%, -50%);}
  #main_page_scroll_motion {
    width: 100%;
    overflow: hidden;
  }
  #company_work_process {
    padding-left: 0;
  }

  .swiper-button-box {
    display: none;
  }
  .company_work_process_list button.active p {
    font-size: 16px;
  }
.main_right_contents {
  position: absolute;
  left: 0;
  top: 265px;
  padding: 0;
  margin-left: 16px;
  gap: 10px;

  width: 100%;
  padding: 0 60px;
  justify-content: space-between;
  margin-top: 0;
}



  .EXPERIENCE{
    display: none;
  }

  
  .main_fixed_contact{
    right: 24px;
    width: 40px;
  }
  .main_fixed_contact .scroll_top{
    width: 40px;
    height: 40px;
  }
  .main_fixed_contact .scroll_top > div {
    gap: 10px;
    display: flex;
    margin: 0;
    flex-direction: column;
    align-items: center;
}
  .main_fixed_contact .scroll_top > div > img{
    width: 20px;
    height: 20px;
  }
  .main_fixed_contact .scroll_top > div > p{
    display: none;
  }
  /* .contact_button_list{
    opacity: 0
  } */
  
  .main_fixed_contact .contact_button_list > li > a >div:nth-of-type(1){
    margin: 10px 7.5px 0 7.5px;
  }
  .main_fixed_contact .contact_button_list > li > a >div:nth-of-type(2){
    margin: 0px 7.5px 10px 7.5px;
  }
  .main_fixed_contact .contact_button_list > li > a img{
    width: 20px;
    height: 20px;
  }
  .main_fixed_contact .contact_button_list > li > a >div > p{
    width: 25px;
    font-size: 14px;
    line-height: 1;
  }








  
  .bottom_buttonBox .swiper-button-box{
    display: none;
  }
  #company_award .swiper-slide{
    margin-right: 0;
  }
  .main_right_contents .buttonBox p{
    padding: 0;
    margin: 16px 0 0 0;
  }

  .main_right_contents .buttonBoxWrapper{
    width: 100%; 
    width: calc(100% - 40px);
    /* width: 320px; */
    padding: 0;
    margin-top: 10px;
    margin-left: 0;
    /* overflow: visible; */
  }
  .main_right_contents > .bottom_buttonBox > .first_button{
    display: none;
  }
  .first_button.mobile{
    display: block;
    width: 139px;
    display: flex;
    gap: 16px;
    
  }
  #main_page_scroll_motion{
    /* overflow: visible; */
  }
  #company_about_section{
    overflow: visible;
  }
  .first_button.mobile  .more_arrow_wrapper{
    width: 24px;
    height: 24px;
    
  }
  #cursor{
    display: none;
  }
  .award_slide_contents .award_slide_texts{
    margin-bottom: 50px;
    width: 149px;
  }
  .award_slide_indicator > span{
    font-size: 20px;
  }
  #company_work_process > h2 {

    font-size: 5.1vw;
    padding: 0 16px;
  }
  .company_work_process_img_wrapper img {
    width: 40vw;
    /* transform: translate(10%, -50%); */
  }
  #main_container > .main_left_contents {
    padding: 0 20px;
    /* margin-top: 56px; */
  }
  #main_container > .main_left_contents p br{display: none;}
  #main_container > .main_left_contents > h2 {
    width: auto;
    margin-top: 30px;
    font-size: 20px;
    line-height: 27px;
    padding-right: 0;
  }
  #main_container > .main_left_contents > h2 br:nth-of-type(3){display: none;}
  #main_container > .main_left_contents > p {
    width: auto;
    font-size: 15px;
    line-height: 1.4;
    margin-top: 10px;
  }
  #main_container > .main_left_contents > a > div {
    font-size: 16px;
  }
  #main_container > .main_left_contents > a {
    margin-top: 10px;
    padding: 1.4vw 3.4vw;
  }

  #main_container > .swiper-button-box{
    margin-top: 0;
  }
  #main_container > .swiper-button-box .swiper-button-next{
    transform: rotate(0deg);
  }

  /* 맨위 상단 스와이퍼 */
  #main_container .swiper-button-box .swiper-button-next img, 
  #main_container .swiper-button-box .swiper-button-prev img{
    width: 40px;
    background-color: transparent;
  }

  #main_container > .swiper-button-box.mobile{
    position: absolute;
    right: 20px;
    /* left: 26%; */
    top: 90%;

    opacity: 0;
    transform: translateX(200px);
    animation: slide-in 1s ease-out 1s forwards;
  }
  .main_right_contents{
    position: absolute;
    left: 0;
    top: 265px;
    padding: 0;
    margin-left: 20px;
    gap: 10px;
  
    width: 100%;
    /* padding: 0 60px; */
    justify-content: space-between;
    margin-top: 86px;

    padding:0;
  }


  .main_right_contents .buttonBox > button{
    width: 155px;
    height: 276px;
    padding: 10px 10px 0 10px;
    border-radius: 20px;
    margin: 0 10px 0 0;
  }
  .main_right_contents .buttonBox > button img{
      /* object-fit: contain; */
        /* width: 100%; */
        height: 214px;
        border-radius: 20px;
  }
  .main_right_contents .buttonBox a{
    gap: 0;
  }

  .main_right_contents > button {
    padding: 1.5vw;
    width: 29%;
  }
  .more_arrow_dark_wrapper {display: none;}
  .main_right_contents > button > p {
    font-size: 4vw;
  }
  .main_right_contents > button > img:first-child {
    height: 138px;
  }
  #fixed_contact_box {
    right: 5vw;
  }

  .first_button.mobile br{display: none;}
  .first_button.mobile {
    position: absolute;
    left: 16px;
    top: 90%;
    
    margin-right: 0;
    height: 36px;
    width: 91px;

  }
  #fixed_contact_box .contact_button_list {
    padding: 0;
  }
  #fixed_contact_box #scroll_top,
  #fixed_contact_box .contact_button_list > li > a {
    width: 14vw;
    height: 14vw;
  }
  #fixed_contact_box .contact_button_list > li > a img {
    width: 50%;
  }
  #sub_main_contents {
    padding: 9.5vw 16px 35vw;
  }
  .company_work_process_list button h3 {
    line-height: 27px;
    font-size: 22px;
  }
  .company_work_process_list button.active p {
    font-size: 15px;
  }
  #company_work_process > h2{
    font-size: 26px;
  }
  .company_work_process_img_wrapper > img:nth-of-type(1){transform: translate(-50%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(2){transform: translate(-66%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(3){width: 27vw; transform: translate(-75%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(4){width:  26.5%;  transform: translate(-128%, -50%);}


  #main_container > .main_left_contents > a > img{
    width: 18px;
    height: 16px;
  }
  #sub_main_contents > .sub_main_info > h2 {

    height: 134px;
    font-size: 36px;
    line-height: 1.1;
    padding: 32px 9px 29px;
  }





  #main_container .swiper-button-box.mobile .swiper-button-prev.prevBtn,
  #main_container .swiper-button-box.mobile .swiper-button-prev.nextBtn{
    width: 40px;
    height: 40px;
  }

  .prevBtn{
    background-size: cover;
  }
  .nextBtn{
    background-size: cover;
  }

  #sub_main_contents > .sub_main_info > div:nth-child(2) {
    font-size: 3.7vw;
    line-height: 1.4;
  }
  #sub_main_contents > .site_type_buttonlist li {
    height: 49vw;
    min-height: auto;
  }
  #sub_main_contents > .site_type_buttonlist li h3 {
    font-size: 12px;
    margin-bottom: 1.5vw;
  }
  #sub_main_contents > .site_type_buttonlist li h4 {
    font-size: 3vw;
  }
  #sub_main_contents > .site_type_buttonlist li img {
    height: 25vw;
  }

  #company_about_section .company_about_content > h3 {
    font-size: 26px;
  }
  #company_about_section .company_about_images_left {
    width: calc(100% - 60px);
    margin-top: 20px;
    flex: none;
    width: 85%;
    height: 40vw;
  }

  #company_about_section
    .company_about_content
    .compony_about_content_unit:nth-child(2) {
    margin-bottom: 8vw;
  }

  #company_about_section
    .company_about_content
    .compony_about_content_unit
    > p {
    font-size: 16px;
  }


  
}

@media (max-width: 588px) {
  #company_work_process > h2{
    top: -2vh;
  }
  
  .company_work_process_img_wrapper > img:nth-of-type(1){width:55%;transform: translate(-30%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(2){width: 50%; transform: translate(-36%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(3){width:45%;transform: translate(-50%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(4){width: 40%; transform: translate(-65%, -50%);}
  .company_contact_submit > p {
    width: 100%;
}

.company_work_process_list #process_button_box{
  margin-top: 45px;
}

.company_work_process_list #process_button_box button > div:last-child{
  /* width: 66%; */
  width: 59vw;
}

#company_about_section .company_about_content .compony_about_content_unit:nth-child(3){
  margin-right: 58px;
}

.company_work_process_list button h3{
  font-size: 21px;
}

}

@media (max-width: 370px) {
  #main_container > .main_left_contents > h2 {

    font-size: 18px;

}

#main_container > .main_left_contents > p {
  font-size: 14px;
  
}
}

@media (max-width: 360px) {
  .company_work_process_img_wrapper img{
    width: 70vw;
  }
  .company_work_process_img_wrapper > img:nth-of-type(1){transform: translate(0%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(2){transform: translate(0%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(3){transform: translate(0%, -50%);}
  .company_work_process_img_wrapper > img:nth-of-type(4){transform: translate(-50%, -50%);}




}
@media (max-width: 350px) {
  .company_work_process_list button h3{
    font-size: 18px;
  }
  .company_work_process_list button.active p{
    font-size: 12px;
  }
}



@media (max-height: 665px) {
  .company_work_process_img_wrapper {
    margin-top: 30px;
  }
  .company_work_process_list button .process_number {
    width: 6vw;
    height: 6vw;
    line-height: 6vw;
    font-size: 3vw;
    margin-right: 9vw;
  }
}

@media (max-height: 600px) {
  .company_work_process_img_wrapper {
    margin-top: 0;
  }

  .company_about_list > li > p{
    font-size: 14px;
  }
  .company_about_list.scroll_motion > li{
    padding: 18px;
  }
  .award_slide_contents > .award_slide_texts > h3, .award_slide_contents > .award_slide_texts > h4 {
    font-size: 11px;
  }
}


















/* width 360이상 588이하, height n이상 n이하  */
@media (min-width: 360px) and (max-width: 588px) and (min-height: 600px) and (max-height: 700px) {
  .company_work_process_img_wrapper{
    top: 5vw;
  }
}
@media (min-width: 360px) and (max-width: 588px) and (min-height: 700px) and (max-height: 800px) {
  .company_work_process_img_wrapper{
    top: 0vw;
  }
}
@media (min-width: 360px) and (max-width: 588px) and (min-height: 800px) and (max-height: 900px) {
  .company_work_process_img_wrapper{
    top: -5vw;
  }
}
@media (min-width: 360px) and (max-width: 588px) and (min-height: 900px) and (max-height: 1050px) {
  .company_work_process_img_wrapper{
    top: -15vw;
  }
}
@media (min-width: 360px) and (max-width: 588px) and (min-height: 1050px) and (max-height: 1300px) {
  .company_work_process_img_wrapper{
    top: -30vw;
  }
}



/* 589 ~ 750  세로 600 ~ 1300 */
@media (min-width: 589px) and (max-width: 750px) and (min-height: 600px) and (max-height: 800px) {
  .company_work_process_list button .process_number {
    width: 4vw;
    height: 4vw;
    line-height: 4.5vw;
    font-size: 2vw;
    margin-right: 9vw;
}

.company_work_process_list button h3 {
  line-height: 1.2;
  font-size: 18px;
}

.company_work_process_list button.active p {
  font-size: 14px;
}
.company_work_process_img_wrapper {
  top: 7vw;
}

.company_work_process_list #process_button_box{
  margin-top: 10vh;
}

}


/* 589 ~ 750  세로 800 ~ 1050 */
@media (min-width: 589px) and (max-width: 750px) and (min-height: 800px) and (max-height: 1050px) {
  .company_work_process_list #process_button_box{
    margin-top: 13vh;
  }
}

/* 589 ~ 750  세로 1050 ~ 1300 */
@media (min-width: 589px) and (max-width: 750px) and (min-height: 1050px) and (max-height: 1300px) {
  .company_work_process_img_wrapper{
    margin-top: -200px;
  }
  .company_work_process_list #process_button_box{
    margin-top: 20vh;
  }
}







/* 750 ~ 900  세로 600 ~ 800 */
@media (min-width: 750px) and (max-width: 900px) and (min-height: 600px) and (max-height: 800px) {
  .company_work_process_img_wrapper{
    top: 5vw;
  }
  .company_work_process_list #process_button_box button {
    margin-bottom: 3vh;
    width: 100%;
}

.company_work_process_list #process_button_box {
  margin-top: 8vh;
}

.company_work_process_list button .process_number {
  width: 4vw;
  height: 4vw;
  line-height: 4.5vw;
  font-size: 2vw;
  margin-right: 9vw;
}

.company_work_process_list button h3 {
  line-height: 1.2;
  font-size: 18px;
}

.company_work_process_list button.active p {
  font-size: 14px;
}

}

/* 750 ~ 900  세로 800 ~ 1050 */
@media (min-width: 750px) and (max-width: 900px) and (min-height: 800px) and (max-height: 1050px) {
  .company_work_process_img_wrapper{
    margin-top: 0px;
  }
  .company_work_process_list #process_button_box {
    margin-top: 12vh;
}

}

/* 750 ~ 900  세로 1050 ~ 1300 */
@media (min-width: 750px) and (max-width: 900px) and (min-height: 1050px) and (max-height: 1300px) {
  .company_work_process_img_wrapper{
    margin-top: -150px;
  }

  .company_work_process_list #process_button_box {
    margin-top: 12vh;
}
}

/* 900 ~ 1280  세로 500 ~ 800 */
@media (min-width: 900px) and (max-width: 1280px) and (min-height: 500px) and (max-height: 800px) {

  #company_about_section .company_about_content{
    width: 37vw;
  }
  #company_about_section .company_about_content h3{
    font-size: 28px;
  }
  #company_about_section .company_about_content .compony_about_content_unit > h4{
    font-size: 22px;
  }
  #company_about_section .company_about_content .compony_about_content_unit > p{
    font-size: 12px;
    line-height: 1.5;
  }
  .company_work_process_list button .process_number {
    width: 4vw;
    height: 4vw;
    line-height: 4vw;
    font-size: 2vw;
    margin-right: 4vw;
}

.company_work_process_list button.active p {
  font-size: 12px;
  line-height: 1.3;
  margin-top: 10px;
}

.company_work_process_list > div > button {
  margin-bottom: 24px;
}
.company_work_process_list > div > button{width: 450px}
.company_work_process_img_wrapper > img:nth-of-type(1) {width: 28vw;}
.company_work_process_img_wrapper > img:nth-of-type(2) {width: 23vw;         transform: translate(13.8%, -50%);}
.company_work_process_img_wrapper > img:nth-of-type(3) {width: 25vw; transform: translate(20%, -50%);}
.company_work_process_img_wrapper > img:nth-of-type(4) {width: 25vw;         transform: translate(17%, -50%);}
.company_work_process_list{
  margin-right: 5vw;
  margin-top: 14vh;
}

#footer_container .contact_button_list .top_btn{
  width: 67px;
  height: 67px;
  right: 0%;
}

.main_fixed_contact .contact_button_list > li > .button_wrap >a:nth-of-type(1){margin: 15px 15px 0 15px;}
.main_fixed_contact .contact_button_list > li > .button_wrap >a:nth-of-type(2){margin: 0px 15px 15px 15px;}



.company_about_list{top:-6vh;}
.company_about_list li img{
  width: 70px;
  height: 120px;
}
.company_about_list > li > h3{
  font-size: 22px;
}
.company_about_list > li > p{
  font-size: 12px;
}




}