@charset "utf-8"; 
/* main top banner */



.main .topbar{height: 110px; font-size: 27px; font-weight: 800; text-align: center; position: absolute; left: 50%; top: 0; z-index: 2; width: 1200px; margin-left: -600px; display: flex; justify-content: center; padding: 20px 0;}
.main .topbar .bnr{width: 800px; color: #fff; border-radius: 55px; height: 80px; display: grid; align-items: center;}

/* mainbnr slide */  
.main .visual_conts{position: relative;}
.main .visual{height: 430px; position: relative; height: 570px;}
.main .visual.swiper-container{width: 100%;}
.main .visual .swiper-slide{display: flex; justify-content: center; padding: 110px 0 0; height: 480px;}
.main .visual .swiper-slide a{height: 400px;}
.main .visual .swiper-slide img{width: 1200px; height: 400px; border-radius: 15px;} 
.main .visual .swiper-button-prev{left: calc((100% - 1200px) /2 - -48px); width: 50px;}
.main .visual .swiper-button-next{right: calc((100% - 1200px) /2 - -50px); width: 50px;}
.main .visual .swiper-button-next:after{content: ''; width: 30px; height: 30px; border-top: 2px solid rgba(255,255,255,0.6); border-right: 2px solid rgba(255,255,255,0.6); transform: rotate(45deg);}
.main .visual .swiper-button-prev:after{content: ''; width: 30px; height: 30px; border-top: 2px solid rgba(255,255,255,0.6); border-right: 2px solid rgba(255,255,255,0.6); transform: rotate(225deg);}

.main .visual .swiper-pagination{position: absolute; bottom: 100px; /* left: calc((100% - 1200px) - 660px); */ text-align: center;}
.main .visual .swiper-pagination-bullet{width: 12px !important; height: 12px !important; margin: 0 5px;}
.main .visual .swiper-pagination-bullet-active{background: #0066ff !important;}

.main .swiper-slide{position: relative;}
.main .swiper-slide{height: fit-content;}
.main .lec_slide .swiper-slide,
.main .grant_slide .swiper-slide{/* height: 380px; */width: 400px; height: 390px;}
.main .lec_slide .swiper-slide img,
.main .grant_slide .swiper-slide img{width: 100%; /* height: 380px; */height: 299px; -o-object-fit: cover; object-fit: cover; object-position: top;}

.main .lec_slide{width: 800px; position: relative; height: 380px;}
.main .grant_slide,
.main .vod_slide{position: relative; width: 100%; height: fit-content; margin-top: 20px;}
.main .vod_slide .swiper-slide{cursor: pointer;}

/* bnr */
.main .inner_conts .bnr_box{width: 394px; background: #3b46a8; margin-left: 12px; position: relative;}
.main .inner_conts .bnr_box:hover{background: #2553b0;}

.main .inner_conts .bnr_box.wrap a{display: block; width: 100%; height: 100%;}
.main .inner_conts .bnr_box em{display: block; color: #fff; font-weight: 900; font-size: 34px; padding: 40px 0 20px 40px; line-height: 1.2;}
.main .inner_conts .bnr_box em::after{content: '\02BC'; font-family: 'gmarket';}
.main .inner_conts .bnr_box span{font-size: 20px; color: rgba(255,255,255,0.5);}
.main .inner_conts .bnr_box span{display: block; padding-left: 40px;}
.main .inner_conts .bnr_box .object img{width: 180px; position: absolute; right: 36px; bottom: 35px; box-shadow: 0px 1px 46px 3px rgba(0,0,0,0.5);}
.main .inner_conts .bnr_box .btn{background: rgba(0,0,0,0.9); text-align: center; color: #fff; width: 80px; height: 80px; border-radius: 50%; display: grid; align-items: center; z-index: 2; position: absolute; font-size: 16px; left: 127px; bottom: 30px; font-weight: 600; padding: 0;}


/* layout */
.main .inner{padding-top: 70px;}
.main .inner_conts{display: flex; margin-top: 20px;}
.main .inner_conts.service{margin-top: 30px;}
.main .p_b70{padding-bottom: 70px;}
.bg_gr{background: rgba(217,221,230,0.5); padding-bottom: 50px;}
.bg_b{background: #edf3fc; padding: 0 0 40px;}

.main .tit{font-weight: 700; color: #000; font-size: 25px; position: relative; line-height: 1; width: 100%;}

/* board */
.main .board_wrap .board,
.main .board_wrap .customer{position: relative; float: left; margin-left: 25px; font-size: 14px;}

.main .board_wrap .board{width: 380px; border-bottom: 1px solid #eee; height: 135px; max-height: 135px; font-size: 15px;}
.main .board > ul {padding: 10px 0 0;}
.main .board >  ul > li {overflow: hidden; padding: 5px;}
.main .board >  ul > li > div {float: left; font-variant-numeric: tabular-nums; letter-spacing: -1px;}
.main .board >  ul > li > div:first-child {width: 85%; /* margin-right: 20px; */}
.main .board >  ul > li > div.data {width: 15%; text-align: right; color: #a9a9a9; font-size: 14px;}

.main .board.schedule > ul > li{float: left; width: 171px; padding: 0 12px;}
.main .board.schedule > ul > li:first-child{height: 115px; border-right: 1px solid #eee; padding: 0 12px 0 0;}
.main .board.schedule >  ul > li em{display: block; width: fit-content; margin: 2px 0 5px; background: #3b46a8; color: #fff; padding: 3px 10px 2px; font-size: 13px; border-radius: 20px;}
.main .board.schedule >  ul > li div{overflow: hidden; width: 100%; padding: 5px;}
.main .board.schedule >  ul > li div a{letter-spacing: -1px;}
.main .board.schedule >  ul > li strong::before{content: '\005B';}
.main .board.schedule >  ul > li strong::after{content: '\005D';}

.main .board > p{font-size: 18px; border-bottom: 1px solid #333; padding-bottom: 10px; font-weight: 600;}
.main .board strong{color: #3b46a8; font-weight: 500; margin-right: 3px;}
.main .board:first-child{margin-left: 0;}
.main .board:first-child{margin-left: 0;}
.board_wrap::after{content: ''; display: block; clear: both;}

.main .board a:hover{border-bottom: 1px solid #333;}

.main .board_wrap .more{top: 6px; right: 10px;}
.more{position: absolute; top: 30px; right: 40px; font-size: 13px; color: #aaa; letter-spacing: normal; z-index: 1;}

.main .board .more:hover{border-bottom: 0;}


/* content */
 /*
.main .customer{background: rgba(231,233,239,0.5); border-radius: 5px; padding: 20px 25px; width: 340px; max-height: 125px; height: 125px;}
.main .customer p{font-size: 18px;}
.main .customer strong{font-size: 30px; display: block; padding-bottom: 2px;}
.main .customer span{font-size: 15px; color: #555}
.main .customer span:nth-last-child(2){margin-left: 10px;}
.main .customer span:nth-last-child(2)::before{content: '|'; color: #ccc; font-size: 12px; padding-right: 10px; font-weight: 100;}
.main .customer .btn{display: block; background: #333; color: #fff; text-align: center; margin-top: 10px; padding: 8px 0; border-radius: 5px; font-size: 15px; font-weight: 700;}
.main .customer .btn:hover{background: #000;}
*/

.main .visit_bnr{background: rgba(231,233,239,0.7); border-radius: 5px; padding: 20px 25px; width: 340px; max-height: 145px; height: 145px;}
.main .visit_bnr p{position: relative; font-size: 18px; border-bottom: 1px solid #333; padding-bottom: 10px; font-weight: 600;}
.main .visit_bnr img{margin: 13px 0 0 -24px;}

.main .customer{background: rgba(231, 233, 239, 0.5); border-radius: 5px; padding: 25px 30px 15px; width: 490px; max-height: 170px; height: 170px; margin-left: 30px;}
.main .customer p{font-size: 18px; border-bottom: 1px solid #333; padding-bottom: 10px; font-weight: 600;}
.main .customer strong{font-size: 30px; display: block; padding: 7px 0;}
.main .customer span{font-size: 17px; color: #555}
.main .customer span:nth-last-child(2){margin-left: 10px;}
.main .customer span:nth-last-child(2)::before{content: '|'; color: #ccc; font-size: 12px; padding-right: 10px; font-weight: 100;}
.main .customer .btn{display: block; background: #333; color: #fff; text-align: center; margin-top: 16px; padding: 11px 0; border-radius: 5px; font-size: 17px; font-weight: 700;}
.main .customer .btn:hover{background: #000;}

.main .inner_conts .board{width: 660px; height: 168px; padding: 25px 30px 15px; border: 1px solid #ccc; border-radius: 5px;}
.main .inner_conts .center{width: 555px; margin: 0 0 0 30px; background: #d9dde6; border-radius: 5px; display: flex; justify-content: center; align-items: center;}
.main .inner_conts.service .bnr_box{width: 555px; margin: 0 0 0 30px; border-radius: 5px;}
.main .inner_conts.service .bnr_box li{float: left; height: 100%; background: #efefef; height: 210px;}
.main .inner_conts.service .bnr_box li:first-child{width: 70%; border-radius: 5px 0 0 5px; height: 210px;}
.main .inner_conts.service .bnr_box li:first-child img{border-radius: 5px 0 0 5px;}
.main .inner_conts.service .bnr_box li:last-child{background: #333; border-radius: 0 5px 5px 0; width: 30%; display: flex; justify-content: center; align-items: center;}
.main .inner_conts.service .bnr_box li a{color: #fff; font-weight: 800; text-align: center; font-size: 18px;}
.main .inner_conts.service .bnr_box li a:hover{text-decoration: underline;}

.main .inner_conts .center ul{overflow: hidden; text-align: center; padding: 30px 20px; width: 100%;}
.main .inner_conts .center li{display: inline-grid; width: 30%; border-right: 1px solid rgba(0,0,0,0.06); justify-items: center; font-size: 16px; font-weight: 600; color: #000;}
.main .inner_conts .center li:last-child{border-right: 0;}
.main .inner_conts .center li .icon{width: 70px; height: 70px; border-radius: 50%; display: flex; justify-content: center; align-items: center; background: #fff;}
.main .inner_conts .center li .icon img{width: 70%;}
.main .inner_conts .center li p{margin: 17px 0 0 -10px; color: #333;}
.main .inner_conts .center li p:hover{text-decoration: underline;}
.main .inner_conts .center li span::after{border-top: 1px solid #333; border-right: 1px solid #333; top: 6px; left: 5px;}

.main .tabs_sub{display: block; width: 190px; padding-top: 10px;}
.main .tabs_sub li{display: block; text-align: center; border-radius: 30px; margin: 8px 0; background: rgba(194,202,220,0.7); padding: 12px 0;}
.main .tabs_sub li:hover,
.main .tabs_sub li.active{background: #0066ff; border-color: #0066ff;}
.main .tabs_sub li:first-child{margin-top: 0;}
.main .tab-conts{margin-left: 30px; width: 980px; background: #fff; padding: 35px 70px 45px; border-radius: 5px; font-size: 16px; line-height: 1.5; overflow: hidden; color: #000; margin-top: 10px; max-height: 288px; height: 288px;}
.main .tab-conts em{display: block; font-weight: 700; margin-bottom: 20px; font-size: 19px;}

.main footer .menu ul.inner{margin-top: 0 !important;}

.tit.btm_br .more{top: 10px; right: 20px;}

/* text rolling */
.review_txt .object{position: absolute; bottom: -40px; right: 100px;}
.review_txt .object img{width: 200px; height: 200px;}

.review_txt .order{position: relative; width: 60%; height: 58px; box-sizing: border-box; border-radius: 50px; box-shadow: 0px 6px 27px rgba(0, 0, 0, 0.3); background: #fff; border: 5px solid #3b46a8; margin: 7px 0 0 60px;}
.review_txt .order:after{/* content: ''; */position: absolute; left: 6px; top: 6px; right: 6px; bottom: 6px; height: 55px; /*border: 9px solid transparent; */background: #fff; box-sizing: border-box; border-radius: 45px;}
.review_txt{position: relative; height: 137px; padding-top: 40px; margin-top: 30px;}
.review_txt .txt_rolling{position: absolute; top: 0; left: 50px; right: 0; width: 740px; height: 150px;}
.review_txt .txt_rolling > div{overflow: hidden; position: relative; height: 160px; text-align: center;}
.review_txt .txt_rolling > div ul{position: absolute; top: 0; left: 0; width: 100%;}
.review_txt .txt_rolling > div ul li{overflow: hidden; /*font-weight: 500; */color: rgba(0, 0, 0, 0.4); height: 45px; line-height: 45px; font-size: 20px; transition: all 0.2s ease-out 0s;}
.review_txt .txt_rolling > div ul li.prev,
.review_txt .txt_rolling > div ul li.next{color: rgba(0, 0, 0, 0.4);}
.review_txt .txt_rolling > div ul li.on{font-weight:900; height: 70px; line-height: 60px; color: #000; margin: 0 0; font-size: 22px;}

/* element */
.main .btm_br{padding-bottom: 10px; border-bottom: 1px solid #000; /* margin-bottom: 30px; */}
.main .btm_br.op{border-color: rgba(0,0,0,0.2); padding-bottom: 50px;}

.main .crd{position: relative; margin-top: 20px; overflow: hidden;}
.main .crd li{float: left; margin-left: 9px; padding: 0; width: 388px; border-radius: 5px; border: 3px  solid #3b46a8; max-height: 700px; height: 700px;}
.main .crd li > .tit{display: inline-flex; align-items: center; justify-content: center; margin-top: 0; width: 100%; background: #3b46a8; padding: 13px 0;}
.main .crd li:first-child{margin-left: 0;}
.main .crd .icon{border-radius: 50%; background: #fff; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;}
.main .crd .icon img{width: 75%;}
.main .crd li .txt{padding-left: 20px; font-size: 20px; font-weight: 800; color: #fff;}
.main .about{font-weight: 300; color: #555; position: absolute; bottom: 0; right: 0; font-size: 12px;}
.aboutImg{display: block; padding: 20px; height: 608px;}
.about_tit{font-size: 19px; font-weight: 600;}
.aboutImg img{width: 100%; margin-top: 10px; height: 261px;}
.tit.btm_br .about{bottom: 10px}

.tit_sub{line-height: 30px;}