
@import url('https://fonts.googleapis.com/css2?family=Nanum+Brush+Script&display=swap');

.nanum-brush-script-regular {
  font-family: "Nanum Brush Script", cursive;
  font-weight: 400;
  font-style: normal;
}


.a1 {}
.a1_bg {display: flex;max-width: 1660px; margin: 0 auto; padding: 100px 20px;}
.a1_con {width: 50%; margin-right: 10%;}
.a1_con h2 {font-size: 35px; word-break: keep-all;}
.a1_con p {margin: 50px 0; font-size: 18px; word-break: keep-all;}
.a1_con span { font-family: "Nanum Brush Script", cursive; font-size: 30px; float: right;}
.a1_img {width: 40%;}
.a1_img img {width: 90%; max-width: 500px; margin-left: 10%;}
.a1.gr {background: #f8f8f8;}


@media screen and (max-width:960px) {
  .a1_con {width: 100%; margin-right: 0;}
  .a1_img {display: none;}
}

@media screen and (max-width:640px) {
  .a1_bg {padding: 50px 20px;}
  .a1_con h2 {font-size: 22px;}
  .a1_con p {font-size: 16px; margin: 30px 0;}
  .a1_con span {font-size: 24px;}
}




.a2 {}
.a2_tit {margin-bottom: 100px;}
.a2_tit h1 {font-size: 54px;}
.a2_tit h2 {font-size: 18px; font-weight: 400; color: #666; word-break: keep-all;}
.a2_txt {background: url(../img/a2_bg.jpg) no-repeat center; background-size: cover; padding: 80px;}
.a2_txt ul {}
.a2_txt ul li {display: flex; font-size: 16px; margin-bottom: 20px; color: #fff;}
.a2_txt ul li strong {width: 200px;}
.a2_txt ul li p {font-weight: 200;}

.a2_txt2 {margin-top: 150px;}
.a2_txt2 h2 {font-size: 36px; margin-bottom: 30px;}
.a2_txt2 .a2_table {width: 100%; overflow-x: auto; white-space: nowrap;}
.a2_txt2 table {border-collapse: collapse; width: 100%; border-top: 2px solid #000;}
.a2_txt2 tr {}
.a2_txt2 th {font-size: 18px; border: 1px solid #ccc; padding: 10px; background: #f1f1f4;}
.a2_txt2 td {font-size: 16px; padding: 10px; text-align: center; border: 1px solid #ccc;}



@media screen and (max-width:640px) {
    .a2_tit {margin-bottom: 50px;}
    .a2_tit h1 {font-size: 30px;}
    .a2_txt {padding: 30px 20px;}
    .a2_txt ul li {flex-direction: column;}
    .a2_txt2 {margin-top: 70px;}
    .a2_txt2 h2 {font-size: 24px; margin-bottom: 10px;}
    .a2_txt2 th {font-size: 16px;}
    .a2_txt2 td {font-size: 14px;}
}



.a3>h2 {max-width: 1640px; margin: 0 auto; padding: 0 20px 100px 20px; font-size: 54px; word-break: keep-all;}
.a3_con {position:relative; padding-left:50%;}
.a3_con .years_tit {position:absolute; top:0; left:0; width:50%; height:100vh; max-height:calc(var(--vh, 1vh) * 100); background:url('../img/a3_img.jpg') no-repeat 50% 50% / cover; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;}
.a3_con .years_tit .tit {font-size:20px; color:#fff; font-weight:300; line-height:1.4; margin-bottom:40px; text-align:center; word-break: keep-all;}
.a3_con .years_tit .tit strong {font-weight: 500;}
.a3_con .years_tit ul {display:flex; flex-direction:column; gap:20px;}
.a3_con .years_tit li {font-size:60px; color:rgba(255,255,255,0); font-weight:700; line-height:84px; -webkit-text-stroke:1px rgba(255,255,255,.3)}
.a3_con .years_tit li.on {color:#fff; -webkit-text-stroke:0;}
.a3_con .years_tit li p {display:block; color:inherit;}
.a3_con .years_con {padding:80px 0 100px 80px;}
.a3_con .years_con dl {margin-bottom:100px;}
.a3_con .years_con dl:last-child {margin-bottom:0;}
.a3_con .years_con dt {position:relative; font-size:45px; color:#000; font-weight:700; line-height:1.2;}
.a3_con .years_con dt .ypoint {position:absolute; top:-50vh;}
.a3_con .years_con dd {padding-top:40px; display:flex; flex-direction:column; gap:17px;}
.a3_con .years_con dd p {position:relative; color:#333; line-height:1.6; padding-left:45px;font-size: 20px; word-break: keep-all;}
.a3_con .years_con dd p strong {position:absolute; top:0; left:0; color:#28738b; font-weight:700;}
.a3_con .hispoint {position:absolute; top:0;}
.a3_con .setpoint {position:absolute; top:-40px;}
.upset .a3_con .setpoint {top:-100px;}
.a3_con .his_end {top:calc(100% - 100vh);}
.a3_con.start .years_tit {position:fixed;}
.a3_con.end .years_tit {position:absolute; bottom:0; top:auto;}

@media screen and (max-width: 960px) {
	.a3_con {padding-left:0;}
	.a3_con .years_tit {position:relative; width:100%; height:auto; padding:44px 0;}
	.a3_con .years_tit .tit {font-size:15px; margin-bottom:25px;}
	.a3_con .years_tit ul {gap:0;}
	.a3_con .years_tit li {font-size:38px; line-height:50px;}
	.a3_con.start .years_tit,
	.a3_con.end .years_tit {position:relative;}
	.a3_con .years_con {padding:40px 20px 150px 20px;}
	.a3_con .years_con dt {font-size:25px;}
	.a3_con .years_con dl {margin-bottom: 50px;}
	.a3_con .years_con dd {gap:5px; padding-top: 20px;}
	.a3_con .years_con dd p {padding-left:30px; font-size: 16px;}
}


@media screen and (max-width: 640px) {
    .a3>h2 {font-size: 30px; padding: 0 20px 50px 20px;}
}









.a4 {}
.a4 img {width: 100%; margin: 0 auto; padding: 0 10%;}

@media screen and (max-width: 960px) {
    .a4 img {padding: 0;}
}












.a6 {}
.a6 .add {display: flex; flex-wrap: wrap;}
.a6 .add_con1 {display: flex; justify-content: space-between; align-items: flex-end; padding: 50px; width:100%;}
.a6 .add_con1 h3 {font-size: 30px; color: #215a8d; font-weight: 600; word-break: keep-all;}
.a6 .add_con1 h3 b {font-weight: 600;}
.a6 .add_con1 div {}
.a6 .add_con1 div a {padding: 12px 20px; background: #434343; color: #fff; font-size: 18px; display: inline-block; border-radius: 5px; transition: all 0.5s;}
.a6 .add_con1 div a:hover {background: #222;}
.a6 .add_con1 div a i {margin-right: 5px;}
.a6 .add_con2 {padding: 40px 0; border-top: 1px solid #ccc; width: 33.33%; border-bottom: 1px solid #ccc; background: #215a8d;}
.a6 .add_con2 ul {display: flex; align-items: center; padding: 10px 50px; }
.a6 .add_con2:nth-child(3) ul {border-right: 1px solid #ccc; border-left: 1px solid #ccc;}
.a6 .add_con2 ul li:first-child {width: 10%; min-width: 100px; margin-right: 5%; display: flex; font-size: 18px; align-items: center; height: 20px; line-height: 20px;}
.a6 .add_con2 ul li i {color: #fff; opacity: 0.4; margin-right: 14px;}
.a6 .add_con2 ul li h2 {color: #fff;}
.a6 .add_con2 ul li p {font-size: 18px; line-height: 1.6; color: #fff; word-break: keep-all;}


@media screen and (max-width: 1200px) {
  .a6 .add_con2 ul {align-items: flex-start; flex-direction: column;}
}

@media screen and (max-width: 960px) {
  .a6 .add_con1 {padding: 30px 20px; flex-direction: column; align-items: flex-start;}
  .a6 .add_con1 h3 {font-size: 24px;}
  .a6 .add_con1 h3 b {display: block; width: 100%; font-size: 18px; color: #000;}
  .a6 .add_con1 div a {margin-top: 20px;}
  .a6 .add_con2 {width: 100%; padding: 30px 0;}
  .a6 .add_con2 ul {padding: 0 20px;}
  .a6 .add_con2:nth-child(3) {border-top: 0; border-bottom: 0;}
  .a6 .add_con2:nth-child(3) ul {border-right: 0; border-left: 0;}
}


@media screen and (max-width: 640px) {
  .a6 .add_con1 {padding: 30px 10px;}
  .a6 .add_con1 h3 {font-size: 18px;}
  .a6 .add_con1 div a {padding: 7px 15px; font-size: 14px;}
  .a6 .add_con2 {padding: 20px 0;}
  .a6 .add_con2 ul li:first-child {font-size: 16px; margin-right: 0; margin-bottom: 10px;}
  .a6 .add_con2 ul li p {font-size: 16px;}
}








.b1 {margin-bottom: 100px;}
.b1_tit {display: flex; align-items: stretch; width: 100%; max-width: 1640px; margin: 0px auto; padding: 70px 20px;}
.b1_tit_img {padding: 2%; width: 40%; text-align: center; border: 1px solid #ddd; margin-right: 5%; position: relative;}
.b1_tit_img img {width: 100%; max-width: 400px;}
.b1_tit_img .sign {position: absolute;left: 0; top: 0; background: #222; color: #fff; padding: 5px 20px; font-size: 20px;}
.b1_tit_img .element {position: absolute; right: 0; bottom: 0; padding: 5px 20px; background: #f1f1f4; font-size: 20px;}
.b1_tit_txt {width: 55%; padding: 30px;}
.b1_tit_txt h2 {font-size: 26px; margin-bottom: 30px; word-break: keep-all;}
.b1_tit_txt p {font-size: 18px; margin-bottom: 7px; color: #333; word-break: keep-all; line-height: 1.4;}

.b1_bg {}
.b1_con {padding: 0px 20px;margin: 0 auto;width: 100%;max-width: 1640px;}
.b1_con .owl-dots {
  display: none;
}

.b1 .owl-carousel .owl-stage-outer {overflow: unset;}
.b1 .owl-carousel .owl-stage {cursor: url('../img/over_ms.png') 50 20, auto; /* 이미지 커서를 설정 */}


@media screen and (max-width: 960px) {
	.b1_tit {flex-direction: column;}
	.b1_tit_img {width: 100%; margin-right: 0;}
	.b1_tit_txt {width: 100%; margin-top: 20px; padding: 0;}
}



@media screen and (max-width: 640px) {
  .b1_tit {padding: 20px;}
  .b1_tit_img {padding: 50px 0;}
	.b1_tit_img img {max-width: 170px;}
  .b1_tit_img .element {font-size: 16px;}
	.b1_tit_txt h2 {font-size: 20px; margin-bottom: 20px;}
	.b1_tit_txt p {font-size: 16px; margin-bottom: 5px;}
}




.b2_con1 {display: grid; gap: 40px; padding: 50px 00px;}
.b2_txt {background: #fff; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07); padding: 40px; transition: transform 0.3s ease, box-shadow 0.3s ease;}
.b2_txt:hover {transform: translateY(-6px); box-shadow: 0 14px 40px rgba(0, 0, 0, 0.1);}
.b2_txt h3 {font-size: 24px; margin-bottom: 20px; color: #215a8d; display: flex; align-items: center; gap: 20px;}
.b2_txt p {font-size: 18px; color: #444; word-break: keep-all;}


@media (max-width: 640px) {
.b2_con1 {padding: 20px 00px;}
.b2_txt {padding: 30px;}
.b2_txt h3 {font-size: 20px;}
.b2_txt p {font-size: 16px;}
}







.b3{width:100%;overflow-x:auto;position:relative;}
.b3-scroll-info{display:none;font-size:14px;color:#666;background:#f9f9f9;border:1px solid #ddd;padding:6px 12px;margin-bottom:8px;border-radius:4px;white-space:nowrap;}
.b3 table{width:100%;border-collapse:collapse;min-width:700px;}
.b3 th,.b3 td{border:1px solid #ccc;padding:8px 12px;text-align:center;font-size:16px;word-break:keep-all;white-space:nowrap;}
.b3 thead{background-color:#f2f2f2;}
.b3 .sticky-col{position: sticky;left: 0; background: #215a8d; color: #fff; z-index: 3;}
.b3 thead th{position:sticky;top:0;background:#f2f2f2;z-index:2;}

@media(max-width:960px){
.b3 th,.b3 td{font-size:13px;padding:6px 8px;}
}

@media(max-width:640px){
.b3 th,.b3 td{font-size:12px;padding:5px 6px;}
}



.b4 {}
.b4_grid {display:flex; flex-wrap:wrap; gap:40px; justify-content:space-between; position:relative;}
.b4_step {flex:1 1 calc(23% - 40px); background:#ffffff; border:1px solid #e5e7eb; border-radius:16px; padding:40px 24px; text-align:center; transition:all 0.3s ease; box-shadow:0 4px 12px rgba(0,0,0,0.05); min-width:260px; position:relative;}
.b4_step:hover {box-shadow:0 12px 24px rgba(0,0,0,0.12); transform:translateY(-6px);}
.b4_number {position:absolute; top:0; left:0; background:linear-gradient(45deg, #215a8d, #3b83c5); color:#ffffff; font-size:18px; font-weight:700; padding:10px 15px; border-bottom-right-radius:10px;}
.b4_step h3 {font-size:18px; font-weight:600; color:#000; margin-bottom:10px;}
.b4_step p {font-size:14px; color:#6b7280;}
.b4_notice {margin-top:72px; background:#ffffff; padding:28px 24px; border-left:5px solid #215a8d; box-shadow:0 2px 10px rgba(0,0,0,0.04);}
.b4_notice p {font-size:15px; line-height:1.7; color:#374151; margin-bottom:14px;}
.b4_notice p:last-child {margin-bottom: 0;}

@media(max-width:1280px) {
  .b4_step {flex:1 1 calc(30% - 32px);}
}

@media(max-width:960px) {
  .b4_step {flex:1 1 calc(45% - 20px);}
}

@media(max-width:600px) {
  .b4_step {flex:1 1 100%;}
}