@charset "utf-8";
/* 공통 */
.subtit { font-size: 32px; font-weight: 700; letter-spacing: -.03em; line-height: 1.3em; margin-bottom: 15px; color: #242424; }
.subtxt { font-size: 16px; font-weight: 400; line-height: 1.556em; letter-spacing: -.02em; color: #454545; }
.subtxt span { color: #3163d1; font-weight: 600;}

/* 미디어를 통한 학교소개 */
.sub1-video-fx { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; flex-wrap: wrap; gap: 10px; justify-content: center;}
.sub1-video-left h2 { font-size: 24px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2em; margin-bottom: 10px; color: #242424;}
.sub1-video-fx a { display: flex; width: 210px; height: 46px; border-radius: 8px; align-items: center; padding-left: 20px; border: 1px solid #ddd; line-height: 1em; font-size: 16px; font-weight: 300; letter-spacing: .01em; color: #454545; position: relative; margin-top: 15px;}
.sub1-video-fx a::after { content: ""; position: absolute; right: 20px; top: 0; bottom: 0; width: 5px; height: 10px; background: url(../images/sub/sub1-4-right.png) center no-repeat; background-size: contain; transition: .2s; margin: auto;}
.sub1-video-fx a:hover { background: #f00; border: 1px solid #ff0000; color: #fff; }
.sub1-video-fx a:hover::after { background: url(../images/sub/sub1-4-right-w.png) center no-repeat; background-size: contain; width: 7px; height: 11px;}

/* 인사말 */
.gt-img { height: 400px; background: url(../images/sub/sub1-1-img.jpg) center no-repeat; background-size: cover; color: #fff; padding: 140px 10px;text-align: center;}
.gt-img h2 { font-size: 32px; font-weight: 700; line-height: 1.2em; letter-spacing: -.02em; margin-bottom: 28px;}
.gt-img p { font-weight: 300; }
.gt-fx { display: flex; align-items: flex-start; margin-top: 120px; }
.gt-left { width: 33.3333%; border-radius: 24px; overflow: hidden; }
.gt-right { width: 66.6667%; padding-left: 40px;}
.gt-right h3 { font-size: 32px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2em; color: #002063; margin-bottom: 25px; }
.gt-right h4 { font-size: 18px; line-height: 1.5em; letter-spacing: -.02em; font-weight: 600; color: #454545;}
.gt-right p { line-height: 1.556em; color: #454545; font-weight: 300; margin-top: 25px;}
.gt-right strong { margin-top: 75px; line-height: 1.3em; font-size: 16px; font-weight: 600; color: #242424; letter-spacing: -.02em; text-align: right; display: block;}

/* 교육목표 */
.pp-sec1 { padding-bottom: 120px; }
.pp-sec1-titbox { padding: 18px 0 15px; border-radius: 24px; text-align: center; background: #f9f9f9;}
.pp-sec1-subtit { line-height: 1em; font-size: 16px; font-weight: 500; color: #3163d1; margin-bottom: 10px; text-align: center;}
.pp-sec1-tit { font-size: 32px; letter-spacing: -.03em; line-height: 1.2em; color: #242424; font-weight: 500; }
.pp-down { text-align: center; margin: 40px 0;}
.pp-sec1-box { display: flex; background: #fff; border: 2px solid #3163d1; border-radius: 172px; padding: 70px 0; box-shadow: 0 0 32px rgba(0,0,0,0.1);}
.pp-sec1-box>div { width: calc(100%/2); padding-left: 80px; display: flex; align-items: center;}
.pp-sec1-box>div .circle { width: 200px; height: 200px; display: flex; align-items: center; justify-content: center; border-radius: 100%; background: #3163d1; margin-right: 40px; }
.pp-sec1-box>div .info { flex: 1 1 auto; min-width: 0; width: 1%; }
.pp-sec1-box>div .info .pp-sec1-subtit { text-align: left; }
.pp-sec1-box>div .info .pp-sec1-tit { font-weight: 700; margin-bottom: 30px; }
.pp-sec1-box>div .info p { letter-spacing: -.02em; line-height: 1.556em; color: #454545; }
.pp-sec1-left { border-right: 1px solid #ddd;}
.pp-sec1-right .circle { background: #002063 !important;}
.pp-sec1-right .info .pp-sec1-subtit { color: #002063;}
.pp-sec2 { height: 480px; background: url(../images/sub/sub1-2-bg.jpg) center no-repeat; background-size: cover; text-align: center; padding-top: 120px;}
.pp-sec2 .pp-sec1-subtit { color: #fff; }
.pp-sec2 .pp-sec1-tit { color: #fff; margin-bottom: 30px; }
.pp-sec2 p { color: #fff; }
.pp-sec3 { background: #eff3fb;}
.pp-sec3-box { position: relative; top: -160px;}
.pp-sec3-big { width: 320px; height: 320px; margin: auto; border-radius: 100%; background: #fff; display: flex; align-items: center; justify-content: center;}
.pp-sec3-big .inner { width: 280px; height: 280px; display: flex; align-items: center; justify-content: center; text-align: center; border-radius: 100%; border: 2px solid #3163d1; font-size: 32px; font-weight: 700; letter-spacing: -.03em; line-height: 1em; color: #002063;}
.pp-sec3-list { display: flex; }
.pp-sec3-list li { width: calc(100% / 4 + 20px); height: 315px; padding-top: 70px; text-align: center; border-radius: 100%; background: rgba(49, 99, 209,0.8); color: #fff; margin-left: -20px;}
.pp-sec3-list li:first-child { margin-left: 0;}
.pp-sec3-list li:nth-of-type(even) { background: rgba(2, 26, 78,0.8);}
.pp-sec3-list li .tit { font-size: 24px; font-weight: 500; letter-spacing: -.03em; line-height: 1.3em; margin-bottom: 25px;}
.pp-sec3-list li .tit span { display: block; font-size: 20px; font-weight: 300; letter-spacing: -.03em; }
.pp-sec3-list li .txt { line-height: 1.556em; font-size: 16px; font-weight: 300; letter-spacing: -.02em; }

/* 연혁 */
.hst-img { height: 300px; border-radius: 24px; background: url(../images/sub/hst-bg.jpg) center no-repeat; background-size: cover; margin-bottom: 60px; }
.hst-fx { display: flex; align-items: flex-start;}
.hst-left { width: 22%; }
.hst-left .pp-sec1-subtit { text-align: left; margin-bottom: 15px;}
.hst-right { width: 78%; padding-top: 30px; border-top: 2px solid #002063; position: relative;}
.hst-right::before { content: ""; position: absolute; left: 8px; top: 38px; width: 1px; height: 92%; background: #ddd;}  
.hst-right .group { margin-bottom: 75px; display: flex; }
.hst-right .group .year { width: 170px; position: relative; padding-left: 55px; line-height: 1em; font-size: 32px; font-weight: 700; letter-spacing: -.03em; color: #242424; }
.hst-right .group .year::before { content: ""; position: absolute; width: 16px; height: 16px; background: url(../images/sub/hst-bf.png) center no-repeat; background-size: contain; left: 1px; top: 7px; }
.hst-right .group:last-child { margin-bottom: 0; }
.hst-right .group .info { flex: 1 1 auto; min-width: 0; width: 1%; padding-top: 5px;}
.hst-right .group .info p { position: relative; font-size: 16px; line-height: 1.666em; letter-spacing: -.03em; font-weight: 300; color: #454545; padding-left: 8px; margin-bottom: 3px;}
.hst-right .group .info p:last-child { margin-bottom: 0;}
.hst-right .group .info p::before { content: ""; position: absolute; left: 0; width: 3px; height: 3px; border-radius: 100%; background: #454545; top: 10px;}

/* 교육과정의 특징 */
.ch-list { display: flex; flex-wrap: wrap; gap: 40px; margin: 50px 0 35px;}
.ch-list li { width: calc(100%/4 - 30px); text-align: center; border-radius: 24px; background: #fff; box-shadow: 0 0 32px rgba(0,0,0,0.1); padding: 40px 5px;}
.ch-list li .circle { background: #eff3fb; width: 120px; height: 120px; border-radius: 100%; display: flex; align-items: center; justify-content: center; margin: auto;}
.ch-list li .tit { font-size: 24px; font-weight: 700; letter-spacing: -.03em; line-height: 1em; color: #242424; margin: 35px 0 15px;}
.ch-bg { padding-bottom: 105px; margin-bottom: 120px; background: url(../images/sub/tri-bg.png) center no-repeat;  background-size: cover;}
.ch-txtbox { text-align: center; margin-top: 100px;}
.ch-txtbox .subtit { display: flex; justify-content: center; gap: 20px; align-items: center;}
.ch-txtbox .subtit span { font-size: 80px; font-weight: 700; color: #3163d1; font-family:'Noto Sans KR'; position: relative; top: 13px;}
.ch-txtbox .subtit span:last-child { position: relative; display: inline-block; }
.ch-fx { display: flex; align-items: flex-start; margin-bottom: 60px;}
.ch-fx.mg { margin-bottom: 120px;}
.ch-left { width: 48%; border-radius: 24px; overflow: hidden;}
.ch-right { width: 52%; padding-left: 40px; }
.ch-right h3 { display: inline-flex; width: 140px; height: 46px; display: flex; border-radius: 23px; align-items: center; justify-content: center; color: #fff; line-height: 1em; background: #3163d1; font-size: 16px; font-weight: 500; letter-spacing: -.03em; margin-bottom: 40px; }
.ch-right .info p { color: #242424; margin-bottom: 28px; }
.ch-right .info p:last-child { margin-bottom: 0; }
.ch-fx.rv { flex-direction: row-reverse; }
.ch-fx.rv .ch-right { padding-left: 0; padding-right: 40px; }
.ch-fx.rv .ch-right h3 { background: #002063;}
.ch-sec2 { padding: 120px 0 200px; background: url(../images/sub/sub2-1-bg.jpg) center no-repeat; background-size: cover; text-align: center;}
.ch-sec2 .pp-sec1-subtit { text-align: center; color: #fff; }
.ch-sec2 .pp-sec1-tit { font-weight: 700; color: #fff; margin-bottom: 30px;}
.ch-sec2 p { color: #fff; margin-bottom: 50px;}
.ch-sec2-list { display: flex; justify-content: center; margin-bottom: 55px; }
.ch-sec2-list li { width: 320px; height: 320px; border-radius: 100%; color: #fff; padding-top: 55px; background: rgba(49, 99, 209,0.8); margin-left: -20px; text-align: center;}
.ch-sec2-list li:first-child { margin-left: 0; }
.ch-sec2-list li:nth-of-type(even) { background: rgba(2, 26, 78,0.8); }
.ch-sec2-list li .tit { font-size: 24px; font-weight: 700; letter-spacing: -.03em; line-height: 1em; margin: 20px 0 15px;}
.ch-sec2-list2 { display: flex; gap: 108px; }
.ch-sec2-list2 li { width: calc(100%/4 - 81px); text-align: center; border: 1px solid #fff; border-radius: 24px; padding: 50px 10px 30px; color: #fff; position: relative;}
.ch-sec2-list2 li::after { content: ""; top: 0; bottom: 0; margin: auto; width: 25px; height: 25px; background: url(../images/sub/sub2-1-plus.png) center no-repeat; background-size: contain; right: -67px; position: absolute;}
.ch-sec2-list2 li:last-child::after { display: none; }
.ch-sec2-list2 li .num { line-height: 1em; font-size: 32px; font-weight: 700; letter-spacing: -.03em; margin-bottom: 30px; }

/* 교육과정의 편재 */
.ub-box { text-align: center; border: 1px solid #ddd; border-radius: 24px; padding: 25px 5px; color: #242424; margin-bottom: 60px;}
.ub-fx { display: flex; gap: 40px;}
.ub-left { width: calc(60% - 20px);}
.ub-right { width: calc(40% - 20px);}
.ub-tbl { width: 100%; border-collapse: collapse; border: 1px solid #ddd; }
.ub-tbl tr { border-bottom: 1px solid #ddd;}
.ub-tbl tr th { background: #002063; border-right: 1px solid #ddd; font-size: 16px; line-height: 1em; letter-spacing: -.02em; color: #fff; font-weight: 400; padding: 20px 5px; }
.ub-tbl tr th:last-child {border-right: none;}
.ub-tbl tr td { border-right: 1px solid #ddd; font-size: 16px; line-height: 1.4em; letter-spacing: -.02em; color: #242424; font-weight: 400; padding: 16px 5px; text-align: center;}
.ub-tbl tr td:last-child {border-right: none;}
.ub-tbl tr td.bg { background: #f9f9f9;}
.ub-tbl.ub-pd tr td { padding: 11px 5px 10.5px;}

/* 특색, 학부모교육프로그램 */
.pg-sec1 { display: flex; align-items: center; background: #eff3fb; margin-bottom: 120px;}
.pg-left { width: 50%; }
.pg-left img { border-radius: 0 240px 240px 0;}
.pg-right { width: 50%; padding-left: 85px; }
.pg-right h4 { font-size: 18px; line-height: 1.5em; letter-spacing: -.02em; font-weight: 600; color: #454545;}
.pg-right h2 { line-height: 1em; font-size: 48px; font-weight: 700; letter-spacing: -.02em; color: #002063; margin: 15px 0 30px;}
.pg-list { display: flex; gap: 55px 40px; flex-wrap: wrap; margin-top: 55px;}
.pg-list li { width: calc(100%/2 - 20px); }
.pg-list li .imgbox { margin-bottom: 35px; border-radius: 24px; overflow: hidden;}
.pg-list li .txtbox {display: flex; align-items: flex-start;}
.pg-list li .txtbox .num { font-size: 60px; line-height: 1em; font-weight: 700; letter-spacing: -.03em; color: #d6e0f6; width: 110px;}
.pg-list li .txtbox .info {flex: 1 1 auto; min-width: 0; width: 1%; }
.pg-list li .txtbox .info .tit { line-height: 1.3em; font-size: 24px; font-weight: 600; letter-spacing: -.03em; color: #002063; margin-bottom: 12px;}
.pg-list li .txtbox .info .txt { color: #242424; }

/* 입학전형안내 */
.ad-mg { margin-bottom: 120px;}
.ad-list { display: flex; gap: 39px; flex-wrap: wrap; position: relative; }
.ad-list::after { content: ""; position: absolute; left: 0; width: 100%; height: 1px; background: #ddd; top: 0; bottom: 0; margin: auto; z-index: -1; }
.ad-list li { width: calc(100%/3 - 26px); text-align: center; border-radius: 24px; background: #fff; box-shadow: 0 0 32px rgba(0,0,0,0.1); padding: 60px 5px 50px; position: relative; }
.ad-list li .step { display: flex; width: 120px; height: 46px; border-radius: 8px; background: #eff3fb; text-align: center; justify-content: center; align-items: center; position: absolute; left: 0; right: 0; margin: auto; top: -23px; color: #3163d1; line-height: 1em; letter-spacing: -.03em; font-size: 20px; font-weight: 600; }
.ad-list li .step.bg { background: #3163d1; color: #fff; }
.ad-list li .circle { background: #eff3fb; width: 120px; height: 120px; border-radius: 100%; display: flex; align-items: center; justify-content: center; margin: auto;}
.ad-list li .tit { font-size: 24px; font-weight: 700; letter-spacing: -.03em; line-height: 1em; color: #242424; margin: 32px 0 15px;}
.ad-list li .txt { margin-top: 15px;}
/* .ad-list li:last-child { border: 2px solid #3163d1;} */
.ad-box { border: 1px solid #ddd; border-radius: 24px; padding: 85px 60px; position: relative; }
.ad-box h2 { width: 120px; height: 46px; position: absolute; left: 60px; top: -23px; display: flex; background: #002063; border-radius: 8px; align-items: center; justify-content: center; color: #fff; line-height: 1em; font-size: 20px; font-weight: 600; letter-spacing: -.03em; }
.ad-box .group { border: 1px solid #ddd; border-radius: 24px; margin-bottom: 40px; overflow: hidden;}
.ad-box .group.tc { text-align: center; }
.ad-box .group:last-child { margin-bottom: 0; }
.ad-box .group .stepbox { height: 40px; background: #83a1e3; border-radius: 20px; color: #fff; display: flex; align-items: center ; justify-content: center; line-height: 1.2em; font-size: 18px; font-weight: 500; letter-spacing: -.03em; position: relative; } 
.ad-box .group .stepbox .num { position: absolute; left: 0; top: 0; width: 120px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #83a1e3; background: #eff3fb; color: #3163d1; line-height: 1em; font-size: 18px; border-radius: 20px; font-weight: 600; letter-spacing: -.03em; }
.ad-box .group .stepbox.clr { background: #002063;}
.ad-box .group .stepbox.clr .num { background: #3163d1; color: #fff; border: none;}
.ad-box .group h3 { line-height: 1.4em; font-size: 18px; font-weight: 700; letter-spacing: -.03em; color: #242424; padding: 40px 0 35px; }
.ad-box .group .fx { display: flex; padding-bottom: 80px; padding-top: 17px; }
.ad-box .group .fx>div { width: calc(100%/2); }
.ad-tit { font-size: 16px; font-weight: 700; letter-spacing: -.02em; color: #242424; margin-bottom: 8px; }
.ad-box .group .fx>div.right { border-left: 1px solid #ddd;}
.ad-box .group .fx>div.right p a { display: inline-block; font-size: 12px; font-weight: 400; letter-spacing: -.03em; line-height: 1em; color: #454545; padding: 6px 10px; background: #f6f6f6; margin-left: 5px; position: relative; top: -3px;}
.ad-box .group .fx2 { display: flex; margin-top: -40px; align-items: center;}
.ad-box .group .fx2>div { width: calc(100%/2); }
.ad-box .group .fx2>div.left { padding-left: 40px; padding-top: 30px; }
.ad-box .group .box { margin-bottom: 25px; }
.ad-box .group .box:last-child { margin-bottom: 0; }
.ad-box .group-pd { padding: 40px 0;}

/* 후원안내 */
.sp-img { padding: 120px 10px; border-radius: 24px; color: #fff; text-align: center; background: url(../images/sub/sub5-img.jpg) center no-repeat; background-size: cover; margin-bottom: 120px;}
.sp-img .subtit { line-height: 1.6em; color: #fff;}
.sp-img p { margin-top: 25px;}