* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -o-font-smoothing: antialiased;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  word-break: keep-all;
}

.nav_compoenent {
  position: relative;
  z-index: 1;
}
#app {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
}

#news {
  background: #fff;
  display: block;
  position: fixed;
  width: 100%;
  height: 0%;
  left: 0;
  bottom: 0;
  z-index: 10;
  overflow: hidden;
  transition: height 0.5s ease 0.2s;
}

#works {
  background: #fff;
  display: block;
  position: fixed;
  width: 100%;
  height: 0%;
  left: 0;
  bottom: 0;
  z-index: 10;
  overflow: hidden;
  transition: height 0.5s ease 0.2s;
}
#business,
#request {
  background: #fff;
  display: block;
  position: fixed;
  width: 100%;
  height: 0%;
  left: 0;
  bottom: 0;
  z-index: 10;
  overflow: hidden;
  transition: height 0.5s ease 0.2s;
}
#business.active,
#request.active,
#works.active,
#news.active {
  transition: height 0.5s ease 0s;
  height: 100%;
}

#news>img {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  position: absolute;
  left: 0;
  bottom: 0;
  transform: scale(1.3);
  transition: transform 0.5s ease 0s, filter 0.5s ease 0s;
}

#news.active>img {
  transition: transform 5s ease 0s, filter 5s ease 0s;
  transform: scale(1);
  filter: brightness(0.5);
}
#business .wrapper,
#request .wrapper,
#works .wrapper,
#news .wrapper {
  left: 0;
  top: 0;
  overflow-y: scroll;
  /* overflow-x: hidden; */
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

#news .wrapper>div {
  padding: 20vw;
  padding-top: 15vw;
  padding-bottom: 5vw;
  width: 100%;
  opacity: 0;
  transition: padding 0.5s ease 0s, opacity 0.5s ease 0s;
}

#news.active .wrapper>div {
  position: relative;
  transition: padding 1s ease 0.5s, opacity 1s ease 0.5s;
  padding-top: 10vw;
  opacity: 1;
}

#news .wrapper>div>.news_close {
  background: none;
  position: absolute;
  right: calc(20vw + 15px);
  top: calc(10vw + 15px);
  height: auto;
  padding: 0;
  width: 24px;
  height: 22px;
  opacity: 0;
  transition: opacity 1s ease 0.1s;
}

#news.active .wrapper>div>.news_close {
  opacity: 1;
  transition: opacity 1s ease 1s;
}

#news.active .wrapper>div>.news_close svg {
  width: 24px;
  height: 22px;
}

#news .wrapper>div>span {
  padding: 5vw;
  display: block;
  background: #fff;
}

#news p.memo {
  font-size: 18px;
  line-height: 1.6;
}

#news h2 {
  font-family: "Arita";
  line-height: 1.3;
  padding-bottom: 40px;
  font-weight: 500;
}

#news p {
  font-family: "Arita";
}

#works .wrapper>div {
  padding: 10vw;
  padding-top: 15vw;
  padding-bottom: 0;
  width: 100%;
  opacity: 0;
  transition: padding 0.5s ease 0s, opacity 0.5s ease 0s;
}

#works.active .wrapper>div {
  transition: padding 1s ease 0.5s, opacity 1s ease 0.5s;
  padding-top: 5vw;
  opacity: 1;
}

#works .wrapper>div>span {
  position: relative;
  padding: 0vw;
  display: block;
  background: #fff;
}
.test-size-title-small button{
  display: none;
}
#business.active .test-size-title-small button,
#request.active .test-size-title-small button,
#works.active .wrapper>div>span>button {
  position: fixed;
  display: flex;
  align-items: center;
  right: 0px;
  top: 0px;
  padding: 2rem;
  outline: none;
  background: none;
  transition: background .5s ease;
  background: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  border-left: 1px solid rgba(0, 0, 0, 0.2);
}
#business.active .test-size-title-small button svg,
#request.active .test-size-title-small button svg,
#works.active .wrapper>div>span>button svg {
  width: 2rem;
  opacity: 0.7;
  transition: all .5s ease;
}
#business.active .test-size-title-small button:hover svg,
#request.active .test-size-title-small button:hover svg,
#works.active .wrapper>div>span>button:hover svg {
  filter: invert(1);
  opacity: 1;
  transform: rotate(180deg);
}
#business.active .test-size-title-small button:hover,
#request.active .test-size-title-small button:hover,
#works.active .wrapper>div>span>button:hover {
  background: rgb(196, 0, 59);
}

#works .wrapper>div>span h2 {
  margin-bottom: 50px;
  font-size: 5rem;
  font-weight: 500;
}

#works .wrapper ul {
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

#works .wrapper ul>li {
  padding: 0;
  margin: 0;
  width: calc((100% - (40px * 2)) / 3);
  padding-bottom: 3vw;
}

#works .wrapper ul>li h4 {
  font-family: "Arita";
  font-size: 1.2rem;
  font-weight: 600;
  color: #666;
  padding-bottom: 20px;
}

#works .wrapper ul>li p {
  font-family: "Arita";
  font-size: 0.9rem;
  line-height: 1.4;
  font-weight: 400;
  color: #666;
}

#works .wrapper ul>li img {
  height: calc((100vw - (40px * 2) - 20vw - 3rem) / 3);
  margin-bottom: 1.3vw;
}
#business .wrapper>div,
#request .wrapper>div {
  padding: 20vw;
  padding-top: 10vw;
  padding-bottom: 5vw;
  width: 100%;
  opacity: 0;
  transition: padding 0.5s ease 0s, opacity 0.5s ease 0s;
}
#business.active .wrapper>div,
#request.active .wrapper>div {
  transition: padding 1s ease 0.5s, opacity 1s ease 0.5s;
  padding-top: 2vw;
  opacity: 1;
}

#request .wrapper>div>span {
  padding: 5vw;
  display: block;
  background: #fff;
}
.business_list{
  padding:0;
  display: flex;
  flex-wrap: wrap;
  gap:20px;
}
.business_list li{
  padding:0;
  width: calc(33% - 21px / 2);
}
.business_list li img{
  width:100%;
  height:33vh;
  object-fit: cover;
}
.view_area{
  transition: height 1s ease;
}
.view_area h4{
  margin-top: 4vw;
  border-top: 1px solid rgba(0, 0, 0, 0.5);
  padding-bottom: 1vw;
  line-height: 2;
  font-size: 2.5vw;
  font-weight: 500;
}
.view_area .content_img img{
  width:100%;
  border-radius: 5px;
  object-fit: cover;
}
.view_area .content_area{
  padding-bottom: 4vw;
  padding-top: 2vw;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  margin-bottom: 4vw;
}
.view_area .request_go{
  border-radius: 5px;
  line-height: 1;
  padding: 20px 70px;
  font-size: 1.4vw;
  background: rgb(196, 0, 59);
  color: #fff;
  margin-top: 3vw;
  transition: background .5s ease;
}
.view_area .request_go:hover{
  background: #222;
}
.filebox {
  display: flex;
  align-items: center;
}

.filebox .upload-name {
  display: inline-block;
  height: 40px;
  padding: 0 10px;
  vertical-align: middle;
  border: 1px solid rgba(0, 0, 0, 0.25);
  width: 78%;
  color: #999999;
  flex: 1;
}

.filebox label {
  display: inline-block;
  padding: 5px 20px;
  color: #fff;
  vertical-align: middle;
  background-color: #000;
  cursor: pointer;
  height: auto;
  margin-left: 10px;
  margin: 0;
  margin-left: 10px;
  font-family: "Arita";
}

.filebox input[type="file"] {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}

.no_border .text-link_line {
  opacity: 0;
}

.text-link_wrap,
.grid__item-img {
  cursor: pointer;
  transition: filter 1s ease;
}

.copyright {
  text-decoration: none;
}

.copyright .text-link_wrap div {
  font-weight: 600;
  color: rgba(0, 0, 0, 0.5);
  font-size: 1rem;
  letter-spacing: 0;
  font-family: "Arita";
  transition: color 0.5s ease;
}

.nav_menu_list .nav_menu_link:hover .copyright .text-link_wrap div {
  color: #fff;
}

.copyright .text-link_line {
  display: none;
}

.more:hover+.grid__item-img:hover,
.more:hover+.grid__item-img,
.grid__item-img:hover {
  filter: grayscale(1) brightness(1.5);
}

.grid__item-img--large {
  display: none;
}

.section_work h2.grid__item-title {
  padding-bottom: 10px;
  font-size: 1.4rem;
  font-weight: bold;
}

.grid__item-caption {
  padding: 20px 0px;
}

.fullview {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: grid;
  padding: 2rem;
  z-index: 3;
  grid-template-columns: 100%;
  pointer-events: none;
}

.section_clients {
  width: 100vw;
  background: linear-gradient(180deg, #fff 0%, #cdcdcd 100%);
}

.section_clients h2 {
  font-size: 10vh;
  padding-bottom: 6vh;
  color: #c4003b;
}

.section_clients ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
  border-left: 1px solid rgba(0, 0, 0, 0.15);
  margin: 0;
  padding: 0;
}

.section_clients ul li {
  overflow: hidden;
  cursor: pointer;
  filter: grayscale(1);
  mix-blend-mode: multiply;
  opacity: 0.75;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  width: 20%;
  height: 17vh;
  position: relative;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  border-right: 1px solid rgba(0, 0, 0, 0.15);
}

.section_clients ul li:hover {
  opacity: 1;
  filter: grayscale(0);
  transition: filter 0.3s ease, opacity 0.3s ease;
}

.section_clients ul li img {
  max-width: 200px;
  width: 70%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.section_business {
  background: linear-gradient(180deg, #134f40 0%, #1bcb9f 100%);
}

.section_business>.inner {
  padding: 85px 100px;
  box-sizing: border-box;
}

.section_business .title {
  margin-bottom: 15vh;
}

.section_business .title h3 {
  color: #fff;
  font-size: 160px;
  font-weight: 300;
  line-height: normal;
  letter-spacing: -0.05em;
}

.section_business .title p {
  padding-left: 10px;
  color: #fff;
  font-size: 33px;
  font-weight: 400;
  line-height: normal;
}

.section_business ul {
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 50px;
}

.section_business ul li {
  cursor: pointer;
  position: relative;
  padding: 0;
}

.section_business ul li:before {
  position: absolute;
  border-radius: 10px;
  left: -5%;
  top: -5%;
  content: "";
  background: rgba(0, 0, 0, 0.5);
  /* backdrop-filter:blur(3px); */
  width: 110%;
  height: 110%;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s ease 0.3s;
}

.section_business ul li:after {
  opacity: 0;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, 0%);
  content: "프로젝트 의뢰하기";
  border-radius: 5px;
  font-weight: 600;
  text-align: center;
  line-height: 1.2;
  color: #fff;
  background: #c4003b;
  padding: 1rem 3rem;
  z-index: 2;
  transition: transform 0.3s ease 0s, opacity 0.3s ease 0s;
}

.section_business ul li:hover:after {
  transition: transform 0.5s ease 0.3s, opacity 0.5s ease 0.3s;
  transform: translate(-50%, -50%);
  opacity: 1;
}

.section_business ul li:hover:before {
  transition: opacity 0.5s ease 0s;
  opacity: 1;
}

.section_business ul li h4 {
  font-size: 30px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  color: #fff;
}

.section_business ul li div {
  position: relative;
  padding-left: 0px;
  margin-top: 10px;
}

.section_business ul li div img {
  width: 100%;
}

/* .section_business ul li div::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 100%;
  background: #fff;
} */

.slick-vertical .slick-slide {
  height: 60vh;
}

.slick-vertical .slick-slide .item {
  height: 100%;
}

.section_business ul li div p {
  font-family: "Arita";
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  padding-bottom: 1rem;
}
.section_business.t2 ul {
  text-align: center;
    column-gap: 5vw;
}
.section_business ul li div p:last-child {
  padding-bottom: 0;
}

.section_business ul li div p:first-child {
  padding-top: 1rem;
}

.section_business.t2 .title h3 {
    font-size: 130px;
}
.section_business.t2 ul li div img {
    width: 17.5vw;
    height: 24vw;
    object-fit: contain;
}
.section_business.t2 .title {
    margin-bottom: 7vh;
}
.section_business.t2 ul li:after {
    content: "웹아이템 부분의뢰";
}
.section_about {
  position: relative;
  width: 60vw;
  overflow: hidden;
  background-color: #816c51;
}

.section_about .bg {
  position: absolute;
  left: -5%;
  top: -5%;
  width: 110%;
  height: 110%;
  filter: brightness(0.5);
  z-index: 0;
}

.section_about button.slick-arrow {
  width: 5rem;
  height: 5rem;
  background: rgb(196, 0, 59);
  position: absolute;
  z-index: 3;
  top: -5rem;
  font-size: 0;
  left: 0;
  transition: background 0.3s ease;
}

.section_about button.slick-arrow:hover {
  background-color: #fff;
}

.section_about button.slick-arrow:after {
  content: url("../images/main/arrow_up.svg");
  width: 24px;
  height: 24px;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: filter 0.3s ease;
}

.section_about button.slick-arrow:hover:after {
  filter: invert(1);
}

.section_about button.slick-prev {
  left: 5.5rem;
}

.section_about button.slick-prev:after {
  transform: translate(-50%, -50%) rotate(180deg);
}

.section_about .bg>div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: cover;
  opacity: 0;
  transition: opacity 1s ease;
}

.section_about .bg>div.active {
  opacity: 1;
}

.section_about .bg>div.i0 {
  background-image: url("../images/main/i1.png");
}

.section_about .bg>div.i1 {
  background-image: url("../images/main/i2.png");
}

.section_about .bg>div.i2 {
  background-image: url("../images/main/i3.jpg");
}

.section_about .slick {
  z-index: 2;
}

.section_about * {
  font-family: "Arita";
  color: #fff;
}

.section_about h4 {
  letter-spacing: -0.05em;
  font-size: 7rem;
  font-weight: 800;
  line-height: 1.1;
  padding-bottom: 3rem;
}

.section_about p {
  font-size: 1.5rem;
  font-weight: 500;
}

.section_about .flex {
  flex-direction: column;
  justify-content: center;
}

.section_request {
  min-width: 800px;
  width: 50vw;
  background-color: #cd313a;
}

.section_request * {
  color: #fff;
  text-align: center;
}

.section_request .flex {
  flex-direction: column;
  justify-content: space-between;
}

.section_request .flex .title {
  padding-top: 5vh;
  font-size: 32px;
  position: relative;
}

.section_request .flex .title:after {
  content: "";
  height: 2px;
  width: 120px;
  bottom: -15px;
  display: inline-block;
  position: absolute;
  left: calc(50% - 60px);
  background: #fff500;
}

.section_request .flex h2 {
  font-weight: 800;
  font-size: 120px;
  letter-spacing: -0.03em;
  line-height: 1;
  transition: color 0.5s ease;
}

.section_request .flex h2>span {
  cursor: pointer;
  font-weight: 100;
  font-size: 120px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1;
  transition: color 0.5s ease;
}

.section_request .flex h2>span {
  position: relative;
  font-weight: 100;
  font-size: 120px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1;
  margin-bottom: 5vh;
}

/* .section_request .flex h2:hover{
color:#2b97c6;
}
.section_request .flex h2:hover>span{
color:rgba(42, 151, 198,0.5);
} */
.section_request .flex h2>span>svg {
  position: absolute;
  left: 50%;
  top: 66%;
  object-fit: contain;
  transform: translate(-50%, -50%);
  height: 50vh;
  width: 120%;
  max-width: 120%;
}

.section_request .flex h2>span #path_stroke {
  transition: stroke 0.5s ease;
}

.section_request .flex h2:hover>span #path_stroke {
  stroke: #fff;
}

.section_request .flex .btn {
  cursor: pointer;
  font-size: 34px;
  display: inline-block;
  line-height: 1;
  color: #222;
  font-weight: 600;
  /* border-radius: 34px; */
  width: 500px;
  padding: 20px 140px;
  background: url("../images/main/btn_bg1.png") center center no-repeat;
  background-size: cover;
}

.section_request .flex center {
  padding-bottom: 10rem;
}

.section_request .test-size-title-small {
  padding-bottom: 1rem;
}

#request .test-size-title-small {
  position: relative;
  font-size: 6rem;

  padding-bottom: 8rem;

  color: #c4003b;
}


#request .forms button {
  background: rgb(196, 0, 59);
  /* border-radius: 3rem; */
  line-height: 1;
  color: #fff;
  padding: 1vw 4vw 1vw;
  text-align: center;
  font-size: 2rem;
  font-weight: 500;
  width: 45vw;
  letter-spacing: -0.03em;
  transition: background 0.3s ease;
}

#request .forms button:hover {
  background: #222;
}

#request .forms .sel_box,
#request .forms .sel_box span {
  cursor: pointer;
  position: relative;
  line-height: 30px;
  display: inline-block;
  margin-bottom: 80px;
}

#request .forms .sel_box span *,
#request .forms .sel_box span {
  cursor: pointer;
  margin-bottom: 2px;
}

#request .forms .sel_box span input[type="radio"],
#request .forms .sel_box span input[type="checkbox"] {
  opacity: 0;
  background: Red;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

#request .forms .sel_box span textarea {
  width: 45vw;
}

#request .forms .sel_box span input[type="text"] {
  width: 45vw;
}

#request .forms .sel_box span textarea,
#request .forms .sel_box span input[type="text"],
#request .forms .sel_box span input+label {
  font-size: 1.3rem;
  line-height: 2;
  color: #222;
  padding: 0.5rem 2rem;
  border: 1px solid rgba(0, 0, 0, 0.25);
  /* border-radius: 2rem; */
  /* transition: all .3s ease; */
}

#request .forms .sel_box span textarea:focus,
#request .forms .sel_box span input:focus {
  outline: none !important;
  border-color: rgb(196, 0, 59);
}

#request .forms .sel_box span input[type="radio"]:checked+label,
#request .forms .sel_box span input[type="checkbox"]:checked+label {
  background: rgb(196, 0, 59);
  color: #fff;
}

.root_daum_roughmap {
  width: 50vw !important;
  height: 100vh !important;
  position: relative;
}

.root_daum_roughmap .wrap_map {
  width: 100% !important;
  height: 100% !important;
}

.root_daum_roughmap .wrap_map .map>div:first-child>div>div:nth-of-type(1),
.root_daum_roughmap .wrap_map .map>div:first-child>div>div:nth-of-type(2) {
  filter: grayscale(1) brightness(0.5);
}

.root_daum_roughmap .wrap_map .map>div:nth-of-type(2),
.root_daum_roughmap .wrap_map .wrap_btn_zoom {
  display: none;
}

.root_daum_roughmap .wrap_map .map>div:first-child>div>div:last-child {
  filter: hue-rotate(34deg);
}

.root_daum_roughmap .wrap_map img[role="presentation"] {
  filter: hue-rotate(90deg);
}

.section_contact {
  width: 100vw;
  background: #222;
}

.section_contact * {
  color: #fff;
  /* font-family: "Arita"; */
}

.section_contact a {
  transition: color 0.3s ease;
}

.section_contact a:hover {
  color: #1bcb9f;
}

.section_contact .flex {
  flex-wrap: wrap;
  align-items: center;
}

.section_contact .flex>* {
  width: 50%;
  height: 100%;
  overflow: hidden;
}

.section_contact .map {
  position: relative;
  pointer-events: none;
}

.section_contact .flex>.info {
  display: inline-flex;
  justify-content: center;
}

.section_contact .flex>.info ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
}

.section_contact ul li {
  margin-bottom: 1.5vw;
}

.section_contact ul li:last-child {
  margin-bottom: 0;
}

.section_contact ul li h5,
.section_contact ul li p {
  font-size: 1.5vw;
}

.section_contact ul li h5 {
  color: rgba(255, 255, 255, 0.35);
  margin-bottom: 3px;
}

.section_contact ul li p {
  line-height: 1.3;
}

.section_contact ul li:first-child p {
  color: #c4003b;
}

.fullview__item {
  pointer-events: none;
}

.section_request h3 {
  font-size: 1.5vw;
}

.section_request .cta_title-wrap:nth-of-type(n + 2) {
  padding-top: 2rem;
  margin-bottom: 0.3rem;
}

.fullview__item-subtitle {
  font-family: "Arita";
  color: #fff;
  font-size: 1.5rem;
  font-weight: 300;
  max-width: 50vw;
  position: absolute;
  left: 50px;
  opacity: 0;
  bottom: 50px;
  z-index: 1;
  align-self: end;
  line-height: 1.4;
  letter-spacing: -0.03em;
}

.fullview__item--current {
  pointer-events: auto;
}

.fullview__item-title {
  color: #fff;
  margin: 0 0 0 0.25rem;
  line-height: 1;
  font-size: 4rem;
  font-weight: 400;
  opacity: 0;
  align-self: end;
}

.fullview__item-btn {
  /* font-family: "Arita"; */
  color: #fff;
  font-size: 1.5rem;
  max-width: 50vw;
  position: absolute;
  right: 50px;
  opacity: 0;
  bottom: 50px;
  z-index: 1;
  background: #c4003b;
  padding: 0.3rem 1rem;
  border-radius: 0.3rem;
}

.fullview__close {
  position: fixed;
  top: 2rem;
  right: 2rem;
  z-index: 1000;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  color: #fff;
  cursor: pointer;
  pointer-events: none;
  opacity: 0;
}

.fullview__item--current~.fullview__close {
  pointer-events: auto;
}

.fullview__close:focus {
  outline: none;
}

.fullview__close svg {
  fill: currentColor;
}

@media screen and (max-width: 767px) {

  .hero_heading.small>.line,
  .hero_heading.small {
    text-align: left !important;
  }

  .fullview__item-title {
    font-size: 1.5rem;
  }

  .fullview__close {
    position: fixed;
    top: 1.5rem;
    right: 1rem;
  }

  .fullview {
    padding: 1.5rem 1rem;
  }

  .fullview__item-subtitle {
    font-size: 0.85rem;
    max-width: calc(100% - 3rem);
    left: 1rem;
    bottom: 1.5rem;
  }

  #app canvas {
    filter: brightness(0.75);
  }
}

html:not(.w-editor) .loader_component {
  display: block;
  display: none;
}

::-webkit-scrollbar {
  display: none;
}

body {
  overflow: hidden;
}

body.scroller {
  overflow: inherit;
}

.hero_sub-text-wrap .line {
  overflow: hidden;
}

/* Focus state style for keyboard navigation for the focusable elements */

*[tabindex]:focus-visible,
input[type="file"]:focus-visible {
  outline: 0.125rem solid #4d65ff;
  outline-offset: 0.125rem;
}

/* Get rid of top margin on first element in any rich text element */

.w-richtext> :not(div):first-child,
.w-richtext>div:first-child> :first-child {
  margin-top: 0 !important;
}

/* Get rid of bottom margin on last element in any rich text element */

.w-richtext> :last-child,
.w-richtext ol li:last-child,
.w-richtext ul li:last-child {
  margin-bottom: 0 !important;
}

/* Prevent all click and hover interaction with an element */

.pointer-events-off {
  pointer-events: none;
}

/* Enables all click and hover interaction with an element */

.pointer-events-on {
  pointer-events: auto;
}

/* Create a class of .div-square which maintains a 1:1 dimension of a div */

.div-square::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/* Make sure containers never lose their center alignment */

.container-medium,
.container-small,
.container-large {
  margin-right: auto !important;
  margin-left: auto !important;
}

/*
Make the following elements inherit typography styles from the parent and not have hardcoded values.
Important: You will not be able to style for example "All Links" in Designer with this CSS applied.
Uncomment this CSS to use it in the project. Leave this message for future hand-off.
*/

a,
.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-dropdown-link {
  color: inherit;
  text-decoration: inherit;
  font-size: inherit;
}

/* Apply "..." after 3 lines of text */

.text-style-3lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* Apply "..." after 2 lines of text */

.text-style-2lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* Adds inline flex display */

.display-inlineflex {
  display: inline-flex;
}

/* These classes are never overwritten */

.hide {
  display: none !important;
}

@media screen and (max-width: 991px) {

  .hide,
  .hide-tablet {
    display: none !important;
  }

  #works .wrapper ul>li {
    width: calc((100% - (40px * 1)) / 2);
  }

  #works .wrapper ul>li img {
    height: calc((100vw - (40px * 1) - 20vw) / 2);
  }
}

@media screen and (max-width: 767px) {

  .section_about,
  .section_clients,
  .section_request {
    width: 100%;
    min-width: 100%;
  }

  .section_clients .padding-section-medium,
  .section_about .padding-section-medium {
    height: 100% !important;
  }

  .section_about,
  .section_clients {
    height: 100vh;
  }

  .section_clients h2 {
    font-size: 3.25rem;
    padding-bottom: 13vw;
    font-weight: 400;
  }

  .section_clients ul li {
    width: calc(100% / 3);
    height: 12vh;
  }

  .section_clients ul li img {
    width: 100%;
  }

  .section_clients ul li:hover {
    opacity: 0.75;
    filter: grayscale(1);
  }

  .section_about h4 {
    font-size: 14vw;
    padding-bottom: 5vw;
  }

  .section_about p {
    font-size: 4vw;
  }

  .section_about button.slick-prev {
    left: 16vw;
  }

  .section_about button.slick-arrow {
    width: 15vw;
    height: 15vw;
    top: -15vw;
  }

  .slick-vertical .slick-slide {
    height: 50vh;
  }

  .fullview__item-btn {
    /* color: #fff;
    font-size: 1.5rem; */
    padding: 1rem 0rem;
    right: auto;
    width: 80%;
    text-align: center;
    max-width: 100vw;
    bottom: auto;
    left: 50%;
    background: rgba(0, 0, 0, 0.05);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .hide-mobile-landscape {
    display: none !important;
  }

  .section_request .padding-global {
    min-height: 60vh;
    display: flex;
    align-items: center;
  }

  .section_business .title p {
    padding-left: 0;
  }

  #news .wrapper>div {
    padding: 5vw;
  }

  #works .wrapper>div {
    padding: 1rem;
  }

  #works .wrapper ul>li {
    width: 100%;
    padding-bottom: 20vw;
  }

  #works .wrapper ul>li h4 {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }

  #works .wrapper ul>li img {
    height: auto;
  }

  #works .wrapper>div>span h2 {
    margin-bottom: 20vw;
    font-size: 15vw;
  }
}

@media screen and (max-width: 479px) {
  .hide-mobile {
    display: none !important;
  }
}

.margin-0 {
  margin: 0rem !important;
}

.padding-0 {
  padding: 0rem !important;
}

.spacing-clean {
  padding: 0rem !important;
  margin: 0rem !important;
}

.margin-top {
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}

.padding-top {
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}

.margin-right {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}

.padding-right {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}

.margin-bottom {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}

.padding-bottom {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}

.margin-left {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
}

.padding-left {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
}

.margin-horizontal {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}

.padding-horizontal {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}

.margin-vertical {
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}

.padding-vertical {
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}

/* Apply "..." at 100% width */

.truncate-width {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Removes native scrollbar */

.no-scrollbar {
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

html {
  font-size: calc(0.5rem + 0.41666666666666663vw);
}

@media screen and (max-width: 1920px) {
  html {
    font-size: calc(0.49999999999999994rem + 0.41666666666666674vw);
  }
}

@media screen and (max-width: 1440px) {
  html {
    font-size: calc(0.6875rem + 0.20833333333333331vw);
  }
}

@media screen and (max-width: 960px) {
  html {
    font-size: 0.875rem;
  }
}

@media screen and (max-width: 720px) {
  html {
    font-size: 1rem;
  }
}

@media screen and (max-width: 479px) {
  html {
    font-size: 1rem;
  }
}

@media screen and (min-width: 768px) {
  .section_hero {
    width: calc(100vw - 3rem);
  }
}

@media screen and (max-width: 768px) {
  .section_articles .text-link_line {
    background-color: #fff;
  }
}

/* ================================================================ */
@media screen and (min-width: 641px) and (max-height: 950px) {
  .section_business .title h3 {
    font-size: 140px;
  }

  .section_business .title p {
    font-size: 29px;
  }

  .section_business .title {
    margin-bottom: 10vh;
  }

  .section_business ul li h4 {
    font-size: 50px;
  }

  .section_business ul li div p {
    font-size: 17px;
    line-height: 1.8;
  }
}

@media screen and (max-width: 1600px) {
  .section_business>.inner {
    padding: 75px 50px;
  }

  .section_business .title h3 {
    font-size: 14vw;
  }

  .section_business .title p {
    font-size: 3vw;
  }

  .section_business ul {
    column-gap: 4vw;
  }

  .section_business ul li h4 {
    font-size: 4.5vw;
  }

  .section_business ul li div p {
    font-size: 1.3vw;
  }
}

@media screen and (max-width: 1400px) {
  #request .wrapper>div {
    padding: 15vw;
    padding-top: 10vw;
    padding-bottom: 5vw;
  }
}

@media screen and (max-width: 1280px) {
  .section_business>.inner {
    padding: 50px 40px;
  }

  #news .wrapper>div {
    padding: 10vw;
  }

  #news .wrapper>div>.news_close {
    right: calc(10vw + 15px);
    top: calc(10vw + 15px);
  }
}

@media screen and (max-width: 1024px) {
  .section_business {
    display: flex;
    align-items: center;
  }

  .section_business .title {
    margin-bottom: 10vh;
  }

  .section_business ul {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 0;
    row-gap: 30px;
  }

  .section_business ul li h4 {
    font-size: 5vw;
  }

  .section_business ul li div p {
    font-size: 1.8vw;
  }

  .section_business .title {
    margin-bottom: 4vh;
  }

  #request .wrapper>div {
    padding: 10vw;
    padding-top: 10vw;
    padding-bottom: 5vw;
  }

  #request .wrapper>div {
    padding: 5vw;
    padding-top: 10vw;
    padding-bottom: 5vw;
  }
}

@media screen and (max-width: 767px) {
  .section_business>.inner {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .section_business .title h3 {
    font-size: 13vw;
    text-align: center;
    margin-bottom: 10px;
  }
  .section_business.t2 .title h3 {
      font-size: 16vw;
      line-height: 1;
  }
  .section_business.t2 ul li div img {
    width: 60vw;
    height: 66vw;
  }
  .section_business.t2 ul li{
    margin-bottom:4rem;
    padding: 0rem;
  }
  .section_business ul li div::before {
    background: rgba(255, 255, 255, 0.5);
  }

  .work_card[data-more="y"] .work_card-content {
    display: none;
  }

  .section_business .title p {
    text-align: center;
    font-size: 15px;
  }

  .section_business .title p br {
    display: none;
  }

  .section_business ul li h4 {
    font-size: 8vw;
    font-weight: 900;
  }

  .section_business ul li div {
    position: relative;
    padding-left: 1.2rem;
  }

  .section_business ul li div p {
    font-size: 1rem;
  }

  .section_business .title {
    margin-bottom: 70px;
  }

  .section_business ul {
    grid-template-columns: repeat(1, 1fr);
    column-gap: 0;
    row-gap: 30px;
  }

  .section_request .flex .title {
    padding-top: 0;
    font-size: 19px;
    position: relative;
    text-align: left;
    width: max-content;
  }

  .section_request .flex .title:after {
    content: "";
    height: 1px;
    width: 100%;
    bottom: -10px;
    display: inline-block;
    position: absolute;
    left: 0;
    background: #fff500;
  }

  .section_request .flex h2 {
    font-size: 17vw;
    margin-top: 60px;
  }

  .section_request .flex h2>span {
    font-size: 17vw;
    margin-bottom: 5vh;
  }

  .section_request .flex .btn {
    font-size: 28px;
    width: 100%;
    padding: 20px;
    margin-top: 70px;
  }

  .section_request .flex center {
    padding-bottom: 20px;
    width: 100%;
  }

  #request .test-size-title-small {
    font-size: 3rem;
    padding-bottom: 4rem;
  }

  h3 {
    font-size: 1.2rem;
  }

  #request .forms .sel_box span textarea,
  #request .forms .sel_box span input[type="text"],
  #request .forms .sel_box span input+label {
    font-size: 1rem;
    padding: 0.125rem 0.5rem;
  }

  .cta_title-wrap {
    margin-bottom: 0.75rem;
  }

  #request .forms .sel_box span input[type="text"] {
    width: max-content;
  }

  #request .forms .sel_box span textarea {
    width: 100%;
  }

  #request .forms .sel_box {
    margin-bottom: 40px;
  }

  #request .forms .sel_box,
  #request .forms .sel_box span {
    width: 100%;
  }

  #request .forms .sel_box span input[type="text"] {
    width: 100%;
  }

  #request .forms button {
    width: 100%;
    line-height: 1;
    padding: 4vw 2vw 4vw;
    margin: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    font-size: 22px;
  }

  #request .wrapper>div,
  #request.active .wrapper>div {
    padding: 50px 5vw;
  }

  .articles_list {
    display: grid;
  }

  .articles_colum:nth-child(n + 4) {
    display: none;
  }

  .section_articles>.padding-section-medium {
    padding-top: 0;
  }

  #request .forms .sel_box:nth-child(2) span,
  #request .forms .sel_box:nth-child(10) span {
    width: max-content;
  }

  .section_contact .flex>.info {
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    padding-left: 0;
    padding: 0% 5%;
    box-sizing: border-box;
  }

  .section_contact .flex>* {
    width: 100%;
    height: 50vh;
    overflow: hidden;
  }

  .root_daum_roughmap {
    width: 100vw !important;
    height: 50vh !important;
  }

  .section_contact ul li h5,
  .section_contact ul li p {
    font-size: 3vw;
  }

  #news .wrapper>div {
    padding: 5vw;
  }

  #news .wrapper>div>.news_close {
    right: calc(5vw + 10px);
    top: calc(10vw + 10px);
  }

  #news h2 {
    font-size: 20px;
    padding-right: 0;
    padding-top: 40px;
  }

  .section_articles .test-size-title-small {
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 5px;
  }

  #works .wrapper>div>span>button {
    background: none;
    position: absolute;
    right: 0;
    top: 10px;
    outline: none;
  }

  #request .test-size-title-small button {
    position: absolute;
    top: 10px;
    right: 10px;
    background: none;
    /* width: 24px;
    height: 22px; */
    margin: 0;
    padding: 0;
    font-size: 0;
  }

  #request .wrapper,
  #works .wrapper,
  #news .wrapper {
    overflow-x: hidden;
  }

  #request .forms>.text-link_wrap {
    font-size: 0;
  }
}

@media screen and (max-width: 640px) {

  .section_contact ul li h5,
  .section_contact ul li p {
    font-size: 15px;
  }

  .section_contact ul li {
    margin-bottom: 15px;
  }
}

@media screen and (max-width : 768px) {

  .copyright,
  .nav_bottom-progress,
  .nav_top-logo {
    display: none;
  }

  .nav_bar {
    min-width: 100%;
    width: 100%;
    border-left: 1px solid rgba(0, 0, 0, 0.25);
    padding: 1.2rem 0.5rem;
    background-color: transparent;
    top: 0%;
    bottom: inherit;
    left: 0%;
    right: inherit;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    transition: background .5s ease;
  }


  .nav_icon {
    width: 1rem;
    height: 2.1875rem;
    transform: rotate(90deg);
  }

  .nav_trigger {
    width: calc(100% - 1.5rem);
    flex-direction: row-reverse;
    justify-content: inherit;
  }

  .nav_icon-line {
    background-color: #fff;
  }

  .nav_logo-wrap {
    z-index: 1000;
  }

  .nav_menu_wrap {
    z-index: 2;
    width: 100%;
    height: 100%;
    margin-right: 0rem;
    bottom: inherit;
    left: 0;
    right: inherit;

  }

  .nav_menu_list {
    height: 100%;
    overflow: hidden;
  }

  .nav_menu_link,
  .nav_menu_link.is-25,
  .nav_menu_link.is-75,
  .nav_menu_link.is-50 {
    width: 50%;
    height: 50%;
  }

  .nav_menu_component {
    display: block;
  }

  .nav_menu_link img {
    opacity: 1;
    z-index: 1;
  }

  .nav_menu_link {
    font-size: 1.3rem;
    line-height: 1.3;
    letter-spacing: -0.05em;
  }

  .nav_menu_link .love {
    color: #fff;
    z-index: 3;
    position: relative;
    width: 100%;
    display: block;
    font-size: 1.3rem;
    letter-spacing: -0.05em;
  }

  .nav_menu_link .love span {
    display: block;
  }

  .nav_menu_close-trigger {
    display: none;
  }

  .nav_menu_link {

    top: 0%;
    left: 50%;
    border: 0;
  }

  .nav_menu_link.is-25 {
    left: 50%;
    top: 50%;

  }

  .nav_menu_link.is-50 {
    left: 0%;
    top: 50%;
    transition: top .3s ease 0s, left .3s ease 0s;
  }

  .nav_menu_link.is-75 {
    left: 0;
    right: inherit;
  }

  .nav_compoenent {
    width: 100%;
    position: fixed;
    transition: transform .5s ease;

  }

  .nav_compoenent.scrolled {
    transition: transform .5s ease;
    transform: translateY(-75px);
  }

  .nav_bar.clicked {
    background-color: rgba(0, 0, 0, 0.5) !important;
  }
}