@media screen and (max-width: 1440px) {
  .about-sec5 .arrow {
    top: 30%;
  }
  .about-sec5 .sec5-list img {
    height: 100%;
  }
  .subtop p {
    margin: 30px 0 50px;
    word-break: keep-all;
  }
  .subtop h1 {
    font-size: var(--font40);
  }
  .about-sec5 .step-wrap2 {
    position: relative;
    padding: 60px 0 170px;
  }
  .about-sec5 .list-wrap {
    margin-top: -174px;
  }
}
@media screen and (max-width: 1300px) {
  html,
  body {
    font-size: 14px;
  }
  .main-sec3 > div:nth-child(2) {
    width: 95%;
/*    margin-left: 5%;*/
  }
  .main-sec6 .sec6-list .check-list > li {
    font-size: var(--font20);
    gap: 16px;
  }
  .main-sec7 .sec7-list > li .price span {
    font-size: var(--font40);
  }
  .main-sec7 .sec7-list > li .con br {
    display: none;
  }
  .main-sec8 .form-wrap {
    padding-left: 50px;
  }
  .about-sec1 {
    background: url(/modules/images/home/sub/about-sec1.png);
    background-position: 0 15vh;
    background-size: contain;
    background-repeat: no-repeat;
  }
  .about-sec4 .sec4-list {
    gap: 100px;
  }
  .about-sec1 .inner h1 {
    font-size: var(--font40);
  }
  .about-sec5 .arrow {
    top: 28%;
  }
  .about-sec5 .sec5-step > li dl {
    font-size: var(--font14);
  }
  .function-sec1 .function-list {
    gap: 30px;
  }
  .function-sec1 .function-list p {
    font-size: var(--font18);
  }
  .function-sec1 .function-list > li {
    width: calc(33.333% - 20px);
  }
  .mypage-wrap .plan-wrap .plan-list {
    gap: 30px;
  }
  .mypage-wrap .mypage-con {
    gap: 30px;
  }
  .login-wrap .left {
    width: 55%;
  }
  .login-wrap .right {
    width: 45%;
  }
  .apply-wrap .apply-info .apply-ul {
    gap: 30px;
  }
  .about-sec5 .sec5-step li .mob {
    display: block;
  }

  .mypage-wrap .plan-wrap .plan-box2 .plan-list {
    gap: 35px;
  }

}
@media screen and (max-width: 1024px) {
  .center {
    transform: translate(-50%, -45%);
  }
  .pc {
    display: none;
  }
  .mob {
    display: block;
  }
  header .h-gnb {
    display: none;
  }
  header .login-nav {
    display: none;
  }
  header .hamburger {
    display: block;
    width: 20px;
    height: 16px;
    position: relative;
    cursor: pointer;
  }
  header .hamburger span {
    display: inline-block;
    width: 100%;
    height: 2px;
    background: var(--color00);
    position: absolute;
    left: 0;
  }
  header .hamburger span:nth-child(1) {
    top: 0;
  }
  header .hamburger span:nth-child(2) {
    top: 50%;
    transform: translateY(-50%);
  }
  header .hamburger span:nth-child(3) {
    bottom: 0;
  }
  .site-map {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
    position: fixed;
    top: 0;
    right: -100%;
    display: block;
    transition: all 0.4s;
    z-index: 30;
  }
  .site-map .site-bg {
    width: 244px;
    height: 100%;
    background: #fff;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 35;
    padding: 30px 20px;
    box-sizing: border-box;
  }
  .site-map .site-bg h1 {
    width: 129px;
    margin-bottom: 40px;
  }
  .site-map .site-bg .mob-nav,
  .site-map .site-bg .mob-login {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .site-map .site-bg .mob-nav > li,
  .site-map .site-bg .mob-login > li {
    font-size: 20px;
    font-weight: 600;
    color: var(--black05);
  }
  .site-map .site-bg .mob-login {
    margin-top: 40px;
    border-top: 1px solid var(--gray08);
    padding-top: 40px;
  }
  .site-map .site-bg #hamburger2 {
    top: 70px;
    width: 24px;
    height: 24px;
    position: absolute;
    left: -50px;
  }
  .site-map .site-bg #hamburger2 > span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--color00);
    top: 11px;
  }
  .site-map .site-bg #hamburger2 > span:nth-child(1) {
    transform: rotate(45deg);
  }
  .site-map .site-bg #hamburger2 > span:nth-child(2) {
    transform: rotate(-45deg);
  }
    
  .main-sec1 .swiper .swiper-slide1 {
    background: url(/modules/images/home/mob/mainsec1-bg-new.png);
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .main-sec1 .swiper-slide .left .btn-wrap {
    margin-top: 120px;
  }
  .main-sec1 .swiper-slide .inner {
    flex-direction: column;
    gap: 42px;
  }
  .main-sec1 .swiper-slide .left p {
    margin: 30px 0 0;
  }
  .main-sec2 .sec2-ul {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .main-sec2 .sec2-ul > li.img img {
    margin: auto;
  }
  .main-sec2 .sec2-ul > li.txt {
    text-align: center;
    padding-top: 18px;
  }
  .main-sec2 .sec2-ul2 {
    padding-left: 0;
    margin-top: 40px;
  }
  .main-sec2 .sec2-ul2 > li.txt {
    padding-top: 18px;
    order: 2;
  }
  .main-sec2 .sec2-ul2 > li.txt {
    order: 1;
  }
  .main-sec2 .sec2-ul2 > li.img img {
    margin-top: -92px;
  }
  .main-sec3 .main-tit {
    text-align: center;
  }

  .main-sec3 .sec3-list.list1 {
    display: none;
  }
  .main-sec3 .sec3-list.list2 {
    display: block;
  }  
  .main-sec3 .sec3-list.list2 .sec3-box {
    margin: 50px 0;
  }  
  .main-sec3 .inner, .main-sec3 > div:nth-child(2) {
    margin-left: 0;
    width: 90%;
    margin: auto;
  }  
  
  .main-sec5 .sec5-list {
    flex-direction: column;
    align-items: center;
  }
  .main-sec5 .sec5-list > li.txt {
    text-align: center;
    order: 2;
  }
  .main-sec5 .sec5-list > li.img {
    order: 1;
  }
  .main-sec6 .sec6-list {
    flex-direction: column;
  }
  .main-sec6 .sec6-list > li {
    width: 100%;
  }
  .main-sec7 .sec7-list {
    flex-direction: column;
  }
  .main-sec7 .sec7-list > li {
    width: 100%;
  }
  .main-sec8 .form-wrap {
    padding-left: 0;
  }
  .main-sec8 .radio-wrap {
    flex-wrap: wrap;
    gap: 10px 30px;
  }
  .about-sec1 {
    background: none;
  }
  .about-sec1 .inner {
    top: 56%;
  }
  .about-sec1::before {
    background: var(--blue01);
  }
  .aboutsec1-mob {
    display: block;
    width: 50%;
    margin: 0 auto 50px;
  }
  .about-sec2 {
    padding: 12vh 0 8vh;
  }
  .about-sec2.mob {
    padding: 8vh 0;
  }
  .about-sec2.mob img.mar {
    width: 60%;
    margin: 50px auto 0;
  }
  .about-sec3 {
    padding: 9vh 0 15vh;
  }
  .about-sec3 .main-tit {
    text-align: center;
  }
  .about-sec3 .sec3-con {
    flex-direction: column;
    align-items: center;
    gap: 26px;
  }
  .about-sec3 .sec3-list {
    padding-bottom: 0;
    width: 100%;
    text-align: center;
  }
  .about-sec3 .sec3-con img {
    width: 100%;
    max-width: none;
  }
  .about-sec4 {
    padding-bottom: 15vh;
  }
  .about-sec4 h3 {
    line-height: 1.8;
  }
  .about-sec4 .sec4-list {
    flex-direction: column;
  }
  .about-sec4 .sec4-list > li {
    width: 100%;
  }
  .about-sec5 {
    padding-bottom: 15vh;
  }
  .about-sec5 .sec5-step {
    flex-direction: column;
    gap: 60px;
    width: 100%;
    position: relative;
    padding: 50px 0;
  }

  .about-sec5 .sec5-step::before {
    content: "";
    width: 50%;
    height: 100%;
    background: url(/modules/images/home/mob/about-arrow.png);
    background-repeat: no-repeat;
    background-position: 80% 0;
    background-size: auto 100%;
    position: absolute;
    left: 30%;
    top: 0;
  }
  .about-sec5 .sec5-step > li {
    width: 30%;
    margin-left: 25%;
  }
  .about-sec5 .sec5-step > li dl {
    color: var(--color00);
  }
  .about-sec5 .arrow {
    display: none;
  }
  .about-sec5 .sec5-step > li img {
    max-width: 70px;
    margin: 0 auto 20px;
  }
  .about-sec5 .sec5-step > li dl {
    font-size: 20px;
  }
  .about-sec5 .sec5-list {
    margin-top: 50px;
    flex-direction: column;
    gap: 50px;
  }
  .about-sec5 .sec5-list > li {
    width: 100%;
    padding: 0;
  }
  .about-sec5 .sec5-list img {
    display: none;
  }
  .about-sec5 .sec5-list h4 {
    display: inline-block;
    background: var(--blue01);
    color: var(--colorff);
    padding: 8px 20px;
    border-radius: 11px 11px 0 0;
    margin-left: 30px;
    margin-bottom: 0;
  }
  .about-sec5 .sec5-list .list-num {
    border-radius: 20px;
    box-shadow: 0px 8px 7px 0px rgba(0, 0, 0, 0.25);
    padding: 45px 25px;
    word-break: keep-all;
  }
  .about-sec6 .sec6-con {
    flex-direction: column;
    gap: 70px;
    align-items: center;
    text-align: center;
  }
  .about-sec6 {
    padding: 10vh 0 14vh;
  }
  .subtop {
    height: 55vh;
  }
  .subtop .subtop-nav {
    display: none;
  }
  .subtop .inner {
    bottom: auto;
    top: 22vh;
  }
  .function-sec1 {
    padding: 10vh 0 5vh;
  }
  .function-sec1.mob {
    padding: 5vh 0;
  }
  .function-sec1.last {
    padding: 5vh 0 10vh;
  }
  .function-sec1 .tit {
    margin-bottom: 50px;
  }
  .function-sec1 .tit p {
    word-break: keep-all;
  }
  .function-sec1 .function-list > li {
    width: calc(50% - 15px);
  }
  .function-sec1 .function-list {
    justify-content: flex-start;
  }
  .subtop2 img {
    display: none;
  }
  .support-sec2 .sec2-list {
    gap: 50px;
  }
  .down-wrap .down-list {
    gap: 30px;
    flex-direction: column;
  }
  .down-wrap .down-list > li {
    padding: 40px 30px;
    width: 100%;
  }
  .manual-wrap .manual-box {
    width: 100%;
  }
  .login-wrap .left {
    display: none;
  }
  .login-wrap .right {
    width: 100%;
  }
  .free-wrap .free-box {
    flex-direction: column;
    margin-top: 50px;
  }
  .free-wrap .free-box .left {
    width: 100%;
  }
  .free-wrap .free-box .right {
    width: 100%;
  }
  .apply-wrap .apply-info .apply-ul {
    flex-direction: column;
  }
  .apply-wrap .apply-info .apply-ul > li {
    width: 100%;
    box-sizing: border-box;
  }
  .about-sec5 .list-wrap {
    margin-top: 7vh;
  }


  .mypage-wrap .mypage-con {
    display: block;
  }

  .mypage-wrap .profile-wrap {
    width: 100%;
    max-width: 350px;
    margin: auto;
  }
  
  .mypage-wrap .plan-wrap {
    width: 100%;
    margin-top: 50px;
  }  

  .mypage-wrap .plan-wrap h4 {
    font-size: var(--font23);
  }
  
  .mypage-wrap .plan-wrap .plan-list {
    display: block;
  }    

  .mypage-wrap .plan-wrap .plan-box {
    width: 100%;
    max-width: 350px;
    margin: auto;
  }  

  .mypage-wrap .plan-wrap .plan-box2 {
    padding: 65px 0;
  }  

}

@media screen and (max-width: 714px) {
  :root {
    --font14: 14px;
    --font18: 1.125rem;
    --font20: 14px;
    --font22: 1.375rem;
    --font23: 16px;
    --font24: 15px;
    --font25: 15px;
    --font30: 20px;
    --font35: 35px;
    --font40: 25px;
    --font50: 32px;
    --font58: 30px;
  }
  header {
    height: 80px;
  }

  .main-sec1 .swiper-slide .left p {
    margin: 10px 0 0;
  }
  .main-sec1 .swiper-slide .num-list > li {
    width: 211px;
    padding: 0 24px;
  }
  .main-sec2 {
    padding: 10vh 0 7vh;
  }
  .main-sec2 .sec2-ul > li.img img {
    width: 350px;
  }
  .main-sec2 .sec2-ul > li.img .point {
    font-size: 80px;
  }
  .main-sec2 .sec2-ul1 > li.img .point {
    margin-top: -66px;
  }
  .main-sec2 .sec2-ul > li.txt p:nth-child(2) {
    margin: 12px 0;
  }
  .main-sec2 .sec2-ul2 > li.img img {
    margin-top: -50px;
  }
  .main-sec2 .sec2-ul2 {
    margin-top: 20px;
  }
  .main-sec3 {
    padding: 7vh 0;
  }
  .main-sec3 .sec3-list {
    margin-top: 50px;
  }
  .main-sec3 .sec3-list .sec3-box {
    height: 334px;
    padding: 19px 24px 27px;
  }
  .main-sec3 .sec3-list .sec3-box img {
    max-width: 135px;
  }
  .main-sec3 .sec3-list .sec3-box p {
    margin-top: 10px;
  }

  .main-sec4 {
    padding: 7vh 0;
  }
  .main-sec4 .main-tit {
    text-align: center;
  }
  .main-sec4 .main-tit p {
    display: none;
  }
  .main-sec4 .sec4-wrap {
    margin-top: 50px;
    padding-bottom: 0;
  }
  .main-sec4 .sec4-list {
    padding: 24px 35px;
    width: 100%;
  }
  .main-sec4 .sec4-list > li {
    gap: 20px;
  }
  .main-sec4 .sec4-list > li .check-box {
    width: 27px;
    height: 27px;
  }
  .main-sec4 .sec4-list > li .check-box img {
    width: 28px;
    top: auto;
    bottom: 3px;
  }
  .main-sec4 .sec4-list > li p {
    width: calc(100% - 47px);
    text-decoration: underline;
    word-break: keep-all;
  }
  .main-sec4 .sec4-list > li p::before {
    display: none;
    line-height: 1.5;
  }
  .main-sec4 .sec4-wrap img {
    max-width: 100px;
    bottom: -54px;
  }
  .main-sec5 .main-tit {
    display: flex;
    gap: 15px;
    margin-bottom: 50px;
    flex-direction: column;
  }
  .main-sec5 {
    padding: 7vh 0;
  }
  .main-sec5 .main-tit p {
    order: 2;
    word-break: keep-all;
  }
  .main-sec5 .main-tit h3 {
    order: 1;
  }
  .main-sec5 .sec5-list > li.img {
    width: 265px;
  }
  .main-sec5 .sec5-list > li.txt p:nth-child(2) {
    margin: 12px 0;
  }
  .main-sec5 .list-wrap {
    gap: 100px;
  }
  .main-sec6 {
    padding: 7vh 0;
  }
  .main-sec6 .main-tit {
    text-align: center;
  }
  .main-sec6 .sec6-list {
    margin-top: 50px;
    gap: 50px;
  }
  .main-sec6 .sec6-list .check-list > li {
    word-break: keep-all;
    line-height: 1.5;
  }
  .main-sec6 .sec6-list .check-list {
    padding: 40px 30px;
  }
  .main-sec6 .sec6-list .down {
    margin: 30px auto;
  }
  .main-sec7 {
    padding: 7vh 0 15vh;
  }
  .main-sec7 .main-tit {
    text-align: center;
    margin-bottom: 50px;
  }
  .main-sec7 .sec7-list {
    gap: 50px;
  }
  .main-sec7 .sec7-list > li .price {
    margin: 14px 0 20px;
  }
  .main-sec7 .sec7-list > li .price span {
    font-size: var(--font58);
  }
  .main-sec7 .sec7-list > li .main-btn {
    font-size: 18px;
    margin: 30px 0;
  }
  .main-sec7 .sec7-list > li {
    padding: 50px 28px;
  }
  .main-sec7 .sec7-list .check-list {
    padding-top: 30px;
    border-top: 2px solid #ebf1ff;
  }
  .main-sec7 .sec7-list .check-list > li {
    word-break: keep-all;
  }
  .main-sec7 .sec7-list .check-list > li img {
    width: 12px;
    margin-right: 10px;
  }
  .main-sec8 {
    padding: 7vh 0 25vh;
  }
  .main-sec8 .inner {
    padding: 35px 25px 100px;
  }
  .main-sec8 h3 {
    margin-bottom: 30px;
  }
  .main-sec8 .form-wrap {
    gap: 15px;
  }
  .main-sec8 .input-wrap {
    gap: 20px;
  }
  .main-sec8 .radio-wrap {
    gap: 10px;
  }
  .main-sec8 .radio-wrap label {
    padding: 14px 24px;
  }
  .main-sec8 .input-wrap p {
    line-height: 1.5;
  }
  .main-sec8 .price-wrap {
    margin-top: 20px;
    padding-top: 30px;
  }
  .main-sec8 .price-wrap .price {
    padding: 10px 25px;
    margin: 18px 0 16px;
  }
  .main-sec8 .price-wrap .price span {
    font-size: 30px;
  }  
  footer .f-call div p {
    font-size: 20px;
  }
  footer .f-con {
    padding: 44px 0 120px;
  }
  footer .f-info {
    gap: 6px;
    line-height: 1.5;
    word-break: keep-all;
  }
  .about-sec1 .inner {
    text-align: center;
  }
  .about-sec1 .inner h1 {
    font-size: 32px;
    text-align: initial;
  }
  .about-sec1 .inner p {
    margin: 10px 0 50px;
    text-align: initial;
  }
  .aboutsec1-mob {
    width: 90%;
    max-width: 262px;
    margin: 0 auto 30px;
  }
  .sub-tit p {
    line-height: 1.5;
  }
  .about-sec3 .sec3-list dl dd {
    word-break: keep-all;
  }
  .about-sec3 .sec3-list dl dd br {
    display: none;
  }
  .about-sec3 .sec3-con img {
    max-width: 290px;
    margin: auto;
  }
  .about-sec4 h3 span::before {
    width: 5px;
    height: 5px;
    top: -7px;
  }
  .about-sec4 .sec4-list > li {
    padding: 68px 0 75px;
  }
  .about-sec4 .sec4-list h6 {
    font-size: 20px;
  }
  .about-sec4 .sec4-list h5 {
    font-size: 26px;
  }
  .about-sec4 .sec4-list p {
    font-size: 20px;
  }
  .about-sec5 .main-tit {
    margin-bottom: 50px;
    text-align: center;
  }

  .sec5-step li .mob {
    display: block;
  }

  .about-sec5 .sec5-step > li {
    width: 40%;
    margin-left: 10%;
  }

  .about-sec5 .sec5-step::before {
    background: url(/modules/images/home/mob/about-arrow.png);
    background-repeat: no-repeat;
    background-position: 100% 0;
    background-size: auto 100%;
    left: 45%;
  }
  .about-sec5 .sec5-list .list-num > li {
    font-size: 20px;
  }
  .about-sec5 .sec5-list h4 {
    font-size: 25px;
    padding: 10px 30px;
  }
  .about-sec6 .main-btn {
    font-size: 25px;
  }
  .about-sec6 .sec6-con > li:nth-child(2) {
    width: 100%;
  }
  .about-sec6 .sec6-con > li:nth-child(2) img {
    width: 282px;
    margin: auto;
  }
  .subtop p {
    margin: 10px 0 0;
  }
  .function-sec1 .tit h3 {
    font-size: 30px;
  }
  .function-sec1 .function-list .num {
    position: relative;
    left: auto;
    top: auto;
    font-size: 30px;
    margin-bottom: 10px;
  }
  .function-sec1 .function-list > li {
    padding: 20px 16px 26px;
    box-sizing: border-box;
    text-align: initial;
  }
  .function-sec1 .function-list h4 {
    font-size: 18px;
  }
  .function-sec1 .function-list p {
    font-size: 13px;
    word-break: keep-all;
  }
  .function-sec1 .function-list p br {
    display: none;
  }
  .subtop h1 span {
    font-size: 18px;
    word-break: keep-all;
    line-height: 1.5;
  }
  .support-sec1 {
    padding: 10vh 0 7vh;
  }
  .support-sec1 .list-wrap {
    margin-top: 30px;
  }
  .support-sec1 .sec1-list {
    padding: 20px 0;
    gap: 30px;
  }
  .support-sec1 .sec1-list > li.img {
    width: 13%;
  }
  .support-sec1 .sec1-list > li.txt {
    width: 87%;
  }
  .support-sec1 .sec1-list h4 {
    font-size: 18px;
    margin-bottom: 8px;
  }
  .support-sec1 .sec1-list h4 span {
    font-size: 14px;
  }
  .support-sec1 .sec1-list p {
    font-size: 14px;
    line-height: 1.5;
  }
  .support-sec2 .sec2-list {
    margin-top: 50px;
    flex-direction: column;
  }
  .support-sec2 .sec2-list > li {
    width: 100%;
  }
  .support-sec2 .sec2-list > li {
    padding: 60px 0 40px;
  }
  .support-sec2 .sec2-list .num {
    top: 0;
    left: 30px;
  }
  .down-wrap .down-list .btn-wrap {
    flex-direction: column;
  }
  .manual-wrap .manual-box {
    padding: 40px 30px 50px;
  }
  .manual-wrap .manual-list .video-box {
    width: 80px;
    padding-bottom: 17.2%;
  }
  .manual-wrap .manual-list > li > a {
    padding: 18px 0;
  }
  .manual-wrap .manual-list dl {
    width: calc(100% - 100px);
  }
  .login-wrap {
    height: auto;
    padding: 10vh 0;
  }
  .login-wrap .right {
    width: 90%;
    margin: auto;
  }
  .login-wrap .con-wrap {
    width: 100%;
    position: relative;
    left: auto;
    top: auto;
    transform: none;
  }
  .login-wrap .right .copy {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    margin-top: 18px;
  }
  .login-wrap .con-wrap .logo {
    width: 160px;
    margin: 0 auto 46px;
  }
  .find-wrap {
    padding: 18vh 0;
  }
  .find-wrap .input-wrap .pass {
    gap: 10px;
  }
  .find-wrap .input-wrap .pass button {
    width: 106px;
  }
  .find-wrap .input-wrap .pass input {
    width: calc(100% - 116px);
  }
  .find-wrap .form-wrap {
    margin-top: 30px;
    gap: 30px;
  }
  .find-wrap button.submit {
    margin-top: 10px;
  }
  .find-wrap .input-wrap .alert {
    font-size: 12px;
    bottom: -21px;
  }
  .find-wrap .id-result {
    margin-top: 30px;
  }
  .find-wrap .id-result .id-find {
    padding: 40px 0;
  }
  .find-wrap .id-result .btn-wrap {
    margin-top: 40px;
    gap: 10px;
  }
  .find-wrap .id-result .btn-wrap button {
    height: 50px;
  }
  .find-wrap .id-result .pass-find {
    padding: 40px 0;
  }
  .find-wrap .id-result .pass-find img {
    width: 100px;
    margin: 0 auto 30px;
  }
  .find-wrap .id-result .pass-find p {
    font-size: 14px;
    word-break: keep-all;
  }
  .find-wrap .id-result .pass-find p span {
    font-size: 14px;
  }
  .join-wrap .join-step {
    justify-content: space-between;
    gap: initial;
  }
  .join-wrap .join-step::before {
    width: 100%;
  }
  .join-wrap .check-list {
    padding: 46px 30px;
    gap: 30px;
  }
  .join-wrap .check-list .check-wrap label {
    font-size: 14px;
    word-break: keep-all;
    line-height: 1.5;
    width: calc(100% - 28px);
  }
  .join-wrap .check-list .check-wrap label img {
    width: 12px;
    margin-left: 8px;
  }
  .join-wrap .check-list .check-wrap1 label {
    font-size: 14px;
  }
  .join-wrap .check-list .check-wrap1 {
    padding-bottom: 20px;
  }
  .join-wrap .check-list .alert {
    margin-top: 0;
  }
  .join-wrap .next-btn {
    margin-top: 50px;
  }
  .join-wrap .form-wrap .input-wrap .input-box2 button {
    width: 120px;
  }
  .join-wrap .form-wrap .input-wrap .input-box2 {
    gap: 10px;
  }
  .join-wrap .form-wrap .input-wrap .input-box2 input {
    width: calc(100% - 130px);
  }
  .join-wrap .form-wrap .input-wrap.on .alert {
    font-size: 12px;
  }
  .join-wrap .form-wrap .input-wrap .info {
    font-size: 12px;
  }
  .join-wrap .join-end p {
    font-size: 14px;
    word-break: keep-all;
  }
  .join-wrap .join-end {
    padding: 40px 0;
  }
  .join-wrap .join-end img {
    width: 100px;
  }
  .join-wrap .btn-wrap {
    margin-top: 50px;
    gap: 10px;
  }
  .free-wrap .free-box .left {
    padding: 60px 30px;
  }
  .free-wrap .free-box .right {
    padding: 60px 30px;
  }
  .apply-wrap .apply-list {
    padding: 30px 0;
  }
  .apply-wrap .apply-tit img {
    width: 20px;
  }
  .apply-wrap .apply-tit {
    font-size: 20px;
  }
  .apply-wrap table {
    margin-top: 30px;
  }
  .apply-wrap .apply-info .apply-txt {
    margin: 30px 0;
  }
  .subscribe-wrap {
    padding: 16vh 0;
  }
  .subscribe-wrap .tit {
    margin-bottom: 50px;
  }
  .subscribe-wrap .tit p {
    word-break: keep-all;
  }
  .join-wrap2 .form-wrap .input-wrap .info {
    bottom: -34px;
  }
  .join-wrap2 .benefit-wrap {
    padding-top: 50px;
  }
  .join-wrap2 .benefit-wrap .benefit-box {
    width: 100%;
    padding: 40px 30px;
  }
  .join-wrap2 .confirm-list {
    margin-top: 50px;
  }
  .join-wrap2 .confirm-list h4 img {
    width: 20px;
  }
  .join-wrap2 .confirm-list h4 {
    font-size: 20px;
  }
  .join-wrap2 .confirm-list .confirm-ul {
    line-height: 1.5;
  }
  .join-table .table-wrap dl.wid-50 {
    width: 100%;
  }
  .join-wrap4 .pay-info .info-list > li {
    line-height: 1.5;
  }
  .join-wrap4 .pay-btn {
    margin: 20px 0 50px;
  }

  .write-wrap .bo-write {
    margin-top: 40px;
    padding: 20px 0px;
    box-shadow: none;
  }

  .write-wrap .write-con { 
    margin: 20px 0 20px;
  }  

  .write-wrap .write-top {
    gap: 10px;
  }
  .write-wrap .write-top .check-wrap {
    width: 60px;
  }  
  .write-wrap .write-top .check-wrap input {
    width: 20px;
    height: 20px;
  }

  .notice-wrap2 table th:nth-child(3) {
      width: 0;
  }

  .notice-wrap table th:nth-child(4) {
      width: 0;
  }

  .notice-wrap .table-top .write-btn {
      width: 80px;
  }

  .notice-wrap table th:nth-child(1) {
    width: 10%;
  }
  .notice-wrap table th:nth-child(2) {
    width: 70%;
  }
  .notice-wrap table th:nth-child(3) {
    width: 20%;
  }
  .notice-wrap table th:nth-child(4) {
    width: 0%;
  }

  .view-wrap .bo-top {
    padding: 20px;
  }  

  .view-wrap .regdate-title {
    display: none;
  }

  .view-wrap .bo-list2 .btn-wrap {
    gap: 10px;
  }  

  .view-wrap .bo-list2 .btn-wrap button {
    width: 80px;
  }    

  .view-wrap .bo-page > li > a {
    gap: 20px;
    padding: 18px 10px;
  }

  .view-wrap .bo-txt, .view-wrap .bo-answer .answer-con  {
    padding: 20px 10px;
  }   

  .view-wrap .bo-attach {
      border-top: 1px solid var(--gray07);
      padding: 20px 10px;
  }

  .view-wrap .bo-attach .file-title {
    display: none;
  }  

  .view-wrap .bo-attach dl dd a {
    font-size: var(--font20);
  }  

  .bo-answer .btn-wrap button {
    width: 80px;
  }

  .view-wrap .bo-answer .answer-tit {
    padding: 20px;
  }

  .write-wrap .write-top .check-wrap label {
    padding-left: 30px;
  }  

  .qna-sec1 .qna-wrap .question {
    padding: 35px 10px;
    gap: 10px;
  }  

  .qna-sec1 .qna-wrap .answer {
    padding: 40px 30px;
  }  

  .qna-sec1 .qna-wrap .question img {
    right: 5px;
  }

  .qna-sec1 .qna-wrap .question .subject {
    padding-right: 30px;
  }    

  .inquire-wrap .form-wrap {
      margin: 10vh auto 0;
      width: 100%;
      gap: 30px;
      padding: 30px 0px;
      border: none;
  }

  .inquire-wrap .form-wrap .input-wrap input, .inquire-wrap .form-wrap .input-wrap textarea {
    padding: 10px;
  }

  /*청구내역*/
  .bill-wrap table th:nth-child(1) {
    width: 10%;
  }
  .bill-wrap table th:nth-child(2) {
    width: 45%;
  }
  .bill-wrap table th:nth-child(3) {
    width: 0%;
  }
  .bill-wrap table th:nth-child(4) {
    width: 20%;
  }
  .bill-wrap table th:nth-child(5) {
    width: 25%;
  }

  .mypage-wrap .plan-wrap .plan-box2 a {
    margin-left: 5px;
  }
  
  .modify-wrap .user-info {
    box-shadow: none;
    padding: 10px;
  }  

  .modify-wrap .form-wrap .input-wrap {
      gap: 10px;
  }  

  .modify-wrap .form-wrap .input-wrap .input-box input {
    width: 65%;
    padding: 0 10px;
  }

  .modify-wrap .change-button {
    width: 70px;
  }  
}

@media screen and (max-width: 500px) {
  .main-sec1 .swiper-slide .left h1 {
    font-size: 28px;
  }

  .main-sec1 .swiper-slide .left .btn-wrap {
    margin-top: 50px;
    gap: 10px;
  }  

  .main-sec1 .main-btn.apply { display: none; }
}

@media screen and (max-width: 350px) {
  .center {
    transform: translate(-50%, -40%);
  }
}