@charset "utf-8";

/* 메인페이지 스타일만 정의 */

/* ******************** 데스크탑 (992~) ******************** */
@media screen and (min-width: 992px), print{
	.main {}
	
	/* 가운데 타이틀::공통 */
	.main .centerTit {position:relative; width:1200px; margin:0 auto; text-align:center; font-size:36px; font-weight:400; line-height:1; color:#000; letter-spacing:-1px;}
	.main .centerTit b {font-weight:700;}
	.main .centerTit a {position:absolute; font-size:14px; right:0; top:0; border:1px solid #000; padding:12px 20px 12px 40px; color:#000; transition:all .3s;}
	.main .centerTit a:before,
	.main .centerTit a:after {content:''; display:block; background:#000; position:absolute; top:50%; transform:translateY(-50%); transition:all .3s;}
	.main .centerTit a:before {width:12px; height:2px; left:20px;}
	.main .centerTit a:after {height:12px; width:2px; left:25px;}
	.main .centerTit a:hover {color:#fff; background:#000;}
	.main .centerTit a:hover:before,
	.main .centerTit a:hover:after {background:#fff;}
	.main .centerTit+p {text-align:center; padding-top:10px; letter-spacing:-1px;}
	
	/* 카드목록::공통 */
	.main .dlType1 {}
	.main .dlType1 dl {text-align:center;}
	.main .dlType1 dl>* {letter-spacing:-.5px; line-height:1; overflow:hidden; text-overflow:ellipsis;  white-space:nowrap;}
	.main .dlType1 dl dt {font-size:18px; width:100%; color:#000; padding:20px 0 8px; font-weight:400;}
	.main .dlType1 dl dd {font-size:14px; padding-top:10px;}
	
	/* visual */
	.main .visual {overflow:hidden; background:url(../images/slider/slider_bg.jpg)center /cover no-repeat;}
	.main .visual .sliderV2 {position:relative; width:1200px; height:550px; margin:0 auto; overflow:visible;}
	.main .visual .sliderV2 ul {width:1200px; margin:0 auto;}
	.main .visual .sliderV2 ul li {display:table; width:100%; overflow:hidden; padding-top:100px;}
	.main .visual .sliderV2>ul>li>div {position:relative; display:table-cell; width:50%; vertical-align:top; padding-bottom:20px;}
	.main .visual .sliderV2>ul>li>div.img {position:relative; text-align:center; height:450px;}
	.main .visual .sliderV2>ul>li>div.img img {display:inline-block; height:420px; box-shadow:20px 20px 20px rgba(0,0,0,.3);}	
	.main .visual .sliderV2 ul li a {width:auto; height:auto;}
	.main .visual .sliderV2 .deco {position:absolute; left:0; bottom:0;}
	.main .visual .slider-con {padding-left:60px; margin-top:-11px; position:relative; z-index:9;}
	.main .visual .slider-con p {font-size:50px; font-weight:700; letter-spacing:-1px; color:#000; line-height:1.4;}
	.main .visual .slider-con dl {position:relative; padding:25px 0 44px;}
	.main .visual .slider-con dl>* {line-height:1.9; color:#000;}
	.main .visual .slider-con dl dt {position:absolute; padding-left:20px;}
	.main .visual .slider-con dl dt::before {
		content:''; display:block; width:5px; height:2px; background:#fff;
		position:absolute; left:5px; top:14px;
	}
	.main .visual .slider-con dl dd {padding-left:110px;}
	.main .visual .slider-con a {display:inline-block; color:#fff; background:#ff9000; line-height:1; padding:20px 55px; transition:padding .3s;}
	.main .visual .slider-con a:hover {padding:20px 70px;}

	
	/* 강의자료다운 */
	.main .asideWrap {width:1200px; margin:30px auto 70px; padding:31px 50px; position:relative; overflow:hidden; background:url(../images/main/down-bg.jpg)center /cover no-repeat;}
	.main .asideWrap>* {float:left;}
	.main .asideWrap dl {position:relative;}
	.main .asideWrap dl>* {display:table-cell; color:#fff; vertical-align:middle;}
	.main .asideWrap dl>*:before {content:''; display:block; position:absolute; top:50%; background-position:center center; background-repeat:no-repeat; transform:translateY(-50%);}
	.main .asideWrap dl dt {position:relative; font-size:24px; font-weight:500; letter-spacing:-1px; padding-left:80px; padding-right:15px;}
	.main .asideWrap dl dt:before {width:60px; height:60px; border:3px solid #fff; border-radius:50%;left:0; background-image:url(../images/main/down.png);}
	.main .asideWrap dl dd {position:relative; font-size:18px; padding-left:25px;}
	.main .asideWrap dl dd:before {width:10px; height:2px; background:#fff; left:0;}
	
	.main .asideWrap span {display:block; width:185px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%); background:url(../images/main/down-book.png)left center no-repeat;}
	
	/* 관심집중 도서 */
	.main .rollBanner {width:100%; overflow:hidden;}
	.main .rollWrap {width:1227px; margin:0 auto; padding:36px 0 70px; position:relative;}
	.main .rollWrap ul {position:relative;}
	.main .rollWrap ul li {position:absolute; top:0; padding:0 13.5px; transition:all .5s ease-in-out;}
	.main .rollWrap ul li a {display:block; width:100%; height:100%; padding:20px; box-shadow:10px 10px 10px rgba(0,0,0,.1); border:1px solid #ddd; transition:all .5s ease-in-out;}
	.main .rollWrap ul li:hover a {border-color:#000;}
	.main .rollWrap ul li a span {display:block; width:100%; height:345px; background-size:100% 100% !important;}
	.main .rollWrap ul li.opa {opacity:.5;}
	.main .rollWrap ul li.opa a {border-color:#e5e5e5; box-shadow:none;}
	.main .rollWrap ul li.opa:hover {transform:none;}
	.main .rollWrap .rollBtn {}
	.main .rollWrap .rollBtn button {position:absolute; top:50%; display:block; width:30px; height:50px; cursor:pointer; transform:translateY(-50%);}
	.main .rollWrap .rollBtn button.prev {left:-33px; background:url(../images/main/roll-prev.png)center no-repeat;}
	.main .rollWrap .rollBtn button.next {right:-33px; background:url(../images/main/roll-next.png)center no-repeat;}
	
	/* 탭메뉴 */
	.main .tabWrap {position:relative; width:1200px; margin:0 auto;}
	.main .tabWrap .tabHover {width:100%; overflow:hidden; display:table;}
	.main .tabWrap .tabHover li {position:relative; display:table-cell; width:25%; text-align:center;}
	.main .tabWrap .tabHover li+li:before {
		content:''; display:block; width:1px; height:40px; background:#e2e2e2;
		position:absolute; left:0; top:calc(50% - 15px);
	}
	.main .tabWrap .tabHover li span {position:relative; display:inline-block; letter-spacing:-1px; color:#000; line-height:1.5; padding:9px 10px 19px; font-weight:400; cursor:default;}
	.main .tabWrap .tabHover li span:before {
		content:''; display:block; width:14px; height:14px; background:#dadada; border-radius:50px;
		position:relative; top:-9px; margin:0 auto; transition:all .3s;
	}
	.main .tabWrap .tabHover li span.on:before {width:70px; background:#575da6;}
	
	
	.main .tabWrap .barBanner {position:relative; position:relative; overflow:hidden; height:100px; background:url(../images/main/group-bg.jpg) no-repeat; background-size:cover;}
	.main .tabWrap .barBanner li {position:absolute; left:0; top:100px; width:100%; transition:all .5s; background-position:center; background-repeat:no-repeat;background-size:cover;}
	.main .tabWrap .barBanner li.on {top:0;}
	.main .tabWrap .barBanner li a {display:block; width:100%; height:100%;}
	.main .tabWrap .barBanner span {display:block; width:180px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%);}
	.main .tabWrap .barBanner dl {position:relative; padding:26px 180px 26px 50px;}
	.main .tabWrap .barBanner dl>* {display:table-cell; color:#fff; vertical-align:middle;}
	.main .tabWrap .barBanner dl dt {position:relative; font-size:30px; font-weight:400; letter-spacing:-1px; padding-left:80px;}
	.main .tabWrap .barBanner dl dt:before {
		content:''; display:block; width:60px; height:60px; border:3px solid #fff;
		position:absolute; top:50%; left:0; border-radius:50%; transform:translateY(-50%);
		background-position:center center; background-repeat:no-repeat;
	}
	.main .tabWrap .barBanner dl dd {position:relative; font-size:14px; padding-left:30px;}
	.main .tabWrap .barBanner dl.buy dt:before {background-image:url(../images/main/i-book.png);}
	.main .tabWrap .barBanner dl.group dt:before {background-image:url(../images/main/i-pencil.png);}
	.main .tabWrap .barBanner dl.faq dt:before {background-image:url(../images/main/i-faq.png);}
	.main .tabWrap .barBanner dl.data dt:before {background-image:url(../images/main/i-dataroom.png);}
	.main .tabWrap .barBanner span {display:block; width:185px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%);}
	.main .tabWrap img.book {position:absolute; right:30px; bottom:20px;}
	
	/* 베스트 셀러*/
	.main .bestWrap {margin-top:70px; padding:70px 0; background:url(../images/main/best-bg.jpg)center /cover no-repeat;}
	.main .bestSlider {position:relative; width:1250px; margin:0 auto; overflow:hidden; margin-top:35px;}
	.main .bestSlider ul {width:100%; position:absolute; top:0; left:0; transition:all .5s ease-in-out; font-size:0; text-align:center;}
	.main .bestSlider ul li {display:inline-block; width:20%; padding:0 25px; margin-bottom:30px;}
	.main .bestSlider ul li a {position:inherit; display:block; width:100%;}
	.main .bestSlider span.img {position:relative; display:block; width:100%; box-shadow:10px 10px 10px rgba(0,0,0,.1); background-size:100% 100% !important;}
	.main .bestSlider ul li span.img:after {content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; border:1px solid transparent; transition:all .5s;}
	.main .bestSlider ul li:hover span.img:after {border:1px solid #000;}
	.main .bestSlider dl dt {}
	.main .bestSlider dl dd {}
	.main .bestPage {text-align:center; line-height:1;}
	.main .bestPage a {display:inline-block; width:15px; height:15px; border-radius:50%; background:#000; margin:0 6px;}
	.main .bestPage a.on {background:#ff9000;}
	
	/* 공지사항 & 정보 */
	.main-info {padding:70px 0; width:1200px; margin:0 auto; overflow:hidden;}
	.main-info>div {float:left; width:50%;}
	/* 공지 */
	.main-info .noticeWrap {padding-right:40px;}
	.main-info .noticeWrap h2 {position:relative; font-size:30px; font-weight:400; color:#000; letter-spacing:-1px; margin-bottom:11px;}
	.main-info .noticeWrap h2 a.plus {width:30px; height:100%; position:absolute; right:-8px; top:50%; display:block; transform:translateY(-50%); transition:all .3s;}
	.main-info .noticeWrap h2 a.plus:before,
	.main-info .noticeWrap h2 a.plus:after {content:''; display:block; position:absolute; transform:translate(-50%,-50%); background:#000; top:50%; left:50%;}
	.main-info .noticeWrap h2 a.plus:before {width:12px; height:2px;}
	.main-info .noticeWrap h2 a.plus:after {width:2px; height:12px;}
	.main-info .noticeWrap ul {overflow:hidden;}
	.main-info .noticeWrap ul li {float:left; width:100%; line-height:1;}
	.main-info .noticeWrap ul li a {position:relative; display:block; width:100%; padding:22px 100px 22px 25px; color:#000; letter-spacing:-.5px; overflow:hidden; text-overflow:ellipsis; font-weight:400; white-space:nowrap;}
	.main-info .noticeWrap ul li a:before {
		content:''; display:block; width:4px; height:4px; background:#d4d4d4;
		position:absolute; left:10px; top:28px;
	}
	.main-info .noticeWrap ul li a:hover {color:#575da6;}
	.main-info .noticeWrap ul li a:hover:before {background:#575da6;}
	.main-info .noticeWrap ul li a:hover span {color:#575da6;}
	.main-info .noticeWrap ul li a span {position:absolute; top:22px; right:0;color:#666; font-weight:300;}
	.main-info .noticeWrap ul li+li a {border-top:1px solid #e9e9e9; padding-bottom:21px;}
	.main-info .noticeWrap ul li:last-child a {padding-bottom:0;}
	/* 정보 */
	.main-info .infoWrap {padding-left:40px;}
	.main-info .infoWrap h2 {font-size:30px; font-weight:300; color:#000; letter-spacing:-1px; line-height:1.35; margin-top:-3px; padding-bottom:33px;}
	.main-info .infoWrap h2 b {font-weight:700;}
	.main-info .infoWrap>div {overflow:hidden;}
	.main-info .infoWrap>div>* {float:left; width:calc((100% - 20px)/2); height:210px; padding:26px; background:#6556a5; text-align:center;}
	.main-info .infoWrap>div>* dl {padding-top:90px; background:url(../images/main/info-call.png)top center no-repeat;}
	.main-info .infoWrap>div>* dl>* {color:#fff;}
	.main-info .infoWrap>div>* dt {font-size:18px; letter-spacing:-1px; line-height:1.2; padding-bottom:7px;}
	.main-info .infoWrap>div>* dd {font-size:24px; font-weight:400; line-height:1.2;}
	.main-info .infoWrap>div .account {margin-left:20px; background:#5975a6;}
	.main-info .infoWrap>div .account dl {background-image:url(../images/main/info-account.png);}

}

/* ******************** 태블릿 (~991) ******************** */
@media screen and (min-width:768px) and (max-width: 991px) {
	.main {}
	
	/* 가운데 타이틀::공통 */
	.main .centerTit {position:relative; width:100%; padding:0 20px; text-align:center; font-size:36px; font-weight:400; line-height:1; color:#000; letter-spacing:-1px;}
	.main .centerTit b {font-weight:700;}
	.main .centerTit a {position:absolute; font-size:14px; right:20px; top:0; border:1px solid #000; padding:12px 20px 12px 40px; color:#000; transition:all .3s;}
	.main .centerTit a:before,
	.main .centerTit a:after {content:''; display:block; background:#000; position:absolute; top:50%; transform:translateY(-50%); transition:all .3s;}
	.main .centerTit a:before {width:12px; height:2px; left:20px;}
	.main .centerTit a:after {height:12px; width:2px; left:25px;}
	.main .centerTit a:hover {color:#fff; background:#000;}
	.main .centerTit a:hover:before,
	.main .centerTit a:hover:after {background:#fff;}
	.main .centerTit+p {text-align:center; padding:10px 20px 0; letter-spacing:-1px;}
	
	/* 카드목록::공통 */
	.main .dlType1 {}
	.main .dlType1 dl {text-align:center;}
	.main .dlType1 dl>* {letter-spacing:-.5px; line-height:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	.main .dlType1 dl dt {font-size:18px; width:100%; color:#000; padding:20px 0 8px; font-weight:400;}
	.main .dlType1 dl dd {font-size:14px; padding-top:10px;}
	
	/* visual */
	.main .visual {overflow:hidden; background:url(../images/slider/slider_bg.jpg)center /cover no-repeat;}
	.main .visual .sliderV2 {position:relative; width:100%; height:550px; margin:0 auto; overflow:visible;}
	.main .visual .sliderV2 ul {}
	.main .visual .sliderV2 ul li {display:table; width:100%; overflow:hidden; padding-top:50px;}
	.main .visual .sliderV2>ul>li>div {position:relative; display:table-cell; width:50%; vertical-align:top; padding-bottom:20px;}
	.main .visual .sliderV2>ul>li>div.img {position:relative; text-align:center; height:450px;}
	.main .visual .sliderV2>ul>li>div.img img {display:inline-block; height:420px; box-shadow:20px 20px 20px rgba(0,0,0,.3);}	
	.main .visual .sliderV2 ul li a {width:auto;}
	.main .visual .sliderV2 .deco {position:absolute; left:0; bottom:0; width:50%;}
	.main .visual .sliderV2 .deco img {max-width:100%; height:264px;}
	.main .visual .slider-con {padding-left:20px; padding-right:40px; margin-top:-11px; position:relative; z-index:9; word-break:break-all;}
	.main .visual .slider-con p {
		overflow:hidden; font-size:36px; font-weight:700; letter-spacing:-1px; color:#000; line-height:1.4;
		text-overflow:ellipsis;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
	}
	.main .visual .slider-con dl {margin-top:25px;}
	.main .visual .slider-con dl>* {color:#000;}
	.main .visual .slider-con dl dt {clear:both; margin-top:10px; font-weight:400;}
	.main .visual .slider-con dl dd {overflow:hidden; text-overflow:ellipsis;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
	.main .visual .slider-con a {position:absolute; left:20px; bottom:20px; display:block; width:auto; height:auto !important; color:#fff; background:#ff9000; line-height:1; padding:10px 20px; font-size:14px;}
	
	/* 강의자료다운 */
	.main .asideWrap {padding:30px 20px; position:relative; overflow:hidden; background:url(../images/main/down-bg.jpg)center /cover no-repeat;}
	.main .asideWrap>* {float:left;}
	.main .asideWrap dl {padding-right:130px;}
	.main .asideWrap dl>* {display:table-cell; color:#fff; vertical-align:middle;}
	.main .asideWrap dl>*:before {content:''; display:block; position:absolute; top:50%; background-position:center center; background-repeat:no-repeat; transform:translateY(-50%);}
	.main .asideWrap dl dt {position:relative; font-size:21px; font-weight:500; letter-spacing:-1px; padding-left:65px; padding-right:15px;}
	.main .asideWrap dl dt:before {width:50px; height:50px; border:3px solid #fff; border-radius:50%; left:0; background-image:url(../images/main/down.png); background-size:50%;}
	.main .asideWrap dl dd {position:relative; font-size:16px; padding-left:25px;}
	.main .asideWrap dl dd:before {width:10px; height:2px; background:#fff; left:0;}
	.main .asideWrap span {display:block; width:150px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%); background:url(../images/main/down-book.png)left center no-repeat; background-size:80%;}
	
	/* 관심집중 도서 */
	.main .rollBanner {width:100%; overflow:hidden; margin-top:50px;}
	.main .rollWrap {width:100%; padding:30px 40px 50px; position:relative;}
	.main .rollWrap ul {position:relative;}
	.main .rollWrap ul li {position:absolute; top:0; padding:0 13.5px; transition:all .4s ease-in-out, transform .2s;}
	.main .rollWrap ul li:hover {transform:translateY(-20px);}
	.main .rollWrap ul li a {display:block; width:100%; height:100%; padding:20px; box-shadow:10px 10px 10px rgba(0,0,0,.1); border:1px solid #000; transition:all .5s ease-in-out;}
	.main .rollWrap ul li a span {display:block; width:100%; height:345px; background-size:100% 100% !important;}
	.main .rollWrap ul li.opa {opacity:.5;}
	.main .rollWrap ul li.opa a {border-color:#e5e5e5; box-shadow:none;}
	.main .rollWrap ul li.opa:hover {transform:none;}
	.main .rollWrap .rollBtn {}
	.main .rollWrap .rollBtn button {position:absolute; top:50%; display:block; width:45px; height:50px; cursor:pointer; transform:translateY(-50%);}
	.main .rollWrap .rollBtn button.prev {left:5px; background:url(../images/main/roll-prev.png)center no-repeat;}
	.main .rollWrap .rollBtn button.next {right:5px; background:url(../images/main/roll-next.png)center no-repeat;}
	
	/* 탭메뉴 */
	.main .tabWrap {position:relative; width:100%; margin:0 auto;}
	.main .tabWrap .tabHover {width:calc(100% - 40px); overflow:hidden; display:table;}
	.main .tabWrap .tabHover li {position:relative; display:table-cell; width:25%; text-align:center;}
	.main .tabWrap .tabHover li+li:before {
		content:''; display:block; width:1px; height:40px; background:#e2e2e2;
		position:absolute; left:0; top:calc(50% - 15px);
	}
	.main .tabWrap .tabHover li span {position:relative; display:inline-block; letter-spacing:-1px; color:#000; line-height:1.5; padding:9px 10px 19px; font-weight:400; cursor:default;}
	.main .tabWrap .tabHover li span:before {
		content:''; display:block; width:14px; height:14px; background:#dadada; border-radius:50px;
		position:relative; top:-9px; margin:0 auto; transition:all .3s;
	}
	.main .tabWrap .tabHover li span.on:before {width:70px; background:#575da6;}
	
	
	.main .tabWrap .barBanner {position:relative; position:relative; overflow:hidden; height:100px; background:url(../images/main/group-bg.jpg) no-repeat; background-size:cover;}
	.main .tabWrap .barBanner li {position:absolute; left:0; top:100px; width:100%; transition:all .5s; background-position:center; background-repeat:no-repeat;background-size:cover;}
	.main .tabWrap .barBanner li.on {top:0;}
	.main .tabWrap .barBanner li a {display:block; width:100%; height:100%;}
	.main .tabWrap .barBanner span {display:block; width:180px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%);}
	.main .tabWrap .barBanner dl {position:relative; padding:26px 180px 26px 50px;}
	.main .tabWrap .barBanner dl>* {display:table-cell; color:#fff; vertical-align:middle;}
	.main .tabWrap .barBanner dl dt {position:relative; font-size:30px; font-weight:400; letter-spacing:-1px; padding-left:80px;}
	.main .tabWrap .barBanner dl dt:before {
		content:''; display:block; width:60px; height:60px; border:3px solid #fff;
		position:absolute; top:50%; left:0; border-radius:50%; transform:translateY(-50%);
		background-position:center center; background-repeat:no-repeat;
	}
	.main .tabWrap .barBanner dl dd {position:relative; font-size:14px; padding-left:30px;}
	.main .tabWrap .barBanner dl.buy dt:before {background-image:url(../images/main/i-book.png);}
	.main .tabWrap .barBanner dl.group dt:before {background-image:url(../images/main/i-pencil.png);}
	.main .tabWrap .barBanner dl.faq dt:before {background-image:url(../images/main/i-faq.png);}
	.main .tabWrap .barBanner dl.data dt:before {background-image:url(../images/main/i-dataroom.png);}
	.main .tabWrap .barBanner span {display:block; width:185px; height:100%; position:absolute; right:0; top:50%; transform:translateY(-50%);}
	.main .tabWrap img.book {position:absolute; right:30px; bottom:20px;}
	
	
	/* 베스트 셀러
	.main .bestWrap {padding:70px 0; background:url(../images/main/best-bg.jpg)center /cover no-repeat;}
	.main .bestSlider {position:relative; margin:0 auto; overflow:hidden; margin-top:35px;}
	.main .bestSlider ul {width:100%; position:absolute; top:0; left:0; transition:all .5s ease-in-out; font-size:0; text-align:center;}
	.main .bestSlider ul li {display:inline-block; width:33.3333%; padding:0 25px; margin-bottom:30px;}
	.main .bestSlider ul li a {position:inherit; display:block; width:100%;}
	.main .bestSlider span.img {position:relative; display:block; width:100%; box-shadow:10px 10px 10px rgba(0,0,0,.1);}
	.main .bestSlider ul li span.img:after {content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; border:1px solid transparent; transition:all .5s;}
	.main .bestSlider ul li:hover span.img:after {border:1px solid #000;}
	.main .bestSlider dl dt {}
	.main .bestSlider dl dd {}
	.main .bestPage {text-align:center; line-height:1;}
	.main .bestPage a {display:inline-block; width:15px; height:15px; border-radius:50%; background:#000; margin:0 6px;}
	.main .bestPage a.on {background:#ff9000;}
	*/
	
	/* 베스트 셀러*/
	.main .bestWrap {padding:70px 0 40px; background:url(../images/main/best-bg.jpg)center /cover no-repeat;}
	.main .bestSlider {height:auto !important; position:relative; margin:0 auto; overflow:visible; margin-top:35px;}
	.main .bestSlider ul {position:relative; top:0 !important; left:0; transition:all .5s ease-in-out; font-size:0; text-align:center; padding:0 10px;}
	.main .bestSlider ul li {display:inline-block; width:25%; margin-bottom:30px; padding:0 10px;}
	.main .bestSlider ul li a {position:inherit; display:block; width:100%;}
	.main .bestSlider span.img {position:relative; display:block; width:100%; background-size:100% 100% !important;}
	.main .bestSlider span.img:after {content:""; position:absolute; display:block; width:100%; height:100%; border:1px solid rgba(0,0,0,.1);}
	.main .bestSlider ul li:hover span.img:after {border:1px solid #000;}
	.main .bestSlider dl dt {}
	.main .bestSlider dl dd {}
	.main .bestPage {display:none;}
	
	/* 공지사항 & 정보 */
	.main-info {padding:50px 20px; width:100%;overflow:hidden;}
	.main-info>div {width:100%;}
	/* 공지 */
	.main-info .noticeWrap {padding-bottom:50px;}
	.main-info .noticeWrap h2 {position:relative; font-size:30px; font-weight:400; color:#000; letter-spacing:-1px; margin-bottom:11px;}
	.main-info .noticeWrap h2 a.plus {width:30px; height:100%; position:absolute; right:-8px; top:50%; display:block; transform:translateY(-50%); transition:all .3s;}
	.main-info .noticeWrap h2 a.plus:before,
	.main-info .noticeWrap h2 a.plus:after {content:''; display:block; position:absolute; transform:translate(-50%,-50%); background:#000; top:50%; left:50%;}
	.main-info .noticeWrap h2 a.plus:before {width:12px; height:2px;}
	.main-info .noticeWrap h2 a.plus:after {width:2px; height:12px;}
	.main-info .noticeWrap ul {overflow:hidden;}
	.main-info .noticeWrap ul li {float:left; width:100%; line-height:1;}
	.main-info .noticeWrap ul li a {position:relative; display:block; width:100%; padding:22px 100px 22px 25px; color:#000; letter-spacing:-.5px; overflow:hidden; text-overflow:ellipsis; font-weight:400; white-space:nowrap;}
	.main-info .noticeWrap ul li a:before {
		content:''; display:block; width:4px; height:4px; background:#d4d4d4;
		position:absolute; left:10px; top:28px;
	}
	.main-info .noticeWrap ul li a:hover {color:#575da6;}
	.main-info .noticeWrap ul li a:hover:before {background:#575da6;}
	.main-info .noticeWrap ul li a:hover span {color:#575da6;}
	.main-info .noticeWrap ul li a span {position:absolute; top:22px; right:0;color:#666; font-weight:300;}
	.main-info .noticeWrap ul li+li a {border-top:1px solid #e9e9e9; padding-bottom:21px;}
	.main-info .noticeWrap ul li:last-child a {padding-bottom:0;}
	/* 정보 */
	.main-info .infoWrap {}
	.main-info .infoWrap h2 {font-size:30px; font-weight:300; color:#000; letter-spacing:-1px; line-height:1.35; margin-top:-3px; padding-bottom:33px;}
	.main-info .infoWrap h2 b {font-weight:700;}
	.main-info .infoWrap>div {overflow:hidden;}
	.main-info .infoWrap>div>* {float:left; width:calc((100% - 20px)/2); height:210px; padding:26px; background:#6556a5; text-align:center;}
	.main-info .infoWrap>div>* dl {padding-top:90px; background:url(../images/main/info-call.png)top center no-repeat;}
	.main-info .infoWrap>div>* dl>* {color:#fff;}
	.main-info .infoWrap>div>* dt {font-size:18px; letter-spacing:-1px; line-height:1.2; padding-bottom:7px;}
	.main-info .infoWrap>div>* dd {font-size:24px; font-weight:400; line-height:1.2;}
	.main-info .infoWrap>div .account {margin-left:20px; background:#5975a6;}
	.main-info .infoWrap>div .account dl {background-image:url(../images/main/info-account.png);}

}


/* ******************** 모바일 (~768) ******************** */
@media screen and (max-width: 767px) {
	
.main {}
	
	/* 가운데 타이틀::공통 */
	.main .centerTit {position:relative; width:100%; padding:0 20px; font-size:36px; font-weight:400; line-height:1; color:#000; letter-spacing:-2px;}
	.main .centerTit b {font-weight:700;}
	.main .centerTit a {position:absolute; font-size:13px; right:20px; top:0; border:1px solid #000; padding:12px 20px 12px 40px; color:#000; transition:all .3s;}
	.main .centerTit a span {display:none;}
	.main .centerTit a:before,
	.main .centerTit a:after {content:''; display:block; background:#000; position:absolute; top:50%; transform:translateY(-50%); transition:all .3s;}
	.main .centerTit a:before {width:12px; height:2px; left:20px;}
	.main .centerTit a:after {height:12px; width:2px; left:25px;}
	.main .centerTit a:hover {color:#fff; background:#000;}
	.main .centerTit a:hover:before,
	.main .centerTit a:hover:after {background:#fff;}
	.main .centerTit+p {font-size:13px; padding:10px 20px 0; letter-spacing:-1px;}
	
	/* 카드목록::공통 */
	.main .dlType1 {}
	.main .dlType1 dl {text-align:center;}
	.main .dlType1 dl>* {letter-spacing:-.5px; line-height:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	.main .dlType1 dl dt {font-size:16px; width:100%; color:#000; padding:15px 0 0; font-weight:400;}
	.main .dlType1 dl dd {font-size:14px; padding-top:8px;}
	
	/* visual */
	.main .visual {overflow:hidden; background:url(../images/slider/slider_bg.jpg)center /cover no-repeat;}
	.main .visual .sliderV2 {position:relative; width:100%; margin:0 auto;}
	.main .visual .sliderV2 ul {overflow:hidden;}
	.main .visual .sliderV2 ul li {overflow:hidden; padding-top:50px;}
	.main .visual .sliderV2>ul>li>div {position:relative;}
	.main .visual .sliderV2>ul>li>div.img {position:relative; text-align:center;}
	.main .visual .sliderV2>ul>li>div.img img {display:inline-block; max-height:40vh; box-shadow:10px 10px 10px rgba(0,0,0,.3);}	
	.main .visual .sliderV2 ul li a {}
	.main .visual .sliderV2 .deco {display:none;}
	.main .visual .slider-con {padding-left:20px; padding-right:40px; margin-top:-11px; position:relative; z-index:9; word-break:break-all;}
	.main .visual .slider-con {overflow:hidden;}
	.main .visual .slider-con p {
		overflow:hidden; padding-top:40px; font-size:24px; font-weight:700; letter-spacing:-1px; color:#000; line-height:1.4;
		text-overflow:ellipsis;  display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical;
	}
	.main .visual .slider-con dl {margin-top:10px;}
	.main .visual .slider-con dl>* {color:#000; float:left; vertical-align:top; margin-top:3px;}
	.main .visual .slider-con dl dt {clear:both; width:80px; font-weight:400;}
	.main .visual .slider-con dl dd {width:calc(100% - 80px); overflow:hidden; text-overflow:ellipsis;  display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; line-height:1.4;}
	.main .visual .slider-con a {position:absolute; right:20px; bottom:0; display:block; width:auto; height:auto !important; color:#fff; background:#ff9000; line-height:1; padding:10px 20px; font-size:14px;}
	
	/* 강의자료다운 */
	.main .asideWrap {position:relative; overflow:hidden; padding:30px 20px; background:url(../images/main/down-bg.jpg) no-repeat center/cover;}
	.main .asideWrap dl {position:relative; color:#fff; padding-right:100px;}	
	.main .asideWrap dl:after {content:""; position:absolute; top:0; right:0; display:block; width:50px; height:50px; border:3px solid #fff; border-radius:50%; background:url(../images/main/down.png) no-repeat center/50%}
	.main .asideWrap dl dt {position:relative; font-size:20px; font-weight:500; letter-spacing:-1px; line-height:1;}
	.main .asideWrap dl dd {position:relative; margin-top:10px; font-size:15px; line-height:1.4;}
	.main .asideWrap dl dd:before {width:10px; height:2px; background:#fff; left:0;}
	.main .asideWrap span {display:none;}
	
	/* 관심집중 도서 */
	.main .rollBanner {overflow:hidden; padding:50px 0 20px; background:#f5f5f5;}
	.main .rollWrap {position:relative; padding-top:30px;}
	.main .rollWrap ul {position:relative;}
	.main .rollWrap ul li {width:50%; float:left; margin-bottom:40px;}
	.main .rollWrap ul li a {display:block; width:100%; height:100%;}
	.main .rollWrap ul li:nth-child(odd) a {padding:0 10px 0 20px;}
	.main .rollWrap ul li:nth-child(even) a {padding:0 20px 0 10px;}
	.main .rollWrap ul li a span {position:relative; display:block; width:100%; background-size:100% 100% !important;}	
	.main .rollWrap ul li a span:after {content:""; position:absolute; display:block; width:100%; height:100%; border:1px solid rgba(0,0,0,.1);}	
	.main .rollWrap .rollBtn {display:none;}
	
	
	/* 탭메뉴 */
	.main .tabWrap {width:100%;}
	.main .tabWrap .tabHover {display:none;}
	.main .tabWrap .book {display:none;}
	
	.main .tabWrap .barBanner {position:relative; position:relative; overflow:hidden; background:#5c4ba4;}
	.main .tabWrap .barBanner li {width:50%; float:left;}
	.main .tabWrap .barBanner li.on {display:block;}
	.main .tabWrap .barBanner li a {display:block; width:100%; padding:30px 20px; text-align:center; color:#fff;}
	.main .tabWrap .barBanner li:nth-child(2),
	.main .tabWrap .barBanner li:nth-child(3) {background:#6556a5;}
	.main .tabWrap .barBanner li dt {font-size:20px; font-weight:500; line-height:1; letter-spacing:-1px; padding-bottom:10px;}
	.main .tabWrap .barBanner li dd {font-size:12px; opacity:.7; line-height:1.4;}
	
	
	/* 베스트 셀러*/
	.main .bestWrap {padding:70px 0 40px; background:url(../images/main/best-bg.jpg)center /cover no-repeat;}
	.main .bestSlider {height:auto !important; position:relative; margin:0 auto; overflow:visible; margin-top:35px;}
	.main .bestSlider ul {position:relative; top:0 !important; left:0; transition:all .5s ease-in-out;}
	.main .bestSlider ul li {float:left; width:50%; margin-bottom:30px;}
	.main .bestSlider ul li:nth-child(odd) {padding:0 10px 0 20px;}
	.main .bestSlider ul li:nth-child(even) {padding:0 20px 0 10px;}
	.main .bestSlider ul li a {position:inherit; display:block; width:100%;}
	.main .bestSlider span.img {position:relative; display:block; width:100%; background-size:100% 100% !important;}
	.main .bestSlider span.img:after {content:""; position:absolute; display:block; width:100%; height:100%; border:1px solid rgba(0,0,0,.1);}
	.main .bestSlider ul li:hover span.img:after {border:1px solid #000;}
	.main .bestSlider dl dt {}
	.main .bestSlider dl dd {}
	.main .bestPage {display:none;}
	
	/* 공지사항 & 정보 */
	.main-info {padding-top:50px; width:100%;overflow:hidden;}
	.main-info>div {width:100%;}
	/* 공지 */
	.main-info .noticeWrap {padding-bottom:50px;}
	.main-info .noticeWrap h2 {position:relative; padding:0 20px; font-size:30px; font-weight:400; color:#000; letter-spacing:-1px; margin-bottom:11px;}
	.main-info .noticeWrap h2 a.plus {width:30px; height:100%; position:absolute; right:8px; top:50%; display:block; transform:translateY(-50%); transition:all .3s;}
	.main-info .noticeWrap h2 a.plus:before,
	.main-info .noticeWrap h2 a.plus:after {content:''; display:block; position:absolute; transform:translate(-50%,-50%); background:#000; top:50%; left:50%;}
	.main-info .noticeWrap h2 a.plus:before {width:12px; height:2px;}
	.main-info .noticeWrap h2 a.plus:after {width:2px; height:12px;}
	.main-info .noticeWrap ul {overflow:hidden;}
	.main-info .noticeWrap ul li {float:left; width:100%; line-height:1;}
	.main-info .noticeWrap ul li a {position:relative; display:block; width:100%; padding:17px 120px 14px 35px; color:#000; letter-spacing:-.5px; overflow:hidden; text-overflow:ellipsis; font-weight:400; white-space:nowrap; line-height:1;}
	.main-info .noticeWrap ul li a:before {
		content:''; display:block; width:4px; height:4px; background:#d4d4d4;
		position:absolute; left:25px; top:22px;
	}
	.main-info .noticeWrap ul li a:hover {color:#575da6;}
	.main-info .noticeWrap ul li a:hover:before {background:#575da6;}
	.main-info .noticeWrap ul li a:hover span {color:#575da6;}
	.main-info .noticeWrap ul li a span {position:absolute; top:17px; right:20px;color:#666; font-weight:300;}
	.main-info .noticeWrap ul li+li a {border-top:1px solid #f5f5f5;}
	.main-info .noticeWrap ul li:last-child a {padding-bottom:0;}
	
	/* 정보 */
	.main-info .infoWrap {padding-top:50px; border-top:1px solid #e0e0e0;}
	.main-info .infoWrap h2 {font-size:30px; font-weight:300; color:#000; letter-spacing:-1px; line-height:1.35; margin-top:-3px; padding:0 20px 20px;}
	.main-info .infoWrap h2 b {font-weight:700;}
	.main-info .infoWrap>div {overflow:hidden;}
	.main-info .infoWrap>div>* {position:relative; display:block; overflow:hidden; padding:40px 20px; color:#fff;}
	.main-info .infoWrap>div>*:after {content:""; width:40px; height:40px; position:absolute; right:20px; top:30px; background-repeat:no-repeat; background-position:center; background-size:cover; }
	.main-info .infoWrap>div .call {background:#6556a5;}
	.main-info .infoWrap>div .call:after {background-image:url(../images/main/info-call.png);}	
	.main-info .infoWrap>div .account {background:#5975a6;}
	.main-info .infoWrap>div .account:after {background-image:url(../images/main/info-account.png);}
	.main-info .infoWrap>div>* dt {font-weight:500; line-height:1; letter-spacing:-1px; padding-bottom:10px;}
	.main-info .infoWrap>div>* dd {font-size:20px;}
}









