html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    font-family: "MinSansVF", "Min Sans", sans-serif;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    vertical-align: baseline;
    letter-spacing: -0.075em;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
    font-family: "MinSansVF", "Min Sans", sans-serif;
    line-height: normal;
}
*, *::before, *::after {
    box-sizing: border-box;
}
a {
    color: #0a47ff;
    font-family: "MinSansVF", "Min Sans", sans-serif;
    color: inherit;
}
.fl {float:left;}
.fr {float:right;}
.tl {text-align:left;}
.tr {text-align:right;}
.tc {text-align:center;}

ol, ul {
    margin-top: 0;
    margin-bottom: 0;
    list-style: none;
}
button, html input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer;
}
button, select {
    text-transform: none;
}
button {
    overflow: visible;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: inherit;
}

img {max-width: 100%; max-height: 100%;}

.material-symbols-rounded {vertical-align:middle;}

body {
    
    font-weight: 400;
    line-height: normal;
    letter-spacing: -.065em;
    color: #333333;
    word-break: keep-all;
    word-wrap: break-word;
    background-color: #ffffff;
    transition: 1s;
}

/* .loading {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9); display: flex; align-items: center; justify-content: center; z-index: 100; transition: 1s;}
.loading p {font-size: 30px; font-weight: 600; color: #fff; text-align: center;}
body.active {}
body.active .loading {opacity: 0; visibility: hidden;} */

.flex {
    display: flex;
    align-items: center;
    justify-content: center;
}
.m_back {
	
}

.half_wrap {
    box-sizing: border-box;
    margin: 12px auto 0;
}
.m_wrap{max-width: 100%;min-height:100vh;}


/* 상단배너 */
.top-banner {display: flex; justify-content: center; text-align: center; background-color: #3F80EA; color: #fff; padding: 15px; align-items: center; gap: 20px;}
.top-banner > span {font-size: 16px; font-weight: 500; background-color: #E55263; padding: 8px 30px; border-radius: 30px;}
.top-banner > p {font-size: 24px; font-weight: 700;}
.top-banner > p em {color: #F3FF46;}
.top-banner > a {border: 1px solid #3F80EA; color: #3F80EA; background-color: #fff; border-radius: 6px; font-size: 16px; font-weight: 500; letter-spacing: -0.05em; padding: 0 15px; margin-left: 10px; line-height: 35px; text-decoration: none; transition: 0.2s;}
.top-banner > a:hover {background-color: #3F80EA; color: #fff; border-color: #fff;}

@media all and (max-width: 768px) {
    .top-banner {gap: 5px; flex-wrap: wrap;}
    .top-banner > span {font-size: 14px; padding: 5px 10px;}
    .top-banner > p {font-size: 18px;}
    .top-banner > a {font-size: 14px; line-height: 30px; padding: 0 10px;}
}


@font-face {
    font-family: 'GmarketSans';
    src: url(/static/font/GmarketSansLight.woff2) format(woff);
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSans';
    src: url(/static/font/GmarketSansMedium.woff2) format(woff);
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSans';
    src: url(/static/font/GmarketSansBold.woff2) format(woff);
    font-weight: 900;
    font-style: normal;
}


/* 메인 중간배너 */
.main-banner {display: flex; justify-content: center; text-align: center; background-color: #E8E6E6; padding: 15px; align-items: center; gap: 8px; position: relative; margin-bottom: 2px;}
.main-banner > span {font-size: 22px; font-weight: 500; background-color: #FF545E; padding: 3px 18px; border-radius: 30px; font-size: 22px; color: #fff; border: 1px solid #DA2A34;}
.main-banner > p {font-size: 20px; font-weight: 500; font-family: 'GmarketSans', sans-serif; color: #000; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
.main-banner > p:after {display: inline-block; content: ''; width: 49px; height: 44px; background: url('/static/main/images/main-banner-ico.svg') no-repeat center / contain; margin-left: 10px;}
.main-banner > p em {color: #E83452; font-size: 26px; font-weight: 700; font-family: 'GmarketSans', sans-serif; display: inline-block; margin: 0 19px 0 14px; vertical-align: middle;}
.main-banner > a {color: #000; border-radius: 6px; font-size: 14px; line-height: 35px; text-decoration: none; transition: 0.2s; position: absolute; top: 0; bottom: 0; right: 160px; background-color: #fff; border: 1px solid #000; font-weight: 700; font-family: 'GmarketSans', sans-serif; display: flex; align-items: center; height: 38px; width: 146px; justify-content: center; gap: 2px; margin: auto 0; padding-top: 4px;}
.main-banner > a:hover {border-color: #fff;}
.main-banner > a img {margin-top: -5px;}

@media all and (max-width: 1200px) {
    .main-banner > a {position: static;}
}
@media all and (max-width: 768px) {
    .main-banner {gap: 5px 10px; flex-wrap: wrap;}
    .main-banner > span {font-size: 14px; padding: 5px 10px;}
    .main-banner > p {font-size: 18px;}
    .main-banner > p em {margin: 0 4px;}
    .main-banner > p:after {display: none;}
}


/* 헤더 */
#header .inner {
    position: relative;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    height: 100px;
}

#header .inner .logo {
   display:flex;
   align-items: center;
}
#header .inner .logo span {
	font-size:14px;
	font-weight:600;
	letter-spacing:-.03em;
	padding-left:10px;
	color:#333;
}
/* #header .inner .logo a {
    display: block;
   width: 134px;
    height: 32px;
	background: url("../images/logo.png") no-repeat 0 0;
    background-size: 100%;
    cursor: pointer;
} */
#header .inner .logo a {
    display: block;
    width: 134px;
    height: 32px;
	background: url("../images/logo.png") no-repeat 0 0;
    background-size: 100%;
    cursor: pointer;
}


/*nav 메뉴 ST*/
.overlay-menu .gnb {
    position: relative;
    display: flex;
    align-items: center;
}

.mb_menu_open {display: none;}

.gnb li.onList {
    margin: 0;
}
.gnb li {
    text-align: center;
}


.gnb li a {
    display: block;
    color: #333;
    font-size: 17px;
    font-weight: 600;
    line-height: 45px;
    text-decoration: none;
    letter-spacing: 0;
}

.gnb li.safemenu {
    display: flex;
    align-items: center;
    margin: 0 25px 0 0;
}

.gnb li.safemenu .sub-menu {
    font-size: 17px;
    font-weight: 600;
    color: #333;
    letter-spacing: -0.05em;
    padding: 0;
    position: relative;
    width: 110px;
    box-sizing: border-box;
}
.gnb li.safemenu .sub-menu:hover, .gnb li.safemenu  .m_topmenu:hover{color:#459cfe;}
.fc-b {color:#459cfe;}

.gnb li a.roundBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    padding: 0 15px;
    height: 35px;
    border: 1px solid #3F80EA;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    color: #3F80EA;
    letter-spacing: -0.05em;
	margin-left:10px;
    gap: 5px;
}
.gnb li:not(.outLink) a.roundBtn::before {content: ''; display: block; background: no-repeat center;}
.gnb li a.roundBtn.login:before,
.gnb li a.roundBtn.logout:before {width: 18px; height: 18px;}
.gnb li a.roundBtn.login:before {background-image: url('/static/main/images/i_login2.svg');}
.gnb li a.roundBtn.logout:before {background-image: url('/static/main/images/i_logout2.svg');}
.gnb li a.roundBtn.join:before {width: 12px; height: 12px; background-image: url('/static/main/images/i_join.svg');}
.gnb li a.roundBtn.on {
    color: #fff;
    background-image: linear-gradient(to right, #3F80EA, #2AC9A4), linear-gradient(to right, #3F80EA, #2AC9A4);
    background-origin: border-box;
    background-clip: content-box, border-box;
    border: 1px solid transparent;
    font-weight: 600;	
}


@media all and (max-width:1400px){
    #header .inner {max-width: 1200px;}
}
@media all and (max-width:1200px){
    #header .inner {padding: 0 3%;}
    .gnb li.safemenu .sub-menu {width: 70px;}

}
@media all and (max-width:1024px){
    #header {padding-top: 30px;}
    #header .inner {display: block;}
    #header .inner .logo {justify-content: center;}
    .overlay-menu .gnb {display: block; margin-top: 10px;}
    .gnb li:not(.safemenu) {display: none;}
    .gnb li.safemenu {margin-right: 0;}
    .gnb li.safemenu .sub-menu {width: 25%; display: block; font-size: 16px;}
}
@media all and (max-width:560px){
    #header .inner {height: auto;}
    #header .inner .logo {display: block; text-align: center;}
    #header .inner .logo a {margin: 0 auto 10px;}
    .gnb li.safemenu {width: 100%; margin-right: 0;}
    .gnb li.safemenu .sub-menu {}
    .overlay-menu .gnb {justify-content: center;}
}

/*nav 메뉴 ED*/

/* 메인 헤더 */
#header .m_inner .logo a {background: url("../images/logo_w.png") no-repeat 0 0;}
#header .m_inner .logo span {color:#e8e8e8;}

.gnb li.safemenu .m_topmenu {color: #fff;}

/***********메인 요금제 관련 태그**************/
.t-noti {position: relative;}
.t-noti .tit-noti {display: none; position: absolute; bottom: -20px; right: -45px; width: 86px; height: 30px; background-color: #fff; font-size: 14px; font-weight: 400; text-align: center; line-height: 30px; color: #666; transition: display 0.1s ease;}
.t-noti:hover .tit-noti {display: block;}


/* 메인페이지 공통 */

.main_wrap {
    width: 1200px;
    margin: 0 auto;
    position: relative;
}

@media all and (max-width:1200px){
    .main_wrap {padding: 0 3%; width: 100%;}
}

.select-tab-wrap .cont_tit {
    font-size: 40px;
    font-weight: bold;
    color: #121212;
    text-align: center;
}
.select-tab-wrap .con_subtit {
    display: block;
    text-align: center;
    margin-top: 15px;
}
.select-tab-wrap .con_subtit em {
    font-size: 26px;
    color: #777;
    position: relative;
}
.select-tab-wrap .box-in-tag-b {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    margin-top: 15px;
}

.t-blue-point {
    color: #459cfe;
}

.half_wrap .freetrial_btn:hover {
    background: #DEECFF;
}
.half_wrap .freetrial_btn {
    border: 1px solid #3E80EB;
    background: #fff;
    color: #3E80EB;
    transition: all 1s;
}

.half_wrap .freetrial_btn > span {background:url("../images/ic_b_arrow.png") no-repeat top 5px right 0;padding-right:20px;}

.half_wrap .freetrial_btn2 {background: #3E80EB; color: #fff; border: 0;}

.service_item {
    align-items: normal;
    justify-content: space-between;
    gap: 20px;
    margin-top: 50px;
}
.service_item_box {
    width: 280px;
    background: #fff;
    border-radius: 30px;
    border:1px solid #dfdfdf;
    box-sizing: border-box;
    box-shadow: 0px 0px 6px 1px rgba(137, 137, 137, .2);
    transition: all 0.4s ease;
    padding: 40px;
    position: relative;
    text-align:center;
}
.service_item_box:hover {transform: translateY(-8px);}

.ico_box_wrap {flex-wrap: wrap;}
.ico_box {background: #F6F8FB; border:1px solid #E6F0FF; padding: 40px 30px; box-shadow: none;}

@media all and (min-width:769px) and (max-width:1200px) {
    .ico_box {width: 48%;}
}
#section3 .service_item h4 {margin-bottom: 0;}
#section3 .ico_box  small {
    display: inline-block;
    padding: 6px 20px; 
    background: #D8E9FE; 
    border-radius: 30px;
    font-size: 14px;
    color: #4675C2;
    margin: 7px 0;
}
#section3 .item_list05, #section3 .item_list07 {padding: 30px;}

.service_item h4 {
    font-size: 26px;
    font-weight: 600;
    margin: 0;
    margin-bottom: 15px;
}
.service_item .tit_text {
    font-size: 17px;
    color:#333;
    margin-bottom: 20px;
    line-height: 26px;
}

.service_item .btn_arrow {
    border:0;
    /* background:url("../images/btn_arrow.png") no-repeat; */
    font-size:100px;
    margin:0 0 5px 10px;
    vertical-align:middle;
    position:absolute;
    color:#e1e1e1;
    cursor:pointer;
}

.half_wrap button,
.half_wrap a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 260px;
    height: 60px;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.075em;
    position: relative;
    text-align: center;
    text-decoration: none;
}

.half_wrap button.pc-hide,
.half_wrap a.pc-hide {display: none;}

.select-tab-wrap {
    margin-top: 80px;
    margin-bottom: 30px;
}

.box-in-tag-b .tag {
    padding: 0 20px;
    height: 40px;
    border: 1px solid #BCD6FF;
    font-size: 16px;
    color: #3F8FEF;
    border-radius: 20px;
    margin: 6px;
    display: inline-flex;
    align-items: center;
}

.section .section-top-tit {
    font-size: 75px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 90px;
}

@media all and (max-width: 1200px) {
    .service_item .tit_text br {display: none;}
}
@media all and (max-width: 1024px) {
    .service_item_box {padding: 20px;}
    .service_item h4 {font-size: 22px;}
}
@media all and (max-width: 768px) {
    .select-tab-wrap {margin-top: 40px; margin-bottom: 30px;}
    .select-tab-wrap .cont_tit {font-size: 25px;}
    .select-tab-wrap .con_subtit {margin-top: 10px;}
    .select-tab-wrap .con_subtit em {font-size: 20px;}
    .select-tab-wrap .box-in-tag-b {margin-bottom: 20px; margin-top: 10px; gap: 5px;}
    .box-in-tag-b .tag {height: 35px; padding: 0 15px; font-size: 14px; margin: 0;}
    .service_item {display: block; margin-top: 30px;}
    .service_item_box {width: 100%; border-radius: 20px;}
    .service_item_box + .service_item_box {margin-top: 10px;}
    .service_item h4 {font-size: 18px;}
    .service_item .tit_text {font-size: 14px; margin-bottom: 10px; line-height: 1.3;}
    .half_wrap button,
    .half_wrap a {height: 40px; max-width: unset; font-size: 14px; width: auto; padding: 0 15px;}
    .half_wrap button.pc-hide,
    .half_wrap a.pc-hide {display: flex; align-items: center;}
    .half_wrap button.mb-hide,
    .half_wrap a.mb-hide {display: none;}
    .half_wrap .freetrial_btn > span {background-position-y: center;}
}

/* 비쥬얼 */
.top-visual {
    background:#060103 url("../images/visual_img1.png") no-repeat center center / cover;
}
.section.visual {
    display: flex;
    align-items: center;
    position: relative;
    height: 600px;
}

.section.visual .visual-wrap {
    width: 1300px;
    margin: 0 auto;
}

.section.visual .txt_visual {
    padding-top: 60px;
}
.section.visual .section-top-tit {
    font-size: 75px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 90px;
}

.section.visual .swiper-slide {
    height: 409px;
}
.section.visual .swiper-slide > img {
    position: absolute;
    top: 30px;
    left: -19px;
}

.section.visual .inquiry_btn, .case-box .inquiry_btn {
    border: 1px solid #3F80EA;
    background: #3F80EA;
    color: #fff;
    transition: all 1s;
}
.section.visual .inquiry_btn:hover, .case-box .inquiry_btn:hover {background:#0751ca;}
.section.visual .inquiry_btn > span, .case-box .inquiry_btn > span {background:url("/static/main/images/ic_w_arrow.png") no-repeat top 5px right 0;padding-right:20px;}

.section.visual .pagination {justify-content: center; position: absolute; bottom: 54px; left: 0; width: 100%;}
.section.visual .pagination .swiper-pagination-bullet {background-color: #d9d9d9; opacity: 0.5; width: 10px; height: 10px; margin: 0 10px;}
.section.visual .pagination .swiper-pagination-bullet-active {background-color: #d9d9d9; opacity: 1;}

.section.visual .pagination2 {position: absolute; bottom: 54px; left: 0; width: 100%; text-align: center;}
.section.visual .pagination2 span {
    margin: 0 14px;
    font-family: 'GmarketSans'; 
    font-weight: 500; 
    font-size: 16px;
    color: #fff;
    letter-spacing: -0.1px;
    cursor: pointer;
}
.section.visual .pagination2 .active {color: #FFCE2B;}

@media all and (max-width:1300px){
    .section.visual .visual-wrap {width: 100%; padding: 0 3%;}
    .section.visual .swiper-slide > img {z-index: -1; opacity: 0.6;}
    .section.visual .section-top-tit {text-shadow: 0 10px 10px rgba(0, 0, 0, 0.25);}
}
@media all and (max-width:1024px){
    .section.visual {height: 350px; align-items: start; padding-top: 30px;}
    .section.visual .visual-wrap {display: block;}
    .section.visual .swiper-slide {height: auto;}
    .section.visual .txt_visual {padding-top: 0;}
    .section.visual .section-top-tit {font-size: 45px; line-height: 1.3;}
    .section.visual .pagination2 {bottom: 34px;}
}
@media all and (max-width:768px){
    .section.visual {height: 290px;}
    .section.visual .section-top-tit {font-size: 34px;}
    .section.visual .inquiry_btn > span {background-position: right center;}
}
@media all and (max-width:500px){
    .section.visual .swiper-slide > img {opacity: 0.4;}
}


/* 판결사례 */
#section1 {background: linear-gradient(#fff, #DEECFF); padding-bottom: 100px;}
#section1 .case-wrap {display: flex; justify-content: space-between; text-align: center;}
#section1 .case-item {width: 42.3%;}
#section1 .case-tit {font-size: 45px; font-weight: 500; color: #000;}
#section1 .case-tit span {font-weight: 800; color: #3F80EA;}
#section1 .case-subtitle {font-size: 23px; font-weight: 500; color: #333; margin-bottom: 10px;}
#section1 .case-box {box-shadow: 0px 0px 8px 0px rgba(53, 104, 180, 0.25); border: 1px solid #3F80EA; border-radius: 30px; background-color: #fff; position: relative; margin-top: 22px;}

#section1 .case-box.n1 {padding: 30px; background: #fff url('/static/main/images/case-img4.png') no-repeat right 40px bottom; height: 793px;}
/* #section1 .case-box.n1::before {position: absolute; bottom: 25px; left: 0; width: 100%; height: 199px; background: url('/static/main/images/case-img3.png') no-repeat center / contain; content: '';} */
#section1 .case-box.n2 {padding: 30px;}

#section1 .case-list01 {text-align: left; padding: 0 25px;}
#section1 .case-list01 > li:first-child {border-bottom: 1px solid #DFDFDF;}
#section1 .case-list01 > li {position: relative; padding: 18px 0 18px 100px;}
/* #section1 .case-list01 > li + li {margin-top: 20px;} */
#section1 .case-list01 > li::before {position: absolute; top: 0; bottom: 0; left: 0; width: 72px; height: 75px; margin: auto 0; background: url('/static/main/images/case-img.svg') no-repeat center / contain; content: '';}
#section1 .case-list01 > li .cate {width: 89px; line-height: 26px; border: 1px solid #BCD6FF; border-radius: 28px; background-color: #F2F8FF; color: #3F8FEF; text-align: center; display: inline-block; margin-bottom: 10px;}
#section1 .case-list01 > li .title {font-size: 20px; font-weight: 600; color: #000; margin-bottom: 3px;}
#section1 .case-list01 > li .subtitle {font-size: 20px; font-weight: 600; color: #E5454F;}
#section1 .case-list01 > li .text {font-size: 17px; font-weight: 400; color: #777;}

#section1 .case-box .half_wrap {margin-top: 0;}
#section1 .case-box .inquiry_btn {border-radius: 50px;}

 #section1 .case-list02 {padding-top: 16px;} 
/* #section1 .case-list02 > li {background-color: #3F80EA; border-radius: 100px; color: #fff; text-align: center; padding: 11px 10px 11px 67px; position: relative; font-size: 16px; font-weight: 500; letter-spacing: -0.06em;}
#section1 .case-list02 > li + li {margin-top: 27px;}
#section1 .case-list02 > li::before {content: ''; position: absolute; top: 0; bottom: 0; left: 0; margin: auto 0; width: 57px; height: calc(100% + 12px); border-radius: 100px; background: #3F80EA url('/static/main/images/case-img2.svg') no-repeat center; border: 1px solid #fff; min-height: 55px;} */

#section1 .case-arrow {font-size: 30px; font-weight: 600; color: #000; letter-spacing: -0.07em; position: absolute; top: 50%; right: 100%; transform: translateY(-50%); width: 36.6%;}
#section1 .case-arrow::before {display: block; content: ''; width: 100%; height: 63px; background: url('/static/main/images/case-arrow.png') no-repeat center / contain; margin-bottom: 30px;}
#section1 .case-arrow span {display: block; font-size: 66px; color: #3F80EA;}

#section1 .case-list03 > li {height: 220px; border-radius: 20px; background: no-repeat center / cover; overflow: hidden; position: relative;}
#section1 .case-list03 > li + li {margin-top: 35px;}
#section1 .case-list03 > li:nth-child(1) {background-image: url('/static/main/images/case-img5-1.png');}
#section1 .case-list03 > li:nth-child(2) {background-image: url('/static/main/images/case-img5-2.png');}
#section1 .case-list03 > li:nth-child(3) {background-image: url('/static/main/images/case-img5-3.png');}
#section1 .case-list03 > li .text {width: 100%; background-color: #3F80EA; color: #fff; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 23px; font-weight: 600; position: absolute; bottom: 0;}
/* #section1 .case-list03 > li .text::before {content: ''; width: 22px; height: 22px; background: url('/static/main/images/case-check.svg') no-repeat center / contain;} */

@media all and (max-width:1200px) {
    #section1 {margin-top: 50px;}
    #section1 .case-wrap {flex-wrap: wrap;}
    #section1 .case-item {width: 100%; position: relative;}
    #section1 .case-item + .case-item {margin-top: 200px;}
    #section1 .case-tit {font-size: 35px;}
    #section1 .case-box.n1 {padding: 30px; height: auto; display: flex; align-items: center; flex-wrap: wrap;}
    #section1 .case-box.n1::before {display: none;}
    #section1 .case-box.n1 > ul {flex-basis: 50%;}
    #section1 .case-box.n1 .half_wrap {flex-basis: 100%;}
    #section1 .case-list01 {padding-right: 10px;}
    #section1 .case-list02 {flex-basis: 50%;}

    #section1 .case-box.n2 {position: static;}
    #section1 .case-arrow {top: auto; right: 0; bottom: 100%; width: 100%; height: 150px; transform: none;}
    #section1 .case-arrow span {display: inline; font-size: 46px;}
    #section1 .case-arrow::before {transform: rotate(90deg); vertical-align: middle; margin-bottom: 10px;}

    #section1 .case-list02 img {width: 75%;}
    #section1 .case-box .half_wrap {margin-top: 20px;}
}
@media all and (max-width:768px) {
    #section1 {padding-bottom: 40px;}
    #section1 .case-item + .case-item {margin-top: 130px;}
    #section1 .case-tit {font-size: 25px;}
    #section1 .case-subtitle {font-size: 16px;}
    #section1 .case-box.n1 {display: block; padding: 15px;}
    #section1 .case-box.n2 {padding: 15px;}

    #section1 .case-list01 {padding: 0; display: flex;}
    #section1 .case-list01 > li {flex-basis: 100%; text-align: center; padding: 0 10px;}
    #section1 .case-list01 > li:first-child {border: 0;}
    #section1 .case-list01 > li + li {margin-top: 0;}
    #section1 .case-list01 > li::before {position: static; width: 100%; margin-bottom: 10px; display: block; height: 50px; background-position-x: calc(50% + 3px);}
    #section1 .case-list01 > li .cate {font-size: 14px;}
    #section1 .case-list01 > li .title,
    #section1 .case-list01 > li .subtitle {font-size: 16px;}
    #section1 .case-list01 > li .text {font-size: 14px;}

    #section1 .case-list02 {padding-top: 0;}
    #section1 .case-list02 > li {font-size: 14px; padding-right: 5px; padding-left: 62px;}

    #section1 .case-arrow {font-size: 20px; height: 100px;}
    #section1 .case-arrow::before {height: 38px;}
    #section1 .case-arrow span {font-size: 30px;}

    #section1 .case-list03 > li {height: 150px;}
    #section1 .case-list03 > li .text {font-size: 16px; gap: 5px; height: auto; padding: 5px;}
    /* #section1 .case-list03 > li .text::before {width: 17px; height: 17px;} */

    #section1 .case-list02 img {display: none;}
    #section1 .case-box .half_wrap {margin-top: 20px;}
}


/* 체계적인 안전보건관리 시스템 구축 */
#section2 .box-in-tag-b {
    margin-bottom: 50px;
}
#section2 .con1_box {
    gap: 30px;
	background:#fafafa;
	border:1px solid #e1e1e1;
	border-radius:30px;
	padding:20px 20px 20px 60px;
	 justify-content: space-between;
}
#section2 .con1_box + .con1_box {margin-top: 10px;}
#section2 .con1_box h3 {
	font-size:30px;
	font-weight:600;
	background:url("../images/ic_check.png") no-repeat left center;
	padding-left:38px;
}
#section2 .con1_box ul {display:block;	list-style-type:disc;margin-block-start: 0.5em; 	padding-inline-start: 60px;}
#section2 .con1_box ul li{
	color:#777;
	font-size:19px;
	line-height:1.8;
}

@media all and (max-width:1024px) {
    #section2 .con1_box {padding-left: 40px;}
    #section2 .con1_box h3 {font-size: 25px;}
    #section2 .con1_box ul li {font-size: 16px;}
    #section2 .con1_box img {width: 40%;}
}
@media all and (max-width:768px) {
    #section2 .box-in-tag-b {margin-bottom: 20px;}
    #section2 .con1_box {border-radius: 20px; padding-left: 20px;}
    #section2 .con1_box h3 {font-size: 20px; background-size: 20px; padding-left: 24px;}
    #section2 .con1_box ul {padding-inline-start: 20px;}
    #section2 .con1_box ul li {font-size: 14px; line-height: 1.3;}
    #section2 .con1_box ul li + li {margin-top: 5px;}
    
}
@media all and (max-width:500px) {
    #section2 .con1_box {display: block;}
    #section2 .con1_box img {width: auto; margin-top: 10px;}
}

/* 스마트한 현장 업무관리 */
.service_item1 {
    align-items: normal;
    justify-content: space-between;
    gap: 2px;
    margin-top: 50px;
}

#section4 .swiper-slide {
    height: 370px;
    transition: none !important;
    background: no-repeat right top;
    padding-top: 50px;
    box-sizing: border-box;
    position: relative;
}
#section4 .swiper-slide.n1 {background-image: url('../images/con_img07.png');}
#section4 .swiper-slide.n2 {background-image: url('../images/con_img08.png');}
#section4 .swiper-slide.n3 {background-image: url('../images/con_img09.png');}

#section4 .swiper-slide {width:1200px;}



#section4 .swiper-button-prev,
#section4 .swiper-button-next {
    width: 40px;
    height: 40px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(255,255,255,0.9);
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
}

#section4 .swiper-button-prev {
    margin-top:85px;
    left: -50px !important;   /* 화면 안쪽에 위치 */
}
#section4 .swiper-button-next {
    margin-top:85px;
    right: -50px !important;   /* 화면 안쪽에 위치 */
}

#section4 .swiper-button-prev:after {
    background: url(/static/main/images/i_arrow_l.svg) no-repeat center/contain;
    content: "";
    width: 24px; height: 24px; display: block;
}
#section4 .swiper-button-next:after {
    background: url(/static/main/images/i_arrow_r.svg) no-repeat center/contain;
    content: "";
    width: 24px; height: 24px; display: block;
}
/* Swiper 기본 아이콘 숨기기 */
#section4 .swiper-button-prev:after,
#section4 .swiper-button-next:after {
    font-size: 0;
}

.service_item1 h4 {
    font-size: 26px;
    font-weight: 600;
    margin: 0;
    margin-bottom: 15px;
}

/* slide-content 영역 오른쪽 정렬 (flex 없이 margin-left로) */
#section4 .swiper-slide .slide-content {
    max-width: 480px;
    width: 100%;
    text-align: left;
    margin-right: 60px;
    background: rgba(255,255,255,0.92);
    padding: 32px;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.06);
    position: relative;
    top: 0;
}

/* 반응형 */
@media all and (max-width: 1400px) {
    #section4 .swiper-wrapper {padding: 0 50px;}
    #section4 .swiper-button-prev {left: 0;}
    #section4 .swiper-button-next {right: 0;}
}
@media all and (max-width: 1200px) {
    #section4 .swiper-slide {
        padding-right: 50%;
        background-position: right center;
        background-size: 55%;
        height: 300px;
    }
    #section4 .swiper-slide .slide-content {
        margin-right: 10px;
        max-width: 100%;
        padding: 20px;
    }
}
@media all and (max-width: 768px) {
    #section4 .swiper-slide {
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 54%;
        height: auto;
        background-position: center bottom;
        background-size: contain;
    }
   
}

/* 가장 합리적인 가격 */
#section5 .g_box {
    margin-top: 50px;
	background:#FAFAFA;
	border-radius:30px;
	padding:45px 65px;
}

#section5 .g_box .service_item_box {
    display: block;
	width:100%;
	padding:20px;
}
#section5 .g_box img {margin-bottom:25px;}
#section5 .g_box h4 > span {color:#3E80EB;}
#section5 .service_item {margin-top: 0;}
#section5 .service_item .tit_text {margin-bottom: 0;}


@media all and (max-width: 1024px) {
    #section5 .g_box {padding: 20px;}   
}
@media all and (max-width: 768px) {
    #section5 .g_box {margin-top: 20px;}
}

/* 상담문의 영역 */
.section_customer {
	margin-top:100px;
	padding:120px 0;
	background:#f2f8ff url("../images/sec_customer_back.png") no-repeat center / cover;
	text-align:center;
}
.section_customer h3 {font-size:40px;font-weight:600;}
.section_customer ul {width:570px;margin:0 auto;margin-top:30px;display:block;	list-style-type:disc; max-width: 100%;}
.section_customer ul li {font-size:20px;color:#777;line-height:35px;text-align:left;}

.section_customer .customer_box {max-width: 100%; width:830px;margin:0 auto;margin-top:30px;background:#fff;border-radius:30px;padding:40px;text-align:center;}
.section_customer .customer_box > span {padding:0 20px; display: block;}
.section_customer .customer_box h5 {font-size:30px;font-weight:600;letter-spacing:-0.04em;}
.section_customer .customer_box .half_wrap {margin: 0;}

.counsel_btn {
    border: 1px solid #3E80EB;
    background: #fff;
    color: #3E80EB;
    transition: all 1s; 
}
.section_customer .counsel_btn {
    width:180px;
    height:50px;
}
.counsel_btn:hover {
    background: #DEECFF;
}
.counsel_btn > span {background:url("../images/ic_b_arrow.png") no-repeat top 5px right 0; padding-right:15px;}

@media all and (max-width: 1024px) {
    
    .section_customer {margin-top: 50px;}
}
@media all and (max-width: 768px) {
    .section_customer {margin-top: 20px; padding: 50px 3%;}
    .section_customer h3 {font-size: 22px;}
    
    .section_customer .customer_box {display: block; padding: 20px;}
    .section_customer ul {padding-inline-start: 30px;}
    .section_customer ul li {font-size: 16px; line-height: 1.3;}
    .section_customer ul li + li {margin-top: 10px;}
    .section_customer .customer_box h5 {font-size: 20px;}
    .section_customer .customer_box .half_wrap {margin-top: 20px;}
    .counsel_btn > span {background-position: right center; padding-right: 15px;}
    .section_customer .counsel_btn {width: 150px; height: 45px;}
}


/* 메인 법률상담 신청 */
#section6 {text-align: center;}
#section6 .section_certificate {background-image: url('/static/main/images/wing-img-left.svg'), url('/static/main/images/wing-img-right.svg'); background-repeat: no-repeat; background-position: left 85px top, right 85px top; padding-top: 18px;}
#section6 h3 {font-size: 45px; font-weight: 600; color: #000; padding: 0 40px;}
#section6 h3 span {color: #3F80EA;}
#section6 .subtitle {font-size: 26px; font-weight: 500; color: #777; margin-top: 15px;}
#section6 .inner {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25); display: flex; align-items: center; border-radius: 30px; padding: 45px 50px; justify-content: space-around; margin-top: 49px; gap: 10px;}
#section6 .inner .img_area {position: relative; padding-right: 40px;}
#section6 .inner .img_area::after {display: block; height: 66px; border-left: 1px dashed #c8c8c8; content: ''; position: absolute; top: 0; right: 0; bottom: 0; margin: auto 0;}
#section6 .inner img {display: block;}
#section6 .inner .text {position: relative; padding-left: 104px; font-size: 22px; font-weight: 500; color: #000; text-align: left;}
#section6 .inner .text::before {display: block; content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 83px; height: 83px; background: url('/static/main/images/certificate-img.png') no-repeat center / contain; margin: auto 0;}
#section6 .inner .text span {display: block; color: #777; font-size: 18px;}
#section6 .inner .counsel_btn {display: flex; align-items: center; width: 211px; height: 60px; border-radius: 5px; background-color: #F9FCFF; justify-content: center; text-decoration: none; font-size: 17px; font-weight: 600; gap: 7px;}
#section6 .inner .counsel_btn:after {display: block; content: ''; background: url("../images/ic_b_arrow.png") no-repeat center; width: 9px; height: 13px;}

@media all and (max-width: 1200px) {
    #section6 .section_certificate {background-position: left top, right top;}
    #section6 .inner .img_area {padding-right: 20px;}
}
@media all and (max-width: 1024px) {
    #section6 .section_certificate {background-size: 56px;}
    #section6 .subtitle {padding: 0 60px;}
    #section6 .inner {display: block; margin-top: 20px; padding: 20px;}
    #section6 .inner .img_area {padding-right: 0; padding-bottom: 20px;}
    #section6 .inner img {margin: 0 auto;}
    #section6 .inner .img_area::after {height: 1px; width: 100%; border-bottom: 1px dashed #c8c8c8; border-left: none; top: auto; margin: 0;}
    #section6 .inner .text {padding-left: 0; text-align: center; margin-top: 10px;}
    #section6 .inner .text::before {position: static; margin: 0 auto 10px;}
    
    #section6 .inner .counsel_btn {margin: 20px auto 0;}
}
@media all and (max-width: 768px) {
    #section6 h3 {font-size: 25px;}
    #section6 .subtitle {font-size: 20px;}
    #section6 .inner .text {font-size: 18px;}
    #section6 .inner .text span {font-size: 16px;}
    #section6 .inner .counsel_btn {font-size: 14px; width: 150px; height: 45px; padding: 0 15px;}
}
@media all and (max-width: 533px) {
    #section6 .subtitle {padding: 0;}
}

/* 서브 법률상담신청 */
.subcon_wrap #section6 .section_certificate {background: none; margin-top: 0; padding-top: 0; margin-bottom: 64px;}
@media all and (max-width: 768px) {
    .subcon_wrap #section6 .section_certificate {margin-bottom: 30px;}
}




/*상담신청/제휴문의 ST*/
.modal-header {display: flex; justify-content: space-between;}
.modal-header .modal-title {
	font-size:25px;
	font-weight:600;
}
.pop_counsel .modal-header .text {font-size:15px;color:#777;}
.modal-header .close {
    background: #acacac;
    color: #fff;
    border: 0;
    border-radius: 5px;
    padding: 5px 10px;
}
.pop_counsel {margin-top:80px;}
.counsel_table td, .counsel_table th {
    padding: 8px 10px;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
}
.pop_counsel th {background:#fafafa;color:#000; width:150px;vertical-align:middle;padding-left:15px;}
.th_important{background:#fafafa url("../images/ic_list_important.png") no-repeat 18px center; }
.counsel_table .form-check-input {margin-left:0;}
.counsel_table .btn_conveiw {
    background: #acacac;
	border:0;
    color: #fff;
    transition: all 1s;
	font-size:13px;
	padding:4px 10px;
	border-radius:5px;
	margin-left:8px;
}
.pop_counsel .modal-footer {display:block;text-align:center;padding:20px 0;}
.btn_customer_submit {
	border: 1px solid #3E80EB;
    background: #fff;
    color: #3E80EB;
	padding:10px 30px;
}
.btn_customer_submit:hover {
	border: 1px solid #3E80EB;
    background: #deecff;
    color: #3E80EB;
	padding:10px 30px;
}
.pop_counsel .material-icons {font-size:25px;color:#000;font-weight:600;}
.pop_counsel .modal-promotion {font-size:17px;line-height:25px;text-align:center;color:#000;padding:50px 0;}
.modal-promotion .com_info {
	border:1px solid #bcd6ff;
	background:#f2f8ff;
	color:#3f8fef;
	font-size:15px;
	line-height:25px;
	text-align:center;
	width:370px;
	margin:0 auto;
	padding:20px 0;
	margin-top:20px;
	border-radius:8px;
}

@media all and (max-width: 460px) {
    .pop_counsel th {width: 100%;}
    .table-bordered td, .table-bordered th {border: none;}
    .counsel_table td, .counsel_table th {display: block;}
    .counsel_table td {border-bottom: 1px solid #dee2e6;}
}
/*상담신청 ED*/

/* 모바일 앱 기능 */
#section8 {background-color: #F3F9FF; padding-top: 70px; margin-top: 0;}
#section8 .AppSwiper {margin-top: 30px; text-align: center;}
#section8 .AppSwiper .cate {border: 1px solid #BCD6FF; border-radius: 45px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 500; letter-spacing: -0.06em; color: #3F8FEF; background-color: #fff; min-width: 120px; height: 45px; padding: 0 10px;}
#section8 .AppSwiper .title {font-size: 25px; font-weight: 700; color: #386BEA; margin: 20px 0 5px;}
#section8 .AppSwiper img {vertical-align: top; padding-left: 15px; margin-bottom: -10px;}
#section8 .slide-wrap {position: relative;}
#section8 .arrow {background: url('/static/main/images/app-arrow.png') no-repeat center / contain; position: absolute; top: 0; bottom: 0; margin: auto 0; width: 35px; height: 35px; z-index: 10;}
#section8 .arrow.prev-arrow {transform: rotate(-180deg); left: -25px;}
#section8 .arrow.next-arrow {right: -25px;}
#section8 .arrow.swiper-button-disabled {display: none;}

@media all and (max-width: 1250px) {
    #section8 .slide-wrap {padding: 0 40px;}
    #section8 .arrow.prev-arrow {left: 0;}
    #section8 .arrow.next-arrow {right: 0;}
}
@media all and (max-width: 768px) {
    #section8 {padding-top: 40px;}
    #section8 .AppSwiper .cate {font-size: 14px; height: 35px; min-width: 100px;}
    #section8 .AppSwiper .title {font-size: 20px; margin: 10px 0 0;}
}

/* QR코드 */
.qr-fixed {position: fixed; right: 20px; top: 50%; transform: translateY(-50%);text-align: center; box-shadow: 3px 5px 8px 0px rgba(53, 104, 180, 0.25); border-radius: 150px; width: 130px; z-index: 10; background-image: linear-gradient(157.46deg, #3F81E9 11.73%, #2AC8A5 95.26%); padding: 10px;}
.qr-fixed .inner {background-color: #fff; border-radius: inherit; padding: 35px 0;}
.qr-fixed .title {font-size: 16px; color: #000; font-weight: 700;}
.qr-fixed .img-area {background-color: #ECF5FF; border-radius: 50%; width: 80px; height: 80px; padding: 15px; display: inline-flex; align-items: center; justify-content: center; margin: 10px 0;}
.qr-fixed .img-area img {width: 65px; height: 65px; cursor: pointer;}
@media all and (max-width: 1200px) {
    .qr-fixed .title {font-size: 16px;}
}
@media all and (max-width: 1024px) {
    .qr-fixed {display: none;}
}

/*신규서비스 공공입찰 서류작성*/
#section9 {width: 100%; background: url('/static/main/images/new_sv_bg.png') no-repeat center / cover; padding: 40px 0; margin-top: 70px;}
#section9 .Nsv-wrap {display: flex; align-items: center; justify-content: center;}
#section9 .Nsv-tit {display: flex; flex-wrap: wrap; align-items:end; flex-basis: 27%; margin-right: 20px;}
#section9 .Nsv-tit h2 {font-family: 'GmarketSans'; font-weight: 900; font-size: 40px; margin-bottom: 0;}
#section9 .Nsv-tit .Nsv-img {margin-right: 10px; margin-bottom: 9px;}
#section9 .Nsv-text {flex-basis: 40%;}
#section9 .Nsv-text h4 {font-size: 24px; color: #AA5CCE; font-weight: 800;}
#section9 .Nsv-text p {font-size: 18px; color: #777777; line-height: 24px;}
#section9 .Nsv-text b {color: #333;}
#section9 .Nsv-text a {
    font-weight: 900; 
    font-size: 18px;
    color: #333;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
}
#section9 .Nsv-text a span {font-family: 'GmarketSans'; padding-top: 4px;}

@media all and (max-width: 1200px) {
#section9 .Nsv-wrap {display: block; padding: 10px;}
#section9 .Nsv-tit {justify-content: center;}
#section9 .Nsv-text {text-align: center; margin-top: 10px;}
}

@media all and (max-width: 768px) {
#section9 .Nsv-tit h2 {font-size: 25px;}
#section9 .Nsv-text h4 {font-size: 20px;}
#section9 .Nsv-text p {font-size: 14px; line-height: 20px;}
#section9 .Nsv-text a {font-size: 14px;}
#section9 .Nsv-text a img {width: 23px;}
#section9 .Nsv-tit .Nsv-img {width: 90px; margin-bottom: 5px;}
}

@media all and (max-width: 337px) {
    #section9 .Nsv-tit {margin-right: 0; display: block; }
    #section9 .Nsv-tit h2 {text-align: center;}
    #section9 .Nsv-tit .Nsv-img {margin: 0 auto; padding-bottom: 10px;}
}


/***********이용약관/개인정보보호정책 모달**************/
.policy_wrap {padding:20px 20px 80px 20px;}
.policy_content {padding:0 20px;}
.policy_content h2 {font-size:20px;font-weight:600;border:1px solid #3F80EA;padding:15px 0;text-align:center;color:#000;background:#f8fafd;margin-bottom:20px;}
.policy_content h4 {font-size:17px;font-weight:600;color:#1a63d9;}
.policy_content h6 {font-size:15px;font-weight:600;margin:20px 0 10px 0;}
.policy_content span {font-size:15px;color:#777;line-height:25px;}

.policy_content .text01 {font-size:15px;color:#777;line-height:25px;color:#3F80EA;}

@media all and (max-width: 400px) {
    .policy_content {padding: 0;}
    .policy_content h2 {font-size: 16px; padding: 10px 0; }
}


/* 푸터 */
#footer {
    margin-top: 0;
}
#footer {
    position: relative;
    width: 100%;
    padding: 17px 0 50px;
    background: #fff;
    font-family: "MinSansVF", "Min Sans", sans-serif;
    color: #555;
    border-top: 1px solid #f0f0f0;
}
#footer .inner {
    position: relative;
    max-width: 1260px;
    margin: 0 auto;
}

#footer .top-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 18px;
    border-bottom: 1px solid #e1e1e1;
}

#footer .f-link {display: flex; flex-wrap: wrap; gap: 27px; align-items: center;}
#footer .f-link a {
    position: relative;
    display: inline-block;
    gap: 10px;
    font-size: 14px;
    font-weight: 500;
    color: #121212;
    line-height: 14px;
    text-decoration: none;
}

/* 패밀리사이트 */
#footer .family { position: relative; display: inline-block; }

#footer .family-trigger {
    display: inline-flex; 
    align-items: center; gap: 20px;
    padding: 10px 16px; 
    background: #fff; 
    border: 1px solid #ADADAD; 
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
}
#footer .family-trigger span {letter-spacing: 0; font-weight: 500; color: #121212;}
#footer .family-trigger .caret { width: 16px; height: 16px; transition: transform .12s linear; color: #121212;}
#footer .family-trigger[aria-expanded="true"] .caret { transform: rotate(180deg); }

#footer .family .menu {
    position: absolute; 
    left: 0; 
    width: 190px;
    bottom: calc(100% + 8px);
    background: #fff; 
    border: 1px solid #e5e7eb; 
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,.08);
    opacity: 0; 
    transform: translateY(8px); 
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
}
#footer .family .menu.open { opacity: 1; transform: translateY(0); pointer-events: auto; }

#footer .family .menu-list { list-style: none; margin: 0; padding: 6px 0; }
#footer .family .menu-item a {
    display: block !important; 
    padding: 10px 14px; 
    text-decoration: none; 
    color: #121212; 
    transition: background-color .15s ease;
}
#footer .family .menu-item a:hover {background: #f7f7f8;}
#footer .family .menu-item a:focus-visible { outline: 2px solid #2563eb33; outline-offset: 2px; }
#footer .family .menu-item a:active { background: #eef2ff; }

@media (prefers-reduced-motion: reduce) {
.menu, .caret, .menu-item a { transition: none !important; }
}

#footer .sns-list {display: flex; gap: 10px; font-size: 0; line-height: 0;}
#footer .sns-list > a {display: block; width: 40px; height: 40px; border-radius: 50%; background: no-repeat center;}
#footer .sns-list > a.kakao {background-color: #FFCA08; background-image: url('/static/main/images/kakao-ico.svg');}
#footer .sns-list > a.blog {background-color: #2FB44A; background-image: url('/static/main/images/blog-ico.svg');}
#footer .sns-list > a.youtube {background-color: #C50000; background-image: url('/static/main/images/youtube-ico.svg');}
#footer .copywrap {margin: 21px 0 0 0;}
#footer .copywrap p {
    position: relative;
    margin-left: 4px;
    padding-left: 5px;
    font-size: 14px;
    color: #838383;
    line-height: 26px;
    word-spacing: 3px; /* 단어 간격 조절 */
    letter-spacing: 0.3px; /* 글자 간격 조절 */
}
#footer .copy {
    padding-top: 8px;
    font-size: 14px;
    color: #838383;
}

@media all and (max-width: 1260px) {
    #footer .inner {width: 100%; padding: 0 3%;}
}
@media all and (max-width: 500px) {
    #footer .top-inner {display: block;}
    #footer .f-link {display: flex; justify-content: center; gap: 10px;}
    #footer .f-link a {margin-right: 0; padding-right: 0;}
    #footer .family .menu {left: 50%; transform: translate(-50%, 8px);}
    #footer .family .menu.open {transform: translate(-50%, 0);}
    #footer .sns-list {justify-content: center; margin-top: 15px;}
    #footer .copywrap p {margin-left: 0; padding-left: 0; text-align: center;}
}


 /* ===== 커스텀 모달 레이어 (부트스트랩 .modal 과 별개) ===== */
  .modal-popup{position:fixed;inset:0;display:none;z-index:10000;}
  .modal-popup .pop-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);}
  .modal-popup .popup{position:relative;width:min(560px,92vw);margin:8vh auto;background:#fff;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.25);overflow:hidden;}
  .modal-popup .pop-con{padding:16px;}
  .modal-popup .pop-head{display:flex;align-items:center;justify-content:space-between;}
  .modal-popup .pop-body{padding-top:8px;}
  body.no-scroll{overflow:hidden;}

  /* ============== Base Layer ============== */
.modal-popup{
  position: fixed;            /* 화면 고정 */
  inset: 0;                   /* top/right/bottom/left: 0 */
  display: none;              /* JS로 fadeIn/Out */
  z-index: 12000;             /* 다른 요소보다 위 */
  pointer-events: none;       /* 배경 클릭 막힘 방지: 자식에서만 받음 */
  font-family: inherit;
}
.modal-popup .pop-bg{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  pointer-events: auto;       /* 배경은 클릭 받아서 닫기 */
}
.modal-popup .popup{
  position: relative;
  width: min(480px, 92vw);
  margin: 8vh auto;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  overflow: hidden;
  pointer-events: auto;       /* 실제 모달은 클릭 가능 */
}

/* ============== Head ============== */
.modal-popup .pop-head{
  position: relative;
  background: #5C8DF6;        /* 헤더 색 (원하는 색상으로 변경) */
  padding: 14px 48px 14px 20px;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;    /* 가운데 정렬 */
}
.modal-popup .qr-tit-txt .tit{
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  margin-left:25px;
}
.modal-popup .r-con{
  position: absolute;
  right: 8px;
  top: 6px;
}
.modal-popup .btn-close{
  border: 0;
  background: transparent;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
}
.modal-popup .btn-close:before{
  content: "✕";
  display: inline-block;
  font-size: 18px;
  line-height: 36px;
  text-align: center;
  color: #fff;
}

/* ============== Body ============== */
.modal-popup .pop-con{ padding: 0; }
.modal-popup .pop-body{
  padding: 18px 22px 50px;
  text-align: center;
}
.modal-popup .qr-conTitle{
  display: block;
  font-weight: 700;
  color: #333;
  margin-bottom: 12px;
}
.modal-popup .qr-newImg{
  display: flex;
  justify-content: center;
}
.modal-popup #qrCodeImage{
  max-width: 320px;          /* QR 최대 사이즈 */
  width: 80vw;               /* 작은 화면 대응 */
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}

/* ============== Utilities ============== */
body.no-scroll{ overflow: hidden; }

/* 다른 CSS가 클릭을 막거나 가리는 경우 대비 */
#modal-qrCode{ z-index: 12000 !important; }
#modal-qrCode .popup{ z-index: 12001 !important; }
#modal-qrCode, #modal-qrCode *{ pointer-events: auto; }

/* 작은 화면 보완 */
@media (max-width: 400px){
  .modal-popup .popup{ width: 94vw; }
  .modal-popup .qr-tit-txt .tit{ font-size: 15px; }
}