@charset "utf-8";

* {font-family: 'nsr','맑은고딕','Malgun Gothic',-apple-system;}
a, abbr, address, article, aside, audio, body, canvas, caption, cite, dd, details, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, img, label, legend, li, menu, nav, object, ol, p, section, span, strong, summary, table, tbody, td, tfoot, th, thead, tr, ul, video{font-family: 'nsr','맑은고딕','Malgun Gothic',-apple-system;}

@-webkit-keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}
@keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}

@-webkit-keyframes arr {0%,100% {-webkit-transform:translateX(0);}50% {-webkit-transform:translateX(6px);}}
@keyframes arr {0%,100% {transform:translateX(0);}50% {transform:translateX(6px);}}

/* 메인 레이아웃  */
#top_layout .top_wrap #logo {margin-left:60px;}
.edu_open #top_layout .top_wrap #logo > a {background-image: url(/images/edu/common/logo3.png);}
#top_layout .top_wrap .utile_wrap li.pc a,
#top_layout .top_wrap .utile_wrap li.mo button  {background: #0067b9 url(/images/edu/common/menu2.png)no-repeat center;}
.edu_open #top_layout .top_wrap .utile_wrap li.pc a,
.edu_open #top_layout .top_wrap .utile_wrap li.mo button  {background: #2788d0 url(/images/edu/common/menu2.png)no-repeat center;}

#top_layout:after {display:block; position:absolute; content:''; left:100%; top:0; right:0; width:auto; height:145px;background: #3e70cc;background-image: linear-gradient(-90deg,#2788d0,#3e70cc); }
.edu_open #top_layout:after {left:70px;transition:all 0.5s; -webkit-transition:all 0.5s; }
.edu_open #gnb_layout .depth1_ul>li>a span {color:#fff;}
.edu_open #gnb_layout .depth1_ul>li>a:after {background:#fff;z-index: 1;}

@media(max-width:1600px){
    #top_layout .top_wrap #logo {margin-left:10px;}
    .edu_open #top_layout:after {left:20px;}
    #gnb_layout .depth1_ul {padding-left: 190px;}
    .open_popup2 #gnb_layout .depth1_ul {padding-left:0;}
}
@media(max-width:1200px){
    .open_popup2 #gnb_layout .depth1_ul>li>a {padding:0 20px;}
    .open_popup2 #gnb_layout .depth1_ul>li>a span {font-size:18px;}
}
@media(max-width:767px){
    .edu_open #top_layout:after {display:none;}
    #top_layout .top_wrap #logo {margin-left:0;}
    .edu_open #top_layout .top_wrap #logo > a {background-image:url(/images/edu/common/logo2.png);}
    .edu_open #top_layout .top_wrap .utile_wrap li.pc a,
    .edu_open #top_layout .top_wrap .utile_wrap li.mo button  {background: #fff url(/images/edu/common/menu.png)no-repeat center;}
    #top_layout .top_wrap .utile_wrap li.mo button {background: #fff url(/images/edu/common/menu.png)no-repeat center;}
}
/* 메인 레이아웃  */



/* 오픈 팝업  */
.modal-open #op_layout {z-index:1;}
#op_layout{position:relative;z-index: 9999;width:100%;height:0;background: #0e3d6e;text-align:center;}
#op_layout.on{height: 100px;}
#op_layout .btn_open {position:absolute;right: 100px;bottom: -110px;}
#op_layout .btn_open a {display:block;color: #666;font-size: 15px;}
.edu_open #op_layout .btn_open a {color:#fff;}
#op_layout .btn_open a span {display:inline-block;width:14px;height:16px;margin: -2px 10px 0 0;background:url(/images/edu/common/pop_ico.png)no-repeat;font-size: 0;vertical-align: middle;}
.edu_open #op_layout .btn_open a span {background:url(/images/edu/common/pop_ico2.png)no-repeat;}
#op_layout .btn_open a em {display:inline-block;width:24px;height:24px;line-height:24px;margin-left: 10px;border-radius: 50%;background:#1976d2;text-align:center;color:#fff;font-weight:bold;font-size: 14px;}
#op_layout .btn_close {position:absolute;right: 35px;bottom: 35px;width:30px;height:30px;}
#op_layout .btn_close a {display:block;opacity: 1;width:100%;height:100%;}
#op_layout .btn_close a span {display:block;width:100%;height:100%;background: #26507c;font-size: 0;}
#op_layout .btn_close a span:before,
#op_layout .btn_close a span:after {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
#op_layout .btn_close a span:before {width:50%;height:1px;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);}
#op_layout .btn_close a span:after {width:1px;height:50%;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);}

#op_layout .op_wrap{display:none;}
#op_layout.on .op_wrap{display: inline-block;position: relative;width:100%;max-width: 1260px;height:100%;}
#op_layout .op_wrap .sliderBox{display:none;}
#op_layout.on .op_wrap .sliderBox{display:inline-block;overflow:hidden;width:100%;height:100%;}
#op_layout .op_wrap .sliderBox ul{overflow: hidden;position:relative;width:100%;height:100%;;}
#op_layout .op_wrap .sliderBox ul .item{position:relative;width:100%;height: 100px;text-align: center;}
#op_layout .op_wrap .sliderBox ul .item a {display:block;position: relative;width:100%;height:100%;}
#op_layout .op_wrap .sliderBox ul .item span {display:block; width:100%; height:100%; }
#op_layout .op_wrap .controlBox{display:none;}
#op_layout.on .op_wrap .controlBox{display: block;width:100%;}
#op_layout.on .op_wrap .controlBox .paging{display: none;}
#op_layout.on .op_wrap .controlBox .paging .btn_page{display:inline-block;width:26px;height:26px;font-size:0;}
#op_layout.on .op_wrap .controlBox .paging .btn_page.on{background-position:0 0;}
#op_layout.on .op_wrap .controlBox button{display:block;position:absolute;top: 50%;width: 40px;height: 40px;border-radius: 50%;background:#3d638a;margin-top: -20px;font-size:0;}
#op_layout.on .op_wrap .controlBox button.btn_prev{left:50%;margin-left: -630px;}
#op_layout.on .op_wrap .controlBox button.btn_next{right:50%;margin-right: -630px;}
#op_layout.on .op_wrap .controlBox button.btn_play,
#op_layout.on .op_wrap .controlBox button.btn_stop {right:50%;margin-right: -590px; background:none;}
#op_layout.on .op_wrap .controlBox button[data-control="prev"]:before,
#op_layout.on .op_wrap .controlBox button[data-control="next"]:before{width:8px;height:8px;border-color: #fff;}
#op_layout.on .op_wrap .controlBox button[data-control="prev"]:before{border-width: 0 0 1px 1px;}
#op_layout.on .op_wrap .controlBox button[data-control="next"]:before{border-width: 1px 1px 0 0;}
#op_layout.on .op_wrap .controlBox button[data-control="stop"]:before{width:1px;height:13px;box-shadow: -2px 0 #fff, 2px 0 #fff;}
#op_layout.on .op_wrap .controlBox button[data-control="play"]:before{border-width: 7px 0 7px 9px;border-color: transparent transparent transparent #fff;}

#op_layout.on .never {display:inline-block;}
#op_layout .never{display:none;position:absolute;bottom: 38px;right: 90px;border:none;background:transparent;vertical-align:middle;}
#op_layout .never #never_op{display:inline-block;margin-right:5px;vertical-align:middle;}
#op_layout .never label{display:inline-block;margin: 0;line-height: 1;color: #fff; font-size: 15px;vertical-align:middle;}

@media(max-width:1800px){
    #op_layout.on .op_wrap .controlBox button.btn_prev{margin-left: -330px;}
    #op_layout.on .op_wrap .controlBox button.btn_next{margin-right: -330px;}
    #op_layout.on .op_wrap .controlBox button.btn_play,
    #op_layout.on .op_wrap .controlBox button.btn_stop {margin-right: -290px;}
}

@media(max-width:1200px){
    #op_layout.on {height:150px;}
    #op_layout .op_wrap .sliderBox {border-bottom: 1px solid #3e648b;}
    #op_layout .op_wrap .sliderBox,
    #op_layout.on .op_wrap .sliderBox {height:100px;min-height: 100px;}
    #op_layout.on .op_wrap .controlBox button {top:30px;}
    #op_layout.on .op_wrap .controlBox button.btn_prev{left:30px; margin:0;}
    #op_layout.on .op_wrap .controlBox button.btn_next{right:30px; margin:0;}
    #op_layout.on .op_wrap .controlBox button.btn_play,
    #op_layout.on .op_wrap .controlBox button.btn_stop {right:70px; margin:0;}
    #op_layout .never {bottom: 13px;right: 80px;}
    #op_layout .btn_close {bottom: 10px;right: 30px;}
    #op_layout .btn_close a span {background:none;}
}

@media(max-width:767px){
    #op_layout.on .op_wrap .controlBox button {background:none;}
    #op_layout.on .op_wrap .controlBox button.btn_prev{left:10px; }
    #op_layout.on .op_wrap .controlBox button.btn_next{right:10px;}
    #op_layout.on .op_wrap .controlBox button.btn_play,
    #op_layout.on .op_wrap .controlBox button.btn_stop {right:40px;}
    #op_layout .btn_close {right:15px;}
    #op_layout .never {right:60px;}
    
    #op_layout .btn_open {right:50px;}
    #op_layout .btn_open a {font-size:0;}
    #op_layout .btn_open a span {width:20px;height:23px;margin: 0 -9px 0 0;background:url(/images/edu/common/pop_ico3.png)no-repeat;}
    .edu_open #op_layout .btn_open a span {background:url(/images/edu/common/pop_ico3.png)no-repeat;}
    #op_layout .btn_open a em {position: relative;top: -7px;margin: 0;}
}

@media(max-width:580px){
    #op_layout.on .op_wrap .controlBox {display:inline-block;position: absolute;z-index: 999;left: 15px;bottom: 6px;width: auto;}
    #op_layout.on .op_wrap .controlBox button {display:inline-block;position:relative;top: auto;width: 20px;vertical-align: top;}
    #op_layout.on .op_wrap .controlBox button.btn_prev,
    #op_layout.on .op_wrap .controlBox button.btn_next,
    #op_layout.on .op_wrap .controlBox button.btn_play,
    #op_layout.on .op_wrap .controlBox button.btn_stop {left:auto; right:auto;}
}
@media(max-width:430px){
    #op_layout .op_wrap .sliderBox ul .item span img {height:70px;margin:15px 0 0; }
}
/* 오픈 팝업  */



#main_visual .slick-list,
#main_visual .slick-list .slick-track,
#main_visual .slick-list .slick-track .slick-slide,
#main_visual .slick-list .slick-track .slick-slide >div,
#main_visual .slick-list .slick-track .slick-slide >div .photo_list--item,
#main_visual .slick-list .slick-track .slick-slide >div .photo_list--item a {display:inline-block;width:100%;height:100%;vertical-align:top;}

#main_visual {overflow: hidden;position:relative;padding-left: 70px;}
#main_visual .viewer_area {overflow: hidden;position: relative;z-index: 1;width:100%;height:650px;border-radius: 60px 0 0 60px;}
#main_visual .viewer_area .images_fade {width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;vertical-align: top;}
#main_visual .viewer_area a {display:block; width:100%;height:100%; }
#main_visual .viewer_area .images_fade img {display:none; opacity:0;}
#main_visual .viewer_area .images_fade span {font-size:0;}
#main_visual .slick-arrow {display:none !important;}
#main_visual .controlbox {position:absolute;left: 50%;bottom: 30px;z-index: 2;width: 1260px;margin-left: -630px;}
#main_visual .controlbox .inner {display: inline-block;float: right;position:relative;width: calc(100% - 130px);height:100%;}
#main_visual .controlbox .slick-dots {display:inline-block;position: relative;width: 100%;height: 1px;margin: 29px 0 0;background: rgba(255, 255, 255, 0.2);}
#main_visual .controlbox .slick-dots:after{display:block; clear:both; visibility:hidden; content:'';}
#main_visual .controlbox .slick-dots li {display:inline-block;float:left;position: absolute;left:0;bottom:0;width:0;height: 100%;background: #fff;}
#main_visual .controlbox .slick-dots li.slick-active {width: 100%;-webkit-animation: ProgressDots 11s both;animation: ProgressDots 11s both;}
#main_visual .controlbox .slick-dots li button {display:none;}
#main_visual .controlbox >button {float: left;width:60px;height:60px;font-size:0;-webkit-transition:all 0.3s;transition:all 0.3s;}
#main_visual .controlbox >button.pause {}
#main_visual .controlbox >button.play {}
#main_visual .controlbox >button[data-control="stop"]:before{width: 4px;height: 13px;box-shadow: -3px 0 #fff, 3px 0 #fff;}
#main_visual .controlbox >button[data-control="play"]:before{right: -5px;width: 0;height: 0;border-width: 7px 0 7px 11px;border-style: solid;border-color: transparent transparent transparent #fff;}
#main_visual .controlbox .paging {display:inline-block;float: left;}
#main_visual .controlbox .paging .total {}
#main_visual .controlbox .paging .total span {display:inline-block;line-height: 60px; margin:0 2px;font-size:16px;color:#fff;}

.side_edu {position:absolute;right:0;top:0;z-index: 1;width: 0;}
.side_edu.on {width: 100%;height: 100%;padding-left:70px;}
.side_edu > button{position: absolute;right: 0;top: 0;width:70px;height:450px;border-radius: 0 0 0 30px;background: #0067b9;}
.side_edu.on > button {display:none;}
.side_edu > button > span {display:block;position: absolute;right: -190px;top: 190px;width:450px;height:70px;line-height: 70px;padding: 0 30px;color: #fff;text-align: right;font-size: 17px;font-weight: bold;letter-spacing: 0.09em;transform: rotate(90deg);-webkit-transform: rotate(90deg);}
.side_edu > button > span:after {display:block;position:absolute;right: 270px;top: 35px;content:'';width:170px;height:1px;background:rgba(255,255,255,.3);}
.side_edu > button > span em {display:inline-block;position: relative;width:24px;height:24px;margin-left: 20px;border-radius:50%;background:#3385c7;font-size:0;vertical-align:middle;}
.side_edu > button > span em:after {display:block;position:absolute;right: 9px;top: 10px;content:'';width: 3px;height: 3px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);}
.side_edu > div {/* display:none; */overflow: hidden;opacity: 0;position: relative;right: 0;top: 0;left: 100%;width: auto;height: 100%;border-radius: 0 0 0 60px;background: #3e70cc;background-image: linear-gradient(-90deg,#2788d0,#3e70cc);}
.side_edu.on > div {/* display:block; */opacity: 1;left: 0;transition:all 0.5s;-webkit-transition:all 0.5s;}
.side_edu > div .inner {width:100%;max-width: 1350px;margin:0 auto;padding: 145px 0 0;}
.side_edu > div .inner > .obj {position:absolute;top: 80px;left: 50%;width:1106px;height:86px;margin-left: -325px;background:url(/images/edu/main/text.png)no-repeat;font-size:0;}
.side_edu #edu {}
.side_edu #edu:after {display:block; clear:both; visibility:hidden; content:'';}
.side_edu #edu .title {float: left;width:250px;margin-left: -35px;padding: 60px 0 0;}
.side_edu #edu .title strong {display:block; line-height:1; font-size:35px; font-weight:bold; color:#fff; }
.side_edu #edu .title p {margin:30px 0 0; color:#fff; font-size:18px; }
.side_edu #edu .title p span {display:block;color:#fff; font-size:18px; line-height:1.3;}
.side_edu #edu .title .control {display:inline-block; margin:35px 0 0;border-top: 1px solid #6690d2;border-left: 1px solid #6690d2;}
.side_edu #edu .title .control:after {display:block; clear:both; visibility:hidden; content:'';}
.side_edu #edu .title .control button[data-control]{float:left; width:45px;height:45px;margin:0;border-right: 1px solid #6690d2;border-bottom: 1px solid #6690d2;vertical-align:middle; font-size:0;}
.side_edu #edu .title .control button[data-control]:before,
.side_edu #edu .title .control button[data-control]:after {display:none;}
.side_edu #edu .title .control button[data-control="prev"] {background:url(/images/edu/main/arr_prev.png) no-repeat center;}
.side_edu #edu .title .control button[data-control="next"] {background:url(/images/edu/main/arr_next.png) no-repeat center;}
.side_edu #edu .title .control a {display:inline-block;float:left; position:relative; width:45px;height:45px;margin:0;border-right: 1px solid #6690d2;border-bottom: 1px solid #6690d2;vertical-align:middle;font-size:0; }
.side_edu #edu .title .control a:before,
.side_edu #edu .title .control a:after {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
.side_edu #edu .title .control a:before{width:50%;height:1px;background: #fff;}
.side_edu #edu .title .control a:after {width:1px;height:50%;background: #fff;}
.side_edu #edu .grap {overflow: hidden;float:right;width: calc(100% - 250px);padding: 40px 0 0;}
.side_edu #edu .grap ul {position:relative;width: 1000%;}
.side_edu #edu .grap ul:after {display:block; clear:both; visibility:hidden; content:'';}
.side_edu #edu .grap ul li {float:left; width:300px; height:360px; margin-right:20px; }
.side_edu #edu .grap ul li a {display:block;width: 100%;height: 100%;}
.side_edu #edu .grap ul li a .innerbox {width: 100%;height: 100%;padding:50px 40px 0;background:#fff;transition: all 0.3s;-webkit-transition: all 0.3s;}
.side_edu #edu .grap ul li a:hover .innerbox,
.side_edu #edu .grap ul li a:focus .innerbox {transform:translateY(-40px);}
.side_edu #edu .grap ul li .cate {display:block; font-size:16px; font-weight:bold; }
.side_edu #edu .grap ul li .cate1 {color:#0d5dac;}
.side_edu #edu .grap ul li .cate2 {color:#19a9d2;}
.side_edu #edu .grap ul li .cate3 {color:#8e8e8e;}
.side_edu #edu .grap ul li strong {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;height: 56px;line-height: 1.3;margin:15px 0 50px;font-size: 22px;font-weight: bold;color: #211b15;text-overflow: ellipsis;white-space: normal;}
.side_edu #edu .grap ul li .listbox {}
.side_edu #edu .grap ul li .listbox > div {overflow: hidden;margin:5px 0;font-size:16px;color:#211b15;text-overflow: ellipsis;white-space: nowrap;}
.side_edu #edu .grap ul li .listbox > div span {display:inline-block; margin-right:15px; font-size:16px; font-weight:bold; color:#211b15;}
.side_edu #edu .grap ul li .morebtn {width:80px; height:35px; line-height:33px; margin:30px 0 0; border:1px solid #ddd; text-align:center;  font-size:13px; color:#969696; transition: all 0.3s;-webkit-transition: all 0.3s;}
.side_edu #edu .grap ul li a:hover .morebtn,
.side_edu #edu .grap ul li a:focus .morebtn {border:1px solid #3e70cc; background:#3e70cc; color:#fff;}
.side_edu .clickClose {}

.side_edu .clickClose{display:none;position: absolute;right: 0;top: 0;width:70px;height:450px;background: #2788d0;}
.side_edu.on .clickClose {display:block;}
.side_edu .clickClose > span {display:block;position: absolute;right: -190px;top: 190px;width:450px;height:70px;line-height: 70px;padding: 0 30px;color: #fff;text-align: right;font-size: 17px;font-weight: bold;letter-spacing: 0.09em;transform: rotate(90deg);-webkit-transform: rotate(90deg);}
.side_edu .clickClose > span:after {display:block;position:absolute;right: 270px;top: 35px;content:'';width:170px;height:1px;background:rgba(255,255,255,.3);}
.side_edu .clickClose > span em {display:inline-block;position: relative;width:24px;height:24px;margin-left: 20px;border-radius:50%;background: #51a1d9;font-size:0;vertical-align:middle;}
.side_edu .clickClose > span em:after {display:block;position:absolute;right: 9px;top: 10px;content:'';width: 3px;height: 3px;border:solid #fff;border-width: 2px 0 0 2px;transform:rotate(45deg);}



.cont1 {padding:65px 0;}
.cont1 ul {}
.cont1 ul li {float:left; position:relative; width:33.33%;text-align: center;}
.cont1 ul li:after {display:block;position:absolute;right:0;top: 90px;content:'';width:1px;height:50px;background:#ddd;}
.cont1 ul li:last-child:after {display:none;}
.cont1 ul li a {display:block;width:100%;padding: 0 20px;}
.cont1 ul li .ico {display: block;width:66px;height:56px;margin: 0 auto 30px;background:url(/images/edu/main/ico_ir.png)no-repeat;}
.cont1 ul li .ico2 {background-position:-66px 0;}
.cont1 ul li .ico3 {background-position:-132px 0;}
.cont1 ul li .ico4 {background-position:-198px 0;}
.cont1 ul li strong {display: inline-block;position: relative;padding: 0 10px;margin: 0 0 10px;font-size: 18px;font-weight: bold;color: #333;}
.cont1 ul li strong:after {display:block;position:absolute;left: 0;bottom: 0;z-index: -1;content:'';width:0;height: 13px;border-radius: 30px;background: #e2eefe;transition:all 0.3s;-webkit-transition:all 0.3s;}
.cont1 ul li a:hover strong,
.cont1 ul li a:focus strong{color: #0d4775;}
.cont1 ul li a:hover strong:after,
.cont1 ul li a:focus strong:after {width:100%;}
.cont1 ul li p {}
.cont1 ul li p span {display:block;font-size: 16px;color: #666;}


.cont2 {padding: 30px 0;}
.cont2 .title {float:left;width: 120px;}
.cont2 .title strong {display:inline-block;line-height: 50px;font-size:20px;font-weight:bold;color:#111;vertical-align: middle;}
.cont2 .title a.morebtn {display:inline-block;width: 26px;height: 26px;margin-left: 15px;border-radius: 50%;background: #0067b9 url(/images/edu/main/arr.png)no-repeat center;font-size: 0;vertical-align: middle;}
.cont2 .title a.morebtn:hover,
.cont2 .title a.morebtn:focus {animation: arr 0.7s ease-in-out infinite; -webkit-animation: arr 0.7s ease-in-out infinite;}
.cont2 #notice {float:right;width: calc(100% - 120px);}
.cont2 #notice .grap {overflow: hidden;height: 50px;padding-right: 45px;}
.cont2 #notice .grap ul {position: relative;}
.cont2 #notice .grap ul:after {display:block; clear:both; visibility:hidden; content:'';}
.cont2 #notice .grap ul li {float:left;position:relative;width:50%;margin: 10px 0;padding-left: 60px;}
.cont2 #notice .grap ul li:nth-child(2n):after {display:block;position:absolute;left:30px;top: 4px;content:'';width:1px;height:20px;background:#ddd;}
.cont2 #notice .grap ul li a {display:block;padding-right: 85px;}
.cont2 #notice .grap ul li strong {display:block;overflow: hidden;line-height: 30px;font-size:18px;color:#211b15;text-overflow: ellipsis;white-space: nowrap;}
.cont2 #notice .grap ul li span {display:block;position:absolute;right:0;top:0;line-height: 30px;font-size: 16px;color: #666;}
.cont2 #notice .control {position: absolute;right: 0;top: 10px;}
.cont2 #notice .control button {display:block; width:15px; height:15px; font-size:0;}
.cont2 #notice .control button[data-control="prev"]:before,
.cont2 #notice .control button[data-control="next"]:before{width:5px;height:5px;border-color: #777;}
.cont2 #notice .control button[data-control="prev"]:before{right: 0px;border-width: 2px 0 0 2px;}
.cont2 #notice .control button[data-control="next"]:before{left: 0px;border-width: 0 2px 2px 0;}
.cont2 #notice .control button[data-control="stop"]:before{right: 1.5px;width:2px;height:10px;box-shadow: -2px 0 #777, 2px 0 #777;}
.cont2 #notice .control button[data-control="play"]:before{left: 3px;border-width:6px 0 6px 8px;border-color: transparent transparent transparent #777;}

.cont3 {position:relative;padding:90px 0 110px;background: #eaeff4 url(/images/edu/main/obj_bg2.png)no-repeat right bottom;}
.cont3:before {display:block;position:absolute;left:0;right:50%;top:0;content:'';width:auto;height:100%;margin-right: 150px;background: #0067b9;}
.cont3 .group1 {float:left;width:310px;margin-top: -25px;}
.cont3 .group1 .box1 {}
.cont3 .group1 .box1 strong {display:block;color:#fff; font-size:34px; line-height:1.3; }
.cont3 .group1 .box1 strong > span {display:block; font-weight:bold;font-size:34px; line-height:1.3;}
.cont3 .group1 .box1 p {margin:10px 0 50px; color:#fff; font-size:15px; color:#fff; }
.cont3 .group1 .box2 {}
.cont3 .group1 .box2 ul {}
.cont3 .group1 .box2 ul li {margin: 0 0 5px;}
.cont3 .group1 .box2 ul li a {display:block;position: relative;width:100%;line-height: 60px;padding: 0 30px;border-radius: 10px 0 10px 0;background: #0078d7;color:#fff;font-size: 17px;font-weight: bold;box-shadow: 5px 5px 20px rgba(0,0,0,.1);}
.cont3 .group1 .box2 ul li .ico {display:inline-block;width:32px;height:32px;margin-right: 15px;background:url(/images/edu/main/ico_ir2.png);vertical-align:middle;}
.cont3 .group1 .box2 ul li .ico2 {background-position:0 -32px;}
.cont3 .group1 .box2 ul li .ico3 {background-position:0 -64px;}
.cont3 .group1 .box2 ul li em {display:inline-block;position: absolute;right: 20px;top: 15px;width: 30px;height:30px;line-height: 30px;padding: 0 13px;border-radius: 30px;background: #188dea url(/images/edu/main/arr.png)no-repeat center;color:#fff;font-size: 0;}
.cont3 .group2 {float:right; width:calc(100% - 310px); padding-left:50px; margin:0 -14px;}
.cont3 .group2 .box {float:left; margin:0 14px;}
.cont3 .group2 .box1 {width: calc(53% - 28px);height: 260px;margin-top: 75px;padding: 30px;border-radius: 10px 0 10px 0;background: #fff url(/images/edu/main/obj_bg.png)no-repeat 30px top;}
.cont3 .group2 .box1 .info {float:left;width: calc(100% - 160px);padding-right: 35px;text-align: right;}
.cont3 .group2 .box1 .info strong {display:block;line-height:1.3;margin: 22px 0 25px;font-size:22px;color:#002f54;}
.cont3 .group2 .box1 .info strong span {display:block; line-height:1.3;font-size:26px;font-weight:bold; }
.cont3 .group2 .box1 .info a {display: inline-block;width:100%;max-width: 160px;height:40px;margin: 0 0 10px;border: 1px solid #0067b9;border-radius: 10px 0 10px 0;background: #0067b9;line-height:40px;text-align: center;color: #fff;font-size: 16px; transition: all 0.3s; -webkit-transition: all 0.3s;}
.cont3 .group2 .box1 .info a.type2 {border:1px solid #b2d1ea; background:#fff; color:#0067b9; }
.cont3 .group2 .box1 .info a:hover,
.cont3 .group2 .box1 .info a:focus {border:1px solid #b2d1ea; background:#fff; color:#0067b9; }
.cont3 .group2 .box1 .info a.type2:hover,
.cont3 .group2 .box1 .info a.type2:focus {border: 1px solid #0067b9;background: #0067b9; color:#fff;}
.cont3 .group2 .box1 .thumb {float:right;width:160px; height:200px; }
.cont3 .group2 .box1 .thumb span {display:block;overflow:hidden;position:relative;width:100%;height:100%;}
.cont3 .group2 .box1 .thumb span img {}
.cont3 .group2 .box2 {position: relative;width: calc(47% - 28px);}
.cont3 .group2 .box2 strong {display:block;line-height:75px;font-size: 28px;font-weight: bold;font-style: italic;color: #111;}
.cont3 .group2 .box2 strong span {display:inline-block;margin: 0 0 0 15px;font-size:16px;color:#111;vertical-align:middle;}
.cont3 .group2 .box2 .thumb {width:100%; height:260px;}
.cont3 .group2 .box2 .thumb a {display:block; width:100%; height:100%;}
.cont3 .group2 .box2 .thumb span {display:block;overflow:hidden;position:relative;width:100%;height:100%;border-radius:10px 0 10px 0;}
.cont3 .group2 .box2 .thumb span img {position:absolute; left:50%; top:50%; width:auto; max-width:1000%; height:100%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
.cont3 .group2 .box2 .morebtn {display:block;position:absolute;right:0;top: 24.5px;width: 26px;height: 26px;border-radius: 50%;background: #0067b9 url(/images/edu/main/arr.png)no-repeat center;font-size: 0;vertical-align: middle;}
.cont3 .group2 .box2 .morebtn:hover,
.cont3 .group2 .box2 .morebtn:focus {animation: arr 0.7s ease-in-out infinite; -webkit-animation: arr 0.7s ease-in-out infinite;}

@media(max-width:1600px){
    #main_visual {padding-left:20px;}
    #main_visual .controlbox {width: 1240px;margin-left:-620px;}
    .side_edu.on {padding-left:20px;}
    .side_edu > div .inner {max-width:100%;padding: 145px 70px 0;}
    .side_edu #edu .title {margin-left:-20px;}
}

@media(max-width:1319px){
    #main_visual .controlbox {left:0;width:100%;margin:0;padding: 0 40px 0 30px;}
    
    .cont1 ul li p span {display:inline;}
    
    .cont2 #notice .control {right:30px;}
    
    .cont3 .group1 {width:270px;}
    .cont3 .group1 .box2 ul li a {padding:0 20px;}
    .cont3 .group2 {width: calc(100% - 270px);padding-left:20px;}
    .cont3 .group2 .box1 .info strong span {font-size:22px;}
}

@media(max-width:1130px){
    .cont3 .group2 .box {margin:0;}
    .cont3 .group2 .box1 {width:calc(100% - 450px);margin: 75px 0 0;}
    .cont3 .group2 .box1 .thumb {display:none;}
    .cont3 .group2 .box1 .info {width:100%;padding:0;text-align: center;}
    .cont3 .group2 .box1 .info a {max-width:100%;}
    .cont3 .group2 .box2 {float:right;width:420px;margin:0;}
}

@media(max-width:960px){
    #main_visual .viewer_area {height:auto;}
    #main_visual .viewer_area .images_fade img {display:block;}
}

@media(max-width: 1023px){
    .modal-open #main_visual {z-index:-1;}
    #main_visual .controlbox {bottom: 0;padding: 0 65px 0 55px;}
    .side_edu > div .inner {padding: 0 70px 0 45px;}
    .side_edu > div .inner > .obj {top:auto;left: 20px;bottom:-30px;margin: 0;}
    .side_edu #edu .title {float:none;position:relative;width:100%;margin:0;padding: 4% 0 0;}
    .side_edu #edu .title p {margin:5px 0 0;}
    .side_edu #edu .title p span {display:inline-block; margin-right:5px;}
    .side_edu #edu .title .control {position:absolute; right:0; bottom:0;}
    .side_edu #edu .grap {float:none; width:100%;}

    .cont1 {padding: 30px 0;}
    .cont1 ul li {width:50%;height: 175px;margin: 25px 0;}
    .cont1 ul li:after {top:45px;}
    .cont1 ul li:nth-child(2):after {display:none;}

    .cont2 {padding: 15px 0;border-top:1px solid #ddd;}
    .cont2 #notice .grap ul li {float:none; width:100%; padding-left:30px;}
    .cont2 #notice .grap ul li:nth-child(2n):after {display:none;}
    
    .cont3 {padding:0; background:#eaeff4 ;}
    .cont3:before {display:none;}
    .cont3 .group1 {float:none;width: auto;padding: 40px 30px 30px;margin: 0 -30px;background:#0067b9;}
    .cont3 .group1 .box {float:left; width:50%;}
    .cont3 .group1 .box1 {padding:5px 0 0 10px;}
    .cont3 .group1 .box1 strong,
    .cont3 .group1 .box1 strong > span {font-size:30px;}
    .cont3 .group1 .box1 p {margin:30px 0 0;}
    .cont3 .group2 {float:none;width:100%;margin: 0;padding:45px 0;}
    .cont3 .group2 .box1 {height: 300px;margin:0;}
    .cont3 .group2 .box1 .info strong {margin: 22px 0 49px;}
    .cont3 .group2 .box1 .info strong span {font-size:26px;}
    .cont3 .group2 .box1 .info a {height:50px; line-height:50px;}
    .cont3 .group2 .box2 strong {line-height:30px;margin: 0 0 10px;}
    .cont3 .group2 .box2 .morebtn {top:0;}
}

@media(max-width:767px){
    #main_visual {overflow: visible;padding: 0 0 70px;}
    #main_visual .viewer_area {border-radius:0;}
    #main_visual .controlbox {bottom:70px;padding: 0 30px 0 10px;}

    .side_edu {/* position:static; */width: 100%;height: 100%;}
    .side_edu.on {padding:0;}
    .side_edu > div .inner > .obj {bottom:-10px;}
    .side_edu > button {top: auto;bottom: 0;width:100%;height:70px;border-radius:0;}
    .side_edu > button > span {position: relative;right: auto;top: auto;width: 100%;padding: 0 20px;text-align: left;transform:none;-webkit-transform:none;}
    .side_edu > button > span:after {display:none;}
    .side_edu > button > span em {position:absolute;top: 23px;right: 20px;}
    .side_edu > button > span em:after {border-width:2px 0 0 2px;}
    .side_edu > div {display: none;border-radius:0;}
    .side_edu.on > div {display:block;}
    .side_edu > div .inner {padding:0 40px;}
    .side_edu #edu .title {padding: 8% 0 35px;}
    .side_edu #edu .title p {display:none;}
    .side_edu #edu .grap {padding:0;}
    .side_edu #edu .grap ul li {height:336px;}
    .side_edu #edu .grap ul li a .innerbox {padding:35px 40px;}
    .side_edu #edu .grap ul li a:hover .innerbox,
    .side_edu #edu .grap ul li a:focus .innerbox {transform:translateY(0);}
    .side_edu #edu .title .control {display: block;top: 40px;bottom: auto;right: 44px;height: 45px;margin: 0;}
    .side_edu #edu .title .control button[data-control],
    .side_edu #edu .title .control a {vertical-align:top;}
    .side_edu .clickClose {right: 40px;top: 40px;width:45px;height: 46px;border: 1px solid #6690d2;background: none;}
    .side_edu .clickClose:before,
    .side_edu .clickClose:after {display:block;content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
    .side_edu .clickClose:before {width:50%;height:1px;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);}
    .side_edu .clickClose:after {width:1px;height:50%;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);}
    .side_edu .clickClose > span {position: relative;top: 0;right: 0;width:100%;height:100%;font-size: 0;transform: none;-webkit-transform: none;}
    .side_edu .clickClose > span:after {display:none;}
    .side_edu .clickClose > span em {width:100%; height:100%; margin:0;background: none;}
    .side_edu .clickClose > span em:after {display:none;}

    .cont3 .group1 {margin:0 -20px;padding: 40px 20px 30px;}    
    .cont3 .group1 .box1 {width:47%;padding: 5px 0 0;}
    .cont3 .group2 .box1 .info strong {margin:20px 0;}
    .cont3 .group1 .box1 strong, .cont3 .group1 .box1 strong > span {font-size:24px;}
    .cont3 .group1 .box2 {width:53%;}

    .cont3 .group2 .box1 {float:none;width:100%;height: auto;}
    .cont3 .group2 .box1 .info strong span {display:inline-block; margin-left:5px;}
    .cont3 .group2 .box2 {float:none;width:100%;margin: 40px 0 0;}
    .cont3 .group2 .box2 strong {margin:0 0 15px;}    
}

@media(max-width:580px){
    .side_edu > div .inner {padding:0 20px;}
    .side_edu #edu .title {padding:35px 0;}
    .side_edu #edu .title strong {font-size:24px;}
    .side_edu #edu .title .control {top:25px;}
    .side_edu #edu .grap ul li {width: 280px;height: 270px;}
    .side_edu #edu .grap ul li a .innerbox {padding:25px 20px;}
    .side_edu #edu .grap ul li strong {height: 52px;margin: 10px 0 25px;font-size: 20px;}
    .side_edu #edu .grap ul li .listbox > div,
    .side_edu #edu .grap ul li .listbox > div span {font-size:15px;}
    .side_edu #edu .grap ul li .morebtn {margin:20px 0 0;}
    .side_edu .clickClose {right: 20px;top:25px;}
    
    .cont1 {padding:25px 0;}
    .cont1 ul li {float:none;width:100%;height:auto;margin: 5px 0;border:1px solid #ddd;border-radius: 10px;text-align: left;}
    .cont1 ul li:after,
    .cont1 ul li:nth-child(2n):after {display:block;height:20px;top: 19px;right:auto;left: 100px;}
    .cont1 ul li a {padding:0;line-height: 60px;}
    .cont1 ul li .ico {display:inline-block;width: 41.25px;height:35px;margin: 12.5px 30px 0;background-size:165px 35px;vertical-align: top;}
    .cont1 ul li .ico2 {background-position:-41.25px 0;}
    .cont1 ul li .ico3 {background-position:-82.5px 0;}
    .cont1 ul li .ico4 {background-position:-123.75px 0;}
    .cont1 ul li strong {margin: 0 0 0 25px;padding: 0;font-size:17px;}
    .cont1 ul li strong:after {bottom: 15px;}
    .cont1 ul li p {display:none;}

    .cont2 {padding: 5px 0 30px;border:none;}
    .cont2 .title {float:none; width:100%; margin:0 0 15px; padding:0 0 15px;border-bottom: 1px solid #ddd;}
    .cont2 .title strong {line-height:1;}
    .cont2 #notice {float:none; width:100%;}
    .cont2 #notice .grap ul li {padding:0;margin: 0;}
    .cont2 #notice .grap ul li a {padding:0;}
    .cont2 #notice .grap ul li strong {font-size:17px;}
    .cont2 #notice .grap ul li span {position:static; line-height:1.3;}
    .cont2 #notice .control {top: 0px;}
    .cont2 #notice .control button {display:inline-block;width:26px;height:26px;margin: 0 0 0 1px;border:1px solid #dedede;border-radius:50%;}
    .cont2 #notice .control button[data-control="prev"]:before {top: 3px;}
    .cont2 #notice .control button[data-control="next"]:before {top: -2px;}
    
    .cont3 .group1 {padding:30px 20px;}
    .cont3 .group1 .box1 {float:none; width:100%;}
    .cont3 .group1 .box1 strong > span {display:inline;}
    .cont3 .group1 .box1 p {margin:10px 0 25px;}
    .cont3 .group1 .box2 {float:none; width:100%;}

    .cont3 .group2 {padding:30px 0;}
    .cont3 .group2 .box1 .info strong {font-size:20px;}
    .cont3 .group2 .box1 .info strong span {font-size:24px;}
    .cont3 .group2 .box2 {margin:30px 0 0;}
    .cont3 .group2 .box2 strong {font-size:24px;}
}

@media(max-width:460px){
    .side_edu.on {height:400px;z-index: 10;}
}

@media(max-width:370px){
    .cont1 ul li:after, .cont1 ul li:nth-child(2n):after {left:80px;}
    .cont1 ul li .ico {margin:12.5px 20px;}
    .cont1 ul li strong {margin:0 0 0 10px;}
}