.good-lock-wesite-mobile {
  width: 360px; /* Fixed width exactly matching Figma absolute coordinates */
  height: 7530px;
  position: relative;
  background-color: var(--color-white);
  overflow-x: hidden; /* Prevents any horizontal scroll completely */
  overflow-y: clip;
  line-height: normal;
  letter-spacing: -0.03em;
  text-align: center;
  font-size: var(--fs-12);
  color: var(--color-black);
  font-family: var(--font-gmarket-sans-ttf);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.02); /* Adds a premium soft shadow on PC (transparent/weak) */
}
.ko-new-3-1-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 360px;
  height: 8014px;
  object-fit: cover;
  display: none;
  flex-shrink: 0;
}
.icon-06-1-end {
  position: absolute;
  top: 7042px;
  left: 43.8px;
  width: 46.6px;
  height: 73.4px;
  object-fit: contain;
  flex-shrink: 0;
}
.icon-05-2-end {
  top: 7150px;
  left: 61.3px;
  width: 238.1px;
  height: 257.7px;
  object-fit: contain;
  z-index: 1;
}
.frame-parent,
.icon-03-1-end,
.icon-05-2-end {
  position: absolute;
  flex-shrink: 0;
}
.icon-03-1-end {
  top: 7112px;
  left: 256px;
  width: 52.7px;
  height: 80.4px;
  object-fit: contain;
  z-index: 1;
}
.frame-parent {
  top: 6940px;
  left: 54px;
  width: 251.3px;
  height: 360px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 105px;
  text-align: center;
  font-size: 30px;
  color: var(--color-black);
  font-family: var(--font-nanum-brush-script);
  z-index: 5;
}
.frame-group,
.frame-wrapper,
.parent {
  align-self: stretch;
  flex: 1;
  display: flex;
}
.frame-parent .frame-wrapper,
.frame-parent .frame-group,
.frame-parent .parent {
  flex: none !important;
  height: auto !important;
  display: flex !important;
}
.frame-wrapper {
  align-items: flex-start;
  justify-content: flex-end;
  padding: var(--padding-0) var(--padding-4) var(--padding-0) var(--padding-5);
}
.frame-group,
.parent {
  flex-direction: column;
  align-items: flex-end;
}
.frame-parent .frame-group {
  gap: 2px !important;
}
.frame-parent .parent {
  gap: 2px !important;
}
.frame-parent .div {
  position: relative;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
}
.frame-parent .wrapper,
.frame-parent .container {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  font-size: 70px;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.1 !important;
}
.frame-parent .wrapper {
  padding-right: 2px !important;
}
.frame-parent .container {
  padding-right: 44px !important;
  margin-top: -10px !important;
}
.frame-parent .h1 {
  margin: 0 !important;
  height: auto !important;
  position: relative;
  font-size: inherit;
  font-weight: 400;
  font-family: inherit;
  display: inline-block;
  line-height: 1.1 !important;
  padding: 0 !important;
  cursor: default;
}
.downlocd-end {
  cursor: pointer;
  border: 4px solid var(--color-black);
  height: 67px;
  box-sizing: border-box;
  background-color: var(--color-white);
  box-shadow: var(--shadow-drop);
  border-radius: var(--br-200);
  gap: 22.5px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  align-self: center;
}
.downlocd-end .frame {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
  flex-direction: row !important;
}
.downlocd-end .h3 {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: var(--fs-20) !important;
  line-height: 1 !important;
  height: auto !important;
  vertical-align: middle !important;
}
.downlocd-end .arrow-down-end {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 18.2px !important;
  width: 39px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.downlocd-end-child,
.frame {
  box-sizing: border-box;
  flex-shrink: 0;
}
.downlocd-end-child {
  height: 67px;
  width: 251.3px;
  position: relative;
  box-shadow: var(--shadow-drop);
  border-radius: var(--br-200);
  background-color: var(--color-white);
  border: 4px solid var(--color-black);
  display: none;
}
.frame {
  display: flex;
  align-items: center;
  padding: 0;
}
.arrow-down-end,
.h3 {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}
.h3 {
  margin: 0;
  font-size: var(--fs-20);
  font-weight: 700;
  font-family: var(--font-gmarket-sans-ttf);
  color: var(--color-black);
  text-align: left;
  line-height: normal;
}
.arrow-down-end {
  height: 18.2px;
  width: 39px;
}

.frame-container,
.good-lock-wesite-mobile-child {
  position: absolute;
  left: 40px;
  box-sizing: border-box;
  flex-shrink: 0;
}
.good-lock-wesite-mobile-child {
  top: 6500px;
  border-top: 2px solid var(--color-whitesmoke);
  width: 280px;
  height: 2px;
}
.frame-container {
  top: 6500px;
  width: 280px;
  flex-direction: column;
  padding: 0;
  gap: 0;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.frame-container,
.frame-div,
.group {
  display: flex;
  align-items: flex-start;
}
.frame-div {
  flex-direction: column;
  padding: 35px var(--padding-22) 35px 0;
  gap: 13px;
  width: 100%;
  box-sizing: border-box;
}
.group {
  height: auto;
  gap: var(--gap-18);
  display: flex;
  align-items: center !important;
}
.h32 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  flex-shrink: 0;
}
.arrow-etc-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 !important;
}
.arrow-etc {
  width: 32.6px;
  height: 15.2px;
  object-fit: contain;
  flex-shrink: 0;
}
.div2 {
  height: auto;
  position: relative;
  font-size: var(--fs-12);
  line-height: var(--lh-20);
  font-weight: 500;
  color: var(--color-black);
  display: inline-block;
}
.line-wrapper {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  padding: 0;
}
.frame-child {
  height: 2px;
  flex: 1;
  position: relative;
  border-top: 2px solid var(--color-whitesmoke);
  box-sizing: border-box;
}
.frame-parent2,
.parent2 {
  display: flex;
  align-items: flex-start;
}
.frame-parent2 {
  width: 100%;
  height: auto;
  flex-direction: column;
  padding: 35px var(--padding-20) 35px 0;
  box-sizing: border-box;
  gap: 13px;
}
.parent2 {
  gap: 19px;
  display: flex;
  align-items: center !important;
}
.div3 {
  position: relative;
  font-size: var(--fs-12);
  line-height: var(--lh-20);
  font-weight: 500;
  color: var(--color-black);
  white-space: normal;
}
.frame-item {
  align-self: stretch;
  height: 2px;
  position: relative;
  border-top: 2px solid var(--color-whitesmoke);
  box-sizing: border-box;
}
.sample-etc-1-icon {
  position: absolute;
  top: 6090px;
  left: 49px;
  width: 341px;
  height: 303px;
  object-fit: cover;
  z-index: 1;
  flex-shrink: 0;
}
.frame-section {
  position: absolute;
  top: 5831px;
  left: 40px;
  width: 287px;
  height: 400px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--gap-25);
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-black);
  font-family: var(--font-gmarket-sans-ttf);
}
.h34 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  color: var(--color-mediumturquoise);
  display: inline-block;
  min-width: 103px;
}
.parent3 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--padding-0) var(--padding-0) 12px;
  gap: var(--gap-18);
  font-size: var(--fs-14);
}
.parent3 li {
  display: block;
  width: 100%;
}
.parent3 span.num {
  display: block;
  margin-bottom: 6px;
  font-weight: 500;
}
.parent3 span.text {
  display: block;
  line-height: 1.5;
}
.div4,
.div7 {
  position: relative;
  line-height: var(--lh-22);
  font-weight: 500;
}
.div7 {
  height: 66px;
  display: inline-block;
}
.wrapper2 {
  display: flex;
  align-items: flex-start;
  padding: var(--padding-0) 115px;
  text-align: center;
  font-size: 40px;
  font-family: var(--font-nanum-brush-script);
}
.h22 {
  margin: 0;
  height: 18px;
  position: relative;
  top: 10px;
  left: 15px;
  font-size: inherit;
  font-weight: 400;
  font-family: inherit;
  display: inline-block;
  z-index: 2;
}
.sample-minihome-1-icon {
  position: absolute;
  top: 5288px;
  left: 0;
  width: 360px;
  height: auto;
  object-fit: contain;
  flex-shrink: 0;
}
.frame-parent3 {
  position: absolute;
  top: 5056px;
  left: 40px;
  width: 279px;
  flex-direction: column;
  gap: 22px;
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.frame-parent3,
.frame-parent4,
.wrapper3 {
  display: flex;
  align-items: flex-start;
}
.frame-parent4 {
  align-self: stretch;
  justify-content: space-between;
  gap: var(--gap-20);
}
.wrapper3 {
  flex-direction: column;
  padding: var(--padding-48) var(--padding-0) var(--padding-0);
}
.h35,
.icon-14-1 {
  position: relative;
}
.h35 {
  margin: 0;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  min-width: 77px;
}
.icon-14-1 {
  position: relative;
  top: 6px;
  left: 12px;
  width: 105px;
  max-height: 100%;
  object-fit: cover;
}
.parent4 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--padding-0) var(--padding-4) var(--padding-0) var(--padding-0);
  gap: var(--gap-15);
  font-size: var(--fs-18);
  color: var(--color-black);
}
.div8,
.div9 {
  position: relative;
  line-height: var(--lh-32);
  font-weight: 500;
}
.div8 {
  height: var(--height-64);
  display: inline-block;
}
.div9 {
  font-size: 10px;
}
.icon-08-2 {
  top: 4543px;
  left: 219px;
  width: var(--width-103);
  height: 91px;
  object-fit: cover;
  z-index: 1;
}
.frame-parent5,
.icon-08-2,
.icon-13-1 {
  position: absolute;
  flex-shrink: 0;
}
.icon-13-1 {
  top: 4864px;
  left: 31.5px;
  width: 88.7px;
  height: 100.4px;
  object-fit: contain;
  z-index: 1;
}
.frame-parent5 {
  top: 4366px;
  left: 36px;
  width: 286px;
  height: 552px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 28px;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.frame-wrapper2,
.parent5 {
  display: flex;
  align-items: flex-start;
}
.frame-wrapper2 {
  align-self: stretch;
  height: 160px;
  justify-content: flex-end;
  padding: var(--padding-0) var(--padding-1) var(--padding-0) var(--padding-4);
  box-sizing: border-box;
}
.parent5 {
  flex: 1;
  flex-direction: column;
  gap: var(--gap-25);
}
.h36 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  line-height: 1.5;
}
.parent6 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--gap-15);
  font-size: var(--fs-18);
  color: var(--color-black);
}
.sample-memo-1-icon {
  align-self: stretch;
  flex: 1;
  position: relative;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: cover;
}
.frame-parent6,
.icon-12-1 {
  position: absolute;
  flex-shrink: 0;
}
.icon-12-1 {
  top: 3733px;
  left: 236px;
  width: 98.3px;
  height: 104.4px;
  object-fit: contain;
}
.frame-parent6 {
  top: 3804px;
  left: 35px;
  width: 290.3px;
  flex-direction: column;
  gap: 29px;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.frame-parent6,
.frame-wrapper3,
.parent7 {
  display: flex;
  align-items: flex-start;
}
.frame-wrapper3 {
  align-self: stretch;
  height: 113px;
  padding: var(--padding-0) 13px var(--padding-0) var(--padding-5);
  box-sizing: border-box;
}
.parent7 {
  flex-direction: column;
  gap: var(--gap-25);
}
.div12,
.h37 {
  position: relative;
}
.h37 {
  margin: 0;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  z-index: 1;
  line-height: 1.5;
}
.div12 {
  height: var(--height-64);
  font-size: var(--fs-18);
  line-height: var(--lh-32);
  font-weight: 500;
  color: var(--color-black);
  display: inline-block;
}
.sample-music-2-1-parent {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  gap: var(--gap-20);
}
.sample-music-2-1-icon {
  flex: 1;
  position: relative;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: cover;
  flex-shrink: 0;
}
.frame-parent7,
.frame-wrapper4 {
  display: flex;
  align-items: flex-start;
}
.frame-parent7 {
  position: absolute;
  top: 3241px;
  left: 35px;
  width: 289.8px;
  flex-direction: column;
  gap: 34px;
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.frame-wrapper4 {
  width: 238px;
  height: 113px;
  padding: var(--padding-0) var(--padding-5);
  box-sizing: border-box;
}
.icon-07-2,
.icon-11-1 {
  position: absolute;
  flex-shrink: 0;
}
.icon-11-1 {
  top: 3189.7px;
  left: 234.5px;
  width: 105.2px;
  height: 107.7px;
  object-fit: contain;
  z-index: 1;
}
.icon-07-2 {
  top: 2564px;
  left: 244px;
  width: 91px;
  height: 90px;
  object-fit: cover;
}
.frame-parent8,
.parent9 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
}
.frame-parent8 {
  position: absolute;
  top: 2602px;
  left: 40px;
  width: 320px;
  gap: 33px;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.parent9 {
  width: 308px;
  height: 145px;
  padding: var(--padding-0) var(--padding-20) var(--padding-0) var(--padding-0);
  box-sizing: border-box;
  gap: var(--gap-25);
}
.div14,
.h39 {
  position: relative;
  display: inline-block;
}
.h39 {
  margin: 0;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  min-width: 115px;
}
.div14 {
  height: 96px;
  font-size: var(--fs-18);
  line-height: var(--lh-32);
  font-weight: 500;
  color: var(--color-black);
  z-index: 1;
}
.sample-clock-1-icon {
  width: 354px;
  position: relative;
  max-height: 100%;
  object-fit: cover;
  max-width: 100%;
  flex-shrink: 0;
}
.good-lock-wesite-mobile-item {
  position: absolute;
  top: 1930px;
  left: 255px;
  width: 17px;
  height: 23px;
  object-fit: contain;
  z-index: 1;
  flex-shrink: 0;
}
.parent10 {
  position: absolute;
  top: 1762px;
  left: 40px;
  width: 320px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 27px;
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-21);
  color: var(--color-mediumturquoise);
  font-family: var(--font-gmarket-sans-ttf);
}
.h310 {
  margin: 0;
  height: var(--height-24);
  position: relative;
  font-size: inherit;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  flex-shrink: 0;
}
.ai-parent,
.frame-parent9 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 100%;
}
.frame-parent9 {
  gap: var(--gap-18);
  flex-shrink: 0;
  font-size: var(--fs-18);
  color: var(--color-black);
}
.ai-parent {
  padding: var(--padding-0) var(--padding-20) var(--padding-0) var(--padding-0);
  box-sizing: border-box;
  gap: 5px;
}
.ai {
  width: 265px;
  height: var(--height-64);
  position: relative;
  line-height: var(--lh-32);
  font-weight: 500;
  display: inline-block;
}
.frame-wrapper5,
.rectangle-parent {
  display: flex;
  align-items: flex-start;
}
.frame-wrapper5 {
  width: 302px;
  flex: 1;
  justify-content: flex-end;
  font-size: var(--fs-12);
  margin-top: 5px !important;
}
.rectangle-parent {
  align-self: stretch;
  width: 149px;
  border-radius: var(--br-15);
  background-color: var(--color-lemonchiffon);
  padding: 8px 18px 8px 20px;
  box-sizing: border-box;
}
.div15,
.frame-inner {
  position: relative;
  flex-shrink: 0;
}
.frame-inner {
  height: var(--height-60);
  width: 149px;
  border-radius: var(--br-15);
  background-color: var(--color-lemonchiffon);
  display: none;
}
.div15 {
  height: auto;
  line-height: 1.7;
  font-weight: 500;
  display: inline-block;
  z-index: 1;
  text-align: left;
  width: 100%;
  align-self: center;
}
.bg-sample-full-1-icon {
  align-self: stretch;
  position: relative;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: cover;
}
.icon-10-1,
.phone-04-icon {
  position: absolute;
  z-index: 1;
  flex-shrink: 0;
}
.icon-10-1 {
  top: 1724px;
  left: 234px;
  width: 104.5px;
  height: 114.9px;
  object-fit: contain;
}
.phone-04-icon {
  display: none;
}
.frame-parent10,
.wrapper4 {
  display: flex;
  align-items: flex-start;
  max-width: 100%;
}
.frame-parent10 {
  position: absolute;
  top: 1147px;
  left: 0;
  flex-direction: column;
  gap: 13px;
  width: 100%;
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-20);
  color: var(--color-black);
  font-family: var(--font-gmarket-sans-ttf);
}
.wrapper4 {
  padding: var(--padding-0) 40px;
  box-sizing: border-box;
}
.div16 {
  position: relative;
  line-height: var(--lh-36);
  font-weight: 500;
}
.combined-phones-parent {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  max-width: 100%;
}
.sample-style-img {
  width: 360px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin: 0 auto;
}
.combined-phones {
  margin-left: -399px;
  height: 283px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
}
.phone-01-icon {
  width: var(--width-103);
  position: relative;
  max-height: 100%;
  object-fit: cover;
  flex-shrink: 0;
}
.combined-phones2 {
  height: 283px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
}
.phone-02-icon {
  width: 102px;
  position: relative;
  max-height: 100%;
  object-fit: cover;
  flex-shrink: 0;
}
.combined-phones3,
.frame-parent11 {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.combined-phones3 {
  height: 283px;
  width: 171px;
  align-items: flex-start;
}
.frame-parent11 {
  align-items: flex-end;
  gap: var(--gap-24);
}
.icon-09-1-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: var(--padding-0) 49px;
}
.icon-09-1 {
  height: 78px;
  width: 91px;
  position: relative;
  object-fit: cover;
}
.phone-bg-001-parent {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 7px;
}
.phone-bg-001-icon,
.phone-bg-003-icon {
  height: 219px;
  position: relative;
  object-fit: cover;
}
.phone-bg-001-icon {
  flex: 1;
  max-width: 100%;
  overflow: hidden;
  min-width: 67px;
}
.phone-bg-003-icon {
  width: var(--width-103);
  flex-shrink: 0;
}
.bubble-txt-3,
.bubble-txt-3-child {
  border-radius: var(--br-18);
  background-color: var(--color-gainsboro);
}
.bubble-txt-3 {
  position: absolute;
  top: 948px;
  left: 94px;
  display: flex;
  align-items: flex-start;
  padding: var(--padding-14) var(--padding-28) var(--padding-14)
    var(--padding-30);
  white-space: nowrap;
  flex-shrink: 0;
}
.bubble-txt-3-child {
  height: var(--height-36);
  width: var(--width-131);
  display: none;
}
.bubble-txt-3-child,
.bubble-txt-3-item,
.div17 {
  position: relative;
  flex-shrink: 0;
}
.bubble-txt-3-item {
  height: 23px;
  width: 17px;
  object-fit: contain;
  display: none;
}
.div17 {
  height: var(--height-8);
  line-height: var(--lh-8);
  font-weight: 500;
  font-family: var(--font-gmarket-sans-ttf);
  display: inline-block;
  z-index: 1;
}
.frame-parent12 {
  position: absolute;
  top: 119px;
  left: 30px;
  width: 281px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--gap-24);
  flex-shrink: 0;
  text-align: left;
  font-size: var(--fs-12);
  color: var(--color-black);
  font-family: var(--font-gmarket-sans-ttf);
}
.wrapper5 {
  padding: var(--padding-0) var(--padding-10) var(--padding-3);
  font-size: var(--fs-20);
}
.frame-wrapper6,
.parent11,
.wrapper5 {
  display: flex;
  align-items: flex-start;
}
.frame-wrapper6 {
  width: 166px;
  padding: var(--padding-0) var(--padding-10);
  box-sizing: border-box;
}
.parent11 {
  flex: 1;
  flex-direction: column;
  gap: 17px;
}
.div19,
.good-lock {
  position: relative;
  line-height: 37px;
  display: inline-block;
}
.div19 {
  width: 134px;
  height: var(--height-8);
  font-weight: 500;
}
.good-lock {
  align-self: stretch;
  height: 11px;
  font-size: 16px;
}
.download-android {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding: var(--padding-0) var(--padding-0) var(--padding-19);
  gap: 9px;
}
.bubble-txt-1 {
  border: 0;
  padding: var(--padding-14) var(--padding-22) var(--padding-14) 24px;
  background-color: var(--color-gainsboro);
  width: var(--width-131);
  border-radius: var(--br-18);
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
}
.div20 {
  height: var(--height-8);
  position: relative;
  font-size: var(--fs-12);
  line-height: var(--lh-8);
  font-weight: 500;
  font-family: var(--font-gmarket-sans-ttf);
  color: var(--color-black);
  text-align: center;
  display: inline-block;
  z-index: 1;
  flex-shrink: 0;
}
.download-wrapper {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
}
.download,
.download-child {
  border-radius: var(--br-28);
  background-color: var(--color-mediumslateblue);
}
.download {
  cursor: pointer;
  border: 0;
  padding: 0 var(--padding-22);
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  width: 210px;
  box-sizing: border-box;
}
.download-child {
  height: 56px;
  width: 210px;
  position: relative;
  display: none;
  flex-shrink: 0;
}
.arrow-down,
.b {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}
.b {
  font-size: var(--fs-18);
  font-family: var(--font-gmarket-sans-ttf);
  color: var(--color-white);
}
.arrow-down {
  height: 15.2px;
  width: 32.6px;
}
.arrow-down-child,
.arrow-down-inner,
.arrow-down-item {
  position: absolute;
  height: 15.13%;
  width: 98.16%;
  top: 56.58%;
  right: -96.32%;
  bottom: 28.29%;
  left: 98.16%;
  border-radius: var(--br-200);
  background-color: var(--color-white);
  transform: rotate(180deg);
  transform-origin: 0 0;
}
.arrow-down-inner,
.arrow-down-item {
  height: 13.82%;
  width: 30.67%;
  top: 58.07%;
  right: -26.12%;
  bottom: 28.12%;
  left: 95.44%;
  transform: rotate(-131.2deg);
}
.arrow-down-inner {
  width: 30.06%;
  top: 50.55%;
  right: -29.75%;
  bottom: 35.64%;
  left: 99.69%;
  transform: rotate(131.2deg);
}
.bubble-txt-2,
.origin-bubble {
  display: flex;
  align-items: flex-start;
}
.origin-bubble {
  align-self: stretch;
  justify-content: flex-end;
  padding: var(--padding-0) var(--padding-48);
  text-align: center;
}
.bubble-txt-2 {
  height: var(--height-36);
  width: var(--width-131);
  border-radius: var(--br-18);
  background-color: var(--color-gainsboro);
  padding: var(--padding-14) var(--padding-28) var(--padding-14)
    var(--padding-30);
  box-sizing: border-box;
}
.device-info {
  position: absolute;
  top: 423px;
  left: 36px;
  width: 309.4px;
  height: 612.2px;
  flex-shrink: 0;
}
.icon-06-1,
.icon-07-1,
.phone-001-icon {
  position: absolute;
  top: 125px;
  left: 85px;
  width: 122.3px;
  height: 260px;
  object-fit: cover;
}
.icon-06-1,
.icon-07-1 {
  top: 181px;
  left: 238px;
  width: 39px;
  height: 39px;
}
.icon-06-1 {
  top: 486px;
  left: 145px;
  width: 81.7px;
  height: 126.2px;
  object-fit: contain;
  z-index: 2;
}
.icon-01-1,
.icon-02-1,
.icon-04-1,
.icon-05-2 {
  position: absolute;
  top: 388px;
  left: 9px;
  width: 96px;
  height: 103.5px;
  object-fit: contain;
}
.icon-01-1,
.icon-02-1,
.icon-04-1 {
  top: 274.3px;
  left: 149.5px;
  width: 159.9px;
  height: 182.4px;
  z-index: 1;
}
.icon-01-1,
.icon-02-1 {
  top: 94px;
  left: 0;
  width: 88px;
  height: 87px;
  object-fit: cover;
}
.icon-01-1 {
  top: 0;
  left: 193px;
  width: 90px;
  height: 97px;
  z-index: 2;
}
.icon-03-1,
.icon-08-1 {
  position: absolute;
  top: 687px;
  left: 43px;
  width: 50.3px;
  height: 48.5px;
  object-fit: contain;
  flex-shrink: 0;
}
.icon-03-1 {
  top: 42px;
  left: 140px;
  width: 50px;
  height: 68px;
  z-index: 1;
}

/* 15. Footer Copyright & Language Toggle Styles */
.footer-copyright-lang {
  position: absolute;
  top: 7570px;
  left: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  text-align: center;
  font-family: var(--font-gmarket-sans-ttf), sans-serif;
  z-index: 10;
}
.footer-copyright-lang .copyright {
  font-size: 11px;
  color: #8c8c8c;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.footer-copyright-lang .lang-toggle-btn {
  background-color: var(--color-white);
  border: 1px solid #d3d3d3;
  color: #555555;
  padding: 8px 24px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: all 0.2s ease-in-out;
  font-family: inherit;
}
.footer-copyright-lang .lang-toggle-btn:hover {
  background-color: #fcfcfc;
  color: var(--color-black);
  border-color: #999999;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}
.footer-copyright-lang .lang-toggle-btn:active {
  background-color: #f3f3f3;
  transform: translateY(0.5px);
}

/* 16. English Language specific layout adjustments */
html[lang="en"] .frame-parent12 {
  width: 320px !important;
  left: 25px !important;
}
html[lang="en"] .wrapper5 {
  font-size: 18.5px !important;
  padding: var(--padding-0) var(--padding-10) var(--padding-3) !important; /* Grid aligned! */
}
html[lang="en"] .div19 {
  width: auto !important;
  white-space: nowrap !important;
}
html[lang="en"] .frame-wrapper6 {
  width: auto !important;
}
html[lang="en"] .good-lock {
  font-size: 20px !important; /* Slightly shrunk from 25px to match design */
  font-weight: 700 !important;
  height: auto !important;
  line-height: 1.3 !important;
  margin-top: 12px !important; /* Increased spacing very slightly for breathing room */
}
html[lang="en"] .bubble-txt-1 {
  margin-right: 48px !important; /* Shifts the Android Only bubble left to align beautifully above the download button! */
}
html[lang="en"] .origin-bubble {
  padding-right: 68px !important; /* Move bubble left slightly to align exactly next to the clover */
  justify-content: flex-end !important;
}
html[lang="en"] .bubble-txt-2 {
  width: max-content !important;
  min-width: max-content !important;
  height: 38px !important; /* Identical height to Android Only */
  padding: 0 32px 0 16px !important; /* Right padding buffer for perfect clover overlap! */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--br-18) !important;
  box-sizing: border-box !important;
}
html[lang="en"] .bubble-txt-2 .div17 {
  width: max-content !important;
  min-width: max-content !important;
  height: auto !important;
  line-height: 38px !important; /* Vertically center text inside bubble */
  white-space: nowrap !important;
  font-size: 11.5px !important; /* Extremely clean font size */
  display: inline-block !important;
}

html[lang="en"] .bubble-txt-3 {
  left: 88px !important; /* Shifted left slightly to perfectly match Korean position without text cutoff */
  width: auto !important;
  height: 38px !important; /* Identical height of 38px to match others */
  padding: 0 20px !important; /* Identical padding to match others */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--br-18) !important;
  box-sizing: border-box !important;
}
html[lang="en"] .bubble-txt-3 .div17 {
  width: auto !important;
  height: auto !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  font-size: var(--fs-12) !important; /* Identical font size to match others */
  display: inline-block !important;
}
html[lang="en"] .frame-parent10 .div16 {
  font-size: 18.5px !important; /* Match exactly the main title's size */
  line-height: var(--lh-36) !important; /* Match exactly the main title's line-height */
}

/* AI Background & Features adjustments */
html[lang="en"] .ai,
html[lang="en"] .div14,
html[lang="en"] .div12,
html[lang="en"] .div8 {
  font-size: 15px !important;
  line-height: 1.85 !important;
  height: auto !important;
}

html[lang="en"] .rectangle-parent {
  width: 154px !important;
  padding: 8px 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 2 !important;
  position: relative !important;
}

html[lang="en"] .div15 {
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  text-align: left !important;
  display: inline-block !important;
  width: auto !important;
}

html[lang="en"] .good-lock-wesite-mobile-item {
  z-index: 3 !important;
  top: 1946px !important;
}

/* Flex layout wrapper height adjustments & spacing */
html[lang="en"] .parent9 {
  height: auto !important;
}

/* Synchronize B and C text-to-image gaps with A */
html[lang="en"] .frame-wrapper4,
html[lang="en"] .frame-wrapper3 {
  height: auto !important;
  margin-bottom: 0 !important; /* Reset margin to let flex gap handle it perfectly */
}

html[lang="en"] .frame-parent6 {
  gap: 34px !important; /* Set exact same gap as Clock & Calendar */
  top: 3840px !important; /* Position adjusted for perfect F section gap */
}

/* Synchronize E and F section gaps with D (Pixel-perfect coordinates) */
html[lang="en"] .frame-parent7 {
  top: 3235px !important; /* Position adjusted for perfect E section gap */
}

html[lang="en"] .frame-parent5 {
  top: 4460px !important; /* Shift Notepad section down to match */
  height: auto !important;
}

html[lang="en"] .icon-12-1 {
  top: 3812px !important; /* Shift 3D music note down to align beautifully with header */
}
html[lang="en"] .icon-11-1 {
  top: 3208px !important;
}

html[lang="en"] .frame-wrapper2 {
  height: auto !important;
}

/* Memo Section English Custom Layout */
html[lang="en"] .frame-parent5 .div9 {
  display: none !important; /* Hide bus-only notice strictly inside Memo section */
}

html[lang="en"] .icon-08-2 {
  top: 4424px !important; /* Align with #Memo header (4370px top - 36px) */
  left: 236px !important; /* Align horizontally with clock/music icons */
  width: 98.3px !important; /* Visual symmetry with music note icon */
  height: 104.4px !important;
  object-fit: contain !important;
}

html[lang="en"] .sample-memo-1-icon {
  width: 360px !important; /* Spans full screen width */
  max-width: none !important;
  margin-left: -36px !important; /* Offset absolute container left padding */
  height: auto !important;
  object-fit: contain !important;
}

html[lang="en"] .icon-13-1 {
  display: none !important; /* Hide old redundant notepad icon in English */
}

/* Tok Tok Single-line layout & push right */
html[lang="en"] .wrapper2 {
  padding: var(--padding-0) 50px var(--padding-0) 70px !important; /* Shifted left padding to push Tok Tok right */
  width: auto !important;
}

html[lang="en"] .h22 {
  white-space: nowrap !important;
  display: block !important;
}

/* Center ONLY the text lines inside the callout section left-to-right & adjust font sizes to match the design perfectly */
html[lang="en"] .frame-parent .div,
html[lang="en"] .frame-parent .wrapper,
html[lang="en"] .frame-parent .container {
  display: flex !important;
  justify-content: center !important;
  width: auto !important;
  margin-left: -60px !important;
  margin-right: -60px !important;
  padding-right: 0 !important; /* Force reset hidden Korean padding-right shifting (44px) to achieve perfect center! */
}

html[lang="en"] .frame-wrapper {
  padding-top: 85px !important; /* Push text down to make beautiful space for the ice cream bar above it! */
  padding-bottom: 0 !important; /* Visual padding reset to align Download button perfectly */
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html[lang="en"] .frame-parent .frame-group {
  align-items: center !important;
  width: 100% !important;
}

html[lang="en"] .frame-parent .parent {
  align-items: center !important;
  width: 100% !important;
}

html[lang="en"] .frame-parent .div {
  text-align: center !important;
  white-space: nowrap !important;
  font-size: 24px !important; /* Restored size keeping the signature brush font */
  font-family: var(--font-nanum-brush-script) !important; /* Restored beautiful handwriting brush script */
  margin-bottom: 4px !important;
}

html[lang="en"] .frame-parent h1.h1,
html[lang="en"] .frame-parent h2.h1 {
  font-size: 52px !important; /* Scale down elegantly from 70px to match design, not tiny */
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: nowrap !important;
  width: max-content !important;
  margin: 0 auto !important;
}

/* Center 3D Ice cream bar slightly to the left (matching the elegant asymmetry of the design screen) and vertically above the centered text */
html[lang="en"] .icon-06-1-end {
  top: 6862px !important;
  left: 142px !important; /* Shifted left by 15px to match the design's elegant layout */
  width: 46.6px !important;
  height: 73.4px !important;
  z-index: 10 !important;
}

/* Increase the gap inside the callout flex container between the text group and the Download button */
html[lang="en"] .frame-parent {
  top: 6860px !important;
  gap: 135px !important; /* Expanded from 105px to create beautiful open vertical breathing room */
}

/* Shift bottom 3D graphic layers down further (total 70px down from original) to synchronize perfectly with the lowered Download button */
html[lang="en"] .icon-05-2-end {
  top: 7140px !important; /* Lowered by another 35px (7185 -> 7220) to expose the beautiful top corner of the cube */
}

html[lang="en"] .icon-03-1-end {
  top: 7102px !important; /* Lowered by another 35px (7147 -> 7182) to sit perfectly next to the cube and button */
}

/* Shift Mini Home and subsequent sections up in English mode to reduce Section A gap */
/* Shift Mini Home and subsequent sections up in English mode to reduce Section A gap */
html[lang="en"] .frame-parent3 {
  top: 5026px !important;
}
html[lang="en"] .sample-minihome-1-icon {
  top: 5258px !important;
}
html[lang="en"] .div9 {
  position: absolute !important;
  top: 187px !important;
  left: 0 !important;
  margin: 0 !important;
}
html[lang="en"] .frame-section {
  top: 5751px !important;
}
html[lang="en"] .sample-etc-1-icon {
  top: 6020px !important;
}
html[lang="en"] .good-lock-wesite-mobile-child {
  top: 6420px !important;
  border-top: 2px solid var(--color-whitesmoke) !important;
  height: 2px !important;
}
html[lang="en"] .frame-container {
  top: 6420px !important;
  gap: 0 !important;
}
html[lang="en"] .footer-copyright-lang {
  top: 7545px !important;
}
html[lang="en"] .good-lock-wesite-mobile {
  height: 7490px !important;
}

/* PC desktop scaling to make the website look larger and more readable */
@media (min-width: 480px) {
  .good-lock-wesite-mobile {
    zoom: 1.08;
  }
}