.middle-line {
  border-right: 0.0625rem solid;
  display: inline-block;
  position: absolute;
  width: 50%;
  height: 15.625rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .middle-line {
    height: 12.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .middle-line {
    height: 7.5rem;
  }
}

picture {
  display: block;
}
picture > img {
  width: 100%;
  height: 100%;
  display: inline-block;
  object-fit: cover;
  object-position: center;
}

.story-top {
  width: clamp(87.5rem, 100%, 100%);
  height: 37.625rem;
  background: url(../../../images/story/story-main.png) no-repeat center/cover;
  color: #FFF;
  text-align: center;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .story-top {
    width: 100%;
    background: url(../../../images/story/mobile/story-main_t.png) no-repeat center/cover;
  }
}
@media only screen and (max-width: 599px) {
  .story-top {
    width: 100%;
    height: 31.375rem;
    background: url(../../../images/story/mobile/story-main_m.png) no-repeat center/cover;
  }
}
.story-top > .container {
  padding-top: 18.9375rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .story-top > .container {
    padding-top: 19.625rem;
  }
}
@media only screen and (max-width: 599px) {
  .story-top > .container {
    padding-top: 15.25rem;
  }
}
.story-top__title {
  font-family: "JejuMyeongjo";
  margin-bottom: 1rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .story-top__title {
    margin-bottom: 0.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .story-top__title {
    margin-bottom: 0.5rem;
  }
}
.story-top__title + p {
  font-weight: 300;
  color: #FFFFFF;
}

.homepage {
  margin-block: 10rem;
  position: relative;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .homepage {
    margin-block: 7.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .homepage {
    margin-block: 5rem;
  }
}

.chim {
  display: block;
  width: 65rem;
  height: 44rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .chim {
    width: 40.5rem;
    height: 27.4375rem;
  }
}
@media only screen and (max-width: 599px) {
  .chim {
    width: 18.75rem;
    height: 12.6875rem;
  }
}

.duchim {
  width: 35rem;
  height: 29.75rem;
  position: absolute;
  top: 50%;
  right: 7.4375rem;
  transform: translateY(-50%);
  padding: 5rem 5rem 5rem 3.75rem;
  color: #FFF;
  background: rgba(78, 163, 234, 0.8);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .duchim {
    width: 35rem;
    height: 21.125rem;
    padding: 3.75rem 2.5rem;
    top: 70%;
    right: 2.4375rem;
  }
}
@media only screen and (max-width: 599px) {
  .duchim {
    width: 18.75rem;
    height: 18.1875rem;
    padding: 1.5rem;
    padding-inline: 2.5rem;
    position: static;
    transform: translate(8%, -15%);
  }
}
.duchim .title-text {
  font-family: "JejuMyeongjo";
}
.duchim__text {
  margin-top: 1rem;
  font-weight: 300;
  color: #FFFFFF;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .duchim__text {
    margin-top: 0.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .duchim__text {
    margin-top: 0.25rem;
  }
}
.duchim__link {
  margin-top: 4.625rem;
  display: inline-block;
  padding: 0.875rem 2.5rem;
  font-size: 1.125rem;
  line-height: 1.6875rem;
  cursor: pointer;
  border-radius: 4.8125rem;
  transition: all 0.4s ease-in-out;
  color: #FFF;
  border: 0.0625rem solid #E1E1E4;
  border-radius: 4.8125rem;
  backdrop-filter: blur(0.3125rem);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .duchim__link {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0.6875rem 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .duchim__link {
    font-size: 0.875rem;
    line-height: 1.3125rem;
    padding: 0.4375rem 1.875rem;
  }
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .duchim__link {
    margin-top: 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .duchim__link {
    margin-top: 1.25rem;
  }
}
.duchim__link:hover {
  color: #4EA3EA;
  background-color: #FFF;
}

.problem {
  width: clamp(87.5rem, 100%, 100%);
  padding-block: 5rem;
  text-align: center;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem {
    padding-block: 3.75rem;
    width: 100%;
  }
}
@media only screen and (max-width: 599px) {
  .problem {
    padding-block: 2.5rem;
    width: 100%;
  }
}
.problem__title {
  font-family: "JejuMyeongjo";
  font-size: 3.75rem;
  line-height: 4.875rem;
  font-weight: 400;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem__title {
    font-size: 3rem;
    line-height: 3.875rem;
    padding-inline: 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .problem__title {
    width: 70%;
    margin: 0 auto;
    font-size: 1.875rem;
    line-height: 2.625rem;
    padding-inline: 1.25rem;
  }
}
.problem__intro {
  width: 51rem;
  margin: 0 auto;
  margin-top: 1.5rem;
  font-weight: 300;
  font-size: 1.375rem;
  line-height: 2.0625rem;
  color: #767676;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem__intro {
    width: 100%;
    font-size: 1.125rem;
    line-height: 1.6875rem;
    margin-top: 1rem;
    padding-inline: 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .problem__intro {
    width: 100%;
    font-size: 1rem;
    line-height: 1.5rem;
    margin-top: 1rem;
    padding-inline: 1.25rem;
  }
}
.problem__solution {
  margin-top: 5rem;
  font-size: 1.625rem;
  line-height: 2.275rem;
  font-weight: 600;
  color: #4EA3EA;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem__solution {
    margin-top: 3.75rem;
    font-size: 1.375rem;
    line-height: 2.0625rem;
    padding-inline: 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .problem__solution {
    margin-top: 2.5rem;
    font-size: 1.125rem;
    line-height: 1.6875rem;
    padding-inline: 1.25rem;
  }
}
.problem__solution > .mbr {
  display: none;
}
@media only screen and (max-width: 599px) {
  .problem__solution > .mbr {
    display: block;
  }
}
.problem__img {
  margin-top: 2.5rem;
  width: 100%;
  height: 34.5rem;
  overflow: hidden;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem__img {
    width: 100%;
    margin-top: 2rem;
    height: 22.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .problem__img {
    width: 100%;
    margin-top: 1.5rem;
    height: 11.25rem;
  }
}
.problem__img .wrap {
  width: max-content;
  display: flex;
  flex-flow: row nowrap;
  gap: 2.5rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.problem__img img {
  display: inline-block;
  width: 57.5rem;
  height: inherit;
  background-color: #767676;
  object-fit: cover;
  object-position: center;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .problem__img img {
    width: 37.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .problem__img img {
    width: 18.75rem;
  }
}

.do {
  width: clamp(87.5rem, 100%, 100%);
  position: relative;
  padding-block: 18.125rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do {
    padding-block: 22.6875rem;
    width: 100%;
  }
}
@media only screen and (max-width: 599px) {
  .do {
    padding-block: 15.625rem;
    width: 100%;
  }
}
.do .middle-line:nth-of-type(1) {
  top: 0;
  border-image: linear-gradient(to bottom, rgba(78, 163, 234, 0) 0%, #4EA3EA 100%);
  border-image-slice: 1;
}
.do .middle-line:nth-of-type(2) {
  bottom: 0;
  border-image: linear-gradient(to top, rgba(78, 163, 234, 0) 0%, #4EA3EA 100%);
  border-image-slice: 1;
}
.do::before {
  content: "The Best way of tinnitus treatment technology";
  display: inline-block;
  position: absolute;
  top: 15.625rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12.5rem;
  line-height: 12.5rem;
  font-weight: 400;
  color: #F1F1F5;
  font-family: "JejuMyeongjo";
  text-align: center;
  width: clamp(80%, 100%, 105.1875rem);
  opacity: 0.6;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do::before {
    top: 12.5rem;
    font-size: 9.375rem;
    line-height: 9.375rem;
    width: 100%;
  }
}
@media only screen and (max-width: 599px) {
  .do::before {
    top: 12.25rem;
    font-size: 4.5rem;
    line-height: 5rem;
    width: 100%;
  }
}

.do-box {
  position: relative;
}
.do-box > .sub-title {
  font-size: 2.25rem;
  line-height: 2.925rem;
  font-weight: 400;
  position: absolute;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do-box > .sub-title {
    font-size: 1.625rem;
    line-height: 2.125rem;
  }
}
@media only screen and (max-width: 599px) {
  .do-box > .sub-title {
    font-size: 1.375rem;
    line-height: 2.0625rem;
  }
}
.do-box > .sub-title > span {
  display: block;
}
.do-box > .sub-title .strong {
  color: #4EA3EA;
  font-weight: 700;
}
.do-box > .sub-title:nth-of-type(1) {
  text-align: start;
  top: 1.25rem;
  left: 1.25rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do-box > .sub-title:nth-of-type(1) {
    top: -20%;
    left: 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .do-box > .sub-title:nth-of-type(1) {
    top: -25%;
    left: 1.25rem;
  }
}
.do-box > .sub-title:nth-of-type(2) {
  text-align: start;
  bottom: 0;
  right: 1.25rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do-box > .sub-title:nth-of-type(2) {
    bottom: -15%;
    right: 1.9375rem;
  }
}
@media only screen and (max-width: 599px) {
  .do-box > .sub-title:nth-of-type(2) {
    bottom: -20%;
    right: 2.5rem;
  }
}
.do-box > .product {
  width: 87.5rem;
  height: 45.625rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .do-box > .product {
    width: 100%;
    height: 30.1875rem;
  }
}
@media only screen and (max-width: 599px) {
  .do-box > .product {
    width: 100%;
    height: 18.1875rem;
  }
}

.history {
  text-align: center;
  padding-block: 7.5rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history {
    padding-block: 5rem;
  }
}
@media only screen and (max-width: 599px) {
  .history {
    padding-block: 3.75rem;
  }
}
.history > h2 {
  font-size: 5rem;
  line-height: 6rem;
  font-weight: 400;
  font-family: "JejuMyeongjo";
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history > h2 {
    font-size: 3.75rem;
    line-height: 4.875rem;
  }
}
@media only screen and (max-width: 599px) {
  .history > h2 {
    font-size: 3rem;
    line-height: 3.875rem;
  }
}
.history__wrapper {
  margin-top: 5rem;
  position: relative;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__wrapper {
    margin-top: 3.75rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__wrapper {
    margin-top: 3.75rem;
  }
}
.history__wrapper::before {
  content: "The Best way of tinnitus treatment technology";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  transform: translate(-50%, -50%);
  font-size: 12.5rem;
  line-height: 12.5rem;
  font-weight: 300;
  color: #F1F1F5;
  opacity: 0.6;
  font-family: "JejuMyeongjo";
  text-align: center;
  width: clamp(80%, 90%, 105.1875rem);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__wrapper::before {
    width: 100%;
    font-size: 9.25rem;
    line-height: 11.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__wrapper::before {
    width: 100%;
    font-size: 4.5rem;
    line-height: 6.5rem;
  }
}
.history__list {
  margin-top: 6.25rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__list {
    margin-top: 5rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__list {
    margin-top: 2.5rem;
  }
}
.history__list--title {
  font-size: 3rem;
  line-height: 3.9rem;
  font-weight: 400;
  color: #4EA3EA;
  font-family: "JejuMyeongjo";
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__list--title {
    font-size: 2.5rem;
    line-height: 3.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__list--title {
    font-size: 1.75rem;
    line-height: 2.4375rem;
  }
}
.history__list .year {
  display: inline-block;
  margin-left: 0.25rem;
  font-size: 2.25rem;
  line-height: 2.925rem;
  color: #4EA3EA;
  font-weight: 300;
  font-family: "Klee One";
  vertical-align: text-bottom;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__list .year {
    font-size: 1.625rem;
    line-height: 2.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__list .year {
    font-size: 1.375rem;
    line-height: 1.9375rem;
  }
}
.history__item {
  display: block;
  margin-top: 1.5rem;
  font-size: 1.75rem;
  line-height: 2.45rem;
  font-weight: 300;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .history__item {
    margin-top: 1.25rem;
    font-size: 1.625rem;
    line-height: 2.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .history__item {
    margin-top: 1rem;
    font-size: 1.125rem;
    line-height: 1.6875rem;
  }
}

.product-banner {
  width: clamp(87.5rem, 100%, 100%);
  padding-block: 13.75rem;
  background: url(../../../images/story/product-banner_bg.png) no-repeat center/cover;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .product-banner {
    width: 100%;
    padding-block: 7.5625rem;
    background: url(../../../images/story/mobile/product-banner_bg_t.png) no-repeat center/cover;
  }
}
@media only screen and (max-width: 599px) {
  .product-banner {
    width: 100%;
    padding-top: 3.75rem;
    padding-bottom: 5.75rem;
    background: url(../../../images/story/mobile/product-banner_bg_m.png) no-repeat center/cover;
  }
}
.product-banner__information > .main-color {
  font-weight: 600;
}
.product-banner__information > h2 {
  font-family: "JejuMyeongjo";
  margin-top: 1.25rem;
  font-weight: 400;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .product-banner__information > h2 {
    margin-top: 1rem;
  }
}
@media only screen and (max-width: 599px) {
  .product-banner__information > h2 {
    margin-top: 0.5rem;
  }
}
.product-banner__information > p {
  color: #767676;
  font-weight: 300;
  margin-top: 1rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .product-banner__information > p {
    margin-top: 0.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .product-banner__information > p {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    line-height: 1.3125rem;
  }
}
.product-banner__link {
  border: 0.0625rem solid #E1E1E4;
  margin-top: 2.5rem;
  display: inline-block;
  padding: 0.875rem 2.5rem;
  font-size: 1.125rem;
  line-height: 1.6875rem;
  cursor: pointer;
  border-radius: 4.8125rem;
  transition: all 0.4s ease-in-out;
  backdrop-filter: blur(0.1875rem);
  background: rgba(255, 255, 255, 0.1019607843);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .product-banner__link {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0.6875rem 2.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .product-banner__link {
    font-size: 0.875rem;
    line-height: 1.3125rem;
    padding: 0.4375rem 1.875rem;
  }
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .product-banner__link {
    margin-top: 2rem;
  }
}
@media only screen and (max-width: 599px) {
  .product-banner__link {
    margin-top: 1.25rem;
  }
}
.product-banner__link:hover {
  color: #FFF;
  background-color: #4EA3EA;
}

.special {
  width: clamp(87.5rem, 100%, 100%);
  padding-block: 10rem;
  background: url(../../../images/story/special-bg.png) no-repeat center/cover;
  text-align: center;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special {
    width: 100%;
    padding-block: 7.5rem;
    background: url(../../../images/story/mobile/special-bg_t.png) no-repeat center/cover;
  }
}
@media only screen and (max-width: 599px) {
  .special {
    width: 100%;
    padding-block: 3.75rem;
    background: url(../../../images/story/mobile/special-bg_m.png) no-repeat center/cover;
  }
}
.special__title {
  font-family: "JejuMyeongjo";
  font-size: 3.75rem;
  line-height: 4.875rem;
  font-weight: 400;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special__title {
    font-size: 3rem;
    line-height: 3.875rem;
  }
}
@media only screen and (max-width: 599px) {
  .special__title {
    font-size: 1.875rem;
    line-height: 2.625rem;
  }
}
.special__text {
  margin-top: 1.25rem;
  color: #505050;
  font-weight: 300;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special__text {
    margin-top: 1rem;
  }
}
@media only screen and (max-width: 599px) {
  .special__text {
    margin-top: 0.5rem;
    padding-inline: 0.9375rem;
  }
}
.special__text .mbr {
  display: none;
}
@media only screen and (max-width: 599px) {
  .special__text .mbr {
    display: block;
  }
}

.special-box {
  margin-top: 3.75rem;
  display: flex;
  flex-flow: row nowrap;
  gap: 2.5rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special-box {
    margin-top: 2.5rem;
    flex-flow: column nowrap;
    gap: 2rem;
    align-items: center;
  }
}
@media only screen and (max-width: 599px) {
  .special-box {
    margin-top: 2rem;
    flex-flow: column nowrap;
    gap: 1.5rem;
    align-items: center;
  }
}
.special-box__item {
  width: 33.3333333333%;
  height: 14.375rem;
  border: 0.0625rem solid;
  border-image: linear-gradient(105.28deg, #E0EDF7 0%, #C2DEF5 72%, #8EC4F2 100%);
  border-image-slice: 1;
  display: flex;
  flex-flow: column nowrap;
  gap: 1rem;
  justify-content: center;
  align-items: center;
  padding-inline: 2.5rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special-box__item {
    width: 27.5rem;
    height: 12.75rem;
  }
}
@media only screen and (max-width: 599px) {
  .special-box__item {
    width: 100%;
    height: 11.25rem;
    padding-inline: 2rem;
    gap: 0.5rem;
  }
}
.special-box__item:nth-of-type(1) .special-box__icon {
  background: url(../../../images/story/hope.svg) no-repeat center/auto;
}
.special-box__item:nth-of-type(2) .special-box__icon {
  background: url(../../../images/story/ear.svg) no-repeat center/auto;
}
.special-box__item:nth-of-type(3) .special-box__icon {
  background: url(../../../images/story/doc.svg) no-repeat center/auto;
}
.special-box__icon {
  width: 3.75rem;
  height: 3.75rem;
}
.special-box__text {
  color: #767676;
  font-weight: 400;
}
.special-box__text .mbr {
  display: none;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .special-box__text {
    width: 90%;
  }
}
@media only screen and (max-width: 599px) {
  .special-box__text br:not(.mbr) {
    display: none;
  }
  .special-box__text .mbr {
    display: block;
  }
}

.certification {
  width: clamp(87.5rem, 100%, 100%);
  padding-block: 7.5rem;
  text-align: center;
  background: url(../../../images/story/certification-bg.png) no-repeat center/cover;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .certification {
    width: 100%;
    padding-block: 5rem;
    background: url(../../../images/story/mobile/certification-bg_t.png) no-repeat center/cover;
  }
}
@media only screen and (max-width: 599px) {
  .certification {
    width: 100%;
    padding-block: 3.75rem;
    background: url(../../../images/story/mobile/certification-bg_m.png) no-repeat center/cover;
  }
}
.certification__title {
  margin-top: 1.25rem;
  font-size: 5rem;
  line-height: 6rem;
  font-weight: 400;
  font-family: "JejuMyeongjo";
  letter-spacing: 3.125rem;
  text-indent: 3.125rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .certification__title {
    margin-top: 1rem;
    font-size: 3.75rem;
    line-height: 4.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .certification__title {
    margin-top: 0.5rem;
    font-size: 3rem;
    line-height: 3.6rem;
  }
}

.certificate-box {
  display: flex;
  flex-flow: row nowrap;
  gap: 2.5rem;
  width: fit-content;
  margin: 0 auto;
  margin-top: 2.5rem;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .certificate-box {
    margin-top: 2rem;
  }
}
@media only screen and (max-width: 599px) {
  .certificate-box {
    margin-top: 1.5rem;
    gap: 1.25rem;
  }
}
.certificate-box > .certificate {
  width: 20rem;
  height: 28.25rem;
  position: relative;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .certificate-box > .certificate {
    width: 18.75rem;
    height: 26.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .certificate-box > .certificate {
    width: 9.375rem;
    height: 13.1875rem;
  }
}
.certificate-box > .certificate::after {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50.14%);
  backdrop-filter: blur(0.125rem);
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .certificate-box > .certificate::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.8) 80.14%);
  }
}
@media only screen and (max-width: 599px) {
  .certificate-box > .certificate::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.8) 80.14%);
  }
}
.certificate-box > .certificate:nth-of-type(2)::after {
  height: 85%;
}

.bottom-banner {
  width: clamp(87.5rem, 100%, 100%);
  height: 31.25rem;
  background: url(../../../images/story/chim-banner.png) no-repeat center/cover;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  font-family: "JejuMyeongjo";
  font-size: 2rem;
  line-height: 2.8rem;
  font-weight: 300;
  color: #FFF;
  text-align: center;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .bottom-banner {
    width: 100%;
    height: 25rem;
    background: url(../../../images/story/mobile/chim-banner_t.png) no-repeat center/cover;
    padding-inline: 8.875rem;
    font-size: 1.5rem;
    line-height: 2.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .bottom-banner {
    width: 100%;
    height: 15.625rem;
    background: url(../../../images/story/mobile/chim-banner_m.png) no-repeat center/cover;
    padding-inline: 1.625rem;
    padding-block: 4.4375rem;
    font-size: 1.125rem;
    line-height: 1.6875rem;
    display: block;
  }
}
.bottom-banner span {
  display: block;
}
@media only screen and (max-width: 599px) {
  .bottom-banner span {
    display: inline;
  }
}