/* 서브 상단 안내문구 (공통) */
.subDetail { position: relative; padding: 1.9rem 19.5rem 1.9rem 2.25rem; color: #000; border-radius: 1rem 1rem 5rem 1rem; overflow: hidden; min-height: 11rem; }
.subDetail span { font-size: 1.3rem; font-weight: bold; }
.subDetail p { font-weight: 500; font-size: 0.85rem; margin-top: 1.25rem; }
/* 학교별교육과정 하단 문구 250916 */
.subDetail p.txt { font-weight: 500; font-size: 0.85rem; margin-top: 0.25rem; }
.subDetail > img { position: absolute; right: 1.25rem; bottom: -9.7rem; }
/* 고교학점제 안내 문구 */
.subDetail2 { position: relative; padding: 1.9rem 20rem 1.9rem 2.25rem; color: #000; border-radius: 1rem 1rem 5rem 1rem; overflow: hidden; min-height: 11rem; }
.subDetail2 span { font-size: 1.3rem; font-weight: bold; }
.subDetail2 p { font-weight: 500; font-size: 0.85rem; margin-top: 1.25rem; }
.subDetail2 p.txt { font-weight: 500; font-size: 0.85rem; margin-top: 0.25rem; }
.subDetail2 > img { position: absolute; right: -0.75rem; bottom: -2rem; }

.subContent p { font-size: 0.85rem; }

/* 서브 타이틀 */
h3.subTitle { display: flex; align-items: center; justify-content: center; color: #000000; font-size: 2rem; gap: 0.25rem; font-weight: 300; flex-wrap: wrap; margin: 0.5rem 0 3rem; }
h3.subTitle span {font-weight: bold; }
h3.subTitle img {font-size: 0; line-height: 0; }

/* 수강신청 바로가기 버튼 */
.btnBox { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem 0.7rem; margin: 4.5rem 0 0; padding-top: 2.2rem; position: relative; }
.btnBox::before { position: absolute; content: ""; width: 100%; height: 1px; background: url('/images/dgedu/web/hakjeom/sub/btnLine.png')no-repeat; top: 0; left: 0; }
.btnBox.ac { justify-content: center; }
/* 대구공동교육과정, 꿈창작캠퍼스 안내페이지 바로가기 버튼 */
.btnBox2 { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem 0.7rem; margin: -4.5rem 0 0; padding-top: 2.2rem; position: relative; }
.btnBox2.ar { justify-content: right;}
.regiBtn { display: inline-flex; align-items: center; justify-content: space-between; border-radius: 0.75rem; background: linear-gradient(to right, #3993f6 0%, #2080e9 100%); padding: 0 1.25rem; height: 3rem; font-size: 0.9rem; font-weight: 600; color: #fff; box-shadow: 0px 4px 6px rgba(0,0,0,0.15); }
.regiBtn > span { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; margin-left: 3rem; background: #fff; width: 1.5rem; height: 1.5rem; padding-left: 0.1rem; transition: 0.2s; position: relative; }
.regiBtn:hover > span,
.regiBtn:focus > span { transform: translateX(5px); }


/* 0101_고교학점제란 */
.sub0101 [class^='section'] .tit2 { margin-top: 4rem !important; }
.sub0101 .subDetail { background: #E4EEFF; }
.sub0101 .goLst { display: flex; flex-wrap: wrap; gap: 2.5rem 2.75rem; }
.sub0101 .goLst > li { width: calc((100% - 5.5rem) / 3); margin-top: 2.25rem; background: #EBF2FF; border-radius: 1rem; position: relative; padding: 3.7rem 1.25rem 1.1rem; }
.sub0101 .goLst > li > span { position: absolute; top: 0; left: 50%; transform: translateX(-50%); color: #fff; font-size: 0.9rem; font-weight: bold; background: #005DAE; width: 5rem; height: 2.2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 0 0 0.75rem 0.75rem; }
.sub0101 .imgBox img { max-width: none; }
.sub0101 .goLst > li > ul { display: flex; flex-direction: column; gap: 1.4rem; }
.sub0101 .goLst > li > ul > li { position: relative; background: #fff; font-size: 0.85rem; font-weight: 600; color: #000; border-radius: 0.75rem; padding: 0.9rem 0.5rem; text-align: center; }
.sub0101 .goLst > li.last > ul > li { padding: 2.2rem 0.5rem; }
.sub0101 .goLst > li > ul > li::before { position: absolute; content: ""; width: 0.7rem; height: 0.9rem; left: 50%; transform: translateX(-50%); bottom: -1.15rem; background: url('/images/dgedu/web/hakjeom/sub/sub0101_Arrow02.png')no-repeat; background-size: contain; }
.sub0101 .goLst > li > ul > li.dArrow::before { background: url('/images/dgedu/web/hakjeom/sub/sub0101_Arrow.png')no-repeat center center; }
.sub0101 .goLst > li > ul > li:last-child::before { display: none !important; }
.sub0101 .goLst2 { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2.5rem 0; }
.sub0101 .goLst2 > li.first { width: 16rem; }
.sub0101 .goLst2 > li.second { width: calc(100% - 18.7rem); }
.sub0101 .goLst2 > li.third { width: 100%; }
.sub0101 .goLst2 > li { position: relative; border: 1px solid #C2C7D0; border-radius: 1rem; padding: 3.7rem 1.25rem 1rem; }
.sub0101 .goLst2 > li > span.num { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background: #1C95F5; border-radius: 0 0 0.75rem 0.75rem; width: 2.5rem; height: 2.2rem; font-size: 0.9rem; font-weight: bold; display: inline-flex; align-items: center; justify-content: center; }
.sub0101 .goLst2 > li > p.txt { text-align: center; color: #000000; font-size: 1rem; font-weight: 600; } 
.sub0101 .goLst2 > li.first > ul { margin-top: 1.5rem; display: flex; flex-direction: column; gap: 0.25rem; position: relative; }
.sub0101 .goLst2 > li.first > ul::before { position: absolute; content: ""; left: 50%; transform: translateX(-50%); top: calc(100% - 0.25rem); height: 0.85rem; width: 1.1rem; background: url('/images/dgedu/web/hakjeom/sub/lstBefore.png')no-repeat center center; background-size: contain; }
.sub0101 .goLst2 > li.first > ul > li { position: relative; border-radius: 5rem; border: 1px solid #D4D7DE; padding: 0.35rem 0.5rem; display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 0.75rem; background: #fff; color: #000; }
.sub0101 .goLst2 > li.first > ul > li::before { position: absolute; content: ""; width: 1px; height: 1rem; background: #dcdfe0; top: 50%; transform: translate(-50%,-50%); left: 50%; }
.sub0101 .goLst2 > li.first > ul > li:nth-child(1),
.sub0101 .goLst2 > li.second> ul > li > span { color: #fff; border-radius: 5rem; background: #1C95F5; font-weight: 600; font-size: 0.85rem; text-align: center; border: none; justify-content: center; }
.sub0101 .goLst2 > li.first > ul > li:nth-child(1)::before { display: none; }
.sub0101 .goLst2 > li > .box { margin-top: 1rem; border: 1px solid #1C95F5; border-radius: 0.5rem; text-align: center; padding: 0.75rem 0.5rem; font-size: 0.75rem; color: #000; }
.sub0101 .goLst2 > li > .box p.top { position: relative; font-size: 0.75rem; }
.sub0101 .goLst2 > li > .box p.top::before { position: absolute; content: "*"; top: -0.35rem; right: -0.15rem; font-size: 0.7rem; color: #000; }
.sub0101 .goLst2 > li > .box p.bot { font-size: 0.65rem; color: #333; margin-top: 0.35rem; }
.sub0101 .goLst2 > li.second> ul { display: flex; gap: 1.3rem; flex-wrap: wrap; margin-top: 1.5rem; }
.sub0101 .goLst2 > li.second> ul > li { position: relative; width: calc((100% - 1.3rem) / 2); }
.sub0101 .goLst2 > li.second> ul > li > span { padding: 0.35rem 0.5rem; width: 100%; display: inline-flex; align-items: center; justify-content: center; }
.sub0101 .goLst2 > li.second> ul > li > p { margin-top: 0.25rem; border: 1px solid #d4d7de; border-radius: 0.6rem; position: relative; display: flex; align-items: center; justify-content: center; min-height: 4.25rem; color: #000; font-size: 0.8rem; font-weight: 600; text-align: center; background: #fff; }
.sub0101 .goLst2 > li.second> ul > li > p::before { position: absolute; content: ""; width: 1px; height: 2.65rem; background: #dcdff0; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.sub0101 .goLst2 > li.second> ul > li > p::after { position: absolute; content: ""; left: 50%; transform: translateX(-50%); top: calc(100% - 0.25rem); height: 0.85rem; width: 1.1rem; background: url('/images/dgedu/web/hakjeom/sub/lstBefore.png')no-repeat center center; background-size: contain; z-index: -1; }
.sub0101 .goLst2 > li.second> ul > li > p.noLine::before { display: none; }
.sub0101 .goLst2 > li.second> ul > li > p span { width: 100%; display: inline-flex; align-items: center; justify-content: center; }
.sub0101 .goLst2 > li.second> ul > li > .box { margin-top: 1rem; border: 1px solid #1C95F5; border-radius: 0.5rem; text-align: center; padding: 0.75rem 0.5rem; font-size: 0.75rem; color: #000; }
.sub0101 .goLst2 > li.second> ul > li > .box > span { border-radius: 3rem; display: inline-flex; align-items: center; justify-content: center; background: #f3f3f3; color: #000; width: 4rem; height: 1.1rem; font-size: 0.65rem; font-weight: 600; }
.sub0101 .goLst2 > li.second> ul > li > .box > p { margin-top: 0.25rem; font-size: 0.75rem; }

.sub0101 .goLst3 { display: flex; flex-wrap: wrap; margin-top: 2.25rem; gap: 1.75rem; }
.sub0101 .goLst3 > li { position: relative; padding: 3.7rem 1.5rem 2rem; border: 1px solid #C2C7D0; border-radius: 1rem; width: 100%; }
.sub0101 .goLst3 > li > span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; padding: 0.5rem 1.25rem; font-weight: bold; font-size: 0.9rem; }
.sub0101 .goLst3 > li > p { text-align: center; color: #000000; font-size: 1rem; font-weight: 600; }
.sub0101 .goLst3 > li > .box { position: relative; margin-top: 1.5rem; background: #F6F6F6; display: flex; flex-wrap: wrap; gap: 2rem; padding: 1rem 1rem 3.05rem; border-radius: 0.75rem; }
.sub0101 .goLst3 > li > .box > div { position: relative; flex: 1; }
.sub0101 .goLst3 > li > .box > p { position: absolute; left: 50%; transform: translateX(-50%); bottom: 1rem; color: #000000; font-size: 0.75rem; font-weight: 600; }
.sub0101 .goLst3 > li > .box > p::before { position: absolute; content: ""; width: 100%; height: 1px; left: 0; bottom: 0; background: #000000; }
.sub0101 .goLst3 > li > .box::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/plusIco.png')no-repeat center center; background-size: contain; width: 1rem; height: 1rem; top: 3rem; left: 50%; transform: translateX(-50%); }
.sub0101 .goLst3 > li > .box > div > p { padding: 1.15rem 0.5rem; text-align: center; font-weight: 600; }
.sub0101 .goLst3 > li > .box > div > p > span { display: block; font-weight: bold; }
.sub0101 .goLst3 > li > .box > div.rgt > p > span { color: #1C95F5; }
.sub0101 .goLst3 > li > .box .lft { background: #FFFAD0; border: 1px solid #e5d86b; border-radius: 0.75rem; }
.sub0101 .goLst3 > li > .box .rgt { background: #E8F5FF; border: 1px solid #8AC6F4; border-radius: 0.75rem; }
.sub0101 .goLst3 > li > .box > div::after { position: absolute; content: ""; left: 50%; transform: translateX(-50%); top: calc(100% + 3rem); height: 0.85rem; width: 1.1rem; background: url('/images/dgedu/web/hakjeom/sub/lstBefore02.png')no-repeat center center; background-size: contain; z-index: -1; }
.sub0101 .goLst3 > li > .box2 { margin-top: 1.5rem; display: flex; flex-wrap: wrap; border: 1px solid #C2C7D0; border-radius: 0.75rem; position: relative; }
.sub0101 .goLst3 > li > .box2::before { position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1px; height: 100%; background: #C2C7D0; }
.sub0101 .goLst3 > li > .box2 > div { flex: 1; padding: 0.75rem; }
.sub0101 .goLst3 > li > .box2 > div > span { border-radius: 3rem; display: inline-flex; align-items: center; justify-content: center; height: 2rem; width: 100%; font-size: 0.8rem; font-weight: bold; color: #333; background: #FFFAD0; }
.sub0101 .goLst3 > li > .box2 > div.rgt > span { color: #1C95F5; background: #E8F5FF; }
.sub0101 .goLst3 > li > .box2 > div > p { margin-top: 0.75rem; font-size: 0.85rem; color: #333; text-align: center; }

.sub0101 .lst4Box { display: flex; flex-wrap: wrap; margin-top: 2.25rem; border: 1px solid #C2C7D0; border-radius: 1rem; padding: 4.2rem 1.5rem 2.1rem; position: relative; }
.sub0101 .lst4Box > span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; padding: 0.5rem 1.25rem; font-size: 0.9rem; font-weight: bold; text-align: center; }

.sub0101 .goLst4 { display: flex; flex-wrap: wrap; gap: 2.45rem; position: relative; }
.sub0101 .goLst4::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/arrowRight.png')no-repeat center center; background-size: contain; width: 1.25rem; height: 0.8rem; left: 50%; transform: translateX(-50%); top: 0.55rem; }
.sub0101 .goLst4 > li { flex: 1; }
.sub0101 .goLst4 > li > span { width: 100%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 0.8rem; font-weight: bold; background-color: #0095FF; height: 2rem; border-radius: 3rem; }
.sub0101 .goLst4 > li:last-child > span { background: #005DAE; }

.sub0101 .goLst4 > li .tbl_st { margin-top: 1.25rem; position: relative; }
.sub0101 .goLst4 > li .tbl_st table { border-top: 2px solid #0095ff !important; }
.sub0101 .goLst4 > li .tbl_st table th { background: #F6FAFF; }
.sub0101 .goLst4 > li .tbl_st .list_st2 li::before { background-color: #0095FF !important; }

.sub0101 .goLst4 > li:last-child .tbl_st { overflow: visible; }
.sub0101 .goLst4 > li:last-child .tbl_st th { border-left: none; }
.sub0101 .goLst4 > li:last-child .tbl_st::before { position: absolute; content: ""; left: 50%; transform: translateX(-50%); top: calc(100% - 0.05rem); height: 0.85rem; width: 1.1rem; background: url('/images/dgedu/web/hakjeom/sub/lstBefore02.png')no-repeat center center; background-size: contain; z-index: -1; }
.sub0101 .goLst4 > li:last-child .tbl_st:last-child:before { display: none; }

.sub0101 .goLst5 { padding: 2rem 1.5rem; border: 1px solid #C2C7D0; border-radius: 1rem; margin-top: 2.25rem; }
.sub0101 .goLst5 .tbl_st table { border-top: 2px solid #0095ff !important; }
.sub0101 .goLst5 .tbl_st table th { background: #F6FAFF; }
.sub0101 .goLst5 .tbl_st .list_st2 li::before { background-color: #0095FF !important; }

.sub0101 .goLst5 .tbl_st { overflow: visible; margin-top: 1.25rem; position: relative; }
.sub0101 .goLst5 .tbl_st:first-child { margin-top: 0 !important; }
.sub0101 .goLst5 .tbl_st th { border-left: none; }
.sub0101 .goLst5 .tbl_st::before { position: absolute; content: ""; left: 50%; transform: translateX(-50%); top: calc(100% - 0.05rem); height: 0.85rem; width: 1.1rem; background: url('/images/dgedu/web/hakjeom/sub/lstBefore02.png')no-repeat center center; background-size: contain; z-index: -1; }
.sub0101 .goLst5 .tbl_st:last-child:before { display: none; }

.sub0101 .iTxt { position: relative; padding-left: 1.35rem; color: #363636; font-size: 1rem; font-weight: bold; margin-top: 4.6rem; }
.sub0101 .iTxt > img { position: absolute; left: 0; top: 0.3rem; font-size: 0; line-height: 0; }

/* 010201_진로 학업 설계란 */
.sub010201 .subDetail { background: #EEF0FF; }  
.sub010201 .lst { margin-top: 4.15rem; }
.sub010201 .lst ul { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 4.5rem 5.75rem; }
.sub010201 .lst ul::before { position: absolute; content: ""; width: 100%; height: 3px; background: linear-gradient(to right, #199cfa 0%, #247fe4 100%); left: 0; top: 50%; transform: translateY(-50%); z-index: 1; }
.sub010201 .lst ul li { position: relative; width: calc((100% - 11.5rem) / 3); border: 1px solid #C4CED7; border-radius: 1rem; padding: 3.75rem 1rem 4.5rem; height: 15.5rem; }
.sub010201 .lst ul li span.step { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background-color: #1F6ABB; border-radius: 0 0 0.75rem 0.75rem; font-size: 0.9rem; width: 5rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; font-family: 'montserrat'; }
.sub010201 .lst ul li span.step em { font-weight: bold; margin-left: 0.25rem; }
.sub010201 .lst ul li span.tit { font-size: 0.9rem; display: block; text-align: center; color: #1f6abb; font-weight: 600;}
.sub010201 .lst ul li p.txt { margin-top: 0.75rem; font-size: 0.8rem; color: #333; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; text-overflow: ellipsis; }
.sub010201 .lst ul li::before { border-radius: 50%; position: absolute; bottom: 1rem; right: 1rem; width: 3.5rem; height: 3.5rem; content: ""; }
.sub010201 .lst ul li:nth-child(1)::before { background: #FFF9CC; }
.sub010201 .lst ul li:nth-child(2)::before { background: #FFF0F8; }
.sub010201 .lst ul li:nth-child(3)::before { background: #EAF2FF; }
.sub010201 .lst ul li:nth-child(4)::before { background: #E8FAF5; }
.sub010201 .lst ul li:nth-child(5)::before { background: #F0F1FF; }
.sub010201 .lst ul li > img { position: absolute; }  
.sub010201 .lst ul li:nth-child(1) > img { max-width: 1.8rem; right: 2.9rem; bottom: 1.65rem; }
.sub010201 .lst ul li:nth-child(2) > img { max-width: 2.75rem; right: 2rem; bottom: 1.8rem; }
.sub010201 .lst ul li:nth-child(3) > img { max-width: 2.2rem; right: 2.8rem; bottom: 1.75rem; }
.sub010201 .lst ul li:nth-child(4) > img { max-width: 2.8rem; right: 2.15rem; bottom: 1.4rem; }
.sub010201 .lst ul li:nth-child(5) > img { max-width: 2.7rem; right: 2rem; bottom: 1.7rem; }
.sub010201 .lst ul li > em { position: absolute; left: 50%; border-radius: 50%; transform: translateX(-50%); width: 0.55rem; height: 0.55rem; background: #c4ced7; border: 2px solid #fff; bottom: -0.25rem; box-shadow: 0px 4px 4px rgba(0,0,0,0.15); z-index: 1; }
.sub010201 .lst ul li > em::before { position: absolute; content: ""; width: 2px; height: 2.1rem; background: #c4ced7; top: 100%; left: 50%; transform: translateX(-50%); z-index: -1; }
.sub010201 .lst ul li:nth-child(4) > em,
.sub010201 .lst ul li:nth-child(5) > em { bottom: auto; top: -0.25rem; }
.sub010201 .lst ul li:nth-child(4) > em::before,
.sub010201 .lst ul li:nth-child(5) > em::before { bottom: 100%; top: auto; }

/* 020102_학교별 교육과정 */
.sub020102 .subDetail { background: #FFEFF3; }
.sub020102 .subDetail > img { right: -0.75rem; }
.sub020102 .mapLstWrap { border: 1px solid #c4ced7; border-radius: 1.5rem 1.5rem 7.5rem 1.5rem; position: relative; margin-top: 2.5rem; display: flex; align-items: center; justify-content: center; padding: 14.5rem 1rem 17.5rem; }
.sub020102 .mapLstWrap .mapColr { background-color: #F6F6F6; border-radius: 0.75rem; display: flex; flex-direction: column; gap: 1rem; position: absolute; top: 2.25rem; left: 2.5rem; padding: 1rem; }
.sub020102 .mapLstWrap .mapColr li { position: relative; padding-left: 1.4rem; color: #000000; font-size: 0.7rem; font-weight: 600; }
.sub020102 .mapLstWrap .mapColr li::before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.75rem; height: 0.75rem; border-radius: 50%; content: ""; }
/* .sub020102 .mapLstWrap .mapColr li.all::before { background: #24E3D3; }
.sub020102 .mapLstWrap .mapColr li.man::before { background: #00DF0F; }
.sub020102 .mapLstWrap .mapColr li.girl::before { background: #FFC300; } */
/* 20.10.10 색 수정 */
.sub020102 .mapLstWrap .mapColr li.all::before { background: #FFC300; }
.sub020102 .mapLstWrap .mapColr li.man::before { background: #1aefed; }
.sub020102 .mapLstWrap .mapColr li.girl::before { background: #CC99FF; }
/* 과목 선택 컨설팅이란 */
.sub030101 .subDetail2 { background: #EEF0FF; }  

/* 맵공통 */
map area:focus { outline: none !important; }
/* 250827 학교명 클릭시 li 클릭으로 인한 수정 */
.sub020102 ul.mapDotLst > li { position: absolute; pointer-events: auto; z-index : 10; cursor: pointer; }
.sub020102 ul.mapDotLst > li > .schIco { display: inline-flex; position: relative; flex-direction: column; font-size: 0.6rem; font-weight: 600; color: #000000; }
.sub020102 ul.mapDotLst > li > .schIco > img {position: absolute;left: 50%;transform: translateX(calc(-50% + 0.4rem));bottom: calc(100% + 0.15rem);max-width: 1.65rem; display: none; z-index: 1; } 
.sub020102 ul.mapDotLst > li > .schIco::before { position: absolute; content: ""; width: 0.7rem; height: 0.85rem; left: 50%; transform: translateX(-50%); bottom: 100%; }
.sub020102 ul.mapDotLst > li.all > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/all.png')no-repeat; }
.sub020102 ul.mapDotLst > li.man > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/man.png')no-repeat; }
.sub020102 ul.mapDotLst > li.girl > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/girl.png')no-repeat; }
.sub020102 .pinIcon { position: absolute; display: flex; flex-direction: column; gap: 0.3rem; justify-content: center; align-items: center; z-index: 1; display: none; }
.sub020102 .pinIcon > span { border-radius: 5rem; display: inline-flex; align-items: center; justify-content: center; color: #116CE2; font-size: 0.8rem; font-weight: 600; border: 2px solid #116CE2; height: 1.5rem; padding: 0 1.25rem; background: #fff; }
.sub020102 ul.mapTxtLst > li .pinIcon > img { font-size: 0; line-height: 0; max-width: 1.6rem; }
.sub020102 ul.mapTxtLst > li.donggu .pinIcon {top: 1%;left: 83%;}
.sub020102 ul.mapTxtLst > li.bukgu .pinIcon {top: 8.5%;left: 43.5%;}
.sub020102 ul.mapTxtLst > li.junggu .pinIcon {top: 48%;left: 53%;}
.sub020102 ul.mapTxtLst > li.seogu .pinIcon {top: 42%;left: 38%;}
.sub020102 ul.mapTxtLst > li.namgu .pinIcon {top: 58%;left: 53%;}
.sub020102 ul.mapTxtLst > li.susung .pinIcon {top: 78%;left: 73%;}
.sub020102 ul.mapTxtLst > li.dalseong .pinIcon {top: 25%;left: 12%;}
.sub020102 ul.mapTxtLst > li.dalseo .pinIcon {top: 52%;left: 22%;}

/* 군위 */
.sub020102 .gunWee { border-radius: 50%; border: 1px dashed #DFDFDF; width: 11.5rem; height: 11.5rem; display: flex; align-items: center; justify-content: center; position: absolute; top: 2.9rem; right: 11.65rem; }
.sub020102 .gunWee .gunMapBox { width: 9.05rem; height: 7.1rem; display: flex; align-items: center; justify-content: center; position: relative; }
.sub020102 .gunWee .gunMapBox > img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; }
.sub020102 .gunWee .gunMapBox > span.mapName { position: absolute; color: #AC9F3E; font-size: 0.75rem; font-weight: bold; top: 49%; left: 44%; }
.sub020102 .gunMapTxtLst > li > .schIco { display: inline-flex; position: relative; flex-direction: column; font-size: 0.6rem; font-weight: 600; color: #000000; }
.sub020102 .gunMapTxtLst > li > .schIco > img {position: absolute;left: 50%;transform: translateX(calc(-50% + 0.4rem));bottom: calc(100% + 0.15rem);max-width: 1.65rem; display: none; z-index: 1; }
.sub020102 .gunMapTxtLst > li > .schIco::before { position: absolute; content: ""; width: 0.7rem; height: 0.85rem; left: 50%; transform: translateX(-50%); bottom: 100%; }
.sub020102 .gunMapTxtLst > li.all > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/all.png')no-repeat; }
.sub020102 .gunMapTxtLst > li.man > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/man.png')no-repeat; }
.sub020102 .gunMapTxtLst > li.girl > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/girl.png')no-repeat; }
.sub020102 .gunMapTxtLst > li { position: absolute; top: 27%; left: 26.5%; }
.sub020102 .gunMapBox .pinIcon { right: -5%; top: -10%;}
/* 군위 지도 active */
.sub020102 .gunMapBox:hover .pinIcon,
.sub020102 .gunMapBox:focus .pinIcon { display: flex; pointer-events: none; }
.sub020102 .gunWee .gunMapBox img.onView { display: none; }
.sub020102 .gunWee .gunMapBox:hover img.offView,
.sub020102 .gunWee .gunMapBox:focus img.offView { display: none; }
.sub020102 .gunWee .gunMapBox:hover img.onView,
.sub020102 .gunWee .gunMapBox:focus img.onView { display: block; }
.sub020102 .gunMapBox:hover .schIco,
.sub020102 .gunMapBox:focus .schIco { color: #fff; }
.sub020102 .gunMapBox:hover .schIco::before,
.sub020102 .gunMapBox:focus .schIco::before { box-shadow: 0px 1px 1px rgba(0,0,0,0.25); }

/* 센터 */
.sub020102 .mapLstBox { width: 46.7rem; height: 37.5rem; position: relative; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
.sub020102 .mapLstBox > img { max-width: 100%; }
.sub020102 ul.mapTxtLst > li > img { position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: none; z-index: -1; pointer-events: none;}
/* 센터 지도 active */
.sub020102 ul.mapTxtLst > li.actv .pinIcon { display: flex; z-index: 15; pointer-events: none; }
.sub020102 ul.mapTxtLst > li.actv .schIco::before { box-shadow: 0px 1px 1px rgba(0,0,0,0.25); }
.sub020102 ul.mapTxtLst > li.actv .schIco { color: #fff; }

/* 달성 */
.sub020102 .dalsung { position: absolute; width: 17rem; height: 17rem; bottom: 3rem; left: 5.35rem; border-radius: 50%; border: 1px dashed #DFDFDF; display: flex; align-items: center; justify-content: center; }
.sub020102 .dalsung .dalMapBox { width: 13.6rem; height: 10.8rem; position: relative; left: auto; top: auto; }
.sub020102 .dalMapBox > img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; }
.sub020102 .dalMapBox > span.mapName { position: absolute; color: #AC9F3E; font-size: 0.75rem; font-weight: bold; top: 49%; left: 44%; }
.sub020102 .dalTxtLst > li > .schIco { display: inline-flex; position: relative; flex-direction: column; font-size: 0.6rem; font-weight: 600; color: #000000; }
.sub020102 .dalTxtLst > li > .schIco > img {position: absolute;left: 50%;transform: translateX(calc(-50% + 0.4rem));bottom: calc(100% + 0.15rem);max-width: 1.65rem; display: none; z-index: 1; }
.sub020102 .dalTxtLst > li > .schIco::before { position: absolute; content: ""; width: 0.7rem; height: 0.85rem; left: 50%; transform: translateX(-50%); bottom: 100%; }
.sub020102 .dalTxtLst > li.all > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/all.png')no-repeat; }
.sub020102 .dalTxtLst > li.man > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/man.png')no-repeat; }
.sub020102 .dalTxtLst > li.girl > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/girl.png')no-repeat; }
.sub020102 .dalTxtLst > li { position: absolute; top: 27%; left: 26.5%; }
.sub020102 .dalMapBox .pinIcon { right: 10%; top: -10%;}
/* 달성 지도 : active */
.sub020102 .dalMapBox:hover .pinIcon,
.sub020102 .dalMapBox:focus .pinIcon { display: flex; pointer-events: none; }
.sub020102 .dalMapBox img.onView { display: none; }
.sub020102 .dalMapBox:hover img.offView,
.sub020102 .dalMapBox:focus img.offView { display: none; }
.sub020102 .dalMapBox:hover img.onView,
.sub020102 .dalMapBox:focus img.onView { display: block; }
.sub020102 .dalMapBox:hover .schIco,
.sub020102 .dalMapBox:focus .schIco { color: #fff; }
.sub020102 .dalMapBox:hover .schIco::before,
.sub020102 .dalMapBox:focus .schIco::before { box-shadow: 0px 1px 1px rgba(0,0,0,0.25); }

/* 전체지도 */
.sub020102 .allMap { position: absolute; right: 3.25rem; bottom: 2.95rem; border-radius: 1.5rem 1.5rem 4rem 1.5rem; background: #f5f5f5; display: flex; align-items: center; justify-content: center; width: 13.6rem; height: 12.35rem; }

.sub020102 .mapAllBtn { display: inline-flex; align-items: center; justify-content: center; height: 2.5rem; width: 12.5rem; border-radius: 3rem; background: #333062; border: 2px solid transparent; color: #fff; font-weight: 600; margin-top: 1rem; transition: 0.2s; }
.sub020102 .mapAllBtn:hover,
.sub020102 .mapAllBtn:focus { background: #fff; border-color: #333062; color: #333062; }
.sub020102 .subDetail > img { bottom: -7.5rem; }

/* 맵뷰페이지 */
.mapLstView .mapDotLst { position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.mapLstView .mapDotLst > li { pointer-events: unset !important; z-index: 3; }
.mapLstView { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; }
.mapLstView > img { font-size: 0; line-height: 0; }
/* .mapLstView.bukgu { width: 38.35rem; height: 42.3rem; }
.mapLstView.donggu { width: 35.15rem; height: 45.1rem; }
.mapLstView.susung { width: 40.55rem; height: 32.8rem; }
.mapLstView.junggu { width: 34.75rem; height: 25.25rem; }
.mapLstView.namgu { width: 30.85rem; height: 38.35rem; }
.mapLstView.dalseo { width: 39.2rem; height: 39.4rem; }
.mapLstView.seogu { width: 36.45rem; height: 27.5rem; }
.mapLstView.dalseong { width: 39.1rem; height: 36.95rem; }
.mapLstView.dalseong02 { width: 39.95rem; height: 31.95rem; }
.mapLstView.gunWeeMap { width: 41.7rem; height: 32.8rem; } */
.mapDetail { position: absolute; top: 2.25rem; right: 2.5rem; width: calc(100% - 15.5rem); display: flex; flex-wrap: wrap; flex-direction: row; border-radius: 1rem; border: 1px solid #cfd4da; padding: 1rem 1rem 1.1rem; box-shadow: 3px 3px 6px rgba(0,0,0,0.1); }
.mapDetail .lft { width: calc(100% - 21.25rem); padding-right: 1.25rem; margin-right: 1.25rem; border-right: 1px dashed #e2e2e2; }
.mapDetail .lft > span { font-size: 0.9rem; font-weight: bold; color: #000; }
.mapDetail .lft > p { font-size: 0.75rem; font-weight: 600; margin-top: 1rem; }
.mapDetail .rgt { width: 20rem;  }
.mapDetail .rgt table { border-color: #000000; }
.mapDetail .rgt table thead th { background: #F3F3F3; padding: 0.5rem; font-size: 0.75rem; }
.mapDetail .rgt table tbody th { font-weight: 600; }
.mapDetail .rgt table tbody th,
.mapDetail .rgt table tbody td { padding: 0.5rem; font-size: 0.75rem; background: #fff; }
.mapDetail .rgt table tbody td a { display: inline-flex; align-items: center; justify-content: center; border-radius: 3rem; justify-content: space-between; gap: 0.5rem; color: #fff; padding: 0 0.75rem; font-size: 0.65rem; height: 1.4rem; }
.mapDetail .rgt table tbody td a.pdfDwn { background: linear-gradient(to right, #149dff 0%, #0086e5 100%); }
.mapDetail .rgt table tbody td a.viewDwn { background: #000000; }

.sub020102.view .mapLstWrap { padding: 18rem 1rem 11rem; }
.sub020102.view ul.mapDotLst > li > .schIco { font-size: 0.8rem !important; }

.sub020102.view ul.mapDotLst > li.actv > .schIco { font-weight: bold; }
.sub020102.view ul.mapDotLst > li > a > img {position: absolute;left: 50%;transform: translateX(calc(-50% + 0.55rem));bottom: calc(100% + 0.15rem);max-width: 1.65rem; display: none; z-index: 1; } 

.sub020102.view ul.mapDotLst > li.actv > a > img { display: block; }

.sub020102.view ul.mapDotLst.bukguMap > li.actv > a::after { background: #FF92B0; }
.sub020102.view ul.mapDotLst.bukguMap > li.actv > a::before { background: #FFBACD; }

.sub020102.view ul.mapDotLst.dongguMap > li.actv > a::after { background: #DD8FFF; }
.sub020102.view ul.mapDotLst.dongguMap > li.actv > a::before { background: #EEC8FF; }

.sub020102.view ul.mapDotLst.susungMap > li.actv > a::after { background: #7098FF; }
.sub020102.view ul.mapDotLst.susungMap > li.actv > a::before { background: #B1C7FF; }

.sub020102.view ul.mapDotLst.jungguMap > li.actv > a::after { background: #A9E010; }
.sub020102.view ul.mapDotLst.jungguMap > li.actv > a::before { background: #E2F58F; }

.sub020102.view ul.mapDotLst.namguMap > li.actv > a::after { background: #01CD55; }
.sub020102.view ul.mapDotLst.namguMap > li.actv > a::before { background: #89F8B7; }

.sub020102.view ul.mapDotLst.dalseoMap > li.actv > a::after { background: #FF7F00; }
.sub020102.view ul.mapDotLst.dalseoMap > li.actv > a::before { background: #FFBF80; }

.sub020102.view ul.mapDotLst.seoguMap > li.actv > a::after { background: #939393; }
.sub020102.view ul.mapDotLst.seoguMap > li.actv > a::before { background: #C8C8C8; }

.sub020102.view ul.mapDotLst.dalseongMap > li.actv > a::after { background: #00CDE4; }
.sub020102.view ul.mapDotLst.dalseongMap > li.actv > a::before { background: #A8F2FA; }

.sub020102.view ul.mapDotLst.dalseongMap02 > li.actv > a::after { background: #007DD7; }
.sub020102.view ul.mapDotLst.dalseongMap02 > li.actv > a::before { background: #58BAFF; }

.sub020102.view ul.mapDotLst.gunWeeMapMap > li.actv > a::after { background: #A89400; }
.sub020102.view ul.mapDotLst.gunWeeMapMap > li.actv > a::before { background: #D9C108; }

@keyframes wave {
    0% { opacity: 1; transform: translateX(-50%) scale(0.7); }
    100% { opacity: 0; transform: translateX(-50%) scale(2); }
}

.sub020102.view ul.mapDotLst > li > .schIco::before { position: absolute; content: ""; width: 1.15rem !important; height: 1.35rem !important; left: 50%; transform: translateX(-50%); bottom: 100%; }
.sub020102.view ul.mapDotLst > li.all > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/allView.png')no-repeat; }
.sub020102.view ul.mapDotLst > li.man > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/manView.png')no-repeat; }
.sub020102.view ul.mapDotLst > li.girl > .schIco::before { background: url('/images/dgedu/web/hakjeom/sub/girlView.png')no-repeat; }

.sub020102.view ul.mapDotLst > li.actv > a::after { background: #fff; width: 0.65rem !important; height: 0.65rem !important; border-radius: 50%; bottom: calc(100% + 0.2rem); left: 50%; transform: translateX(-50%); content: ""; position: absolute; }
.sub020102.view ul.mapDotLst > li.actv > a::before { background: rgba(255,255,255,0.5); width: 0.75rem !important; height: 0.75rem !important; border-radius: 50%; bottom: calc(100% + 0.15rem); left: 50%; transform: translateX(-50%); box-shadow: none; animation: wave 2s infinite linear; }

/* 010202_수강신청절차 */
.sub010202 .lst01 { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.sub010202 .lst01 li { position: relative; border-radius: 1.75rem; padding: 1rem 0 0 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc((100% - 2.5rem) / 3); }
.sub010202 .lst01 li:nth-child(1) { background-color: #6EBCFF; }
.sub010202 .lst01 li:nth-child(2) { background-color: #7DDEE5; }
.sub010202 .lst01 li:nth-child(3) { background-color: #98F5B1; }

.sub010202 .lst01 li::before { position: absolute; content: ""; border-radius: 50%; width: 11.75rem; height: 11.75rem; bottom: 0; left: 50%; transform: translateX(-50%); }
.sub010202 .lst01 li:nth-child(1)::before { background: #56AAF4; }
.sub010202 .lst01 li:nth-child(2)::before { background: #46CED8; }
.sub010202 .lst01 li:nth-child(3)::before { background: #7BE598; }

.sub010202 .lst01 li::after { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/img010202_arrow01.png')no-repeat center center; background-size: contain; width: 5.55rem; height: 3.15rem; top: 50%; transform: translateY(-50%); right: -2.85rem; z-index: 1; }
.sub010202 .lst01 li:nth-child(2):after { background: url('/images/dgedu/web/hakjeom/sub/img010202_arrow02.png') no-repeat; background-size: contain; }
.sub010202 .lst01 li:last-child:after { display: none; }

.sub010202 .lst01 li > span { background: #fff; border-radius: 5rem; color: #0073d8; width: 4rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: 600;  font-family: 'montserrat';}
.sub010202 .lst01 li > .img { position: relative; display: inline-flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; margin: 1.5rem 0 2.15rem; }
.sub010202 .lst01 li > .txt { position: relative; border-radius: 0 0 1.75rem 1.75rem; background: #fff; border: 1px solid #B4BBC2; width: 100%; padding: 1rem 1rem 1.6rem; text-align: center; color: #000; font-size: 0.75rem; height: 100%; }
.sub010202 .lst01 li > .txt > span { color: #005DAE; font-weight: bold; font-size: 0.9rem; }
.sub010202 .lst01 li:nth-child(2) > .txt,
.sub010202 .lst01 li:nth-child(3) > .txt { padding: 1.5rem 1rem 1.6rem; }

.sub010202 .lst02 { position: relative; display: flex; flex-wrap: wrap; gap: 5rem; }
.sub010202 .lst02::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/img010202_chr.png')no-repeat center center; background-size: contain; width: 6.05rem; height: 9.95rem; right: 0; bottom: 0; }
.sub010202 .lst02 > li { position: relative; padding-left: 4.5rem; width: 100%; }
.sub010202 .lst02 > li::before { position: absolute; content: ""; height: 1px; width: 100%; border-bottom: 1px dashed #CED2D7; left: 0; bottom: -2.45rem; }
.sub010202 .lst02 > li:last-child::before { display: none; } 
.sub010202 .lst02 > li .img { position: absolute; left: 0; top: 0; font-size: 0; line-height: 0; }
.sub010202 .lst02 > li > span { display: inline-flex; align-items: center; justify-content: center; color: #000000; font-size: 0.9rem; font-weight: bold; background: #DFEEFF; padding: 0.55rem 1.25rem; border-radius: 3rem; }
.sub010202 .lst02 > li > p { margin-top: 1rem; color: #000; }

.sub010202 .lst02 > li:last-child > p { font-size: 0.9rem; font-weight: 600; margin-top: 1.25rem; }
.sub010202 .lst02 > li:last-child > ul { display: flex; flex-wrap: wrap; margin-top: 1.75rem; padding-right: 7rem; gap: 1.5rem 2rem; }
/* .sub010202 .lst02 > li:last-child > ul > li + li { margin-left: 2rem; } */
.sub010202 .lst02 > li:last-child > ul > li > span { display: inline-flex; align-items: center; justify-content: center; width: 3.5rem; height: 1.75rem; background-color: #eaeaea; border-radius: 3rem; font-size: 0.8rem; font-weight: 600; color: #000; }
.sub010202 .lst02 > li:last-child > ul > li > p { margin-top: 1rem; color: #000; font-size: 0.8rem; }
.sub010202 .lst02 > li:last-child > ul > li > p > span { font-weight: 600; }

.lst03 { display: flex; flex-wrap: wrap; gap: 2.25rem 2.75rem; }
.lst03 > li { width: calc((100% - 5.5rem) / 3); position: relative; border-radius: 1rem; background: #EBF2FF; padding: 3.7rem 1.25rem 1.55rem; }
.lst03 > li > span { position: absolute; top: 0; left: 50%; transform: translateX(-50%); color: #fff; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; display: inline-flex; align-items: center; justify-content: center; width: 5rem; font-size: 0.9rem; font-weight: bold; height: 2.2rem; }
.lst03 > li > p:not(.bu_wnrn) { background: #fff; width: 100%; border-radius: 0.75rem; text-align: center; padding: 1rem 1.5rem; min-height: 8.75rem; display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; }
.lst03 > li .bu_wnrn { font-size: 0.7rem; line-height: 1rem; display: inline-block; padding-left: 0.75rem; }
.lst03 > li .bu_wnrn:before { font-size: 0.8rem; width: 0.8rem; height: 0.8rem; top: -0.02rem; }

.lst03 > li::before { position: absolute; content: ""; width: 2.05rem; height: 1.45rem; background-size: contain !important; z-index: -1; }

.lst03 > li:nth-child(1):before { top: 50%; transform: translateY(-50%); right: -1.5rem; background: url('/images/dgedu/web/hakjeom/sub/stepArr01.png')no-repeat center center; }
.lst03 > li:nth-child(2):before { top: 50%; transform: translateY(-50%); right: -1.5rem; background: url('/images/dgedu/web/hakjeom/sub/stepArr02.png')no-repeat center center; }
.lst03 > li:nth-child(3):before { width: 1.45rem; height: 2.05rem; left: 50%; transform: translateX(-50%); bottom: -1.5rem; background: url('/images/dgedu/web/hakjeom/sub/stepArr03.png')no-repeat center center; }
.lst03 > li:nth-child(6):before { top: 50%; transform: translateY(-50%); left: -1.5rem; background: url('/images/dgedu/web/hakjeom/sub/stepArr04.png')no-repeat center center; }
.lst03 > li:nth-child(5):before { top: 50%; transform: translateY(-50%); left: -1.5rem; background: url('/images/dgedu/web/hakjeom/sub/stepArr05.png')no-repeat center center; }

/* 010203_대학 학과별 권장과목 알아보기 */
.sub010203 { position: relative; padding-top: 9.5rem; }
.sub010203 > a { position: absolute; top: 2.25rem; left: 50%; transform: translateX(-50%); width: 18rem; height: 4.7rem; display: inline-flex; align-items: center; justify-content: center; background: url('/images/dgedu/web/hakjeom/sub/txtbul.png')no-repeat center center; background-size: contain; font-size: 0.9rem; font-weight: bold; color: #fff; padding-bottom: 1.1rem; }
.sub010203 > a > span { position: relative; display: inline-flex; align-items: center; justify-content: center; background: #fff; border-radius: 50%; width: 1.5rem; height: 1.5rem; box-shadow: 0px 3px 3px rgba(0,0,0,0.15); margin-left: 0.6rem; transition: 0.2s; padding-left: 0.1rem; }

.sub010203 > a:hover > span,
.sub010203 > a:focus > span { transform: translateX(5px); }

.sub010203 ul { position: relative; display: flex; flex-wrap: wrap; border: 1px solid #C4CED7; border-radius: 1rem; background: #fff;  }
.sub010203 ul::before { position: absolute; content: ""; width: 1px; height: 100%; left: 50%; top: 0; transform: translateX(-50%); background: #c4ced7; z-index: 1; }
.sub010203 ul > li { flex: 1; position: relative; color: #111; padding: 1.5rem 1.35rem 2.5rem; min-height: 8.5rem; }
.sub010203 ul > li img { position: absolute; left: 50%; transform: translateX(calc(-50% - 1.5rem)); bottom: 100%; z-index: -1; max-width: 9.05rem; }
.sub010203 ul > li:last-child img { bottom: auto; top: -7.75rem; transform: translateX(calc(-50% + 2.5rem)); max-width: 8.2rem; }

/* 0103_자주 묻는 질문 */
.sub0103 { margin-top: 1rem; }
.sub0103 .mgt30 { margin-top: 1.5rem !important; }
.sub0103 .titWrap { display: flex; align-items: center; justify-content: center; flex-direction: column; }
.sub0103 .titWrap > span { color: #000000; font-size: 1.5rem; font-weight: 600; }
.sub0103 .titWrap .qna { display: flex; align-items: baseline; justify-content: center; font-size: 1.65rem; color: #BEBEBE; gap: 0.5rem; }
.sub0103 .titWrap .qna span.txtQ { color: #0079FE; font-weight: bold; font-size: 2rem; }
.sub0103 .titWrap .qna span.txtA { color: #000000; font-weight: bold; font-size: 2rem; }
.sub0103 .qnaLst { position: relative; margin-top: 1.25rem; } 
.sub0103 .qnaLst::before { position: absolute; content: ""; bottom: calc(100% - 0.1rem); background: url('/images/dgedu/web/hakjeom/sub/qnaGirl.png')no-repeat center center; background-size: contain; width: 7.4rem; height: 6.9rem; left: 8.71vw; z-index: -1; }
.sub0103 .qnaLst::after { position: absolute; content: ""; bottom: calc(100% - 0.1rem); background: url('/images/dgedu/web/hakjeom/sub/qnaMan.png')no-repeat center center; background-size: contain; width: 8rem; height: 6.7rem; right: 7.77vw; z-index: -1; }
.sub0103 .qnaLst > ul > li + li {margin-top: 2rem;}
.sub0103 .qnaLst > ul > li p.question {width: calc(100% - 1rem);position: relative;padding: 0.6rem 1.5rem 0.6rem 3rem;background: #F3F7FF;border: 1.5px solid #003E82;border-radius: 0.5rem;margin-left: 1rem;font-size: 0.9rem;font-weight: 600;color: #000;display: flex;align-items: center;cursor: pointer;transition: .5s ease;}
.sub0103 .qnaLst > ul > li p.question span { display: inline-block; align-items: center;  overflow: hidden; text-overflow: ellipsis; }
.sub0103 .qnaLst > ul > li p.question::before { position: absolute; content: "Q"; width: 2.8rem; height: 2.6rem; left: -1rem; top: -0.65rem; color: #fff; font-size: 1.2rem; font-weight: bold; background: url('/images/dgedu/web/hakjeom/sub/txtQ.png')no-repeat center center; background-size: contain; display: inline-flex; align-items: center; justify-content: center; padding-right: 0.25rem; }
.sub0103 .qnaLst > ul > li > .answer {min-height: 0;max-height: 0;opacity: 0;overflow: hidden;transition: .8s ease;position: relative;padding: .5rem 0 0 7.3rem;}
.sub0103 .qnaLst > ul > li > .answer::before { position: absolute; content: ""; width: 2px; height: 3.25rem; top: 1.3rem; left: 5.8rem; background: #DBDBDB; }
.sub0103 .qnaLst > ul > li > .answer > img { position: absolute; left: 1.5rem; top: 1.3rem; max-width: 2.8rem; }
.sub0103 .qnaLst > ul > li > .answer p { color: #000; }
.sub0103 .qnaLst > ul > li > .answer p a { font-weight: bold; }

.sub0103 .qnaLst .hasStar { position: relative; padding-right: 0.5rem; }
.sub0103 .qnaLst span.hasStar { display: inline-block; }
.sub0103 .qnaLst .hasStar::before { position: absolute; content: "*"; right: 0; top: -0.45rem; }
.sub0103 .qnaLst .tbl_st .hasStar { color: #D83131; }
.sub0103 .qnaLst .tbl_st .hasStar::before { top: 0.5rem; right: 0.5rem; }

.sub0103 .qnaLst > ul > li > .answer .tbl_st { margin-top: 1.5rem; }
.sub0103 .qnaLst > ul > li > .answer .inTblStar { position: relative; padding-left: 0.75rem; color: #000000; margin-top: 1.5rem; }
.sub0103 .qnaLst > ul > li > .answer .inTblStar::before { position: absolute; content: "*"; left: 0; top: 0; }
.sub0103 .qnaLst > ul > li > .answer .inTblStar li { padding-left: 7.2rem; position: relative; }
.sub0103 .qnaLst > ul > li > .answer .inTblStar li span { position: absolute; left: 0; top: 0; font-weight: 600; }
.sub0103 .qnaLst > ul > li > .answer .qrBox { margin-top: 1.5rem; }
.sub0103 .qnaLst > ul > li > .answer .qrBox ul { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.sub0103 .qnaLst > ul > li > .answer .qrBox ul li { position: relative; border: 1px solid #C4CED7; border-radius: 1rem; padding: 3.5rem 1rem 1rem; display: flex; align-items: center; justify-content: center; width: 15rem; }
.sub0103 .qnaLst > ul > li > .answer .qrBox ul li span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background: #1F6ABB; border-radius: 0 0 0.75rem 0.75rem; padding: 0 1rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; width: calc(100% - 2rem); font-size: 0.9rem; font-weight: 500; }
.sub0103 .qnaLst > ul > li > .answer .qrBox ul li > a { display: inline-flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; }
.sub0103 .lst03 { margin-top: 1.5rem; gap: 1.9rem 2.25rem; }
.sub0103 .lst03 > li { width: calc((100% - 4.5rem) / 3); padding: 3.2rem 1rem 1.3rem; }
.sub0103 .lst03 > li > p:not(.bu_wnrn) { padding: 1rem; font-size: 0.75rem; }
.sub0103 .lst03 > li > span { height: 1.9rem; width: 4.3rem; font-size: 0.75rem; border-radius: 0 0 0.6rem 0.6rem; }

/* 애니메이션 추가 10.16 */
.sub0103 .qnaLst > ul > li > .answer.show {min-height: 5.75rem;max-height: fit-content;opacity: 1;padding: 1.3rem 1rem 1.3rem 7.3rem;margin-top: 1rem;}

/* 020101_고등학교 교육과정안내 */
.sub020101 .subDetail { background: #D9F5F5; }
.sub020101 .subDetail > img { bottom: -14rem; }
.sub020101 .bu_wnrn { margin-top: 2rem; }

/* 020201_대구공동교육과정안내 */
.sub020201 .subDetail { background: #DFF3FF; }
.lineBox { position: relative; border: 1px solid #C4CED7; border-radius: 1rem; padding: 3rem; display: flex; align-items: center; justify-content: center; flex-direction: column; }
.lineBox::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/line_020201.png')no-repeat center center; width: 21.1rem; height: 4.2rem; top: 5.75rem; left: 50%; transform: translateX(-50%); background-size: contain; z-index: -1; }
.lineBox > span { display: inline-flex; align-items: center; justify-content: center; color: #fff; background: #004795; width: 12rem; height: 2.75rem; border-radius: 5rem; font-size: 0.9rem; font-weight: 600 }
.lineBox > ul { display: flex; width: 40rem; flex-wrap: wrap; gap: 2rem; margin-top: 4rem; }
.lineBox > ul > li { width: calc((100% - 2rem) / 2); position: relative; border: 1px solid #dd5050; border-radius: 1rem; background: #fff4f4; padding: 4rem 1.25rem 1rem; min-height: 12rem; }
.lineBox > ul > li > span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; background: #dd5050; border-radius: 0 0 0.75rem 0.75rem; color: #fff; min-width: 13.2rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; font-family: 'montserrat'; font-weight: 600; font-size: 0.9rem; }
.lineBox > ul > li > span > em { font-weight: 400; margin-left: 0.15rem; }
.lineBox > ul > li:nth-child(2) { border-color: #2062DD; background: #f2f6ff; }
.lineBox > ul > li:nth-child(2) > span { background: #2062DD; }
.sub020201 .pc_blue { color: #3565DD !important; }

.sub020201 a.pc_blue:hover,
.sub020201 a.pc_blue:focus { text-decoration: underline; }

.sub020201 .qnaWrap > ul { display: flex; flex-direction: column; gap: 1.5rem; }
.sub020201 .qnaWrap > ul > li p.qTxt { position: relative; padding: 0.75rem 2rem 0.75rem 4.25rem; background: #E0EFFF; border-radius: 3rem; font-size: 0.9rem; color: #000; font-weight: 600; min-height: 3rem; display: flex; align-items: center; }
.sub020201 .qnaWrap > ul > li p.qTxt::before { position: absolute; border-radius: 50%; content: "Q"; color: #fff; width: 3rem; height: 3rem; background: #0079fe; left: 0; top: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; font-weight: 600; }
.sub020201 .qnaWrap > ul > li p.ATxt { margin-top: 0.5rem; background: #F6F6F6; border-radius: 1rem; padding: 1.5rem; width: calc(100% - 1.3rem); margin-left: 1.3rem; }

/* 020202_학교밖교육 꿈창작캠퍼스 안내 */
.sub020202 .subTitle > img { max-width: 3.4rem; margin-right: 0.75rem; }
.sub020202 .subDetail { background: #FFEDE3; }
.sub020202 .subDetail > img { bottom: -12.5rem; }
.sub020202 .box_st_img { padding: 0 3rem; }
.sub020202 .lst01 { display: flex; flex-wrap: wrap; gap: 2rem; }
.sub020202 .lst01 > li { width: calc((100% - 2rem) / 2); border-radius: 1rem; border: 1px solid #d0d2d4; position: relative; padding: 4rem 2rem 2.2rem; }
.sub020202 .lst01 > li > span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; background: #005DAE; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; min-width: 20rem; border-radius: 0 0 0.75rem 0.75rem; font-size: 0.9rem; font-weight: 600; font-family: 'montserrat'; }
.sub020202 .lst01 > li > p { text-align: center; }
.sub020202 .lst01 > li > .list_st1 > li:first-child { margin-top: 0; }
.sub020202 .lineBox > span { width: 15rem; }
.sub020202 .lineBox > ul { margin-top: 3rem; }
.sub020202 .lineBox::before { top: 5.5rem; }
.sub020202 .lineBox > ul > li { min-height: 7.5rem; }
.sub020202 .lineBox > ul > li > span { min-width: 10rem; }
.sub020202 .lineBox > ul > li > p { text-align: center; font-weight: 600; }
.sub020202 .lst02 { display: flex; flex-direction: column; gap: 0.5rem; margin: 2rem 0 1.25rem; }
.sub020202 .lst02 > li { position: relative; padding-left: 7.75rem; line-height: 2rem; }
.sub020202 .lst02 > li > span { position: absolute; left: 0; top: 0; width: 7rem; height: 2rem; border-radius: 3rem; background: #f2f6ff; border: 1px solid #2062DD; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }
.sub020202 .tbl_st th { background: #f6faff; }
.sub020202 .lst04 { display: flex; gap: 2rem; }
.sub020202 .lst04 > li { width: calc((100% - 2rem) / 2); border: 1px solid #d0d2d4; border-radius: 1rem; position: relative; padding: 4rem 1rem 2.2rem; }
.sub020202 .lst04 > li > span { color: #fff; position: absolute; left: 50%; transform: translateX(-50%); top: 0; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; height: 2.5rem; width: 7.5rem; display: inline-flex; align-items: center; justify-content: center; font-size: 0.9rem; font-weight: 600; }
.sub020202 .lst04 > li > p {text-align: center; }

/* 030101_학점제형 학교 공간 안내 */
.sub030101 .rsp_img { margin-top: 2.5rem; }

/* 030102_학교 공간 갤러리 */
.sub030102 .lst { margin-top: 2.5rem; }
.sub030102 .lst > ul { display: flex; flex-wrap: wrap; gap: 2rem; }
.sub030102 .lst > ul > li { width: calc((100% - 4rem) / 3); }
.sub030102 .lst > ul > li > a { display: flex; align-items: center; justify-content: center; position: relative; border-radius: 1rem; overflow: hidden; }
.sub030102 .lst > ul > li > a::before { position: absolute; content: ""; width: 100%; height: 100%; border-radius: 1rem; background: rgba(0,0,0,0.5); left: 0; top: 0; opacity: 0; visibility: hidden; }
.sub030102 .lst > ul > li > a > span { position: absolute; left: 50%; transform: translateX(-50%); top: 0; color: #fff; border-radius: 0 0 0.75rem 0.75rem; background: #0079FE; height: 2.3rem; padding: 0 0.75rem; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0px 4px 4px rgba(0,0,0,0.15); }
.sub030102 .lst.colGrn > ul > li > a > span { background: #00AE8B; }
.sub030102 .lst.colPur > ul > li > a > span { background: #8D5FDB; }
.sub030102 .lst > ul > li > a > em { display: inline-flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 2.5rem; height: 2.5rem; background: #fff; color: #000; font-size: 1.1rem; border-radius: 50%; z-index: 1; opacity: 0; visibility: hidden; }
.sub030102 .lst > ul > li > a > em::before { position: absolute; content: ""; width: calc(100% + 0.5rem); height: calc(100% + 0.5rem); left: -0.25rem; top: -0.25rem; background: rgba(255,255,255,0.5); border-radius: 50%; z-index: -1; }

@keyframes pump {
    0% { opacity: 1; scale: 0.7; }
    100% { opacity: 0; scale: 1.2; }
}

.sub030102 .lst > ul > li > a > .img { display: inline-flex; align-items: center; justify-content: center; overflow: hidden; width: 100%; height: 100%; font-size: 0; line-height: 0; background-color: #e1e1e1; }
.sub030102 .lst > ul > li > a > .img img { max-width: 100%; }

.lstPopWrap { position: fixed; left: 0; top: 0; background: rgba(0,0,0,0.5); width: 100%; height: 100vh; z-index: 101; display: none; }
.lstPopWrap.active { display: block; }
.lstPopWrap .lstPopBox { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 40rem; background: #fff; border-radius: 1rem; box-shadow: 10px 10px 25px rgba(0,0,0,0.25); padding: 4.5rem 2.5rem 2.25rem; max-height: calc(100vh - 2rem); }
.lstPopWrap .lstPopBox > span { color: #fff; display: inline-block; text-align: center; overflow: hidden; text-overflow: ellipsis; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; padding: 0.65rem 1rem; min-width: 20rem; max-width: calc(100% - 6rem); position: absolute; top: 0; left: 50%; transform: translateX(-50%); font-size: 0.9rem; font-weight: 600; white-space: nowrap; }
.lstPopWrap .lstPopCls { position: absolute; right: 0.85rem; top: 0.8rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; width: 1.5rem; height: 1.5rem; background: #D8D8D8; font-size: 1rem; font-weight: 600; line-height: 1; }

.lstPopWrap .lstPopBox .box > p { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; color: #333; }
.lstPopWrap .lstPopBox .box > p > span { display: inline-flex; align-items: center; gap: 0.5rem; position: relative; padding-right: 0.6rem; margin-right: 0.5rem; font-weight: 600; }
.lstPopWrap .lstPopBox .box > p > span > img { font-size: 0; line-height: 0; max-width: 0.85rem; }
.lstPopWrap .lstPopBox .box > p > span::before { position: absolute; content: ""; width: 1px; height: 0.8rem; right: 0; top: 0.25rem; background: #c2c2c2; }

.lstPopWrap .lstPopBox .box .img { margin-top: 1.5rem; display: flex; align-items: center; justify-content: center; width: 100%; height: 21rem; font-size: 0; line-height: 0; border-radius: 1rem; overflow: hidden; background: #e1e1e1; }
.lstPopWrap .lstPopBox .box .img img { max-width: 100%; object-fit: contain; }

/* 030102_학교 공간 갤러리 : active */
.sub030102 .lst > ul > li > a,
.sub030102 .lst > ul > li > a::before,
.sub030102 .lst > ul > li > a > em,
.sub030102 .lst > ul > li > a > em::before { transition: 0.2s; }
.sub030102 .lst > ul > li > a:hover,
.sub030102 .lst > ul > li > a:focus { border-radius: 1rem 1rem 3rem 1rem; }
.sub030102 .lst > ul > li > a:hover::before,
.sub030102 .lst > ul > li > a:focus::before { border-radius: 1rem 1rem 3rem 1rem; opacity: 1; visibility: visible; }
.sub030102 .lst > ul > li > a:hover > em,
.sub030102 .lst > ul > li > a:focus > em { opacity: 1; visibility: visible; }
.sub030102 .lst > ul > li > a:hover > em::before,
.sub030102 .lst > ul > li > a:focus > em::before {  animation: pump 2s infinite linear; }

/* 0501_대구고교학점제 지원센터를 소개합니다. */
.sub0501 .topBox {background: linear-gradient(to right, #3d8afe 0%, #0054c2 100%); border-radius: 1rem 1rem 5rem 1rem; position: relative; }
.sub0501 .topBox .box { position: relative; overflow: hidden; padding: 2.5rem 27rem 2.5rem 3rem; min-height: 12.5rem; }
.sub0501 .topBox .box > img { position: absolute; right: 0; bottom: -15rem; z-index: 1; }
.sub0501 .topBox .box > span { position: relative; color: #fff; font-family: 'montserrat'; font-size: 1.3rem; z-index: 1; }
.sub0501 .topBox .box > span::before { position: absolute; content: ""; border-radius: 50%; background: linear-gradient(to bottom , #fff 0%, #3583f6 70%); width: 6rem; height: 6rem; border-radius: 50%; left: -1.25rem; top: -1.5rem; opacity: 0.2; z-index: -1; }
.sub0501 .topBox .box > p { position: relative; font-size: 1.1rem; font-weight: bold; color: #fff; margin-top: 0.7rem; z-index: 1; }
.sub0501 .midTxt { margin: 2.7rem 0 6rem; }
.sub0501 .midTxt p { font-size: 0.9rem; color: #000; line-height: 1.75rem; }
.sub0501 .midTxt p + p { margin-top: 1.5rem; }
.sub0501 .lst > ul { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.sub0501 .lst > ul > li { width: calc((100% - 2.5rem) / 3); border: 1px solid #D0D2D4; border-radius: 1rem; position: relative; padding: 3.25rem 1rem 3rem; min-height: 12.5rem; }
.sub0501 .lst > ul > li > span { position: absolute; top: 0; left: 50%; transform: translateX(-50%); color: #fff; display: inline-flex; align-items: center; justify-content: center; background: #005DAE; border-radius: 0 0 0.75rem 0.75rem; height: 2.5rem; width: 7.5rem; font-size: 0.9rem; font-weight: 600; }
.sub0501 .lst > ul > li > span.blue { background: #0079FE; }
.sub0501 .lst > ul > li > span.green { background: #00B496; }
.sub0501 .lst > ul > li > em { display: flex; align-items: center; justify-content: center; position: absolute; bottom: 0; left: 0; border-radius: 0 0 1rem 1rem; background: #f2f3f4; border-top: 1px solid #d0d2d4; width: 100%; height: 2rem; color: #000000; }
.sub0501 .lst > ul > li > em > i { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #fff; width: 1.3rem; height: 1.3rem; margin-right: 0.75rem; }

/* 과목 안내 */
.layer_popup{display:none;position:fixed;top:0;left:0;z-index:998;width:100%;height:100%;box-sizing:border-box;}
.layer_popup.active {display:block;}
.layer_popup:before{display:block;position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:#000;content:'';box-sizing:border-box;opacity:0.5;}
.layer_popup .inner{display:block;overflow:hidden;position:absolute;top:50%;left:50%;width:40rem;border-radius: 1rem;transform:translate(-50%, -50%);background: #fff;}
.layer_popup .inner > .tit {padding: 1.5rem 1rem;font-size: 1rem;}
.layer_popup .con_item,
.layer_popup .btn_item{display:block;position:relative;width:100%;box-sizing:border-box;background: #fff;}
.layer_popup .con_item{color:#1a1a1a;padding: 0 1rem 2rem;}
.layer_popup.con_item p {font-size: 1.25rem; margin-top: 1.5rem;}
.layer_popup .btn_item{padding: 0.5rem 1rem;background-color:#333;text-align:right;}
.layer_popup .btn_item .btn_close{font-size: .8rem;color:#fff;line-height:1;font-weight: 500;padding: 0;}
.layer_popup .btn_item .btn_close i {font-size: 1.2rem;padding-left: 0.25rem;}
.gobtn span {display: flex;align-items: center;flex-wrap: wrap;gap: 0.75rem 0.7rem;position: relative;justify-content: right;margin: -1.7rem 0 0;} /* Added */

/*** 반응형 ***/

@media (min-width: 1241px) {
    .sub0101 .subTitle,
    .sub0101 .subDetail,
    .sub0101 .tit2,
    .sub0101 .imgBox,
    .sub0101 .box_st1,
    .sub0101 .box_st2,
    .sub0101 .goLst > li,
    .sub0101 .goLst2 > li,
    .sub0101 .iTxt,
    .sub0101 .goLst3 > li,
    .sub0101 .iTxt,
    .sub0101 .lst4Box,
    .sub0101 .goLst5 { transform: translateY(20%); opacity: 0; transition: 0.3s ease-in-out; }

    .sub0101 .active .subTitle,
    .sub0101 .active .subDetail,
    .sub0101 .active .tit2,
    .sub0101 .active .imgBox,
    .sub0101 .active .box_st1,
    .sub0101 .active .box_st2,
    .sub0101 .active .goLst > li,
    .sub0101 .active .goLst2 > li,
    .sub0101 .active .iTxt,
    .sub0101 .active .goLst3 > li,
    .sub0101 .active .iTxt,
    .sub0101 .active .lst4Box,
    .sub0101 .active .goLst5 { transform: translateY(0); opacity: 1; }

    .sub0101 .section06.active .goLst5,
    .sub0101 .section05.active .lst4Box,
    .sub0101 .section01.active .subDetail,
    .sub0101 .section02.active .box_st1,
    .sub0101 .section04.active .goLst3 > li:first-child { transition-delay: 0.2s; }
    .sub0101 .section04.active .iTxt,
    .sub0101 .section04.active .goLst3 > li:last-child,
    .sub0101 .section01.active .tit2,
    .sub0101 .section02.active .goLst > li:first-child,
    .sub0101 .section03.active .goLst2 > li.first,
    .sub0101 .section03.active .goLst2 > li.second { transition-delay: 0.4s; }
    .sub0101 .section03.active .iTxt,
    .sub0101 .section03.active .goLst2 > li.third,
    .sub0101 .section01.active .imgBox,
    .sub0101 .section02.active .goLst > li:nth-child(2) { transition-delay: 0.6s; }
    .sub0101 .section02.active .goLst > li:nth-child(3) { transition-delay: 0.8s; }
    
}

@media (max-width: 1440px) {
    /* 0101_고교학점제란 */
    .sub0101 .imgBox img { max-width: 100%; }

    /* 010202_수강신청절차 */
    .sub010202 .lst01 li::after { width: 4.5rem; background-size: contain !important; height: 2.55rem; }

    /* 0501_대구고교학점제 지원센터를 소개합니다. */
    .sub0501 .topBox .box { padding: 2rem 34.72vw 2rem 2.5rem; }
    .sub0501 .topBox .box > img { max-width: 34.72vw; bottom: -18.06vw; }

    /* 030102_학교 공간 갤러리 */
    .lstPopWrap .lstPopBox .box .img { max-height: 47vh; height: auto; }

    /* 학교별 교육과정 */
    .sub020102 .pinIcon > span { height: 1.35rem; padding: 0 1rem; }
    .sub020102 .pinIcon > img { max-width: 1.4rem; }
    .sub020102 ul.mapTxtLst > li.donggu .pinIcon {top: 1%;left: 83%;}
    .sub020102 ul.mapTxtLst > li.bukgu .pinIcon {top: 12.5%;left: 45%;}
    .sub020102 ul.mapTxtLst > li.junggu .pinIcon {top: 50%;left: 53%;}
    .sub020102 ul.mapTxtLst > li.seogu .pinIcon {top: 44%;left: 38%;}
    .sub020102 ul.mapTxtLst > li.namgu .pinIcon {top: 69%;left: 49%;}
    .sub020102 ul.mapTxtLst > li.susung .pinIcon {top: 72%;left: 75%;}
    .sub020102 ul.mapTxtLst > li.dalseong .pinIcon {top: 27%;left: 15%;}
    .sub020102 ul.mapTxtLst > li.dalseo .pinIcon {top: 71%;left: 32%;}

    /* 맵뷰페이지 */
    .mapDetail .lft { width: calc(100% - 17.5rem); margin-right: 1rem; padding-right: 1rem; }
    .mapDetail .rgt { width: 16.5rem; }
    .mapDetail .rgt table tbody td a { padding: 0 0.5rem; font-size: 0.6rem; }
}

@media (max-width: 1240px) {
    /* 수강신청 바로가기 버튼 */
    .btnBox { margin: 2.5rem 0; }

    /* 020102_학교별 교육과정 */
    .sub020102 ul.mapTxtLst > li.map07 .mapPop,
    .sub020102 ul.mapTxtLst > li.map03 .mapPop,
    .sub020102 ul.mapTxtLst > li.map01 .mapPop { right: auto !important; left: 100%; }
    
    .sub020102 ul.mapTxtLst > li .mapPop,
    .sub020102 ul.mapTxtLst > li .schIco,
    .sub020102 ul.dalTxtLst > li .mapPop,
    .sub020102 ul.dalTxtLst > li .schIco,
    .sub020102 ul.gunMapTxtLst > li .mapPop,
    .sub020102 ul.gunMapTxtLst > li .schIco { display: none !important; }
    
    /* 0501_대구고교학점제 지원센터를 소개합니다. */
    .sub0501 .topBox .box { padding: 2rem 45vw 2rem 2.5rem; min-height: auto; }
    .sub0501 .topBox .box > img { max-width: 45vw; bottom: -23.5vw; }
    .sub0501 .midTxt { margin: 2.25rem 0 4.5rem; }

    /* 맵뷰페이지 */
    .mapDetail .lft { width: calc(100% - 21rem); }
    .mapDetail .rgt { width: 20rem; }
    
}

@media (max-width: 1024px) {
    .subDetail { padding: 1.9rem 16.5rem 1.9rem 2.25rem; }
    .subDetail > img { max-width: 15rem; bottom: -8rem; }
    
    .subDetail2 { padding: 1.9rem 16.5rem 1.9rem 2.25rem; }
    .subDetail2 > img { max-width: 17rem; bottom: 0rem; }

    /* 0101_고교학점제란 */
    .sub0101 .goLst { gap: 1.5rem 2rem; }
    .sub0101 .goLst > li { width: calc((100% - 4rem) / 3); }

    /* 010201_진로 학업 설계란 */
    .sub010201 .lst ul { gap: 4rem; }
    .sub010201 .lst ul li { width: calc((100% - 8rem) / 3); }
    .sub010201 .lst ul li > em::before { height: 1.8rem; }

    /* 020102_학교별 교육과정 */
    .sub020102 .mapLstWrap .mapColr,
    .sub020102 .dalsung { left: 1.5rem; }
    .sub020102 .gunWee,
    .sub020102 .allMap { right: 1.5rem; }
    .sub020102 .subDetail > img { max-width: 19rem; }
    .sub020102 .mapLstWrap { border-radius: 1.5rem; margin-top: 2rem; }

    /* 010203_대학 학과별 권장과목 알아보기 */
    .sub010203 ul > li img { max-width: 8rem; transform: translateX(-50%); }  
    .sub010203 ul > li:last-child img { max-width: 7rem; top: -6.75rem; transform: translateX(calc(-50% + 7.88vw)); }
    .sub010203 > a { width: 16rem; transform: none; left: 33vw; }
    .sub010203 > a > span { width: 1.35rem; height: 1.35rem; }

    /* 020101_고등학교 교육과정안내 */
    .sub020101 .subDetail > img { bottom: -11rem; }
    .sub020101 .bu_wnrn { margin-top: 1rem; }

    /* 020202_학교밖교육 꿈창작캠퍼스 안내 */
    .sub020202 .lst01 > li > span,
    .sub020202 .lineBox > ul > li > span { width: calc(100% - 2rem); min-width: auto; }

    /* 030101_학점제형 학교 공간 안내 */
    .sub030101 .rsp_img { margin-top: 2rem; }

    .sub020102 .subDetail > img { bottom: -7.5rem; max-width: 20rem; }
}

@media (max-width: 968px) {

    /* 020102_학교별 교육과정 */
    .sub020102 .mapLstWrap { padding: 35vw 1rem 40vw; } 
    .sub020102 .gunWee { width: 23.76vw; height: 23.76vw; top: 5.99vw; right: 1rem; }
    .sub020102 .gunWee .gunMapBox { width: 18.67vw; height: 14.57vw; }
    .sub020102 .dalsung { width: 35.12vw; height: 35.12vw; bottom: 6.2vw; left: 1rem; }
    .sub020102 .dalsung .mapTxtLst { width: 28.1vw; height: 22.42vw; }
    .sub020102 .allMap { width: 28.1vw; height: 25.52vw; bottom: 6.1vw; right: 1rem; }
    .sub020102 .allMap img { max-width: 13.22vw; }
    .sub020102 .mapLstWrap .mapColr { top: 4.65vw; left: 1rem; }
    .sub020102 .mapLstBox { width: 100%; height:auto; }    
    
    .sub020102 .dalsung .dalMapBox { width: 26.65vw; height: 21.18vw; }

    /* 010202_수강신청절차 */
    .sub010202 .lst01 { gap: 2.5rem; }
    .sub010202 .lst01 li { width: 100%; }
    .sub010202 .lst01 li::after { left: 50%; right: auto; transform: translateX(-50%) rotate(90deg); top: auto; bottom: -1.25rem; z-index: -1; }
    .lst03 { gap: 2rem; }
    .lst03 > li { width: calc((100% - 2rem) / 2); } 
    .lst03 > li:nth-child(1) { order: 1; }
    .lst03 > li:nth-child(2) { order: 2; }
    .lst03 > li:nth-child(3) { order: 4; }
    .lst03 > li:nth-child(4) { order: 3; }
    .lst03 > li:nth-child(5) { order: 5; }
    .lst03 > li:nth-child(6) { order: 6; }
    .lst03 > li:nth-child(2):before { right: 50%; transform: translateX(50%) rotate(90deg); bottom: -1rem; top: auto; }
    .lst03 > li:nth-child(5):before { right: 50%; transform: translateX(50%) rotate(90deg); top: -1rem; left: auto; }

    /* 0103_자주 묻는 질문 */
    .sub0103 .lst03 > li { width: calc((100% - 2.25rem) / 2); }

    /* 020201_대구공동교육과정안내 */
    .lineBox > ul { width: 100%; }
    .lineBox > ul > li > span { width: calc(100% - 2rem); }
    .sub020202 .lst01 > li { width: 100%; } 

    /* 맵뷰페이지 */
    /* .mapLstView.bukgu { width: 100%; height: 87.4vw; }
    .mapLstView.donggu { width: 100%; height: 93.18vw; }
    .mapLstView.susung { width: 100%; height: 67.77vw; }
    .mapLstView.junggu { width: 100%; height: 52.17vw; }
    .mapLstView.namgu { width: 100%; height: 79.24vw; }
    .mapLstView.dalseo { width: 100%; height: 81.4vw; }
    .mapLstView.seogu { width: 100%; height: 27.5rem; }
    .mapLstView.dalseong { width: 100%; height: 56.82vw; }
    .mapLstView.dalseong02 { width: 100%; height: 66.01vw; }
    .mapLstView.gunWeeMap { width: 100%; height: 67.77vw; } */
    .mapLstView > img { max-width: 100%; height: 100%; }

    .sub020102.view .mapLstWrap { flex-wrap: wrap; padding: 2.5rem 1rem 5rem; }
    .sub020102.view .mapLstWrap .mapColr { position: unset; flex-direction: row; width: 100%; } 
    .mapDetail { position: unset; width: 100%; margin: 2rem 0 3rem; }
}

@media (max-width: 860px) {
    /* 0101_고교학점제란 */
    h3.subTitle { font-size: 1.4rem; margin: 1rem 0 1.5rem; }
    h3.subTitle img { max-width: 2.25rem; }
    .sub0101 [class^='section'] .tit2 { margin-top: 3rem !important; }
    .sub0101 .goLst { gap: 1.25rem; margin-top: 2rem; }
    .sub0101 .goLst > li { width: 100%; margin: 0 !important; }
    .sub0101 .goLst > li.last > ul > li { padding: 0.9rem 0.5rem; }
    .sub0101 .goLst2 { gap: 1rem; }
    .sub0101 .goLst2 > li.first,
    .sub0101 .goLst2 > li.second { width: 100%; }
    .sub0101 .goLst2 > li > .box p.top { display: inline-block; } 
    .sub0101 .goLst2 > li > .box p.top::before { right: -0.35rem; }
    .sub0101 .iTxt { margin-top: 3rem; }
    .sub0101 .goLst4 > li { position: relative; flex: none; width: 100%; } 
    .sub0101 .goLst4::before { display: none; }
    .sub0101 .goLst4 > li:first-child::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/arrowRight.png')no-repeat center center; left: 50%; transform: translateX(-50%) rotate(90deg); bottom: -1.55rem; width: 1.25rem; height: 0.8rem; }
    .sub0101 .lst4Box > span { width: calc(100% - 2rem); } 

    /* 010201_진로 학업 설계란 */
    .sub010201 .lst ul { gap: 4rem 2.5rem; }
    .sub010201 .lst ul li { width: calc((100% - 5rem) / 3); }
    
    /* 030102_학교 공간 갤러리 */
    .sub030102 .lst > ul { gap: 1.5rem; }
    .sub030102 .lst > ul > li { width: calc((100% - 3rem) / 3); }
    .sub030102 .lst > ul > li > a > span { font-size: 0.75rem; height: 2rem; }
    .sub0501 .topBox .box > img { bottom: -20vw;} 
    .lstPopWrap .lstPopBox { width: calc(100% - 2rem); padding: 3.5rem 1.5rem 2rem; }

    /* 0501_대구고교학점제 지원센터를 소개합니다. */
    .sub0501 .lst > ul > li { width: calc((100% - 1.25rem) / 2); }
    .sub0501 .midTxt { margin: 2rem 0 4rem; }
    .sub0501 .midTxt p { line-height: 1.5rem; font-size: 0.85rem; }
    .sub0501 .midTxt p + p { margin-top: 1rem; }

}

@media (max-width: 768px) {
    .subDetail { padding: 1.5rem 2rem; min-height: auto; border-radius: 1rem !important; }
    .subDetail > img { display: none; }
    
    .subDetail2 { padding: 1.5rem 2rem; min-height: auto; border-radius: 1rem !important; }
    .subDetail2 > img { display: none; }

    .regiBtn { height: 2.75rem; padding: 0 1rem; } 
    .regiBtn > span { margin-left: 2rem; width: 1.35rem; height: 1.35rem; }
    .regiBtn > span > img { max-width: 0.6rem; }

    /* 020102_학교별 교육과정 */
    .sub020102 .pinIcon > span { padding: 0 0.75rem; font-size: 0.75rem; }
    .sub020102 .pinIcon > img { max-width: 1.2rem !important; }
    .sub020102 ul.mapTxtLst > li.donggu .pinIcon {top: 3%;left: 80%;}
    .sub020102 ul.mapTxtLst > li.bukgu .pinIcon {top: 14%;left: 45%;}
    .sub020102 ul.mapTxtLst > li.junggu .pinIcon {top: 48.5%;left: 51%;}
    .sub020102 ul.mapTxtLst > li.seogu .pinIcon {top: 44%;left: 38%;}
    .sub020102 ul.mapTxtLst > li.namgu .pinIcon {top: 62.5%;left: 47%;}
    .sub020102 ul.mapTxtLst > li.susung .pinIcon {top: 68%;left: 70%;}
    .sub020102 ul.mapTxtLst > li.dalseong .pinIcon {top: 30%;left: 12.5%;}
    .sub020102 ul.mapTxtLst > li.dalseo .pinIcon {top: 67.5%;left: 35%;}
    .sub020102 .schIco  { font-size: 0.55rem !important; }
    .sub020102 .mapAllBtn { height: 2.25rem; margin-top: 1rem; width: auto; padding: 0 1.5rem; }

    /* 010201_진로 학업 설계란 */
    .sub010201 .lst { margin-top: 3rem; }
    .sub010201 .lst ul { gap: 2rem; }
    .sub010201 .lst ul li { width: calc((100% - 2rem) / 2); height: auto; }
    .sub010201 .lst ul::before { display: none; } 

    .sub010201 .lst ul li:nth-child(1) { order: 1; }
    .sub010201 .lst ul li:nth-child(2) { order: 3; }
    .sub010201 .lst ul li:nth-child(3) { order: 5; }
    .sub010201 .lst ul li:nth-child(4) { order: 2; }
    .sub010201 .lst ul li:nth-child(5) { order: 4; }
    .sub010201 .lst ul li > em { display: none; }

    /* 010202_수강신청절차 */
    .sub010202 .lst02 { gap: 3.5rem; }
    .sub010202 .lst02 > li::before { bottom: -1.75rem; }
    .sub010202 .lst02 > li:last-child > ul { padding: 0; }
    .sub010202 .lst02::before { display: none; }
    .sub010202 .lst02 > li > ul > li { width: 100%; }
    .sub010202 .lst01 li > .img { margin: 1.25rem 0 1.75rem; }
    .sub010202 .lst01 li > .img > img { max-width: 4rem; }
    .sub010202 .lst01 li::after { width: 3.5rem; bottom: -1.5rem; }
    .sub010202 .lst02 > li > span { font-size: 0.85rem; padding: 0.5rem 1rem; }
    .sub010202 .lst02 > li .img img { max-width: 1.85rem; }
    .sub010202 .lst02 > li { padding-left: 3.5rem; }
    .sub010202 .lst02 > li:last-child > ul { margin-top: 1.25rem; gap: 1rem; }
    .sub010202 .lst02 > li:last-child > ul > li > span { height: 1.5rem; width: 3.25rem; font-size: 0.75rem; }
    .sub010202 .lst02 > li:last-child > ul > li > p { margin-top: 0.75rem; font-size: 0.75rem; }

    /* 010203_대학 학과별 권장과목 알아보기 */
    .sub010203 ul > li img { max-width: 7rem; transform: translateX(calc(-50% - 3vw)); }  
    .sub010203 ul > li:last-child img { max-width: 6rem; top: -5.75rem; transform: translateX(calc(-50% + 7.88vw)); }
    .sub010203 > a { width: 15rem; transform: none; left: 29vw; height: 3.75rem; font-size: 0.85rem; }

    /* 0103_자주 묻는 질문 */
    .sub0103 .titWrap > span { font-size: 1.3rem; }
    .sub0103 .qnaLst > ul > li > .answer .qrBox ul li { width: 100%; }
    .sub0103 .qnaLst::before { width: 6.5rem; height: 5.9rem; }
    .sub0103 .qnaLst::after { width: 7rem; height: 5.7rem; }
    .sub0103 .qnaLst > ul > li > .answer {padding: .5rem 0 0 6rem;}
    .sub0103 .qnaLst > ul > li > .answer > img { max-width: 2.35rem; }
    .sub0103 .qnaLst > ul > li > .answer.show {padding: 1.3rem 1rem 1.3rem 6rem;min-height: 5rem;margin-top: 0;}
    
    .sub0103 .qnaLst > ul > li > .answer::before { left: 5rem; }
    .sub0103 .mgt30,
    .sub0103 .lst03,
    .sub0103 .qnaLst > ul > li > .answer .tbl_st,
    .sub0103 .qnaLst > ul > li > .answer .qrBox { margin-top: 1rem !important; }
    .sub0103 .qnaLst > ul > li > .answer .qrBox ul li span { height: 2.25rem; font-size: 0.8rem; }
    .sub0103 .qnaLst > ul > li > .answer .qrBox ul li { padding: 3rem 1rem 1rem; }

    /* 020201_대구공동교육과정안내 */
    .lineBox { padding: 2rem; }
    .lineBox::before { top: 4.5rem; }
    .lineBox > span { height: 2.5rem; }
    .lineBox > ul { margin-top: 3rem; }
    .lineBox > ul > li > span { height: 2.25rem; min-width: auto; }
    .lineBox > ul > li { min-height: 10.5rem; padding: 3.5rem 1rem 1rem; }
    .sub020201 .qnaWrap > ul > li p.qTxt { min-height: 2.75rem; font-size: 0.85rem; padding: 0.5rem 1.5rem 0.5rem 3.75rem; }
    .sub020201 .qnaWrap > ul > li p.qTxt::before { width: 2.75rem; height: 2.75rem; }
    .sub020201 .qnaWrap > ul > li p.ATxt { padding: 1.25rem; }

    /* 020202_학교밖교육 꿈창작캠퍼스 안내 */
    .sub020202 .subTitle > img { max-width: 2.75rem; margin-right: 0.5rem; }
    .sub020202 .lineBox::before { top: 4.25rem; }
    .sub020202 .lineBox > ul { margin-top: 2.5rem; }

    /* 030101_학점제형 학교 공간 안내 */
    .sub030101 .rsp_img { margin-top: 1.5rem; }

    /* 030102_학교 공간 갤러리 */
    .sub030102 .lst { margin-top: 2rem; } 
    .sub030102 .lst > ul > li { width: calc((100% - 1.5rem) / 2); }
    .sub030102 .lst > ul > li > a > span { font-size: 0.75rem; height: 2rem; }

    /* 맵뷰페이지 */
    .mapDetail .lft { width: 100%; margin: 0; padding: 0; border: none; }
    .mapDetail .lft > p { margin-top: 0.5rem; }
    .mapDetail .rgt { width: 100%; margin-top: 1rem; }
    .sub020102.view ul.mapDotLst > li > .schIco { font-size: 0.7rem !important; } 
    .sub020102.view ul.mapDotLst > li > .schIco::before { width: 1rem !important; height: 1.2rem !important; background-size: contain !important; }
    .sub020102.view ul.mapDotLst > li > a > img { max-width: 1.25rem; transform: translateX(calc(-50% + 0.45rem)); bottom: calc(100% + 0.3rem); }
    .sub020102.view ul.mapDotLst > li.actv > a::after { width: 0.5rem !important; height: 0.5rem !important; }
    .sub020102.view ul.mapDotLst > li.actv > a::before { width: 0.6rem !important; height: 0.6rem !important; }

	/* 과목 안내 */
    .layer_popup .inner {max-width:90%;}
}

@media (max-width: 580px) {

    /* 0101_고교학점제란 */
    .sub0101 [class^='section'] .tit2 { margin-top: 2rem !important; }
    .sub0101 .goLst2 > li.second> ul li { width: 100%; }
    .sub0101 .goLst3 > li > .box > div,
    .sub0101 .goLst3 > li > .box2 > div { flex: none; width: 100%; }
    .sub0101 .goLst3 > li > .box2::before { width: 100%; height: 1px; }
    .sub0101 .goLst3 > li > .box::before { top: 6.35rem; display: none; }  
    .sub0101 .goLst3 > li > .box { padding: 1rem; gap: 0; }
    .sub0101 .goLst3 > li > .box > p { width: 100%; text-decoration: underline; text-align: center; position: unset; transform: none; margin-top: 1rem; }
    .sub0101 .goLst3 > li > .box .rgt { margin-top: 2rem; }

    .sub0101 .goLst3 > li > .box .rgt::before { position: absolute; content: ""; background: url('/images/dgedu/web/hakjeom/sub/plusIco.png')no-repeat center center; background-size: contain; width: 1rem; height: 1rem; top: -1.5rem; left: 50%; transform: translateX(-50%); }

    .sub0101 .goLst2 > li { padding: 3.25rem 1rem 1rem; }
    .sub0101 .goLst2 > li.second> ul { margin-top: 1rem; }
    .sub0101 .goLst3 > li > .box > p::before { display: none; }
    .sub0101 .goLst2 > li > span.num { height: 2rem; width: 2.25rem; font-size: 0.8rem; }
    .sub0101 .goLst3 > li > span { width: calc(100% - 2rem); font-size: 0.8rem; text-align: center; }

     /* 010201_진로 학업 설계란 */
    .sub010201 .lst { margin-top: 2.5rem; }
    .sub010201 .lst ul { gap: 1.5rem; }
    .sub010201 .lst ul li { width: 100%; }
    
    /* 010203_대학 학과별 권장과목 알아보기 */
    .sub010203 ul > li img { max-width: 6rem; transform: none; left: 1rem; }  
    .sub010203 ul > li:last-child img { max-width: 5rem; top: -4.75rem; transform: none; right: 1rem; left: auto; }
    .sub010203 > a { width: 13.5rem; transform: none; left: 25vw; height: 3.7rem; font-size: 0.8rem; top: 1rem; }
    .sub010203 > a > span img { max-width: 0.6rem; }
    .sub010203 ul { flex-wrap: wrap; position: relative; }
    .sub010203 ul::before { display: none; }
    .sub010203 ul > li { position: unset; padding: 1.25rem 1rem; font-size: 0.75rem; width: 100%; flex: none; min-height: 5rem; }
    .sub010203 ul > li + li { border-top: 1px solid #c4ced7; }

    /* 020102_학교별 교육과정 */
    .sub020102 .mapLstWrap .mapColr { gap: 3.6vw; padding: 0.75rem; }
    .sub020102 .mapLstWrap .mapColr li { padding-left: 5vw; font-size: 2.7vw; }
    .sub020102 .mapLstWrap .mapColr li::before { width: 2.5vw; height: 2.5vw; }

    .sub020102 .pinIcon > span { padding: 0.1rem 0.5rem; font-size: 2.25vw; height: auto; }
    .sub020102 .pinIcon > img { max-width: 1rem !important; }
    .sub020102 ul.mapTxtLst > li.donggu .pinIcon {top: 3%;left: 80%;}
    .sub020102 ul.mapTxtLst > li.bukgu .pinIcon {top: 14%;left: 45%;}
    .sub020102 ul.mapTxtLst > li.junggu .pinIcon {top: 45%;left: 49.5%;}
    .sub020102 ul.mapTxtLst > li.seogu .pinIcon {top: 42%;left: 38%;}
    .sub020102 ul.mapTxtLst > li.namgu .pinIcon {top: 62%;left: 47%;}
    .sub020102 ul.mapTxtLst > li.susung .pinIcon {top: 68%;left: 70%;}
    .sub020102 ul.mapTxtLst > li.dalseong .pinIcon {top: 30%;left: 12.5%;}
    .sub020102 ul.mapTxtLst > li.dalseo .pinIcon {top: 67.5%;left: 35%;}
    .sub020102 .gunMapBox .pinIcon { top: -18%; right: 2%; }
    .sub020102 .schIco  { font-size: 1.9vw !important; }

    /* 010202_수강신청절차 */
    .lst03 > li > p:not(.bu_wnrn) { min-height: 7rem; }
    .lst03 > li { width: 100%; padding: 3rem 1rem 1.25rem; }
    .lst03 > li:nth-child(1) { order: 1; }
    .lst03 > li:nth-child(2) { order: 2; }
    .lst03 > li:nth-child(3) { order: 3; }
    .lst03 > li:nth-child(4) { order: 6; }
    .lst03 > li:nth-child(5) { order: 5; }
    .lst03 > li:nth-child(6) { order: 4; }
    .lst03 > li > span { height: 2rem; font-size: 0.85rem; }
    .lst03 > li:nth-child(1):before,
    .lst03 > li:nth-child(5):before,
    .lst03 > li:nth-child(6):before { top: auto; left: 50%; transform: translateX(-50%) rotate(-90deg); bottom: -1rem; right: auto; }
    .lst03 > li:nth-child(1):before { transform: translateX(-50%) rotate(90deg); }

    /* 0103_자주 묻는 질문 */
    .sub0103 .lst03 > li { width: 100%; }
    .sub0103 .qnaLst::before { width: 5.5rem; height: 5rem; }
    .sub0103 .qnaLst::after { width: 6rem; height: 4.7rem; }
    .sub0103 .titWrap .qna { font-size: 1.5rem; gap: 0.35rem; }
    .sub0103 .titWrap .qna span.txtQ,
    .sub0103 .titWrap .qna span.txtA { font-size: 1.75rem; }
    .sub0103 .qnaLst > ul > li p.question::before { width: 2.5rem; height: 2.5rem; font-size: 1rem; }
    .sub0103 .qnaLst > ul > li p.question { font-size: 0.85rem; padding: 0.35rem 1rem 0.35rem 2.25rem;  }
    .sub0103 .qnaLst > ul > li + li { margin-top: 2rem; }
    .sub0103 .qnaLst > ul > li > .answer .inTblStar li { padding: 0; }
    .sub0103 .qnaLst > ul > li > .answer .inTblStar li span { position: unset; }
    .sub0103 .qnaLst > ul > li > .answer {padding: .5rem 0 0 4.5rem; }
    .sub0103 .qnaLst > ul > li > .answer.show {padding: 1rem 1rem 1rem 4.5rem;}
    .sub0103 .qnaLst > ul > li > .answer::before { display: none; }
    .sub0103 .qnaLst > ul > li > .answer > img {/* display: none; */}

    /* 030102_학교 공간 갤러리 */
    .lstPopWrap .lstPopBox { padding: 3rem 1rem 1.5rem; }
    .lstPopWrap .lstPopBox > span { max-width: none; width: calc(100% - 2rem); padding: 0.5rem 3rem; min-width: auto; }    
    .lstPopWrap .lstPopCls { right: 1.5rem; top: 0.5rem; width: 1.35rem; height: 1.35rem; font-size: 0.9rem; }
    .lstPopWrap .lstPopBox .box .img { margin-top: 1rem; }

    /* 020201_대구공동교육과정안내 */
    .lineBox { padding: 2rem 1rem; }
    .lineBox::before { top: 4.25rem; width: 13.1rem; height: 2.75rem; }
    .lineBox > span { height: 2.25rem; width: 10rem; font-size: 0.85rem; }
    .lineBox > ul { gap: 1rem; margin-top: 2.5rem; }
    .lineBox > ul > li { width: calc((100% - 1rem) / 2); }
    .lineBox > ul > li > span { height: 2rem; min-width: auto; font-size: 0.85rem; }
    .lineBox > ul > li { min-height: 8.5rem; padding: 3.25rem 1rem 1rem; font-size: 0.75rem; }
    .sub020201 .qnaWrap > ul > li p.qTxt { min-height: 2.5rem; font-size: 0.8rem; padding: 0.5rem 1rem 0.5rem 3.25rem; }
    .sub020201 .qnaWrap > ul > li p.qTxt::before { width: 2.5rem; height: 2.5rem; font-size: 1rem; }
    .sub020201 .qnaWrap > ul > li p.ATxt { padding: 1rem; font-size: 0.75rem; }

    .btnBox { margin: 1.5rem 0; }
    .regiBtn { height: 2.5rem; font-size: 0.8rem; }
    .regiBtn > span { width: 1.15rem; height: 1.15rem; margin-left: 1.25rem; }
    .regiBtn > span > img { max-width: 0.5rem; }
    
    .btnBox2 { margin: 1.5rem 0; }

    /* 020202_학교밖교육 꿈창작캠퍼스 안내 */
    .sub020202 .lst04 > li > span { font-size: 0.85rem; height: 2rem; }
    .sub020202 .lst04 > li { padding: 3rem 1rem 1rem; width: calc((100% - 1rem) / 2); }
    .sub020202 .lst04 { gap: 1rem; }

    /* 0501_대구고교학점제 지원센터를 소개합니다. */
    .sub0501 .topBox .box { padding: 2rem; }
    .sub0501 .topBox .box > img { display: none; }
    .sub0501 .topBox .box > span::before { width: 5rem; height: 5rem; }
}

@media (max-width: 480px) {
    .subDetail { padding: 1.25rem 1.5rem; }
    .subDetail span { font-size: 1.1rem; }
    .subDetail p { font-size: 0.75rem; margin-top: 0.85rem; }
    
    .subDetail2 { padding: 1.25rem 1.5rem; }
    .subDetail2 span { font-size: 1.1rem; }
    .subDetail2 p { font-size: 0.75rem; margin-top: 0.85rem; }

    /* 0101_고교학점제란 */
    h3.subTitle { font-size: 1.2rem; margin: 0 0 1rem; }
    h3.subTitle img { max-width: 1.75rem; }

    /* 020102_학교별 교육과정 */
    .sub020102 .pinIcon > span { font-size: 2.15vw; height: auto; }
    .sub020102 .pinIcon > img { max-width: 0.85rem !important; }
    .sub020102 ul.mapTxtLst > li.donggu .pinIcon {top: 3%;left: 80%;}
    .sub020102 ul.mapTxtLst > li.bukgu .pinIcon {top: 14%;left: 45%;}
    .sub020102 ul.mapTxtLst > li.junggu .pinIcon {top: 42.5%;left: 49.5%;}
    .sub020102 ul.mapTxtLst > li.seogu .pinIcon {top: 42%;left: 38%;}
    .sub020102 ul.mapTxtLst > li.namgu .pinIcon {top: 60%;left: 47%;}
    .sub020102 ul.mapTxtLst > li.susung .pinIcon {top: 62.5%;left: 70%;}
    .sub020102 ul.mapTxtLst > li.dalseong .pinIcon {top: 30%;left: 12.5%;}
    .sub020102 ul.mapTxtLst > li.dalseo .pinIcon {top: 67.5%;left: 35%;}
    .sub020102 .gunMapBox .pinIcon { top: -20%; right: 4%; }
    .sub020102 .dalMapBox .pinIcon { right: 2%; top: -25%; }
    .sub020102 .schIco  { font-size: 1.9vw !important; }
    .sub020102 .schIco::before { width: 0.6rem !important; height: 0.75rem !important; background-size: contain !important; }

    /* 010202_수강신청절차 */
    .sub010202 .lst01 { gap: 2rem; }
    .sub010202 .lst01 li::after { width: 2.75rem; height: 1.5rem; bottom: -1rem; }
    .sub010202 .lst01 li > .txt { font-size: 0.7rem; }
    .sub010202 .lst01 li > .txt > span { font-size: 0.85rem; }
    .sub010202 .lst01 li > span { height: 1.5rem; font-size: 0.95rem; }
    .sub010202 .lst01 li > .img { margin: 1rem 0 1.25rem; }
    .sub010202 .lst01 li > .img > img { max-width: 3.75rem; }
    .sub010202 .lst01 li::before { width: 10rem; height: 10rem; }
    .sub010202 .lst02 > li > span { font-size: 0.8rem; padding: 0.35rem 0.75rem; }
    .sub010202 .lst02 > li > p { font-size: 0.75rem; margin-top: 0.75rem; }
    .sub010202 .lst02 > li .img img { max-width: 1.5rem; }
    .sub010202 .lst02 > li:last-child > p { font-size: 0.8rem; margin-top: 1rem; }
    .sub010202 .lst02 > li { padding-left: 3rem; }
    .sub010202 .lst02 > li:last-child > ul { margin-top: 0.75rem; gap: 0.5rem; }
    .sub010202 .lst02 > li:last-child > ul > li > span { height: 1.35rem;  }
    .sub010202 .lst02 > li:last-child > ul > li > p { margin-top: 0.5rem; font-size: 0.7rem; }

    /* 0103_자주 묻는 질문 */
    .sub0103 .qnaLst::before { width: 4.5rem; height: 4rem; }
    .sub0103 .qnaLst::after { width: 5rem; height: 3.7rem; }
    .sub0103 .titWrap .qna { font-size: 1.35rem; gap: 0.25rem; }
    .sub0103 .titWrap .qna span.txtQ,
    .sub0103 .titWrap .qna span.txtA { font-size: 1.5rem; }
    .sub0103 .qnaLst > ul > li p.question::before { width: 2.25rem; height: 2.25rem; font-size: 0.9rem; left: -0.75rem; }
    .sub0103 .qnaLst > ul > li p.question { font-size: 0.8rem; padding: 0.25rem 1rem 0.25rem 1.85rem; width: calc(100% - 0.75rem); margin-left: 0.75rem; }
    .sub0103 .qnaLst > ul > li + li { margin-top: 1.5rem; }
    .sub0103 .qnaLst > ul > li > .answer > img { max-width: 2rem; left: 0.75rem; top: 1rem; }
    .sub0103 .qnaLst > ul > li > .answer {padding: .5rem 0 0 3.5rem;}
    .sub0103 .qnaLst > ul > li > .answer.show {padding: 1rem 1rem 1rem 3.5rem;}
    .sub0103 .qnaLst > ul > li > .answer::before { top: 1rem; left: 3.6rem; }
    .sub0103 .qnaLst > ul > li > .answer .qrBox ul li span { font-size: 0.75rem; padding: 0 0.75rem; }

    /* 020201_대구공동교육과정안내 */
    .lineBox::before { display: none; }
    .lineBox > ul { margin-top: 1rem; position: relative; }
    .lineBox > ul::before { position: absolute; content: ""; height: 100%; left: 50%; transform: translateX(-50%); width: 1px; background: #C4CED7; top: -2rem; z-index: -1; }
    .sub020202 .lineBox > span { width: 100%; }
    .lineBox > ul > li { width: 100%; }

    /* 020202_학교밖교육 꿈창작캠퍼스 안내 */
    .sub020202 .subTitle > img { max-width: 2rem; margin-right: 0.25rem; }
    .sub020202 .box_st_img { padding: 0 1rem; }
    .sub020202 .lst01 > li > span, .sub020202 .lineBox > ul > li > span { font-size: 0.85rem; height: 2.25rem; }
    .sub020202 .lst01 > li { padding: 3rem 1rem 1rem; }
    .sub020202 .lineBox > ul { margin-top: 1.5rem; }
    .sub020202 .lineBox > ul > li { min-height: 5rem; }
    .sub020202 .lst02 > li { line-height: 1.5rem; font-size: 0.7rem; padding-left: 0; flex-direction: column; display: flex; position: relative; padding-left: 1rem; gap: 0.25rem; }
    .sub020202 .lst02 > li::before { content: ''; position: absolute; top: 2.25rem; left: 0.25rem; width: 3px; height: 9px; border-radius: 3px; background: #3d63cd; transform: rotate(-35deg); -webkit-transform: rotate(-35deg); }
    .sub020202 .lst02 > li > span { position: unset; height: 1.5rem; width: 6rem; font-size: 0.7rem; margin-left: -1rem; }
    .sub020202 .lst04 { flex-wrap: wrap; }
    .sub020202 .lst04 > li { width: 100%; }

    /* 030102_학교 공간 갤러리 */
    .sub030102 .lst { margin-top: 1.5rem; }
    .sub030102 .lst > ul { gap: 1rem; }
    .sub030102 .lst > ul > li { width: 100%; }
    .sub030102 .lst > ul > li > a > span { font-size: 0.7rem;  }

    /* 0501_대구고교학점제 지원센터를 소개합니다. */
    .sub0501 .topBox { border-radius: 1rem 1rem 3rem 1rem; }
    .sub0501 .topBox .box { padding: 1.5rem 1rem; }
    .sub0501 .topBox .box > span::before { width: 3rem; height: 3rem; left: -0.5rem; top: -0.5rem; }
    .sub0501 .topBox .box > span { font-size: 1.15rem; }
    .sub0501 .topBox .box > p { font-size: 1rem; margin-top: 0.5rem; }
    .sub0501 .midTxt { margin: 1.5rem 0 2.5rem; }
    .sub0501 .lst > ul > li { width: 100%; min-height: 10.5rem; }
    .sub0501 .lst > ul > li > span { height: 2.25rem; font-size: 0.85rem; }

    /* 030102_학교 공간 갤러리 */
    .lstPopWrap .lstPopBox { padding: 2.75rem 1rem 1.5rem; }
    .lstPopWrap .lstPopBox > span { padding: 0.5rem 2.5rem; font-size: 0.8rem; }    
    .lstPopWrap .lstPopCls {width: 1.15rem; height: 1.15rem; font-size: 0.8rem; }
    .lstPopWrap .lstPopBox .box .img { margin-top: 0.5rem; }
    .lstPopWrap .lstPopBox .box > p,
    .lstPopWrap .lstPopBox .box > p > span { font-size: 0.7rem; }
    .lstPopWrap .lstPopBox .box > p > span { margin-right: 0.4rem; padding-right: 0.4rem; }
    .lstPopWrap .lstPopBox .box > p > span::before { height: 0.6rem; top: 0.25rem; }

    /* 맵뷰페이지 */
    .sub020102.view .mapLstWrap { padding: 1.5rem 1rem 3.5rem;} 
    .mapDetail .lft > p { margin-top: 0.35rem; }
    .mapDetail { margin: 1rem 0 1.5rem; }
    .sub020102.view .mapLstWrap .mapColr { flex-wrap: wrap; }
    .sub020102.view .mapLstWrap .mapColr li { font-size: 0.7rem !important; }
    .mapDetail .rgt table tbody td a { height: auto; padding: 0.15rem 0.5rem; }
    .mapDetail .rgt {  margin-top: 0.75rem; }
    .sub020102.view ul.mapDotLst > li > .schIco { font-size: 0.65rem !important; } 
    .sub020102.view ul.mapDotLst > li > .schIco::before { width: 0.9rem !important; height: 1.1rem !important; background-size: contain !important; }
    .sub020102.view ul.mapDotLst > li > a > img { max-width: 1rem; transform: translateX(calc(-50% + 0.38rem)); bottom: calc(100% + 0.15rem); }
    .sub020102.view ul.mapDotLst > li.actv > a::after { bottom: calc(100% + 0.1rem); }
    .sub020102.view ul.mapDotLst > li.actv > a::before { bottom: calc(100% + 0.05rem); }
    .mapDetail .rgt .tbl_st { overflow-x: auto; }
    .mapDetail .rgt .tbl_st::-webkit-scrollbar,
    .mapDetail .rgt .tbl_st::-webkit-scrollbar-track,
    .mapDetail .rgt .tbl_st::-webkit-scrollbar-thumb { height: 8px !important; }
    .mapDetail .rgt table { width: 360px; }
    
    .btnBox { margin: 1.5rem 0; }
    .regiBtn { height: 2.5rem; font-size: 0.8rem; }
    .regiBtn > span { width: 1.15rem; height: 1.15rem; margin-left: 1.25rem; }
    .regiBtn > span > img { max-width: 0.5rem; }
    
    .btnBox2 { margin: 1.5rem 0; }
     /* 과목 안내 */
    .layer_popup .inner {max-width:90%;}

}

@media (max-width: 380px) {

    /* 020102_학교별 교육과정 */
    .sub020102 .pinIcon { gap: 0.2rem !important; }
    .sub020102 .pinIcon > img { max-width: 0.75rem !important; }

    /* 010203_대학 학과별 권장과목 알아보기 */
    .sub010203 { padding-top: 8.5rem; }
    .sub010203 ul > li img { max-width: 5rem; }  
    .sub010203 ul > li:last-child img { max-width: 4rem; top: -4.25rem; }
    .sub010203 > a { width: 13rem; transform: none; left: 23vw; height: 3.25rem; font-size: 0.75rem; top: 0.5rem; padding-bottom: 0.85rem; }
    .sub010203 > a > span { width: 1.15rem; height: 1.15rem; margin-left: 0.35rem; }
    .sub010203 > a > span img { max-width: 0.5rem; }
    .sub010203 ul > li { padding: 1.25rem 1rem; font-size: 0.75rem; }

    /* 맵뷰페이지 */
    .sub020102.view ul.mapDotLst > li > .schIco { font-size: 0.6rem !important; } 
    .sub020102.view ul.mapDotLst > li > .schIco::before { width: 0.8rem !important; height: 1rem !important; background-size: contain !important; }
    
    .btnBox { margin: 1.5rem 0; }
    .regiBtn { height: 2.5rem; font-size: 0.8rem; }
    .regiBtn > span { width: 1.15rem; height: 1.15rem; margin-left: 1.25rem; }
    .regiBtn > span > img { max-width: 0.5rem; }
    
    .btnBox2 { margin: 1.5rem 0; }
    
}

@media (max-width: 340px) {
    /* 010203_대학 학과별 권장과목 알아보기 */
    .sub010203 > a { background: #0079FE; border-radius: 3rem; left: 0; padding: 0 1rem; height: 2.25rem; width: auto; }
    /* .sub010203 ul > li img { transform: translateX(-50%); }  
    .sub010203 ul > li:last-child img { transform: translateX(-50%); } */

    /* 0103_자주 묻는 질문 */
    .sub0103 .qnaLst::before { width: 4rem; height: 3.5rem; }
    .sub0103 .qnaLst::after { width: 4.5rem; height: 3.2rem; }
    .sub0103 .lst03 > li { padding: 2.5rem 0.75rem 1rem; }
    .sub0103 .lst03 > li > p:not(.bu_wnrn) { padding: 0.5rem; font-size: 0.7rem; }
    .sub0103 .lst03 > li > span { font-size: 0.7rem; height: 1.75rem; }
    .sub0103 .qnaLst > ul > li + li { margin-top: 1.35rem; }
    .sub0103 .qnaLst > ul > li > .answer > img { max-width: 1.75rem; }
    .sub0103 .qnaLst > ul > li > .answer { padding: 1rem 1rem 1rem 4.25rem; }
    .sub0103 .qnaLst > ul > li > .answer::before { top: 1rem; left: 3.35rem; }
    .sub0103 .qnaLst > ul > li > .answer .qrBox ul li span { font-size: 0.7rem; padding: 0 0.75rem; text-align: center; }

	.btnBox { margin: 1.5rem 0; }
    .regiBtn { height: 2.5rem; font-size: 0.8rem; }
    .regiBtn > span { width: 1.15rem; height: 1.15rem; margin-left: 1.25rem; }
    .regiBtn > span > img { max-width: 0.5rem; }
    
    .btnBox2 { margin: 1.5rem 0; }

}