/*
 +----------------------------------------------------------------------+
 | Copyright (c) STUDYMAX.  co. Ltd
 +----------------------------------------------------------------------+
 | 작업일 : 2018-02-20
 | 파일설명 : index 메인 페이지 css
 +----------------------------------------------------------------------+
 | 작업자 : 박소율
 +----------------------------------------------------------------------+
 | 수정이력
 | 20180220 성공기 게시판 구축 , CSS 코딩규칙 적용 (디렉토리 수정)  by 박소율
 | 20180320 프로필/레벨 체계 리뉴얼 1차  by 박소율
 | 20180326 메인 대배너 수정 by 박소율
 | 20180404 프로필개선 1-2차 by 박소율
 | 20180430 메인 대배너 수정 by 박소율
 | 20180511 메인 대배너 수정 by 박소율
 | 20180530 메인 대배너 수정 by 박소율
 | 20180702 메인 대배너 수정 by 박소율
 | 20180730 메인 대배너 수정 by 박소율
 | 20180828 메인 대배너 수정 by 김정인
 | 20180830 메인 대배너 수정 by 김정인
 | 20181031 메인 대배너 수정 by 박소율
 | 20181129 메인 대배너 수정 by 박소율
 | 20181220 하단 학습후기 레벨 크로스 브라우징 by 박소율
 | 20181231 메인 대배너 수정 by 우현진
 | 20190215 [.visualBtn a],[.footerBanner] 수정 by 박소율
 | 20190319 메인 대배너 수정 by 박소율
 | 20190415 올인원 상시페이지 재작업 by 박소율
 | 20190613 올인원 패키지 금액 원복 이미지 교체 by 권용찬
 | 20190617 [.footerBanner.timeFooterBanner] by 박소율
 | 20190729 메인 배너이미지 변경 by 권용찬 
 | 20190814 수강후기 이벤트 .leftBanner 스타일 추가 by 권용찬
 | 20190920 수강후기 이벤트 크롬 css 이슈 수정 by 김승미
 | 20191008 메인 하단 띠배너 배경색 수정 by 김승미 
 | 20191015 메인 하단 띠배너 배경색 컬러코드 클래스 추가 by 김승미 
 | 20191105 대배너1 이벤트 올인원 패키지 이미지 교체 by 김승미 
 | 20191219 스피킹덤 유튜브 소개 영역 추가 by 김승미  
 | 20200107 유튜브 영상클릭유도 개선, 메인 대배너 변경 by 김승미 
 | 20200226 시즌이미지 변경 (겨울>봄) by 김승미 
 | 20250505 하단 배너 배경색 제거 by 박현준 
 +----------------------------------------------------------------------+ 
*/
/* 외주 메인 CSS start */
.freeStudyStart.main{position:relative;width:992px;margin: 0 auto;height:0px;top:0;}
.freeStudyStart.main .bg{display:block;position:absolute;top:-8px;left:-30px;width:256px;height:356px;z-index:7000;background:url('/images/front/main/btn_StudyStart_bg_5.png') no-repeat 0 0;} /* 20170710: 이미지수정(기획실요청); */
.freeStudyStart.main .bg .startBtn{position:absolute;top:114px;left:27px;}

.mainVisualWrap{overflow:hidden;height:350px;}
.mainVisualWrap .mainVisual{position:relative;height:347px !important;z-index:2000;border-bottom:3px solid #f51212;}
.mainVisualWrap .mainVisual ul li{width:100%;height:347px;}
.mainVisualWrap .mainVisual ul li .img{position:relative;width:992px;height:347px;margin: 0 auto;} 
.mainVisualWrap .mainVisual ul li .img a{display:block;height:100%;} 
.mainVisualWrap .mainVisual ul li .img a img{position:absolute;top:0;left:244px;}  
.mainVisualWrap .mainVisual ul li .img .btn{display:inline-block;position:absolute;top:244px;left:410px;}
.mainVisualWrap .mainVisual	.caroufredsel_wrapper ul li{float:left;}

.mainVisual #mainVisual01{background:url('/images/front/main/mainVisual1_bg_21.png') repeat-x 50% 0;}
/* 20180830: 이미지수정, 20170727: 이미지수정 by bsh , 20170922: 이미지수정 by 박소율, 20171102: 이미지수정 by 박소율, 20171119 이미지 수정 by bsh, 20180511 이미지 수정 by 박소율, 20180530 이미지 수정 by 박소율, 20180702 이미지 수정 by 박소율, 20180730 이미지 수정 by 박소율, 20181031 이미지 수정 by 박소율, 20181129 이미지 수정 by 박소율, 20190109 이미지 수정 by 박소율, 20190319 이미지 수정 by 박소율 20190613 이미지 수정 by 권용찬 20190729 이미지 수정 by 권용찬 */
.mainVisual #mainVisual02{background:url('/images/front/main/mainVisual2_bg_5.png') repeat-x 50% 0;} /* 20180828 이미지수정, 20180326 이미지 수정(신규이벤트) by 박소율 , 20180430 bg */
.mainVisual #mainVisual03{background:url('/images/front/main/mainVisual3_bg_4.jpg') repeat-x 50% 0;} /* 20170710: 이미지수정(기획실요청), 20171114 이미지수정 by bsh, 20180326 이미지 수정(기존 2) by 박소율  */
.mainVisual #mainVisual04{background:url('/images/front/main/mainVisual4_bg_3.png') repeat-x 50% 0;} /* 20171114 이미지수정 by bsh, 20180326 이미지 수정(기존 3) by 박소율 */
.mainVisual #mainVisual05{background:url('/images/front/main/mainVisual6_bg_3.png') repeat-x 50% 0;} /* 20171114 이미지수정 by bsh, 20180326 이미지 수정(기존 4) by 박소율 */
.mainVisual #mainVisual06{background:url('/images/front/main/mainVisual5_bg_3.png') repeat-x 50% 0;}/* 20171119 이미지 수정 by bsh */

.mainVisualWrap .mainVisual .visualPage{position:absolute;bottom:0;left:0;z-index:10;opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
.visualBtnWrap{position:relative;width:992px;margin: 0 auto;}
.visualBtn{position:absolute;bottom:3px;right:-5px;height:35px;width:635px;z-index:7000;border:1px solid #000;border-bottom:none;border-radius:8px 8px 0 0;background:#030c15;} 
/* 20190215 width 수정 by 박소율,20190319 width (760->762px) 수정 by 박소율 */
.visualBtn a{position:relative;float:left;width:127px;height:100%;line-height:35px;text-align:center;color:#666666;text-decoration:none;background:url('/images/front/main/bar_visualBtn.png') no-repeat 0 50%;} /* 20190215 width 수정 by 박소율 ,20190319 width (20%->127px) 수정 by 박소율*/
.visualBtn a span{position:relative;display:block;height:36px;line-height:35px;font-size:13px;color:#cccccc;}
.visualBtn a:first-child span{border-radius:8px 0 0 0;}
.visualBtn a:first-child span{border-left:none;}
.visualBtn a:last-child span{border-radius:0 8px 0 0;}
.visualBtn a:focus,
.visualBtn a:hover{text-decoration:none;color:#666666;color:#fff;}
.visualBtn a:focus .onbg,
.visualBtn a:hover .onbg{display:block;}
.visualBtn a:focus span,
.visualBtn a:hover span{border-left:none;text-decoration:none;}
.visualBtn a.on{color:#fff;}
.visualBtn a.on span{position:relative;border-left:none;text-decoration:none;color:#fff;background:#e80506;}
.visualBtn a.on .arr{position:absolute;bottom:-4px;left:0;width:100%;display:block;height:6px;background:#e80506 url('/images/front/main/arr_visualBtn.png') no-repeat 50% 100%;}

.mainContainer{position:relative;}
.maxGuide{overflow:hidden;border-bottom:1px solid #dbdbdb;background:#f4f4f4;}
.maxGuide .inner{width:985px;margin: 0 auto;padding-left:20px;}
.maxGuide .inner a{float:left;}

.quickBanner{position:fixed;top:525px;left:50%;margin-left:510px;z-index:100;}
.quickBanner .close{position:absolute;top:0;right:0;width:19px;height:19px;border:none;background:url('/images/front/main/btn_quickClose.png') no-repeat 0 0;cursor:pointer;}


/* 무료체험 7일 퀵배너 */
.trialQuickBanner{position:relative;z-index:100;}
.trialQuickBanner .banner{position: absolute; top:188px;left:50%;margin-left:510px;}
.trialQuickBanner .banner.on{position:fixed;  top:225px;}



/* section */
.sectionArea01{padding-top:20px;}
.sectionArea01 .inner{width:980px;margin: 0 auto;padding-left:22px;}

.sectionArea02{overflow:hidden;padding-bottom:45px;}
.sectionArea02 .inner{width:996px;margin: 0 auto;}
.sectionArea02 .section01{float:left;width:697px;padding-left:20px;}
.sectionArea02 .section02{float:right;width:246px;}

.sectionArea03{overflow:hidden;background:#f5f5f5;}
.sectionArea03 .inner{width:996px;margin: 0 auto;}
.sectionArea03 .section01{float:left;width:675px;}
.sectionArea03 .section02{float:right;width:285px;}

/* 성공기 영역 START */
/* 20180220 성공체험기영역 추가  by 박소율 */
.sectionSuccess{height: 410px; background-color: #f5f5f5; }
.sectionSuccess .inner{width:980px;margin: 0 auto; overflow:hidden;}
.sectionSuccess .successTitle{margin-top: 30px; margin-bottom: 17px;}

.sectionSuccess .successCnts:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}/* float 해제 */
* html .sectionSuccess .successCnts { height: 1%; }
.sectionSuccess .successCnts { display: block; padding-left: 2px;}
.sectionSuccess .successImg{float:left; margin-right: 8px;}
.sectionSuccess .successImg.successImgLast{margin-right: 0}


/* 성공기 영역 END */

.sectionArea04{overflow:hidden;padding:45px 0 50px 0;border-bottom:1px solid #dbdbdb;background:#fff;} /* 20180220 background-color 수정 by 박소율 */
.sectionArea04 .inner{width:980px;margin: 0 auto;overflow:hidden; }
.sectionArea04 .section01{float:left;width:343px;}
.sectionArea04 .section02{float:left;width:343px;margin-left:12px;}
.sectionArea04 .section03{float:left;width:270px;margin-left:12px;}

/* newMaxPeople*/ 
.newMaxPeople{position:relative;overflow:hidden;}
.newMaxPeople .maxPeopleTabFocus{display:block;position:absolute;top:-9999%;left:-9999%;z-index:10}
.newMaxPeople .maxPeopleTabFocus a{display:block;}
.newMaxPeople .maxPeopleTabFocus.focus{display:block;top:50px;left:0;background:#fff;}
.newMaxPeople .maxPeopleTabFocus a:focus{color:#ff0000}
.newMaxPeople .tit{text-align:center;}
.newMaxPeople .maxPeopleVisual{position:relative;border-top:4px solid #e31e25;}
.newMaxPeople .maxPeopleVisual ul{width:795px;height:310px;overflow:hidden;}
.newMaxPeople .maxPeopleVisual ul li{position:relative;float:left;width:795px;height:310px;position:relative;}
.newMaxPeople .maxPeopleVisual ul li .imgbox{display:block;position:absolute;overflow:hidden;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .txt{position:absolute;z-index:10;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .mask{position:absolute;top:0;left:0;width:100%;height:100%;background:url('/images/front/main/bg_maxPeople_mask.png') repeat 0 0;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .more{display:none;position:absolute;z-index:4}
.newMaxPeople .maxPeopleVisual ul li .imgbox .link{position:absolute;top:0;left:0;display:block;width:100%;height:100%;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border{display:none;position:absolute;top:0;left:0;width:100%;height:100%;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border .top{position:absolute;top:0;left:0;width:100%;height:4px;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border .bottom{position:absolute;bottom:0;left:0;width:100%;height:4px;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border .left{position:absolute;top:0;left:0;height:100%;width:4px;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border .right{position:absolute;top:0;right:0;height:100%;width:4px;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.green > span{background:#189b2c;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.blue > span{background:#038bdf;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.orange > span{background:#f79d01;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.red > span{background:#c11e21;}

.newMaxPeople .maxPeopleVisual ul li .imgbox .border.indigo > span{background:#0f2034;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.brown > span{background:#650302;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.pupple > span{background:#663399;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.deepGreen > span{background:#235943;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .border.skyblue > span{background:#21d1c4;}
.newMaxPeople .maxPeopleVisual ul li .imgbox .img{transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;}
.newMaxPeople .maxPeopleVisual ul li .imgbox:hover .img{transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);-ms-transform:scale(1.2);}
.newMaxPeople .maxPeopleVisual ul li .imgbox:hover .more{display:block;}

.newMaxPeople .maxPeopleMore{position:absolute;top:71px;right:0;}
.peopleListWrap{margin-top:25px;background:#f1f1f1;}
.peopleListWrap .txt{padding-top:12px;text-align:center;font-size:14px;letter-spacing:-1px;font-weight:bold;}
.peopleListWrap .txt strong{color:#000;}
.peopleListWrap .btnWrap{position:relative;width:980px;left:10px;margin: 0 auto;}
.peopleListWrap .btnWrap .btn{position:absolute;top:38px;width:11px;height:20px;border:none;cursor:pointer;outline:none}
.peopleListWrap .btnWrap .btn#prev{left:0px;background:url('/images/front/main/btn_peopleList_prev.png') no-repeat 0 0;}
.peopleListWrap .btnWrap .btn#next{right:5px;background:url('/images/front/main/btn_peopleList_next.png') no-repeat 0 0;}
.peopleList{position:relative;left:0px;width:943px;height:92px;overflow:hidden;margin: 0 auto;}
.peopleList ul{padding:12px 0 0 4px;}
.peopleList li{float:left;position:relative;margin-bottom:20px;
	 -webkit-transition: transform 350ms ease-in-out;
	 -moz-transition: transform 350ms  ease-in-out;
	 -ms-transition: transform 350ms  ease-in-out;
	 transition: transform 350ms  ease-in-out;
}
.peopleList li .img{display:block;border-radius:80px;}
.peopleList li .img img{width:74px;height:74px;}
.peopleList li .img {left:0;cursor:pointer;
	 -webkit-transition: all 600ms ease-in-out;
	 -moz-transition: all 600ms  ease-in-out;
	 -ms-transition: all 600ms  ease-in-out;
	 transition: all 600ms  ease-in-out;
}
.peopleList li .img {margin: 0 -15px}
.ie8 .peopleList li .img ,
.ie9 .peopleList li .img {margin: 0 0\9}/* for ie8 ie9*/
.peopleList li.prev{z-index:1;}
.peopleList li.current{z-index:1;}
.peopleList li.next{z-index:0;}
.peopleListTooltip{display:none;position:absolute;top:0;left:0;padding:7px 5px;border-radius:5px;box-shadow:0 8px 15px rgba(0,0,0,0.2);background:#3b3b3b;z-index:200}
.ie8 .peopleListTooltip,
.ie9 .peopleListTooltip{margin-left: 13px\9} /* for ie8 ie9*/
.peopleListTooltip .arr{content:""; display: block;position:absolute;top:0;left:50%;width:15px;height:8px;margin-top:-8px;margin-left:-7px;background:url('/images/front/main/arr_peopleList_tooltip.png') no-repeat 0 0;}
.peopleListTooltip span{display:block;color:#fff;font-weight:bold;white-space:nowrap;padding-left:18px;}
.peopleListTooltip span.name{background:url('/images/front/main/ico_peopelList_name.png') no-repeat 0 50%;}
.peopleListTooltip span.pos{margin-top:3px;background:url('/images/front/main/ico_peopelList_pos.png') no-repeat 0 50%;}

/* .maxCourse */
.courseIntro{padding-top:2px;}
.courseIntro .tit{padding-bottom:8px;padding-top:39px;margin-bottom:0px;border-bottom:2px solid #e31e25;}
.courseIntro .courseGuide{position:relative;height:392px;}
.courseIntro .courseGuide .pointer{position:absolute;top:18px;left:0;z-index:1;}
.courseIntro .courseGuide .bg{position:absolute;top:18px;left:0;}

.mainStudyMode{padding-top:46px;}
.mainStudyMode .tit{margin-bottom:18px;padding-bottom:5px;border-bottom:2px solid #464646;}
.mainStudyMode ul li{margin-top:8px;}
.mainStudyMode ul li:first-child{margin-top:0;}

/* speakDomPrd */
.speakDomPrd{height:482px;background:url('/images/front/main/speakDomPrd_bg_2.png') repeat-x 50% 0;}

/* studyReple */
.studyReple{position:relative;width:320px;height:392px;padding:12px 10px 6px 10px;border:1px solid #dddddd;background:#fff;}
.studyReple .tit{position:relative; height:35px;}
.studyReple .more{position:absolute;top:20px;right:10px;}
.studyReple a:hover{text-decoration:none}
.studyReple a:hover .id span{text-decoration:underline}
.studyReple a:hover .reple{text-decoration:underline}
.studyReple ul{font-size:11px;padding-top:5px;}
.studyReple ul li{position:relative;padding:16px 0 16px 88px;height:88px;border-top:1px solid #e7e6e6; } /* 20180404 padding값, height 값 수정 by 박소율 */
.studyReple ul li:first-child{border-top:none;}
.studyReple ul li > span{display:block;}
.studyReple ul li .img{position:absolute;top:14px;left:3px;width:72px; text-align: center;} /* 20180320 left값 수정 by 박소율 */
.studyReple ul li .img img{width:58px;height:58px;border:1px solid #d3d3d3; border-radius: 50%;}  /* 20180404 width 수정  by 박소율 */
.studyReple ul li .img .levelArea{overflow: hidden;} /* 20180320 프로필 borde-radius 영역 수정 by 박소율 */
.studyReple ul li .img .levelBoder{position: absolute;left: 0px;top: -7px;} /* 20180320 프로필 테두리 영역 수정, 20180404 크기 수정 by 박소율 */
.studyReple ul li .img .levelBoder img{border: 0;width: 74px;height: 77px;} /* 20180320 프로필 테두리 영역 이미지 수정, 20180404 크기 수정 by 박소율 */
.studyReple ul li .img .landTxt{display:block;height:16px;line-height:16px;letter-spacing:-2px;font-size:12px;text-align:center;color:#ffffff;background:#ddd; margin-top: 15px;} /* 20180320 margin-top 추가, margin-top 수정 by 박소율 */

/* 20180320 level 체계 관련 CSS 수정 START by 박소율 */
.studyReple ul li .img .landTxt.magic{background: url("/images/front/member/landTxtBG_magic.png") no-repeat center 0;}
.studyReple ul li .img .landTxt.magic:after{content:""; display: block;width:67px;height:67px;position:absolute;top:0;left:0;}
.studyReple ul li .img .landTxt.eastern{background: url("/images/front/member/landTxtBG_eastern.png") no-repeat center 0;}
.studyReple ul li .img .landTxt.eastern:after{content:""; display: block;width:67px;height:67px;position:absolute;top:0;left:0;}
.studyReple ul li .img .landTxt.western{background: url("/images/front/member/landTxtBG_western.png") no-repeat center 0;}
.studyReple ul li .img .landTxt.western:after{content:""; display: block;width:67px;height:67px;position:absolute;top:0;left:0;}
.studyReple ul li .img .landTxt.adventure{background: url("/images/front/member/landTxtBG_adventure.png") no-repeat center 0; font-size: 11px}
.studyReple ul li .img .landTxt.adventure:after{content:""; display: block;width:67px;height:67px;position:absolute;top:0;left:0; }
/* 20180320 level 체계 관련 CSS 수정 END by 박소율 */


.studyReple ul li .id{color:#444444;font-size:12px;}
.studyReple ul li .id img{vertical-align:middle;}
.studyReple ul li .time{position:absolute;top:16px;right:0;font-size:12px;color:#bcbcbc;}  /* 20180404 top값 수정 by 박소율  */
.studyReple ul li .reple{height:54px;overflow:hidden;margin-top:4px;color:#888888;line-height:18px;letter-spacing:-1px;font-size:13px;}

.studyReple .lv{position:relative;vertical-align:middle;display:inline}
.studyReple .lv .levelNum{position:absolute;top:-1px;left:0;color:#fff;font-size:11px;width:42px;text-align:center;vertical-align:middle;display:inline;} /* 20180404 width 수정 by 박소율 */
.studyReple .lv .levelNum.levelMaster{color: #3d3d3d; font-family: verdana; font-weight: bold; top:2px; left:22px; width:24px; text-align:center;}
.studyReple .lv .levelNum img{vertical-align: middle} /*  20180320 추가 by 박소율 */
.studyReple ul li .id{line-height:19px;margin-left:5px;position:absolute;}

/* speakDomPrd */ 
.speakDomPrd .prdInner {width:980px;margin: 0 auto;padding-left:20px;}
.speakDomPrd .prdInner h2.tit {text-align:center;padding:37px 0 32px 0;}
.speakDomPrd .prdInner ul li {float:left;margin-left:13px;}
.speakDomPrd .prdInner ul li:first-child{margin-left:0;;}
.speakDomPrd .prdInner ul li .prdBox {width:318px;height:331px;background:url('/images/front/main/bg_prdBpx.png') no-repeat 0 0;}
.speakDomPrd .prdInner ul li .prdBox dt {height:36px;line-height:35px;text-align:center;font-weight:bold;}
.speakDomPrd .prdInner ul li .prdBox dt img {padding-top:9px;}
.speakDomPrd .prdInner ul li .prdBox dd {padding:0 10px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdImg {border-bottom:1px solid #e3e3e3;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt {padding:0 5px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt a{text-decoration:none}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .tit {display:block;padding-top:18px;font-size:20px;letter-spacing:-1px;font-weight:bold;color:#333;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .txt {display:block;height:33px;width:298px;margin-top:11px;letter-spacing:-1px;font-size:13px;color:#787878;word-break:break-all;white-space:normal;word-wrap:break-word;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account {display:block;margin-top:15px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .cancel {position:relative;padding:0 2px;font-size:15px;color:#bebcbc;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .cancel .line{position:absolute;top:50%;left:0;display:block;width:100%;height:1px;background:#bebcbc;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .price{margin-left:10px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .price b{font-size:18px;color:#f04919;font-family:'verdana';letter-spacing:-1px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .price span{font-size:18px;color:#f04919;letter-spacing:-1px;}
.speakDomPrd .prdInner ul li .prdBox dd .prdTxt .account .buter {font-size:15px;color:#333;letter-spacing:-2px;font-weight:bold;margin-left:-4px;}

/* recentStudyNews */
.recentStudyNews{position:relative;width:320px;height:388px;padding:12px 10px 10px 10px;border:1px solid #dddddd;background:#fff;}
.recentStudyNews .tit{position:relative; height:35px;}
.recentStudyNews .more{position:absolute;top:20px;right:10px;}
.recentStudyNews ul{font-size:11px;padding-top:7px;}
.recentStudyNews ul li{position:relative;padding:19px 0 24px 70px;height:47px;border-top:1px solid #e7e6e6;}
.recentStudyNews ul li:first-child{background:none;border-top:none;}
.recentStudyNews ul li > span{display:block;}
/*.recentStudyNews ul li .img{position:absolute;top:14px;left:0;}*/
.recentStudyNews ul li .img_div {position:absolute; top:14px; left:0;}
.recentStudyNews ul li .img_div div {width:60px; height:60px; display:table-cell; vertical-align:middle;}
.recentStudyNews ul li .img_div div img { max-width:60px; max-height:60px; height:auto; vertical-align:middle; border:0px;}
.recentStudyNews ul li .id{color:#444444;font-size:13px;}
.recentStudyNews ul li .time{position:absolute;top:18px;right:0;font-size:11px;color:#aaaaaa;text-decoration:none}
.recentStudyNews ul li .txt{display:block;color:#999999;font-size:12px;letter-spacing:-1px;}
.recentStudyNews ul li .item{display:block;margin-top:2px;font-size:12px;font-weight:bold;}

/* 각 랜드 학습 시작 시 & 아이템 획득시 */
.recentStudyNews ul li .item.magic{color:#309d30;}
.recentStudyNews ul li .item.western{color:#ff9b44;}
.recentStudyNews ul li .item.eastern{color:#1691f4;}
.recentStudyNews ul li .item.adventure{color:#da1b1b}
/* 스테이지 학습 완료 시 */
.recentStudyNews ul li .item.stageComplete{color:#33cccc;}
/* 랜드 학습 완료 시 */
.recentStudyNews ul li .item.landComplete{color:#ff33cc;}


/* maxStudyMode */
.maxStudyMode li{float:left;}

/* notiList */
.notiList{position:relative;padding:12px 10px 10px 10px;height:206px;border:1px solid #dddddd;background:#fff;}
.notiList .more{position:absolute;top:20px;right:10px;}
.notiList .list li{position:relative;height:45px;padding-left:17px;border-top:1px solid #e7e6e6;background:url('/images/front/main/ico_notice.png') no-repeat 3px 50%;}
.notiList .list li:first-child{margin-top:0;border-top:none;}
.notiList .list li a{display:block;width:190px;height:44px;line-height:44px;overflow:hidden;text-overflow:ellipsis;letter-spacing:-1px;white-space:nowrap;color:#666666;}
.notiList .list li a:hover{text-decoration:underline;}
.notiList .list li .date{position:absolute;top:15px;right:0;color:#aaaaaa;font-family:'tahoma';font-size:11px;}
.notiList .list li .best{position:absolute;top:15px;right:0;}
.notiList .list li .new{position:absolute;top:16px;left:0;}

/* customerCenter */
.customerCenter{float:right;padding-top:12px;}
.customerCenter .menu{overflow:hidden;}
.customerCenter .menu a{float:right;padding-top:1px;}
.customerCenter .menu a:first-child{float:left;} 
/* 외주 메인CSS  end */

.courseGuideArea{margin-top:16px;}

.studyStartSmallImg{position:absolute;top:154px;margin-left:-149px;z-index:7500}

/* 서비스점검 안내 팝업 */
.ServiceCheckPopup{position: absolute; left:50%; top: 128px; z-index: 7001; margin: 0px 0 0 -231px; border: 1px solid #000;}
.ServiceCheckPopup .ServiceCheckTxt{text-align: right; padding:10px;  background-color: #000;color:#fff;}
.ServiceCheckPopup .ServiceCheckTxt span{cursor:pointer;}


/* 하단띠배너 */
.footer{padding-bottom: 100px} /* footer.css 초기화 : 하단띠배너 영역으로 메인에서 조정. */

.footerBanner{position: fixed; left: 0; right: 0; bottom: 0; height: 80px; text-align: center; z-index: 100; transition: all 0.5s ease-out;} /* 20190215 bg #5badf2->c4f3ad
 변경 by 박소율 */
.footerBanner.footerBannerOff{bottom: -100%;}

.footerBanner .bannerInner{position: relative; margin: 0 auto; width: 1200px; }
.footerBanner .bannerImg{position: relative;top: -55px;} 
.footerBanner .bannerThumbImg{position: absolute;left: 107px;top: -32px;z-index: 5;} 

.footerBanner .ftBannerCloseBtn{position: absolute; right: 10px; top: 10px;z-index: 1}

/* 타임보드 영역 추가 by 박소율 */
.footerBanner.timeFooterBanner{background-color:#5c6ce6;}
.footerBanner.timeFooterBanner.bgColor_5C6CE6{background-color:#5c6ce6;}
.footerBanner.timeFooterBanner.bgColor_2F82FF{background-color:#2f82ff;}

/* 20190712 타임보드 카운트다운 추가 by 권용찬 */ 

.timeFooterBanner .flip-clock-divider .flip-clock-label{display:none;}
.timeFooterBanner .flip-clock-wrapper{width: 155px; position: absolute; top: 50%; right: 50%; margin-right: -350px; margin-top: -48px;}


/* 수강후기 leftBanner css 추가 */
.leftBanner{position: fixed; z-index: 7002; bottom: 10%; left: 20px;}


/* 유튜브 소개 영역 */
.sectionAreaYoutube{overflow: hidden; padding-bottom: 45px;}
.sectionAreaYoutube .inner{width: 976px; padding-left: 20px; margin: 0 auto;}
.sectionAreaYoutube .tit{display: flex; -ms-display: flex; align-items: center; -ms-align-items: center; justify-content: space-between; -ms-justify-content: space-between; width: 100%; border-bottom: 2px solid #e92e1b;}
.sectionAreaYoutube .tit .titYoutube{padding-top: 2px; padding-bottom: 3px;}
.sectionAreaYoutube .boxYoutube{display: flex; -ms-display: flex; justify-content: space-between; -ms-justify-content: space-between; padding-top: 15px;} 
.boxYoutube .liYoutube{width: 238px;}
.boxYoutube .liYoutube a{text-decoration: none;}
.boxYoutube .liYoutube .tumbBox{position: relative;}
.boxYoutube .liYoutube .tumbLine{position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; border: 4px solid transparent;}
.boxYoutube .liYoutube:first-child .tumbLine{border-color: #1b69e9;}
.boxYoutube .liYoutube:first-child .tumbLine:before{display: block; position: absolute; top: -4px; left: -4px; box-sizing: border-box; padding: 5px; padding-right: 1px; content:'인기영상'; color: #ffffff; font-size: 11px; line-height: 11px; letter-spacing: -0.05em; background-color: #1b69e9;}
.boxYoutube .liYoutube:first-child .tumbLine:after{display: block; position: absolute; top: -4px; left: 43px; border-top: 21px solid #1b69e9; border-right: 10px solid transparent; content: '';}
.boxYoutube .liYoutube .titMovie{overflow: hidden; width: 100%; max-height: 36px; padding-top: 10px; font-size: 15px; line-height: 18px; text-align: left; letter-spacing: -0.05em; color: #333333; white-space: normal; word-wrap: break-word; -ms-word-wrap: break-word; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

/* youtube mouse over */
.boxYoutube .liYoutube a:hover .tumbLine{border-color: #e92d1b;}
.boxYoutube .liYoutube a:hover .tumbLine:before{background-color: #e92d1b;}
.boxYoutube .liYoutube a:hover .tumbLine:after{border-top: 21px solid #e92d1b;}

/* 후기, 소식, 공지 데이터 없을 경우 처리 */
.sectionArea04 .noDataBox {
	display: flex;
    justify-content: center;
    align-items: center;
	height: calc(100% - 35px);
}