@charset "UTF-8";
/* CSS Document */

@import url(/shop/data/skin/apple_tree/css/nanum/nanumsquare.css);    
@import url(/shop/data/skin/apple_tree/css/noto/noto.css); 

/* Google Web Fonts CDN */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');


/*********e·¯´×Æ÷ÇÔ start header*******/
#newwrap_start {display: flex;justify-content: space-between;align-items:flex-end; width:1200px;margin:40px auto 0;}	
/*·Î°í*/
#newwrap_start .logo {flex:0 0 auto;width:140px;}
/*GNB¿Í °Ë»ö*/
#newwrap_start .gnb_area {flex:1;margin-left:auto;margin-right: auto;}
#newwrap_start .gnb_area .search {margin:0 auto 30px;width:321px;background:#eee;}
#newwrap_start .gnb_area .gnb_flex {display: flex;margin-left: 30px;margin-right: 30px; justify-content: center;align-items:flex-start;}
#newwrap_start .gnb_area .gnb_flex .gnb_menu {flex:1;position: relative;}
#newwrap_start .gnb_area .gnb_flex .gnb_menu .gnb_btn {position: relative;display: block;height:24px;font-family:'Noto Sans KR', sans-serif;font-size:18px;font-weight: 400;color:#000000;cursor: pointer;text-align: center}
#newwrap_start .gnb_area .gnb_flex .gnb_menu:hover .gnb_btn {color:#3fabfa;}
#newwrap_start .gnb_area .gnb_flex .gnb_menu .gnb_btn .newicon {position: absolute;top:-32px;left:50%;transform: translateX(-50%);width:44px;height:29px;}
#newwrap_start .gnb_area .gnb_flex .gnb_menu .gnb_btn .newicon img {width:inherit;height: inherit;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu {position: absolute;display: none;top:18px;left:50%;transform: translateX(-50%);width:100%;z-index:99}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu .pointer {display: block;margin:0 auto;width:0;height: 0;border-bottom:10px solid #3fabfa;border-top:10px solid transparent;border-left: 8px solid transparent;border-right: 8px solid transparent;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu ul {display: block;position: relative;border:1px solid #3fabfa;border-radius: 12px; background:#ffffff;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu ul li {display: block;border-bottom:1px solid #efefef;box-sizing: border-box;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu ul li:last-child {border-bottom:0;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu ul li a {padding:9px 5px;display: block;font-family:'Noto Sans KR', sans-serif;font-size:14px;font-weight: 300;color:#000000;cursor: pointer;text-align: center;}
#newwrap_start .gnb_area .gnb_flex .gnb_submenu ul li:hover a {color:#3fabfa;}
/*³»¼­Àç ¹öÆ° -·Î±×ÀÎ Àü, Æ˾÷*/
#newwrap_start .mypage {position: relative;flex:0 0 auto;width:150px;}
#newwrap_start .mypage .btn_viewmenu {width:150px;height:48px;display: flex;gap: 10px;align-items:center;justify-content: flex-start;background: #f1f5f7;border-radius: 12px;border: 1px solid #85a3bb;box-sizing: border-box;cursor: pointer}
#newwrap_start .mypage .btn_viewmenu:hover {background:#b6c8d6;border-color:transparent;}
#newwrap_start .mypage .btn_viewmenu:hover .txt{color:#ffffff}
#newwrap_start .mypage .btn_viewmenu .avatar {flex:0 0 auto;margin-left:15px;width:32px;height: 32px;}
#newwrap_start .mypage .btn_viewmenu .avatar img {width:inherit;height: inherit;}
#newwrap_start .mypage .btn_viewmenu .txt {flex:1;font-family:'Noto Sans KR', sans-serif;font-size: 16px;line-height:16px;
  font-weight: 400;color: #384455;}
#newwrap_start .mypage .mypage_subarea {position: absolute;display: none;width:240px;top:38px;left:-45px;z-index:99}
#newwrap_start .mypage .mypage_subarea.close {display: none;}
#newwrap_start .mypage .mypage_subarea .pointer {display: block;margin:0 auto;width:0;height: 0;border-bottom:12px solid #d9e1e7;border-top:12px solid transparent;border-left: 10px solid transparent;border-right: 10px solid transparent;}
#newwrap_start .mypage .mypage_subarea .mypage_sub {padding: 20px 25px 20px 25px;width:240px;background: #ffffff;border: 2px solid #d9e1e7;border-radius: 24px;box-sizing: border-box;}
#newwrap_start .mypage .mypage_subarea .mypage_sub .txt {margin-bottom:20px;font-family:'Noto Sans KR', sans-serif;font-size:14px;font-weight: 300;color: #384455;text-align: center;}
#newwrap_start .mypage .mypage_subarea .mypage_sub .btn_bluegray {display: block;margin-bottom:10px;padding: 9px 10px 9px 20px;height: 44px;display: flex;gap: 0px;justify-content:center;align-items: center;align-self: stretch;background: #809fb8;border-radius: 9px;box-sizing: border-box;}
#newwrap_start .mypage .mypage_subarea .mypage_sub .btn_bluegray span {flex:1;font-family:'Noto Sans KR', sans-serif;font-size: 16px; line-height: 22px;color: #ffffff;font-weight: 500;} 
#newwrap_start .mypage .mypage_subarea .mypage_sub .btn_bluegray img {width:24px; height:24px;}
#newwrap_start .mypage .mypage_subarea .mypage_sub .btn_bluegrayline {display: block;padding: 9px 10px 9px 20px;height: 44px;display: flex;gap: 0;justify-content:center;align-items: center;background: #ffffff;border:1px solid #809fb8;border-radius: 9px; box-sizing: border-box;}
#newwrap_start .mypage .mypage_subarea .mypage_sub .btn_bluegrayline span {font-family:'Noto Sans KR', sans-serif;font-size: 16px; line-height: 22px;color: #809fb8;font-weight: 500;} 
/*³»¼­Àç ¹öÆ° - ·Î±×ÀÎ ÈÄ, Æ˾÷ ¾øÀ½*/
#newwrap_start .mypage .btn_gomypage {width:150px;height:48px;display: flex;gap: 10px;align-items:center;justify-content: flex-start;background: #E7F7FD;border-radius: 12px;border: 1px solid #3fabfa;box-sizing: border-box;cursor: pointer}
#newwrap_start .mypage .btn_gomypage:hover {background:#3fabfa;border-color:transparent;}
#newwrap_start .mypage .btn_gomypage:hover .txt{color:#ffffff}
#newwrap_start .mypage .btn_gomypage .avatar {flex:0 0 auto;margin-left:15px;width:32px;height: 32px;}
#newwrap_start .mypage .btn_gomypage .avatar img {width:inherit;height: inherit;}
#newwrap_start .mypage .btn_gomypage .txt {flex:1;font-family:'Noto Sans KR', sans-serif;font-size: 16px;line-height:16px;
  font-weight: 400;color:#3fabfa;}


/*********e·¯´×Æ÷ÇÔ subpage header*******/
#newwrap_start.subpage {display: flex;justify-content: space-between;align-items:flex-end; width:980px;margin:40px auto 24px;}	


/*********e·¯´×Æ÷ÇÔ ÅëÇÕ ³»¼­Àç*******/
.elearn_ptitle {margin:60px auto 90px;padding: 0px 0 9px;width:800px;border-bottom: 1px solid #d9e1e7;}
.elearn_ptitle span {font-size: 24px;font-family:'Noto Sans KR', sans-serif;font-weight: 500;color: #12aff0;letter-spacing: -2px;}
.elearn_userbox {margin:0 auto 40px;padding: 30px 45px 30px 45px;width:750px;display: flex; justify-content: center;align-items: flex-start;gap:45px;background: #ffffff;border:1px solid #d9e1e7;border-radius: 30px;box-sizing: border-box;}
.elearn_icons {margin-top:10px;margin-right:auto;flex:0 0 auto;width:100px;display: flex;flex-direction:column;align-items: center;justify-content: flex-start;}
.elearn_icons img {width:96px; height:96px;}
.elearn_tit {font-family:'Noto Sans KR', sans-serif; font-size: 16px;font-weight: 600;color: #12aff0;}
.elearn_userarea {flex:1;}
.elearn_users {margin:10px 0;padding: 20px 45px 20px 45px;width:100%;display:flex;justify-content: center;align-items:center;gap:30px;background: #f1f5f7;border-radius: 24px;box-sizing: border-box;cursor: pointer;}
.elearn_users:hover {text-decoration: none;}
.elearn_users.blue {background:#e7f7fd}
.elearn_users img {flex:0 0 auto;width:72px; height:72px;}
.elearn_txt {flex:1;}
.elearn_name {display: block;margin-bottom:9px;font-size:20px;font-family:'Noto Sans KR', sans-serif;font-weight: 500;color:#384455;}
.elearn_name em {font-size:16px;font-family:'Noto Sans KR', sans-serif;font-weight: 300;font-style:normal;}
.elearn_group {display: block;font-size:12px;font-family:'Noto Sans KR', sans-serif;font-weight: 300;color:#85A3BB;}
.elearn_gonavy {padding: 9px 10px 9px 10px;display: flex;width: 180px;height: 44px; justify-content: center;align-items: center; gap: 0px;background: #217efd;border-radius: 9px;box-sizing: border-box;}
.elearn_gonavy span {display: inline-block;font-size: 16px;font-family:'Noto Sans KR', sans-serif;font-weight: 400;color: #ffffff;text-decoration: none}
.elearn_gonavy:hover span {text-decoration: none !important;}
.elearn_gonavy img {flex:0 0 auto;width: 24px;height: 24px;}
.elearn_btn {width:65px;align-self:flex-end;}
.elearn_gotxt {display: inline-block;}
.elearn_gotxt span{display: inline-block;color: #217efd;font-family:'Noto Sans KR', sans-serif;font-size: 14px;font-weight: 400;text-decoration: none}
.elearn_gotxt:hover span {color: #217efd;text-decoration: none !important;}


/*********e·¯´×Æ÷ÇÔ ÅëÇÕ ³»¼­Àç Mobile*******/
@media (max-width: 767px) {
	
.elearn_userbox {padding: 1.2em 1.5em 1.2em 1.5em;width:95%;display: flex;flex-direction: column;justify-content:flex-start;align-items: center;gap:10px;background: #ffffff;border:1px solid #d9e1e7;border-radius: 1.5em;box-sizing: border-box;}
.elearn_userbox:first-child {margin:40px auto 20px;}
.elearn_userbox:last-child {margin:0 auto 40px;}
.elearn_icons{margin-right:auto;margin-left: auto}
.elearn_userarea {width:100%}	
.elearn_users {margin:10px 0;padding: 1em 1.8em 1em 1.8em;gap:20px;border-radius: 1em;}
.elearn_txt {flex:0 0 auto;}
.elearn_gonavy {padding:0;display: flex;width: 150px;height: 40px; justify-content: center;align-items: center; gap: 0px;background: #217efd;border-radius: 9px;box-sizing: border-box;}
.elearn_gonavy span {display: inline-block;font-size: 14px;font-family:'Noto Sans KR', sans-serif;font-weight: 400;color: #ffffff;text-decoration: none}
.elearn_gonavy:hover span {text-decoration: none !important;}
.elearn_gonavy img {flex:0 0 auto;width: 20px;height: 20px;}
.elearn_users.blue {padding: 1em 1em 1em 1.5em;gap:20px;border-radius: 1em;}
.elearn_name {min-width: 150px;max-width:190px;font-size:18px;font-weight: 700;}
.elearn_name em {font-size:14px;font-weight: 400;}
.elearn_group {min-width: 150px;max-width:190px;font-size:12px;font-weight: 400;}
	
}