*,*:before,*:after {
    box-sizing: border-box;
    word-break: keep-all;
    margin: 0;
    padding: 0;
}

html, body {
    font-family: "NanumSquareNeo";
    font-size: 16px;
}

html {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    position: relative;
    min-height: 100%;
    margin: 0;
    padding: 0;
  }

@font-face {
    font-family: NanumSquareNeo;
    src: url(../fonts/NanumSquareNeo-Variable.ttf);
}

@font-face {
    font-family: 'GangwonEduPowerExtraBoldA';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEduPowerExtraBoldA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

a {
    color: inherit;
    text-decoration: none;
}
p {
    margin: 0;
}
ul,ol,li{list-style: none;}

textarea{
    font-family: "NanumSquareNeo";
}

.mobileHeader{
	width: 100%;
	height: 60px;

}

.mobileLogo {
    width:250px;
    height:60px;
    object-fit: contain;
	display: block;
    margin: auto;
}

.mobileSwiper{
	width: 100%;
    height: 290px;
    overflow-x: hidden;
}


/* 공지사항,수강후기 박스부분 */
div>div>h2{
    font-size: 20px;
    font-weight: 700;
    font-family: "NanumSquareNeo";
    text-align: center;
    margin: 20px 0;
}

.board-title{
    font-size: 50px;
    font-weight: normal;
    /* margin: 60px 40px 0; */
    padding: 0 0 30px 0;
    text-indent: 10px;
    border-bottom: 3px solid #301E67;
    font-family: "NanumSquareNeo";
}
.section1>div,.section2>div,.section3>div,.section4>div,.section5>div{width: 100%; margin: 0 auto;}
.section1 .content_list{
    width: 100%; 
}

.section1 .content_list .list li{
    float: left;
    background-color: #FFF;
    /* box-shadow: 2px 2px 5px rgba(0,0,0,0.2); */
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
    width: 95%;
    height: 110px;
    margin: 10px 7px;
    text-align: left;
}

.section1 .content_list .list li .mask{
    float: left;
    overflow: hidden;
    width: 55%;
    height: 110px;
}

.tlist{
    /* width: 530px; */
    width: 90%;
}

.tlist > li > a:hover {
    color: #301E67;
    font-weight: bold;
}

.category-tablist{
    width: 100%;
    height: 50px;
    display: block;
    float: left;
    margin-bottom: 100px;
}

.cat-tab{
    float: left;
    height:100%; 
    border: 1px solid #e7e7e7;
    color: #333;
    /* background-color: #2F58CD; */
    font-size: 18px;
    cursor: pointer;
    padding: 10px;
    border-collapse: collapse;
    /* margin : 20px 0 10px 0; */
}

.tab-active{
    font-weight: bold;
    color: #333;
    border-bottom: 3px solid #2676B4;
}

.mask img{
    width: 185px;
    height: 110px;
    overflow: hidden;
    transition: 0.5s;
}

.mask:hover img {
    transform: scale(1.08);
    object-fit: cover;
}

.section1 .content_list .list li h3{
    width: 164px;
    height:40px;
    font-size: 20px;
    padding: 9px 13px 0;
    font-weight: normal;
    float: left;
}

.recommend-box{
    width: 45%;
    padding: 5px 10px 0 10px;
    float: left;
}

.recommend-box p{
    height: 60px;
    border-bottom: 1px solid #ccc;
    font-size: 12px;
    line-height: 18px;
    overflow: hidden;
}

.sub_box{
    float: right;
    position: relative;
    top: 8px;
    left: 0px;
    width: 100px;
    height: 30px;
    color: #fff;
    display: block;
    background: #2F58CD;
    border-radius: 50px;
    text-align: center;
    line-height: 30px;
    font-size: 13px;
    font-weight: bold;
    cursor: pointer;
}

.sub_box:hover {
    background : #1b3fa3;
    transition: all .3s;
}

.section1 .content_list .list li .txt{
    font-size: 12px;
    color: #000;
    line-height: 15px;
    text-overflow: ellipsis;
    padding: 16px 95px 2px 14px;
}

.section3{
    width: 100%;
    display: inline-block;
}
.section3>div>h2{
    font-weight: bold;
    font-size: 30px;
    color : #301E67;
}
.section3>div>ul{
    margin: 0 15px;
}
.section3>div>ul>li{
    margin: 20px 0;
    line-height: 30px;
    cursor: pointer;
    border-bottom: 1px solid #555;
}
.section3>div>ul>li>p{
    float: left;
}
.section3>div>ul>li>span{
    display: inline-block;
    float: right;
}
.section3 .text_list_box1,
.section3 .text_list_box2{
    width: 100%;
    background: #fff;
}
.section3 .text_list_box1{
    float: left;
}
.section3 .text_list_box2{
    float: right;
}

.section3>div>.btn{
    width: 100%;
    height: 50px;
    background: rgba(0, 0, 0, 0.1);
    text-align: center;
    line-height: 50px;
    margin: 0 auto;
    border-radius: 10px;
}
.section3>div>.btn>a{width:100%; height:100%; display: block;}

.section3>div>.btn:hover {
    box-shadow: 0 0 10px 2px rgba(0,0,0,.1);
    font-weight: bold;
}





/*=================================================================================================
** 모바일 레이아웃 변경되며 추가된 css :: 변경일자 2024-03-07
**-----------------------------------------------------------------------------------------------*/

/* home_mobile_wide */
 
html, body{margin:0px; padding:0px;}
footer > div > div:nth-child(3){margin:0 0 50px 0;}

.mobileHeader{width: 100%;height:70px;}
.mobileLogo{margin:0px auto;padding:5px 0px 0px 0px;width: 250px;height: 60px;object-fit: contain;display: block; }
.floating_pannel{position:fixed;bottom:0px;left:0px;z-index:50;width:calc(100% - 0px);height:50px;border-top-left-radius: 20px;border-top-right-radius:0px;background:#f9f9f9;border:1px solid #ccc;}
.floating_pannel ul{}
.floating_pannel ul li{float:left;display:inline-block;padding:5px 0px 0px 0px;width:20%; line-height:50px;text-align:center;}
.floating_pannel ul li a{display:inline-block;width:25px;height:35px;}
.floating_pannel ul li a span{display:none;}
.floating_pannel ul li a.qm1{background: url(/assets/image/qm1_over.png) 50% 10px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm1:hover {background: url(/assets/image/qm1_over.png) 50% 10px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm2{background: url(/assets/image/qm2.png) 50% 10px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm2:hover {background: url(/assets/image/qm2_over.png) 50% 10px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm3{background: url(/assets/image/qm3.png) 50% 5px no-repeat;background-size:contain;}
.floating_pannel ul li a.qm3:hover {background: url(/assets/image/qm3_over.png) 50% 5px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm4{background: url(/assets/image/qm4.png) 50% 10px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm4:hover {background: url(/assets/image/qm4_over.png) 50% 10px no-repeat;    background-size: contain;}
.floating_pannel ul li a.qm5{background: url(/assets/image/qm5.png) 50% 5px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm5:hover {background: url(/assets/image/qm5_over.png) 50% 5px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm5{display: inline-block;width: 25px;height: 27px;} 
.floating_pannel ul li a.qm6{background: url(/assets/image/qm6.png) 50% 5px no-repeat;background-size: contain;}
.floating_pannel ul li a.qm6:hover {background: url(/assets/image/qm6_over.png) 50% 5px no-repeat;    background-size: contain;}

.section{margin:0 0 5px 0px;padding:0px;width:100%;min-height:255px;background:#fff;box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);}
.section:nth-child(2n+1){background:#fff;}
.section.last{margin:0 0 50px 0px;background:blue}
#mainTop{background-color:#ffffff !important;}
.mobileswiper{overflow:hidden;}
.swiper-slide img{width:100%;height:100%; object-fit:cover;} 

/* main_shortcut_link */
.btn_row{margin:0px;padding:10px 10px 0px 10px;width:100%;height:auto;background:#f2f2f2;text-align:center;}
.btn_row:nth-child(3){margin:0px;padding:15px 10px 10px 10px;}
.large_btn{display:inline-block;margin:5px 3px 5px 3px;padding:0px;width:100px;height:125px;border-radius:5px;background:#fff;box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);overflow:hidden;}
.large_btn .btn_pic{display: block;margin:0px;padding:0px;width: 100%;height:80px;text-align: center;font-size: 50px;font-weight: bold;color: #333;line-height:80px;background:#f7f7f7;}
.large_btn .btn_pic img{height:60px;width:auto;}
.large_btn .btn_msg{display:block;padding:10px 0 0 0;width:100%;height:40px;text-align:center;font-size:13px;font-weight:bold;color:#333;line-height:22px;}
.btn_row:nth-child(3) .large_btn:nth-child(1) .btn_msg{line-height:13px;}

.div_schedule{position:fixed;top:0px;left:0px;z-index:55;display:none; width:100%;height:100%;}
.bg_pannel2{position:absolute;top:0px;left:0px;z-index:50;width:100%;height:100%;background:#333;opacity:0.5;}
.cotent_in{position:absolute;bottom:-50px;left:0px;z-index:50;width:100%;height:calc(100% - 50px);background:#fff;border-top:1px solid #ff0066;}
.cose_btn{position:absolute;top:10px;right:10px;margin:0px;padding:3px 10px;width:70px;height:25px;border:1px solid #ccc;font-size:13px;line-height:20px;text-align:center;letter-spacing:8px;text-indent:8px;border-radius:5px;overflow:hidden;}
.cose_btn:after{content:'';position:absolute;top:0px;right:0px;z-index:-2;width:100%;height:25px;background:#fff}
.cose_btn:before{content:'';position:absolute;top:11px;right:0px;z-index:-1;width:100%;height:25px;background:#f2f2f2;}

/* main_instructor_list */
.introduction{position:relative;display:inline-table;width:100%;min-height:500px;height:auto;}
.introduction_bg{position:absolute;width:100%;height:100%;background:url('/assets/image/office-1246484_1280.jpg');-webkit-filter: blur(5px);-moz-filter: blur(5px);-o-filter: blur(5px);-ms-filter: blur(5px);filter: blur(5px); }
.intro_main{position:relative;margin:50px auto;width:1000px;height:500px;}
.bg_pannel{position:absolute;top:0px;left:0px;z-index:1;width:100%;height:100%;background:#333;opacity:0.5;border-radius:15px;}
.intro_list{position:absolute;top:0px;left:0px;z-index:1;width:100%;height:100%; }
.blue_div{position: absolute;top: 0px;left: 30px;z-index:2;margin:0;padding:30px 20px 20px 20px;width:350px;height:170px;background:#4fbeff;border-bottom-right-radius: 20px;border-bottom-left-radius: 20px;} 
.blue_div h2{margin:0px;padding:0px;font-weight:bold;font-size:25px;color:#fff;text-indent:0px;}
.blue_div h3{margin:30px 0px 0px 0px;padding:0px;font-weight:bold;font-size:18px;color:#fff;text-indent:0px;}
hr.line{position: absolute;top: 100px;left: 20px;z-index:2;width: 250px;height: 2px;border: none;background: #fff;}
.info_div{position: absolute;top: 180px;left: 30px;z-index:2;margin: 0px;padding:20px;width: 350px;height: 280px;background: #fff;border-radius:20px;}
.blue_div  .info_div p{margin:0px;padding:10px 0;} 

/* main_instructor_list */
.list_div{display:block;margin:0px auto;width:1400px;height:930px;background:#fff;}
.tab_content{display:block;margin:0px auto;width:1400px;height:720px;background:#fff;}
.tab_content ul li{display:inline-block;margin:20px 18px 20px 1px;width:calc(20% - 20px);height: 305px;box-shadow:0px 0px 8px rgba(0, 0, 0, 0.2);overflow:hidden;}
.tab_content ul li:nth-child(5n+0){margin:20px 0px 20px 0px;}
.mask_in{position:relative;width:260px;height:164px;overflow:hidden;}
.mask{position:relative;}
.mask_border{position:absolute;top:calc(5% - 1px);left:calc(2% - 1px); width:96%;height:90%;border:2px solid #ffffff59;}
.cat-tab{margin-right:-1px;line-height:25px;border-top-left-radius: 15px;border-top-right-radius: 15px;}
.cat-tab i{margin:0 5px;line-height:25px;}
.recommend-box i{margin:0 5px;}
.recommend-box p{margin:0 0 5px 0;} 
.content_in_title{width:100%;height:70px;overflow:hidden;text-align:center;}
.content_in_title h3{font-size:21px;font-weight:bold;color:#585858;line-height:80px;text-decoration: underline;text-underline-position:under;}
.content_in_div{width:100%;height:480px;background:#fff;overflow:hidden;}
.content_in_pannel2{display:inline-block;min-width:800px;width:auto;height:340px;background:pink;}
.list_item{display:inline-block;margin:10px;padding:10px;width:calc(100% - 20px);height:458px;border:1px solid #ccc;background:#fff;border-radius:10px;}
.img_mask{position:relative;width:100%;height:250px;margin:0px;border-top-left-radius:10px;border-top-right-radius:10px;overflow:hidden;}
.img_mask:after{content: '';position: absolute;top: 15px;left: 15px;width: calc(100% - 30px);height: calc(100% - 30px);border: 2px solid #fff;border-radius: 10px;opacity: 0.8;pointer-events: none;}
.sub_box2 {float: right;position: relative;top: 8px;left: 0px;padding: 5px 10px 5px 10px;min-width: 280px;height:40px;color: #fff;display: block;background: #ff952b;border-radius:10px;text-align: center;line-height:35px;font-size: 13px;font-weight: bold;cursor: pointer;}
.sub_box3 {margin:10px 0px;padding: 5px 10px 5px 10px;min-width: 280px;width:100%;height:40px;color: #fff;display: block;background: #ff952b;border-radius:10px;text-align: center;line-height:35px;font-size: 13px;font-weight: bold;cursor: pointer;}


/****************************************************************************************************************************/
.info_head{display:block;width:100%;height:200px;}
.info_pic{float:left;width:160px;height:180px;overflow:hidden;}
.swiper-slide img.teacher_pic{margin:10px auto 10px auto;width: 160px;height: auto;max-height: 175px;text-align:center;overflow:hidden;object-fit:contain} 
.info_name{float: left;margin: 0px;padding: 0px;width: calc(50% - 11px);height: 180px;}
.cotent_info_title{margin:30px 0px 0px 0px;text-align:center;width:100%;height:80px;}
.cotent_info_title h2{margin:50px 0px;text-align:center;font-size:20px;font-weight:bold;color:#555;line-height:90px;}
.info_name h3{text-align:center;font-size:18px;font-weight:bold;color:#555;line-height:20px;}
.info_name h4{margin:15px 0px 0 0;text-align:center;font-size:13px;font-weight:bold;color:#555;line-height:20px;}
.info_name h4 i{margin:0 3px 0 0}
.mySwiper3 hr{margin-top:5px;margin-bottom:10px;border:0;border-top: 1px solid #0000001a;}
.line2{}
.info_body{display:block;margin:0px;padding:10px;width:calc(100% - 0px);height:225px;background:#eee;border-bottom-left-radius:10px;border-bottom-right-radius:10px;}
.info_left{position:relative;}
.info_right1{padding:0px 0 0 5px;display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;height:95px;font-size:14px;}
.info_right2{padding:0px 0 0 5px;display:-webkit-box; word-wrap:break-word;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden; text-overflow:ellipsis;height:170px;font-size:14px;}
.list_item.small{height:320px;}
.btn5{position:absolute;top:0px;right:0px;margin:0px;padding:0px;width:70px;height:25px;border:1px solid #ccc;line-height:20px;letter-spacing:5px;border-radius:5px;overflow:hidden;box-shadow:0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)}
.btn5:after{content:'';position:absolute;top:0px;right:0px;z-index:1;width:100%;height:100%;background:#fff}
.btn5:before{content:'';position:absolute;top:50%;right:0px;z-index:2;width:100%;height:50%;background:#f2f2f2;}
.btn5 span{position:absolute;top:1px;left:1px;z-index:3;display:inline-block;height:calc(100% - 0px);width: calc(100% - 0px);font-size:13px;line-height:27px;pointer-events: none;}

/* main_notice_latest */
ul.tlist2 {width:100%;}
ul.tlist2 li{margin: 0px 5px 0px 5px;padding:5px 10px 5px 40px;height: 60px;border-bottom: 1px solid #ccc;display: flex;justify-content: flex-start;align-items: center;}
ul.tlist2 li:nth-child(1){padding-top:10px;border-top:1px solid #ccc;}
ul.tlist2 li a{position:relative;margin:0 0 0 0px;line-height:25px;}
.bullet{position:absolute;top:3px;left:-25px;margin:0 5px 0 0;color:#ddd;}
.content_in_div .btn{margin:10px auto 10px auto;padding: 5px 10px 5px 10px;width:90%;height: 40px;color: #fff;display: block;background: #ff952b;border-radius: 10px;text-align: center;line-height: 35px;font-size: 13px;font-weight: bold;cursor: pointer;}
.content_in_div.long{height: 400px;}
.img_mask a{display: block;width: 100%;height: 100%;}
.mySwiper{height:250px;}
.mySwiper3{height:503px;}
.mySwiper4{height:365px;}

.info_head{display:block;width:100%;height:200px;}
.info_pic{float:left;width:160px;height:180px;overflow:hidden;}
.swiper-slide img.teacher_pic{margin:10px auto 10px auto;width: 160px;height: auto;max-height: 175px;text-align:center;overflow:hidden;object-fit:contain} 
.info_name{float: left;margin: 0px;padding: 0px;width: calc(50% - 11px);height: 180px;}

.cotent_info_title{margin:30px 0px 0px 0px;text-align:center;width:100%;height:80px;}
.cotent_info_title h2{margin:50px 0px;text-align:center;font-size:20px;font-weight:bold;color:#555;line-height:90px;}
.info_name h3{text-align:center;font-size:18px;font-weight:bold;color:#555;line-height:20px;}
.info_name h4{margin:15px 0px 0 0;text-align:center;font-size:13px;font-weight:bold;color:#555;line-height:20px;}
.info_name h4 i{margin:0 3px 0 0}

.mySwiper3 hr{margin-top:5px;
margin-bottom:10px;
border: 0;
border-top: 1px solid #0000001a;}
.line2{}
.info_body{display:block;margin:0px;padding:10px;width:calc(100% - 0px);height:225px;background:#eee;border-bottom-left-radius:10px;border-bottom-right-radius:10px;}
.info_left{position:relative;} 
.info_right1{padding:0px 0 0 5px;display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;height:95px;font-size:14px;}
.info_right2{padding:0px 0 0 5px;display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:7; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;height:170px;font-size:14px;}

.list_item.small{height:320px;}

.btn5{position:absolute;top:0px;right:0px;margin:0px;padding:0px;width:70px;height:25px;border:1px solid #ccc;line-height:20px;letter-spacing:5px;border-radius:5px;overflow:hidden;box-shadow:0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)}
.btn5:after{content:'';position:absolute;top:0px;right:0px;z-index:1;width:100%;height:100%;background:#fff}
.btn5:before{content:'';position:absolute;top:50%;right:0px;z-index:2;width:100%;height:50%;background:#f2f2f2;}
.btn5 span{position:absolute;top:1px;left:1px;z-index:3;display:inline-block;height:calc(100% - 0px);width: calc(100% - 0px);font-size:13px;line-height:27px;pointer-events: none;}



/* 모바일 하단 플로팅 메뉴 */
.btn_more{position:absolute;top:-35px;right:-1px;z-index:2;width:100px;height:35px;border:1px solid #ccc;border-bottom:none;background:#f9f9f9;text-align:center;border-top-left-radius:5px;border-top-right-radius:5px;line-height:35px;color:#ff8409;font-size:13px;}
.btn_more i{margin:0 5px 0 0;}
.floating_menu_div{position: relative;
top: -15px;left:0px;display: block;height:150px;width: 100%;margin: 0;padding: 0;background:#f9f9f9;border-top-left-radius:20px;}
.floating_btn_name{position: absolute;top: 50px;width: 100%;height: 50px; }
.floating_btn_name div{
display: inline-block;width:19.0%;height: 70px;word-wrap: break-word;
vertical-align: bottom;text-align:center;}


/* 과정 상세보기 > 강의목차 터치 이미지 */
.touch_finger{display:none;position: absolute;
    top: 50px;
    right: 10px;
    width: 22px;
    height: auto;}

	.touch_finger2{display:inline-block;position: absolute;
    top:30px;
    right: 5px;
    width: 22px;
    height: auto;}