@charset "utf-8";
#page_title {display:none}
.main_banner_wrap {padding:0 50px; }
.mainpage_banner {height:720px;margin-bottom:80px; overflow:hidden;}
.mainpage_banner .banner_part {height:100%; width:100%; float:left; border-radius: 20px; overflow: hidden; position: relative;}
.mainpage_banner .banner_part.backnavy {
    background:#081020; position: relative; display: grid;
    grid-area: 1 / 1 / 2 / 2;
    grid-template-columns: 100%;
    grid-template-rows: 100vh;
}
.mainpage_banner .banner_part.backnavy:after {
    content:''; display: block; position: absolute; top:0; left:0; right:0; bottom:0;
    width:100%; height:100%; background: rgba(0,0,0,0.3); z-index: 2; 
}
.mainpage_banner .banner_part .photo_line {
    display: flex;
    flex: 0 0 100%;
    flex-direction: column;
    height: 150px;
    justify-content: center;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%, -50%, 0) rotate(22.5deg);
}
.mainpage_banner .banner_part .line_div {
    will-change: transform; 
    display: flex;
    transform: translateX(25%);
    align-items: center;
}
.mainpage_banner .banner_part .line_div > div {display: flex; align-items: center; animation: runner 18s linear infinite;}
.mainpage_banner .banner_part .line_div:nth-child(2) > div {animation-duration: 19s;}
.mainpage_banner .banner_part .line_div:nth-child(3) > div {animation-duration: 25s;}
.mainpage_banner .banner_part .line_div .line_img {
    width:260px; height:260px; background-position: 50% 50%; background-size: cover; border-radius: 50%;
    --tile-margin: 2vw; margin: var(--tile-margin); flex: none;
}
.mainpage_banner .banner_part .line_div .line_img.img_large {
    border-radius: 200px;
    width: 800px;
}
.mainpage_banner .banner_part .line_div .line_img.img_medium {width:600px; border-radius: 150px;}
.mainpage_banner .banner_part .line_div .line_img.po70 {background-position: 50% 70%;}
.mainpage_banner .banner_part .line_div .line_img.one_blue {background:#0056FF; width:150px; height:150px;}
.mainpage_banner .banner_part .line_div .line_img.one_sky {background:#7eafe7; width:100px; height:100px;}
.banner_textbox {
    position: absolute; top:30%; left:50%; transform: translateX(-50%); z-index: 3; color:#fff;
    text-align: center; line-height:1.4; animation: opacity 2s linear; width:100%
}
.banner_textbox > span {font-size:17px; padding-bottom: 20px; display: block; font-weight: 300; letter-spacing: 1px; opacity: 0.8;}
.banner_textbox p {font-size:36px; font-weight:600; line-height: 1.45;}
.banner_textbox p b {display: block;}
.banner_textbox p b br {display: none;}

@keyframes opacity{
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }

  }


/*배너2 인증서*/
#document_bg {
    width:100%;
    height:100%;
    overflow:hidden;
    background-color:#fff;
    position:absolute;
    user-select: none;
    left:50%; top:50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
#document_bg .box {
	left:50%;
	top:50%;
    margin:-150px;
	width:300px;
	height:300px;
    position:absolute;
    user-select: none;
}
.banner_textbox.text_po_top {top:16%;}
.document_wrap {position: relative; z-index: 3; margin-top:360px}
.document_wrap ul {width:100%; overflow: hidden; white-space: nowrap;}
.document_wrap ul li {margin:0 20px;display: inline-block; vertical-align: top;}
.document_wrap ul li img {width:200px;}



/*배너3 후기*/
.mainpage_banner .banner_part.banner_back3 {
    background:url(../img/bg3.jpg) no-repeat center center; background-size: cover; overflow: hidden;
}
.banner_back3 div li {
    margin:0 15px;display: inline-block; vertical-align: top; padding:22px 25px;
    border-radius: 15px; overflow: hidden; background: rgba(255, 255, 255, .1); backdrop-filter: blur(10px); 
}
.banner_back3 div li img {width:100%}
.js-marquee-wrapper:after {clear: both; content:''; display: block;}
.review_roll {margin:350px 0 30px}
.review_roll, .review_roll2 {overflow: hidden;}

/*배너 화살표, 페이징*/
.main_banner_wrap .bx-wrapper .bx-pager {
    font-size:15px; font-weight:500; color:#333; bottom:-45px; width:90px; left:50%; margin-left:-45px;
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
.main_banner_wrap .bx-controls-direction {position: absolute; bottom:-45px; left:50%; transform: translateX(-50%); width:138px; height:20px;}
.main_banner_wrap .bx-controls-direction .bx-prev {
    left:0; z-index: 1; background:url(../img/banner_arrow.png) no-repeat center right;
    transform: rotate(180deg); background-size: 8px auto; height:36px;
}
.main_banner_wrap .bx-controls-direction .bx-next {
    right:0; z-index: 1; background:url(../img/banner_arrow.png) no-repeat center right;
    background-size: 8px auto; height:36px;
}
.main_banner_wrap .bx-wrapper .bx-controls-direction i {display: none;}

@keyframes runner {
    0% {
        transform: translateX(0);
      }
      100% {
        transform: translateX(-100%);
      }
}

/*메인 배너 아래부터*/
.main_content {position: relative; z-index: 4;}

/*포트폴리오*/
.width_large {max-width:1588px; margin:0 auto; padding:0 30px; height:100%}
.main_section1 {margin-top:130px}
.pf_wrap {position: relative;}
.main_section1 .title_top {margin-bottom:60px; position: relative;}
.main_section1 .title_top h3 {font-size:40px; padding-bottom:8px;}
.main_section1 .title_top p {font-size:22px; font-weight:500; line-height: 1.5;}
.main_section1.pf_wrap .title_top p br {display: none;}
.pf_list {display: flex; justify-content: space-between; gap:2%; flex-wrap:wrap}
.pf_list li {position: relative; cursor: pointer; flex-basis: 23.5%; width:23.5%; overflow: hidden; }
.pf_list li img {width:100%}
.pf_list li:nth-child(even) {margin-top:70px;}
.pf_more {
    padding:0 60px 0 30px; height:50px; line-height:48px; border:1px solid #051E4E; color:#051E4E; display:inline-block;
    position: absolute; right:0; top:27px; font-size:16.5px; font-weight:500;  
}
.pf_more img {
    position: absolute; z-index: 2;
    right:30px; width:17px; height:auto; top:50%;
    transform: translateY(-50%);
}
.pf_more:after {
    background: linear-gradient(to right, #012DDC, #002A6B); opacity: 0; content:'';
    display:block; width:100%; height:100%; position: absolute; top:0; left:0;  z-index: -1;
}
.pf_list li:nth-child(odd) {height:calc(100% - 70px)}
.pf_list li .list_text {
    position: absolute; bottom:0; left:0; padding:25px 20px 18px; color:#fff; width:100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0, 0, 0, 0.5));
    text-align: center;
}
.pf_list li h5 {font-size:19px; padding-top:10px; color:#fff;}
.pf_list li p {font-size:14px; padding-top:5px; line-height:1.45}
.pf_list li:hover img {transform: scale(1.15); transition:all .5s ease-out;}
.pf_more:hover {color:#fff;}
.pf_more:hover:after {opacity:1; transition:all .5s linear 0s;}
.pf_more:hover img {
    filter: brightness(50); right:20px; transition:right .5s linear 0s;
}
.number_effect {
    font-size:70px; color:#E8E8E8; font-weight:900; letter-spacing: 2px; margin-top:-60px;
    position: absolute; right:0; top:190px; 
}
.number_effect:after {content: "+"; display: inline-block; font-size:70px; font-weight:900; vertical-align: 5px; padding-left:5px}


 

/*지원사업*/
.bs_wrap.main_section1 .title_top p br {display: none;}
.padding_large {padding-top:50px; padding-bottom:100px;}
.bs_card_wrap ul {margin-bottom:100px;}
.bs_card_wrap ul:last-child {margin-bottom:50px}
.bs_card_wrap ul li {
    height:440px; 
    -webkit-box-shadow: 0px 5px 20px 0px rgba(6,4,39,0.08);
    -moz-box-shadow: 0px 5px 20px 0px rgba(6,4,39,0.08);
    box-shadow: 0px 5px 20px 0px rgba(6,4,39,0.08);
    background:#fff; width:22.75%;
    position: relative;
    padding:30px 33px;
    float:left;
    margin-right:3%
}
.bs_card_wrap ul li:last-child {margin-right:0}
.bs_card_wrap ul:after {clear: both; content:''; display: block;}
.bs_card_wrap ul li img {width:100%;}
.bs_card_wrap ul li h5 {font-size:20px; padding:20px 0 10px; font-weight:600}
.bs_card_wrap ul li p {font-size:15px; line-height:1.4}
.bs_card_wrap ul li a {
    position: absolute; bottom:30px; left:33px; display:block; color:#828282;
    text-decoration: underline; font-size:15.5px;
}
.bs_card_wrap ul li.bs_textbox {
    background:url(../img/bs_left1.jpg) no-repeat center center;
    background-size: cover; padding:70px 35px 40px 40px; color:#fff
}
.bs_card_wrap ul:nth-child(2) li.bs_textbox {
    background:url(../img/bs_left2.jpg) no-repeat center center;
    background-size: cover; 
}
.bs_card_wrap ul:nth-child(3) li.bs_textbox {
    background:url(../img/bs_left3.jpg) no-repeat center center;
    background-size: cover; 
}
.bs_card_wrap ul:nth-child(4) li.bs_textbox {
    background:url(../img/bs_left4.jpg) no-repeat center center;
    background-size: cover; 
}
.bs_card_wrap ul:nth-child(5) li.bs_textbox {
    background:url(../img/bs_left5.jpg) no-repeat center center;
    background-size: cover; 
}
.bs_card_wrap ul li.bs_textbox h3 {font-size:23px; font-weight:bold; line-height:1.5}
.bs_card_wrap ul li.bs_textbox .in_text {padding:50px 0 20px}
.bs_card_wrap ul li.bs_textbox .in_text h4 {font-size:18px; margin-bottom:12px; font-weight:500}
.bs_card_wrap ul li.bs_textbox .in_text p {font-size:15.5px; opacity: 0.8; line-height:1.4; margin-bottom:6px; font-weight:400}
.bs_card_wrap ul li.bs_textbox .bs_more_link {
    position: absolute; bottom:40px; left:40px; border-bottom:1px solid #fff;
    font-size:16px; color:#fff; padding:0 2px 7px; font-weight:500; text-decoration: none;
}
.bs_card_wrap ul li.bs_textbox .bs_more_link img {margin-left:8px; height:11px; width:auto; display: inline-block;}
.bs_card_wrap ul li.rank2 {padding:0}
.bs_card_wrap ul li.rank2 h4 {font-size:20px; color:#001E94; background:#BDDEF6; padding:20px 15px; margin-bottom:20px}
.bs_card_wrap ul li.rank2 img {width:calc(100% - 20px); display: block; margin:0 auto}
.bs_wrap .bx-viewport {overflow: visible !important;}
#bs_pager {border-bottom:1px solid #EBEBEB; margin-bottom: 40px;}
#bs_pager a {display: inline-block; margin-right:23px; font-size:19px; font-weight: 500; padding-bottom:16px; color:#777}
#bs_pager a.active {border-bottom:2px solid #012DDC; color:#012DDC;}

/*체험*/
.main_section1.ex_section {
    margin-top:0; padding-top:150px; color:#fff; overflow: hidden;
    background:#fff; opacity: 0;
}
.main_section1.ex_web.fade-in {
    background:url(../img/ex_bg1.jpg) no-repeat center center; 
    background-attachment: fixed;
    background-size:cover; opacity: 1;
    transition-delay: 500ms;
    transition:all 1.5s ease-out;
}
.main_section1.ex_section .title_top p br {display: none;}
.main_section1.ex_section .swiper {overflow: visible;}
.main_section1.ex_section .swiper-wrapper {display: block; padding-top:20px}
#ex_content {display: flex; justify-content: space-between;}
.ex_left_text {padding-top:120px;}
.ex_left_text h2 {
    font-size: 83px; font-weight:900; padding-bottom:7px; color:#030416; 
    text-shadow: -1px 0px #fff, 0px 1px #fff, 1px 0px #fff, 0px -1px #fff;
    letter-spacing: 2px;
}
.ex_left_text p {font-size:24px; font-weight:400}
.ex_link_list {font-size:0; padding-bottom:110px}
.ex_link_list li {
    width: 18% ; height: 325px;  padding:0 0 25px; border-radius: 15px; background: #fff;
    margin-bottom:20px; color:#000; text-align: left; cursor: pointer; display: inline-block; vertical-align: top;
    margin-right:2.5%; box-shadow: 0 5px 5px 10px rgba(0,0,0,0.03);
}
.ex_link_list li:nth-child(5n) {margin-right: 0;}
.ex_link_list li:nth-child(2), .ex_link_list li:nth-child(4), .ex_link_list li:nth-child(7), .ex_link_list li:nth-child(9) {margin-top:50px}
.ex_link_list li .es_imgBox {margin:17px; position: relative; border-radius: 12px; overflow: hidden;}
.ex_link_list li .es_imgBox img {width:100%; height:auto;}
.ex_link_list li .es_imgBox:after {
    position: absolute; top:0; left:0; width:100%; height:100%;
    background-color: rgba(13,49,165,0.5); 
    content:url("../img/arrow_w.png");
    display: flex; justify-content: center;
    align-items: center; opacity: 0;
}
.ex_link_list li:hover .es_imgBox:after {opacity: 1; transition:all .5s ease-out;}
.ex_link_list li h5 {
    width:auto; height:32px; line-height: 33px; padding:0 18px; background: #0122a7; color:#fff;
    border-radius:20px; font-size:14px;
    position: absolute; top:10px; left:13px;
}
.ex_link_list li h3 {font-size:17px; font-weight:bold;padding:0 20px 7px}
.ex_link_list li p {font-size:15px; line-height: 1.4; padding:0 20px; white-space: normal;}
.ex_link_list:after {clear: both; content:'';display: block;}
.ex_link_list li:hover {transform: scale(1.07); transition:transform .5s ease-out;}
.ex_section .swiper-button-prev {display: none;}
.ex_section .swiper-button-next {display: none;}


/*프로세스*/
.main_section1.process_wrap {margin-top:130px}
.main_section1.process_wrap .title_top {margin-bottom:40px}
.main_section1.process_wrap  .title_top p br {display: none;}
.main_section1.process_wrap .title_top .btn-prev {position: absolute; right:52px; bottom:0}
.main_section1.process_wrap .title_top a i {display: none;}
.main_section1.process_wrap .title_top a span {display: inline-block; text-indent: -9999px; width:42px; height:42px}
.main_section1.process_wrap .title_top .btn-prev span {
    background: url(../img/pro_arrow1.svg) no-repeat center center;
    background-size: cover;
}
.main_section1.process_wrap .title_top .btn-next {position: absolute; right:0; bottom:0}
.main_section1.process_wrap .title_top .btn-next span {
    background: url(../img/pro_arrow2.svg) no-repeat center center;
    background-size: cover;
}
.main_section1.process_wrap .bx-wrapper {margin-bottom:0}
.process_in {display: flex; position: relative; justify-content: space-between;}
.process_in #custom_pager {width:43%; flex-basis:43%;}
.process_in #custom_pager a {
    display: flex; width:100%; color:#bbb;
    border:1px solid #EFEFEF; border-radius: 10px; padding:0 36px;
    margin-bottom:20px; line-height:70px; height:70px;
}
.process_in #custom_pager a.active {border:2px solid #012DDC; color:#000}
.process_in #custom_pager a.active b {color:#012DDC}
.process_in #custom_pager a b {font-size:19px; font-weight:900; margin-right:31px; width:34px; display: inline-block;}
.process_in #custom_pager a h3 {font-size:18px; width:140px; margin-right:30px}
.process_in #custom_pager a p {font-size:17px;}
.process_in .process_rightBox {width:50%; flex-basis:50%; position: relative;}
.process_img_slider {margin-left:30px}
.process_in .bx-controls {position: absolute; top:-70px; right:0}
.process_in .bx-wrapper .bx-controls-direction {display: flex; gap:13px}
.process_in .bx-wrapper .bx-controls-direction a {position: initial; margin-top:0;}
.process_in .bx-wrapper .bx-controls-direction a i {display:none;}
.process_in .bx-wrapper .bx-controls-direction a.bx-prev {
    background:url(../img/pro_arrow1.svg) no-repeat center center;
    background-size: cover;
}
.process_in .bx-wrapper .bx-controls-direction a.bx-next {
    background:url(../img/pro_arrow2.svg) no-repeat center center;
    background-size: cover;
}
.process_img_slider img {height:520px; width:auto; margin:auto}

/*클라이언트*/
.client_wrap.main_section1 {margin:130px auto}
.client_wrap.main_section1 .title_top {margin-bottom:50px}
.client_wrap.main_section1 .bx-wrapper {margin-bottom:0}
.client_logo li img {width:18%; margin-bottom:20px; float:left; display:block; margin-right:2.5%}
.client_logo li img:nth-child(5n) {margin-right:0}
.client_logo li:after {clear: both; content:''; display: block;}
#client_pager {margin-bottom:30px}
#client_pager a {
    font-size:16px; display:inline-block; padding:0 20px; line-height:43px; border-radius: 25px;
    background:#F6F6F6; color:#555; margin-right:15px; font-weight:500
}
#client_pager a.active {color:#fff; background:#012DDC;}
.client_wrap .bx-controls {position: absolute; right:0; top:-70px}
.client_wrap .bx-wrapper .bx-controls-direction {display: flex; gap:12px}
.client_wrap .bx-wrapper .bx-controls-direction a {position: initial; margin-top:0; display:inline-block; width:36px; height:36px;}
.client_wrap .bx-wrapper .bx-controls-direction a i {display:none;}
.client_wrap .bx-wrapper .bx-controls-direction a.bx-prev {
    background:url(../img/pro_arrow1.svg) no-repeat center center;
    background-size: cover;
}
.client_wrap .bx-wrapper .bx-controls-direction a.bx-next {
    background:url(../img/pro_arrow2.svg) no-repeat center center;
    background-size: cover;
}

/*클라이언트 후기*/
.main_section1.message_wrap {
    background:url(../img/rev_back.jpg) no-repeat center center; 
    background-size: cover;
    padding:110px 0 120px; background-attachment: fixed;
}
.main_section1.message_wrap .title_top {color:#fff;}
.main_section1.message_wrap .title_top p br {display: none;}
.main_section1.message_wrap .message_in {margin-bottom:20px; position: relative;}
.main_section1.message_wrap .message_in h3 {color:#fff; font-size:20px; padding-bottom:23px; font-weight:600}
.m_animate {
    position: absolute; right:-50px; top:-65px;
    animation: rotate_image 10s linear infinite;
    transform-origin: 50% 50%;
}
.m_animate img {width:126px; height:auto}
.message_in .bx-wrapper {max-width:none !important; margin-bottom: 20px;}
.message_in .bx-wrapper .bx-controls-direction a i {display: none;}
.message_in .bx-wrapper .bx-controls-direction a.bx-prev {
    background:url(../img/banner_arrow.png) no-repeat left 53% center;
    filter: brightness(1); left:-60px; background-size: 12px auto;
    transform: rotate(180deg);
}
.message_in .bx-wrapper .bx-controls-direction a.bx-next {
    background:url(../img/banner_arrow.png) no-repeat center center;
    filter: brightness(1); right:-60px; background-size: 12px auto;
}
.message_in .basicLat li {
    background: rgba(200,211,255,0.1); border-radius: 25px;
    backdrop-filter: blur(3px); border:1px solid rgba(131,142,187,0.8);
    padding:38px 40px; position: relative; vertical-align: top;
}
.message_in .basicLat li .rev_star_top {display: flex; align-items: center; font-size:16px; color:#fff; margin-bottom:30px}
.message_in .basicLat li .rev_star_top .star_profile {margin-right:12px}
.message_in .basicLat li .rev_content {
    font-size:16.5px; color:rgba(255,255,255,0.7); line-height: 1.6; font-weight:400;
    display: -webkit-box;   
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 3; /* 제한할 텍스트의 줄 수 */
}
.message_in .basicLat li .star_box {
    position: absolute; top:20px; right:0
}
.rev_text_bottom {font-size:15px; text-align: right; color:rgba(255,255,255,0.5)}

@keyframes rotate_image{
	100% {
    	transform: rotate(360deg);
    }
}

/*Contact us 영상*/
.contact_video {display: flex; justify-content: space-between; margin-top:110px; padding-bottom:130px; align-items: center;}
.contact_video .title_top h3 {margin-bottom: 13px; padding-bottom:0}
.contact_video .title_top h3 img {height:60px; width:auto; margin-right:17px; vertical-align: -8px;}
.contact_video .title_top a {
    display: inline-block; padding:0 30px; height:60px; line-height: 60px; color:#fff;
    background-image: linear-gradient(to right, #07368E, #012DDC); border-radius: 32px;
    font-size:20px; margin-top:80px;
}
.contact_video .title_top a:hover {box-shadow: 0 0 0 18px transparent; animation: pulse 1s;}
.contact_video .title_top a img {margin-left:25px; height:14px; width:auto}
.contact_video iframe {border:8px solid #02102B}

@keyframes pulse {
    from {
      box-shadow: 0 0 0 0 #07368E;
    }
  }

/*반응형*/
@media screen and (max-width:1600px) {
    .main_banner_wrap {padding:0 30px}
    .width_large {max-width:100%; padding-left:30px; padding-right: 30px;}
    .number_effect {right:30px; top:170px}
    .banner_textbox > span {font-size:15px; padding-bottom: 13px;}
    .banner_textbox p {font-size: 32px;}
    .document_wrap {margin-top:380px}
    .document_wrap ul li {margin:0 17px}
    .document_wrap ul li img {width:170px;}
    .banner_back3 div li {padding: 20px 22px;}
    .bs_card_wrap ul li.bs_textbox { padding:60px 25px 30px 30px}
    .bs_card_wrap ul li.bs_textbox .bs_more_link {left:30px}
    .padding_large {padding-top:0; padding-bottom:80px}
    .main_section1.ex_section {padding-top:90px}
    .main_section1 .title_top {margin-bottom:50px}
    #bs_pager {margin-bottom:32px}
    .process_in #custom_pager a h3 {margin-right: 15px; font-size:17px}
    .process_in #custom_pager a b {font-size:17.5px; margin-right:25px;}
    .process_in #custom_pager a p {font-size:16.5px}
    .m_animate {display: none;}
    .message_in .bx-wrapper .bx-controls-direction a.bx-prev {
        left:-15px; background-color: rgba(255,255,255,0.1);
        border-radius: 50%; width:30px; height:30px;
        background-size: 8px auto;
    }
    .message_in .bx-wrapper .bx-controls-direction a.bx-next {
        right:-15px; background-color: rgba(255,255,255,0.1);
        border-radius: 50%;width:30px; height:30px;
        background-size: 8px auto;
    }
    .main_section1.message_wrap {padding:90px 0 100px}
    .contact_video {padding-bottom:120px}
    .message_in .basicLat li {padding: 30px}
    .message_in .basicLat li .rev_content {white-space: normal;}
    .message_in .basicLat li .rev_content {font-size:15.5px}

    /*후기 게시판*/
    .message_in .basicLat .bx-viewport {height:auto !important; padding:2px 0}
	.message_in .basicLat ul {width:100% !important; white-space:nowrap}
	.message_in .basicLat li {
        width:32% !important; margin-right:2% !important; float:none !important; display: inline-block;
        height:206px;
    }
	.message_in .star_profile {width:40px; height:40px;}
	.message_in .basicLat li a span {font-size:15px}
	.message_in .basicLat li .star_box {top:12px}
	.message_in .star_box i {width:14px; height:14px}
}

@media screen and (max-width:1500px) {
    .mainpage_banner .banner_part .line_div .line_img {--tile-margin: 2.5vw;}
    .banner_textbox.text_po_top {top:18%}
    .bs_card_wrap ul li.bs_textbox .in_text p {font-size:14.5px}
    #bs_pager a {font-size: 18px; padding-bottom: 12px;}
    .number_effect {font-size:65px}
    .bs_card_wrap ul li {width:23.5%; margin-right:2%}
    .ex_link_list li {height:305px; margin-right:1.875%; width:18.5% }
    .ex_link_list li p {font-size:14px}
    .main_section1 .title_top h3 {font-size:35px; padding-bottom:6px}
    .main_section1 .title_top p {font-size:20px}
    .ex_link_list li {margin-bottom:0}
    .process_in #custom_pager {width:38%; flex-basis:38%}
    .process_in #custom_pager a {
        display: block; height:auto; line-height: normal; padding: 16px 20px;
        margin-bottom:15px
    }
    .process_in .process_rightBox {width:57%; flex-basis: 57%;}
    .process_img_slider img {height:480px; margin:50px auto}
    .process_in #custom_pager a b {display: inline-block; margin-right:10px; width:24px;}
    .process_in #custom_pager a h3 {display: inline-block;}
    .process_in #custom_pager a p {padding-top:7px; font-size:15.5px}
    .contact_video iframe {width:597px; height:342px}
}

@media screen and (max-width:1370px) {
    #container {padding:0}
    .mainpage_banner {height:650px}
    .review_roll {margin:300px 0 30px}
    .document_wrap {margin-top:340px}
    .main_banner_wrap {padding:0 20px}
    .width_large {max-width:100%; padding-left:20px; padding-right: 20px;}
    .ex_link_list li {height:auto }
    .main_section1.ex_section .swiper-wrapper {display: flex;}
    .ex_link_list li:nth-child(2), .ex_link_list li:nth-child(4), .ex_link_list li:nth-child(7), .ex_link_list li:nth-child(9) {
        margin-top:0
    }
    .ex_link_list li:hover {transform: none}
    .pf_list {gap:1.5%;}
    .pf_list li {width:23.875%; flex-basis: 23.875%;}
    .pf_list li p br {display: none;}
    .pf_list li h5 {font-size:18px}
    .pf_list li:nth-child(even) {margin-top:40px}
    .number_effect {top:140px; font-size:57px;}
    .number_effect:after {font-size:57px}
    .bs_card_wrap ul li {height:410px; padding:25px 27px}
    .bs_card_wrap ul li.bs_textbox {padding:50px 25px 30px 30px}
    .bs_card_wrap ul li.bs_textbox h3 {font-size:20px}
    .bs_card_wrap ul li.bs_textbox .in_text {padding:30px 0 15px}
    .bs_card_wrap ul li.bs_textbox .in_text h4 {font-size:16px}
    .bs_card_wrap ul li.bs_textbox .in_text p {font-size:14px}
    .bs_card_wrap ul li.bs_textbox .bs_more_link {font-size:15px}
    .bs_card_wrap ul li h5 {font-size:18px}
    .bs_card_wrap ul li p {font-size:14.5px}
    .bs_card_wrap ul li a {font-size:15px; left:27px}
    #bs_pager a {font-size: 17px;}
    .contact_video .title_top h3 img {height:50px}
    .main_section1 .title_top h3 {font-size:32px}
    .main_section1 .title_top {margin-bottom:35px}
    .ex_section.main_section1 .title_top {margin-bottom:20px}
    .ex_section .swiper-button-next, .ex_section .swiper-button-prev {
        top:-35px; background: rgba(255,255,255,0.05); width:38px; height:38px;
        border-radius: 10px; border:1px solid rgba(255,255,255,0.3); line-height: 40px;
        text-align: center;
    }
    .ex_section .swiper-button-prev {left:auto; right:50px; display: block;}
    .ex_section .swiper-button-next {left:auto; right:0; display: block}
    .ex_section .swiper-button-next:after, .swiper-button-prev:after {font-size:17px !important; color:rgba(255,255,255,0.6);}
    .process_in {display:block}
    .process_in #custom_pager {width:100%; font-size:0}
    .process_in #custom_pager a {
        display:inline-block; width:33.3333%; border-radius: 0; margin:0;
        padding:25px 20px; border:1px solid #e7e7e7; margin-left:-1px; color:#919191
    }
    .process_in #custom_pager a:nth-child(4), .process_in #custom_pager a:nth-child(5), .process_in #custom_pager a:nth-child(6) {
        margin-top:-1px
    }
    .process_in #custom_pager a.active {border:0; background: #012DDC; color:#fff;}
    .process_in #custom_pager a.active b {color:#fff;}
    .process_in .process_rightBox {width:100%}
    .process_img_slider {margin-left:0}
    .process_img_slider img {height:400px}
    .main_section1.process_wrap .title_top .btn-prev {right:50px}
    .main_section1.process_wrap .title_top a span {width:38px; height:38px}
    .main_section1.process_wrap {margin-top:90px}
    .client_wrap.main_section1 {margin:90px auto 60px}
    .main_section1.message_wrap {margin-top:80px; padding:80px 0}
    .contact_video {padding-bottom:100px; margin-top:90px}
    .contact_video .title_top a {height:54px; line-height: 54px; padding:0 25px; font-size:18px}
    .contact_video .title_top a img {margin-left:20px}
    .process_in #custom_pager a h3 {font-size:16.5px}
    .process_in #custom_pager a p {font-size: 15px;}
    .client_wrap.main_section1 .title_top {margin-bottom:35px}
    .message_in .basicLat li {height:auto}
    .bs_card_wrap ul li.rank2 h4 {font-size:17px}
}

@media screen and (max-width:1230px) {
    .mainpage_banner {height:630px}
    .banner_textbox {width:639px;}
    .banner_textbox p {font-size:30px}
    .banner_textbox > span {padding-bottom:5px}
    .banner_textbox.text_po_top {top:12%;}
    .document_wrap {margin-top:350px}
    .document_wrap ul li img {width:150px}
    .review_roll {margin:280px 0 20px}
    .pf_more {padding:0 50px 0 20px; font-size:16px}
    .pf_more img {right:20px}
    .pf_list li p {display:none}
    .pf_list li h5 {font-size:17px; line-height: 1.4;}
    .pf_list li .list_text {padding:20px;}
    #bs_pager {margin-bottom:22px}
    .bs_card_wrap ul li {width:32%; height: 460px}
    .bs_card_wrap ul li.bs_textbox {width:100%; height:300px; padding:40px 25px; margin-bottom:20px}
    .bs_card_wrap ul li.bs_textbox h3 br {display: none;}
    .bs_card_wrap ul:nth-child(3) li.bs_textbox {
        background: url(../img/mo_bs_left3.jpg) no-repeat center center;
        background-size: cover;
    }
    .bs_card_wrap ul:nth-child(5) li.bs_textbox {
        background: url(../img/mo_bs_left5.jpg) no-repeat center center;
        background-size: cover;
    }
    .main_section1 .title_top h3 {font-size: 28px;}
    .main_section1 .title_top p {font-size:19px}
    .message_in .basicLat li .rev_content {font-size: 15px;}
    .rev_text_bottom {font-size: 14px;}
    .contact_video iframe {width:482px; height:278px; border:5px solid #02102B}

    .message_in .star_profile {width:37px; height:37px; margin-right:10px}
	.message_in .basicLat li a span {font-size: 14.5px;}
	.message_in .basicLat li .rev_content {font-size: 15px;}
    .message_in .basicLat li .star_box {top:9px}
    .message_in .star_box i {width:12px; height: 12px;}
}

@media screen and (max-width:1100px) {
    .banner_textbox.text_po_top {top:14.5%;}
    .banner_textbox {width:610px;}
    .banner_textbox p {font-size:28px}
    .number_effect {font-size:54px}
    .number_effect:after {font-size: 54px;}
    .pf_list li {width:48%; flex-basis:48%}
    .bs_card_wrap ul li {padding:20px 22px}
    .bs_card_wrap ul li:not(:first-child){height:430px}
    .bs_card_wrap ul li a {left:22px; bottom:20px}
    .pf_list li p {display: block;}
    .pf_list li p br {display: block;}
    .main_section1.process_wrap .title_top {margin-bottom:30px}
    .process_in #custom_pager a {padding:20px 18px}
    .process_in #custom_pager a p {font-size: 14.5px; line-height:1.4}
    #client_pager a {font-size: 15px; line-height: 38px; padding:0 17px}
    .client_wrap .bx-controls {top:-67px}
    .message_in .basicLat li .rev_content {font-size:14.5px}
    .contact_video {gap:20px}
    .main_section1 .title_top p br {display: none;}
    .main_section1 {margin-top:100px}
    .process_in .bx-controls {top:-245px}
    .main_section1.process_wrap .title_top a span {width:35px; height:35px}
    .main_section1.process_wrap .title_top .btn-prev {right:45px}
}

@media screen and (max-width:970px) {
    .document_wrap ul li {margin:0 12px}
    .main_section1.pf_wrap .title_top {margin-bottom:30px}
    .main_section1.pf_wrap .title_top p {width:calc(100% - 210px)}
    .main_section1.pf_wrap .title_top p br {display: block;}
    .main_section1.ex_section .title_top p br {display: block;}
    .main_section1.process_wrap .title_top p br {display: block;}
    .pf_more {top:37px}
    .number_effect {top:165px; right:auto; left:20px}
    .pf_list li:nth-child(even) {margin-top:0; margin-bottom:50px}
    .pf_list li:nth-child(odd) {margin-top:50px}
    .bs_wrap.main_section1 .title_top p br {display: block;}
    .bs_card_wrap ul {margin-bottom:0 !important}
    .bs_card_wrap ul li h5 {padding:15px 0 7px; font-size:17px}
    .bs_card_wrap ul li:not(:first-child) {height:380px}
    .bs_card_wrap ul li a {font-size:14.5px}
    .bs_wrap.padding_large {padding-bottom: 35px; margin-top:95px}
    .client_wrap.main_section1 {margin:75px auto 50px}
    .main_section1.ex_section {padding-top:70px}
    .main_section1.message_wrap {margin-top:60px; padding:65px 0}
    .ex_link_list {padding-bottom:90px}
    .main_section1 .title_top {margin-bottom:25px}
    .main_banner_wrap .bx-controls-direction {bottom:-40px}
    .main_banner_wrap .bx-wrapper .bx-pager {bottom:-40px}
    .process_in #custom_pager {display: flex; flex-wrap: wrap;}
    .process_in #custom_pager a {flex-basis:16.666%; width:16.666%; padding:15px}
    .process_in #custom_pager a b {font-size:16.5px}
    .process_in #custom_pager a h3 {width:auto; display: block; font-size:15.5px; margin-right:0}
    #client_pager a {margin-right:8px}
    .main_section1.message_wrap .width_large {padding-right:0}
    .main_section1.message_wrap .width_large .title_top {padding-right:20px}
    .rev_text_bottom {padding-right:20px}
    .message_in .bx-wrapper .bx-controls-direction a {top:-43px;}
    .message_in .bx-wrapper .bx-controls-direction a.bx-prev {left:auto; right:60px; width:34px; height:34px}
    .message_in .bx-wrapper .bx-controls-direction a.bx-next {right:20px; width:34px; height:34px}
    .main_section1 .title_top p {font-size:18px;}
    .main_section1.message_wrap .title_top p br {display: block;}
    .main_section1.contact_video .title_top p br {display: block;}
    .contact_video {margin-top:65px; padding-bottom: 95px; display: block;}
    .contact_video .title_top a {
        position: absolute; right:0; top:68px; margin-top:0;
        height:46px; line-height: 46px; font-size:17px
    }
    .contact_video .title_top h3 {margin-bottom:8px}
    .contact_video .title_top a img {height:11px; vertical-align: 0; margin-left:15px}
    .cp_videobox {
        padding-bottom:56.25%; position: relative; height:0; width:100%; border-radius: 15px; overflow: hidden;
        margin-top:35px
    }
    .cp_videobox iframe {position: absolute; top:0; left:0; width:100%; height:100%; border:0}
    .client_logo li img {width:25%; margin-right: 0;}
    #bs_pager a {font-size:16.5px; margin-right:15px}

    .message_in .basicLat li {width:43% !important; margin-right:2% !important;}
}

@media screen and (max-width:870px) {
    .banner_textbox {animation: none; width:100%}
    .banner_textbox > span {display: none;}
    .banner_textbox.text_po_top {top:20% !important}
    .banner_textbox p b {font-size:36px}
    .banner_textbox p span {font-size:20px; font-weight:400; width:430px; display:inline-block; margin-top:10px}
    .banner_back3 div li {margin:0 10px}
    .banner_back3 div li img {width:240px}
    .review_roll {margin-top:300px}
    .bs_card_wrap ul li:not(:first-child) {height:365px}
    .process_img_slider img {height:360px;}
    #client_pager a {font-size:14px; padding:0 15px}
    .client_wrap .bx-wrapper .bx-controls-direction {gap:10px}
    .client_wrap .bx-wrapper .bx-controls-direction a {width:34px; height:34px;}
}

@media screen and (max-width:768px) {
    .mainpage_banner {height:600px}
    .banner_textbox p b {font-size:35px; line-height: 1.3;}
    .banner_textbox p b br {display: block;}
    .banner_textbox.text_po_top {top:15% !important}
    .review_roll {margin-top:290px}
    .document_wrap ul li img {width:138px}
    .process_in #custom_pager a {width:33.3333%; flex-basis: 33.3333%;}
    .client_wrap.main_section1 .title_top {margin-bottom:20px}
    .client_wrap .bx-controls {display: none;}
    #client_pager {
        white-space: nowrap; overflow: auto;
        margin-right: -20px;
        -ms-overflow-style: none; /* 인터넷 익스플로러 */
        scrollbar-width: none; /* 파이어폭스 */
    }
    #client_pager ::-webkit-scrollbar {display: none;}
    .banner_back3 div li img {width:220px}
    .main_section1.pf_wrap .title_top {margin-bottom: 40px;}
    .pf_list li:nth-child(odd) {margin-top:40px}
    .pf_list li:nth-child(even) {margin-bottom:40px}
    .number_effect {font-size: 45px;}
    .number_effect:after {font-size: 45px;}
    #bs_pager a {font-size:15.5px; margin-right:12px}
    .bs_card_wrap ul {height:840px;}
    .bs_card_wrap ul li {width:49% !important; height:400px !important; margin-right:0; margin-bottom:20px !important}
    .bs_card_wrap ul li:nth-child(2n) {margin-left:2%}
    .bs_card_wrap ul li.bs_768 {margin-left:2%}
    .bs_card_wrap ul li.bs_textbox h3 br {display: block;}
    .process_img_slider img {height:320px}
    .contact_video .title_top a {position: initial; margin-top: 30px; height:48px; line-height: 48px;}
}

@media screen and (max-width:680px) {
    #bs_pager {
        white-space: nowrap; overflow: auto;
        margin-right:-20px;
        -ms-overflow-style: none; /* 인터넷 익스플로러 */
        scrollbar-width: none; /* 파이어폭스 */
    }
    #bs_pager ::-webkit-scrollbar {display: none;}
    .main_section1 .title_top p br {display: block;}
    .bs_card_wrap ul {height:800px}
    .bs_card_wrap ul li {height:380px !important}
    .pf_list li:hover img {transform: none; transition:none;}
    .ex_link_list li .es_imgBox:after {display:none}
    .pf_more {position: relative; padding:0 20px; height:46px; line-height: 44px; top:auto; margin-top:20px; border-radius: 25px;}
    .pf_more img {position: initial; transform: none; vertical-align: -1px; margin-left:10px}
    .number_effect {top:240px}
    .pf_more:hover {color:inherit;}
    .pf_more:hover:after {display: none;}
    .pf_more:hover img {filter: none; transition:none;}
    .bs_wrap.padding_large {margin-top:75px; padding-bottom: 0;}
    .main_section1.ex_section {padding-top:56px}
    .ex_link_list {padding-bottom: 75px;}
    .main_section1.process_wrap {margin-top:70px}
    .client_wrap.main_section1 {margin:50px auto 50px}
    .main_section1.pf_wrap .title_top p {width:100%}
    .message_in .basicLat li {padding:23px}
    .message_in .basicLat li .rev_star_top {margin-bottom:15px}
}

@media screen and (max-width:630px) {
    .pf_list li p {display:none}
    .bs_card_wrap ul {height:740px}
    .bs_card_wrap ul li.bs_textbox {padding:25px 20px 20px}
    .bs_card_wrap ul li.bs_textbox .bs_more_link {left:20px; bottom:20px}
    .bs_card_wrap ul li {height:350px !important; padding:15px;}
    .bs_card_wrap ul li a {left:15px; bottom:15px}
    .bs_card_wrap ul li.bs_textbox .in_text {padding:15px 0 10px}
    .bs_card_wrap ul li h5 {padding:11px 0 4px; font-size:16px}
    .message_in .basicLat li {width:55% !important; margin-right:15px !important}
    .ex_section .swiper-button-prev {display: none;}
    .ex_section .swiper-button-next {display: none;}
    .main_section1.process_wrap .title_top .btn-prev {display: none;}
    .main_section1.process_wrap .title_top .btn-next {display: none;}
    .message_in .bx-wrapper .bx-controls-direction a.bx-prev {display: none;}
    .message_in .bx-wrapper .bx-controls-direction a.bx-next {display: none;}
    .banner_textbox p b {font-size:31px}
    .banner_textbox p span {font-size:18px; width:78%}
    .mainpage_banner .banner_part .line_div .line_img {width:200px; height:200px; --tile-margin:3vw}
    .mainpage_banner .banner_part .line_div .line_img.one_blue {width:100px; height:100px}
    .mainpage_banner .banner_part .line_div .line_img.img_large {width:500px}
    .mainpage_banner .banner_part .line_div .line_img.img_medium {width:350px}
    .client_logo li img {width:33.3333%}
}

@media screen and (max-width:550px) {
    .bs_card_wrap ul {height:auto}
    .bs_card_wrap ul li {width:100% !important; height: auto !important; margin-left:0 !important}
    .bs_card_wrap ul li.bs_textbox .bs_more_link {position: initial; display: inline-block;}
    .bs_card_wrap ul li a {position: initial; margin-top:10px}
    .process_img_slider img {height:auto; width:100%}
}

@media screen and (max-width:499px) {
    .mainpage_banner {height:560px}
    .mainpage_banner .banner_part .line_div .line_img {width:150px; height:150px;}
    .mainpage_banner .banner_part .line_div .line_img.one_blue {width:70px; height:70px}
    .mainpage_banner .banner_part .line_div .line_img.img_large {width:400px}
    .mainpage_banner .banner_part .line_div .line_img.img_medium {width:300px}
    .document_wrap {margin-top:330px}
    .document_wrap ul li img {width:130px}
    .review_roll {margin-top:272px}
    .banner_back3 div li img {width:200px}
    .main_section1 .title_top p {font-size:17px}
    .main_section1.contact_video .title_top p br {display: none;}
    .banner_textbox p b {font-size: 27px;}
    .pf_list {display: block;}
    .pf_list li {width:100%; flex-basis: 100%; margin-bottom:20px}
    .pf_list li:nth-child(odd) {margin-top:0}
    .pf_list li:nth-child(even) {margin-bottom:20px}
    .pf_list li:nth-child(6), .pf_list li:nth-child(7), .pf_list li:nth-child(8) {display: none;}
    .pf_list li p {display: block;}
    .number_effect {display: none;}
    .main_section1.pf_wrap .title_top {margin-bottom:25px}
    .pf_more {border-radius: 0; border:0; border-bottom:1px solid #051E4E; padding:0; height:auto; line-height:34px}
    .pf_list li h5 {font-size:19px}
    .pf_list li p {font-size:15px}
    .main_section1 .title_top h3 {font-size:26px}
    .message_in .basicLat li {width:85% !important}
    .process_in #custom_pager a b {font-size:15.5px}
    .process_in #custom_pager a h3 {font-size:15px}
    .process_in #custom_pager a p {font-size:14px}
}

@media screen and (max-width:410px) {
    .mainpage_banner {height:480px}
    .banner_textbox p b {font-size:24px}
    .banner_textbox p span {font-size:16px}
    .document_wrap {margin-top:285px}
    .review_roll {margin-top:242px}
    .banner_back3 div li img {width:150px;}
    .document_wrap ul li img {width:100px}
    .main_section1 .title_top h3 {font-size:25px}
    .main_section1.message_wrap .message_in {margin-bottom:12px; font-size:13px}
    .message_in .star_box i {width:11px; height: 11px;}
    .message_in .basicLat li {padding:20px}
    .message_in .basicLat li .rev_star_top .star_profile {width:30px; height:30px; margin-right:8px}
    .message_in .basicLat li .star_box {top:4px}
}