@charset "utf-8";


/*main*/
html { scroll-behavior: smooth;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
 body {font-family: 'Noto Sans KR';  letter-spacing:-.5px; box-sizing:border-box; color:#222; font-size:17px; font-weight:300}
  select, input, textarea, button{ font-family: 'Noto Sans KR'; font-size:inherit; vertical-align:middle;}
 input[type="submit"], input[type="reset"]{}

body.noneScroll {overflow: hidden;}
#container {position: relative;}
 textarea {width:100%;  min-height:300px; padding:5px; border:1px solid #d2d2d2; box-sizing: border-box;} /* 190520 */
 .shp_wrap * {box-sizing: content-box;}
 .shp_wrap a {color: #222;}
 .shp_wrap p, .shp_wrap li, .shp_wrap span, .shp_wrap input, .shp_wrap a { /*transform: skew(-0.03deg);*/ line-height:100%;}
 .skew {transform: skew(-0.03deg); display: inline-block;}
 img{vertical-align:top}
 table { border-collapse: collapse; border-spacing: 0; table-layout: fixed;}
 ul, ol{list-style: none}
 a {color: #111; text-decoration: none;}
 address{font-style:normal}
 caption{text-indent:-9999px; height:0}
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
 legend{ display:none}
 p { word-break: keep-all;}

/*아이폰 인풋 버튼 둥근테두리 그림자 제거*/
input[type="button"] { -webkit-appearance: none; -webkit-border-radius: 0;}
/*크롬 검정 테두리 지우기*/
a:focus, input:focus, select:focus, button:focus, textarea:focus {outline: none;}
/*인풋 박스 백그라운드*/
input[type="text"], input[type="password"] { background: #f2f2f2;}
/*보드 쪽 pre 태그 줄바꿈*/
pre {white-space: pre-wrap;}
ul, ol {list-style: none;}
.inner { position:relative; width:97%;  margin:0 auto; max-width:1300px;}
.h_inner {position: relative; height: 100%; width: 97%; margin: 0 auto;  max-width: 1300px;}
.pc_block {display: block;}
.block { display:block;}
.clear:after{display:block; content:""; clear:both; height:0}

body {font-family: 'Noto Sans KR';  letter-spacing:-.5px; box-sizing:border-box; color:#222; font-size:18px; font-weight:300}


/*visual s*/

#main_vis {position: relative;height: 715px; padding-top: 100px;}
#main_vis .vis_wrap {overflow: hidden;}
#main_vis .vis {width: 100%;height: 715px;overflow: hidden;position: relative;float: left;margin: 0 30px;}
#main_vis .vis .vis_bg {background: url("/resources/img/main/vis2.jpg")no-repeat center/cover;width: 100%;height: 100%;position: absolute;transform: scale(1);transition: all .4s ease-in-out;border-radius: 100px 0 100px 0;}
#main_vis .vis2 .vis_bg{background: url("/resources/img/main/vis1.jpg")no-repeat center/cover;}
#main_vis .vis3 .vis_bg {background: url("/resources/img/main/vis4_210906.jpg")no-repeat center/cover;}

#main_vis .vis_txt {position:absolute;top:50%;left: 50%;transform: translate(-50%, -50%);z-index:2; text-align: center; width: 100%; word-break: keep-all;text-shadow: 0px 0px 10px rgba(0,0,0,.15);}
#main_vis .vis_txt .txt1 {color:#fff;font-size:55px;margin-bottom: 35px;font-family: 'Tmon';line-height: 1.5;}
#main_vis .vis3 .vis_txt .txt1{margin-bottom: 80px; padding-top: 100px;}
#main_vis .vis3 .vis_txt .main_btn {padding: 15px 40px;}

#main_vis .vis_txt .txt1 > .small {font-size: 32px; color: #f4a5c7;}
#main_vis .vis_txt .txt1 > span {margin-bottom:15px;}
#main_vis .vis_txt .txt1 > span:last-child {margin-bottom: 0;}
#main_vis .vis_txt .txt2 {color:#fff;font-size:22px;margin-bottom: 45px;line-height: 1.7;}
#main_vis .vis_txt .desc {color:#fff;font-size:19px;margin-top: 8px;}
#main_vis .vis_txt .main_btn {padding: 15px 25px; color: #fff; border-radius: 50px; background: #5353ac; transition: all .3s ease-in-out;}
#main_vis .vis_txt .main_btn:hover {background: #f4a5c7;}

#slick_vis1 .slick-active.vis .vis_bg{transform: scale(1); animation-name: zoomIn; animation-duration:4s; animation-fill-mode: forwards;}

#slick_vis1 .vis .vis_bg{ background-size:cover; background-position: center; width:100%; height:100vh; position: absolute; left:0; top:0; transform: scale(1); }

#main_vis .inner {max-width: 1360px;}
#main_vis .slick-list {overflow: visible;}
#main_vis .arw_wrap{position: absolute;bottom: -30px;z-index: 2;width: 175px;left: 50%;transform: translateX(-50%);height: 60px;}
#main_vis .arw_wrap .slick-arrow {width: 35px;height: 35px;border-radius: 100%;background: #fff url("/resources/img/main/main_arw.png") 12px 4px no-repeat;position: absolute;top: 50%;left: 0; box-shadow: 3px 3px 5px rgba(0,0, 0,36%); transition: background .3s ease-in-out;}
#main_vis .arw_wrap .slick-arrow::before {display: none;}
#main_vis .arw_wrap .slick-arrow:hover {background-color: #f2f2f2;}
#main_vis .arw_wrap .slick-next {background-position: -127px 4px;left: auto;right: 0;}
#main_vis .slick_dots {position: absolute; transform: translateX(-50%);left: 50%;bottom: 40px;}
#main_vis .slick_dots li {margin-right: 15px; display: inline-block;}
#main_vis .slick_dots li:last-child {margin-right: 0;}
#main_vis .slick_dots button { padding:0;position: relative; display: inline-block; color:#fff; border:0; box-sizing: border-box; background-color: #fff; opacity: .4; width: 10px; height: 10px; border-radius: 0; text-indent: -99999px;}
#main_vis .slick_dots .slick-active button {opacity: 1;}
#main_vis .p_btn {height: 60px; width: 60px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);background: linear-gradient(0deg, rgba(171,27,38,1) 0%, rgba(85,82,169,1) 100%); border-radius: 100%; border: 0; cursor: pointer;box-shadow: 3px 3px 5px rgba(0,0, 0,36%); box-sizing: border-box;}
#main_vis .p_btn > p {border-radius: 100%; width: 54px; height: 54px; background: #fff url("/resources/img/main/main_arw.png") 20px -30px no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: background .3s ease-in-out;}
#main_vis .p_btn:hover > p {background-color: #f2f2f2;}
#main_vis .play {display: none;}
#main_vis .play > p {background-position: 22px -80px;}

/*visual e*/
.sec_title {text-align: center;}
.sec_title .ti {font-size: 33px; font-family: 'Tmon'; color: #5353ac;}
.sec_title .tx {font-size: 20px; display: block; margin-top: 10px; line-height: 1.5;word-break: keep-all;}

/* sec0 s */
.sec0 {padding: 150px 0 0;}
.sec0 .sec_title {margin-bottom: 100px;}
.sec0 .sec_title .ti {position: relative;}
.sec0 .sec_title .ti::after {content:'Why?'; display: block; position: absolute; right: calc(50% - 10px); top: 0; font-family: 'Tmon'; font-size: 150px; color: rgba(244,165,199,.16); z-index: -1;}

.sec0 .sec_desc .text_wrap:first-child {margin-bottom: 50px;}
.sec0 .sec_desc .tx_wrap .tx {line-height: 140%;}
.sec0 .sec_desc .tx_wrap .tx br {display: block;}
.sec0 .sec_desc .tx_wrap .name {color: #444; margin-top: 20px;}

.sec0 .text_wrap1 .tx_img {float: left; width: 492px; height: 188px; background: url(./../img/main/why1.png) no-repeat center/cover; border-radius: 50px 0 50px 0;}
.sec0 .text_wrap1 .tx_wrap {float: right; width: calc(100% - 492px); padding-left: 35px; box-sizing: border-box;}
.sec0 .text_wrap1 .tx_wrap .tx1 {padding-top: 10px;}

.sec0 .text_wrap2 .tx_img {float: right; width: 492px; height: 188px; background: url(./../img/main/why2.png) no-repeat center/cover; border-radius: 50px 0 50px 0;}
.sec0 .text_wrap2 .tx_wrap {float: left; width: calc(100% - 492px); padding-right: 35px; box-sizing: border-box; text-align: right;}
.sec0 .text_wrap2 .tx_wrap .tx1 {padding-top: 85px; box-sizing: border-box;}
.sec0 .text_wrap2 .tx_wrap .tx2 {padding-top: 30px;}


/*sec1 s*/
.sec1 {padding: 150px 0 150px;}
.sec1 .sec_slick {margin: 60px 0 0;}
.sec1 .sec_slick .slick-track {padding-bottom: 10px;}
.sec1 .sec_slick .slick-slide {margin: 0 10px;}

.sec1 .sec_slick .slick-arrow {background: url("/resources/img/main/sec1_arrow_hover.png")no-repeat; width: 60px; height: 60px; z-index: 1; transition: all .2s ease; text-indent: -99999px; background-color: rgba(244,165,199,.8); border-radius: 10px;}
.sec1 .sec_slick .slick-next {right: -19px; background-position: -122px 12px;}
.sec1 .sec_slick .slick-prev {left: -19px; background-position: 19px 12px;}
.sec1 .sec_slick .slick-arrow:hover {background-color: rgba(244,165,199,1);}

.sec1 .thumb_box {display: block;}
.sec1 .thumb_box .vdo_img {height: 0; padding-bottom: 56.25%; position: relative; overflow: hidden; border-radius: 30px; box-shadow: 5px 7px 10px rgba(0, 0, 0, 5%);}
.sec1 .thumb_box .vdo_img::before {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0,0,0,.3) url("/resources/img/main/sec1_play.png") center no-repeat; width: 100%; height: 100%; z-index: 1; transition: all .3s ease-in-out;}
.sec1 .thumb_box:hover .vdo_img::before {background-color: rgba(0,0,0,0);}
.sec1 .thumb_box .vdo_img > img {width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.sec1 .tx_wrap .tx {margin-top: 20px; overflow: hidden; text-overflow: ellipsis;white-space: normal; line-height: 140%; height: 4.2em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all;}
.sec1 .tx_wrap .name {color: #555; margin-top: 25px;}

/* 비디오 s */
.video-popup.reveal {display: flex;position: fixed;top: 0;left: 0;right: 0;bottom: 0;justify-content: center;align-items: center;z-index:101;}
.video-popup .video-wrapper {position: relative;width: 80%;max-width: 800px;height:450px;z-index: 1;}
.video-popup .video-wrapper iframe {position: absolute; width: 100%; height: 100%;}
.video-popup.reveal .video-popup-closer {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, .5);z-index: 0;} 
.video-wrapper .clos_btn { cursor:pointer; display: block; text-indent: -99999px; width: 45px; height: 45px; position: absolute; top:-50px; right:0;}
.video-wrapper .clos_btn::before{content: ''; position: absolute; transition:.3s ease; top: 50%; left: 50%; width: 30px; height: 2px; background-color: rgba(255,255,255,.5); border-radius: 50px; margin: -1px 0 0 -15px; transform: rotate(45deg);}
.video-wrapper .clos_btn::after{content: ''; position: absolute; transition:.3s ease; top: 50%; left: 50%; width: 2px; height: 30px; background-color: rgba(255,255,255,.5); border-radius: 50px; margin: -15px 0 0 -1px; transform: rotate(45deg);}
.video-wrapper .clos_btn:hover::before {background-color:rgba(255,255,255,1);}
.video-wrapper .clos_btn:hover::after {background-color:rgba(255,255,255,1);}
/* 비디오 e */

/*sec1 e*/

/*sec2 s*/
.sec2 {background: #e0e0f0; padding: 70px 0 100px;}
.sec2 .cw {margin-top: 60px;}
.sec2 .notice_wrap {width: 60%; display: inline-block; float: left; margin-right: 5%;}
.sec2 .more_box {text-align: right;display: inline-block;width: 100%;float: left;}
.sec2 .more_box .tx {float: left;line-height: 16px;display: inline-block;margin-top: 7px;color: #5353ac;font-weight: 600;font-size: 18px;}
.sec2 .hover_btn01 {display: inline-block;padding: 7px 12px;background: rgba(255, 255, 255, .5);border-radius: 50px;margin-bottom: 2px;transition: all .3s ease-in-out;}
.sec2 .hover_btn01:hover {background: rgba(255, 255, 255, 1);}
.sec2 .hover_btn01 .txt {font-size: 15px;line-height: 14px;float: left;margin-right: 4px;color: #5353ac;}
.sec2 .hover_btn01 .plus {width: 14px;height: 14px;position: relative;display: inline-block;float: right;}
.sec2 .hover_btn01 i {width: 2px;height: 50%;left: 50%;transform: translateX(-50%);top: 0px;content: "";position: absolute;background-color: #5353ac;display: inline-block;transition: all .3s ease;}
.sec2 .hover_btn01 i.top {transform-origin:right bottom;}
.sec2 .hover_btn01 i.middle {width: 14px;height: 2px;top: 50%;transform: translateY(-50%);left: 0;}
.sec2 .hover_btn01 i.bottom {bottom:0px; top: auto; transform-origin:right top;}
.sec2 .hover_btn01:hover i.top, .sec2 .hover_btn01:hover i.bottom {left: 100%;}
.sec2 .hover_btn01:hover i.top {transform: rotate(-45deg);}
.sec2 .hover_btn01:hover i.bottom {transform: rotate(45deg);}
.sec2 .list_wrap {border-top: 2px solid #454545;padding-top: 15px;box-sizing: border-box;float: left;width: 100%;}
.sec2 .notice_wrap .list {background: #fff; margin-bottom: 10px; box-shadow: 5px 7px 10px rgba(0, 0, 0, 5%); font-size: 17px; transition: all .3s ease-in-out;}
.sec2 .notice_wrap .list:hover {background: #f2f2f2;}
.sec2 .notice_wrap .list:last-child {margin: 0;}
.sec2 .notice_wrap .list > a {padding: 20px 22px; display: block;}
.sec2 .notice_wrap .list > a::after {clear: both; height: 0; display: block; content: "";}
.sec2 .notice_wrap .list .label {box-shadow: 3px 3px 4px rgba(0, 0, 0, 5%); padding: 8px; border-radius: 50px; background: #f4a5c7; color: #fff; font-size: 15px; width: 92px; text-align: center; display: inline-block; float: left; box-sizing: border-box; margin-right: 30px;}
.sec2 .notice_wrap .list .cont {display: inline-block; float: left; width: calc(100% - 122px);}
.sec2 .notice_wrap .list .cont .title {float: left; padding-top: 7px;width: calc(100% - 100px);text-overflow: ellipsis;white-space: nowrap;word-wrap: normal; overflow: hidden;}
.sec2 .notice_wrap .list .cont .date {float: right; font-size: 15px; color: #888; padding-top: 8px;}
.sec2 .btn_wrap {width: 35%; display: inline-block; float: left;}
.sec2 .btn_wrap .btn_box {display: block;position: relative;min-height: 205px;background: #efefef url("/resources/img/main/faq_bg.png") right bottom/contain no-repeat;border-radius: 30px 0;margin-bottom: 36px;box-shadow: 5px 7px 10px rgba(0, 0, 0, 5%);transition: all .3s ease-in-out;border: 5px solid transparent;box-sizing: border-box;}
.sec2 .btn_wrap .btn_box.qna_box {background-image: url("/resources/img/main/qna_bg.png"); background-color: #fff; margin-bottom: 0;}
.sec2 .btn_wrap .btn_box:hover {border-color: #f4a5c7;}
.sec2 .btn_wrap .btn_box:last-child:hover {border-color: #5353ac;}
.sec2 .btn_wrap .btn_box .tx_box {position: absolute; top: 50%; transform: translateY(-50%); left: 40px;}
.sec2 .btn_wrap .btn_box .tx_box .ti {font-family: 'Montserrat'; font-size: 33px;}
.sec2 .btn_wrap .btn_box .tx_box .tx {color: #777; margin-top: 10px; font-weight: 300;}
/*sec2 e*/
.sec_bg {background: url("/resources/img/main/sec3_bg.png") top center/cover no-repeat;}
/*sec3 s*/
.sec3 {padding: 85px 0 130px; overflow: hidden;}
.sec3 .sec3_slick {margin: 80px -44px 0;padding-bottom: 40px;}
.sec3 .plan {padding: 80px 62px 55px; background: #f1f1fb; border-radius: 0 100px 0 100px; margin: 38px 44px 0; border: 3px solid #5353ac; position: relative; text-align: center;}
.sec3 .plan:nth-child(2n+1) {border-color:#f4a5c7;}
.sec3 .plan .label {position: absolute;top: -38px;left: 12px;width: 77px;height: 118px;background: url("/resources/img/main/label.png") no-repeat;padding: 49px 0 0 21px;color: #fff;box-sizing: border-box;letter-spacing: 0;}
.sec3 .plan .logo {width: 100%; height: 56px;background: url("/resources/img/main/logo.png") center/contain no-repeat; text-indent: -99999px; display: block;}
.sec3 .plan .tx_wrap .ti {font-size: 27px; letter-spacing: -1px;}
.sec3 .plan .tx_wrap .ti .num {font-size: 34px; font-weight: 500;}
.sec3 .plan .price1 {color: #999;font-size: 25px;padding: 18px 0;position: relative;display: inline-block;}
.sec3 .plan .price1::before {content: "";position: absolute;background: url("/resources/img/main/center_line.png") center right no-repeat;width: 120%;height: 16px;right: -11%;top: 29px;}
.sec3 .plan .price2 {color: #000071; font-size: 38px; font-weight: 600;text-shadow: 4px 4px 5px rgba(0, 0, 0, 10%); margin-bottom: 20px;}
.sec3 .plan .desc {font-size: 21px; font-weight: 400;}
.sec3 .plan .btn_box {margin-top: 40px; background: #5353ac; padding: 19px 5px; color: #fff; width: 100%; display: block; border-radius: 100px; transition: all .3s ease-in-out; box-sizing: border-box;}
.sec3 .plan .btn_box:hover {background: #f4a5c7;}
.sec3 .slick-dots {bottom: 0;}
.sec3 .slick-dots li button {width: 10px; height: 10px; background: #fff; border-radius: 100%;border: 1px solid #5353ac; box-sizing: border-box;}
.sec3 .slick-dots li button:before {display: none;}
.sec3 .slick-dots li.slick-active button {background: #5353ac;}
/*sec3 e*/
/*sec4 s*/
.sec4 {background: linear-gradient(0deg, rgba(83,83,172,1) 0%, rgba(83,83,172,0) 95%); padding: 30px 0 130px;}
.sec4 .sec_title .ti2 {font-size: 55px; margin-top: 20px;}
.sec4 .cw {position: relative; margin-top: 80px;}
.sec4 .tx_box {width: 27%; height: 0; padding-bottom: calc(27% - 10px); border-radius: 100%; display: inline-block; float: left; border: 5px solid #f4a5c7; background: url("/resources/img/main/sec4_1.jpg") center/cover no-repeat; box-sizing: border-box; position: relative; margin: 0 4.75%;}
.sec4 .tx_box:first-child {margin-left: 0;}
.sec4 .tx_box:last-child {margin-right: 0;}
.sec4 .tx_box.tb2 {border-color:#5353ac;background-image: url("/resources/img/main/sec4_2.jpg");}
.sec4 .tx_box.tb3 {border-color:#9f7dc7;background-image: url("/resources/img/main/sec4_3.jpg");}
.sec4 .tx_box .tx {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; text-shadow: 5px 5px 5px rgba(0, 0, 0, 42%); font-weight: 500; font-size: 30px;    line-height: 1.2;}
.sec4 .plus {position: absolute; width: 50px; height: 50px;  left: 31.75%;top: 50%; transform: translate(-50%, -50%);z-index: 1;}
.sec4 .plus::before {position: absolute; content: ""; width: 56px;height: 56px;background: url("/resources/img/main/plus_sd.png") center/contain no-repeat; top: 2px; left: 3px; z-index: -1;}
.sec4 .plus > span {background: url("/resources/img/main/plus.png") center/contain no-repeat; display: block; width: 100%; height: 100%;}
.sec4 .plus:nth-child(2) {left: 68.25%;}
.sec4 .btn_box {text-align: center;}
.sec4 .btn_box > a {padding: 15px 20px;box-sizing: border-box;background: #f4a5c7;color: #fff;font-size: 20px;display: inline-block;border-radius: 100px;margin-top: 35px;transition: all .3s ease-in-out;box-shadow: 5px 5px 5px rgba(0, 0, 0, 42%);}
.sec4 .btn_box > a:hover {transform: translateY(-10px);}
/*sec4 e*/

@media screen and (max-width:1500px){
    .sec1 .sec_slick .slick-next {right: 0;}
    .sec1 .sec_slick .slick-prev {left: 0;}
}
@media screen and (max-width:1300px){

    .sec3 .sec3_slick {margin: 80px -15px 0;}
    .sec3 .plan {margin: 38px 15px 0;}
}

@media screen and (max-width: 1228px){
    .sec0 .text_wrap2 .tx_wrap .tx1 {padding-top: 60px;}
}
@media screen and (max-width: 1144px){
    .sec0 .text_wrap2 .tx_wrap .tx1 {padding-top: 40px;}
}

@media screen and (max-width:1100px){
      #main_vis .vis_txt .txt1{font-size: 30px; margin-bottom: 20px;}
  #main_vis .vis_txt .txt2 {font-size: 17px; line-height: 1.3;}
    #main_vis .vis_txt .desc {font-size: 15px;}
    #main_vis .vis_txt .txt1 > .small {font-size: 20px;transform: skew(-0.03deg);}
    #main_vis .vis_txt .txt1 > span {margin-bottom: 7px;}
}
@media screen and (max-width:1024px){
    #main_vis, #main_vis .vis, #main_vis .vis .vis_bg {height: 500px;}  
    
    #main_vis .vis {margin: 0 20px;}
    #main_vis .inner {width: 97%;}
    
    .sec_title .ti {font-size: 28px;}
    .sec_title .tx {margin-top: 8px;font-size: 16px;}

    .sec0 .sec_title {margin-bottom: 80px;}
    .sec0 .sec_title .ti::after {font-size: 100px;}
    .sec0 .sec_desc .tx_wrap .tx br {display: none;}
    .sec0 .text_wrap1 .tx_img {float: none; width: 100%; background: url(./../img/main/why1.png) no-repeat center/cover;}
    .sec0 .text_wrap1 .tx_wrap {float: none; width: 100%; padding: 20px 10px;}
    .sec0 .text_wrap1 .tx_wrap .tx1 {padding-top: 0;}
    .sec0 .text_wrap2 .tx_img {float: none; width: 100%; background: url(./../img/main/why2.png) no-repeat center/cover;}
    .sec0 .text_wrap2 .tx_wrap {float: none; width: 100%; padding: 20px 10px; text-align: left;}
    .sec0 .text_wrap2 .tx_wrap .tx1 {padding-top: 0;}
    .sec0 .text_wrap2 .tx_wrap .tx2 {padding-top: 20px;}

    .sec1 {padding: 80px 0 80px;}
    .sec1 .sec_slick {margin: 40px 0 0;}
    .sec1 .tx_wrap {font-size: 16px;}
    .sec1 .tx_wrap .name {margin-top: 20px;}
    
    .sec2 {padding: 55px 0 80px;}
    .sec2 .cw {margin-top: 40px;}
    .sec2 .notice_wrap {width: 100%; margin-right: 0;}
    .sec2 .notice_wrap .list > a {padding: 16px; font-size: 16px;}
    .sec2 .notice_wrap .list .label {margin-right: 10px; width: 65px; padding: 6px;}
    .sec2 .notice_wrap .list .cont {width: calc(100% - 75px);}
    .sec2 .notice_wrap .list .cont .title, .sec2 .notice_wrap .list .cont .date {padding-top: 5px;}
    .sec2 .btn_wrap {width: 100%; margin-top: 30px;}
    .sec2 .btn_wrap .btn_box {margin: 0 2% 0 0; display: inline-block; width: 49%; float: left;}
    .sec2 .btn_wrap .btn_box.qna_box {margin: 0;}
    
    .sec3 {padding: 55px 0 80px;}
    .sec3 .sec3_slick {margin: 55px -15px 0; padding-bottom: 0;}
    .sec3 .plan {margin: 28px 5px 0; border-radius: 0 60px 0 60px;padding: 60px 10px 50px;}
    .sec3 .plan .label {background-size: contain;top: -30px; width: 58px; height: 88px; padding: 35px 0 0 16px;font-size: 16px;}
    .sec3 .plan .tx_wrap .ti {font-size: 20px;}
    .sec3 .plan .tx_wrap .ti .num {font-size: 28px;}
    .sec3 .plan .price1 {font-size: 20px; padding: 11px 0;}
    .sec3 .plan .price1::before {top: 16px; background-size: contain;}
    .sec3 .plan .price2 {font-size: 30px; margin-bottom: 5px;}
    .sec3 .plan .desc {font-size: 16px;}
    .sec3 .plan .btn_box {padding: 14px 5px; margin-top: 20px;}
    
    .sec4 .sec_title .ti2 {font-size: 37px; margin-top: 10px;}
    .sec4 .tx_box .tx {font-size: 22px;}
    .sec4 .plus {width: 36px; height: 36px;}
    .sec4 .plus::before {width: 40px; height: 40px;}
        }


@media screen and (max-width:768px){
   .pc_block { display:inline;}
	.inner,.h_inner { width:92%}
	
    #main_vis .vis_txt {width: 430px;} 
    #main_vis .vis_txt .txt1{font-size: 27px; line-height: 1.3;}
    #main_vis .vis_txt .txt2 {font-size: 15px;}
    #main_vis .vis_txt .desc {font-size: 14px;}
    #main_vis .vis_txt .txt1 > .small {display: block;}
    #main_vis .vis_txt .txt2 .pc_block {display: block;}
    #main_vis .vis_txt .main_btn {padding: 10px 20px;}

    .sec0 .sec_title {margin-bottom: 60px;}
    .sec0 .sec_title .ti::after {font-size: 60px;}
    
    .sec1 .sec_slick .slick-arrow {width: 40px; height: 40px;}
    .sec1 .sec_slick .slick-prev {background-position: 11px 3px;}
    .sec1 .sec_slick .slick-next {background-position: -132px 3px;}
    
    .sec2 .btn_wrap .btn_box {width: 100%; margin: 0; min-height: 120px;}
    .sec2 .btn_wrap .btn_box.qna_box {margin-top: 15px;}
    .sec2 .btn_wrap .btn_box .tx_box .ti {font-size: 25px;}
    .sec2 .btn_wrap .btn_box .tx_box .tx {font-size: 16px;}
    
}
@media screen and (max-width:767px){
    #main_vis {padding-top: 70px;}
}
@media screen and (max-width:650px){
    .sec3 .sec3_slick {margin: 80px 0 0;}
    .sec3 .plan {margin: 55px 0 0;}
    .sec3 .plan:first-child {margin: 0;}
    .sec3 .plan .label {top: -37px;}
    .sec3 .plan .btn_box {margin: 20px auto 0; max-width: 80%;}
}



@media screen and (max-width:500px){
  
    #main_vis .vis_txt {width: 300px;}
    #main_vis .vis_txt .txt1 {margin-bottom: 10px;}
    #main_vis .vis_txt .txt2 .pc_block {display: inline;}
    
    .sec2 .notice_wrap .list > a {font-size: 15px;padding: 10px;}
    .sec2 .notice_wrap .list .label {margin-right: 7px; width: 54px; font-size: 13px; padding: 6px 3px;}
    .sec2 .notice_wrap .list .cont {width: calc(100% - 61px);}
    .sec2 .notice_wrap .list .cont .title {width: calc(100% - 71px);}
    .sec2 .notice_wrap .list .cont .date {font-size: 14px; padding-top: 6px;}
    
    .sec4 {padding-top: 0;}
    .sec4 .cw {margin-top: 40px;}
    .sec4 .tx_box {margin: 35px auto 0;padding-bottom: calc(70% - 10px);width: 70%;display: block;float: none;}
    .sec4 .tx_box:first-child {margin: 0 auto;}
    .sec4 .tx_box:last-child {margin-right: auto;}
    .sec4 .plus {left: 50%; top: calc(66.66% + 0.5%); width: 20px;height: 20px;}
    .sec4 .plus:nth-child(2) {left: 50%; top: calc(33.33% - 0.5%);}
    .sec4 .plus::before {width: 20px; height: 20px;}
    .sec4 .btn_box > a {width: 100%;padding: 14px 5px; font-size: 18px;}
}

@media screen and (max-width:350px){
    #main_vis, #main_vis .vis, #main_vis .vis .vis_bg{height: 450px;} 
    #main_vis .vis_txt {width: 260px;}

    .sec0 .sec_title .ti::after {font-size: 40px; right: calc(50% + 20px);}
}

