/* screen - index */

.index {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  position: relative;
}

.index .hero {
  
  background-image: url(../img/00_main.jpg);
  background-position: 50% 50%;
  background-size: cover;
  padding: 0px 20px;
  position: relative;
  width: 100%;
}

.index .hero .inner{
margin:0 auto; 
max-width:1190px;
display: flex;
flex-direction: column;
gap: 45px;
height: 880px;
justify-content: center;
align-items: flex-start;
align-self: stretch;

}

.index .text-3 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 20px;
  position: relative;
}

.index .x1 {
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  margin-left: -2.00px;
  margin-right: -2.00px;
  margin-top: -2.00px;
  padding: 16px 35px;
}

.index .text {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.96px;
  line-height: 23.8px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .span {
  letter-spacing: -0.31px;
}

.index .x2 {
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  gap: 10px;
  margin-left: -2.00px;
  padding: 16px 35px;
}

.index .x3 {
  align-items: center;
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  margin-bottom: -2.00px;
  margin-left: -2.00px;
  padding: 16px 35px;
  position: relative;
}

.index .container {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  position: relative;
}

.index .text-4 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 68px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -2.04px;
  line-height: 62.4px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .span-1 {
  letter-spacing: -1.39px;
}

.index .span1 {
  color: var(--coffee-bean);
  font-weight: 700;
  letter-spacing: -1.39px;
}

.index .text-5 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 50px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .span0 {
  letter-spacing: -0.48px;
}

.index .span1-1 {
  color: var(--coffee-bean);
  font-family: var(--font-family-pretendard-bold);
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.48px;
}

.index .section01 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 50px;
  justify-content: center;
  padding: 150px 0px;
  position: relative;
  width: 100%;
}

.index .heading-2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

.index .text-6 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 52.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span1-2 {
  color: var(--wood-bark);
  font-family: var(--font-family-pretendard-light);
  font-size: 40px;
  font-weight: 300;
  letter-spacing: -0.48px;
}

.index .span2 {
  color: var(--wood-bark);
  font-family: var(--font-family-pretendard-bold);
  font-size: 52px;
  font-weight: 700;
  letter-spacing: -0.81px;
  line-height: 67.6px;
}

.index .ectropion-cause {
  align-items: center;
  color: var(--sisal);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: 30px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.90px;
  line-height: 44.8px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .x03_ba-1 {
  aspect-ratio: 2.5;
  background-image: url(../img/03_ba-1.jpg);
  height: 360px;
  max-height: 400px;
  width: 900px;
}

.index .text-7 {
  align-items: center;
  display: inline-flex;
  flex-direction: column;
  gap: 15px;
  height: 364px;
  justify-content: center;
  position: relative;
}

.index .x1-1 {
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 30px;
  margin-top: -18.00px;
  padding: 40px 30px;
}

.index .rectangle-2 {
  height: 63px;
  object-fit: cover;
  position: relative;
  width: 63px;
}

.index .container-1 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 531px;
}

.index .text-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 34px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .text-2 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 28.0px;
  position: relative;
  width: fit-content;
}

.index .line {
  height: 1px;
  position: relative;
  width: 656px;
}

.index .x2-1 {
  border-radius: 20px;
  gap: 30px;
  margin-bottom: -18.00px;
  padding: 40px 30px;
}

.index .container-2 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 533px;
}

.index .section02 {
  
  background-image: url(../img/section02.jpg);
  background-position: 50% 50%;
  background-size: cover;
  
  padding: 150px 20px;
  box-sizing:border-box;
  position: relative;
  width: 100%;
}

.index .section02 .inner{margin:0 auto; max-width:1420px; box-sizing:border-box;
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 60px;
}

.index .heading-2-1 {
  align-items: flex-start;
  flex: 0 0 auto;
}

.index .text-11 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 40px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 52.0px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .text-12 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: 52px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: -1.56px;
  line-height: 67.6px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .container-3 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  position: relative;
}

.index .horizontal-border {
  align-items: flex-start;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: var(--bon-jour);
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  padding: 20px 0px;
  position: relative;
}

.index .paragraph {
  align-items: center;
  background-color: var(--kabul);
  border-radius: 50px;
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  justify-content: center;
  padding: 10px;
  position: relative;
  width: 628px;
}

.index .text-13 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .text-1-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.66px;
  line-height: 30.8px;
  position: relative;
  width: fit-content;
}

.index .span-2 {
  letter-spacing: -0.15px;
}

.index .text-15 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .horizontal-border-1 {
  align-items: flex-start;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: var(--bon-jour);
  border-radius: 20px;
  display: inline-flex;
  flex-direction: column;
  gap: 15px;
  height: 180px;
  padding: 20px 0px;
  position: relative;
}

.index .text-17 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .section03 {
  align-items: center;
  align-self: stretch;
  background-image: url(../img/section03.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 15px;
  height: 860px;
  padding: 150px 0px;
  position: relative;
  width: 100%;
}

.index .heading-2-2 {
  align-items: center;
  gap: 5px;
  height: 102px;
}

.index .text-19 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 32px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.96px;
  line-height: 41.6px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .text-20 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: 42px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: -1.26px;
  line-height: 54.6px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .hline {
  height: 70px;
  position: relative;
  width: 1px;
}

.index .card {
  align-items: center;
  background-color: var(--white);
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  margin-bottom: -1.00px;
  padding: 45px 100px;
  position: relative;
}

.index .text-21 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 28.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span-3 {
  letter-spacing: -0.12px;
}

.index .span1-3 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-m);
  font-weight: 700;
  letter-spacing: -0.12px;
}

.index .text-22 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xxl);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.78px;
  line-height: 33.8px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span0-1 {
  color: var(--kabul);
  font-weight: 700;
  letter-spacing: -0.20px;
}

.index .span1-4 {
  color: var(--kabul);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.20px;
}

.index .span2-1 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.20px;
}

.index .section04 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 70px;
  padding: 150px 20px;
  position: relative;
  width: 100%;
}

.index .heading-2-3 {
  align-items: center;
  flex: 0 0 auto;
  padding: 0px 0px 0.58px;
}

.index .text-23 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 36px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.08px;
  line-height: 36px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span0-2 {
  color: var(--kabul);
  font-weight: 300;
  letter-spacing: -0.39px;
  line-height: 50.4px;
}

.index .span1-5 {
  color: var(--coffee-bean);
  font-family: var(--font-family-pretendard-bold);
  font-size: 60px;
  font-weight: 700;
  line-height: 78.0px;
}

.index .container-4 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 50px;
  justify-content: center;
  position: relative;
}

.index .x1-2 {
  background-color: var(--cararra);
  border-radius: 350px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 271px;
  padding: 50px 0px;
  width: 282px;
}

.index .icon {
  background-image: url(../img/path-24@2x.png);
  background-size: 100% 100%;
  height: 21px;
  position: relative;
  width: 21px;
}

.index .path {
  height: 55.36%;
  left: 16.67%;
  position: absolute;
  top: 27.08%;
  width: 76.19%;
}

.index .text-2-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 33.6px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span-4 {
  letter-spacing: -0.17px;
}

.index .container-item {
  align-items: center;
  background-color: var(--cararra);
  border-radius: 350px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 271px;
  justify-content: center;
  position: relative;
  width: 282px;
}

.index .text-25 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xl);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 33.6px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .container-5 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  position: relative;
  width: 100%;
}

.index .tit {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

.index .text-27 {
  align-items: center;
  color: var(--black);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: var(--font-size-xxxl);
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.81px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .before-after {
  align-items: center;
  color: var(--mountain-mist);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: 30px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: 2.00px;
  line-height: 23.8px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .x03_ba-2 {
  background-image: url(../img/03_ba-2.jpg);
  height: 400px;
  width: 1000px;
}

.index .section05 {
  align-items: flex-start;
  align-self: stretch;
  background-image: url(../img/section04.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  height: 652px;
  padding: 149px 20px;
  position: relative;
  width: 100%;
  
}

.index .container-6 {
  justify-content: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 16px;
  margin-bottom: -1.00px;
  width:100%;
  box-sizing:border-box;
  max-width: 1240px;
  padding: 0px 20px;
  position: relative;
  margin:0 auto;
}

.index .container-7 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  justify-content: center;
  max-width: 600px;
  position: relative;
}

.index .text-28 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 53px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.59px;
  line-height: 40.8px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .text-29 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.81px;
  line-height: 37.8px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.index .span-5 {
  letter-spacing: -0.22px;
}

.index .span1-6 {
  color: var(--kabul);
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xxxl);
  font-weight: 700;
  letter-spacing: -0.22px;
}

.index .vector-82 {
  height: 70px;
  position: relative;
  width: 1px;
}

.index .frame-354 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 20px;
  justify-content: center;
  position: relative;
}

.index .text-30 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 26.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.index .link {
  align-items: flex-start;
  border: 1px solid;
  border-color: var(--kabul);
  display: inline-flex;
  flex: 0 0 auto;
  position: relative;
}

.index .text-31 a{
  padding: 15px 70px;
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 27.2px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
  font-size:inherit;
  color:inherit;
}


.index .heading-2-4 {
  display: inline-flex;
  flex-direction: column;
  position: relative;
}

.index .price-3 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.index .x03_ba {
  background-position: 50% 50%;
  background-size: cover;
  max-width: 1000px;
  position: relative;
}

.index .x1-3 {
  align-items: center;
  justify-content: center;
  position: relative;
}

.index .x2-2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
  position: relative;
}
/* screen - x1280 */

.x1280 {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  position: relative;
}

.x1280 .hero-2 {
  align-items: flex-start;
  align-self: stretch;
  background-image: url(../img/00_main_t.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 45px;
  aspect-ratio: 1280/880;
  justify-content: center;
  padding: 0px 9%;
  position: relative;
  width: 100%;
}

.x1280 .text-24 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 20px;
  position: relative;
}

.x1280 .x1-4 {
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  margin-left: -2.00px;
  margin-right: -2.00px;
  margin-top: -2.00px;
  padding: 16px 35px;
}

.x1280 .text-6-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.96px;
  line-height: 23.8px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .span-10 {
  letter-spacing: -0.31px;
}

.x1280 .x2-3 {
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  gap: 10px;
  margin-left: -2.00px;
  padding: 16px 35px;
}

.x1280 .x3-2 {
  align-items: center;
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  margin-bottom: -2.00px;
  margin-left: -2.00px;
  padding: 16px 35px;
  position: relative;
}

.x1280 .container-15 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  position: relative;
}

.x1280 .text-66 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 68px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -2.04px;
  line-height: 62.4px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .span-11 {
  letter-spacing: -1.39px;
}

.x1280 .span1-13 {
  color: var(--coffee-bean);
  font-weight: 700;
  letter-spacing: -1.39px;
}

.x1280 .text-67 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 50px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .span0-7 {
  letter-spacing: -0.48px;
}

.x1280 .span1-14 {
  color: var(--coffee-bean);
  font-family: var(--font-family-pretendard-bold);
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.48px;
}

.x1280 .section01-2 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 50px;
  justify-content: center;
  padding: 150px 20px;
  position: relative;
  width: 100%;
}

.x1280 .heading-2-8 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
}

.x1280 .text-68 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 52.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span1-15 {
  color: var(--wood-bark);
  font-family: var(--font-family-pretendard-light);
  font-size: 40px;
  font-weight: 300;
  letter-spacing: -0.48px;
}

.x1280 .span2-4 {
  color: var(--wood-bark);
  font-family: var(--font-family-pretendard-bold);
  font-size: 52px;
  font-weight: 700;
  letter-spacing: -0.81px;
  line-height: 67.6px;
}

.x1280 .ectropion-cause-2 {
  align-items: center;
  color: var(--sisal);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: 30px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.90px;
  line-height: 44.8px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .x03_ba-1-2 {
  aspect-ratio: 2.5;
  background-image: url(../img/03_ba-1.jpg);
  background-position: 50% 50%;
  background-size: cover;
  height: 360px;
  max-height: 400px;
  max-width: 1000px;
  position: relative;
  width: 900px;
}

.x1280 .text-26 {
  align-items: center;
  display: inline-flex;
  flex-direction: column;
  gap: 15px;
  height: 364px;
  justify-content: center;
  position: relative;
}

.x1280 .x1-5 {
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 30px;
  margin-top: -18.00px;
  padding: 40px 30px;
}

.x1280 .rectangle-2-2 {
  height: 63px;
  object-fit: cover;
  position: relative;
  width: 63px;
}

.x1280 .container-16 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 531px;
}

.x1280 .text-16 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 34px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .text-7-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 28.0px;
  position: relative;
  width: fit-content;
}

.x1280 .line-2 {
  height: 1px;
  position: relative;
  width: 656px;
}

.x1280 .x2-4 {
  border-radius: 20px;
  gap: 30px;
  margin-bottom: -18.00px;
  padding: 40px 30px;
}

.x1280 .container-17 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 533px;
}

.x1280 .section02-2 {
  background-image: url(../img/section02.jpg);
  background-position: 50% 50%;
  background-size: cover;
  padding: 150px 20px;
  position: relative;
  width: 100%;
}

.x1280 .section02-2 .inner{
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  gap: 60px;
  flex: 0 0 auto;
  flex-direction: column;
  margin:0 auto;
  max-width:1200px;

}

.x1280 .heading-2-9 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  width: 100%;
}

.x1280 .text-73 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 40px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -1.20px;
  line-height: 52.0px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .text-74 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: 52px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: -1.56px;
  line-height: 67.6px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .container-18 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  position: relative;
}

.x1280 .horizontal-border-3 {
  flex: 0 0 auto;
}

.x1280 .paragraph-2 {
  align-items: center;
  background-color: var(--kabul);
  border-radius: 50px;
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  justify-content: center;
  padding: 10px;
  position: relative;
  width: 628px;
}

.x1280 .text-75 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .text-18 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.66px;
  line-height: 30.8px;
  position: relative;
  width: fit-content;
}

.x1280 .span-12 {
  letter-spacing: -0.15px;
}

.x1280 .text-77 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .horizontal-border-4 {
  height: 180px;
}

.x1280 .text-79 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .section03-2 {
  background-image: url(../img/section03.jpg);
  background-position: 50% 50%;
  background-size: cover;
  height: 860px;
  padding: 150px 20px;
  position: relative;
  width: 100%;
}

.x1280 .section03-2 .inner{
  align-items: center;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin:0 auto;
  max-width:853px;

}

.x1280 .heading-2-10 {
  align-items: center;
  display: inline-flex;
  gap: 5px;
  height: 102px;
}

.x1280 .text-81 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 32px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.96px;
  line-height: 41.6px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .text-82 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: 42px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: -1.26px;
  line-height: 54.6px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .hline-2 {
  height: 70px;
  position: relative;
  width: 1px;
}

.x1280 .card-2 {
  align-items: center;
  background-color: var(--white);
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  margin-bottom: -1.00px;
  padding: 45px 80px;
  position: relative;
}

.x1280 .text-83 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 28.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span-13 {
  letter-spacing: -0.12px;
}

.x1280 .span1-16 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-m);
  font-weight: 700;
  letter-spacing: -0.12px;
}

.x1280 .text-84 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xxl);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.78px;
  line-height: 33.8px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span0-8 {
  color: var(--kabul);
  font-weight: 700;
  letter-spacing: -0.20px;
}

.x1280 .span1-17 {
  color: var(--kabul);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.20px;
}

.x1280 .span2-5 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.20px;
}

.x1280 .section04-2{
  padding: 150px 20px;
  position: relative;
  width: 100%;

}

.x1280 .section04-2 .inner {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 70px;
  margin:0 auto;
  max-width:1000px;
}


.x1280 .heading-2-11 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  padding: 0px 0px 0.58px;
}

.x1280 .text-85 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 36px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.08px;
  line-height: 36px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span0-9 {
  color: var(--kabul);
  font-weight: 300;
  letter-spacing: -0.39px;
  line-height: 50.4px;
}

.x1280 .span1-18 {
  color: var(--coffee-bean);
  font-family: var(--font-family-pretendard-bold);
  font-size: 60px;
  font-weight: 700;
  line-height: 78.0px;
}

.x1280 .container-19 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 50px;
  justify-content: center;
  position: relative;
}

.x1280 .x1-6 {
  background-color: var(--cararra);
  border-radius: 350px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 271px;
  padding: 50px 0px;
  width: 282px;
}

.x1280 .icon-4 {
  background-image: url(../img/path-24@2x.png);
  background-size: 100% 100%;
  height: 21px;
  position: relative;
  width: 21px;
}

.x1280 .path-2 {
  height: 55.36%;
  left: 16.67%;
  position: absolute;
  top: 27.08%;
  width: 76.19%;
}

.x1280 .text-8-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 33.6px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span-14 {
  letter-spacing: -0.17px;
}

.x1280 .container-item-2 {
  align-items: center;
  background-color: var(--cararra);
  border-radius: 350px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 271px;
  justify-content: center;
  position: relative;
  width: 282px;
}

.x1280 .text-87 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xl);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 33.6px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .container-20 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  position: relative;
}

.x1280 .tit-2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

.x1280 .text-89 {
  align-items: center;
  color: var(--black);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: var(--font-size-xxxl);
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.81px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .before-after-2 {
  align-items: center;
  color: var(--mountain-mist);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: 30px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: 2.00px;
  line-height: 23.8px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .x03_ba-2-2 {
  background-image: url(../img/03_ba-2.jpg);
  background-position: 50% 50%;
  background-size: cover;
  height: 400px;
  max-width: 1000px;
  position: relative;
  width: 1000px;
}

.x1280 .section05-2 {
  background-image: url(../img/section04.jpg);
  background-position: 50% 50%;
  background-size: cover;
  gap: 10px;
  padding: 149px 20px;
  width: 100%;
  height: 652px;
}

.x1280 .section05-2 .inner{
  position: relative;
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  padding: 0px 20px;
  box-sizing:border-box;
  width:100%;
  position: relative;
}

.x1280 .container-21 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 16px;
  margin-bottom: -1.00px;
  max-width:716px;
  width:100%;  
}

.x1280 .container-22 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  justify-content: center;
  max-width: 600px;
  position: relative;
}

.x1280 .text-90 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 53px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.59px;
  line-height: 40.8px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .text-91 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.81px;
  line-height: 37.8px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x1280 .span-15 {
  letter-spacing: -0.22px;
}

.x1280 .span1-19 {
  color: var(--kabul);
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-xxxl);
  font-weight: 700;
  letter-spacing: -0.22px;
}

.x1280 .vector-82-2 {
  height: 70px;
  position: relative;
  width: 1px;
}

.x1280 .frame-354-2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 20px;
  justify-content: center;
  position: relative;
}

.x1280 .text-92 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 26.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .link-2  a{
  align-items: flex-start;
  border: 1px solid;
  border-color: var(--kabul);
  display: inline-flex;
  flex: 0 0 auto;
  padding: 15px 70px;
  position: relative;
  font-size:inherit;
  color:inherit;
}

.x1280 .text-93 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 27.2px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .heading-2 {
  flex-direction: column;
  position: relative;
}

.x1280 .horizontal-border {
  align-items: flex-start;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: var(--bon-jour);
  display: inline-flex;
  flex-direction: column;
  gap: 15px;
  padding: 20px 0px;
  position: relative;
}

.x1280 .price {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 25.6px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x1280 .x1 {
  align-items: center;
  justify-content: center;
  position: relative;
}

.x1280 .x2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
  position: relative;
}
/* screen - x412 */

.x412 {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  position: relative;
}

.x412 .hero-1 {
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  background-image: url(../img/00_main_t.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 45px;
  aspect-ratio: 1280/880;
  padding: 26vw 24px;
  position: relative;
  width: 100%;
}

.x412 .text-10 {
  align-items: flex-start;
  display: inline-flex;
  flex-direction: column;
  flex: 0 0 auto;
  gap: 12px;
  position: relative;
}

.x412 .x1-3 {
  align-items: center;
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  margin-bottom: -2.00px;
  margin-left: -2.00px;
  margin-top: -2.00px;
  padding: 8px 14px;
  position: relative;
}

.x412 .text-3-1 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: normal;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .span-6 {
  letter-spacing: -0.10px;
}

.x412 .x2-2 {
  align-items: center;
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  margin-bottom: -2.00px;
  margin-top: -2.00px;
  padding: 8px 14px;
  position: relative;
}

.x412 .x3-1 {
  align-items: center;
  border: 2px solid;
  border-color: var(--white-2);
  border-radius: 50px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  margin-bottom: -2.00px;
  margin-right: -2.00px;
  margin-top: -2.00px;
  padding: 8px 14px;
  position: relative;
}

.x412 .container-9 {
  align-items: center;
  display: inline-flex;
  gap: 14px;
}

.x412 .text-35 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 38px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.14px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.x412 .span-7 {
  color: var(--kabul-2);
  font-weight: 300;
  letter-spacing: -0.43px;
}

.x412 .span1-7 {
  color: var(--coffee-bean);
  font-weight: 700;
  letter-spacing: -0.43px;
}

.x412 .text-36 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 28px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: normal;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .span0-3 {
  font-weight: 300;
  letter-spacing: -0.24px;
}

.x412 .span1-8 {
  font-family: var(--font-family-pretendard-bold);
  font-weight: 700;
  letter-spacing: -0.24px;
}

.x412 .section01-1 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 50px;
  justify-content: center;
  padding: 80px 24px;
  position: relative;
  width: 100%;
}

.x412 .heading-2-4 {
  justify-content: center;
}

.x412 .text-37 {
  align-items: center;
  color: var(--wood-bark);
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: 28px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 36.4px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .span0-4 {
  font-weight: 700;
  letter-spacing: -0.24px;
}

.x412 .span1-9 {
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.24px;
}

.x412 .span2-2 {
  font-size: 38px;
  font-weight: 700;
  letter-spacing: -0.43px;
  line-height: 49.4px;
}

.x412 .ectropion-cause-1 {
  align-items: center;
  color: var(--sisal);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: var(--font-size-m);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.20px;
  line-height: normal;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .x03_ba-1-1 {
  aspect-ratio: 2.5;
  background-image: url(../img/03_ba-1.jpg);
  background-position: 50% 50%;
  background-size: cover;
  max-height: 400px;
  max-width: 1000px;
  position: relative;
  width: 100%;
}

.x412 .text-14 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 32px;
  justify-content: center;
  position: relative;
}

.x412 .text-item {
  align-items: flex-start;
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 8px;
  position: relative;
}

.x412 .rectangle-2-1 {
  aspect-ratio: 1;
  height: 48px;
  object-fit: cover;
  position: relative;
  width: 48px;
}

.x412 .container-8 {
  align-items: flex-start;
  display: inline-flex;
  gap: 10px;
}

.x412 .text-8 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-malgun_gothic-bold);
  font-size: var(--font-size-xl);
  font-weight: 700;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 34px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .text-9 {
  align-items: center;
  color: var(--cape-cod);
  display: flex;
  font-family: var(--font-family-pretendard-regular);
  font-size: 14px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.42px;
  line-height: 19.6px;
  position: relative;
  width: fit-content;
}

.x412 .line-1 {
  height: 1px;
  position: relative;
  width: 360px;
}

.x412 .section02-1 {
  align-items: center;
  align-self: stretch;
  background-color: #e3e3e3;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 40px;
  padding: 80px 24px;
  position: relative;
  width: 100%;
}

.x412 .text-42 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 28px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 36.4px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .text-43 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.14px;
  line-height: 49.4px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .container-10 {
  align-items: flex-start;
  display: inline-flex;
  gap: 27px;
}

.x412 .horizontal-border-2 {
  align-items: flex-start;
  align-self: stretch;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: var(--bon-jour);
  border-radius: 20px;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 100%;
}

.x412 .paragraph-1 {
  align-items: center;
  align-self: stretch;
  background-color: var(--kabul);
  border-radius: 50px;
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  justify-content: center;
  padding: 7px 10px;
  position: relative;
  width: 100%;
}

.x412 .price-3 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.x412 .text-4-1 {
  letter-spacing: -0.51px;
  line-height: normal;
  margin-top: -0.50px;
  white-space: nowrap;
}

.x412 .text-4-2 {
  letter-spacing: -0.48px;
  line-height: 22.4px;
}

.x412 .span-8 {
  letter-spacing: -0.08px;
}

.x412 .section03-1 {
  align-items: center;
  align-self: stretch;
  background-image: url(../img/section03_m.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 15px;
  height: 860px;
  padding: 80px 24px;
  position: relative;
  width: 100%;
}

.x412 .heading-2-6 {
  gap: 5px;
}

.x412 .text-50 {
  align-items: center;
  color: var(--kabul);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: 28px;
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 36.4px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .text-51 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -1.14px;
  line-height: 49.4px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .hline-1 {
  height: 70px;
  position: relative;
  width: 1px;
}

.x412 .card-1 {
  align-items: center;
  background-color: var(--white);
  border-radius: 20px;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  margin-left: -6.00px;
  margin-right: -6.00px;
  padding: 45px 16px;
  position: relative;
}

.x412 .text-52 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: 25.2px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .span1-10 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-s);
  font-weight: 700;
  letter-spacing: -0.10px;
}

.x412 .text-53 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-s);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: 23.4px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .span0-5 {
  color: var(--kabul);
  font-weight: 700;
  letter-spacing: -0.10px;
}

.x412 .span1-11 {
  color: var(--kabul);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.10px;
}

.x412 .span2-3 {
  color: var(--mine-shaft);
  font-family: var(--font-family-pretendard-light);
  font-weight: 300;
  letter-spacing: -0.10px;
}

.x412 .section04-1 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white);
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 38px;
  padding: 80px 24px;
  position: relative;
  width: 100%;
}

.x412 .heading-2-7 {
  padding: 0px 0px 0.58px;
}

.x412 .text-54 {
  align-items: center;
  color: transparent;
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 28px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.84px;
  line-height: 28px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .span0-6 {
  color: var(--kabul);
  font-weight: 300;
  letter-spacing: -0.24px;
  line-height: 50.4px;
}

.x412 .span1-12 {
  letter-spacing: -0.43px;
  line-height: 49.4px;
}

.x412 .container-11 {
  align-items: center;
  align-self: stretch;
  display: flex;
  gap: 16px;
  width: 100%;
}

.x412 .container-item-1 {
  align-items: center;
  align-self: stretch;
  background-color: var(--cararra);
  border-radius: 16px;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  padding: 25px 32px;
  position: relative;
  width: 100%;
}

.x412 .container-item-1 strong{font-weight:700; color:#281309;}

.x412 .path-1 {
  height: 55.36%;
  left: 11.90%;
  position: absolute;
  top: 22.32%;
  width: 76.19%;
}

.x412 .text-5-1 {
  align-items: center;
  color: #333;
  display: flex;
  font-family: var(--font-family-pretendard-regular);
  font-size: var(--font-size-s);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: 25.2px;
  position: relative;
  text-align: center;
}


.x412 .text-56 {
  align-items: center;
  color: #333;
  display: flex;
  font-family: var(--font-family-pretendard-bold);
  font-size: var(--font-size-s);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.54px;
  line-height: 25.2px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
}


.x412 .container-12 {
  align-items: center;
  align-self: stretch;
  display: flex;
  gap: 30px;
  width: 100%;
}

.x412 .tit-1 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

.x412 .text-58 {
  align-items: center;
  color: var(--black);
  display: flex;
  font-family: var(--font-family-pretendard-light);
  font-size: var(--font-size-xl);
  font-weight: 300;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .before-after-1 {
  align-items: center;
  color: var(--mountain-mist);
  display: flex;
  font-family: var(--font-family-aboreto);
  font-size: var(--font-size-m);
  font-weight: 400;
  justify-content: center;
  letter-spacing: -0.20px;
  line-height: normal;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .x03_ba-2-1 {
  aspect-ratio: 2.5;
  background-image: url(../img/03_ba-2.jpg);
  background-position: 50% 50%;
  background-size: cover;
  max-height: 400px;
  max-width: 1000px;
  position: relative;
  width: 100%;
}

.x412 .section05-1 {
  align-items: center;
  align-self: stretch;
  background-image: url(../img/section04_m.jpg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 80px 24px;
  position: relative;
  width: 100%;
  aspect-ratio: 412/780;
  box-sizing:border-box;
}


.x412 .container-13 {
  align-items: center;
  display: inline-flex;
  gap: 16px;
  max-width: 1200px;
}

.x412 .container-14 {
  align-items: center;
  display: inline-flex;
  gap: 30px;
  justify-content: center;
  max-width: 600px;
}

.x412 .text-59 {
  align-items: center;
  color: var(--coffee-bean);
  display: flex;
  font-family: var(--font-family-noto_serif_kr);
  font-size: 38px;
  font-weight: 400;
  justify-content: center;
  letter-spacing: -1.14px;
  line-height: 40.8px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .text-60 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 33.6px;
  position: relative;
  text-align: center;
  width: fit-content;
}

.x412 .span-9 {
  letter-spacing: -0.17px;
}

.x412 .vector-82-1 {
  height: 50px;
  position: relative;
  width: 1px;
}

.x412 .frame-354-1 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
  position: relative;
}

.x412 .text-61 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.60px;
  line-height: 26.0px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .link-1 a {
  align-items: flex-start;
  border: 1px solid;
  border-color: var(--kabul);
  display: inline-flex;
  flex: 0 0 auto;
  padding: 12px 50px;
  position: relative;
  font-size:inherit;
  color:inherit;
}

.x412 .text-62 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: -0.72px;
  line-height: 27.2px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

.x412 .container {
  flex: 0 0 auto;
  flex-direction: column;
  position: relative;
}

.x412 .heading-2 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  position: relative;
}

.x412 .icon {
  background-image: url(../img/path-25.svg);
  background-size: 100% 100%;
  height: 21px;
  position: relative;
  width: 21px;
}

.x412 .text-4 {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
  width: fit-content;
}
@media screen and (max-width: 1099px) {
  .screen.index { 
    display: none;
   }
  .screen.x1280 { 
    display: none;
   }

   .x412 .hero-1{aspect-ratio:412/740; background:url(../img/00_main_m.jpg) no-repeat center center; background-size:cover; justify-content:flex-start; align-items: center;}
   .x412 .text-10{flex-direction: row;}
}
@media screen and (min-width: 1100px) and (max-width: 1599px) {
  .screen.index { 
    display: none;
   }
  .screen.x412 { 
    display: none;
   }
}
@media screen and (min-width: 1600px) {
  .screen.x412 { 
    display: none;
   }
  .screen.x1280 { 
    display: none;
   }
}

@media (max-width:412px){ 
  .x412 .text-9 br,
  .x412 .text-9 br{display:none;}
  .x412 .span1-12{font-size:9vw;}
  .x412 .text-56,
  .x412 .text-5-1{display:block; text-align:left; word-break: keep-all;}
  .x412 .span-6{font-size:4.2vw;}
  .x412 .text-59,
  .x412 .text-43,
  .x412 .span2-2,
  .x412 .text-35{font-size:9.22vw;}
  .x412 .text-4{font-size:4vw;}
  .x412 .pretendard-light-kabul-24px,
  .x412 .pretendard-bold-kabul-24px{font-size:5.8vw;}
}


