﻿/*Pretendard*/
/*@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');*/

/*나눔고딕*/
@font-face {
    font-family: 'NG-regular';
    font-weight: 400;
    src: url('../fonts/NanumGothic-Regular.ttf');
    src: url('../fonts/NanumGothic-Regular.eot') format('embedded-opentype'), url('../fonts/NanumGothic-Regular.woff') format('woff');
}

@font-face {
    font-family: 'NG-bold';
    font-weight: 600;
    src: url('../fonts/NanumGothic-Bold.ttf');
    src: url('../fonts/NanumGothic-Bold.eot') format('embedded-opentype'), url('../fonts/NanumGothic-Bold.woff') format('woff');
}

@font-face {
    font-family: 'NG-extrabold';
    font-weight: 800;
    src: url('../fonts/NanumGothic-ExtraBold.ttf');
    src: url('../fonts/NanumGothic-ExtraBold.eot') format('embedded-opentype'), url('../fonts/NanumGothic-ExtraBold.woff') format('woff');
}
/* Medium */
@font-face {
    font-family: 'SpoqaHanSansNeo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Medium.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}

/* Bold */
@font-face {
    font-family: 'SpoqaHanSansNeo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Bold.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}


/*프리텐다드*/
@font-face {
   font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Regular.ttf') format('truetype');
    font-weight: 400;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Medium.ttf') format('truetype');
    font-weight: 500;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-SemiBold.ttf') format('truetype');
    font-weight: 600;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Bold.ttf') format('truetype');
    font-weight: 700;
}



body {
    /*    font-family: 'Pretendard';*/
    font-family: 'Pretendard';
}
p{
    margin:0;
}
.btn{
    box-shadow:none;
}

.index-wrap {
/*    margin: 0 auto;*/
}

/***** 헤더 *****/
.top-menu {
    position: fixed;
    top: 0;
    left: 0;
    padding: 24px 0;
    z-index: 9;
    width: 100%;
    background: #222;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.top-menu .logo-wrapper{
      display: inline-block;
}
.top-menu .box-head{
    max-width:1200px;
    margin:0 auto;
}
.top-menu .menu-wrapper {
    display: inline-block;
    float: right;
    line-height: 2;
}
.top-menu .menu-wrapper ul{
    display: flex;
    align-items:center;
    gap:34px;
}
.top-menu .menu-wrapper .auth ul {
    display: flex;
    gap: 8px;
}
.top-menu .menu-wrapper li {
    position: relative;
}
.top-menu .menu-wrapper li a {
    color: #FFF;
    font-size: 16px;
    font-weight: 400;
    white-space:nowrap;
}
.top-menu .menu-wrapper li a:hover {
    font-weight: 700;
}
.top-menu .menu-wrapper li a.active {
    color: #00B953;
    font-size: 16px;
    font-weight: 700;
}
.top-menu .menu-wrapper li .pointborder {
    color: #00B953;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
    border-radius: 24px;
    border: 1px solid #00B953;
    padding: 8px 16px;
}
.top-menu .menu-wrapper li .pointbg {
    color: #FFF;
    font-family: Pretendard;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
    border-radius: 24px;
    background: #00B953;
    padding: 8px 16px;
}
.login-wrapper {
    position: relative;
    margin: 0 auto;
    /*top: 107px;*/
    width: 1200px;
}
.top-menu .menu-wrapper .customer ul {
    position: absolute;
    flex-direction: column;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.90);
    padding: 14px 16px;
    white-space: nowrap;
    gap: 12px;
    width: 81px;
    box-sizing: border-box;
    left: -10px;
    box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.15);
}
.top-menu .menu-wrapper .customer ul li {
    cursor: pointer;
    line-height: 0;
}
.top-menu .menu-wrapper .customer ul li a {
    color: #222;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
}
.top-menu .menu-wrapper .customer ul li:last-child {
    display: flex;
    gap: 0;
}
.top-menu .menu-wrapper .customer ul::after,
.top-menu .menu-wrapper .customer ol::after{
   content: none;
}
.top-menu .menu-wrapper .customer ul li a:hover {
    color: #424242;
    font-weight: 700;
}
/***** 페이징 *****/
.paging {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 60px;
}

.paging a {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 32px;
    color: #929292;
    font-size: 14px;
    text-align: center;
}

.paging a.active {
    font-weight: bold;
    background: #f2f2f2;
    border-radius: 8px;
    color: #929292;
}

.paging a.active_gray {
    background-color: #d9d9d9;
}
.paging .next img,
.paging .endnext img{
    transform: rotate(180deg);
}

.paging a img{
    width:30px;
    height:30px;
}
/*공통*/
.index-cnt{
   padding-top:80px;
}
.index-cnt .cmn-cnt {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 100px;
}
.index-cnt .cmn-cnt .point{
    color: #0C4;
    font-weight: 700;
}
.index-cnt .cmn-text1 {
    color: #222;
    font-size: 38px;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: -0.76px;
}
.index-cnt .cmn-text2 {
    color: #222;
    font-size: 38px;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.76px;
}
.index-cnt .cmn-text3 {
    color: #222;
    text-align: center;
    font-size: 38px;
    font-weight: 500;
    line-height: 130%; /* 49.4px */
    letter-spacing: -0.76px;
}
.index-cnt .cmn-text3 span {
    font-weight: 700;
}

/*section1*/
.index-cnt .s1 {
    background: linear-gradient(152deg, #002415 60.86%, #008A53 123.41%);
    height: 897px;
    overflow-x: hidden;
}
.index-cnt .s1 .cmn-cnt {
    display: flex;
    align-items: center;
    padding-top: 56px;
    padding-bottom:0;
    padding-left:104px;
}
.index-cnt .cnt-left .top-img {
    width: 99.58px;
    height: 118.482px;
}
.index-cnt .cnt-left .text {
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 72px */
}
.index-cnt .cnt-left .box-img {
    margin-bottom: 10px;
    display: inline-block;
}
.index-cnt .cnt-left .text1 {
    color: #12EF76;
}
.index-cnt .cnt-left .text2 {
    color: #FFF;
}
.index-cnt .cnt-left .text3 {
    color: #F2F2F2;
    font-size: 28px;
    font-weight: 500;
    line-height: normal;
    margin-top:8px;
}
.index-cnt .cnt-left .btn {
    border-radius: 41.157px;
    border: 2px solid #90F4A3;
    color: #FFF;
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
    padding: 14.699px 36.747px;
    display:inline-block;
    margin-top:40px;
}
.index-cnt .cnt-right {
    position: relative;
}
.index-cnt .cnt-right .right-img {
    position: absolute;
    top: -438px;
    left: -257px;
}
.index-cnt .cnt-top {
    width: 800px;
    padding-top: 27px;
    margin: 0 auto;
}
.index-cnt .cnt-top .box {
    border-radius: 32px;
    border: 1px solid #000;
    background: linear-gradient(104deg, #41FFD9 21.27%, #21DFB9 98.98%);
    height: 60px;
    gap: 11px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: end;
    padding: 12px;
    box-sizing: border-box;
}
.index-cnt .cnt-top img {
    width: 65px;
    height: 78px;
    width: 65px;
    height: 78px;
    position: absolute;
    left: 0;
    top: -23px;
    left: 0px;
}
.index-cnt .cnt-top .text {
    color: #222;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 24px */
    letter-spacing: -0.4px;
}
.index-cnt .cnt-top .text span {
    text-decoration-line: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
    text-decoration-skip-ink: none;
}
.index-cnt .cnt-top .btn {
    border-radius: 48px;
    border: 2px solid #222;
    color: #222;
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    /* line-height: 160%; */
    letter-spacing: -0.34px;
    padding: 6px 20px;
    height: 39px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 159px;
    white-space: nowrap;
    z-index: 9;
}
/*section1-1*/
.index-cnt .cnt-s1-1 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    position: relative;
    top: -143px;
}
.index-cnt .cnt-s1-1 .item {
    position: relative; 
    width: 100%;
    border-radius: 24px; 
}
.index-cnt .cnt-s1-1 .left {
    position: absolute;
    top: 125px;
    left: 60px;
    transform: translateY(-50%);
    color: #fff;
    z-index: 2;
}
.index-cnt .cnt-s1-1 .right {
    position: absolute;
    top: 126px;
    left: 60px;
    transform: translateY(-50%);
    color: #fff;
    z-index: 2;
}
.index-cnt .cnt-s1-1 .item .img {
    background: #fff;
    display: inline-block;
    border-radius: 40px;
    position: absolute;
}
.index-cnt .cnt-s1-1 .item .bgimg {
    width: 100%;
    display: block;
}
.index-cnt .cnt-s1-1 .item .img img {
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.index-cnt .cnt-s1-1 .left .img {
    border: 2px solid #00733A;
    box-shadow: -1px -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
    right: -236px;
    top: -56px;
}
.index-cnt .cnt-s1-1 .right .img {
    border: 2px solid #22F5CB;
    box-shadow: -1px -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
    right: -311px;
   top: -56px;
}
.index-cnt .cnt-s1-1 .left img{
   width: 98px;   
}
.index-cnt .cnt-s1-1 .right img{
    width: 99px;
}
.index-cnt .cnt-s1-1 .left .text1 {
    color: #74F943;
    font-size: 32px;
    font-weight: 700;
    line-height: 120%; /* 38.4px */
    letter-spacing: -0.64px;
}
.index-cnt .cnt-s1-1 .left .text2 {
    color: #FFF;
    font-size: 32px;
    font-weight: 700;
    line-height: 120%;
    letter-spacing: -0.64px;
}
.index-cnt .cnt-s1-1 .left .text3 {
    color: #F2F2F2;
    font-family: Pretendard;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%; /* 30px */
    letter-spacing: -0.4px;
}
.index-cnt .cnt-s1-1 .item .btn {
    font-size: 18px;
    font-weight: 700;
    line-height: 160%; /* 28.8px */
    letter-spacing: -0.36px;
    border-radius: 48px;
    padding: 6px 20px;
    margin-top: 16px;
    display: inline-block;
}
.index-cnt .cnt-s1-1 .left .btn{
     color: #FFF;
     border: 2px solid #FFF;
}
.index-cnt .cnt-s1-1 .right .btn{
    color: #424242;
    border: 2px solid #424242;
}
.index-cnt .cnt-s1-1 .right .text1{
    color: #222;
    font-size: 32px;
    font-weight: 700;
    line-height: 120%; /* 38.4px */
    letter-spacing: -0.64px;
    width: 200px;
}
.index-cnt .cnt-s1-1 .right .text2 {
    color: #666;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%; /* 30px */
    letter-spacing: -0.4px;
}
/*section2*/
.index-cnt .s2 {
    margin-top: -161px;
}
.index-cnt .s2 .cmn-cnt {
    text-align: center;
}
.index-cnt .s2 .box-middle {
    margin: 60px 0;
    display: flex;
    align-items: center;
    gap: 30px;
    justify-content: center;
}
.index-cnt .s2 .box-middle img{
    width:140px;
}
.index-cnt .s2 .box-middle .title {
    color: #424242;
    font-size: 22px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.44px;
    margin:30px 0 16px;
}
.index-cnt .s2 .box-middle .text {
    color: #727272;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    word-break: keep-all;
}
.index-cnt .s2 .box-middle .item {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width:370px;
}
.index-cnt .s2 .item1 .text{
     width: 280px;
}
.index-cnt .s2 .item2 .text{
     width: 291px;
}
.index-cnt .s2 .item3 .text{
     width: 315px;
}
.index-cnt .s2 .box-bottom {
    margin: 0 auto;
    width: 741px;
}
.index-cnt .s2 .box-bottom p {
    color: #424242;
    font-family: Pretendard;
    font-size: 24px;
    font-weight: 400;
    line-height: 140%; /* 33.6px */
}
/*section3*/
.index-cnt .s3 {
    background: #EBF4ED;
}
.index-cnt .s3 .cmn-cnt {
    text-align: center;
    padding:100px 0;
}
.index-cnt .s3 .box-middle {
    border-radius: 32px;
    background: #003728;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* 남는 공간을 균형 있게 */
    gap: 36px;
    width: 100%;
    padding: 40px 130px;
    /* ✅ 여기서 전체 여백 관리 */
    box-sizing: border-box;
    overflow: hidden;
    margin-top: 60px;
    position: relative;
}

.index-cnt .s3 .left {
    position: absolute;
    left: 0px;
    top: 35px;
}

.index-cnt .s3 .left .text {
    margin: 0;
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.44px;
    width: 256px;
    word-break: keep-all;
    position: absolute;
    top: -2px;
    left: 175px;
    z-index: 9;
}

.index-cnt .s3 .left img {
    width: 100%;
    display: block;
    width: 585.963px;
}

.index-cnt .s3 .box-rolling {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
}

.index-cnt .s3 .box-rolling li {
    border-radius: 32px;
    background: #FFF;
    opacity: .4;
    padding: 10px 60px;
    width: 418px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: transform .25s ease, opacity .25s ease;
    transform: scale(1);
    opacity: .55;
    transform-origin: left center;
    color: #424242;
    margin-left: auto;
    position: relative;
    height: 54px;
    color: #424242;
    font-size: 20px;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: -0.4px;
    margin-bottom:26px;
}
.index-cnt .s3 .box-rolling li:last-child{
    margin-bottom:0px;
}

.index-cnt .s3 .box-rolling li.is-active {
    opacity: 1;
    gap:0;
    color: #424242;
    text-align: center;
    font-size: 26px;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: -0.52px;
    white-space: nowrap;
}

.index-cnt .s3 .box-rolling li:not(.is-active) {
    transform: scale(1);
}

.index-cnt .s3 .defaultwrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.index-cnt .s3 .defaultimg {
    width: 26px;
    transition: transform .25s;
}

.index-cnt .s3 .box-rolling li.is-active .defaultimg {
    transform: scale(2.28);
    position: absolute;
    top: -9px;
    left: 11px;
}
.index-cnt .s3 .box-rolling li.is-active:nth-of-type(3) span:last-child{
    position: relative;
    left: 20px;
}
.index-cnt .s3 .box-rolling li.is-active:nth-of-type(4) span:last-child {
    position: relative;
    left: -7px;
}
/*section4*/
.index-cnt .s4 .cmn-cnt{
    padding-top:100px;
}
.index-cnt .s4 .box-head .text-small {
    color: #727272;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 140%; /* 33.6px */
    letter-spacing: -0.48px;
    width: 567px;
    margin: 12px auto 0;
}
.index-cnt .s4 .box-bar {
    position: relative;
    width: 32px; 
    height: 180px; 
    line-height: 0;
}
.index-cnt .s4 .bar-gray {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: block;
    width: 32px;
}
.index-cnt .s4 .mask {
    position: absolute;
    left: 2.5px;
    bottom: 0;
    width: 100%;
    height: 0%;
    overflow: hidden;
    display: block;
    width: 26px;
}
.index-cnt .s4 .fill {
    position: absolute;
    left: 0.4px;
    bottom: 0;
    width: 100%; /* ✅ 0% -> 100% 로 고정 */
    height: 100%;
    display: block;
    object-fit: fill;
}
.index-cnt .s4 .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width:300px;
    box-sizing: border-box;
}
.index-cnt .s4 .item .head {
    color: #222;
    font-size: 34px;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -1.02px;
}
.index-cnt .s4 .item .middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.index-cnt .s4 .item .middle .icon {
    width: 130px;
    position: absolute;
    bottom: -42px;
}
.index-cnt .s4 .box-middle {
    display: flex;
    align-items: center;
    gap: 100px;
    /* margin-top: 60px; */
    margin: 60px 0 0;
    justify-content: center;
}
.index-cnt .s4 .item .footer {
    margin-top: 20px;
    text-align: center;
}
.index-cnt .s4 .item .title {
    color: #424242;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.6px;
    margin-bottom:12px;
}
.index-cnt .s4 .item .text {
    color: #727272;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
    word-break:keep-all;
}
.index-cnt .s4 .item .text1{
    width:160px;
}
.index-cnt .s4 .item .text2 {
    width: 222px;
}
/*section5*/
.index-cnt .s5 {
    background: #EBF4ED;
}
.index-cnt .s5 .cmn-cnt{
    padding-top:100px;
}
.index-cnt .s5 .cmn-text3{
    font-weight:800;
}
.index-cnt .s5 .text-small {
    color: #727272;
    font-family: Pretendard;
    font-size: 24px;
    font-weight: 400;
    line-height: 140%; /* 33.6px */
    letter-spacing: -0.48px;
    text-align: center;
    margin-top: 16px;
}
.index-cnt .s5 .text-small span {
    font-weight: 700;
}
.index-cnt .s5 .box-middle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin:60px 0;
}
.index-cnt .s5 .item {
    border-radius: 24px;
    border: 2px solid #00D49B;
    background: #FFF;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    width: 380px;
    height: 296px;
    box-sizing: border-box;
}
.index-cnt .s5 .item .title {
    color: #424242;
    font-family: Pretendard;
    font-size: 22px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.44px;
}
.index-cnt .s5 .item .text {
    color: #727272;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
    word-break: break-word;
}
.index-cnt .s5 .item .text1 {
    width: 245px;
}
.index-cnt .s5 .item img {
    width: 69px;
}
.index-cnt .s5 .box-footer{
    padding-top:36px;
}
.index-cnt .s5 .box-footer .button {
    border-radius: 999px;
    border: 2px solid #A0FFE5;
    background: #00D49B;
    color: #FFF;
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 360px;
    height: 60px;
}
.index-cnt .s5 .box-footer {
    text-align: center;
    position: relative;
}
.index-cnt .s5 .wrap-tooltip {
    position: absolute;
    right: 328px;
    top: -42px;
    height: 112px;
}
.index-cnt .s5 .wrap-tooltip img{
    width:150px;
}
.index-cnt .s5 .tooltip {
    position: relative;
    top: -96px;
    left: 10px;
    width: 140px;
}
/*.index-cnt .s5 .tooltip::after {
    content: '';
    position: absolute;
    bottom: -7px;
    left: 0px;
    width: 15px;
    height: 25px;
    background-color: #000;
    border-bottom-right-radius: 5px;
    transform: rotate(5deg);
}
.index-cnt .s5 .tooltip::before {
  display: none;
}*/

.index-cnt .s5 .text {
    color: #FFF;
    text-align: center;
    font-size: 13.293px;
    font-weight: 500;
    line-height: 130%; /* 17.281px */
    letter-spacing: -0.266px;
}
.index-cnt .s5 .count {
    color: #00D49B;
    font-size: 32px;
    font-weight: 700;
    line-height: 130%; /* 41.6px */
    letter-spacing: -0.64px;
}
/*section6*/
.index-cnt .s6 .cmn-cnt{
    padding-top:100px;
}
.index-cnt .s6 .box-middle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin: 60px 0;
}
.index-cnt .s6 .item {
    border-radius: 24px;
    background: #F8F8F8;
    padding: 42px 0px 0 30px;
    width: calc((100% - 90px) / 4);
    cursor:pointer;
}
.index-cnt .s6 .item img {
    height: 261px;
    position: relative;
    bottom: -3px;
    border-bottom-right-radius: 24px;
    right: -15px;
}
.index-cnt .s6 .item .box-text span{
    display:block
}
.index-cnt .s6 .item .box-text {
    font-size: 20px;
    font-weight: 500;
    line-height: 130%; /* 26px */
    letter-spacing: -0.4px;
}
.index-cnt .s6 .item .box-text .black {
    color: #222;
}
.index-cnt .s6 .item .box-text .green {
    color: #00B953;
}
.index-cnt .s6 .item .box-text .text-s {
    color: #222;
    font-size: 14px;
    font-weight: 500;
    line-height: 130%; /* 18.2px */
    letter-spacing: -0.28px;
    margin-top:6px;
}
.index-cnt .s6 .box-bottom{
    text-align:center;
}
.index-cnt .s6 .box-bottom a {
    border-radius: 80px;
    background: #00B953;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.36px;
    padding: 0px 32px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/*section7*/
.index-cnt .s7 {
    background: #F8F8F8;
    padding: 100px 0 60px;
}
.index-cnt .s7 .box-middle{
    display:flex;
    align-items:center;
    gap:16px;
    padding:60px 0;
}
.index-cnt .s7 .box-middle .logo {
    margin: 0 auto;
    display: flex;
    width: 1648px;
    box-sizing: border-box;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px;
}
.index-cnt .s7 .box-middle img {
    width: 190px;
    height: 100px;
}
.index-cnt .s7 .slide-wrap {
    overflow: hidden;
    width: 100%;
}
.index-cnt .slide-track {
    display: flex;
    gap: 16px; /* 로고 간격 */
    will-change: transform;
}
.index-cnt .s7 .cmn-cnt{
    padding:0;
}
.index-cnt .s7 .box-bottom .title {
    color: #424242;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    line-height: 140%; /* 30.8px */
    letter-spacing: -0.44px;
}
.index-cnt .s7 .box-bottom .text {
    color: #727272;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    width: 840px;
    margin: 0 auto;
    word-break: keep-all;
    padding: 16px 0 20px;
}
/*section8*/
.index-cnt .s8 {
    position: relative;
    overflow: hidden; /* 배경 넘침 방지 */
    background: url('/contents/images/intro/s8-bg.png') center/cover no-repeat;

}
.index-cnt .s8 .cmn-cnt {
    position: relative;
    z-index: 1;
    padding: 80px 0; 
    text-align: center;
}
.index-cnt .s8 a {
    border-radius: 64px;
    border: 2px solid #55E36F;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    padding: 12px 34px; 
    margin-top:16px;
    display:inline-block;
}
.index-cnt .s8 .text {
    color: #FFF;
    font-size: 36px;
    font-weight: 500;
    line-height: 140%; /* 50.4px */
    letter-spacing: -1.08px;
}
.index-cnt .s8 .point {
    color: #10C863;
    font-size: 36px;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -1.08px;
}
/*.index-cnt .s7 .box-middle span {
    border-radius: 24px;
    background: #F2F2F2;
    width: 190px;
    height: 100px;
    padding: 24px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.index-cnt .s7 .flexg,
.index-cnt .s7 .naver{
    width:114px;
}
.index-cnt .s7 .kakao,
.index-cnt .s7 .hmall {
    width: 100px;
}*/
/*인트로, 고객사례, 고객지원 footer*/
.index-footer {
    background: #222;
    padding:40px 0;
}
.index-footer .cmn-cnt{
    max-width:1200px;
    margin:0 auto;
}
.index-footer .right {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 16px;
}
.index-footer .menu {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #fff;
}
.index-footer .right a {
    color: #B8B8B8;
    font-family: "NG-regular";
    font-size:13px;
    font-weight: 700;
    line-height: normal;
    padding:0 14px;
}
.index-footer .right .policy {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}
.index-footer .info{
    padding:40px 14px;
}
.index-footer .info li{
    color: #B8B8B8;
    font-family: "NG-regular";
    font-size: 13px;
    font-weight: 400;
    line-height: 140%; /* 18.2px */
    letter-spacing: -0.26px;
    padding:4px;
    word-break:keep-all;
}
.index-footer .info2{
    margin-top:32px;
}
.index-footer .fw-bold{
    font-weight:700 !important;
}
.index-footer .corp {
    color: #E8E8E8 !important;
    font-weight: 700 !important;
    text-align: right;
}


/*고객사례 - 전체목록*/
/*공통*/
.customer-cnt .cmn-cnt {
    max-width: 1200px;
    margin: 0 auto;
}
.customer-cnt {
    padding-top: 80px;
}
.customer-cnt .box-head{
    padding-bottom:40px;
}
.customer-cnt .cmn-title {
    color: #222;
    text-align: center;
    font-size: 30px;
    font-weight: 700;
    line-height: 120%; /* 36px */
    letter-spacing: -0.6px;
}

.customer-cnt .cmn-text {
    color: #727272;
    text-align: center;
    font-size: 22px;
    font-weight: 400;
    line-height: 120%; /* 26.4px */
    letter-spacing: -0.44px;
    margin-top:8px;
}

 /*s1 고객전체목록+고객개별페이지 공통*/
.customer-cmn-s1 {
    position: relative;
    overflow: hidden;
    background: url(/contents/images/intro/customer-banner01.png) center / cover no-repeat;
    height:300px;
}
.customer-cmn-s1 .cmn-cnt {
    position: relative;
    z-index: 1;
    padding: 101.5px 0 101.5px;
    text-align: center;
    height: 300px;
    box-sizing: border-box;
}
.customer-cmn-s1 .title {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #FFF;
    font-size:46px;
    font-weight: 700;
    line-height: 120%; /* 60px */
    padding-left:40px;
}
.customer-cmn-s1 .title img {
    height: 70px;
}
.customer-cmn-s1 .text {
    color: #FFF;
    font-size: 22px;
    font-weight: 500;
    line-height: 120%; /* 31.2px */
    margin-top: 16px;
    padding-left: 40px;
}
.customer-cmn-s1 p{
    text-align:left;
}

/*s2*/
.customer-cnt .s2 .cmn-cnt{
    padding:100px 0;
}
.customer-cnt .s2 .item {
    display: flex;
    align-items: center;
    gap:20px;
}
.customer-cnt .s2 .item-l img {
    height: 460px;
    cursor: pointer;
}
.customer-cnt .s2 .item-r {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 20px;
}
.customer-cnt .s2 .item-r img {
    height: 140px;
    cursor: pointer;
}
/*s3*/
.customer-cnt .s3 .cmn-cnt{
    padding:0 0 200px;
}
.customer-cnt .s3 .item {
    border-radius: 16px;
    border: 1px solid #E8E8E8;
    background: #FFF;
    padding: 38px 40px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}
.customer-cnt .s3 .top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}
.customer-cnt .s3 .box-middle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.customer-cnt .s3 .top .title {
    color: #424242;
    font-family: 'SpokaHanSansNeo';
    font-size: 26px;
    font-weight: 700;
    line-height: 150%; /* 39px */
    letter-spacing: -0.52px;
    word-break: keep-all;
}
.customer-cnt .s3 .top img{
    height: 80px;
}
.customer-cnt .s3 .middle .name {
    color: #00B953;
    font-size: 18px;
    font-weight: 500;
    line-height: 160%; /* 28.8px */
    letter-spacing: -0.36px;
    margin:16px 0 8px;
}
.customer-cnt .s3 .middle .text {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%; /* 24px */
    letter-spacing: -0.32px;
    word-break: keep-all;
}
.customer-cnt .s3 .item1 .title{
    width: 264px;
}
.customer-cnt .s3 .item2 .title{
    width: 314px;
}
.customer-cnt .s3 .item3 .title{
    width: 290px;
}
.customer-cnt .s3 .item4 .title{
    width: 359px;
}
.customer-cnt .s3 .item5 .title{
    width: 313px;
}
.customer-cnt .s3 .item6 .title{
    width: 292px;
}
.customer-cnt .s3 .item4 .top img {
    height: 63px;
}
.customer-cnt .s3 .item6 .top img {
   height: 57px;
}

/*개별 고객사례*/
/*공통*/
.customerlist-cnt {
    padding-top: 80px;
}
.customerlist-cnt .mt-26{
    margin-top:26px;
}
.customerlist-cnt .mt-16{
    margin-top:16px;
}
.customerlist-cnt .mb-16{
    margin-bottom:16px;
}
.customerlist-cnt .cmn-cnt {
    max-width: 780px;
    margin: 0 auto;
    padding-bottom: 100px;
}


.customerlist-cnt .s1 .cmn-cnt {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 100px;
    height: 300px;
    box-sizing: border-box;
}
.customerlist-cnt .s2{
    padding:100px 0 200px;
}
.customerlist-cnt .s2 .cmn-cnt{
    padding:0 40px;
}
.customerlist-cnt .s2 .box-head {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    border-bottom: 1px solid #e8e8e8;
    padding:0 20px 20px 20px;
}
.customerlist-cnt .s2 .box-head .title {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.32px;
}
.customerlist-cnt .s2 .box-head .textpoint {
    color: #222;
    text-align: center;
    font-size: 40px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.8px;
}
.customerlist-cnt .s2 .box-head .name {
    color: #29BC25;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.36px;
}
.customerlist-cnt .s2 .box-head img{
     height: 36px;
}
.customerlist-cnt .s2 .box-middle {
    padding: 0 40px;
    width: 700px;
    width: 100%;
    margin: 60px auto 100px;
    box-sizing: border-box;
}
.customerlist-cnt .s2 .box-middle .text-top{
    text-align:center;
}
.customerlist-cnt .s2 .box-middle .text-top p {
    color: #424242;
    font-size: 16px;
    font-weight: 400;
    line-height: 160%; /* 25.6px */
    letter-spacing: -0.32px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.customerlist-cnt .s2 .box-middle .icon2{
    height: 18px;
}
.customerlist-cnt .s2 .box-middle .iframe {
    width: 100%;
    margin: 40px 0px;
    padding:0 50px;
    box-sizing: border-box;
}
.customerlist-cnt .s2 .box-middle iframe {
    display: block;
    width: 100%;
    height: 337px;
}
.customerlist-cnt .s2 .box-middle .point:not(.text-bottom .point){
    background:#98ffc6;
    display:inline-block;
}
.customerlist-cnt .s2 .box-middle p {
    color: #222;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%; /* 24px */
    letter-spacing: -0.32px;
}
.customerlist-cnt .s2 .box-middle p:not(.text-top p) {
    padding-left:50px;
}
.customerlist-cnt .s2 .box-middle .text-middle {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.customerlist-cnt .s2 .box-middle .text-title p{
    color: #00B953 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    letter-spacing: -0.4px !important;
}
.customerlist-cnt .s2 .box-middle .text-title p:last-child{
    margin-bottom:40px;
}

.customerlist-cnt .s2 .text-bottom{
    text-align: center;
    margin-top: 40px;
}
.customerlist-cnt .s2 .text-middle div:nth-child(2) p,
.customerlist-cnt .s2 .text-middle div:nth-child(4) p,
.customerlist-cnt .s2 .text-middle div:nth-child(8) p{
/*    padding-bottom:4px;*/
}
.customerlist-cnt .s2 .title-sm{
    margin-bottom:6px;
}
.customerlist-cnt .s2 .box-bottom {
    border-top: 1px solid #E8E8E8;
    padding-top: 80px;
    text-align: center;
}
.customerlist-cnt .s2 .box-bottom a {
    border-radius: 32px;
    background: #00B953;
    padding: 12px 22px;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.32px;
    display:inline-block;
    cursor:pointer;
}
.customerlist-cnt .s2 .text-bottom .point {
    color: #00B953;
}
.customerlist-cnt .s2 .text-bottom li{
    color: #222;
    font-size: 16px;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.32px;
}


/*고객지원*/
/*공통*/
.support-cnt {
    padding-top: 80px;
}
.support-cmn-s1 {
    position: relative;
    overflow: hidden;
    background: url(/contents/images/intro/support-banner.png) center / cover no-repeat;
    height:300px;
}
.support-cnt .cmn-cnt {
    max-width: 1000px;
    margin: 0 auto;
}
.support-cmn-s1 .cmn-cnt {
    position: relative;
    z-index: 1;
    padding: 83.5px 0 83.5px;
    text-align: center;
    max-width: 1200px !important;
    margin: 0 auto;
    height: 300px;
    box-sizing: border-box;
}
.support-cmn-s1 p {
    text-align: left;
}
.support-cmn-s1 .title {
    color: #FFF;
    font-size: 46px;
    font-weight: 700;
    line-height: 120%; /* 57.6px */
    padding-left:40px;
}
.support-cmn-s1 .text {
    color: #FFF;
    font-size: 22px;
    font-weight: 500;
    line-height: 140%; /* 33.6px */
    margin-top: 16px;
    padding-left: 40px;
}

.support-cnt .s2 .tab-cnt i {
    color: #d8d8d8;
    font-size: 22px;
    margin-left: 16px;
}
/*드롭다운 열렸을때*/
.support-cnt .tab-cnt .list-dropdown.active i {
    transform: rotate(180deg);
}
.support-cnt .s2 .sm-tab-cnt{
    display:none;
}
.support-cnt .s2 .sm-tab-cnt.on {
    display: inherit;
}
.support-cnt .s2 .sm-tab {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom:40px;
}
.support-cnt .s2 .sm-link {
    color: #222;
    font-size: 20px;
    font-weight: 400;
    line-height: 140%; /* 28px */
    letter-spacing: -0.4px;
    flex: 1 0 0;
    text-align: center;
    cursor: pointer;
    padding-bottom: 24px;
    border: 2px solid transparent;
    border-bottom: 1px solid #E8E8E8;
}
.support-cnt .s2 .sm-link.on{
    color: #00B953;
    border-bottom:2px solid #00B953 !important;
    font-weight:700;
}
.support-cnt .s2 .sm-tab-cnt li {
    border-bottom: 1px solid #f2f2f2;
    padding: 20px 10px;
}
.support-cnt .s2 .sm-tab-cnt li:last-child {
    border-bottom: 0;
}
.support-cnt .s2 .sm-tab-cnt li a {
    color: #222;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}
.support-cnt .s2 .sm-tab-cnt li a:hover {
    font-weight: 800;
}
/*s2*/
.support-cnt .s2 .cmn-cnt {
    padding: 100px 0 200px;
}
.support-cnt .s2 .box-tab{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
}
.support-cnt .s2 .tab-link {
    color: #424242;
    font-size: 26px;
    font-weight: 700;
    line-height: 120%; /* 31.2px */
    letter-spacing: -0.52px;
    border-radius: 56px;
    background: #F2F2F2;
    padding: 10px 36px;
    cursor:pointer;
}
.support-cnt .s2 .tab-link.current {
    background: #00B953;
    color: #FFF;
}

/*검색*/
.support-cnt .box-search {
    text-align: center;
    padding: 60px 0 40px;
}
.support-cnt .box-search .title {
    color: #222;
    font-size: 36px;
    font-weight: 700;
    line-height: 120%; /* 43.2px */
    letter-spacing: -0.72px;
}
.support-cnt .box-search{
    padding:60px 0 40px;
}
.support-cnt .box-search .searchinput {
    position: relative;
    width: 580px;
    margin: 24px auto 0;
}
.support-cnt .box-search .input-overlay {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}
.support-cnt .box-search .input-search {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    outline: none;
    border-radius: 80px;
    border: 2px solid #E8E8E8;
    background: #F4F4F4;
    padding: 10px 80px 10px 30px;
    font-size: 16px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.32px;
    font-family: inherit;
    color: transparent;
    caret-color: #222; /*커서색*/
}
.support-cnt .box-search .input-search::placeholder{
    color: #B8B8B8;
}
.support-cnt .box-search .fake {
    position: absolute;
    top: 0;
    left: 30px;     /* input padding-left와 동일 */
    right: 80px;    /* input padding-right와 동일 */
    height: 100%;
    overflow: hidden;
    display: none;
    align-items: center;
    pointer-events: none;
    z-index: 2;
}
.support-cnt .box-search .item-fake {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    will-change: transform;
    min-width: max-content; /*최소 너비를 내용이 필요한 만큼*/
}
.support-cnt .box-search .text-fake {
    display: inline-block;
    flex: 0 0 auto;
    white-space: pre;
    color: #222;
    font-size: 16px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.32px;
    font-family: inherit;
}
.support-cnt .box-search .icon {
   position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    padding: 0;
    border: none;
    background: none;
    outline: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}
.support-cnt .box-search .icon img {
    display: block;
    width: 36px;
    height: 36px;
}
.support-cnt .box-search .delete{
    pointer-events: auto;
    flex: 0 0 auto;
    margin-left: 6px;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    background: none;
    outline: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.support-cnt .box-search .delete img{
    display: block;
    width: 20px;
    height: 20px;
}


/*탭content*/
.support-cnt .tab-cnt {
    display: none;
}
.support-cnt .tab-cnt.current {
    display: inherit;
}
.support-cnt .tab-cnt .list-num {
    color: #424242;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.28px;
    padding: 0 16px;
}
.support-cnt .tab-cnt .list-num span {
    font-weight: 700;
}
.support-cnt .tab-cnt .list-cnt {
    border-top: 2px solid #E8E8E8;
    margin-top: 16px;
}
.support-cnt .tab-cnt .list-dropdown {
    border-bottom: 1px solid #F2F2F2;
    cursor:pointer;
}
.support-cnt .tab-cnt .list-dropdown .tags {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.support-cnt .tab-cnt .list-dropdown .defaultshow {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center; 
    column-gap: 12px;
    padding: 20px 10px;
}
.support-cnt .tab-cnt .list-dropdown .right {
    margin-left: 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.support-cnt .tab-cnt .list-dropdown .date {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: 120%; /* 19.2px */
    letter-spacing: -0.32px;
}
.support-cnt .tab-cnt .list-dropdown .title {
       color: #222;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: -0.32px;
    min-width: 0;           
    width: auto;            
    display: block;         
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position:relative;
}
.support-cnt .tab-cnt .list-dropdown .title:hover {
    font-weight: 700;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-underline-position: under;
}
.support-cnt .tab-cnt .list-dropdown .activeshow {
    display: none;
    background: #FAFAFA;
    padding: 20px;
}
.support-cnt .tab-cnt .list-dropdown .icondown{
    transition:transform .3s;
}
.support-cnt .tab-cnt .list-dropdown.is-ellipsis .defaultshow {
    align-items: center;
}

.support-cnt .tab-cnt .list-dropdown.is-ellipsis.active .defaultshow{
     align-items: start;
}
.support-cnt .tab-cnt .list-dropdown.is-ellipsis.active .title{
     white-space: normal !important;
     font-weight:700;
}
.support-cnt .tab-cnt .list-dropdown.is-singleline.active .title {
    font-weight: 700;
}

.support-cnt .tab-cnt .none {
    text-align: center;
    padding: 200px 150px;
}
.support-cnt .tab-cnt .none .text1 {
    color: #222;
    font-size: 20px;
    font-weight: 700;
    line-height: 140%; /* 28px */
    letter-spacing: -0.4px;
    padding-bottom:4px;
}
.support-cnt .tab-cnt .none .text2 {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}


/*faq 카테고리 탭*/
.support-cnt .s2 .sm-tab-cnt .title {
    position: relative;
    display: block;
    min-width: 0;
    overflow: hidden;
}
.support-cnt .s2 .sm-tab-cnt .title::before {
    content: 'Q.';
    position: absolute;
    left: 0;
    top: -7px;
    color: #00B953;
    font-size: 24px;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: 3px;
}
.support-cnt .s2 .sm-tab-cnt .title > span {
    display: block;
    min-width: 0;
    padding-left: 32px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.support-cnt .s2 .sm-tab-cnt .list-dropdown.active .title > span {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}
.support-cnt .s2 .sm-tab-cnt .title span {
    padding-left: 32px;
}
.support-cnt .s2 .sm-tab-cnt .activeshow{
    padding:20px 30px;
}
.support-cnt .s2 .sm-tab-cnt .activeshow span.firstspan:before {
    content: "A.";
    display: block;
    position: absolute;
    left: 30px;
    color: #424242;
    font-size: 24px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: -0.48px;
}
.support-cnt .s2 .sm-tab-cnt .activeshow span.firstspan{
    padding-left: 28px;
    display:inline-block;
}
.support-cnt .s2 .sm-tab-cnt .right {
    margin-left: 0 !important;
}
.support-cnt .s2 .sm-tab-cnt .defaultshow {
    grid-template-columns: minmax(0,1fr) auto;
}
.support-cnt .s2 .sm-tab-cnt .activeshow {
    position:relative;
}
.support-cnt .s2 .faqtitle {
    color: #222;
    font-size: 24px;
    font-weight: 700;
    line-height: 120%; /* 28.8px */
    letter-spacing: -0.48px;
    margin-bottom:40px;
}
.support-cnt .s2 .sm-tab-cnt .defaultshow{
    padding:23px 10px;
}
/*event 카테고리 탭*/
.support-cnt .s2 .event-tab .eventtitle {
    color: #222;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    line-height: 120%; /* 43.2px */
    letter-spacing: -0.72px;
    margin:60px 0 40px;
}
.support-cnt .s2 .event-tab .sm-link {
    flex: initial;
    padding-left: 12px;
    padding-right: 12px;
    width: 154px;
    box-sizing: border-box;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}
.support-cnt .s2 .event-tab .sm-tab {
    justify-content: start;
    gap: 0;
    border-bottom: 1px solid #e8e8e8;
}
.support-cnt .s2 .event-tab .list-num{
    margin-bottom:40px;
}
.support-cnt .s2 .event-tab .list{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:40px;
}
.support-cnt .s2 .event-tab .item {
    overflow: visible;
    width: calc((100% - 80px) / 3); /*(전체폭 - gap총합) ÷ 아이템개수*/
}
.support-cnt .s2 .event-tab .item .thumb{
    display:block;
    border-radius:30px;
    overflow:hidden;                  
    border:2px solid transparent;     
    transition:border-color .25s ease, box-shadow .25s ease;
}
.support-cnt .s2 .event-tab .item img {
    display: block;
    width: 100%;
    border-radius: 30px;
    transition: transform .25s ease;
    transform-origin: center center;
}
.support-cnt .s2 .event-tab .date {
    padding: 16px 0 8px;
    margin: 0 16px;
    color: #424242;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.4px;
}
.support-cnt .s2 .event-tab .date span {
    color: #00B953;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.4px;
    margin-right:8px;
}
.support-cnt .s2 .event-tab .text {
    margin: 0 16px;
    color: #222;
    font-size: 20px;
    font-weight: 700;
    line-height: 140%; /* 28px */
    letter-spacing: -0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.support-cnt .s2 .event-tab .end-cnt .date span {
    color: #929292;
}
/* hover */
.support-cnt .s2 .event-tab .item:hover .thumb{
    border-color:#00B953;
}
.support-cnt .s2 .event-tab .item:hover .thumb img{
    transform:scale(1.05);
}
.support-cnt .s2 .event-tab .item:hover .date{
    color:#00B953;
}
.support-cnt .s2 .event-tab .item:hover .text {
    color: #00B953;
}
.support-cnt .s2 .event-tab .end-cnt .item:hover .date span {
    color: #00B953;
}
.support-cnt .s2 .event-tab .list-cnt{
    border-top:0;
}


/*공통*/
/*input[type="text"]*/
.introlayout-wrap input[type="text"],
.introlayout-wrap input[type="password"] {
    border-radius: 12px;
    border: 1px solid #D8D8D8;
    height: 52px;
    width: 100%;
    padding: 15px 20px;
    box-sizing: border-box;
    outline: none;
    color: #424242;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%; /* 22.4px */
}
.introlayout-wrap input[type="text"]::placeholder,
.introlayout-wrap input[type="password"]::placeholder {
    color: #929292;
    font-weight: 500;
}
.introlayout-wrap input:focus{
    border: 1px solid #00B953;
}
.introlayout-wrap .clear {
    position: absolute;
    top: 16px;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(-50%, -50%);
    display: inline-block;
}
.introlayout-wrap .clear img {
    height:14px;
}
.introlayout-wrap .clear {
    display: none;
}
/*input 자동완성*/
.introlayout-wrap input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset;
    -webkit-text-fill-color: #424242;
}


/*공통 사용 비밀번호아이콘*/
.introlayout-wrap .password-icon {
    display: none;
}
.introlayout-wrap .password-icon button {
    outline: none;
    border: none;
    background: none;
    position: absolute;
    top: 50%;
    right: 17px;
    transform: translate(-50%, -50%);
    cursor: pointer;
    padding-right: 12px;
}
.introlayout-wrap .password-icon button img {
    width: 22px;
    height: 16.296px;
}
.introlayout-wrap .password-icon .icon-hide {
    display: none;
}
.introlayout-wrap input.pwinput {
    font-size: 16px;
}
.introlayout-wrap input.pwinput::placeholder {
    font-size: 16px;
    color: #929292;
}
/* 값이 있고, password 상태일 때만 */
.introlayout-wrap input.pwinput.is-password-filled {
    font-size: 32px;
}
/* text 상태면 다시 작게 */
.introlayout-wrap input.pwinput[type="text"] {
    font-size: 16px;
}



/*로그인, 회원가입 동의,회원가입,완료 푸터*/
.introlayout-footer {
    background: #222;
}
.introlayout-footer > div {
    padding: 40px 0 60px;
    margin: 0 auto;
    max-width: 460px;
}
.introlayout-footer ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 26px;
}
.introlayout-footer li a{
    color: #B8B8B8;
    font-family: 'NG-bold';
    font-size: 13px;
    font-weight: 700;
    line-height: normal;
}
.introlayout-footer .policy a{
    color: #F2F2F2;
}
.introlayout-footer .line-logo{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    margin-top:16px;
}

/*introlayout*/
.introlayout-wrap {
    min-height: 100dvh;
    display: grid;
    grid-template-rows: 1fr auto;
}
/*로그인*/
.login-cnt {
/*    padding-top: 80px;
    max-width: 460px;
    width: 460px;
    margin: 0 auto;*/


    padding-top: clamp(20px, 5vh, 60px);
/*    max-width: 460px;*/
    width: 460px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
    box-sizing: border-box;
}
.login-cnt .login-box {
    /*padding: 60px 0 100px;*/
    padding: clamp(10px, 2vh, 30px) 0;
}
.login-cnt  .login-box .logo{
    text-align:center;
}
.login-cnt .login-box .logo img {
    /*    height: 32.07px;*/


    height: clamp(24px, 3vh, 32px);
}
.login-cnt .login-box .item-top {
    border-radius: 24px;
    border: 1px solid #E8E8E8;
    background: #FFF;
    background: #fff;
    margin: clamp(15px, 3vh, 40px) 0 clamp(10px, 2vh, 30px);
    padding: clamp(20px, 4vh, 30px) 40px;
}
.login-cnt .login-box .title {
    color: #00B953;
    text-align: center;
    font-size: 24px;
    font-weight: 500;
    line-height: 140%; /* 33.6px */
    margin-bottom:16px;
}

.login-cnt .login-box .form-group{
    position: relative;
    width: 100%;
}

.login-cnt .login-box .login-btn {
    border-radius: 12px;
    background: #00B953;
    height: 52px;
    padding: 12px 20px;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%;
    width: 100%;
    box-sizing: border-box;
    border: 0;
    display: block;
    text-align:center;
}
.login-cnt .login-box .login-step{
    width:100%;
}
.login-cnt .login-box .login-step .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding:0 0 32px;
}
.login-cnt .login-box .login-step .item a {
    display:flex;
    align-items:center;
    gap:6px;
}
.login-cnt .login-box .login-step .item img{
    width:20px;
}
.login-cnt .login-box .login-step span {
    color: #929292;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%; /* 19.6px */
}
.login-cnt .login-box .user{
    display:flex;
    align-items: center;
    flex-direction:column;
/*    gap:12px;*/
    width:100%;
}

.login-cnt .login-box .sub-login-box {
    display: flex;
    align-items: center;
    gap: 8px;
}
.login-cnt .login-box .sub-login-box .text {
    color: #727272;
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%; /* 19.6px */
}
.login-cnt .login-box .toggle-switch {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 20px;
}
.login-cnt .login-box .toggle-switch input {
    display: none;
}

.login-cnt .login-box .slider {
    position: absolute;
    cursor: pointer;
    background: #A5ADB8;
    border-radius: 32px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: .3s;
    height:20px;
    width:46px;
}
.login-cnt .login-box .slider::after {
    content: "OFF";
    position: absolute;
    right: 5px;
    top: 1px;
    font-size: 11px;
    color: #fff;
}
.login-cnt .login-box .slider:before {
    position: absolute;
    content: "";
    width: 16px;
    height: 16px;
    left: 2px;   /* OFF일 때 가로 위치 */
    top: 2px;    /* OFF일 때 세로 위치 */
    background: #fff;
    border-radius: 50%;
    transition: .3s;
}
/* ON 상태 */
.login-cnt .login-box .toggle-switch input:checked + .slider {
    background-color: #00B953;
}

/* ON 텍스트 */
.login-cnt .login-box .toggle-switch input:checked + .slider::after {
    content: "ON";
    left: 6px;
    right: auto;
    color: #FFF;
    font-size: 11px;
    font-weight: 500;
    line-height: 140%;
    top: 3px;
}
.login-cnt .login-box .toggle-switch input:checked + .slider {
    background-color: #1db954;
}
.login-cnt .login-box .toggle-switch input:checked + .slider:before {
    transform: translateX(26px);
}
.login-cnt .login-box .item-bottom{
    display:flex;
    align-items:center;
    flex-direction:column;
    gap:12px;
}
.login-cnt .login-box .item-bottom .top a{
    color: #929292;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%; /* 19.6px */
    position: relative;
    padding-right: 16px;
    margin-right: 16px;
}
.login-cnt .login-box .item-bottom .top a::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 10px;
    background: #E8E8E8;
}

.login-cnt .login-box .item-bottom .top a:last-child::after {
    display: none;
}
.login-cnt .login-box .item-bottom .top a:last-child {
    padding-right: 0px;
    margin-right: 0px;
}
.login-cnt .login-box .item-bottom .bottom p {
    color: #BEBEBE;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%; /* 19.6px */
}
.login-cnt .login-box .item-bottom .bottom a {
    color: #00B953;
    font-size: 14px;
    font-weight: 700;
    line-height: 140%;
    display:inline-block;
    margin-left:8px;
}
/*로그인 슬라이드*/
.login-cnt .login-box .bannerSwiper{
    margin-top:60px;
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: 26px;
    border-radius: 12px;


    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: 26px;
    border-radius: 12px;
    margin-top: clamp(15px, 3vh, 40px);
}
.login-cnt .login-box .item-bottom .bannerSwiper .swiper-slide {
    width: 100%;
    flex-shrink: 0;
    height:140px;
}
.login-cnt .login-box .item-bottom .bannerSwiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px;
}
.login-cnt .login-box .item-bottom .bannerSwiper .swiper-pagination {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
}
.login-cnt .login-box .item-bottom .bannerSwiper .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    margin: 0 3px !important;
    background: #d5d5d5;
    opacity: 1;
    border-radius: 32px;
    background: #E8E8E8;
}
.login-cnt .login-box .item-bottom .bannerSwiper .swiper-pagination-bullet-active {
   background: #00B953;
}
.login-cnt .login-box .ip-number .num{
    display:flex;
    align-items:center;
    gap:8px;
    position:relative;
}
.login-cnt .login-box .ip-number .loginchkbtn{
    border-radius: 12px;
    background: #A5ADB8;
    padding: 15px 24px;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 140%; /* 22.4px */
    outline:none;
    border:none;
    white-space:nowrap;
}
.login-cnt .login-box .ip-number .timer {
    position: absolute;
    right: 121px;
    overflow: hidden;
    color: #00B953;
    text-overflow: ellipsis;
    font-size: 15px;
    font-weight: 500;
    line-height: 140%;
}
.login-cnt .login-box .login-ture {
    color: #00B953;
    font-size: 12px;
    font-weight: 400;
    line-height: 140%; /* 16.8px */
    letter-spacing: -0.24px;
    margin-top:8px;
}
.login-cnt .login-box .login-false {
    color: #FF1F1F;
    font-size: 12px;
    font-weight: 400;
    line-height: 140%; /* 16.8px */
    letter-spacing: -0.24px;
    margin-top: 8px;
}
.login-cnt .text-tip {
    color: #727272;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: -0.24px;
    align-self: flex-start;
    width: 100%;
    margin: 8px 0 16px;
    word-break: keep-all;
}
.login-cnt .text-tip span {
    color: #00B953;
}
.login-cnt .ip-pwd{
    margin-bottom:12px;
}
.login-cnt .ip-subId{
    margin-bottom:12px;
}

/*회원가입-동의하기*/
.agree-cnt {
    padding-top: 80px;
    max-width: 480px;
    width: 480px;
    margin:0 auto;
}
.agree-cnt .agree-box {
    padding: 100px 0;
}
.agree-cnt .agree-box .top-text{
    border-radius: 24px 24px 0 0;
    background: #222;
    height: 60px;
    padding: 20px 0;
    box-sizing: border-box;
    text-align: center;
    margin-top:40px;
}
.agree-cnt .agree-box .top-text p {
    color: #FFF;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: -0.24px;
    word-break: keep-all;
}
.agree-cnt .agree-box .top-text .point1{
    color: #00B953;
    margin-right:4px;
}
.agree-cnt .agree-box .top-text .point2{
   color: #00D49B;
}
.agree-cnt  .agree-box .logo {
    text-align: center;
    display: block;
}
.agree-cnt  .agree-box .logo img {
    height: 32.07px;
}
.agree-cnt .agree-box .join-agree {
    border-bottom-left-radius:24px;
    border-bottom-right-radius:24px;
    border: 1px solid #E8E8E8;
    background: #FFF;
    padding: 50px 40px 50px 40px;
}
.agree-cnt .agree-box .terms-chk-all{
    margin-bottom:40px;
}
.agree-cnt .agree-box .item {
    border: 1px solid #E8E8E8;
    background: #FFF;
    height: 200px;
    padding: 20px;
    overflow: auto;
    margin-top:12px;
}
.agree-cnt .agree-box .item .title {
    color: #424242;
    font-family: 'NG-bold';
    font-size: 13px;
    font-weight: 600;
    line-height: 140%; /* 18.2px */
    letter-spacing: -0.26px;
    margin-bottom:14px;
}
.agree-cnt .agree-box .item .list-type {
    color: #727272;
     font-family: 'NG-regular';
    font-size: 13px;
    font-weight: 400;
    line-height: 140%; /* 18.2px */
    letter-spacing: -0.26px;
    padding:16px 0;
}
.agree-cnt .agree-box .terms-box{
    margin-top:24px;
}
.agree-cnt .agree-box .btn-agree {
    border-radius: 12px;
    background: #A5ADB8;
    height: 52px;
    padding: 12px 20px;
    border:none;
    outline:none;
    width:100%;
    margin-top:40px;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    cursor:pointer;
}

.agree-cnt .agree-box label{
    display:flex;
    align-items:center;
    gap:8px;
    color: #222;
    font-size: 16px;
    font-weight: 600;
    line-height: 140%; /* 23.8px */
    cursor:pointer;
}
.agree-cnt .agree-box label span {
    color: #00B953;
}
.agree-cnt .agree-box input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box;
    margin: 0;
    outline: none;
    cursor: pointer;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    background-image: url("/contents/images/main/ico_uncheck.png");
}
.agree-cnt .agree-box input[type="checkbox"]:checked {
    background-image: url("/contents/images/main/ico_check.png");
}
.agree-cnt .agree-box .chk-all-txt {
    color: #727272;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%; /* 18.2px */
    margin-left:38px;
    word-break:keep-all;
}
.agree-cnt #checkall{
    font-size:18px;
}


/*회원가입*/
.join-cnt {
    padding-top: 80px;
    max-width: 480px;
    width: 480px;
    margin: 0 auto;
}
.join-cnt .logo {
    text-align: center;
    margin-bottom:40px;
}
.join-cnt .logo img {
    height: 32.07px;
}
.join-cnt form {
    border-radius: 24px;
    border: 1px solid #E8E8E8;
    background: #FFF;
    margin-bottom: 20px;
    padding: 50px 40px;
    position:relative;
}
.join-cnt form .title {
    color: #424242;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%; /* 19.6px */
    margin:16px 0 8px;
}
.join-cnt form .form-group:first-child .title{
    margin-top:0;
}
.join-cnt form .wrap-input{
    position:relative;
}
.join-cnt form .item {
    display: flex;
    align-items: center;
    gap: 8px;
}
.join-cnt form  .item .type {
    border-radius: 12px;
    border: 1px solid #D8D8D8;
    padding: 15px 20px;
    height: 52px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    background: none;
    color: #929292;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%;
    font-family: 'Pretendard';
}
.join-cnt form .sm_type .item .type .label {
    position: relative;
    display: inline-block;
    line-height: 22.4px;
    font-weight: 500;
}
.join-cnt form .sm_type .item .type .label::after,
.join-cnt form .accountType .item .type span::after{
    content: "";
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    font-weight: 600;
}
.join-cnt form .item .type.active {
    border: 1px solid #00B953;
}
.join-cnt form .item .type.active .label,
.join-cnt form .item .type.active span{
    color: #00B953;
    font-weight: 600;
}
.join-cnt form .sm_type .item .type img {
    height: 18px;
}
.join-cnt form .sm_type .item .icon:hover + .tooltip{
    display: block; 
}
/*.join-cnt form .sm_type .item .type:hover .tooltip {
    display: block; 
}*/
.join-cnt form .sm_type .item .tooltip {
    display: none;
    position: absolute;
    top: 36px;
    left: 98%;
    transform: translateX(-50%);
    border-radius: 12px;
    border: 1px solid #D8D8D8;
    background: #FFF;
    box-shadow: 0 3px 4px 0 #EAEAEA;
    padding: 16px;
    z-index: 10;
    white-space: nowrap;
}
.join-cnt form .sm_type .item .tooltip p {
    color: #727272;
    font-size: 13px;
    font-weight: 700;
    line-height: 140%; /* 18.2px */
    text-align:left;
}
.join-cnt form .sm_type .item .tooltip .text {
    font-size: 12px;
    font-weight: 400;
}
.join-cnt form .businessbox .item{
    display:flex;
    align-items:center;
    gap:8px;
}
.join-cnt form .businessbox .btn {
    border-radius: 12px;
    background: #00B953;
    padding: 15px 16px;
    cursor: pointer;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 140%;
    height: 52px;
    display: inline-block;
    box-sizing: border-box;
}

.join-cnt form .businessbox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.join-cnt form .businessbox .file {
    white-space: nowrap;
}
.join-cnt form .businessbox .filePreview {
    border-radius: 8px;
    background: var(--BPF8, #F8F8F8);
    padding: 16px 0;
    text-align: center;
    display:none;
    margin-top:8px;
}
.join-cnt form .businessbox .filePreview img {
    width: 240px;
    height: 300px;
    text-align: center;
    border-radius: 8px;
}
.join-cnt form .businessbox2 div{
    display:flex;
    align-items:center;
    gap:8px;
}
.join-cnt form .addressbox .btn {
    border-radius: 12px;
    background: #00B953;
    padding: 15px 6px 15px 16px;
    display: flex;
    align-items: center;
    white-space: nowrap;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 140%;
    height: 52px;
    box-sizing: border-box;
}
.join-cnt form .addressbox .btn img{
    width:25px;
}
 .join-cnt form .addressbox div{
    display: flex;
    align-items: center;
    gap:8px;
 }
.join-cnt form .emailnum,
.join-cnt form .emailnumchk{
    display:flex;
    align-items:center;
    gap:8px;
}
.join-cnt form .emailnumchk .verifyEmail {
    background: #A5ADB8;
}
.join-cnt form .emailnumchk .verifyEmail.active {
    background: #00B953;
}
.join-cnt form .verifyEmail {
    border-radius: 12px;
    background: #00B953;
    height: 52px;
    padding: 15px 16px;
    box-sizing:border-box;
    border:none;
    outline:none;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 140%; /* 22.4px */
    white-space: nowrap;
    cursor:pointer;
}
.join-cnt form .emailnumchk{
    margin-top:8px;
    position: relative;
}

.join-cnt form .emailnum input,
.join-cnt form .emailnumchk input {
    flex: 1;
    min-width: 0;
}
.join-cnt form .emailnumchk #timer {
    position: absolute;
    right: 154px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #00B953;
    font-size: 15px;
    font-weight: 500;
    line-height: 140%; /* 18.2px */
}
.join-cnt form .authMessagewrap{
    margin-top:8px;
}
.join-cnt form #authMessage {
    color: #FF1F1F;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%; /* 16.8px */
    letter-spacing: -0.24px;
}
.join-cnt .join-footer{
    padding-top:20px;
}
.join-cnt .joinok {
    border-radius: 12px;
    background: #00B953;
    height: 60px;
    padding: 12px 20px;
    box-sizing: border-box;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.join-cnt .join-box{
    padding:100px 0;
}
/*회원가입완료*/
.joinend-cnt {
    max-width: 460px;
    width: 460px;
    margin: 0 auto;
    padding-top: 200px;
}
.joinend-cnt .text-box{
/*    padding:200px 0 250px;*/
}
.joinend-cnt .text-box .title {
    color: #222;
    font-size: 30px;
    font-weight: 700;
    line-height: 140%; /* 42px */
    margin-bottom:16px;
    word-break:keep-all;
}
.joinend-cnt .text-box p {
    color: #727272;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
     word-break:keep-all;
}
.joinend-cnt .text-box p span{
    color: #424242;
    font-weight: 500;
}
.joinend-cnt .btn{
    margin-top:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
}
.joinend-cnt .btn a {
    height: 60px;
    padding: 12px 20px;
    color: #FFF;
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    border-radius: 12px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    flex: 1 0 0;
    justify-content: center;
}
.joinend-cnt .btn .home{
    background: #222;
}
.joinend-cnt .btn .login{
   background: #00B953;
}
/*요금*/
/*공통*/
.pay-cnt {
    padding-top: 80px;
}
.pay-cnt .cmn-cnt {
    max-width: 1120px;
    margin: 0 auto;
}
.pay-cnt .cmn-box-head{
    padding-bottom:40px;
    text-align: center; 
}
.pay-cnt .cmn-title {
    border-radius: 56px;
    background: #222;
    color: #FFF;
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    line-height: 120%; /* 31.2px */
    letter-spacing: -0.52px;
    display:inline-block;
    padding: 10px 36px;
    margin-bottom:40px;
}
.pay-cnt .cmn-smtitle {
    color: #00B953;
    font-size: 24px;
    font-weight: 700;
    line-height: 120%; /* 28.8px */
    letter-spacing: -0.48px;
}
.pay-cnt .cmn-text {
    color: #222;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    line-height: 120%; /* 43.2px */
    letter-spacing: -0.72px;
    margin:12px 0;
}
.pay-cnt .cmn-smtext{
    color: #727272;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}
/*s1*/
.pay-cnt .s1{
    position: relative;
    overflow: hidden;
    background: url(/contents/images/intro/pay-banner.png) center / cover no-repeat;
    height:300px;
}
.pay-cnt .s1 .cmn-cnt {
    position: relative;
    z-index: 1;
    padding: 83.5px 0 83.5px;
    text-align: center;
    height: 300px;
    box-sizing: border-box;
}
.pay-cnt .s1 .title {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #FFF;
    font-size: 46px;
    font-weight: 700;
    line-height: 120%;
    margin-bottom:16px;
}
.pay-cnt .s1 p {
    text-align: left;
}
.pay-cnt .s1 .text {
    color: #FFF;
    font-size: 22px;
    font-weight: 500;
    line-height: 140%; /* 30.8px */
}
/*s2*/
.pay-cnt .s2 .cmn-cnt{
    padding:100px 0;
}
.pay-cnt .s2 .item-price{
    display:flex;
    align-items:flex-start;   /* center 말고 위로 맞춤 */
    gap:24px;    
    position: relative;
}
.pay-cnt .s2 .item-price .item {
    position: relative;
    border-radius: 16px;
    border: 1px solid #D8D8D8;
    background: #F8F8F8;
    padding: 40px 30px 24px 30px;
    box-sizing: border-box;
    width: 262px;
    height: 298px;
    display: flex;
    flex-direction: column;
}
.pay-cnt .s2 .item-price .item:first-child .org {
    visibility: hidden;
}
.pay-cnt .s2 .item-price .item:first-child .info {
    visibility: hidden;
}
.pay-cnt .s2 .item-price .month {
    color: #424242;
    font-size: 26px;
    font-weight: 700;
    line-height: 140%; /* 36.4px */
    letter-spacing: -0.52px;
    margin-top: 0;
}
.pay-cnt .s2 .item-price .price {
    color: #222;
    font-size: 29px;
    font-weight: 700;
    line-height: 140%; /* 40.6px */
    letter-spacing: -0.58px;
}
.pay-cnt .s2 .item-price .org {
    color: #A5ADB8;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    text-decoration-line: line-through;
    margin-bottom:12px;
}
.pay-cnt .s2 .item-price .info {
    color: #424242;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.pay-cnt .s2 .item-price .info img {
    width: 14px;
    height: 14px;
    object-fit: contain;
    flex: 0 0 auto;
}
.pay-cnt .s2 .item-price .info:last-of-type {
    margin-bottom: 22px;
}
.pay-cnt .s2 .item-price button {
    border-radius: 8px;
    border: 2px solid #00B953;
    background: #FFF;
    color: #00B953;
    font-size: 18px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.36px;
    width: 100%;
    box-sizing: border-box;
    padding: 14px 8px;
    cursor: pointer;
    margin-top: auto;
}
.pay-cnt .s2 .item-price button:hover{
    background: #00B953;
    color: #FFF;
}
.pay-cnt .s2 .item-price .point {
   box-shadow: inset 0 0 0 2px #00B953;
    overflow: visible;
    border:none;
}
/*.pay-cnt .s2 .item-price .point > div{
    padding: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}*/
.pay-cnt .s2 .item-price .point .month {
   margin-top: -6px;
}
.pay-cnt .s2 .item-price .pointtext {
    position: absolute;
    top: -1px;
    right: 2px;
    background: #00B953;
    border-radius: 16px 16px 0 0;
    color: #FFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.28px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    height: 30px;
    width: 260px;
    z-index: 9;
}
.pay-cnt .s2 .vat {
    color: #727272;
    text-align: right;
    font-size: 12px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.24px;
    margin-bottom: 8px;
}
.pay-cnt .s2 .price-area{
    width: fit-content;
    margin: 0 auto;
}
/*s3*/
.pay-cnt .s3 .cmn-cnt{
    padding-bottom:200px;
}
.pay-cnt .s3 .cmn-text{
    margin-bottom:0;
}
.pay-cnt .s3 .cmn-box-head{
    padding-bottom:60px;
}
.pay-cnt .s3 .item-box {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 40px
}
.pay-cnt .s3 .item-box img{
    width:128px;
}
.pay-cnt .s3 .item-box .item{
    display:flex;
    align-items:center;
    gap:30px;
}
.pay-cnt .s3 .item-box .item .left{
    padding-left:64px;
}
.pay-cnt .s3 .item-box .title {
    color: #222;
    font-size: 24px;
    font-weight: 700;
    line-height: 120%; /* 28.8px */
    letter-spacing: -0.48px;
    margin-bottom:8px;
}
.pay-cnt .s3 .item-box .text {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}



/*태그*/
.cmn-tag-green {
    border-radius: 16px;
    background: #00B953;
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%; /* 16.8px */
    letter-spacing: -0.28px;
    padding: 8px 12px;
    height: 30px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cmn-tag-black {
    border-radius: 16px;
    background: #424242;
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%; /* 16.8px */
    letter-spacing: -0.28px;
    padding: 8px 12px;
    height: 30px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/*서비스*/
.service-cnt{
   padding-top:80px;
}
.service-cnt .cmn-cnt {
    max-width: 1200px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    padding: 0;
}
.service-cnt .service-cmn-s1 {
    position: relative;
    overflow: hidden;
    height: 300px;
    background: url('/contents/images/intro/sv-main.png') center / cover no-repeat;
    background-size: 100% 100%;
}
.service-cnt .s1 .cmn-cnt {
    position: relative;
    z-index: 1;
    padding: 83.5px 0 83.5px;
    text-align: center;
    height: 300px;
    box-sizing: border-box;
}
.service-cnt .service-cmn-s1 .title {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #FFF;
    font-size: 46px;
    font-weight: 700;
    line-height: 120%;
    padding-left: 40px;
}
.service-cnt .service-cmn-s1 .text {
    color: #FFF;
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%; /* 30.8px */
    padding-left: 40px;
    margin-top: 16px;
}
.service-cnt .service-cmn-s1 p {
    text-align: left;
}
/*section2*/
.service-cnt .s2 .cmn-cnt{
    padding:100px 0 80px;
}
.service-cnt .s2 .tab{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:20px;
    height: 50px;
}
.service-cnt cmn-box1 .item {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.service-cnt .s2 .tab-link{
    position:relative;
}
.service-cnt .s2 .tab-link span{
    border-radius: 56px;
    background: #F2F2F2;
    color: #424242;
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    line-height: 120%; /* 31.2px */
    letter-spacing: -0.52px;
    padding: 10px 36px;
    cursor:pointer;
    white-space:nowrap;
}
.service-cnt .s2 .tab-link span.active {
    background: #00B953;
    color: #FFF;
}
.service-cnt .s2 .tab-link .tagnew {
    width: 106px;
    position: absolute;
    top: -66px;
    left: 50%;
    right: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -157%);
    animation: floatBubble 1.5s ease-in-out infinite;
}
@keyframes floatBubble {
    0% {
        translate: 0 0;
    }

    50% {
        translate: 0 -6px;
    }

    100% {
        translate: 0 0;
    }
}
/*section3*/
.service-cnt .s3 .title {
    color: #222;
    font-size: 36px;
    font-weight: 700;
    line-height: 130%; /* 46.8px */
    letter-spacing: -0.72px;
    margin-bottom:40px;
    text-align:left;
}
.service-cnt .s3 .tab-line{
    display:flex;
    align-items:center;
    gap:20px;
}
.service-cnt .s3 .tab-line a {
    border-radius: 56px;
    border: 1px solid #D9D9D9;
    padding: 16px 24px;
    color: #424242;
    font-size: 18px;
    font-weight: 500;
    line-height: 120%; /* 21.6px */
    letter-spacing: -0.36px;
    display: flex;
    align-items: center;
    gap: 4px;
    box-sizing: border-box;
    height: 60px;
}
.service-cnt .s3 .tab-line a img {
    width: 28px;
}
.service-cnt .s3 .cmn-cnt{
    padding-top:100px;
}
.service-cnt .s4 {
    position: relative;
    overflow: hidden;
    background: url(/contents/images/intro/sv-banner.png) center / cover no-repeat;
    height: 366px;
    padding: 80px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top:200px;
}
.service-cnt .s4 p {
    color: #FFF;
    text-align: center;
    font-size: 44px;
    font-weight: 700;
    line-height: 140%; /* 61.6px */
    letter-spacing: -1.32px;
}
.service-cnt .s4 a {
    border-radius: 8px;
    background: #FFF;
    padding: 12px 34px;
    color: #00B953;
    font-size: 20px;
    font-weight: 700;
    line-height: 140%; /* 28px */
    letter-spacing: -0.4px;
    text-align:center;
    margin-top:30px;
}

/*tab-content*/
.service-cnt .tab-cnt{
    display:none;
}
.service-cnt .tab-cnt.active{
    display:inherit;
}
.service-cnt .tab-cnt .cmn-cnt{
    padding:0;
}
.service-cnt .tab-cnt .view-title {
    color: #222;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    line-height: 140%; /* 50.4px */
    letter-spacing: -0.72px;
    margin-bottom:12px;
}
.service-cnt .tab-cnt .view-text {
    color: #727272;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
}
/*tab-content box1*/
/*공통사용*/
.service-cnt .cmn-box1 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    max-width: 1000px;
    margin: 0 auto;
    padding-top: 60px;
}
.service-cnt .cmn-box1 .item {
    border-radius: 16px;
    background: #F8F8F8;
    height: 190px;
    padding: 20px 30px;
    flex: 1 0 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.service-cnt .cmn-box1 .item p {
    color: #222;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    margin-top: 12px;
}
.service-cnt .cmn-flex .item-line{
    display: flex;
    align-items: center;
    gap: 60px;
    margin:100px 0;
}
.service-cnt .cmn-flex .text-green {
    color: #00B953;
    font-size: 16px;
    font-weight: 700;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}
.service-cnt .cmn-flex .text-big {
    color: #222;
    font-size: 36px;
    font-weight: 700;
    line-height: 130%; /* 46.8px */
    letter-spacing: -0.72px;
    margin:16px 0;
}
.service-cnt .cmn-flex .text-sm {
    color: #727272;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
}
.service-cnt .cmn-flex .text-sm span {
    color: #727272;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -0.36px;
}
.service-cnt .cmn-flex .item img{
    width: 600px;
}
.service-cnt .cmn-flex .lefttext{
    flex: 1;
    min-width: 0;
    padding-left: 100px;
    box-sizing: border-box;
    text-align:left;
}
.service-cnt .cmn-flex .rightimg{
    width: 600px;
    flex-shrink: 0;
}
.service-cnt .cmn-flex .righttext {
    flex: 1;
    min-width: 0;
    padding-left: 100px;
    box-sizing: border-box;
    text-align:left;
}
.service-cnt .cmn-flex .leftimg{
    width: 600px;
    flex-shrink: 0;
}
.service-cnt .cmn-flex .item-line:nth-child(2) .righttext{
    padding-left:40px;
}
.service-cnt .cmn-text-top {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    line-height: 140%; /* 44.8px */
    letter-spacing: -0.64px;
}
.service-cnt .cmn-text-bottom {
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    margin-top:12px;
    text-align:center;
}

/*tab-content tab1 box1*/
.service-cnt .tab1 .box1 .item:nth-child(1) img {
    width: 114px;
    height: 114px;
}
.service-cnt .tab1 .box1 .item:nth-child(2) img {
    width: 134px;
    height: 109px;
}
.service-cnt .tab1 .box1 .item:nth-child(3) img {
    width: 195px;
    height: 110px;
}
/*tab-content tab1 box2*/
.service-cnt .tab1 .box2 {
    border-radius: 24px;
    background: linear-gradient(180deg, #222 0%, #003B02 100%);
    padding: 60px 100px;
    margin:100px 0;
}
.service-cnt .tab1 .box2 .cmn-text-top {
    color: #FFF;
}
.service-cnt .tab1 .box2 .cmn-text-bottom {
    color: #F2F2F2 !important;
    text-align:center;
}
.service-cnt .tab1 .box2 .wrap {
    display: flex;
    align-items: center;
    margin-top: 60px;
    position: relative;
}
.service-cnt .tab1 .box2 .wrap > div {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.service-cnt .tab1 .box2 .service4 {
    width: 544px;
    position: absolute;
    right: -60px;
    top: -127px;
}
.service-cnt .tab1 .box2 .item {
    width: 500px;
    padding: 30px 40px;
    border-radius: 16px;
    box-sizing: border-box;
}
.service-cnt .tab1 .box2 .item:first-child {
    position: relative;
    border-radius: 16px;
    background: rgba(42, 42, 42, 0.40);
    box-sizing: border-box;
    background:url(/contents/images/intro/gradation.png) center / cover no-repeat;
}
.service-cnt .tab1 .box2 .item:first-child::before {
    content: "";
    background: rgba(42, 42, 42, 0.40);
    position: absolute;
    width: 494px;
    height: 154px;
    top: 1px;
    left: 0;
    border-radius: 16px;
}
.service-cnt .tab1 .box2 .item:nth-child(2) {
    border: 1px solid #747474;
    background: rgba(42, 42, 42, 0.40);
}
.service-cnt .tab1 .box2 .item-title {
    color: #2AE67F;
    font-size: 24px;
    font-weight: 500;
    line-height: 140%; /* 33.6px */
    letter-spacing: -0.48px;
    position: relative;
    z-index: 9;
}
.service-cnt .tab1 .box2 .item:nth-child(2) .item-title {
    color: #FFF;
}
.service-cnt .tab1 .box2 .item-text {
    color: #F2F2F2;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    margin-top: 16px;
    position: relative;
    z-index: 9;
}
/*tab-content tab1 box3*/
.service-cnt .tab1 .box3 {
    position: relative;
    margin: 100px 0;
    padding: 100px 0;
    background: #f5f5f5;
    box-shadow: 0 0 0 100vmax #f5f5f5;
    clip-path: inset(0 -100vmax);
}
.service-cnt .tab1 .box3 .box-title {
    color: #222;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    line-height: 120%; /* 43.2px */
    letter-spacing: -0.72px;
    margin-bottom:60px;
}
.service-cnt .tab1 .box3 .item-line {
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom:40px;
}
.service-cnt .tab1 .box3 .item {
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0 4px 20px 0 rgba(153, 153, 153, 0.25);
    padding: 24px 40px 30px 40px;
    box-sizing: border-box;
    flex: 0 0 calc((100% - 80px) / 3);
    height:240px;
}
.service-cnt .tab1 .box3 .item img{
    width:100px;
    margin-left: auto;
}
.service-cnt .tab1 .box3 .top {
    display: flex;
    align-items: flex-end;
}
.service-cnt .tab1 .box3 .item .top span:nth-child(1) {
    border-radius: 24px;
    background: #00B953;
    color: #FFF;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
    margin-bottom: 6px;
    padding: 2px 10px;
}
.service-cnt .tab1 .box3 .item .top span:last-child {
    color: #424242;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    line-height: 140%; /* 30.8px */
    letter-spacing: -0.44px;
    padding-top: 6px;
    display: inline-block;
}
.service-cnt .tab1 .box3 .item .bottom{
    margin-top:20px;
}
.service-cnt .tab1 .box3 .item .bottom p {
    color: #727272;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.32px;
}
/*tab2*/
.service-cnt .tab2 .box1 .item {
    width: 307px;
    flex: none;
}
.service-cnt .tab2 .box1 .item img {
    width: 117px;
    height: 111px;
}
.service-cnt .tab2 .box2 {
    margin: 100px 0;
    overflow: hidden;
    background: url(/contents/images/intro/sv-section2.png) center / cover no-repeat;
    height: 500px;
    padding: 60px 0;
    box-sizing: border-box;
}
.service-cnt .tab2 .box2 .cmn-text-top {
    color: #222;
}
.service-cnt .tab2 .box2 .cmn-text-bottom {
   color: #727272;
}
.service-cnt .tab2 .box2 img {
    width: 630px;
}
.service-cnt .tab2 .box2 .text-top {
    color: #222;
    text-align: center;
    font-family: Pretendard;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 44.8px */
    letter-spacing: -0.64px;
}

.service-cnt .tab2 .box3{
    margin-bottom:100px;
}
.service-cnt .tab2 .box3 img{
    height:300px;
}
/*tab3*/
.service-cnt .tab3 .box1 img {
    width: 165px;
    height: 113px;
}
.service-cnt .tab3 .box2 {
    margin: 100px 0;
    text-align: center;
    height: 292px;
}
.service-cnt .tab3 .box2 img {
    height:100%;
}
/*tab4*/
.service-cnt .tab4 .box1 .item:nth-child(1) img {
    width: 154px;
    height: 113px;
}
.service-cnt .tab4 .box1 .item:nth-child(2) img {
   width: 96px;
    height: 113px;
}
.service-cnt .tab4 .box1 .item:nth-child(3) img {
   width: 134px;
   height: 111px;
}
.service-cnt .tab4 .box1 .item:nth-child(4) img {
    width: 134px;
    height: 111px;
}
.service-cnt .tab4 .box2 {
    margin: 100px 0;
    overflow: hidden;
    background: url(/contents/images/intro/sv-tab4.png) center / cover no-repeat;
    height: 468px;
    padding: 60px 100px;
    box-sizing: border-box;
}
.service-cnt .tab4 .box2 .cmn-text-top {
    color: #FFF;
}
.service-cnt .tab4 .box2 .cmn-text-bottom {
    color: #F2F2F2;
}
.service-cnt .tab4 .box2 .wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:40px;
    margin-top:60px;
}
    .service-cnt .tab4 .box2 .item {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 20px;
        border-radius: 16px;
        background: rgba(42, 42, 42, 0.80);
        padding: 30px 40px;
        height: 206px;
        box-sizing: border-box;
        backdrop-filter: blur(7px) brightness(102%);
        -webkit-backdrop-filter: blur(7px) brightness(102%);
    }
.service-cnt .tab4 .box2 .item:nth-child(1){
    border: 1px solid #666;
}
.service-cnt .tab4 .box2 .item:nth-child(2) {
    position: relative;
    border-radius: 16px;
   width: 485px;
    box-sizing: border-box;
    background: url(/contents/images/intro/gradation2.png) center / cover no-repeat;
}
.service-cnt .tab4 .box2 .item:nth-child(2)::before {
    content: "";
    background: rgba(42, 42, 42, 0.80);
    position: absolute;
    width: 100%;
    height: 203px;
    top: 1px;
    left: 2px;
    border-radius: 16px;
    box-sizing: border-box;
    width: 482px;
}
.service-cnt .tab4 .box2 .item:nth-child(1) img{
    height: 136px;
}
.service-cnt .tab4 .box2 .item:nth-child(2) img {
    height: 146px;
    position: relative;
}
.service-cnt .tab4 .box2 .item .text{
    text-align:left;
    position:relative;
    z-index:9;
}
.service-cnt .tab4 .box2 .item-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 140%; /* 33.6px */
    letter-spacing: -0.48px;
    margin-bottom:16px;
}
.service-cnt .tab4 .box2 .item-text {
    font-size: 18px;
    font-weight: 400;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
}
.service-cnt .tab4 .box2 .item:nth-child(1) .item-title{
    color: #FFF;
}
.service-cnt .tab4 .box2 .item:nth-child(2) .item-title{
    color: #2AE67F;
}
.service-cnt .tab4 .box2 .item:nth-child(1) .item-text{
    color: #F2F2F2;
}
.service-cnt .tab4 .box2 .item:nth-child(2) .item-text{
    color: #F8F8F8;
}
/*tab5*/
.service-cnt .tab5 .box1 .item {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.service-cnt .tab5 .box1 .item:nth-child(1) img {
    width: 132px;
    height: 113px;
}
.service-cnt .tab5 .box1 .item:nth-child(2) img {
    width: 178px;
    height: 113px;
}
.service-cnt .tab5 .box1 .item:nth-child(3) img {
    width: 100px;
    height: 113px;
}
.service-cnt .tab5 .box1 .item:nth-child(4) img {
    width: 146px;
    height: 113px;
}
.service-cnt .tab5 .box2 {
    margin: 100px 0;
    overflow: hidden;
    background: url(/contents/images/intro/sv-tab5bg.png) center / cover no-repeat;
/*    height: 505px;*/
    padding: 60px 100px;
    box-sizing:border-box;
}
.service-cnt .tab5 .box-tag {
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin: 0 auto;
    box-sizing: border-box;
    width: 530px;
    flex-wrap: wrap;
    padding-top:40px;
}
.service-cnt .tab5 .box-tag .img1 {
    width: 67px;
    height: 71px;
}
.service-cnt .tab5 .box-tag .img2 {
    width: 65px;
    height: 68px;
}
.service-cnt .tab5 .box-tag .img3 {
    width: 52px;
    height: 54px;
}
.service-cnt .tab5 .box-tag span {
    border-radius: 40px;
    border: 1px solid #00B953;
    background: #FFF;
    color: #00B953;
    font-size: 18px;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    letter-spacing: -0.36px;
    padding: 8px 20px;
}
.service-cnt .tab5 .box-tag .bg {
    background: #00B953;
    color: #FFF;
}
.service-cnt .tab5 .box-tag .gap1{
    margin-left:43.5px;
}
.service-cnt .tab5 .box-tag .gap2{
    margin-left:100px;
}
.service-cnt .tab5 .cmn-text-bottom {
    color: #727272;
}
/*tab6*/
.service-cnt .tab6 .box1 {
    border-radius: 30px;
    background: linear-gradient(180deg, #DDFFF6 5.5%, #FFF 112.23%);
    height: 673px;
    padding: 60px 241px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.service-cnt .tab6 .box1 img{
    width: 1060px;
}
.service-cnt .tab6 .box1 .img {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}
.service-cnt .tab6 .box2{
    display:flex;
    align-items:center;
    gap:20px;
    margin-top:100px;
}
.service-cnt .tab6 .box2 .item {
    width: 285px;
    height: 200px;
    padding: 20px 40px;
    border-radius: 16px;
    border: 2px solid #A7E9D7;
    background: #FFF;
    box-shadow: 2px 4px 10px 0 #E1EDEA;
    box-sizing: border-box;
    text-align:center;
}
.service-cnt .tab6 .box2 .itembg {
    background: #F8FEFC;
}
.service-cnt .tab6 .box2 img {
    width: 45px;
    height: 44px;
    margin-bottom:4px;
}
.service-cnt .tab6 .box2 p {
    color: #000;
    font-size: 22px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.44px;
}
.service-cnt .tab6 .box2 .point {
    color: #00D49B;
}
.service-cnt .tab6 .box3 a {
    border-radius: 999px;
    border: 2px solid #A0FFE5;
    background: #00D49B;
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
    line-height: 140%; /* 30.8px */
    letter-spacing: -0.44px;
    width: 360px;
    height: 80px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    box-sizing: border-box;
}
.service-cnt .tab6 .box3 a::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50px;
    padding: 2px;
    background: linear-gradient(45deg, #04b485, #a0ffe5);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0 !important;
    border-radius: inherit !important;
    pointer-events: none !important;
}
.service-cnt .tab6 .box3{
    margin-top:60px;
    text-align:center;
}




@media(max-height: 1024px) {
    .login-cnt {
        padding-top: 80px;
    }
    .login-cnt .login-box {
        padding-top: 60px;
        padding-bottom: 100px;
    }
    .login-cnt .login-box .item-top {
        margin: 12px 0;
        padding: 24px;
    }
    .login-cnt .login-box .bannerSwiper {
        margin-top: 12px;
    }
    .login-cnt .login-box .login-step .item{
        padding-bottom:18px;
    }
    .login-cnt .text-tip{
        margin-bottom:14px;
    }
}
@media(max-height: 1000px){
    .login-cnt {
        padding-top: 60px;
    }
    .login-cnt .login-box {
        padding-top: 45px;
        padding-bottom: 45px;
    }
    .login-cnt .login-box .item-top {
        padding: 20px 24px;
    }
    .login-cnt .login-box .item-bottom {
        gap: 8px;
    }
}



@media(max-width:640px) {
 
    .login-cnt {
        width: 100%;
        max-width: 100%;
      
        justify-content: flex-start;
        padding: 40px 40px 40px;
        min-height: auto;
    }

    .login-cnt .login-box .item-top {
        border: none;
        margin: 0;
        padding: 20px 0;
    }
    .login-cnt .login-box .login-step .item{
        padding-bottom:24px;
    }
    .login-cnt .login-box .bannerSwiper{
        margin-top:20px;
    }
    .login-cnt .login-box .item-bottom{
        gap:8px;
    }
    .login-cnt .login-box .ip-number .loginchkbtn{
        height:42px;
    }
    .login-cnt .text-tip{
       font-size: 12px;
       margin-bottom:12px;
    }



    .agree-cnt {
        max-width: stretch;
        width: 100%;
        padding: 16px 16px 80px;
        margin: 0;
    }
    .agree-cnt .agree-box{
        padding-top:0;
    }
    .agree-cnt .agree-box .top-text {
        margin-top: 40px;
        height: auto;
    }
    .agree-cnt .agree-box .top-text p {
        padding: 0 12px;
    }
    .agree-cnt .agree-box .join-agree {
        padding: 40px;
    }
    .agree-cnt .agree-box{
        padding:20px 0;
    }
    .agree-cnt .agree-box .terms-chk-all{
        margin-bottom:20px;
    }
    .agree-cnt .agree-box input[type="checkbox"] {
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
    }
    .agree-cnt .agree-box .item {
        padding: 16px;
    }
    .agree-cnt .agree-box .item .list-type {
        padding: 8px 0;
    }
 
    .agree-cnt .agree-box .chk-all-txt{
        margin-left:28px;
    }
    .agree-cnt .agree-box .logo img {
        height: 30px;
    }


    .join-cnt {
        max-width: stretch;
        width: 100%;
        padding: 16px 16px 80px;
        margin: 0;
    }
    .join-cnt .join-box {
        padding: 20px 0;
    }
    .join-cnt form {
        padding: 40px 20px;
    }
    .join-cnt .logo{
        margin-bottom:40px;
    }
    .join-cnt form .item .type {
        white-space: nowrap;
    }
    .join-cnt form .emailnumchk #timer {
        right: 143px;
    }
    .join-cnt .logo img{
        height:30px;
    }
    .join-cnt form .sm_type .item .tooltip.seller {
          left: 35px;
    }



    .joinend-cnt {
        max-width: stretch;
        width: 100%;
        padding: 160px 16px 100px;
        margin: 0;
    }
    .joinend-cnt .btn{
        flex-wrap:wrap;
        gap: 8px;
        
    }
    .joinend-cnt .btn a {
        white-space: nowrap;
       
    }
      
}



@media(max-width:500px) {
    .join-cnt form .title{
        font-size:13px;
    }
    
    .join-cnt form .item .type {
       font-size:15px;
    }
    .join-cnt form .businessbox .btn{
        font-size:15px;
    }
    .join-cnt form .addressbox .btn{
        font-size:15px;
    }
    .join-cnt form .verifyEmail {
        font-size: 15px;
    }
    .join-cnt form #authMessage{
        font-size:12px;
    }
}




/*이용약관*/
.terms-wrapper {
    position: relative;
    margin: 0 auto;
    width: 960px;
    font-size: 13px;
    word-break: keep-all;
    padding:200px 0 140px;
}
.terms-title {
    font-size: 30px;
    margin-top: 0;
    margin-bottom: 20px;
}
.terms-menu {
   border-bottom: 1px solid #F2F2F2;
}
.terms-menu ul {
    height: 57px;
}
.terms-menu li {
    width: 200px;
    height: 100%;
    float: left;
    box-sizing: border-box;
    cursor: pointer;
    background: #F2F2F2;
}
.terms-menu li a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #424242;
    font-size: 15px;
    border:none;
    cursor: pointer;
}
.agreement-content,
.policy-content {
    padding: 40px;
}
.agreement-content .list-type,
.policy-content .list-type{
    padding: 20px 0;
}
.agreement-content .list-type ul,
.policy-content .list-type ul{
    margin: 14px 0;
}
.agreement-content .list-type strong,
.policy-content .list-type strong {
    margin-bottom: 20px;
}

.policy-content .list-type table,
.agreement-content .list-type table {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    text-align: center;
}
.policy-content .list-type table p,
.agreement-content .list-type table p {
    margin: 0;
}
.policy-content .list-type table thead th,
.agreement-content .list-type table thead th {
    background-color: #f7f7f7;
}
.policy-content .list-type table th,
.agreement-content .list-type table th {
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}
.policy-content .list-type table td,
.agreement-content .list-type table td {
    padding: 10px 20px;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
.policy-content .list-type table td:last-child,
.agreement-content .list-type table td:last-child {
    border-right: none;
}
.agreement-content .list-type .terms-table {
    padding: 10px 0;
}

.policy-content .list-type table tr:last-child td,
.agreement-content .list-type table tr:last-child td{
    border-bottom: none;
}
.terms-use.active {
    border-bottom: 4px solid #46ab43;
}
.terms-use.active a{
    color: #46ab43;
}
.terms-privacy.active {
    border-bottom: 4px solid #46ab43;
}
.terms-privacy.active a{
    color: #46ab43;
}

.terms-banner {
    position: relative;
    overflow: hidden;
    background: url(/contents/images/intro/sv-banner.png) center / cover no-repeat;
    height: 366px;
    padding: 80px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.terms-banner p {
    color: #FFF;
    text-align: center;
    font-size: 44px;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -1.32px;
}
.terms-banner a {
    border-radius: 8px;
    background: #FFF;
    padding: 12px 34px;
    color: #00B953;
    font-size: 20px;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -0.4px;
    text-align: center;
    margin-top: 30px;
}
