@charset "utf-8";
/* CSS Document */
/* com2zoa design kjh, publishing kjh 2025.06.16 */

/* 특별교육이란 */
.spe_eduinfo {position:relative; padding:25px 17px 25px 25px}
.spe_eduinfo:before {content:""; display: block; position:absolute; top:0; left:0; width:100%; height:225px; background:#e8f0ff}
.spe_eduinfo:after {content:""; display: block; position:absolute; bottom:0; left:0; width:100%; height:53px; background:#e7ddd1; border-radius:30px 30px 0 0}
.spe_eduwrap {position:relative; padding-right:263px; background:url(../images/content/bg_seinfo_charct.png) no-repeat right 0 bottom 23px}
.spe_edubox {position: relative; min-height:410px; padding:42px 25px; border:8px solid #d8e6ff; background:#fff; text-align: center; box-sizing: border-box; z-index: 1}
.spe_edubox .spe_edutit {padding-bottom:10px; font-family:'Gmarket Sans'; font-size:2em; font-weight:500}
.spe_edubox .spe_edutit p {position: relative; display:inline-block; padding:36px 38px 24px}
.spe_edubox .spe_edutit p:before {content:""; display:block; position: absolute; top:0; left:0; width:93px; height:18px; background:url(../images/content/bg_seinfo_quotes.gif) no-repeat 0 0}
.spe_edubox .spe_edutit p:after {content:""; display:block; position: absolute; bottom:0; right:0; width:93px; height:18px; background:url(../images/content/bg_seinfo_quotes.gif) no-repeat 0 100%; transform:rotate(180deg)}
.spe_edubox .spe_edutit span {font-weight:600; color:#3e77dd}
.spe_educon {margin:35px 0 0;line-height:170%; font-size:1.133em; font-weight:400}
.spe_educon .spe_ec {word-break: keep-all}
.spe_educon .spe_ec01 {padding-bottom:30px}
.spe_educon .col_red {color:#f63f00}

/* 특별교육 운영절차 안내 */
.sprocess_top {display:flex; align-items: center; gap:10px; background:#376b93; border-radius:20px 20px 0 0; padding:10px 16px; margin-bottom:20px}
.sprocess_top .spro_toptit {width:100%; color:#fff; font-size:1.333em; font-weight:500; text-align: center}
.sprocess_top .spro_toptit.spro_ttit2 {width:260px; line-height:44px; background:rgba(0,0,0,0.3); border-radius:10px; flex:none}
.spe_process .spro_arr {margin-top:1px; margin-bottom:10px; text-align: center}
.spro_conbox {position:relative; border-top:4px solid #ddd; background:#ededed; border-radius:0 0 10px 10px; padding:11px}
.spro_conbox .spro_cnum {display:block; position:absolute; top:0; left:0; width:44px; height:41px; line-height:37px; background:#eee; border-radius:0 0 15px 0; text-align: center; font-weight:600; color:#fff; font-size:1.2em}
.spro_ctxtbox {display:flex; justify-content: space-between; background:#fff; padding:10px 14px 10px 48px; border-radius:10px}
.spro_ctxtbox dl {display: flex; align-items: center; width:calc(100% - 250px)}
.spro_ctxtbox dl dt {font-size:1.333em; font-weight: 600; width:220px}
.spro_ctxtbox dl dd {width:calc(100% - 220px); font-weight:400}
.spro_ctxtbox .spro_ccate {display:flex; justify-content: flex-end; align-items: center; width:240px; height:auto; padding:20px 18px 20px 56px; text-align:right; border-radius:10px; color:#fff; font-size:1.2em; box-sizing: border-box; font-weight:600}
.spro_con01 .spro_ctxtbox .spro_ccate, .spro_con04 .spro_ctxtbox .spro_ccate {background:url(../images/content/bg_process_sch.png) no-repeat left 10px top 50%}
.spro_con02 .spro_ctxtbox .spro_ccate, .spro_con03 .spro_ctxtbox .spro_ccate {background:url(../images/content/bg_process_org.png) no-repeat left 10px top 50%}

.spro_ctxtbox dl dd ul li {line-height:150%}
.spro_ctxtbox dl dd ul.spro_certify li {margin-top:5px}
.spro_ctxtbox dl dd ul.spro_certify li:after {margin-top:0}
.spro_ctxtbox dl dd ul li .spro_ctit {display:inline-block; width:60px; text-align: center; background:#5a5a5a; border-radius:5px; color:#fff}
.spro_blttxt li {position:relative; padding-left:15px;}
.spro_blttxt li:after {content:""; display: block; position: absolute; top:6px; left:0; width:8px; height:8px; border-radius:50%; border:2px solid #000; box-sizing: border-box}
.spro_conbox.spro_con01 {border-color:#4f9ffe}
.spro_conbox.spro_con01 .spro_cnum {background:#4f9ffe}
.spro_conbox.spro_con01 .spro_ccate {background-color:#4f9ffe}
.spro_conbox.spro_con01 .spro_blttxt li:after {border-color:#4f9ffe}
.spro_conbox.spro_con02 {border-color:#06add9}
.spro_conbox.spro_con02 .spro_cnum {background:#06add9}
.spro_conbox.spro_con02 .spro_ccate {background-color:#06add9}
.spro_conbox.spro_con02 .spro_blttxt li:after {border-color:#06add9}
.spro_conbox.spro_con03 {border-color:#0072b8}
.spro_conbox.spro_con03 .spro_cnum {background:#0072b8}
.spro_conbox.spro_con03 .spro_ccate {background-color:#0072b8}
.spro_conbox.spro_con03 .spro_blttxt li:after {border-color:#0072b8}
.spro_conbox.spro_con04 {border-color:#254a7e}
.spro_conbox.spro_con04 .spro_cnum {background:#254a7e}
.spro_conbox.spro_con04 .spro_ccate {background-color:#254a7e}
.spro_conbox.spro_con04 .spro_blttxt li:after {border-color:#254a7e}

/* 심리치료 운영절차 안내 */
.spe_process2 .sprocess_top {background:#467a6c}
.spe_process2 .spro_conbox.spro_con01 {border-color:#a7c954}
.spe_process2 .spro_conbox.spro_con01 .spro_cnum {background:#a7c954}
.spe_process2 .spro_conbox.spro_con01 .spro_ccate {background-color:#a7c954}
.spe_process2 .spro_conbox.spro_con01 .spro_blttxt li:after {border-color:#a7c954}
.spe_process2 .spro_conbox.spro_con02 {border-color:#3fb5ab}
.spe_process2 .spro_conbox.spro_con02 .spro_cnum {background:#3fb5ab}
.spe_process2 .spro_conbox.spro_con02 .spro_ccate {background-color:#3fb5ab}
.spe_process2 .spro_conbox.spro_con02 .spro_blttxt li:after {border-color:#3fb5ab}
.spe_process2 .spro_conbox.spro_con03 {border-color:#3cb28d}
.spe_process2 .spro_conbox.spro_con03 .spro_cnum {background:#3cb28d}
.spe_process2 .spro_conbox.spro_con03 .spro_ccate {background-color:#3cb28d}
.spe_process2 .spro_conbox.spro_con03 .spro_blttxt li:after {border-color:#3cb28d}
.spe_process2 .spro_conbox.spro_con04 {border-color:#2c7339}
.spe_process2 .spro_conbox.spro_con04 .spro_cnum {background:#2c7339}
.spe_process2 .spro_conbox.spro_con04 .spro_ccate {background-color:#2c7339}
.spe_process2 .spro_conbox.spro_con04 .spro_blttxt li:after {border-color:#2c7339}

/* 특별교육 이수기관 현황 */
.corg_top {margin-bottom:22px; border-top: 7px solid #ccc; border-bottom:1px solid #e1e1e1}
.corg_top h4 {position:relative; padding:35px 150px 35px 30px; font-size:2em}
.corg_top h4:after {content:""; display:block; position: absolute; bottom:4px; right:18px; width:80px; height:80px;  background-color:#fff; border-radius:50%; border:3px solid #000; box-sizing: border-box}
.corg_top1 {border-top-color:#4f9ffe; background:url(../images/content/bg_orginfo01.gif) no-repeat right 0 top 0}
.corg_top2 {border-top-color:#254a7e; background:url(../images/content/bg_orginfo02.gif) no-repeat right 0 top 0}
.corg_top3 {border-top-color:#3cb28d; background:url(../images/content/bg_orginfo03.gif) no-repeat right 0 top 0}
.corg_top4 {border-top-color:#2c7339; background:url(../images/content/bg_orginfo04.gif) no-repeat right 0 top 0}
.corg_top1 h4:after {border-color:#4f9ffe; background:#fff url(../images/content/bg_orgstate_ico01.gif) no-repeat 50% 50%}
.corg_top2 h4:after {border-color:#254a7e; background:#fff url(../images/content/bg_orgstate_ico02.gif) no-repeat 50% 50%}
.corg_top3 h4:after {border-color:#3cb28d; background:#fff url(../images/content/bg_orgstate_ico03.gif) no-repeat 50% 50%}
.corg_top4 h4:after {border-color:#2c7339; background:#fff url(../images/content/bg_orgstate_ico04.gif) no-repeat 50% 50%}


.corg_lstwrap {padding:0 30px 15px}
.corg_lst {display: flex; justify-content: flex-start; padding-left:15px; position:relative; font-size:1.071em; margin-bottom:12px}
.corg_lst:after {content:""; display: block; position: absolute; top:6px; left:0; width:8px; height:8px; border-radius:50%; border:2px solid #000; box-sizing: border-box}
.corg_lst .corg_lsttit {width:100px; font-weight:600; color:#000; padding-right:10px; border-right:1px solid #bcbcbc}
.corg_lst .corg_lsttxt {padding-left:10px; width:calc(100% - 120px)}

.corg_top1 .corg_lst:after {border-color:#4f9ffe}
.corg_top2 .corg_lst:after {border-color:#254a7e}
.corg_top3 .corg_lst:after {border-color:#3cb28d}
.corg_top4 .corg_lst:after {border-color:#2c7339}

.corg_lst.corg_only .corg_lsttxt {width:100%; padding:0}


/********* MOBILE LAYOUT *********/
@media only screen and (max-width:1024px) {
/* 특별교육이란 */
.spe_eduinfo {padding:15px 10px 15px 15px}
.spe_eduwrap {padding-right:180px; background-size:180px auto}
.spe_edubox {min-height:300px;  padding:25px 15px; border-width:4px}
.spe_edubox .spe_edutit {font-size:1.714em}
.spe_edubox .spe_edutit p {padding:26px 38px 20px}
.spe_edubox .spe_edutit p:before {width:80px}
.spe_edubox .spe_edutit p:after {width:80px}
.spe_educon {line-height:150%; margin:15px 0 0; font-size:1.071em}
.spe_educon .spe_ec01 {padding-bottom:20px}
.spe_eduinfo:after {height:40px}
    
/* 특별교육 운영절차 안내 */
.sprocess_top {display: none}
.spro_ctxtbox {padding:8px 10px 8px 40px}
.spro_ctxtbox .spro_ccate {width:210px}
.spro_ctxtbox dl {width:calc(100% - 190px)}
.spro_ctxtbox dl dt {width:180px}
.spro_ctxtbox dl dd {width:calc(100% - 180px)}
    
/* 특별교육 이수기관 현황 */
.corg_top {border-top-width:3px; background-size:100px auto}
.corg_top h4 {padding:20px 70px 20px 15px; font-size:1.538em}
.corg_top h4:after {bottom:6px; right:8px; width:50px; height:50px;background-size:24px auto; border-width:2px}
.corg_lstwrap {padding:5px 10px}
.corg_lst .corg_lsttit {width:90px; padding-right:5px}
.corg_lst:after {top:5px}
    

}

/* PC LAYOUT */
@media only screen and (min-width:1025px) {

}

/**** LOWSET FIX ****/

@media only screen and (max-width:850px) {
    /* 특별교육 운영절차 안내 */
    .spro_ctxtbox {display:block;padding:10px}
    .spro_ctxtbox dl {display:block; width:100%}
    .spro_ctxtbox dl dt {width:100%; padding:5px 36px 15px}
    .spro_ctxtbox dl dd {width:100%; margin-bottom:10px}
    .spro_ctxtbox .spro_ccate {width:100%; padding:10px 14px; background-size:30px auto !important; background-position:left 5px top 50% !important; font-size:1.071em}
    
}

@media only screen and (max-width:780px) {
    /* 특별교육이란 */
    .spe_eduinfo {padding:0}
    .spe_eduinfo:before {height:192px}
    .spe_eduwrap {padding:150px 10px 25px; background:url(../images/content/bg_mseinfo_charct.png) no-repeat left 50% top 22px, url(../images/content/bg_mseinfo_bgtop01.png) no-repeat left 0 top 0, url(../images/content/bg_mseinfo_bgtop02.png) no-repeat right 0 top 0}
    .spe_eduinfo:after {height:46px; border-radius:10px 10px 0 0}
    .spe_edubox {padding:15px 10px}
    .spe_edubox .spe_edutit {padding:0; font-size:1.571em}
    .spe_edubox .spe_edutit p {padding:34px 0 30px; line-height:130%}
    .spe_edubox .spe_edutit p span {display: block}
    .spe_edubox .spe_edutit p:before {left:50%; width:16px; height:30px; margin:0 0 0 -8px; background:url(../images/content/bg_mseinfo_quotes.png) no-repeat 50% 0}
    .spe_edubox .spe_edutit p:after {left:50%; width:16px; height:30px; margin:0 0 0 -8px; background:url(../images/content/bg_mseinfo_quotes.png) no-repeat 50% 0; transform: rotate(180deg)}
    .spe_educon {font-size:1em}
}