@charset "utf-8"; 
/* copyright(c) WEBsiting.co.kr */

/* �������������� ����Ǵ� �ڵ� */
#sideBar,
#topSpacer { display:none; } 
#ctWrap { width:100%; max-width:100%; margin:0 auto !important; padding-top:129px; } 
@media all and (max-width:980px)
 { 
#hd,
#hd #tnb,
#hd #gnb { background:#fff; } 
#topSpacer { display:block; } 
 } 

.clearfix:after { display:block; clear:both; content:"."; visibility:hidden; height:0; } 
.clearfix { display:block; } 
/*#gnb { border-bottom:none; } */
/* ���������� ����� */
.visual { position:relative; } 
.visual_main { width:100%; height:455px; margin:0 auto 70px; text-align:center; } 
.visual_main a { display:block; width:100%; height:100%; } 

.visual_main .wrap-visual { position:relative; width:100%; height:455px; } 
.visual_main .wrap-visual::after { content:''; width:100%; max-width:2000px; height:455px; background-size:cover; position:absolute; left:0; top:0; background-position:center top; } 
.visual_main .visual01 { background-color:#37297c; } 
.visual_main .visual02 { background-color:#413f40; } 
.visual_main .visual03 { background-color:#320d0c; } 
.visual_main .visual04 { background-color:#d5e2d0; }
.visual_main .visual05 {background-color:#fff5dc;}
.visual_main .visual06 {background-color:#fff5dc;}
.visual_main .visual05 .m_img{display:none;}
.visual_main .visual06 .m_img{display:none;}
.visual_main .visual01::after { background-image:url('/theme/basic/img/main/main_visual03.jpg'); } 
.visual_main .visual02::after { background-image:url('/theme/basic/img/main/main_visual01.jpg'); } 
.visual_main .visual03::after { background-image:url('/theme/basic/img/main/main-201028.jpg'); } 
.visual_main .visual04::after { background-image:url('/theme/basic/img/main/main_visual04.jpg'); }
.visual_main .visual05::after { background-image:url('/theme/basic/img/main/main_visual05.jpg'); }
.visual_main .visual06::after { background-image:url('/theme/basic/img/main/main_visual06.jpg'); }

@media all and (max-width:640px){
    .visual_main .visual05 .m_img,
    .visual_main .visual06 .m_img{display:block; position:absolute; width:100%; height:auto; left:50%; top:50%; transform: translate(-50%, -50%);}
    .visual_main .visual05 .m_img img,
    .visual_main .visual06 .m_img img{display:block; width:100%;}
    .visual_main .visual05::after { background-image:none; }
    .visual_main .visual06::after { background-image:none; }

}

/* slick button custom */
.arrowSlider { position:absolute; left:calc(50% - 600px); top:calc(50% - 16px); width:1200px; z-index:10; } 
.arrowSlider #button-prev, .arrowSlider #button-next { display:inline-block; width:20px; height:37px; background-repeat:no-repeat; background-size:100%; font-size:0; line-height:0; color:transparent; position:absolute; top:0; cursor:pointer; } 
.arrowSlider #button-prev { background-image:url('/theme/basic/img/main/btn-pre.png'); left:0; } 
.arrowSlider #button-next { background-image:url('/theme/basic/img/main/btn-next.png'); right:0; } 

.visual_main .slick-prev, .visual_main .slick-next { z-index:10; width:20px; height:37px; opacity:1 !important; color:#fff; } 
.slick-next.slick-disabled:before,.slick-prev.slick-disabled:before { opacity:1 } 
.slick-next:before, .slick-prev:before { opacity:1 !important; } 
.visual_main .slick-prev::before, .visual_main .slick-next::before { width:20px; height:37px; content:''; position:absolute; background-size:100%; } 
.visual_main .slick-prev::before { background:url('/theme/basic/img/main/btn-pre.png') no-repeat; left:420px; } 
.visual_main .slick-next::before { background:url('/theme/basic/img/main/btn-next.png') no-repeat; right:420px; } 

.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover { color:#fff; background-color:#fff; } 
.banner-section { margin-bottom:50px; } 
.banner-section .main-wrap { width:100%; max-width:1200px; margin-left:auto; margin-right:auto; } 

.board-list { float:left; width:373px; margin-right:32px; } 

.banner-section .banner-list { float:left; width:469px; margin-right:32px; } 
.banner-section .banner-list > ul li { float:left; width:233px; height:146px; background-color:#dcdcdc; margin-bottom:3px; background-repeat:no-repeat; } 
.banner-section .banner-list > ul li:nth-child(1), .banner-section .banner-list > ul li:nth-child(4) { background-color:#ebebeb; } 
.banner-section .banner-list > ul li:nth-child(2n+1) { margin-right:3px; } 
.banner-section .banner-list > ul li:nth-child(1) { background-image:url('/theme/basic/img/main/ico-banner01.png'); background-position:right 25px top 40px; }
.banner-section .banner-list > ul li:nth-child(2) { background-image:url('/theme/basic/img/main/ico-banner02.png'); background-position:right 25px top 40px; }
.banner-section .banner-list > ul li:nth-child(3) { background-image:url('/theme/basic/img/main/ico-banner03.png'); background-position:right 25px top 40px; }
.banner-section .banner-list > ul li:nth-child(4) { background-image:url('/theme/basic/img/main/ico-banner04.png'); background-position:right 25px top 40px; }
.banner-section .banner-list > ul li a { display:block; padding:25px 15px; position:relative; } 
/*.banner-section .banner-list > ul li a::after { content:''; display:block; width:25px; height:25px; color:#fff; position:absolute; right:0; top:0; background:#1c1b19 url('/theme/basic/img/main/more-banner.png') no-repeat center; } */
.banner-section .banner-list > ul li h2 { font-size:18px; line-height:35px; color:#000; font-weight:800; margin-bottom:8px; } 
.banner-section .banner-list > ul li p { font-size:14px; line-height:17px; color:#6b6b6b; font-weight:300; letter-spacing:-0.05em; width:90px; word-break:keep-all; } 




.tel-list { float:left; width:294px; height:295px; border:2px solid #e5e5e5; padding:12px; } 
.tel-list .main-number { padding-bottom:12px; border-bottom:1px solid #e5e5e5; letter-spacing:-0.05em; padding-left:60px; position:relative; } 
.tel-list .main-number::before { content:''; width:41px; height:42px; background:url('/theme/basic/img/main/ico-tell.png') no-repeat; position:absolute; left:7px; top:10px; } 
.tel-list .main-number dl::after { content:''; display:block; clear:both; } 
.tel-list .main-number dt { float:left; width:35px; text-align:right; padding-right:10px; font-size:16px; color:#dc539e; font-weight:800; line-height:30px; position:relative; } 
.tel-list .main-number dt::after { content:''; width:1px; height:17px; background-color:#e172ad; position:absolute; right:0; top:8px; } 
.tel-list .main-number dd { float:left; width:calc(100% - 35px); font-size:25px; color:#000; font-weight:700; line-height:30px; padding-left:10px; } 
.tel-list .part-number { text-align:center; letter-spacing:-0.05em; } 
.tel-list .part-number h3 { font-size:16px; line-height:20px; color:#dc539e; font-weight:700; margin-top:15px; margin-bottom:10px; } 
.tel-list .part-number ul li { font-size:20px; line-height:24px; color:#000; font-weight:700; } 

.story { width:100%; background-color:#eee; padding-top:55px; padding-bottom:100px; } 
.story .main-wrap { width:1200px; margin:0 auto; } 
.story h2 { font-size:33px; font-weight:700; color:#000; text-align:center; } 
.story ul.story-list { margin:40px -20px; width:calc(100% + 40px); } 
.story ul.story-list li { float:left; width:calc(33.3% - 40px); height:245px; padding:13px 13px 52px; margin:20px; background-color:#fff; } 
.story ul.story-list li a { display:block; height:100%; } 
.story ul.story-list li a img { height:180px; } 
.story ul.story-list li .sbj-story { text-align:center; font-size:16px; color:#1c1b19; line-height:50px; letter-spacing:-0.05em; } 

.sns { width:100%; } 
.sns .sns-banner { float:left; width:50%; height:65px; background-color:#fff; padding-top:10px; } 
.sns .sns-link { float:left; width:50%; } 
.sns .sns-link li { float:left; width:calc(50% - 20px); margin-left:20px; height:67px; } 
.sns .sns-link li img { max-height:49px; } 
.sns .sns-link li a { display:block; background-color:#fff; border:1px solid #ddd; text-align:center; line-height:65px; } 


/* ���� ������ ���̾ƿ� */

.mainContents { width:100%; max-width:1200px; margin:0 auto; overflow:hidden; clear:both;; position:relative; } 
.cts400 { height:400px; } 
.mainContents h2.serif { font-family: 'Noto Serif KR', serif; font-size:40px; color:#fff; font-weight:300; line-height:60px; text-align:center; } 
.mainContents h2 strong { color:#f9e8a4; font-weight:300; } 

.mainContentsW100 { width:100%; clear:both; overflow:hidden; } 

.latTitNone .galleryLat,
.latTitNone .galleryBoxLat { margin:0px; padding:0px; } 
.latTitNone .galleryBoxLat ul { margin:0px; padding:0px; } 
.latTitNone .galleryLat ul li,
.latTitNone .galleryBoxLat ul li { width:20%; } 
.latTitNone .galleryLat .galleryLatTit,
.latTitNone .galleryBoxLat .galleryLatTit { height:1px; overflow:hidden; margin-top:-1px; } 
.latTitNone.btnMoreNone .lt_more { display:none; } 


/* 2�ܷ��̾ƿ� */
.mainTwoLatArea { width:100%; margin:0 auto; overflow:hidden; } 
.mainTwoLatArea .MTLA01,
.mainTwoLatArea .MTLA02 { width:50%; float:left; margin-left:-1px; } 


/* 3�ܷ��̾ƿ� */
.mainThreeLatArea { width:100%; margin:0 auto; overflow:hidden; padding-bottom:80px; } 
.mainThreeLatArea .MTLA02,
.mainThreeLatArea .MTLA03 { width:294px; float:left; margin-left:32px; /*0border-bottom:1px solid #c5c5c5; */ } 


.MTLA01 .basicLatTit { display:block; text-align:center; border-bottom:none; margin-left:-2px; width:105px; letter-spacing:-0.05em; } 
.MTLA01 .basicLatTit:first-child { margin-left:0; } 
.MTLA01 .basicLatTit a { display:block; position:relative; font-size:15px; line-height:40px; font-weight:500; color:#c5c5c5; border:1px solid #c5c5c5;; border-bottom:none; background-color:#eee; }
.MTLA01 .basicLatTit a:hover, .MTLA01 .basicLatTit.active a { border-color:#666; z-index:10; border-bottom:1px solid #fff; margin-bottom:-1px; background-color:#fff; color:#000; } 

.title-bbs { width:100%; border-bottom:1px solid #666; position:relative; } 
.title-bbs h2 { float:left; } 
.title-bbs h2.h2-first { padding-right:17px; position:relative; } 
.title-bbs h2.h2-first::after { content:''; position:absolute; right:0; top:8px; width:2px; height:20px; background-color:#000; } 
.title-bbs h2.h2-second { padding-left:17px; } 
.view-bbs02, .view-bbs03, .view-bbs04  { display:none; }

.more-board { position:absolute; right:0; top:10px; width:15px; height:15px; background:url('/theme/basic/img/main/more-board.png') no-repeat; font-size:0; line-height:0; color:transparent; } 

.main-edu { float:left; width:548px; /*border-bottom:1px solid #c5c5c5; */position:relative; } 
.main-edu h2 { display:block; text-align:left; border-bottom:1px solid #666; padding-bottom:14px; font-size:22px; margin-bottom:20px; } 
.main-edu .list-thumb li { height:260px } 
.main-edu .list-thumb li.bg-banner { background:url('/theme/basic/img/main/img-banner.jpg') no-repeat; background-size:cover; position:relative; } 
.main-edu .list-thumb li.bg-banner img { position:absolute; right:65px; top:103px; } 
.main-edu table.main_edu_list{font-size:16px;color:#262626;margin-top:-20px;}
.main-edu table tr{height:50px;border-bottom:1px solid #c9c9c9;cursor:pointer;}
.main-edu table tr:hover{background:#fafafa;}
.main-edu table td:first-child{padding-left:5px;line-height:50px;height:50px;overflow:hidden;text-overflow: ellipsis;white-space: normal;word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.main-edu table td:last-child{width:30%;text-align:right;padding-right:5px;font-size:13px;color:#888;}
.pic_view_lt.program_list{height:250px;overflow:hidden;}
@media all and (max-width:1220px) {

}


/* 4�� ���̾ƿ� */
.mainFourLatArea { width:100%; margin:0 auto; overflow:hidden; } 
.mainFourLatArea .MTLA01,
.mainFourLatArea .MTLA02,
.mainFourLatArea .MTLA03,
.mainFourLatArea .MTLA04 { width:25%; float:left; margin-left:-1px; } 

/* ������ �� */
.background-dark { position:relative; background:#4b4b4b; } 
.background-dark .webzLatTit a,
.background-dark .basicLatTit a,
.background-dark .qnaLatTit a { color:#fff; } 
.background-dark ul li { } 
.background-dark ul li a { color:#ddd; } 


/* ��������� �� */
.background-light { background:#fff; } 

/* �Ŀ���û */
.sponsor { background-color:#2f6e00; width:160px; height:55px; position:fixed; right:150px; top:180px; z-index:500; font-size:18px; text-align:center; line-height:55px; } 
.sponsor a { color:#fff; display:block; width:160px; height:55px; padding-left:25px; } 
.sponsor:before { content:'';; background:url("/theme/basic/img/main/icon_sponsor.png") no-repeat; width:23px; height:19px; position:absolute; left:30px; top:18px; } 

@media all and (max-width:1800px) { 
.sponsor { right:0; } 
 } 
@media all and (max-width:1520px) { 
.sponsor { display:none; } 
 } 
/* 2020-08-19 ������ ���̾ƿ� */
@media all and (max-width:1220px) { 
 .banner-section { padding:0 20px; } 
 .board-list { float:none; margin-right:0; margin-bottom:20px; width:100%; } 
 .banner-section .banner-list { width:calc(100% - 370px); margin-right:20px; } 
 .banner-section .banner-list > ul li { width:calc(50% - 1.5px); } 
 .tel-list { width:350px; } 
 .main-edu { float:none; width:100%; margin-bottom:20px; } 
 .mainThreeLatArea .MTLA02, .mainThreeLatArea .MTLA03 { margin:0; margin-bottom:20px; width:calc(50% - 10px); } 
 .mainThreeLatArea .MTLA02 { margin-right:20px; } 
 .pic_view_lt li .lt_img img { width:100%; height:230px; } 
 .pic_view_lt li .pic_li_tit { display:block; text-align:center; padding:0; } 
 #logo { padding-left:20px; } 
 #btn-menu { right:20px; } 
 .mainThreeLatArea { padding-bottom:0; } 
 } 

@media(max-width:1199px) { 
 .visual_main .visual01 > div,
 .banner-section .main-wrap,
 .story .main-wrap { width:100%; } 
 .banner-section,
 .mainContents,
 .story .main-wrap { padding-left:20px; padding-right:20px; } 
 .banner-section ul.banner-list li { background-position:right 15px bottom 35px } 
.visual .visual_txt { font-size:33px; line-height:40px } 
.visual .visual_txt strong { font-size:50px; line-height:70px; } 
 .story ul.story-list li { width:calc(50% - 40px); } 
 .story ul.story-list li a img { width:100%; } 
 .arrowSlider { width:100%; left:0; } 
 .arrowSlider #button-prev { left:30px; } 
 .arrowSlider #button-next { right:30px; } 
 } 

@media(max-width:1100px) { 
 #ctWrap { padding-top:0; } 
 .visual_main { margin-top:70px; } 

 } 

@media(max-width:1050px) { 
 .banner-section ul.banner-list li { width:calc(50% - 24px); margin-bottom:12px; } 
 } 

@media all and (max-width:980px) { 
.visual { margin-top:0; } 
.mainFourLatArea .MTLA01,
.mainFourLatArea .MTLA02,
.mainFourLatArea .MTLA03,
.mainFourLatArea .MTLA04 { width:50%; float:left; } 
 .visual_main { margin-top:20px; } 

 } 

@media all and (max-width:900px) { 
 .banner-section .banner-list { float:none; width:100%; margin-right:0; margin-bottom:20px; } 
 .tel-list { float:none; width:100%; } 
 } 

@media all and (max-width:850px) { 
 .sns .sns-banner, .sns .sns-link { float:none; width:100%; } 
 .sns .sns-banner { margin-bottom:20px; } 
 .sns .sns-link li:first-child { margin-left:0; } 
 .sns .sns-link li { width:calc(50% - 10px); } 
 .sns .sns-link li a { padding-left:10px; padding-right:10px; } 
 .sns .sns-link li a img { width:100%; } 
.mainTwoLatArea { padding:0 15px; } 
.mainTwoLatArea .MTLA01,
.mainTwoLatArea .MTLA02 { width:100%; float:none; } 
 .story ul.story-list li .sbj-story { font-size:14px; letter-spacing:-0.07em; } 
 } 
@media all and (max-width:680px) { 
 .story ul.story-list li { width:calc(100% - 40px); float:none; } 
 } 
@media all and (max-width:650px) { 
 .visual_main { height:450px; } 

 .mainThreeLatArea .MTLA02, .mainThreeLatArea .MTLA03 { float:none; width:100%; margin-right:0; margin-bottom:20px; } 
.mainContentsW100 .galleryLat ul li,
.mainContentsW100 .galleryBoxLat ul li { width:33.33333333%; } 
.mainContentsW100 .galleryLat ul li:last-child,
.mainContentsW100 .galleryBoxLat ul li:last-child { display:none;; } 
 } 
@media all and (max-width:550px) { 
.banner-section ul.banner-list { margin-left:0; margin-right:0; } 
 .banner-section ul.banner-list li { width:100%; margin:0 0 20px; background-position:right 25px bottom 50%; } 
 .banner-section ul.banner-list li p { width:calc(100% - 60px); } 
 .main-edu .list-thumb li.bg-banner { background-image:url('/theme/basic/img/main/img-banner02.jpg'); } 
 .visual_main .visual01::after { background-image:url('/theme/basic/img/main/m_visual03.jpg'); } 
 .visual_main .visual02::after { background-image:url('/theme/basic/img/main/m_visual01.jpg'); } 
 .visual_main .visual03::after { background-image:url('/theme/basic/img/main/m_visual02.jpg'); } 
 .visual_main .visual04::after { background-image:url('/theme/basic/img/main/main_m_visual04.jpg'); } 
 } 
@media all and (max-width:520px) { 
 .banner-section .banner-list > ul li { float:none; width:100%; } 
 .banner-section .banner-list > ul li:nth-child(2n+1) { margin-right:0; } 
 .banner-section .banner-list > ul li:nth-child(3) { background-color:#ebebeb; } 
 .banner-section .banner-list > ul li:nth-child(4) { background-color:#dcdcdc; }

    .MTLA01 .title-bbs{width:calc(100% - 25px);}
    .MTLA01 .basicLatTit{width:50%; margin-left:0;}
    .MTLA01 .basicLatTit:nth-child(even) a{border-left:none;}
    .more-board{right:-25px; top:35px;}
    .MTLA01 .basicLatTit a:hover,
    .MTLA01 .basicLatTit.active a{border-bottom:1px solid #666;}
    .MTLA01 .basicLatTit:nth-child(even).active a{border-left:1px solid #666;;}
 } 

@media all and (max-width:380px) {
    /*
 .MTLA01 .basicLatTit { width:85px; } 
 .MTLA01 .basicLatTit a { font-size:14px; } */
 .tel-list .main-number dd { font-size:22px; } 
 .main-edu .list-thumb li.bg-banner img { right:calc(50% - 105px); } 
 } 
@media all and (max-width:350px) { 
 .story ul.story-list li .sbj-story { width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 
 } 




 
/*220111 메인 수정*/
.banner-list { float:left; width:548px;} 
.banner-list > ul li { float:left; width:calc((548px - 3px)/2); height:170px; background-color:#dcdcdc; margin-bottom:3px; background-repeat:no-repeat; } 
.banner-list > ul li:nth-child(1), .banner-list > ul li:nth-child(4) { background-color:#ebebeb; } 
.banner-list > ul li:nth-child(2n+1) { margin-right:3px; } 
.banner-list > ul li:nth-child(1) { background-image:url('/theme/basic/img/main/ico-banner01.png'); background-position:right 25px top 55px; } 
.banner-list > ul li:nth-child(2) { background-image:url('/theme/basic/img/main/ico-banner02.png'); background-position:right 25px top 60px; } 
.banner-list > ul li:nth-child(3) { background-image:url('/theme/basic/img/main/ico-banner03.png'); background-position:right 25px top 60px; } 
.banner-list > ul li:nth-child(4) { background-image:url('/theme/basic/img/main/ico-banner04.png'); background-position:right 26px top 55px; } 
.banner-list > ul li a { display:block; padding:35px 30px; position:relative; } 
.banner-list > ul li h2 { font-size:18px; line-height:35px; color:#000; font-weight:800; margin-bottom:8px; } 
.banner-list > ul li p { font-size:14px; line-height:17px; color:#6b6b6b; font-weight:300; letter-spacing:-0.05em; width:90px; word-break:keep-all; } 
.main-edu{width:469px; margin-right:32px;}
@media all and (max-width:1220px) {
	.main-edu{width:calc(100% - 380px);float:left;margin-right:30px;}
	.tel-list{margin-top:7px;}
	.banner-list { float:none; width:100%;margin-bottom:60px;} 
	.banner-list > ul li{width:calc((100% - 9px)/4);}
	.banner-list > ul li:nth-child(2){margin-right:3px;}
	.banner-list > ul li:nth-child(1) {background-position:right 15px top 55px; } 
	.banner-list > ul li:nth-child(2) {background-position:right 15px top 60px; } 
	.banner-list > ul li:nth-child(3) {background-position:right 15px top 68px; } 
	.banner-list > ul li:nth-child(4) {background-position:right 16px top 55px; } 
}
@media all and (max-width:960px) {
	.main-edu{width:100%;float:none;margin-right:0;}
	.tel-list{width:100%;float:none;}
	.banner-list > ul li{width:calc((100% - 3px)/2);}
	.banner-list > ul li:nth-child(odd) { margin-right:3px; } 
	.banner-list > ul li:nth-child(even) { margin-right:0px; } 
}
@media all and (max-width:550px) {
	.banner-list > ul { margin-left:0; margin-right:0; } 
	.banner-list > ul li { width:100%; height:150px;margin:0 0 3px; background-position:right 25px bottom 50%; } 
	.banner-list > ul li a{padding:25px 25px;}
	.banner-list > ul li p { width:90px; } 
}

/*221114 게시판->배너 로 수정 (220117 고객사 요청으로 현재 보이지 않음) */
.main-edu .pc-program-banner{max-width:100%;}
.main-edu .mobile-program-banner{display:none;max-width:100%;}
@media all and (max-width:1220px) {
	.main-edu .pc-program-banner{display:none;}
	.main-edu .mobile-program-banner{display:block;width:100%;max-width:100%;}
}


/*메인 수정*/
.board-list{width:450px;margin-right:30px;}
.banner-section .banner-list{width:calc(100% - 480px);margin-right:0;}
.banner-section .banner-list > ul li{width:calc((100% - 20px)/3);margin-right:10px;margin-bottom:10px; background-position:right 10px top 40px !important;}
.banner-section .banner-list > ul li:nth-child(2n+1){margin-right:10px;}
.banner-section .banner-list > ul li:nth-child(3n){margin-right:0;}
.banner-section .banner-list > ul li:nth-child(odd){background-color:#ebebeb;}
.banner-section .banner-list > ul li:nth-child(even){background-color:#dcdcdc;}


.banner-section .banner-list > ul li:nth-child(1) { background-image:url('/theme/basic/img/main/ico-banner05.png');}
.banner-section .banner-list > ul li:nth-child(2) { background-image:url('/theme/basic/img/main/ico-banner01.png');}
.banner-section .banner-list > ul li:nth-child(3) { background-image:url('/theme/basic/img/main/ico-banner02.png');}
.banner-section .banner-list > ul li:nth-child(4) { background-image:url('/theme/basic/img/main/ico-banner03.png');}
.banner-section .banner-list > ul li:nth-child(5) { background-image:url('/theme/basic/img/main/ico-banner06.png');}
.banner-section .banner-list > ul li:nth-child(6) { background-image:url('/theme/basic/img/main/ico-banner04.png');}
@media all and (max-width:1220px) {
    .board-list{float:left;width:350px;}
    .banner-section .banner-list{width:calc(100% - 380px);}
    .banner-section .banner-list > ul li{background-size:80px 80px;background-position:right 10px top 50px !important;}
}
@media all and (max-width:1000px) {
    .board-list{float:none;width:100%;margin-right:0;}
    .banner-section .banner-list{float:none;width:100%;}
}
@media all and (max-width:640px) {
    .banner-section .banner-list > ul li{width:calc((100% - 5px)/2);margin-right:5px;margin-bottom:5px;}
    .banner-section .banner-list > ul li:nth-child(2n+1){margin-right:5px;}
    .banner-section .banner-list > ul li:nth-child(3n){margin-right:5px;}
    .banner-section .banner-list > ul li:nth-child(2n){margin-right:0;}
    .banner-section .banner-list > ul li:nth-child(1),
    .banner-section .banner-list > ul li:nth-child(4),
    .banner-section .banner-list > ul li:nth-child(5){background-color:#ebebeb;}
    .banner-section .banner-list > ul li:nth-child(2),
    .banner-section .banner-list > ul li:nth-child(3),
    .banner-section .banner-list > ul li:nth-child(6){background-color:#dcdcdc;}
}
@media all and (max-width:520px) {
    .banner-section .banner-list > ul li{float:left;height:140px;}
    .banner-section .banner-list > ul li{background-size:60px 60px;background-position:right 5px bottom 10px !important;}
    .banner-section .banner-list > ul li a{width:100%;height:100%;padding:20px 15px;}
    .banner-section .banner-list > ul li h2{font-size:16px;line-height:1.4;}
    .banner-section .banner-list > ul li p{font-size:13px;}
}
@media all and (max-width:400px) {
    .banner-section .banner-list > ul li{float:none;width:100%;height:110px;margin-right:0px;}
    .banner-section .banner-list > ul li{background-position:right 10px bottom 10px !important;}
    .banner-section .banner-list > ul li:nth-child(2n+1){margin-right:0px;}
    .banner-section .banner-list > ul li:nth-child(3n){margin-right:0px;}
    .banner-section .banner-list > ul li p{width:calc(100% - 80px);}
    .banner-section .banner-list > ul li:nth-child(1),
    .banner-section .banner-list > ul li:nth-child(3),
    .banner-section .banner-list > ul li:nth-child(5){background-color:#ebebeb;}
    .banner-section .banner-list > ul li:nth-child(2),
    .banner-section .banner-list > ul li:nth-child(4),
    .banner-section .banner-list > ul li:nth-child(6){background-color:#dcdcdc;}

}