@charset "utf-8"; 
/* 고교학점제 */
/*@ latest 2026.03.05 ssj */


/*common*/
.div_wrap {max-width:1600px;}
.div_wrap.border-radius > div:not(.inner_layer) {border-radius: 30px !important;}
.subCon > div,
.subCon .location,
.footer .inner  {max-width:1600px !important;}
.subCon h4.tit  {max-width:1600px !important; font-family: 'esamanru' !important; font-weight:500;}


/* main visual */
.mainvalBox {margin:0 auto;padding:0px;box-sizing:border-box;height: auto; height: 100%;}
.mainvalBox .div_wrap {height:650px;display: flex;justify-content: space-between;overflow: visible;transition: height 0.5s;}


.mainvalBox .layout_wrap .div_wrap > div:hover .horizontalMoveHandler,
.mainvalBox .layout_wrap .div_wrap > div:hover .axeboxContents {display:none !important;}

    @media (max-width:1599px){
        .div_wrap {padding:0 10px;}
    }
	@media (min-width:991px){
		.mainvalBox .div_wrap>.layout_06 {width: 62%;}
		.mainvalBox .div_wrap .inner_layer {width: 36.3%;border-radius: 30px !important;height: 100%;overflow: visible;}
		.mainvalBox .div_wrap .inner_layer .layout_02 {height: 400px;width: 100%;}
		.mainvalBox .div_wrap .swiper-container.mainSlider_001 {width:49.5%; margin-right:1%;}

	}
	@media (max-width:990px){
		.maintem_wide {width:100%; float:left;}

		.inner_layer {padding-top:15px; width:100%;}
		.div_wrap.border-radius > div:not(.inner_layer) {border-radius: 15px !important;width: 100% !important;}
	}









/* main slide */
.mainwidget_slide {width:100%; height:100%; float:left; position:relative; overflow:hidden;}
.mainwidget_slide .swiper-container {height:100%;}
.mainwidget_slide .bnr_p {width:100%; height:100%; position:absolute; top:0; left:0; box-sizing:border-box; text-align:left; line-height:normal;}
.mainwidget_slide .bnr_p .bnr_p_wrap {width:70%;display:inline-block;vertical-align:middle;box-sizing:border-box;line-height:normal;}
.mainwidget_slide .swiper-slide {width:100%;text-align:right;background:#fff;overflow: hidden;}
.mainwidget_slide .swiper-slide> a {width:100%; height:100%; float:left; position:relative;}
.mainwidget_slide .swiper-slide img {width:auto;height:auto;display:inline-block;position:absolute;right:0;bottom:0;max-height: 120%;min-width: 100%;}

.mainwidget_slide .bnr_p strong {font-family: 'esamanru';line-height:130%;font-weight:400;letter-spacing:-1px;color:#fff;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;text-align:inherit;background:#ff8a00;padding:2px 8px 2px 5px;margin-top:3px;}
.mainwidget_slide .bnr_p strong:empty {padding:0;}
.mainwidget_slide .bnr_p h4 {font-family: 'esamanru';width:100%;line-height:130%;font-weight:300;letter-spacing:-1px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;}
.mainwidget_slide .bnr_p h4 strong, .mainwidget_slide .bnr_p h4 b {font-weight:600;font-family:'Noto Sans KR';}
.mainwidget_slide .bnr_p p {font-size: 17px;color:#414141;line-height:150%;width:auto;display:inline-block;position:relative;word-break:keep-all;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;display:-webkit-box;opacity:0.9;margin-top:10px;font-family:'Noto Sans KR';}


    /*indicator*/
    .mainwidget_slide .btnbox {width: 130px;height: 50px;text-align:center;position:absolute;right: 0;bottom: 0;box-sizing:border-box;background: rgba(0,0,0,0.8);z-index: 1;border-radius: 30px 0 0 0;}
    
    .mainwidget_slide .swiper-pagination {display:none;}

    .mainwidget_slide .slide-controll {display: flex;justify-content: center;align-items: center;width: 100%;gap: 3px;}
    .mainwidget_slide .swiper-button-next,
    .mainwidget_slide .swiper-button-prev {overflow:hidden;text-indent:-9999px;width: 25px;height: 50px;position: relative;top:auto;left:auto;right: auto;margin-top: 0;pointer-events:auto !important;}
    .mainwidget_slide .swiper-button-prev {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat 8px 16px;order: 1;}
    .mainwidget_slide .swiper-button-next {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -52px 16px;order: 3;}
    .mainwidget_slide .swiper-button-next:hover,
    .mainwidget_slide .swiper-button-prev:hover {cursor:pointer; }
    .mainwidget_slide .swiper-button-next:focus,
    .mainwidget_slide .swiper-button-prev:focus {outline:thin dotted;}

    .mainwidget_slide .swiper-button-next.swiper-button-disabled, 
    .mainwidget_slide .swiper-button-prev.swiper-button-disabled {opacity:1;}

    .mainwidget_slide div.indicator {order: 2; width: 25px; height: 50px; display: flex; position: relative; z-index: 10;}
    .mainwidget_slide div.indicator button {outline:none;cursor:pointer;text-indent:-9999px;width: 25px;height: 50px;position: absolute;left: 0;top: 0;z-index: 10;}
    .mainwidget_slide div.indicator button.play {border-radius:100%;}
    .mainwidget_slide div.indicator button.play {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -34px 16px;}
    .mainwidget_slide div.indicator button.stop {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -12px 16px;}
    .mainwidget_slide div.indicator button:focus {outline:thin dotted;}

    @media (min-width:991px) and (max-width:1455px){
        .mainvalBox .div_wrap {height:500px;}
    }
    @media (max-width:990px){
        .mainvalBox .div_wrap {flex-direction:column;height: auto;}
		.mainwidget_slide {height: auto;aspect-ratio: 990 / 650;} 
		.mainwidget_slide .swiper-slide img {width:100%;}
    }
	@media (min-width:800px){
		.mainwidget_slide .bnr_p h4 {font-size:35px;margin-bottom:30px;}
		.mainwidget_slide .bnr_p strong {font-size:36px;}
		.mainwidget_slide .bnr_p .bnr_p_wrap {padding:30px 30px;}
	}

	@media (max-width:799px){
		.mainwidget_slide .bnr_p h4 {font-size:25px;}
		.mainwidget_slide .bnr_p strong {font-size:25px;}
		.mainwidget_slide .bnr_p .bnr_p_wrap {width:70%;padding:20px 20px 25px 15px;vertical-align: top;}

		.mainwidget_slide .btnbox {width: 100px;height:40px;border-radius: 15px 0 0 0;}
		.mainwidget_slide .swiper-button-next, .mainwidget_slide .swiper-button-prev, .mainwidget_slide div.indicator button {height: 40px;background-position-y: 11px !important;}
		.mainwidget_slide div.indicator {height:40px;}
	}

	@media (max-width:599px){
		.mainwidget_slide .bnr_p {line-height:300px;}
		.mainwidget_slide .bnr_p p {max-height:157px;-webkit-line-clamp: 5;font-size: 14px;}
		.mainwidget_slide .swiper-slide>a {line-height:500px;}
	}



















/* widget setting */
/* 3 blue box */
.mainRightQuick3 {display: flex;flex-direction: column;gap:30px;height: 100%;overflow: visible;}
.mainRightQuick3 .qbox {background: #4873c0;border-radius: 30px;height: calc(33.333% - 20px);display: flex;flex-grow: 1;background-image: linear-gradient(to right, #4873c0, #3760aa) !important;transition: background-image 1.5s;}
.mainRightQuick3 .qbox:hover {background-image: linear-gradient(to right, #537ecb, #4872bf) !important;}
.mainRightQuick3 .qbox a {width:100%;height: 100%;display: flex;justify-content: center;align-items: center;padding: 10px 50px;box-sizing: border-box;}
.mainRightQuick3 .qbox .circlebox {width: 145px;height: 145px;border-radius:100%;background: #fff;overflow: hidden;transition: width 0.5s, height 0.5s, margin-top 0.3s, box-shadow 0.3s;}
.mainRightQuick3 .qbox .circlebox img {width: 100%;transition: transform 0.5s;}
.mainRightQuick3 .qbox a:hover .circlebox {margin-top: -6px;box-shadow: 1px 3px 9px rgba(0,0,0,0.2);}
.mainRightQuick3 .qbox a:hover .circlebox img {transform: scale(1.05);}
.mainRightQuick3 .qbox .txtbox {position: relative; display: flex; flex-grow: 1; padding-left: 30px;}
.mainRightQuick3 .qbox .txtbox .tit {font-size:26px;font-family: 'esamanru';font-weight: 500;color: #fff;word-break: keep-all;}
.mainRightQuick3 .qbox .txtbox > div {display: flex;opacity: 0;height:70px;max-width: 100%;border-radius:2px 20px 20px 20px;box-sizing: border-box;position: absolute;background: #f1f4fa;justify-content: center;align-items: center;padding: 0 20px 0 30px;top: 60px;left: 15px;gap: 10px;transition: padding 0.5s, height 0.5s, opacity 0.5s, top 0.5s;box-shadow: 1px 2px 11px rgba(0,0,0,0.3);}
.mainRightQuick3 .qbox:hover .txtbox > div {opacity: 1;top: 50px;}
.mainRightQuick3 .qbox .txtbox > div .co {font-size:18px;color:#333;font-family: 'esamanru';font-weight: 300;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.mainRightQuick3 .qbox .txtbox > div img {max-width:40px;}

    @media (min-width:991px) and (max-width:1455px){
		.mainRightQuick3 .qbox a {padding: 10px 25px;}
		.mainRightQuick3 .qbox .circlebox {width: 100px;height: 100px;}
		.mainRightQuick3 .qbox .txtbox .tit {font-size:23px;}
		.mainRightQuick3 .qbox .txtbox > div {padding:0 15px;height: 60px;left: -20px;}
		.mainRightQuick3 .qbox .txtbox > div .co {font-size:16px;}
    }
    @media (max-width:990px){
		.mainRightQuick3 {gap:10px;}
		.mainRightQuick3 .qbox {border-radius:15px;}
		.mainRightQuick3 .qbox a {padding: 15px 25px;align-items: flex-start;}
		.mainRightQuick3 .qbox .circlebox {width: 80px;height: 80px;}
		.mainRightQuick3 .qbox .txtbox {padding-top: 10px;}
		.mainRightQuick3 .qbox .txtbox .tit {font-size: 22px;letter-spacing: 1px;}
		.mainRightQuick3 .qbox .txtbox > div {padding:0 15px;height: 45px;left: 30px;top: 45px;opacity: 1;}
		.mainRightQuick3 .qbox .txtbox > div .co {font-size: 14px;}
		.mainRightQuick3 .qbox .txtbox > div img {max-height: 27px;}
    }
    /*hover fx editormode set*/
    #editorDiv .mainRightQuick3 .qbox .txtbox > div {opacity:1 !important; top:50px;}





/*~~란 ?*/
.introBNR {background:#1a8ab9;border-radius:30px;padding:0 40px;display: flex;margin-top: 10px;}
.introBNR .icon {width: 85px;height: 118px;position: relative;margin-right: 15px;flex-shrink: 0;}
.introBNR .icon img {position: absolute; bottom: 0;}
.introBNR .titbox {padding-right:60px;padding-top: 25px;}
.introBNR .titbox .Introtit {font-size:28px;font-family: "Korail Rounded";color: #fff;font-weight: 500;white-space: nowrap;}
.introBNR .titbox .Introtit b {font-family: "Korail Rounded";position: relative;z-index: 1;}
.introBNR .titbox .Introtit b:before {content:"";background:#fdb643;opacity:0.5;width: calc(100% + 8px);height: 15px;display: inline-block;position: absolute;left: -4px;bottom: 0;z-index: -1;}
.introBNR .rightTxtbox {padding-top: 26px;padding: 26px 0 20px;display: flex;flex-direction: column;flex-grow: 1;}
.introBNR .rightTxtbox .subTit {font-size:18px;font-family: "Korail Rounded";color: #fff;line-height: 150%;word-break: keep-all;}
.introBNR .rightTxtbox .subTit b {font-family: "Korail Rounded";font-size:1.03em;font-weight: 600;word-break: keep-all;}
.introBNR .rightTxtbox .qWrap {padding-top: 8px;display: flex;gap: 10px;}
.introBNR .rightTxtbox .qWrap .quickBox {/* border:1px solid #fff; *//* border-radius: 20px; *//* overflow: hidden; */}
.introBNR .rightTxtbox .qWrap .quickBox a {padding: 2px 25px 0;display: block;position: relative;overflow: hidden;z-index: 0;border: 1px solid #fff;border-radius: 20px;transition: margin-top 0.3s, background 0.4s;}
.introBNR .rightTxtbox .qWrap .quickBox a p {font-size: 15px;font-family: "Korail Rounded";line-height: 32px;color: #fff;z-index: 1;position: relative;}
.introBNR .rightTxtbox .qWrap .quickBox a:before {/* content:""; */width: 0;height: 100%;display: block;background: #fff;position: absolute;left: 0px;top: 0px;border-radius: 30px;transition: width 0.5s;z-index: -1;}
.introBNR .rightTxtbox .qWrap .quickBox a:hover {background: #fff;margin-top: -3px;box-shadow: 1px 3px 3px rgba(255,255,255,0.3);}
.introBNR .rightTxtbox .qWrap .quickBox a:hover p {color: #1a8ab9;}
.introBNR .rightTxtbox .qWrap .quickBox a:hover:before {/* width: 100%; */}

    @media (min-width:991px) and (max-width:1455px){
		.introBNR {padding:0 30px;}
        .introBNR .icon {margin-right: 5px;}
        .introBNR .titbox {padding-right: 30px;}
		.introBNR .titbox .Introtit {font-size:24px;}
		.introBNR .rightTxtbox {padding-top: 24px;}
		.introBNR .rightTxtbox .subTit {font-size:17px;}
    }
    @media (max-width:990px){
        .introBNR {border-radius: 15px; flex-wrap: wrap; flex-direction: column; align-items: flex-start; padding: 30px 20px 30px 120px;}
        .introBNR .icon { position: absolute; margin-right: 0; left: 15px; top: 8px; }
        .introBNR .titbox {padding: 0;}
		.introBNR .titbox .Introtit {font-size: 23px;}
		.introBNR .titbox .Introtit b {font-weight:500;}
		.introBNR .rightTxtbox  {padding: 20px 0 0;}
		.introBNR .rightTxtbox .subTit {font-size: 15px;padding-bottom: 15px;}
		.introBNR .rightTxtbox .subTit b {font-weight:500;}
		.introBNR .rightTxtbox .qWrap .quickBox a {padding: 0 18px;word-break: keep-all;line-height: 120%;display: inline-block;}
		.introBNR .rightTxtbox .qWrap .quickBox a p {font-size: 14px;}
    }
	@media (max-width:500px){
		.introBNR .rightTxtbox .qWrap {flex-direction:column;gap: 5px;}
	}


/* board */
.board123.custom {height: 300px;}
.board123.custom .bSubTitle {font-family: 'esamanru';font-size:28px;letter-spacing: 3px;color: #333;position: absolute;left: 0;top: 12px;max-width: 180px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.board123.custom ul.board_wrap {padding-left: 195px;box-sizing: border-box;}
.board123.custom ul.board_wrap:before {background:#e8ecf0;width: calc(100% - 620px);left: auto;right: 50px;top: 29px;height: 2px;}
.board123.custom ul.board_wrap > li {margin: 0;min-width: auto;}
.board123.custom ul.board_wrap > li.active:after {display:none;}
.board123.custom ul.board_wrap > li h3 {padding: 0;}
.board123.custom ul.board_wrap > li h3 a.board_name {font-family: "Korail Rounded";font-size: 18px !important;color: #333 !important;height:37px;line-height: 38px;padding: 0 15px;border-radius:10px;font-weight: 500;letter-spacing: 0;background: #fff;transition: color 0.5s;}
.board123.custom ul.board_wrap > li h3 a.board_name:hover {color: #1a8ab9 !important;}
.board123.custom ul.board_wrap > li.active h3 a.board_name {background:#08255b;color: #fff !important;}
.board123.custom ul.board_wrap > li .more_box  {width: 35px; height: 35px; line-height: 32px; background: #08255b; border-radius: 100%; top: 9px; right: 0;}
.board123.custom ul.board_wrap > li .more_box a {width: 100%;height: 100%;display: block;color: #fff !important;font-size: 21px;font-weight: 200;font-family: "Korail Rounded";}
.board123.custom ul.board_wrap > li.active div ul {display: grid;gap: 30px;grid-template-columns: repeat(5, 1fr);}
.board123.custom ul.board_wrap ul li {background:#f5f5f5;border-radius:30px;padding:25px 20px;margin-right: 0;border: none;min-height: 230px;width: auto;transition: margin-top 0.3s;}
.board123.custom ul.board_wrap ul li p.tit {font-family: "Korail Rounded";font-size: 20px;margin-bottom:25px;color: #4c4c4c;font-weight: 500;word-break: keep-all;height: auto;}
.board123.custom ul.board_wrap ul li span.co {font-family: "Korail Rounded";font-size: 14px;color: #5b5b5b;-webkit-line-clamp: 3;letter-spacing: 0;font-weight: 500;line-height: 130%;}
.board123.custom ul.board_wrap ul li span.date {font-family: "Korail Rounded";font-size:15px;line-height: normal;color: #333;opacity: 0.6;margin: 0;}
.board123.custom ul.board_wrap ul li:hover {box-shadow: 0px 3px 7px rgba(0,0,0,0.1);margin-top: -5px;}

    @media (min-width:991px) and (max-width:1455px){
        .board123.custom ul.board_wrap ul {grid-template-columns: repeat(4, 1fr) !important;}
		.board123.custom ul.board_wrap ul li {}
        .board123.custom ul.board_wrap ul li:nth-child(5) {display: none !important;}
    }
    @media (min-width:800px) and (max-width:990px){
		.board123.custom {height: 310px;}
        .board123.custom ul.board_wrap ul {grid-template-columns: repeat(2, 1fr) !important;gap: 15px !important;}
		.board123.custom ul.board_wrap ul li {min-height: 110px; padding: 15px 15px; border-radius: 15px;}
		.board123.custom ul.board_wrap ul li p.tit {font-size: 18px; -webkit-line-clamp: 1; margin-bottom: 10px;}
		.board123.custom ul.board_wrap ul li span.co {-webkit-line-clamp: 1; margin-bottom: 10px;}
    }
    @media (max-width:799px){
		.board123.custom {padding:0;}
		.board123.custom .bSubTitle {position:relative;width: 100%;display: block;max-width: 100%;margin-bottom: 20px;font-size: 24px;}
		.board123.custom ul.board_wrap {padding-left:0;}
        .board123.custom ul.board_wrap ul {grid-template-columns: repeat(1, 1fr) !important;gap: 10px !important;}
		.board123.custom ul.board_wrap ul li {min-height: 110px;padding: 15px 15px;border-radius: 15px;margin-bottom: 0;}
		.board123.custom ul.board_wrap ul li p.tit {font-size: 16px;-webkit-line-clamp: 1;margin-bottom: 10px;font-weight: 500;color: #333;}
		.board123.custom ul.board_wrap ul li span.co {-webkit-line-clamp: 1; margin-bottom: 10px;}
		.board123.custom ul.board_wrap ul li span.date {text-align:right;}

		.board123 ul.board_wrap > li.active h3:after {display:none;}
		.board123.custom ul.board_wrap > li h3 { max-width: 33%; text-align: left;}
		.board123.custom ul.board_wrap > li h3 a.board_name {width: auto;font-size: 17px !important;line-height: 36px !important;padding: 0 10px;height: 33px;line-height: 33px !important;}
		.board123 ul.board_wrap > li.active h3 a.board_name {font-size: 16px !important;}
		.board123 ul.board_wrap > li:first-child h3 {width: 100px;}
		.board123 ul.board_wrap > li:nth-child(2) h3 {left: 90px !important;}
		.board123 ul.board_wrap > li:nth-child(3) h3 {left: 200px !important;}

    }



/* bnr slide */
.logo_slide004.custom .titletbox {width: 19%;}
.logo_slide004.custom .titletbox .txtbox .tit {font-family: 'esamanru';font-size:28px;letter-spacing: 3px;color: #333;font-weight: 500;}
.logo_slide004.custom .btnbox {display: flex;/* gap: 7px; */width: 110px;border: none;background: transparent;}
.logo_slide004.custom .swiper-button-prev,
.logo_slide004.custom .swiper-button-next,
.logo_slide004.custom div.banner-indicator button {width:30px;height:30px;border-radius:100%;background: #ec7676 !important;position: relative;}
.logo_slide004.custom .swiper-button-prev:before,
.logo_slide004.custom .swiper-button-next:before,
.logo_slide004.custom div.banner-indicator button:before {content:"";width: 15px;height: 20px;display: inline-block;position: absolute;left: 8px;top: 5px;background-size: 58px !important;}
.logo_slide004.custom .swiper-button-prev:before {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat 2px 3px;}
.logo_slide004.custom .swiper-button-next:before {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -45px 3px;}
.logo_slide004.custom div.banner-indicator {border: none;margin: 0 5px;}
.logo_slide004.custom div.banner-indicator button.play:before {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -32px 3px;}
.logo_slide004.custom div.banner-indicator button.stop:before {background: url(/sample/template/compound/compound020/img/indicator.png) no-repeat -14px 3px;}
.logo_slide004.custom .slidebox {width: 80%;}
.logo_slide004.custom .swiper-container .swiper-wrapper .swiper-slide > a {font-size:17px;color:#4d4d4d;font-family: 'esamanru';font-weight: 100 !important;padding: 0 20px;letter-spacing: 0;}




/* etc */
.footer-area-001 .addressArea .p_wrap > p {font-size: 15px;color: #333;line-height: 160%;font-family: 'Noto Sans KR';}
.map-selector-wrap.mxwd1300 {max-width:1600px !important;}









/* 페이지 로딩시 애니메이션 */
@keyframes slideLeft {
		from {opacity: 0; transform: translateX(-150px);}
		to   {opacity: 1; transform: translateX(0);}
	}

	@keyframes slideRight {
		from {opacity: 0; transform: translateX(150px);}
		to   {opacity: 1; transform: translateX(0);}
	}

.transform_wrap .layout_06 {opacity: 0; animation: slideLeft 1s ease forwards;}
.transform_wrap .layout_02 {opacity: 0; animation: slideRight 1s ease forwards; animation-delay:0.2s;}