/* screen - work-4 */

.work-4 {
  align-items: flex-start;
  background-color: var(--cod-gray);
  display: flex;
  overflow: hidden;
  width: 1920px;
}

.work-4 .overlap-group4 {
  height: 14349px;
  position: relative;
  width: 2267px;
  z-index: 1;
}

.work-4 .rectangle-3480348 {
  height: 14349px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1920px;
}

.work-4 .x4-1 {
  height: 1090px;
  left: 85px;
  object-fit: cover;
  position: absolute;
  top: 3449px;
  width: 1743px;
}

.work-4 .group-1171278901 {
  align-items: flex-start;
  display: flex;
  height: 311px;
  left: 0;
  min-width: 1920px;
  position: absolute;
  top: 14038px;
}

.work-4 .group-container {
  height: 311px;
  position: relative;
  width: 1920px;
}

.work-4 .overlap-group {
  align-items: flex-start;
  background-color: var(--onyx);
  border-radius: 68.77px;
  display: flex;
  height: 138px;
  justify-content: flex-end;
  min-width: 138px;
  padding: 31.7px 2.5px;
}

.work-4 .title {
  line-height: normal;
  min-height: 74px;
  white-space: nowrap;
}

.work-4 .span0 {
  letter-spacing: -5.01px;
}

.work-4 .span1 {
  letter-spacing: -4.17px;
}

.work-4 .span2 {
  letter-spacing: -3.34px;
}

.work-4 .text-36 {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 125px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .text-35 {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 52px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .flex-col {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  min-height: 134px;
  width: 133px;
}

.work-4 .place {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 76px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .instagram {
  letter-spacing: 0;
  line-height: 30px;
  margin-top: 14px;
  min-width: 92px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .phone-number {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 133px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .e-mail {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 58px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .flex-col-1 {
  align-items: flex-start;
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  margin-left: 54px;
  min-height: 90px;
  width: 231px;
}

.work-4 .ido0000 {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 96px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .phone {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 137px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .doyoung0430khuackr {
  letter-spacing: 0;
  line-height: 30px;
  min-width: 231px;
  text-align: justify;
  white-space: nowrap;
}

.work-4 .x127199233_0010-1 {
  height: 1099px;
  left: 92px;
  position: absolute;
  top: 143px;
  width: 1736px;
}

.work-4 .group-1171278903 {
  height: 815px;
  left: 92px;
  position: absolute;
  top: 4930px;
  width: 1736px;
}

.work-4 .text-37 {
  left: 539px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 1700px;
  width: 841px;
}

.work-4 .story-board {
  left: 903px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 3358px;
  white-space: nowrap;
}

.work-4 .still-image {
  left: 910px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 4842px;
  white-space: nowrap;
}

.work-4 .style-frame {
  left: 903px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 6051px;
  white-space: nowrap;
}

.work-4 .mood-board {
  left: 901px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 10213px;
  white-space: nowrap;
}

.work-4 .process {
  left: 920px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 11559px;
  white-space: nowrap;
}

.work-4 .referance {
  left: 911px;
  letter-spacing: 0;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 8986px;
  white-space: nowrap;
}

.work-4 .image-80-1 {
  height: 112px;
  left: 694px;
  top: 1520px;
  width: 533px;
}

.work-4 .image-80-2 {
  height: 42px;
  left: 221px;
  top: 2338px;
  width: 202px;
}

.work-4 .x2_-_-1 {
  height: 1095px;
  left: 663px;
  position: absolute;
  top: 7464px;
  width: 616px;
}

.work-4 .x2_-_-1 video {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.work-4 .x2_-_-1 img {
  object-fit: cover;
}

.work-4 .x82082018-1-1 {
  left: 92px;
}

.work-4 .x82082018-1-2 {
  left: 685px;
}

.work-4 .x82082018-1-3 {
  left: 1278px;
}

.work-4 .image-54 {
  height: 406px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 10309px;
  width: 322px;
}

.work-4 .image-55 {
  height: 168px;
  left: 593px;
  object-fit: cover;
  position: absolute;
  top: 10309px;
  width: 276px;
}

.work-4 .image-56 {
  height: 283px;
  left: 594px;
  position: absolute;
  top: 10886px;
  width: 275px;
}

.work-4 .image-57 {
  height: 357px;
  left: 593px;
  object-fit: cover;
  position: absolute;
  top: 10498px;
  width: 276px;
}

.work-4 .image-58 {
  height: 416px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 10750px;
  width: 322px;
}

.work-4 .image-81 {
  height: 558px;
  left: 1293px;
  object-fit: cover;
  position: absolute;
  top: 10306px;
  width: 384px;
}

.work-4 .image-82 {
  height: 357px;
  left: 897px;
  object-fit: cover;
  position: absolute;
  top: 10309px;
  width: 368px;
}

.work-4 .image-83 {
  height: 481px;
  left: 898px;
  object-fit: cover;
  position: absolute;
  top: 10682px;
  width: 367px;
}

.work-4 .image-84 {
  height: 277px;
  left: 1293px;
  object-fit: cover;
  position: absolute;
  top: 10886px;
  width: 384px;
}

.work-4 .image-46 {
  height: 402px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 9082px;
  width: 539px;
}

.work-4 .image-47 {
  height: 402px;
  left: 795px;
  object-fit: cover;
  position: absolute;
  top: 9082px;
  width: 295px;
}

.work-4 .image-48 {
  height: 402px;
  left: 1104px;
  object-fit: cover;
  position: absolute;
  top: 9082px;
  width: 310px;
}

.work-4 .image-50 {
  height: 402px;
  left: 1427px;
  object-fit: cover;
  position: absolute;
  top: 9082px;
  width: 250px;
}

.work-4 .image-51 {
  height: 386px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 9498px;
  width: 337px;
}

.work-4 .image-52 {
  height: 386px;
  left: 596px;
  object-fit: cover;
  position: absolute;
  top: 9498px;
  width: 317px;
}

.work-4 .image-53 {
  height: 387px;
  left: 928px;
  object-fit: cover;
  position: absolute;
  top: 9498px;
  width: 249px;
}

.work-4 .kakao-talk_-photo_20 {
  height: 391px;
  left: 1192px;
  position: absolute;
  top: 9498px;
  width: 233px;
}

.work-4 .kakao-talk_-photo_20-1 {
  height: 391px;
  left: 1441px;
  position: absolute;
  top: 9498px;
  width: 236px;
}

.work-4 .image-77 {
  height: 713px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 12603px;
  width: 458px;
}

.work-4 .image-78 {
  height: 713px;
  left: 724px;
  object-fit: cover;
  position: absolute;
  top: 12603px;
  width: 452px;
}

.work-4 .x1 {
  height: 713px;
  left: 1199px;
  position: absolute;
  top: 12603px;
  width: 478px;
}

.work-4 .image-67 {
  height: 724px;
  left: 243px;
  object-fit: cover;
  position: absolute;
  top: 11674px;
  width: 419px;
}

.work-4 .image-68 {
  height: 724px;
  left: 681px;
  object-fit: cover;
  position: absolute;
  top: 11674px;
  width: 522px;
}

.work-4 .image-63 {
  height: 726px;
  left: 1222px;
  object-fit: cover;
  position: absolute;
  top: 11675px;
  width: 455px;
}

.work-4 .line-14 {
  height: 7px;
  left: 489px;
  width: 890px;
}

.work-4 .line-15 {
  height: 133px;
  left: 933px;
  width: 7px;
}

.work-4 .ellipse-5 {
  background-color: var(--black);
  border: 0.64px solid;
  border-radius: 495.34px;
  height: 991px;
  left: 1277px;
  position: absolute;
  top: 1864px;
  width: 991px;
}

.work-4 .unpredictable {
  color: var(--white);
  font-family: var(--font-family-pretendard-regular);
  font-size: 30.1px;
  font-weight: 400;
  left: 1507px;
  letter-spacing: 0;
  line-height: 41.1px;
  position: absolute;
  top: 2297px;
  white-space: nowrap;
}

.work-4 .text-38 {
  color: var(--white);
  font-family: var(--font-family-pretendard-regular);
  font-size: 30.1px;
  font-weight: 400;
  left: 1509px;
  letter-spacing: 0;
  line-height: 41.1px;
  position: absolute;
  top: 2344px;
  white-space: nowrap;
}

.work-4 .fooh {
  color: var(--white);
  font-family: var(--font-family-pretendard-regular);
  font-size: 51.8px;
  font-weight: 400;
  left: 865px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 2498px;
  white-space: nowrap;
}

.work-4 .fake-out-of-home {
  color: var(--white);
  font-family: var(--font-family-pretendard-regular);
  font-size: 19px;
  font-weight: 400;
  left: 852px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 2591px;
}

.work-4 .text-39 {
  color: var(--white);
  font-family: var(--font-family-pretendard-regular);
  font-size: 19px;
  font-weight: 400;
  left: 884px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 2620px;
}

.work-4 .fooh-fake-out-of-hom {
  left: 743px;
  line-height: 15.2px;
  position: absolute;
  text-align: center;
  top: 2663px;
  width: 385px;
}

.work-4 .span0-1 {
  letter-spacing: -0.01px;
}

.work-4 .span1-1 {
  letter-spacing: 0;
}

.work-4 .group-1171278889 {
  align-items: center;
  background-color: var(--black);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: var(--mercury);
  display: flex;
  gap: 553px;
  height: 117px;
  left: 0;
  min-width: 1920px;
  padding: 29.3px 57.1px;
  position: fixed;
  top: 0;
  z-index: 3;
}

.work-4 .overlap-group-1 {
  align-self: flex-end;
  background-color: var(--onyx);
  border-radius: 28.86px;
  height: 58px;
  justify-content: flex-end;
  min-width: 58px;
  padding: 13.3px 0.4px;
}

.work-4 .x2do0 {
  line-height: normal;
  min-height: 31px;
  white-space: nowrap;
}

.work-4 .span0-2 {
  letter-spacing: -0.88px;
}

.work-4 .span1-2 {
  letter-spacing: -0.73px;
}

.work-4 .span2-1 {
  letter-spacing: -0.59px;
}

.work-4 .group-1171278912 {
  -webkit-backdrop-filter: blur(13px) brightness(100%);
  align-items: flex-end;
  backdrop-filter: blur(13px) brightness(100%);
  background-color: var(--onyx-2);
  border-radius: 37.01px;
  cursor: pointer;
  display: flex;
  height: 74px;
  justify-content: flex-end;
  left: 115px;
  min-width: 74px;
  opacity: 0.7;
  padding: 20.5px 13.6px;
  position: fixed;
  top: 656px;
  transform: rotate(-180.00deg);
  z-index: 2;
}

.work-4 .arrow-1 {
  height: 33px;
  transform: rotate(180.00deg);
  width: 45px;
}

.work-4 .image-80 {
  object-fit: cover;
  position: absolute;
}

.work-4 .line {
  position: absolute;
  top: 2356px;
}

.work-4 .overlap-group-2 {
  align-items: flex-start;
  display: flex;
}

.work-4 .x82082018-1 {
  height: 936px;
  object-fit: cover;
  position: absolute;
  top: 6137px;
  width: 550px;
}