/*     1487405 : 블록 설정      */
.block_option__1487405__ {display:table;width:100%}
.block_option__1487405__ p {display:table-cell;height:100px;margin:0;background:#fafafa;color:#c40000;text-align:center;vertical-align:middle}

@media (max-width:1023px){
	.row__1487405__ {}
}


@media (min-width:1024px){
	.row__1487405__ {    background-size: cover;  background-repeat: no-repeat;width:98%;   height: 450px;border-radius:10px}
}

/*     1488285 : BLANK 컨텐츠      */
.blank__1488285__ {.blank__1488285__ { 
  box-sizing: border-box;
  display: block;
  position: relative;
  width: 100%;
  height: 450px; /* 기존 400px → 450px로 변경 */
}
}
.blank__1488285__.build_edit_mode {min-height:10px;border:1px dashed red;background:rgba(255,255,255,.1);}
.blank__1488285__.build_edit_mode:before {content:'Blank';display:block;position:absolute;top:50%;left:0;right:0;margin-top:-10px;padding:5px 0;font-size:13px;color:red;text-align:center;line-height:1}

@media all and (max-width:1023px){
  .blank__1488285__ {height:450px;}
}



/*     1487425 : HTML 편집기      */
 .mission {
            text-align: center;
            padding: 130px 20px;
            background: white;
        }

        .mission h2 {
            font-size: 45px;
            margin-bottom: 20px;
            line-height: 1.5; color:#222;
        }

        .mission .highlight {
            color: #37926B;
        }

        .mission p {
            color: #444;
            line-height: 1.5;
            max-width: 1280px;
            margin: 0 auto; font-size:24px; letter-spacing:-0.035em;
        }
 @keyframes slide-up {
    0%{opacity : 0;}
    70%{opacity : 0; transform: translateY(40px);}
}

@keyframes opacity_ani {
    0%{opacity: 0;}
    70%{opacity: 0;}
}


@keyframes slide-up2 {
    0%{opacity : 0;}
    50%{opacity : 0; transform: translateY(60px);}
}




/*     1487435 : HTML 편집기      */
        .quote-section {
            text-align: center;
            color: white;
        }

        .quote-section h3 {
            font-size: 42px;
            margin-bottom: 15px;
            font-weight: 600;
        }

        .quote-section p {
            font-size: 20px;
            opacity: 0.9;
        }

        .footer {
            background: #000;
            height: 200px;
        }

        @media (max-width: 768px) {
            .hero {
                padding: 0 30px;
                height: 300px;
            }

            .hero h1 {
                font-size: 32px;
            }

            .features {
                flex-direction: column;
                align-items: center;
            }

            .education-section {
                flex-direction: column;
                padding: 60px 30px;
                gap: 40px;
            }

            .mission h2 {
                font-size: 24px;
            }

            .education-content h2 {
                font-size: 28px;
            }
        }
/* ===== 커튼 애니메이션 (배경 유지 버전) ===== */
.reveal-box {
  position: relative;
  background: url('../../img/img03.webp');
            background-size: cover;
            background-position: center;padding:0px 0 80px; 
  overflow: hidden;
}

.reveal-box::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(to right, #ffffff 0%, #ffffff 100%);
  mix-blend-mode: lighten; /* 배경과 자연스럽게 섞이게 */
  transform-origin: left;
  transform: scaleX(1);
  transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1);
  z-index: 2;
  pointer-events: none;
}

.reveal-content {
  position: relative;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity 1.2s ease 0.3s, transform 1.2s ease 0.3s;
  z-index: 1; width:1280px; margin:0 auto;
}

/* ==== 스크롤 시 on 클래스 붙을 때 ==== */
.animate-sect.on .reveal-box::before {
  transform: scaleX(0);
}

.animate-sect.on .reveal-content {
  opacity: 1;
  transform: scale(1);
}
.scroll-text {
  font-size: 16px;
  color: white;
  letter-spacing: 1px;
  margin-bottom: 10px;
  opacity: 0.8;   
 text-align: center;
    display: block; padding-bottom:50px;
}

/* 세로 작대기 */
.line {
  position: relative;
  width: 2px;
  height: 60px;
  background: rgba(255, 255, 255, 0.2);
  overflow: hidden;    margin: auto;
}

/* 빛(별똥별) 애니메이션 */
.line::after {
  content: "";
  position: absolute;
  top: -30%;
  left: 0;
  width: 100%;
  height: 50%;
  background: linear-gradient(to bottom, rgba(255,255,255,1), transparent);
  animation: shooting 1.5s linear infinite;
}

/* 애니메이션 키프레임 */
@keyframes shooting {
  0% {
    top: -30%;
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0;
  }
}
.reveal-content h3{text-align:left;}
.reveal-content p{text-align:left;}
.Hightlight{color:#4BEEA7}

/*     1487475 : 블록 설정      */
.block_option__1487475__ {display:table;width:100%}
.block_option__1487475__ p {display:table-cell;height:100px;margin:0;background:#fafafa;color:#c40000;text-align:center;vertical-align:middle}

@media (max-width:1023px){
	.row__1487475__ {}
}


@media (min-width:1024px){
	.row__1487475__ {    background-size: cover;  background-repeat: no-repeat;}
}

/*     1487445 : HTML 편집기      */
  ul, li{list-style: none; padding:0;}
    /* 전체 높이 확보 */
    .scroll-wrap {
      height: 110vh; /* 세 구간: 진입 / 고정 / 다음 */
      position: relative;
    }
    /* 이미지 비주얼 */
    .imgVisual {
      top: 0;
      height: 120vh;
    }
  
    .visual_sect {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      background: url('../../img/whitebg.png') center center / cover no-repeat;
      transform-origin: center center;
      will-change: transform;
    }
    .line {
  position: relative;
  width: 2px;
  height: 60px;
  background: rgba(221, 221, 221, 1);
  overflow: hidden;    margin: auto;
}

.line3 {
    position: relative;
    width: 100%;
    height: 2px;
     background: rgba(221, 221, 221, 1);
    overflow: hidden;    margin: auto;
  }
  .line3::after {
    content: "";
    position: absolute;
    top: 0;
    left: -20%;
    width: 40%;
    height: 100%;
    background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.8) 50%, transparent 100%);
    animation: shooting2 2s linear infinite;
    opacity: 0;
  }
  

/* 애니메이션 키프레임 */
@keyframes shooting {
  0% {
    top: -30%;
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0;
  }
}

.titlesection{background: #fff;width: 100%;height: 200px;}
.container{width:1440px; margin:130px auto 0;}
.title {font-size:48px; color:#222; text-align: center;}
.contentsBox{width:1280px; margin:0 auto; margin-top:130px;}
.Boxlist{display: flex; width: 100%; justify-content: space-between; margin: 0 auto; flex-wrap: wrap; padding-bottom: 120px;}

.Box  {
    position: relative;
    background: #ECF5F1; /* 반투명 배경 */
    padding: 40px 30px;
    border-radius: 10px;
    overflow: hidden;
    z-index: 1;
    width:44%; 
    margin-bottom: 30px;
  }
  
  /* 반짝이는 테두리 효과 */
  .Box::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 10px;
    padding: 1px; /* 테두리 두께 */
    background: linear-gradient(
      120deg,
      rgba(255, 255, 255, 1),
      rgba(255, 255, 255, 0.05),
      rgba(255, 255, 255, 1)
    );
    background-size: 200% 200%;
    animation: glowBorder 4s linear infinite;
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
  }
  
  @keyframes glowBorder {
    0% {
      background-position: 0% 50%;
    }
    100% {
      background-position: 200% 50%;
    }
  }
.Hightlight2{color:#37926B;}
.Box h3{font-size:24px; margin-bottom:30px; color:#222;}
.Box p{font-size: 18px;color:#444; }
.titleBox .title h2{font-size: 48px; color:#222; text-align: left;}

  @keyframes shooting2 {
    0% {
      left: -40%;
      opacity: 0;
    }
    20% {
      opacity: 1;
    }
    50% {
      left: 60%;
      opacity: 0.8;
    }
    100% {
      left: 120%;
      opacity: 0;
    }
  }

  .titleBox{margin-bottom:55px}
  * ==== Scroll scale section base ==== */
  .scroll-wrap{
    position: relative;
    /* 자바스크립트로 동적으로 높이를 계산해 넣지만,
       JS가 늦게 로드될 때를 대비한 최소 높이 */
  }
  
  .imgVisual{
    top: 0;
    height: 100vh;
    overflow: hidden;
  }
  
  .visual_sect{
    width: 100%;
    height: 100%;  
    transform-origin: center center;
    will-change: transform;
  }
  
  .visual_sect .content{
    opacity: 1;                   /* 초기 숨김 */
    transition: opacity .4s ease;
  }
  
  .visual_sect .content.show{
    opacity: 1;
  }
  
  .contentsBox .titleBox .title.motion h2 {animation-name: slide-up2; animation-duration: 0.8s}
  .contentsBox .Boxlist.motion .Box {animation-name: slide-up2; animation-duration: 1.2s}

/*     1487485 : 블록 설정      */
.block_option__1487485__ {display:table;width:100%}
.block_option__1487485__ p {display:table-cell;height:100px;margin:0;background:#fafafa;color:#c40000;text-align:center;vertical-align:middle}

@media (max-width:1023px){
	.row__1487485__ {}
}


@media (min-width:1024px){
	.row__1487485__ {    background-size: cover;  background-repeat: no-repeat;}
}

/*     1487495 : BLANK 컨텐츠      */
.blank__1487495__ {box-sizing:border-box;display:block;position:relative;width:100%;height:130px}
.blank__1487495__.build_edit_mode {min-height:10px;border:1px dashed red;background:rgba(255,255,255,.1);}
.blank__1487495__.build_edit_mode:before {content:'Blank';display:block;position:absolute;top:50%;left:0;right:0;margin-top:-10px;padding:5px 0;font-size:13px;color:red;text-align:center;line-height:1}

@media all and (max-width:1023px){
	.blank__1487495__ {height:30px}
}

/*     1487455 : HTML 편집기      */
.titleWrap {width:1280px; margin:0 auto; }
.titleWrap .title h2{color:#fff;}
.titleWrap .title.motion {animation-name: slide-up2; animation-duration: 0.8s}
.line2 {
    position: relative;
    width: 100%;
    height: 2px;
    background: rgba(255, 255, 255, 0.2);
    overflow: hidden;    margin: auto;
  }
  .line2::after {
    content: "";
    position: absolute;
    top: 0;
    left: -20%;
    width: 40%;
    height: 100%;
    background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.8) 50%, transparent 100%);
    animation: shooting2 2s linear infinite;
    opacity: 0;
  }

/*     1487515 : 맞춤게시판 - 앨범형      */
.pm-myboard_album__1487515__ * {box-sizing:border-box}
.pm-myboard_album__1487515__ a {display:block;color:#333}
.pm-myboard_album__1487515__ ul {margin:0;padding:0;list-style:none;width: 1280px;margin: 0 auto; display:flex}
.pm-myboard_album__1487515__ ul:after {content:'';display:block;clear:both}
.pm-myboard_album__1487515__ .empty {width:100% !important;padding:10px 8px;font-size:14px;color:#666;text-align:center}
.pm-myboard_album__1487515__  ul .Box.motion {animation-name: slide-up2; animation-duration: 1s}
.pm-myboard_album__1487515__  ul .Box:nth-child(2).motion  {animation-name: slide-up2; animation-duration: 1.2s}
.pm-myboard_album__1487515__  ul .Box:nth-child(3).motion  {animation-name: slide-up2; animation-duration: 1.4s}
.pm-myboard_album__1487515__ ul li {float:left;position:relative;margin-right: 20px;}

.pm-myboard_album__1487515__ ul li > a {width:405px; height:400px;}
.pm-myboard_album__1487515__ ul li > a,
.pm-myboard_album__1487515__ ul li > div {display:block;width:100%;padding:10px 10px 30px;text-align:center;background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(3px); border-radius: 10px;}

.pm-myboard_album__1487515__ .figure {max-width:400px;margin:0 auto;box-sizing:content-box;height:270px}
.pm-myboard_album__1487515__ .figure > div {position:relative;overflow:hidden;padding:2px; width:100%}
.pm-myboard_album__1487515__ .figure img {display:block;margin:0 auto; width:100%; object-fit:cover;height:100%;}

.pm-myboard_album__1487515__ dl {margin:0;font-size:13px;line-height:1.6em;vertical-align:middle}
.pm-myboard_album__1487515__ dl dt span {display:block;padding:5px 0}
.pm-myboard_album__1487515__ dl dd {margin:0}
.pm-myboard_album__1487515__ dl dd span {display:block;padding:2px 0}
.pm-myboard_album__1487515__ dl .subject {    overflow: hidden;
    font-size: 18px;font-weight: 600;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin: 20px 10px 10px;
    text-align: left;}
.pm-myboard_album__1487515__ dl .date {    font-size: 16px;
    color: rgba(255, 255, 255, 0.8);
    text-align: left;
    margin: 0 10px;}

  /* 반짝이는 테두리 효과 */
 .pm-myboard_album__1487515__ ul .Box::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 10px;
    padding: 1px; /* 테두리 두께 */
    background: linear-gradient(
      120deg,
      rgba(255, 255, 255, 1),
      rgba(255, 255, 255, 0.05),
      rgba(255, 255, 255, 1)
    );
    background-size: 200% 200%;
    animation: glowBorder 4s linear infinite;
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
  }

/*     1487505 : BLANK 컨텐츠      */
.blank__1487505__ {box-sizing:border-box;display:block;position:relative;width:100%;height:130px}
.blank__1487505__.build_edit_mode {min-height:10px;border:1px dashed red;background:rgba(255,255,255,.1);}
.blank__1487505__.build_edit_mode:before {content:'Blank';display:block;position:absolute;top:50%;left:0;right:0;margin-top:-10px;padding:5px 0;font-size:13px;color:red;text-align:center;line-height:1}

@media all and (max-width:1023px){
	.blank__1487505__ {height:30px}
}

/* jb:pc-fit */
@media all and (min-width:1024px) {
  .reveal-content,
  .contentsBox,
  .titleWrap,
  .pm-myboard_album__1487515__ ul {
    width: auto !important; min-width: 0 !important; max-width: min(100%, 1280px) !important; box-sizing: border-box;
  }
  .container {
    width: auto !important; min-width: 0 !important; max-width: min(100%, 1440px) !important; box-sizing: border-box;
  }
}