:root {
	--main-color-1: #E4C17D;
	--main-color-2: #E4C17D;	
	--main-color-3: #bca06a;	
	
	--font-color-1: #111111;
	
	
	--border-color-1: #cccccc;
	
	--smin-width: 320px;
	--smin-width-calc: 320;
	--min-width: 320px;
	--min-width-calc: 320;
	--max-width: 1600px;
	--max-width-calc: 1600;  
		
	--width-80: clamp(40px, calc(40px + (80 - 40) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 80px);
	--width-34: clamp(20px, calc(20px + (34 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 34px);
	--width-225: clamp(100px, calc(100px + (320 - 100) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 320px);
	--width-262: clamp(110px, calc(110px + (370 - 110) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 370px);
	
	--height-14: clamp(8px, calc(8px + (14 - 8) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 14px);
	
	--padding-8: clamp(4px, calc(4px + (8 - 4) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 8px);
	--padding-10: clamp(5px, calc(5px + (10 - 5) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 10px);
	--padding-15: clamp(7.5px, calc(7.5px + (15 - 7.5) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 15px);
	--padding-16: clamp(8px, calc(8px + (16 - 8) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 16px);
	--padding-20: clamp(10px, calc(10px + (20 - 10) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 20px);
	--padding-25: clamp(12.5px, calc(12.5px + (25 - 12.5) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 25px);
	--padding-30: clamp(15px, calc(15px + (30 - 15) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);
	--padding-40: clamp(20px, calc(20px + (40 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 40px);
	--padding-50: clamp(25px, calc(25px + (50 - 25) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 50px);
	--padding-60: clamp(30px, calc(30px + (60 - 30) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 60px);
	--padding-70: clamp(35px, calc(35px + (70 - 35) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 70px);
	--padding-70-20: clamp(20px, calc(20px + (70 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 70px);
	--padding-80: clamp(40px, calc(40px + (80 - 40) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 80px);
	--padding-90: clamp(45px, calc(45px + (90 - 45) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 90px);
	--padding-100: clamp(50px, calc(50px + (100 - 50) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 100px);
	--padding-120: clamp(60px, calc(60px + (120 - 60) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 120px);
	--padding-240: clamp(120px, calc(120px + (240 - 120) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 240px);	
	
	--margin-20: clamp(10px, calc(10px + (20 - 10) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 20px);
	--margin-30: clamp(15px, calc(15px + (30 - 15) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);	
	--margin-40: clamp(20px, calc(20px + (40 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 40px);	
	
	--border-radius-20: clamp(10px, calc(10px + (20 - 10) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 20px);
	
	--gap-20: clamp(10px, calc(10px + (20 - 10) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 20px);
	--gap-40: clamp(20px, calc(20px + (40 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 40px);
	
	--font-size-14: clamp(13px, calc(13px + (14 - 13) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 14px);
	--font-size-15: clamp(14px, calc(14px + (15 - 14) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 15px);
	--font-size-16: clamp(15px, calc(15px + (16 - 15) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 16px);
	--font-size-16-16: clamp(16px, calc(16px + (16 - 16) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 16px);
	--font-size-18: clamp(16px, calc(16px + (18 - 16) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 18px);
	--font-size-20: clamp(18px, calc(18px + (20 - 18) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 20px);
	--font-size-16-20: clamp(16px, calc(16px + (20 - 16) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 20px);
	--font-size-22: clamp(19px, calc(19px + (22 - 19) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 22px);
	--font-size-24: clamp(20px, calc(20px + (24 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 24px);
	--font-size-24-18: clamp(18px, calc(18px + (24 - 18) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 24px);
	--font-size-30: clamp(25px, calc(25px + (30 - 25) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);
	--font-size-20-30: clamp(20px, calc(20px + (30 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);
	--font-size-20-32: clamp(20px, calc(20px + (32 - 20) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 32px);
	--font-size-28-32: clamp(28px, calc(28px + (32 - 28) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 32px);
	--font-size-28: clamp(24px, calc(24px + (28 - 24) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 28px);
	--font-size-36: clamp(28px, calc(28px + (36 - 28) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 36px);
	--font-size-44: clamp(22px, calc(22px + (44 - 22) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 44px);
	--font-size-50: clamp(25px, calc(25px + (50 - 25) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 50px);
	
	--sfont-size-48: clamp(21px, calc(21px + (75 - 21) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 75px);
	--sfont-size-50: clamp(19px, calc(19px + (60 - 19) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 60px);
	--sfont-size-56: clamp(25px, calc(25px + (85 - 25) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 85px);
	--sfont-size-60-26: clamp(26px, calc(26px + (60 - 26) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 60px);
	
	--line-height-24-30: clamp(24px, calc(24px + (30 - 24) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);
	--line-height-30: clamp(25px, calc(25px + (30 - 25) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 30px);
	--line-height-100: clamp(40px, calc(40px + (100 - 40) * ((100vw - var(--min-width)) / (var(--max-width-calc) - var(--min-width-calc)))), 100px);
	
	--bottom-4: clamp(6px, calc(6px + (8 - 6) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 8px);
	--bottom-12: clamp(6px, calc(6px + (20 - 6) * ((100vw - var(--smin-width)) / (var(--max-width-calc) - var(--smin-width-calc)))), 20px);
}

.section .bos-01 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 0.4s;
}
.section.active .bos-01 {
    opacity: 1;
	transition-delay: 0.4s;
    transform: translateY(0px);
}

.section .bos-02 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 0.6s;
}
.section.active .bos-02 {
    opacity: 1;
	transition-delay: 0.6s;
    transform: translateY(0px);
}

.section .bos-03 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 1.0s;
}
.section.active .bos-03 {
    opacity: 1;
	transition-delay: 1.0s;
    transform: translateY(0px);
}

.section .bos-04 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 1.2s;
}
.section.active .bos-04 {
    opacity: 1;
	transition-delay: 1.2s;
    transform: translateY(0px);
}

.section .bos-05 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 1.4s;
}
.section.active .bos-05 {
    opacity: 1;
	transition-delay: 1.4s;
    transform: translateY(0px);
}

.section .bos-06 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 1.8s;
}
.section.active .bos-06 {
    opacity: 1;
	transition-delay: 1.8s;
    transform: translateY(0px);
}

.section .bos-07 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 2.2s;
}
.section.active .bos-07 {
    opacity: 1;
	transition-delay: 2.2s;
    transform: translateY(0px);
}

.section .bos-08 {
    opacity: 0;
    transform: translateY(40px);
	transition: all 0.8s ease 2.6s;
}
.section.active .bos-08 {
    opacity: 1;
	transition-delay: 2.6s;
    transform: translateY(0px);
}

.section .bos-01-left {
    opacity: 0;
    transform: translateX(40px);
	transition: all 0.8s ease 0.6s;
}
.section.active .bos-01-left {
    opacity: 1;
	transition-delay: 0.6s;
    transform: translateX(0px);
}

.section .bos-02-left {
    opacity: 0;
    transform: translateX(40px);
	transition: all 0.8s ease 1.2s;
}
.section.active .bos-02-left {
    opacity: 1;
    transform: translateX(0px);
}

.mainSwiper .fade-in-element-01 {	
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 0.5s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-02 {
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 0.9s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-03 {
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 1.8s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-04 {
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 2.3s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-05 {
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 2.9s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-06 {
	 opacity: 0;
	 animation-name: fadeIn;
	 animation-delay: 4.4s;
    animation-duration: 1s;
	animation-timing-function: ease-out;
    animation-fill-mode: forwards; /* ¾Ö´Ï¸ÞÀÌ¼Ç Á¾·á ÈÄ »óÅ À¯Áö */
    animation-iteration-count: 1; /* 1¹ø¸¸ ½ÇÇà */
}
.mainSwiper .fade-in-element-06 b {
    color: #ffde44;
    font-weight: 700;
}

@keyframes fadeIn {
  0% { opacity: 0; transform: translateY(40px); }
  100% { opacity: 1; transform: translateY(0px); }
}
.mainSwiper .counters {
    position: relative;
    font-family: "Sriracha", cursive;
    font-weight: 500;
    font-style: normal;
    color: #ffde44;
    font-size: var(--sfont-size-56);
}

.mainSwiper .counters.crime {
    position: relative;
    font-family: "Sriracha", cursive;
    font-weight: 500;
    font-style: normal;
    color: #ffde44;
    font-size: var(--sfont-size-56);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.mainSwiper .counters.crime.c-01:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 145%;
    background: url(/img/kb/crime/deco01.png)no-repeat;
    background-position: center;
    background-size: contain;
    z-index: -1;
}
.mainSwiper .counters.crime.c-02:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 135%;
    background: url(/img/kb/school/deco02.png)no-repeat;
    background-position: center;
    background-size: contain;
    z-index: -1;
}

.mainSwiper .counters.school {
    position: relative;
    font-family: "Sriracha", cursive;
    font-weight: 500;
    font-style: normal;
    color: #ffde44;
    font-size: var(--sfont-size-56);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.mainSwiper .counters.school.c-01:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 130%;
    background: url(/img/kb/school/deco01.png)no-repeat;
    background-position: center;
    background-size: contain;
    z-index: -1;
}
.mainSwiper .counters.school.c-02:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 120%;
    background: url(/img/kb/school/deco02.png)no-repeat;
    background-position: center;
    background-size: contain;
    z-index: -1;
}
.mainSwiper .line {
    position: relative;
}
.mainSwiper .line:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: var(--height-14);
    background: rgba(255,255,255,0.4);
    transition-delay: 0.5s !important;
    transition: all 1s ease;
}

.mainSwiper h2 {
    display: flex;
    flex-direction: column;
	font-size: var(--sfont-size-48) !important;
    font-weight: 700 !important;;
    line-height: 1.3em !important;
    word-break: keep-all;
}
.mainSwiper h2 .fade-in-element-05 {
	font-size: var(--sfont-size-50) !important;
    font-weight: 500 !important;
	margin-top: var(--margin-20);
}


.pt-90 {
	padding-top: var(--padding-90);
}
.pt-120 {
	padding-top: var(--padding-120);
}
.mo-none {display:block !important;}
.mo-block {display:none !important;}
.fp-section.fp-table, .fp-slide.fp-table {
    display: flex;
    table-layout: fixed;
    width: 100%;
}
#header {
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .1);
}
.fp-viewing-1 #header {
    border-bottom: 0px solid #cdcdcd;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .0);
}
#footer .myContent {
    padding-top: 0px;
	padding-bottom: var(--padding-80);
}
#section1 .swiper-slide {
    background: transparent;
    background-size: cover;
    background-position: center;
    height: fit-content;
}
.tit_center .txt.black em {
    color: #000;
}
.tit_center .txt.black span {
    color: #000;
}

.tit.black h1 {
    color: #000 !important;
}
.tit.black h1.bos-02 .quote1 {
    width: 40px;
    height: 100%;
    display: inline-block;
    position: relative;
}
.tit.black h1.bos-02 .quote2 {
    width: 25px;
    height: 100%;
    display: inline-block;
    position: relative;
}
#nsection11 .txt_wrap h1.bos-02.quote {
    /*display: flex;
    justify-content: center;*/
}
.tit.black h1.bos-02 .quote1:before {
    content: '';
    position: absolute;
    left: 0px;
    top: -55px;
    width: 100%;
    height: 35px;
    background: url(/img/kb/sh_left.webp)no-repeat left;
    background-size: contain;
}
.tit.black h1.bos-02 .quote2:after {
    content: '';
    position: absolute;
    right: 0px;
    top: -55px;
    width: 100%;
    height: 35px;
    background: url(/img/kb/sh_right.webp)no-repeat right;
    background-size: contain;
}
.tit.black p {
    color: #000 !important;
}
.bgimg-bg.none {
    position: absolute;
    background: none;
}
.list-business > li {
	border: 1px solid rgba(0, 0, 0, 0.2) !important;
    background-color: rgba(255, 255, 255, 1.0) !important;
}
.list-business > li:hover{background:var(--main-c) !important; border-color:var(--main-c) !important;}
.list-business > li > a > span {
    color: #000000 !important;
}
.slide_con {
    background: #f9f9f9;
    border: 1px solid #cccccc;
}
.bocastSwiper .swiper-pagination-bullet {
    border: 1px solid #cccccc;
}
#nsection11 .swiper-pagination-bullet {
    border: 1px solid #cccccc;
}
#nsection11 .swiper .success_con {
    border: 0px solid #cccccc;
}
.section img.section2025-bg.gray0 {
    filter: grayscale(100%);
    opacity: 0.05;
}
.section img.section2025-bg.gray1 {
    filter: grayscale(100%);
    opacity: 0.1;
}
.section img.section2025-bg.gray2 {
    filter: grayscale(100%);
    opacity: 0.2;
}
.section img.section2025-bg.gray3 {
    filter: grayscale(100%);
    opacity: 0.3;
}
#nsection11 .swiper .success_con .txt_wrap {
    padding-top: var(--padding-30);
    padding-bottom: var(--padding-40);
}
#nsection11 .swiper-pagination {
    margin-top: var(--padding-40);
}
.tab_wrap li {
    border: 1px solid var(--border-color-1);
    color: var(--font-color-1);
}
.sec-right.bg-none {
    background-color: transparent;
}
.qnaSwiper .btn-more > span {
    color: #000;
}
.qnaSwiper .btn-more:hover > span {
    color: #fff;
}
.qnaSwiper .btn-more:before {
    color: #fff;
	background: #000;
}
.qnaSwiper .btn-more {
    border: 1px solid #000;
}
.qnaSwiper .swiper-slide {
    padding: var(--padding-20) var(--padding-30) var(--padding-10) var(--padding-30);
}
.qnaSwiper {
    width: 100%;
    height: 100%;
    margin: initial;
}
.accordion-list .accordion-item.active {
    background-color: #f7f3e8;
    transition: all 0.0s;
    border: solid 1px rgba(0, 0, 0, 0.0);
    border-top: solid 1px rgba(0, 0, 0, 0.8);
}
.accordion-list .accordion-item {
    border: solid 1px rgba(0, 0, 0, 0.0);
}
.accordion-list .accordion-item {
    width: calc(50% - 30px);
    border-top: solid 1px rgba(0, 0, 0, 0.8);
    border-bottom: solid 1px rgba(0, 0, 0, 0.4);
}
.accordion-list .accordion-item:last-child {
    border-bottom: solid 1px rgba(0, 0, 0, 0.8);
}
.qnaSwiper-area {
    gap: calc(50% - 30px);
    display: flex;
}
.qnaSwiper.left {
    width: 50%;
}
.qnaSwiper.right {
    width: 50%;
}
.qnaSwiper {
}
.qnaSwiper .accordion-desc {
	height: 100%;
    display: block !important;
}
.accordion-list {
    gap: 30px 60px;
    display: flex;
    flex-wrap: wrap;
}
#nsection51 .cs-tit {
    display: flex;
    justify-content: flex-end;
}
.accordion-list .accordion-item .accordion-link::before {
    display: none;
}
.map_wrap .map .map_frame .map_loca {
    background-color: rgba(0, 0, 0, .7);
    -webkit-backdrop-filter: blur(9px);
    backdrop-filter: blur(9px);
}

.mo-pc-block {display: block !important;}

/* ADD SECTION1 */
#nsection4.add-section1 img.section2025-bg {
    opacity: 0.2;
}
#nsection4.add-section1 .tit.black p {
    font-size: var(--font-size-14);
    /*color: var(--main-color-2) !important;*/
    /*font-weight: 600;*/
}
#nsection4.add-section1 .list-differ {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gap-40);
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 40px 1fr 40px 1fr;
    gap: var(--gap-40);
}
#nsection4.add-section1 .list-differ .add-icon-area {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#nsection4.add-section1 .list-differ .add-icon-area i {
    margin-bottom: 12px;
    background: #ffffff;
    font-size: var(--font-size-20);
    font-weight: 700;
    color: #000000;
	text-align: left;
}
.add-section1 .icon-arrow {
    display: flex;
    justify-content: center;
}
#nsection4.add-section1 .list-differ .add-icon-area img {
    width: auto;
    height: var(--width-80);
}
#nsection4.add-section1 .list-differ > li h2 {
    font-size: var(--font-size-36);
    font-weight: 700;
    margin-bottom: var(--margin-20);
}
#nsection4.add-section1 .list-differ .font-b {
    margin-bottom: var(--margin-20);
    padding: 5px 20px;
    border-radius: 50px;
    background: #bca06a;
    font-size: var(--font-size-18);
    font-weight: 600;
    color: #fff;
}

#nsection4.add-section1 .list-differ > li:nth-child(1) {
    transition-delay: 0.8s;
}
#nsection4.add-section1 .list-differ > li:nth-child(3) {
    transition-delay: 1.1s;
}
#nsection4.add-section1 .list-differ > li:nth-child(5) {
    transition-delay: 1.4s;
}
#nsection4.add-section1 .list-differ > li p {
	text-align: left;
	font-size: var(--font-size-20);
    font-weight: 500;
    color: #333333;
	margin-top: 0;
}
#nsection4.add-section1 .list-differ > li p span {
    color: #bca06a;
    font-weight: 500;
}
#nsection4.add-section1 .txt_wrap .tit.sub h2 {
    color: #000000;
    font-size: var(--font-size-20-30);
    font-weight: 600;
    margin-top: var(--margin-20);
}
#nsection4.add-section1 .deco03 {
    color: #e4c17d;
}

#nsection4.add-section1 h2 i.line {
	color: var(--main-color-3);
    position: relative;
    font-style: normal;
}
#nsection4.add-section1.active .txt_wrap h2 i.line:after {
    width: 100%;
}
#nsection4.add-section1 h2 i.line:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 8px;
    background: rgba(188,160,106,0.4);
    transition-delay: 0.5s !important;
    transition: all 1s ease;
}
#nsection4.add-section1 h2 .text-point.v2 {
    color: var(--main-color-3);
}
#nsection4.add-section1 h2 span i {
    position: relative;
    font-style: normal;
}

#nsection4.add-section1 h2 span i:before {
    content: '';
    position: absolute;
    top: -8px;
    left: 50%;
    margin-left: -2.5px;
    width: 5px;
    height: 5px;
    background: var(--main-color-3);
    border-radius: 50px;
    opacity: 0;
    transition: all 0.5s;
}
#nsection4.add-section1.active h2 span i:before {
    opacity: 1;
}
#nsection4.add-section1 h2 span i:nth-child(1):before {
    transition-delay: 1s;
}
#nsection4.add-section1 h2 span i:nth-child(2):before {
    transition-delay: 1.2s;
}
#nsection4.add-section1 .icon-arrow img {
    width: 100%;
	max-width: var(--width-34);
}


/* ADD SECTION2 */
#nsection3.active .swiper-1226 {
    height: 100%;
    width: 100%;
    margin: 0 auto;
}
@-webkit-keyframes infoIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes infoIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes infoOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}
@keyframes infoOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}
#hero {
	width: 100%;    
	height: 600px;
	display: block;
	overflow: hidden;
	position: relative;
}
.hero {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	height: 100%;
	overflow: hidden; 
	margin: 0;
	padding: 0;
	position: relative;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.hero figure {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin: 0;
    padding: 0;
    width: 10%;
    height: 100%;
    flex-basis: 100%;
    position: relative;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    -webkit-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
    -webkit-filter: saturate(25%);
    filter: saturate(25%);
}
.hero figure:not(.on):hover {
	cursor: pointer;
}
.hero figure img {
	width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
	filter: brightness(50%);
}
.hero figure.on {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    -webkit-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
    z-index: 20;
    -webkit-filter: saturate(100%);
    filter: saturate(100%);
}
.hero figure div {
	text-align: center;
	-webkit-animation: infoOut;
	animation: infoOut;
}
.hero figure.on div {
    position: absolute;
    width: 100%;
    display: flex;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    -webkit-animation: infoIn 0.8s;
    animation: infoIn 0.8s;
    flex-direction: column;
    padding: var(--padding-100) var(--padding-120);
    align-items: flex-start;
    justify-content: flex-start;
	border: 5px solid var(--main-color-2);
}
.hero figure.on div h2 {
	writing-mode: horizontal-tb;
    padding: var(--padding-10) var(--padding-20);
    border-radius: 50px;
    background: #bca06a;
    font-size: var(--font-size-18);
    font-weight: 600;
    color: #fff;
	opacity: 1.0;
}
.hero figure div h2 {
    writing-mode: sideways-rl;
    color: #ffffff;
    font-size: var(--font-size-18) !important;
    font-weight: 600;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
	opacity: 0.6;
}
.hero figure div h2 span:last-child {
	position: relative;
    display: block;
    font-size: 24px;
    border: 1px solid #ffffff;
    border-radius: 50%;
    padding: 5px;
	bottom: 0;
	color: #fff;
    font-variation-settings: 'FILL' 0,
	'wght' 400,
	'GRAD' 0,
	'opsz' 24;
}
.hero figure.on div h2 span:last-child {
	display: none;
}
.hero figure div {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    justify-content: center;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    padding: var(--padding-80) 0;
    align-items: stretch;
}
.hero figure.on figure div h2 {
	font-size: 18px;
	font-weight: 600;
	width: 100%;
	margin-top: 0px;
	padding-bottom: 10px;
	margin-bottom: 0px;
	writing-mode: inherit;
}
.hero figure div p {
    display: none;
    letter-spacing: -0.6px;
    font-size: var(--font-size-20);
    text-align: left;
}
.hero figure.on .hero-line {
	width: 80px;
    height: 2px;
    border-top: solid 1px rgba(255, 255, 255, 0.8);
}
.hero figure.on div p {
    color: #ffffff;
    font-size: var(--font-size-44);
    font-weight: 600;
    margin-top: var(--margin-40);
    width: 100%;
    margin-bottom: 0;
    display: flex;
    letter-spacing: -0.6px;
}
.hero figure.on div p:last-child {
    margin-top: var(--margin-40);
    display: flex;
    font-size: var(--font-size-16-20);
    font-weight: 400;
    position: relative;
    padding-left: var(--padding-20);
	line-height: var(--line-height-30);
}
.hero figure.on div p:last-child::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background-color: rgba(255,255,255,0.8);
}
.hero figure.on div a {  
	width: 130px;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 0.8em;
	font-weight: 400;
	transition: 0.3s ease;
	display: flex;
	align-items: center;
}

.hero figure.on div a:hover::after {
	transform: translateX(3px);
	transition: 0.3s ease;
}
.hero figure.on div a:hover {
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 2px 3px rgba(0, 0, 0, 0.7);
	transition: 0.3s ease;
}
.hero .on .on-br {
	display:none;
}

/* ADD SECTION3 */
#nsection3.add-section3 .profile-card {
    width: 100%;
    height: 100%;
    padding: var(--padding-80) var(--padding-60);
    border: 0px solid #ddd;
    background-color: #fff;
}
#nsection3.add-section3 .header {
    display: flex;
    justify-content: space-between;
}
#nsection3.add-section3 .logo {
    width: 100%;
    max-width: 140px;
    margin-top: var(--margin-20);
}
#nsection3.add-section3 .profile-pic {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
}
#nsection3.add-section3 .name-title {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}
#nsection3.add-section3 .name {
    font-size: var(--font-size-30);
    font-weight: bold;
}
#nsection3.add-section3 .title {
    font-size: var(--font-size-20);
    color: #555;
    margin-left: 10px;
    font-weight: 600;
}
#nsection3.add-section3 .specialty {
    display: flex;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: var(--font-size-18);
    color: var(--main-color-2);
}
#nsection3.add-section3 .qualifications ul {
    display: flex;
    list-style-type: disc;
    padding: 0;
    font-size: var(--font-size-16);
    font-weight: 500;
    color: #666;
    flex-direction: column;
    align-items: flex-start;
}
#nsection3.add-section3 .qualifications li {
    margin-bottom: 5px;
    text-align: left;
}
#nsection3.add-section3 .hashtags {
    display: flex;
    margin-top: 20px;
    flex-wrap: wrap;
}
#nsection3.add-section3 .tag {
    display: inline-block;
    background-color: #f1f1f1;
    padding: var(--padding-8) var(--padding-16);
    margin: 5px 5px 0 0;
    border-radius: 15px;
    font-size: var(--font-size-15);
    color: #444;
}
#nsection3.add-section3 video {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;	
    border: 10px solid var(--main-color-1);
}	
#nsection3.add-section3 .contents_wrap {
    display: flex;
    justify-content: center;
}

#nsection3.add-section3 .profile-card-left {
    width: 30%;
	padding-right: 5px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
#nsection3.add-section3 .profile-card-right {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    width: 70%;
}
#nsection3.add-section3 .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    margin: 0 2.5px !important;
    background: rgba(0,0,0,0.1);
    transform: scale(1) !important;
    opacity: 1;
}
#nsection3.add-section3 .swiper-pagination-bullet-active {
    background: #bca06a;
}
#nsection3.add-section3 .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 5%;
}
#nsection3.add-section3 .swiper {
    height: 100%;
}

/* ¼Õ ÆíÁö Ãß°¡ */
#nsection11 .tab_wrap.letter li {
    background-color: #e3dac7;
    display: flex;
    width: 20%;
    padding: 0;
    flex-direction: column;
}
#nsection11 .tab_wrap.letter li .letter-tit {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 20px;
    flex-direction: column;
    gap: var(--gap-20);
}
#nsection11 .tab_wrap.letter li .letter-tit span:nth-child(1) {
    width: 100%;
    font-size: var(--font-size-22);
    line-height: var(--line-height-30);
    text-align: left;
    font-weight: 600;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
    text-overflow: ellipsis;
}
#nsection11 .tab_wrap.letter li .letter-tit span:nth-child(2) {
    width: 100%;
    font-size: var(--font-size-16-16);
    line-height: 24px;
    padding: 0;
    margin: 0;
    text-align: left;
    font-weight: 500;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    white-space: normal;
    text-overflow: ellipsis;
}
#nsection11 .tab_wrap.letter li .letter-tit span b {
    font-weight: 700;
    color: var(--main-color-2);
}
#nsection11 .tab_wrap.letter li .letter-img {
    width: 100%;
    height: 300px;
}
#nsection11 .tab_wrap.letter li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
	object-position: top;
}
#nsection11 .tab_wrap.letter .img{
    width: auto;
}
#nsection11 .tab_wrap.letter .img img {
    width: auto;
    object-fit: contain;
    border-radius: 0;
}
#nsection11 .tab_wrap.letter em {
    display: inline-block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #000;
    line-height: 1em;
}
#nsection11 .tab_wrap.letter span {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: #000;
    line-height: 1em;
}
#nsection11 .tab_wrap.letter .tit_main {
    display: flex;
    justify-content: flex-start;
}
#nsection1 .txt_wrap h1.font-a.crime {
    /*line-height: 40px;*/
}


/*µðÀÚÀ̳ÊÃß°¡*/
.pt-20 {
    padding-top: 20px;
}

.pt-130 {
    padding-top: 130px;
}


.tab_wrap li {
    padding: 12px 25px;
}

#nsection11 .txt_wrap .sh_img_left {
    position: relative;
    left: 400px;
    top: 30px;
    width:40px;
	height:61px;	
}

#nsection11 .txt_wrap .sh_img_right {
    position: relative;
    left: 1160px;
    top: -30px;
    width:40px;
	height:61px;	
}

#nsection11 .txt_wrap .sh_img_left2 {
    position: relative;
    left: 370px;
    top: 30px;
    width:40px;
	height:61px;	
}

#nsection11 .txt_wrap .sh_img_right2 {
    position: relative;
    left: 1190px;
    top: -30px;
    width:40px;
	height:61px;	
}




#nsection11 .tab_wrap.letter li {
    background-color: #fbf4e5;
    display: flex;
    width: 20%;
    padding: 0;
    flex-direction: column;
    margin-top: 0px;
    border-radius: 15px;
}

#nsection11 .tab_wrap.letter li .letter-tit {
    padding: 40px 30px;
}

#nsection11 .tab_wrap.letter li .letter-tit span:nth-child(1) {
    font-weight: 700;
	color: rgb(17, 17, 17);
    font-size: var(--font-size-22);

}

#nsection11 .tab_wrap.letter li .letter-tit span b {
    font-weight: 800;
    color: #6d4904;
}

#nsection11 .tab_wrap.letter li img {
    border-radius: 15px;
}



#nsection11 .tab_wrap.letter li .letter-tit span:nth-child(2) {
    color: #54462b;
	font-weight: 500;
}

#nsection11 .tab_wrap.letter li .letter-img {
	order: 1;
}
#nsection11 .tab_wrap.letter li .letter-tit {
	order: 2;
}

/* ÇÐÆø  ¼½¼Ç 2 Ãß°¡ */
.add-section-school-01 .container-lawyer {
    width: 100%;
    padding: 0;
    position: relative;
}

/* »ó´Ü ½æ³×ÀÏ */
.add-section-school-01 .lawyer-list {
    display: flex;
    gap: 20px;
    position: absolute;
    z-index: 9;
}

.add-section-school-01 .lawyer-item {
    width: 100px !important;
    height: 120px;
    text-align: center;
    width: auto;
}
.add-section-school-01 .lawyer-item p {
    font-size: 12px;
    color: #888;
}

.add-section-school-01 .lawyer-item .thumb {
    width: 100px;
    height: 120px;
    background: #ddd;
    margin-bottom: 10px;
    border-radius: 10px;
	cursor: pointer;
}
.add-section-school-01 .lawyer-item.swiper-slide-thumb-active .thumb {
    background: #cbb992;
}
.add-section-school-01 .lawyer-item .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.add-section-school-01 .lawyer-item.swiper-slide-thumb-active p {
    color: #b08d57; /* ±Ý»ö °è¿­ °­Á¶ */
    font-weight: bold;
}

/* ¸ÞÀÎ ·¹À̾ƿô */
.add-section-school-01 .content-wrapper {
    display: flex;
    justify-content: space-between;
}

.add-section-school-01 .text-section {
    width: 75%;
    /* background: #fff; */
    text-align: left;
}

.add-section-school-01 .main-slogan {
    font-size: var(--font-size-20-32);
    line-height: 1.4;
    margin-top: 190px;
    margin-bottom: 40px;
    text-align: left;
    font-weight: 400;
    color: #000;
}

.add-section-school-01 .highlight1 {
    font-weight: 700;
}

.add-section-school-01 .highlight2 {
    color: #b08d57;
    font-weight: 700;
}

/* 3´Ü ¾È³» ¹®±¸ */
.add-section-school-01 .info-grid {
    width: 80%;
    display: flex;
    gap: 20px;
    margin-bottom: 40px;
}

.add-section-school-01 .info-item {
    flex: 1;
    position: relative;
    padding-top: 15px;
}
.add-section-school-01 .info-item p {
    font-size: var(--font-size-18);
    font-weight: 500;
    line-height: 1.6;
    color: #555;
    text-align: left;
}

.add-section-school-01 .info-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    background: #b08d57;
    border-radius: 50%;
}

.add-section-school-01 .sub-slogan {
    font-size: var(--font-size-20-32);
    font-weight: 500;
    color: #555;
    text-align: left;
    font-family: "Noto Serif", serif !important;
}

/* Áß°£ °á·Â */
.add-section-school-01 .career-section {
    position: absolute;
    width: 25%;
    display: flex;
    flex-direction: column;
    right: 23%;
    z-index: 8;
}

.add-section-school-01 .career-box {
    width: 100%;
    height: auto;
    padding: 30px;
    z-index: 9;
    background: #ccb98e;
    border-radius: 20px 0 0 20px;
}

.add-section-school-01 .career-box h3 {
    font-size: var(--font-size-20);
    margin-bottom: 10px;
    text-align: left;
    color: #333;
    font-weight: 800;
}

.add-section-school-01 .career-box ul {
    list-style: none;
}
.add-section-school-01 .career-box ul li {
    text-align: left;
    font-size: var(--font-size-15);
    line-height: 1.8;
    color: #333;
    font-weight: 500;
}

/* ¿À¸¥ÂÊ ÇÁ·ÎÇÊ */
.add-section-school-01 .profile-section {
    width: 25%;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

.add-section-school-01 .profile-image-area {
    flex-grow: 1;
    /* background: #e9ecef; */
    position: relative;
    max-height: 600px;
    display: flex;
    flex-direction: column;
    padding: 0px;
    border-radius: var(--border-radius-20);
    z-index: 9;
}

.add-section-school-01 .profile-image-area .profile-area {
    position: absolute;
    width: 100%;
    bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-section-school-01 .profile-image-area .profile-name {}

.add-section-school-01 .profile-image-area img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--border-radius-20);
}

.add-section-school-01 .profile-tag {
    background: #b08d57;
    color: #fff;
    padding: 4px 10px;
    font-size: 13px;
    display: inline-block;
    width: fit-content;
    border-radius: 15px;
    margin-bottom: 10px;
}

.add-section-school-01 .profile-name .name {
    font-size: var(--font-size-28-32);
    font-weight: bold;
    margin-right: 10px;
    color: #ffffff;
}

.add-section-school-01 .profile-name .position {
    font-size: var(--font-size-16);
    color: #ffffff;
}
.add-section-school-01 .sub-slogan i.line {
    position: relative;
    font-style: normal;
    z-index: 1;
}
.add-section-school-01.active .sub-slogan i.line:before {
    width: 100%;
}
.add-section-school-01 .sub-slogan i.line:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 3px;
    width: 0;
    height: 12px;
    background: #eae2cf;
    z-index: -1;
    transition: all 1s ease;
    transition-delay: 0.3s;
}

#nsection4 .txt_wrap h1 i.line.color:before {
    background: rgba(188,160,106,0.4);
}
#nsection4 .txt_wrap h1 i.line.color {
    color: #bca06a;
}


/* ÇÐÆø Ä«µå Ãß°¡ */
.add-section-school-02 .container-card {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--margin-30); /* Ä«µå »çÀÌ °£°Ý */
    width: 100%;
}

/* Ä«µå ½ºÅ¸Àϸµ */
.add-section-school-02 .container-card .card {
    background: rgba(255, 255, 255, 0.05); /* ¹ÝÅõ¸í ¹è°æ */
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: var(--padding-80) 0;
    width: 100%;
    text-align: center;
    transition: transform 0.3s ease, background 0.3s ease;
}

.add-section-school-02 .container-card .card:hover {
    transform: translateY(-10px);
    background: rgba(255, 255, 255, 0.08);
}

/* ¾ÆÀÌÄÜ »óÀÚ */
.add-section-school-02 .container-card .icon-box {
    font-size: 45px;
    color: #ffffff;
    margin-bottom: var(--margin-40);
    opacity: 0.9;
    display: flex;
    justify-content: center;
}

.add-section-school-02 .container-card .icon-box img {    
    width: auto;
    height: 100%;
	max-height: 60px;
    object-fit: cover;
}

/* Á¦¸ñ ½ºÅ¸ÀÏ */
.add-section-school-02 .container-card .title {
    color: #ffffff;
    font-size: var(--font-size-24);
    font-weight: 700;
    margin-bottom: var(--margin-20);
    opacity: 0.9;
    word-break: keep-all; /* ´Ü¾î ´ÜÀ§ ÁÙ¹Ù²Þ */
    line-height: 1.4;
}

/* ¼³¸í±Û ½ºÅ¸ÀÏ */
.add-section-school-02 .container-card .description {
    color: #cccccc !important;
    font-size: var(--font-size-18);
    line-height: 1.6;
    word-break: keep-all;
    font-weight: 300;
}


/* ÇÐÆø ´ëÀÀÀýÂ÷ Ãß°¡ */
.add-section-school-03 .tab-container {
  display: flex;
  width: 100%;
}

.add-section-school-03 .tab-item {
    flex: 1;
    padding: var(--padding-20) var(--padding-20);
    font-size: var(--font-size-20);
    font-weight: 600;
    cursor: pointer;
    text-align: center;
    position: relative;
    border-radius: 10px;
    background: #fff;
    border: solid 1px #ccc;
}

/* È°¼ºÈ­µÈ(¼±ÅõÈ) ÅÇ ½ºÅ¸ÀÏ */
.add-section-school-03 .tab-item.active {
  background-color: #bca06a; /* À̹ÌÁö¿Í À¯»çÇÑ °¥»ö °è¿­ */
  color: #fff;
    border: solid 1px #bca06a;
}

/* ¼±ÅÃµÈ ÅÇ ÇÏ´ÜÀÇ ÀÛÀº È­»ìÇ¥(»ï°¢Çü) */
.add-section-school-03 .tab-item.active::after {
    content: '';
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #bca06a;
}

.add-section-school-03 .banner-container {
    width: 100%;
    background-color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    padding: var(--padding-40);
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    border-radius: 8px;
    flex-direction: column;
}

.add-section-school-03 .text-bubble {
    width: 60%;
    background-color: #f2f2f2;
    padding: 12px 30px;
    border-radius: 50px;
    font-size: var(--font-size-24-18);
    font-weight: bold;
    color: #333;
    text-align: center;
}
.add-section-school-03 .progress-steps {
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin: 30px 0 20px 0;
    position: relative;
    width: 85%;
}

.add-section-school-03 .pstep {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    color: #999;
    position: relative;
    z-index: 1;
    background-color: #fff;
}

.add-section-school-03 .pstep.active {
    border-color: #bca06a; /* °ñµå »ö»ó */
    color: #fff;
    background-color: #bca06a;
}

.add-section-school-03 .progress-steps::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #ccc;
    transform: translateY(-50%);
    z-index: 0;
}
.add-section-school-03 .process-container {
    width: 100%;
	display: grid;
    grid-template-columns: 1fr 20px 1fr 20px 1fr 20px 1fr 20px 1fr;
    gap: 20px;
}

.add-section-school-03 .step {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 12px;
    padding: var(--padding-25) var(--padding-15);
    width: 100%;
    height: 100%;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0,0,0,0.02);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* ù ¹ø° Ä«µå ¶Ç´Â È°¼ºÈ­µÈ Ä«µå ½ºÅ¸ÀÏ */
.add-section-school-03 .step.active {
    background-color: #fffaf0; /* ¿¬ÇÑ º£ÀÌÁö»ö ¹è°æ */
    border: 2px solid #bca06a; /* °­Á¶µÈ Å׵θ® */
    transition: all 0.5s ease; /* ºÎµå·¯¿î Àüȯ */
    transform: translateY(-5px);
}

.add-section-school-03 .step h3 {
    font-size: var(--font-size-20);
    font-weight: 700;
    color: #333;
    word-break: keep-all;
    line-height: 1.3;
}

.add-section-school-03 .step p {
    font-size: var(--font-size-16);
    font-weight: 400;
    color: #333;
    line-height: 1.6;
    margin: 0;
    word-break: keep-all;
}

.add-section-school-03 .arrow {
    display: flex;
    align-items: center;
}
.add-section-school-03 .arrow img {
    width: 100%;
	max-width: 20px;
}
.add-section-school-03 .container-ftxt {
    text-align: center;
    color: #333;
    margin-top: 40px;
}

.add-section-school-03 .title-top {
    font-size: var(--font-size-24);
    font-weight: normal;
    margin-bottom: 10px;
}

.add-section-school-03 .title-bottom {
    font-size: var(--font-size-28);
    font-weight: 700;
}

.add-section-school-03 .highlight {
    color: #bca06a; /* À̹ÌÁöÀÇ 'ù ´ÜÃß' »ö»ó ¹Ý¿µ */
    position: relative;
    z-index: 1;
    font-weight: 700;
}

.add-section-school-03 .highlight::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 5px;
    width: 100%;
    height: 6px;
    background-color: rgba(188,160,106,0.4); /* 'ù ´ÜÃß' ¾Æ·¡ ¹è°æ»ö */
    z-index: -1;
}
.add-section-school-03 .dot-hr {
    margin: 10px;
	display: block;
	border: none;
	border-top: 1px dashed #cecece;
}
.add-section-school-03 .tab-content { display: none; } /* ±âº» ¼û±è */
.add-section-school-03 .tab-content.active { display: block; } /* È°¼ºÈ­½Ã Ç¥½Ã */

#nsection1 .txt_wrap h1.font-a.school {
    margin-top: 13px;
    font-family: var(--fonts2) !important;
    font-weight: 600;
    letter-spacing: -2px;
}
#nsection1 .txt_wrap h1.font-a.school span:before {
    content: '';
    position: absolute;
    left: 0px;
    bottom: -33px;
    width: 100%;
    height: 35px;
    background: url(/img/kb/school/deco03.svg)no-repeat center;
    background-size: 100%;
}
#nsection1 .txt_wrap h1.font-a.school span i {
    position: relative;
    font-style: normal;
    font-weight: 700;
    /*font-size: var(--sfont-size-60-26);*/
    font-family: var(--fonts3) !important;
    color: #ffde44;
}
#nsection1 .txt_wrap h1.font-a.school span i:before {
    content: '';
    position: absolute;
    top: -8px;
    left: 50%;
    margin-left: -5px;
    width: 10px;
    height: 10px;
    background: #ffde44;
    border-radius: 50px;
    opacity: 0;
    transition: all 0.5s;
}
#nsection1.active .txt_wrap h1.font-a.school span i:before {
    opacity: 1;
}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(1):before{transition-delay:1.2s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(2):before{transition-delay:1.4s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(3):before{transition-delay:1.6s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(4):before{transition-delay:1.8s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(5):before{transition-delay:2.0s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(6):before{transition-delay:2.2s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(7):before{transition-delay:2.4s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(8):before{transition-delay:2.6s;}
#nsection1 .txt_wrap h1.font-a.school span i:nth-child(9):before{transition-delay:2.8s;}
#nsection1 .txt_wrap h1.font-a.school.margin-top {
    padding-top: var(--padding-50);
	font-size: var(--sfont-size-50);
}
#nsection1 .txt_wrap h1.font-a.school.margin-top2 {
    padding-top: var(--padding-10);
}
#nsection1 .txt_wrap h1.font-a.school.margin-right {
    padding-right: var(--padding-20);
    padding-top: 0px;
	font-size: var(--sfont-size-50);
}
#nsection1 .txt_wrap h1.font-a.school .counters.school.c-01 {
    position: relative;
    font-weight: 700;
    font-style: normal;
    color: #ffde44;
    /*font-size: var(--sfont-size-60-26);*/
    font-family: var(--fonts3) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-left: var(--padding-70-20);
}
#nsection1 .txt_wrap h1.font-a.school .counters.school.c-01:before {
    content: '';
    position: absolute;
    width: 125%;
    height: 135%;
    background: url(/img/kb/school/deco03.png)no-repeat;
    background-position: center;
    background-size: cover;
    z-index: -1;
    left: -10px;
    bottom: -13px;
}


@media (max-width: 1700px) {

}

@media (max-width: 1500px) {

}

@media (max-width: 1300px) {

}

@media (max-width: 1200px) {

}

@media (max-width: 1024px) {

}

@media (max-width: 860px) {

}

@media all and (max-width: 768px){
	.mo-none {display:none !important;}
	.mo-block {display:block !important;}
	#nsection4.add-section1  .list-differ.crime > li {
		width: 100%;
	}
	#nsection4.add-section1 .list-differ > li p {
		display: block;
	}
	#nsection4.add-section1 .icon-arrow img {
		transform: rotate(90deg);
	}
	#hero {
		width: 100%;
		height: 100%;
		display: block;
		overflow: hidden;
		position: relative;
	}
	.hero {
		position: relative;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.hero figure {
		width: 100%;
		height: 100%;
	}
	.hero figure {
		-webkit-filter: saturate(100%);
		filter: saturate(100%);
	}
	.hero figure div {
		border: 5px solid var(--main-color-2);
		flex-direction: column;
		align-items: center;
	}
	.hero figure:nth-child(2) div {
		border-top: 0px solid var(--main-color-2);
		border-bottom: 0px solid var(--main-color-2);
		border-left: 5px solid var(--main-color-2);
		border-right: 5px solid var(--main-color-2);
		flex-direction: column;
		align-items: center;
	}
	.hero figure.on div {
		justify-content: center;
	}
	.hero figure div h2 span:last-child {
		display: none;
	} 
	.hero figure div h2 {
		writing-mode: horizontal-tb;
		padding: var(--padding-10) var(--padding-20);
		border-radius: 50px;
		background: #bca06a;
		opacity: 1.0;
	}
	.hero figure div p {
		color: #ffffff;
		font-size: var(--font-size-44);
		font-weight: 600;
		margin-top: var(--margin-40);
		width: 100%;
		margin-bottom: 0;
		display: flex;
		letter-spacing: -0.6px;
	}
	.hero figure.on div {
		position: relative;
		width: 100%;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-align: center;
		-ms-flex-align: center;
		justify-content: center;
		color: #fff;
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
		padding: var(--padding-80) 0;
		align-items: center;
	}
	.hero figure.on div p {
		justify-content: center;
	}
	.hero figure div p {
		justify-content: center;
	}
	.hero figure div p:last-child {
		display: flex;
		font-size: var(--font-size-16-20);
		font-weight: 400;
		position: relative;
		padding-left: var(--padding-20);
		padding-right: var(--padding-20);
		line-height: var(--line-height-24-30);
		word-break: keep-all;
		text-align: center;
	}
	.hero figure {
		flex-direction: column;
	}
	.hero figure div {
		position: relative;
	}
	.hero figure img {
		position: absolute;
	}
	.accordion-list .accordion-item {
		width: 100%;
	}
	.accordion-list {
		gap: 10px 0px;
		display: flex;
		flex-wrap: wrap;
	}
	.section h1 {
		font-size: 25px;
	}
	.accordion-list .accordion-item .accordion-desc {
		padding: 10px 15px;
		font-size: 15px;
		padding-left: 45px;
	}
	.accordion-list .accordion-name {
		padding-left: 45px;
	}
	#nsection3.add-section3 .contents_wrap {
		flex-wrap: wrap;
	}
	#nsection3.add-section3 .profile-card-left {
		width: 100%;
		padding-right: 0px;
	}
	#nsection3.add-section3 .profile-card-right {
		width: 100%;
	}
	#nsection51 .cs-tit {
		justify-content: center;
	}
	.section .bos-03 {
		justify-content: center;
	}
	.tab_wrap li {
		font-size: 15px !important;
		padding: 8px 16px !important;
	}
	
	.tit.black h1.bos-02 .quote1 {
		width: 20px;
	}
	.tit.black h1.bos-02 .quote2 {
		width: 10px;
	}
	.tit.black h1.bos-02 .quote1:before {
		left: 0px;
		top: -25px;
		width: 100%;
		height: 20px;
	}
	.tit.black h1.bos-02 .quote2:after {
		right: 0px;
		top: -25px;
		width: 100%;
		height: 20px;
	}
	#nsection11 .tab_wrap.letter.bos-03 {
		display: flex;
		flex-direction: column;
	}
	#nsection11 .tab_wrap.letter li {
		width: 100%;
	}
		#nsection11 .tab_wrap.letter li .letter-tit {
		padding: 20px 10px;
	}
	#nsection4.add-section1 .txt_wrap .tit.sub h2.m-20 {
		line-height: 25px;
	}
	#nsection4.add-section1 .txt_wrap .tit.sub h2 {
		line-height: 30px;
	}
	#nsection4.add-section1 h2 span i:before {
		top: -5px;
	}
	#nsection4.add-section1 .list-differ > li h2 {
		/*position: absolute;
		padding-left: 30px;*/
	}
	.hero figure.on div p:last-child::before {
		display: none;
	}
	#nsection11 .tab_wrap.letter li .letter-img {
		order: 1;
	}
	#nsection11 .tab_wrap.letter li .letter-tit {
		order: 2;
	}
	
	.mainSwiper .counter.lv-001:before {
		left: -10px;
	}
	.mainSwiper .counter.lv-002:before {
		left: -12px;
	}
	.add-section-school-02 .container-card {
		grid-template-columns: repeat(1, 1fr);
	}
	.add-section-school-02 .container-card .card:hover {
		transform: translateY(0px);
	}
	
	.add-section-school-01 .lawyer-list {
		display: none;
	}
	.add-section-school-01 .content-wrapper {
		flex-direction: column;
	}
	.add-section-school-01 .text-section {
		order: 2;
		width: 100%;
	}
	.add-section-school-01 .profile-section {
		order: 1;
		width: 100%;
	}
	.add-section-school-01 .info-item::before {
		display: none;
	}
	.add-section-school-01 .info-grid {
		flex-direction: column;
		gap: 0px;
		width: 100%;
	}
	.add-section-school-01 .profile-image-area {
		order: 1;
		max-height: 100%;
	}
	.add-section-school-01 .career-section {
		position: relative;
		width: 100%;
		right: 0;
		order: 2;
		top: -20px;
	}
	.add-section-school-01 .career-box {
		border-radius: 0 0 10px 10px;
		padding: 40px 30px 20px 30px;
	}
	.add-section-school-01 .main-slogan {
		margin-top: 20px;
		margin-bottom: 10px;
	}
	.add-section-school-03 .text-bubble {
		width: 100%;
		margin-bottom: 30px;
	}
	.add-section-school-03 .progress-steps {
		display: none;
	}
	.add-section-school-03 .process-container {
		grid-template-rows: 1fr 20px 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: auto;
		gap: 10px;
		justify-items: center;
	}
	.add-section-school-03 .arrow img {
		transform: rotate(90deg);
	}
	.list-business.school > li {
		width: calc((100% / 2) - 5px);
		height: 75px;
	}
	#nsection1 .txt_wrap h1.font-a.school span i:before {
		top: -5px;
		margin-left: -1px;
		width: 5px;
		height: 5px;
	}
	#nsection1 .txt_wrap h1.font-a.school span:before {
		left: 0px;
		bottom: -13px;
		width: 100%;
		height: 15px;
		background: url(/img/kb/school/deco03.svg)no-repeat center;
		background-size: 100%;
	}
	#nsection1 .txt_wrap h1.font-a.school .counters.school.c-01:before {
		left: -0px;
		bottom: -5px;
	}
	#nsection1 .txt_wrap h1.font-a.school.margin-top2 {
		padding-top: 0;
	}
	.list-business.school > li > a > span {
		font-size: 17px;
	}

}

@media all and (max-width: 620px){

}

@media all and (max-width: 560px){

}

@media all and (max-width: 500px){
}

@media all and (max-width: 520px){

}

@media all and (max-width: 500px){

}

@media all and (max-width: 490px){

}

@media all and (max-width: 450px){

}

@media all and (max-width: 400px){

}

@media all and (max-width: 370px){

}