@media screen and (max-width: 1760px) {
  .process__box {
    padding: 4.54vw 2.84vw;
  }
}
@media screen and (max-width: 1600px) {
  .header__lists li {
    margin: 0 20px;
  }
  .header, .survey__left, .survey__box, .survey__process {
    padding-left: 20px;
    padding-right: 20px;
  }
  .step02__process li::after {
    right: 0;
  }

  #section__weact .title__area {
    top: 6.25vw;
  }
  .weact__box {
    padding: 5.62vw 3.12vw 5.62vw 7.5vw;
  }
  .information__navigation {
    right: 80px;
  }

  .popup__box {
    padding: 9.375vw 100px;
  }
  .popup__logo {
    width: 33.75vw;
  }
  .popup__title {
    margin: 100px 10px;
  }
  .popup__title span,
  .popup__title strong {
    font-size: 5.625vw;
  }
  .process__box01 .process__title span {
    font-size: 3.43vw;
  }
  .popup__title > span:first-child:before,
  .popup__title > span:last-child:after {
    width: 35px;
    height: 35px;
  }
  .popup__title > span:first-child::before {
    left: -55px;
  }
  .popup__title > span:last-child::after {
    bottom: 4.375vw;
    right: -60px;
  }
  .popup__name {
    min-width: 250px;
    border-radius: 50px;
    font-size: 2.5vw;
    padding: 14px 0 10px;
  }

}

@media screen and (max-width: 1400px) and (min-width: 1024px) {
  .header__lists li {
    font-size: 1.71vw;
    margin: 0 2.85vw;
  }
  .btn__translate {
    font-size: 1.71vw;
    margin-left: 2.85vw;
    width: 7.5vw;
  }

  /* 공통 */
  .section {
    /* min-height: 100vh; */
  }
  .section__title {
    font-size: 12.85vw;
  }
  .section__title--sub {
    font-size: 4.28vw;
  }
  .txt--underline {
    text-underline-offset: 0.5vw;
    text-decoration-thickness: 0.14vw;
  }

  /* section__visual */
  .visual__title {
    font-size: 11.42vw;
  }
  .section__title--big {
    font-size: 10.71vw;
  }
  .visual__txt--tit {
    font-size: 4.28vw;
  }
  .visual__txt--des {
    margin: 3.57vw 0;
    padding: 4.28vw 0;
  }
  .des__txt {
    font-size: 1.71vw;
  }

  /* section__partnership */
  .partnership__title {
    font-size: 7.14vw;
  }

  /* section__weact */
  #section__weact .title__area {
    top: 0;
  }
  .weact__box {
    /* padding: 6.42vw 3.57vw 6.42vw 8.57vw; */
    padding: 50px 60px;
  }
  .box--sub {
    font-size: 2vw;
    margin-bottom: 1.42vw;
  }
  .box--tit {
    font-size: 3.57vw;
  }

  /* #section__process */
  .process__title {
    font-size: 4.28vw;
  }
  #section__process .title__area::after {
    bottom: 0;
  }
  .process__box {
    /* padding: 5.71vw; */
  }
  .process__box01 .process__title span {
    font-size: 3.4vw;
  }
  .process__des {
    font-size: 1.42vw;
  }
  .process__box01 .process__des {
    font-size: 1.57vw;
  }
  .step02__process {
    flex-direction: column;
    gap: 30px;
  }
  .step02__process li::after {
    display: none;
  }
  .step02__order {
    flex-basis: 100%;
    display: flex;
    align-items: center;
    gap: 30px;
  }
  .step02__order02 br {
    display: block;
  }
  .step02__order03 {
    align-items: flex-start;
  }
  .process__des--tag,
  .process__des--sm {
    font-size: 1vw;
  }
  .process__des--sm {
    position: initial;
  }
  .process__des--sm br {
    display: none;
  }
  .section__des {
    font-size: 1.42vw;
  }
  #section__process .section__des li {
    /* padding-left: 2.42vw; */
  }
  #section__process .section__des li::before {
    /* width: 1.71vw;
    height: 1.71vw; */
    top: 1.05vw;
  }


  /* section__survey */
  .survey__inner {
    /* min-height: auto; */
  }
  #section__survey .section__title--sub,
  #section__process .section__title--sub {
    font-size: 3.28vw;
  }
  #section__survey .section__title,
  .survey__title {
    font-size: 5vw;
  }

  .wordcloud__title {
    font-size: 5.71vw;
  }
  .survey__btn-wrap {
    gap: 2.14vw 1.42vw;
  }
  .btn__wordcloud {
    font-size: 1.57vw;
    padding: 1.42vw 10px;
  }

  /* section__wordcloud */
  .wordcloud__logo {
    width: 38.57vw;
  }
  .wordcloud__result {
    margin-right: 0;
  }

  /* section__information */
  .information__title--sub {
    font-size: 4.28vw;
  }
  .information__navigation {
    top: 17.14vw;
  }
  #information__swiper {
    margin-top: -4.28vw;
  }
  
  /* thankyou */
  .thankyou__box {
    padding-left: 20px;
    padding-right: 20px;
  }
  .thankyou01__title {
    font-size: 5.71vw;
  }
  .thankyou__sub {
    font-size: 2.14vw;
  }
  .thankyou01__steps {
    flex-direction: column;
  }
  .thankyou01__steps li {
    padding: 20px;
  }
  .thankyou__box02::after {
    width: 8.57vw;
    height: 8.57vw;
    right: 0;
  }
  .thankyou02__title {
    font-size: 5vw;
  }

  /* section__maeum */
  .btn__maeum {
    width: calc(50% - 10px);
    font-size: 3vw;
    padding-left: 50px;
    padding-right: 50px;
  }
  .btn__maeum::after {
    width: 5vw;
    height: 5vw;
    top: 50px;
    right: 50px;
  }

  .popup__box {
    background-position: 50% 100%;
  }


}

@media screen and (max-width: 1023px) {
  .pc-only {
    display: none;
  }
  .m-only {
    display: block;
  }
  /* header */
  .header--mobile {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
  }
  .header {
    display: none;
  }
  .header__logo {
    max-width: 100%;
    text-align: center;
    padding: 30px 20px;
  }
  .header__logo img {
    width: 100%;
    max-width: 300px;
  }
  /* .section:not(#section__visual) .header {
    display: none;
  }
  .section:not(#section__visual) .nav__scroll {
    display: none;
  } */
  .nav__scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border-top: 1px solid rgba(255, 255, 255, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    background: #1CABE2;
  }
  .header--mobile.fixed .nav__scroll {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
  }
  nav {
    width: 100%;
    min-width: fit-content;
    justify-content: center;
    padding: 15px 20px;
    white-space: nowrap;
  }
  .header__lists li {
    font-size: 16px;
    margin: 0 24px;
    flex-shrink: 0;
    opacity: 0.5;
  }
  .header__lists li.on {
    opacity: 1;
  }
  .header__lists li:first-child {
    margin-left: 0;
  }
  .btn__translate {
    font-size: 13px;
    width: 66px;
    line-height: 27px;
    border-radius: 30px;
    margin-left: 24px;
  }

  /* btn__floating */
  #btn__floating {
    width: calc(100% - 20px);
    padding: 18px 36px;
    right: 10px;
    bottom: 10px;
  }
  .floating__tit {
    font-size: 19px;
    line-height: 1.6em;
  }
  .floating__tit strong {
    font-size: 24px;
  }
  .floating__img {
    width: 48px;
  }

  /* 공통 */
  .txt--underline {
    text-underline-offset: 5px;
    text-decoration-thickness: 2px;
  }
  .slide__navigation {
    width: 128px;
    margin-left: auto;
  }
  .btn__slide {
    width: 18px;
    height: 18px;
  }
  .btn--next {
    margin-left: 24px;
  }
  .fraction {
    font-size: 14px;
  }

  .section {
    padding: 70px 0;
    /* min-height: auto; */
  }
  .section__title--sub {
    font-size: 30px;
  }
  .section__title {
    font-size: 80px;
  }

  /* section__visual */
  #section__visual {
    padding-top: 0;
    /* background: #1CABE2; */
  }
  .visual--video {
    padding-top: 200px;
    padding-bottom: 50px;
  } 
  .visual--together {
    padding: 70px 0;
  }
  .visual__title {
    font-size: 44px;
    margin-top: 0;
  }
  .section__title--big {
    font-size: 40px;
  }
  .video__box {
    margin-top: 20px;
  }
  .visual__txt--des {
    padding: 35px 0;
    margin: 35px 0;
  }
  .des__txt {
    font-size: 16px;
  }
  .visual__txt--tit {
    font-size: 32px;
  }

  /* section__partnership */
  #section__partnership {
    padding-bottom: 70px;
  }
  #section__partnership .title__area {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
  }
  .partnership__title {
    font-size: 70px;
  }
  .slide__img {
    margin-bottom: 20px;
  }
  .cont--tit span {
    font-size: 18px;
  }
  .cont--des {
    font-size: 14px;
    margin: 10px 0 20px;
  }
  .cont--date {
    font-size: 10px;
  }
  
  

  /* section__weact */
  #section__weact {
    padding-bottom: 70px;
  }
  #section__weact .title__area {
    position: initial;
    text-align: center;
    margin-bottom: 50px;
  }
  .weact__content {
    flex-direction: column-reverse;
    align-items: center;
  }
  .weact__navigation {
    top: 20px;
    right: 20px;
  }
  #weact__swiper {
    width: 100%;
  }
  .weact__box {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 50px 20px;
  }
  .box--icon {
    width: 50px;
  }
  .box--sub {
    font-size: 18px;
    margin: 20px 0 15px;
  }
  .box--tit {
    font-size: 28px;
  }

  #section__process .title__area::after {
    width: 55px;
    height: 55px;
    bottom: 0;
  }
  
  #section__survey .section__title--sub, 
  #section__process .section__title--sub {
    font-size: 26px;
  }
  #section__survey .section__title, 
  #section__process .section__title {
    font-size: 46px;
    margin: 20px 0;
  }
  .section__des {
    font-size: 15px;
    line-height: 1.73em;
  }
  #section__process .section__des li {
    /* padding-left: 30px; */
  }
  #section__process .section__des li:before {
    /* width: 20px;
    height: 20px; */
  }
  #section__process .section__des li::before {
    /* top: 3px; */
    top: 9px;
  }


  /* section__process */
  .process__inner {
    padding: 0 10px;
  }
  #section__process .title__area {
    padding: 0 10px;
  }
  .process__content {
    flex-direction: column;
    padding: 0 10px;
    margin-top: 50px;
  }
  .process__box {
    width: 100%;
    padding: 40px 20px;
  }
  .process__order {
    font-size: 16px;
    font-weight: 600;
  }
  .process__title {
    font-size: 35px;
    margin: 20px 0 25px;
  }
  .process__box01 .process__des,
  .process__des {
    font-size: 16px;
  }
  .process__box01 {
    border-right: none;
    border-bottom: 1px solid #E8E8E8;
  }
  .process__box01 .process__des {
    padding-left: 75px;
  }
  .process__box01 .process__des::before,
  .process__icon {
    width: 55px;
    height: 55px;
  }
  .step02__process {
    flex-direction: column;
    gap: 30px;
  }
  .step02__process li::after {
    display: none;
  }
  .step02__order {
    flex-basis: 100%;
    display: flex;
    align-items: center;
    gap: 30px;
  }
  .step02__order03 {
    align-items: flex-start;
  }
  .process__icon {
    margin-bottom: 0;
  }
  .btn__support {
    margin-top: 40px;
  }
  .process__box02 {
    padding-bottom: 0;
  }
  .process__box02 .section__des {
    width: calc(100% + 60px);
    margin-left: -30px;
    padding: 20px 30px 25px;
    background: #EBEEF6;
  }
  .process__des--sm {
    position: initial;
  }
  .process__des--tag {
    font-size: 13px;
    position: 6px 10px;
  }

  /* section__survey */
  #section__survey {
    padding: 0;
  }
  .survey__inner {
    /* min-height: auto; */
    flex-direction: column;
    background: #374EA2;
    padding-bottom: 70px;
  }
  .survey__left {
    width: 100%;
    padding: 50px 20px;
    position: relative;
  }
  #survey__swiper {
    width: calc(100% - 20px);
    background: #fff;
  }
  .survey__pagination {
    gap: 15px;
    position: absolute;
    bottom: -70px !important;
    top: initial !important;
    left: 40px !important;
    z-index: 10;
  }
  .survey__pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #77777A;
  }
  .survey__pagination .swiper-pagination-bullet-active {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 8px;
    background: #2D2926;
  }
  .survey__order {
    display: none;
  }
  .survey__title {
    font-size: 36px;
    margin: 0 0 30px;
  }
  .survey__btn-wrap {
    gap: 10px;
  }
  .btn__wordcloud {
    width: calc((100% - 10px) / 2);
    min-height: 44px;
    font-size: 14px;
    padding: 7px;
  }
  .survey__box:nth-of-type(2) .btn__wordcloud {
    min-height: 50px;
  }
  .survey__box:nth-of-type(3) .btn__wordcloud {
    width: 100%;
  }
  .survey__process {
    padding-bottom: 30px;
    margin-top: 30px;
  }
  .btn__prev, .btn__next, .btn__last {
    font-size: 18px;
    line-height: 50px;
    height: fit-content;
  }
  .btn__prev {
    width: 80px;
    line-height: 48px;
  }


  /* popup */
  .popup__box {
    padding: 80px 20px;
    background-position: 50% 100%;
  }
  .popup__close {
    width: 40px;
    height: 40px;
    top: 20px;
    right: 20px;
  }
  .popup__close img {
    width: 100%;
  }
  .popup__content {
    align-items: center;
    height: 100%;
  }
  .popup__logo {
    width: 300px;
  }
  .popup__title {
    text-align: center;
    margin: 40px 30px;
    position: relative;
  }
  /* .popup__title strong::before {
    height: 44px;
    background-size: 100% 100%;
    background-position: 0 10px;
  } */
  .popup__title span, 
  .popup__title strong {
    font-size: 46px;
  }
  .process__box01 .process__title span {
    font-size: 35px;
  }
   .popup__title strong {
    background-size: 100% 44px;
    background-position: 0 10px;
   }
  .popup__title > span:first-child:before, 
  .popup__title > span:last-child:after {
    display: none;
  }
  .popup__title::before,
  .popup__title::after {
    content:'';
    display: block;
    width: 19px;
    height: 16px;
    position: absolute;
  }
  .popup__title::before {
    background: url(https://cdn.unicef.or.kr/images/together-for-tomorrow/assets/images/together-for-tomorrow/quotes_l@2x.png) no-repeat 0 0 / contain;
    top: 0;
    left: -20px;
  }
  .popup__title::after {
    background: url(https://cdn.unicef.or.kr/images/together-for-tomorrow/assets/images/together-for-tomorrow/quotes_r@2x.png) no-repeat 0 0 / contain;
    right: -30px;
    bottom: 40px;
  }
  .popup__name {
    min-width: 160px;
    font-size: 24px;
    font-weight: lighter;
    padding: 8px 48px 6px;
    position: absolute;
    right: 30px;
    bottom: 30px;
  }

  /* .thankyou */
  .thankyou__inner {
    flex-direction: column;
  }
  .thankyou__box {
    width: 100%;
    padding: 70px 20px;
  }
  .thankyou__box02 {
    border-top: none;
  }
  .thankyou__box02::after {
    display: none;
  }
  .thankyou01__title {
    font-size: 50px;
    margin-bottom: 20px;
  }
  .thankyou02__title {
    font-size: 46px;
    margin: 20px 0;
  }
  .thankyou__sub {
    font-size: 20px;
  }
  .thankyou__sm {
    font-size: 12px;
    margin-top: 15px;
  }
  .thankyou01__steps {
    flex-direction: column;
    gap: 15px;
    margin: 50px 0 15px;
  }
  .thankyou01__steps li {
    flex-direction: row;
    gap: 30px;
    padding: 30px 50px;
    border-radius: 18px;
  }
  .thankyou01__steps--order {
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    margin-bottom: 0;
  }
  .thankyou__des {
    font-size: 16px;
    text-align: left;
  }
  .txt--tag {
    font-size: 12px;
    padding: 3px 7px 4px;
  }
  .thankyou__noti-box {
    padding: 40px 20px;
    border-radius: 18px;
    margin-bottom: 30px;
  }
  .thankyou__noti--wht {
    font-size: 15px;
    line-height: 1.6em;
    text-align: left;
  }
  .thankyou__noti--wht > span {
    margin-bottom: 20px;
    padding-left: 26px;
  }
  .thankyou__noti--wht img {
    width: 20px;
  }
  .thankyou__noti--blue {
    font-size: 14px;
    line-height: 1.57em;
    padding-top: 20px;
    margin-top: 0;
    border-top: 1px solid rgba(28, 171, 226, 0.2);
  }
  .btn__support,
  .btn__thankyou {
    font-size: 18px;
    line-height: 1.3em;
    min-height: 50px;
    padding: 14px 10px 12px;
  }
  .thankyou__box02 .btn__thankyou {
    margin-top: 50px;
  }

  /* section__wordcloud */
  #section__wordcloud {
    padding: 70px 0 40px;
    /* min-height: auto; */
  }
  .wordcloud__inner {
    flex-direction: column;
    align-items: flex-start;
  }
  .wordcloud__logo {
    display: block;
    width: 100%;
    max-width: 270px;
  }
  .wordcloud__title  {
    font-size: 40px;
    margin: 30px 0;
  }
  .wordcloud__total {
    font-size: 11px;
    min-width: 182px;
    min-height: 32px;
    padding: 7px 20px 3px 40px;
    border-radius: 25px;
  }
  .wordcloud__total::before {
    width: 15px;
    height: 15px;
    left: 20px;
  }
  #total {
    font-size: 20px;
    min-width: 50px;
  }
  .wordcloud__result {
    width: 100%;
    margin-right: 0;
    margin-top: 30px;
  }


  /* section__information */
  #section__information {
    padding: 0;
  }
  .information__inner {
    border-radius: 0;
    padding: 70px 0;
  }
  .information__title--sub {
    font-size: 40px;
    position: relative;
    z-index: 1;
  }
  .information__title {
    margin-top: 10px;
  }
  #information__swiper {
    margin-top: -20px;
  }
  #information__swiper .swiper-slide {
    width: 266px;
    height: 414px;
  }
  .information__navigation {
    top: 147px;
    right: 30px;
  }

  /* section__maeum */
  #section__maeum {
    padding: 70px 0;
  }
  .maeum__inner {
    flex-direction: column;
    gap: 20px;
  }
  .btn__maeum {
    width: 100%;
    font-size: 24px;
    padding: 36px 30px;
  }
  .btn__maeum::after {
    width: 35px;
    height: 35px;
    right: 30px;
    top: 31px;
  }
  .maeum--noti {
    margin-top: 30px;
  }
  .maeum--noti01 {
    font-size: 15px;
    line-height: 1.86em;
    padding-left: 20px;
  }
  .maeum--noti02 {
    font-size: 15px;
    padding-left: 23px;
    margin-left: 18px;
  }
  .maeum--noti02::before {
    width: 18px;
    height: 18px;
  }

  /* #section__faq */
  #section__faq {
    padding: 70px 0 170px;
  }
  .faq__title {
    margin-bottom: 30px;
  }
  .faq__list > div {
    padding-left: 46px;
    padding-right: 49px;
  }
  .faq__list > div::before {
    font-size: 20px;
    left: 20px;
  }
  .faq__question {
    font-size: 18px;
    line-height: 1.56em;
    padding: 20px 0;
  }
  .faq__question::after {
    width: 15px;
    height: 15px;
    right: 20px;
  }
  .faq__answer {
    font-size: 15px;
  }
  .faq__answer::before {
    top: 22px;
  }
  .faq__list.open .faq__answer {
    padding: 20px 20px 30px 46px;
  }
  .faq__noti {
    font-size: 14px;
    line-height: 1.7em;
    margin-left: 20px;
    margin-top: 20px;
  }

  /* footer */
  #footer {
    padding: 44px 20px 60px;
  }
  .footer__logo {
    width: 100%;
    max-width: 240px;
  }
  .footer__lists li {
    font-size: 12px;
  }
  .footer__copyright {
    font-size: 12px;
    line-height: 2em;
    margin-top: 36px;
  }
}
@media screen and (max-width: 600px) {
  nav {
    justify-content: flex-start;
  }
  .process__box {
    padding: 40px 10px;
  }
  .process__box01 .process__title span {
    font-size: 6.5vw;
  }
}
@media screen and (max-width: 370px) {
  .visual__title {
    font-size: 11.7vw;
  }
}
@media screen and (max-width: 350px) {

  .btn__maeum {
    font-size: 20px;
    padding: 30px 20px;
  }
  .btn__maeum::after {
    width: 25px;
    height: 25px;
    right: 15px;
    top: 28px;
  }
}