@charset "utf-8";

/* 페이지 스타일 공통 */
.pagecommon{padding-bottom:50px;position:relative;font-size:16px;letter-spacing:-.3px;line-height:1.7;color:#777;font-family:'Pretendard'}
.pagecommon .br{white-space:pre-line}

.pagecommon .table_box{margin-bottom:40px}
.pagecommon .table_box .tit{padding-left:20px;font-size:21px;color:#222;font-family:'LotteMartHappy'}
.pagecommon .table_box .tit i{margin-right:8px;color:#999}
.pagecommon .table_box table{overflow:hidden;width:100%;margin-top:20px;border:1px solid #e1e1e1;border-radius:15px;border-spacing:0;font-size:16px;text-align:center}
.pagecommon .table_box table .bold{font-size:17px;font-weight:500;color:#222;font-family:'Pretendard'}
.pagecommon .table_box table tr:nth-child(odd){background:#f9f9f9}
.pagecommon .table_box table tr th{padding:16px 0;border-right:1px solid rgba(0,0,0,.1);font-size:20px;font-weight: normal;color:#222;background:none;font-family:'LotteMartHappy'}
.pagecommon .table_box table tr th:nth-child(2){background:#fce07a}
.pagecommon .table_box table tr th:nth-child(2) span{color:#5b4e1e}
.pagecommon .table_box table tr th:last-child{border-right:none;color:#fff;background:#f44d2b}
.pagecommon .table_box table tr th:last-child span{color:#fff}
.pagecommon .table_box table tr th p{font-size:23px}
.pagecommon .table_box table tr th span{display:block;margin-top:4px;color:#222;font-size:16px;font-weight:500;font-family:'Pretendard'}
.pagecommon .table_box table tr td{padding:20px 0;border-right:1px solid #e1e1e1;color:#333;font-size:20px;font-family:'LotteMartHappy'}
.pagecommon .table_box table tr td:first-child{color:#222}
.pagecommon .table_box table tr td:first-child span{color:#666}
.pagecommon .table_box table tr td:last-child{border-right:none}
.pagecommon .table_box table tr:last-child td{border-bottom:none}
.pagecommon .table_box .info{margin-top:10px;text-align:right}

.lesson{position:relative;overflow:hidden;font-size:17px}
.lesson > .tit{margin-bottom:100px;text-align:center}
.lesson .h1{margin:30px 0 15px;font-size:40px;font-weight:700;color:#111;font-family:'LotteMartHappy';}
.lesson .h1 b{color:#f44d2b}

.lesson .bsn{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.lesson .bsn .h2{font-size:24px;font-weight:700;color:#111}
.lesson .bsn .h2{font-size:24px;font-weight:700;color:#111}
.lesson .bsn dl{margin:20px 0}
.lesson .bsn dt{margin-bottom:10px;color:#111;word-break:keep-all}
.lesson .bsn li{display:flex;flex-direction:column;padding:30px;border:1px solid #e1e1e1;border-radius:20px;}
.lesson .bsn a{display:flex;align-items:center;justify-content:center;width:100%;height:55px;margin-left:auto;margin-top:auto;border-radius:50px;background:#f2f2f2;transition:all .3s}

.lesson .talent{margin-top:50px}
.lesson .type{display:flex;gap:20px;width:100%;margin-top:50px;}
.lesson .type li{display:flex;flex-direction:column;align-items:center;width:100%;height:430px;padding:48px 34px;border-radius:30px;text-align:center;background:#f2f2f2}
.lesson .type li span{display:inline-block;padding:3px 15px;border:1px solid #666;border-radius:50px;font-size:13px;font-weight:500;color:#666}
.lesson .type li dt{margin:10px 0 15px;font-size:23px;font-weight:700;color:#111}
.lesson .type li dd{word-break:keep-all;font-weight:500}
.lesson .type li img{width:100px;margin-top:auto}
.lesson .link{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-top:50px}
.lesson .link a{display:flex;gap:10px;padding:15px 25px;border-radius:50px;font-size:18px;font-weight:500;color:#fff;background:#111;transition:all .3s}
/* .lesson .type li:hover{box-shadow:0 0 20px rgba(0,0,0,.1);background:#fff}
.lesson .type li:hover span{border:1px solid #f44d2b;color:#fff;background:#f44d2b} */

#p36 .h2 i{transition:all .3s}
#p36 .bsn li{flex-direction:row;align-items:flex-start}
#p36 .bsn li img{float:left;width:80px;margin-right:30px}
#p36 .bsn li dl dt{margin-bottom:18px}
#p36 .bsn li dl dd{word-break:keep-all;font-size:16px}
#p36 .bsn li dl dd span{display:block;width:fit-content;margin-bottom:10px;padding:2px 15px;border-radius:50px;font-size:15px;font-weight:500;color:#fff;background:#555;transition:all .3s}
#p36 .bsn li:hover span{background:#f44d2b}
#p36 .bsn li:hover .h2 i{color:#f44d2b}

#p37 .bsn{display:block;}
#p37 .bsn li{display:flex;flex-direction:row;align-items:center;gap:30px;width:100%;}
#p37 .bsn li + li{margin-top:20px}
#p37 .bsn .h2 span{display:inline-block;vertical-align:middle;margin-right:10px;padding:3px 15px;border-radius:50px;font-size:15px;font-weight:500;color:#fff;background:#f44d2b}

#p44 .h3 b{color:#222;font-weight:500}
#p44 .h3 span{color:#222;text-decoration:underline}
#p44 .bsn li .img{margin-bottom:24px}
#p44 .bsn li img{width:100%}
#p44 .btm_box{display:flex;align-items:center;justify-content:center;gap:40px;margin-top:50px;padding:30px;border-radius:20px;background:rgba(244,77,45,0.05)}
#p44 .btm_box .txt{color:#444;font-size:17px;font-weight:500}
#p44 .btm_box .txt b{display:block;margin-bottom:5px;color:#f44d2b;}

@media(hover:hover){
.lesson .bsn a:hover{color:#fff;background:#f44d2b}
.lesson .link a:hover{background:#f44d2b}
}

/* 반응형 [s] */
@media (max-width:1280px){
.lesson .bsn{gap:20px}
}
@media (max-width:1024px){
.pagecommon{font-size:16px}
.pagecommon .table_box table tr th{font-size:18px}
.pagecommon .table_box table tr th p{font-size:20px}
.pagecommon .table_box table tr td{font-size:18px}
.lesson{padding:50px 15px}
.lesson .h1{margin:0 0 10px;font-size:35px}
.lesson .bsn{gap:15px}
.lesson .bsn .h2{font-size:22px}
.lesson > .tit{margin-bottom:80px}
.lesson .type{gap:15px}
.lesson .type li{padding:34px 20px 40px}
.lesson .bsn li{padding:30px 20px}
.lesson .bsn dl{margin:15px 0}
.lesson .bsn dt{margin-bottom:5px;font-size:17px}
#p36 .bsn li img{width:70px;margin-right:15px}
#p37 .bsn li img{max-width:300px}
}
@media (max-width:768px){
.pagecommon .br{white-space:normal;word-break:keep-all}
.pagecommon .table_box .tit{padding-left:15px;font-size:19px}
.pagecommon .table_box table{margin-top:10px}
.pagecommon .table_box table tr th{font-size:16px}
.pagecommon .table_box table tr th p{font-size:18px}
.pagecommon .table_box table tr td{font-size:18px}
.pagecommon .table_box table .bold{font-size:16px}
.pagecommon .table_box table tr th span{margin-top:0;font-size:15px}
.lesson{font-size:15px}
.lesson > .tit{margin-bottom:70px}
.lesson .h1{font-size:30px}
.lesson .bsn .h2{margin-bottom:10px;font-size:20px}
.lesson .bsn li{padding:20px 20px 30px}
.lesson .type{flex-direction:column}
.lesson .type li{height:auto}
.lesson .type li dt{font-size:22px}
.lesson .type li dd{font-size:16px;white-space:normal}
.lesson .type li img{width:85px;margin-top:20px}
#p36 .bsn li{flex-direction:column;gap:20px}
#p37 .bsn li{flex-direction:column}
#p37 .bsn .h2{text-align:center}
#p37 .bsn dt{text-align:center}
#p37 .bsn .h2 span{padding:3px 12px;font-size:13px}
#p44 .btm_box{gap:20px}
#p44 .btm_box img{width:100px}
#p44 .btm_box .txt{font-size:16px}
#p44 .btm_box .txt br{display:none}
}
@media (max-width:600px){
.lesson .bsn{grid-template-columns:repeat(1,1fr)}
#p36 .bsn{grid-template-columns:repeat(1, 1fr)}
#p44 .btm_box{flex-direction:column;gap:10px;padding:20px}
}
@media (max-width:480px){
.pagecommon{font-size:15px}
.pagecommon .table_box table .bold{font-size:15px}
.pagecommon .table_box table tr td{font-size:17px}
.pagecommon .table_box table tr td:first-child span{display:block}
.pagecommon .table_box table tr th span{font-size:14px}
.pagecommon .table_box .info{font-size:14px}
.lesson{padding:40px 0;font-size:15px}
.lesson > .tit{margin-bottom:40px}
.lesson .h1{font-size:22px}
.lesson .bsn li{text-align:center}
.lesson .bsn a{margin:20px auto 0}
.lesson .bsn dl{margin:0}
.lesson .bsn dt{font-size:16px}
.lesson .talent{margin-top:0}
.lesson .type li{padding:30px 20px}
.lesson .type li span{font-size:12px}
.lesson .type li dl{margin-bottom:20px}
.lesson .type li dt{font-size:18px}
.lesson .type li dd{font-size:15px}
.lesson .type li img{width:76px;margin-top:auto}
.lesson .link{gap:7px}
.lesson .link a{font-size:15px}
#p36 .bsn li{gap:10px}
#p36 .bsn li img{margin:0 auto}
#p36 .bsn li dl dd{font-size:15px}
#p36 .bsn li dl dd span{margin:0 auto 10px;font-size:13px}
#p37 .bsn li img{max-width:none;width:100%}
#p44 .btm_box{gap:0}
#p44 .btm_box img{display:none}
#p44 .btm_box .txt{font-size:15px}
}
@media (max-width:390px){
.lesson .tit img{width:40px}
.lesson .bsn .h2{font-size:18px}
.lesson .bsn dt{font-size:16px}
#p44 .btm_box .txt{font-size:14px}
}
