@import url("font.css");
@import url("reset.css");
@import url("layout.css");
@import url("https://fonts.googleapis.com/css?family=Noto+Sans|Raleway:100,300,400,500,600,700,800,900");
@import url("http://fonts.googleapis.com/earlyaccess/notosanskr.css");

.cf:after {display: block; content: ''; clear: both; }
.bg {transform: scale(1.1); }

.m_on{display:none !important;}



/* -----------------main----------------- */
#canvas1 {position: absolute; left: 50%; margin-left: -65px; z-index: 54; display: none; top: 70%; }

.slide_list {position: relative; z-index: 50; min-width: 1240px; }
.slide_list > li {overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; min-width: 1240px; height: 100%; overflow-x: hidden; -moz-box-shadow: 0 6px 20px 8px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 6px 20px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 6px 20px 8px rgba(0, 0, 0, 0.1); }
.slide_list > li .content {z-index: 10; width: 100%; height: 100%; box-sizing: border-box; position: absolute; opacity: 0; }
.slide_list > li .content .tit {position: relative; display: block; opacity: 0; font-weight: 400; }
.slide_list > li .content .txt {position: relative; display: block; opacity: 0; font-size: 40px; color: #fff; font-weight: 200; line-height: 55px; }
.slide_list > li .content.on {opacity: 1; }
.slide_list > li .content .main-text-ani {display: inline-block; }
.slide_list > li .content .main-text-ani em {font-family: "Raleway",sans-serif; font-size: 20px; color: #000; transition: all 2s ease-out; letter-spacing: 6px; }
.slide_list > li .content .main-text-ani em:after {display: inline-block; content: ''; margin-left: 20px; vertical-align: middle; width: 205px; height: 1px; background: #000; transition: all 2s ease-out; }
.slide_list > li .content.on .main-bar {opacity: 1; transition: all 2s ease-out; }
.slide_list > li .content.on .main-bar div {width: 392px; }
.slide_list > li .visual {position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(1); z-index: -1; }
.slide_list > li .content.on .tit {margin-top: 0; margin-left: 0; opacity: 1; transition: all 1s ease-out;}
.slide_list > li .content.on .txt {margin-top: 0; margin-left: 0; opacity: 1; }
.slide_list > .slide_1 {z-index: 10; }
.slide_list > .slide_2 {z-index: 9; }
.slide_list > .slide_3 {z-index: 8; }
.slide_list > .slide_4 {z-index: 7; }
.slide_list .slide_1 .m_visual, .slide_list .slide_1 .m_bg{display:none;}

#footer-wrap .top-btn{position:absolute; content:''; right:0; top: -47px; width:50px; height:47px; background:url(../images/main_top.png) center center no-repeat;}


/* 메인슬라이드 1 */
.slide_list .slide_1 .content {top: 7%; left: 50%; margin-top: 17%; margin-left: -28.1%; text-align: left; }
.slide_list .slide_1 .content .tit {position: relative; display: block; margin-top: 70px; padding: 30px 0; opacity: 0; font-size: 23px; color: #fff; font-weight: 400; line-height: 1em; }
.slide_list .slide_1 .content .txt {margin-top: 70px; letter-spacing: -1px; }

.slide_list .slide_1 .content.on .tit{transition-delay: 1s;}
.slide_list .slide_1 .content.on .txt_box .txt {transition: 0.8s ease-out; }
.slide_list .slide_1 .content.on .txt_box .txt:first-child {transition-delay: 1.1s !important; }
.slide_list .slide_1 .content.on .txt_box .txt:nth-child(2) {transition-delay: 1.2s !important; }
.slide_list .slide_1 .content.on .txt_box .txt:nth-child(3) {transition-delay: 1.3s !important; }
.slide_list .slide_1 .content.on .txt_box .txt:nth-child(4) {transition-delay: 1.4s !important; }


/* 메인슬라이드 2 */
.slide_2 .content {top: 0; left: 0; margin-top: 0; }
.slide_2 ul {margin: 0 auto; width: 100%; height: 100%; text-align: center; font-size: 0; }
.slide_2 ul li {position: relative; display: inline-block; width: 360px; height: 720px; box-sizing: border-box; overflow: hidden; }
.slide_2 ul li p {position: absolute; top: 310px; left: 50%; margin-left: -50%; width: 100%; font-size: 23px; color: #fff; font-family: "Raleway",sans-serif; font-weight: 400; }
.slide_2 ul li a {position: absolute; top: 376px; left: 50%; margin-left: -35px; border: 1px solid #fff; width: 69px; height: 26px; line-height: 24px; text-align: center; font-family: "Raleway",sans-serif; font-weight: 400; font-size: 14px; color: #fff; }
.slide_2 ul li div {width: 100%; height: 100%;}
.slide_2 ul li:first-child div {display: block; background: url(../images/benefit_bg01.png) center 83% no-repeat; background-size: cover; }
.slide_2 ul li:nth-child(2) div {display: block; background: url(../images/benefit_bg02.png) center 83% no-repeat; background-size: cover; }
.slide_2 ul li:nth-child(3) div {display: block; background: url(../images/benefit_bg03.png) center 83% no-repeat; background-size: cover; }
.slide_2 ul li:hover {z-index: 999; }
.slide_2 ul li div:hover {transition: 0.5s ease-out; transform: scale(1.09); -o-transform: scale(1.09); -moz-transform: scale(1.09); -webkit-transform: scale(1.09); }
.slide_2 ul li:first-child, .slide_2 ul li:nth-child(3) {opacity: 0; top: -50%; }
.slide_2 ul li:nth-child(2) {opacity: 0; bottom: -80%; }

.slide_2 .content.on ul li:first-child {top: 70px; opacity: 1; transition: all 1.3s ease-out; }
.slide_2 .content.on ul li:nth-child(2) {bottom: -200px; opacity: 1; transition: all 1.3s ease-out; }
.slide_2 .content.on ul li:nth-child(3) {top: 132px; opacity: 1; transition: all 1.3s ease-out; }


/* 메인슬라이드 3 */
.slide_list .slide_3 .card_action {z-index:-1; overflow: hidden; position: absolute; top: 170px; right: 18.4%; display: block; width: 950px; height: 756px; background: url(../images/phone_bg.png) no-repeat; }
.slide_list .slide_3 .card_action .card {position: absolute; top: 28%; left: 45%; width: 199px; height: 379px; opacity: 1; background: url(../images/card.png) no-repeat; z-index: 2; }
.slide_list .slide_3 .content.on + .card_action .card {top: 64%; opacity: 0; transition: all 2s ease-in-out; transition-delay: 0.5s; }
.slide_list .slide_3 .card_action .card2 {position: absolute; top: 45%; left: 31%; }
.slide_list .slide_3 .card_action .card2 li {width: 486px; height: 162px; position: absolute; opacity: 0; }
.slide_list .slide_3 .card_action .card2 li:first-child {top: -70px; background: url(../images/card01.png) no-repeat; z-index: 10; }
.slide_list .slide_3 .card_action .card2 li:nth-child(2) {top: 30px; background: url(../images/card02.png) no-repeat; z-index: 9; }
.slide_list .slide_3 .card_action .card2 li:nth-child(3) {top: 130px; background: url(../images/card03.png) no-repeat; z-index: 8; }
.slide_list .slide_3 .card_action .card2 li:nth-child(4) {top: -170px; margin-left: 75px; width: 138px; height: 184px; background: url(../images/coin.png) no-repeat; z-index: 11; }
.slide_list .slide_3 .content.on + .card_action .card2 li:first-child {opacity: 1; top: -155px; transition: 1s ease-out; transition-delay: 1.9s; }
.slide_list .slide_3 .content.on + .card_action .card2 li:nth-child(2) {opacity: 1; top: -55px; transition: 1s ease-out; transition-delay: 1.7s; }
.slide_list .slide_3 .content.on + .card_action .card2 li:nth-child(3) {opacity: 1; top: 45px; transition: 1s ease-out; transition-delay: 1.5s; }
.slide_list .slide_3 .content.on + .card_action .card2 li:nth-child(4) {opacity: 1; top: -315px; transition: 1s ease-out; transition-delay: 2s; }
.slide_list .slide_3 .card_action .phone_mask {position: absolute; bottom: -22.9px; left: 26%; width: 100%; height: 272px; background: url(../images/phone_mask.png) no-repeat; z-index: 3; }

.slide_list .slide_3 .content {top: 41%; left: 21.8%; text-align: left; }
.slide_list .slide_3 .tit_box {padding: 20px 0 30px; }
.slide_list .slide_3 .content .tit {opacity: 0; margin-top: 70px; letter-spacing: -1.3px; font-family: "Raleway",sans-serif; font-size: 50px; font-weight: 700; color: #000; line-height: 1.2; z-index: 5; }
.slide_list .slide_3 .content .txt {margin-top: 70px; letter-spacing: -1.3px; font-size: 20px; font-weight: 300; color: #000; line-height: 1.5; z-index: 5; }
.slide_list .slide_3 .content em {display: block; margin-top: 70px; opacity: 0; }
.slide_4 .content .main-text-ani {position: absolute; top: 38%; left: 21.8%; line-height: 56px; text-align: left; color: #fff; }
.slide_4 .content .main-text-ani .tit {font-family: "Raleway",sans-serif; font-size: 55px; font-weight: 700; }
.slide_4 .content .notice_box {position: absolute; top: 25.7%; left: 50%; margin-left: -296px; }
.slide_4 .content .notice_box li {float: left; box-sizing: border-box; text-align: left; margin-left: 20px; opacity: 0; padding: 36px 28px; width: 268px; height: 450px; background: #fff; }
.slide_4 .content .notice_box li:first-child {margin-left: 0; }
.slide_4 .content .notice_box li strong {display: inline-block; overflow: hidden; width: 197px; font-size: 21px; font-weight: 400; color: #202020; white-space: nowrap; text-overflow: ellipsis;}
.slide_4 .content .notice_box li .line01 {margin: 20px 0; width: 90px; height: 1px; background: #000; }
.slide_4 .content .notice_box li p {line-height:1.8; font-size: 14px; color: #6d6d6d; }
.slide_4 .content .notice_box li span {display: block; margin: 20px 0 35px; font-family: "Raleway",sans-serif; font-size: 14px; color: #6d6d6d; }
.slide_4 .content .notice_box li a {display: inline-block; border: 1px solid #ef9a24; text-align: center; width: 90px; height: 26px; line-height: 22px; box-sizing: border-box; font-family: "Raleway"; font-weight: 500; font-size: 14px; color: #fff; background: #fea831; }

.slide_list .slide_3 .content.on em {opacity: 1; margin-top: 0; transition: 1s ease-out; }
.slide_list .slide_3 .content.on .txt_box .txt {transition: 0.8s ease-out; }
.slide_list .slide_3 .content.on .txt_box .txt:first-child {transition-delay: 0.1s !important; }
.slide_list .slide_3 .content.on .txt_box .txt:nth-child(2) {transition-delay: 0.2s !important; }
.slide_list .slide_3 .content.on .txt_box .txt:nth-child(3) {transition-delay: 0.3s !important; }
.slide_list .slide_3 .content.on .txt_box .txt:nth-child(4) {transition-delay: 0.4s !important; }


/* 메인슬라이드 4 */
.slide_list .slide_4 .content.on .notice_box li:first-child {opacity: 1; transition: 1s ease-out; transition-delay: 0.1s; }
.slide_list .slide_4 .content.on .notice_box li:nth-child(2) {opacity: 1; transition: 1s ease-out; transition-delay: 0.25s; }
.slide_list .slide_4 .content.on .notice_box li:nth-child(3) {opacity: 1; transition: 1s ease-out; transition-delay: 0.4s; }
.slide_list .slide_4 .content .notice_box li p{display:block !important; display: -webkit-box !important; -webkit-line-clamp: 9; -webkit-box-orient: vertical; white-space:normal; line-height:1.5; height:13.5em; text-align:left; word-wrap:break-word; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; font-size:14px;}


/* 메인 페이징 바 */
.main-pager-box {width: 1%; margin: 0 auto; position: absolute; height: 100%; top: 0; left: 81.5%;}

#main-pager {position: absolute; top: 41%; right: 10px; z-index: 50; margin-top: -100px; }
#main-pager li {margin: 30px 0; height: 14px; }
#main-pager li a {position:relative; display: block; height: 12px; text-indent: -999em; }
#main-pager li a:before {position:absolute; top:3px; display: block; width: 7px; height: 7px; content: ' '; text-indent: -999em; border-radius: 100%; background: #ff6600; }

#main-pager li.on a {background-position: left -14px; width: 500px; margin-right: -500px; border-radius: 0;}
#main-pager li:first-child.on a {position: relative; background: url(../images/main_pager01.png) 30px no-repeat; }
#main-pager li:first-child.on a:before, #main-pager li:nth-child(2).on a:before, #main-pager li:nth-child(3).on a:before, #main-pager li:nth-child(4).on a:before {display: inline-block; position: absolute; top: 3px; left: 0; content: ''; width: 7px; height: 7px; border-radius: 100%; background: #ff6600; }
#main-pager li:nth-child(2).on a {position: relative; background: url(../images/main_pager03.png) 30px no-repeat; }
#main-pager li:nth-child(3).on a {position: relative; background: url(../images/main_pager02.png) 30px no-repeat; }
#main-pager li:nth-child(4).on a {position: relative;background: url(../images/main_pager04.png) 30px no-repeat; }




/* -----------------SUB----------------- */
.line02{display:inline-block; margin:35px 0; width:95px; height:3px; background:#d7562f;}
.sub-bg{position:absolute; top:0; width:100%; height: 1022px; background-position: cover;}
.sub-gnb-wrap{position:absolute !important;}
.sub-site-nav{position:absolute !important;}
.sub-con-wrap header .header_tit{position:absolute; top:38%; left:50%; margin-left:-500px; width:1000px;text-align:center;}
.sub-con-wrap header .header_tit h2{font-family:'Raleway',sans-serif; font-size:40px; font-weight:300; color:#fff;}
.sub-con-wrap header .header_tit strong{font-family:'Raleway',sans-serif; display:block; font-size:60px; font-weight:700; color:#fff;}
.sub-con-wrap section{position:relative; width:100%; background: #fff;}
.sub-con-wrap section h3{padding-top:140px; text-align:center; font-family:"Raleway",sans-serif; font-size:50px; font-weight:300; color:#333;}
.sub-con-wrap section strong, .sub-con-wrap section p, .sub-con-wrap section span{font-family:"Raleway",sans-serif;}

.sub-footer{position:relative; height:585px;}
.footer01{background: url(../images/sub_footer_bg.png) center center no-repeat; color:#fff;}
.footer01 strong{display:block; padding-top:75px; font-family:"Raleway",sans-serif; font-size:40px; font-weight:600; }
.footer01 p{padding:35px 0; font-family:"Raleway",sans-serif; font-size:20px; font-weight:300;}
.footer01>a{display:inline-block; width:237px; height:55px; line-height:55px; border:1px solid #fff; font-family:"Raleway",sans-serif; font-size:24px; font-weight:300;}
.footer01>a:hover{background: #fff; color:#333; font-weight:400; transition: 0.3s ease-out;}
.footer01 .sns_icon{margin-top:40px;}
.footer01 .sns_icon a{display:inline-block; margin-left:20px;}
.footer01 .sns_icon a:first-child{margin-left:0;}
.footer01 .sns_icon a:hover img{transform: scale(1.1); transition: all 0.2s ease-out;}
.footer02{background: #1f1f1f; padding: 50px 0;}
.footer02 figure{display:none;}

.sub-menu-nav{position:absolute;left:50%; top:875px; margin-left:-540px;  width:1080px; height:84px;color:#fff;border:1px solid #fff;z-index:10}
.sub-menu-nav .menu-container{width:1080px;margin:0 auto;display:flex;  font-size:18px;font-family:'Gotham-bold';height:84px;line-height:84px}
.sub-menu-nav .menu-container .sub-menu-category{z-index:1; width:250px;}
.sub-menu-nav .menu-container .sub-menu-category .selected a{position:relative; display:inline-block;width:250px;padding-left:80px;background:url(../images/sub_menu_icon.png) no-repeat 28px center;height:84px; box-sizing:border-box; font-family:"Raleway",sans-serif; font-size:22px;}
.sub-menu-nav .menu-container .sub-menu-category .selected a:before{position:absolute; left: 35px;margin-top:-11px; top:50%; display:inline-block;content:''; width:27px; height:22px; background:url(../images/home.png) no-repeat; }
.sub-menu-nav .menu-container .sub-menu-category .selected a:after{position:absolute; right:0; top:50%; margin-top:-11px; display:inline-block; content:''; height:22px; width:1px; background: #fff;}
.sub-menu-nav .menu-container .sub-menu-category .dropdown{ width:200px; background:url(../images/sub_menu_icon.png) no-repeat 28px center;border-left:1px solid #fff;border-right:1px solid #fff;border-bottom:1px solid #fff;overflow:hidden;height:0;opacity:0;transition:height .5s ease-in-out,opacity 1s ease-in-out}
.sub-menu-nav .menu-container .sub-menu-category .dropdown a{display:block}
.sub-menu-nav .menu-container .sub-menu-category:hover{cursor:pointer}
.sub-menu-nav .menu-container .sub-menu-category:hover .dropdown{ height:100%;opacity:1;transition:height .5s ease-in-out,opacity 1s ease-in-out}

.sub-menu-nav .menu-container .sub-menu-detail{position:relative;  width:280px;z-index:1}
.sub-menu-nav .menu-container .sub-menu-detail .selected{display:flex;justify-content:space-between;align-items:center;padding:0 30px 0 32px;height:84px; }
.sub-menu-nav .menu-container .sub-menu-detail .selected a{ width:100%;height:84px; font-family:"Raleway",sans-serif; font-size:22px;}
.sub-menu-nav .menu-container .sub-menu-detail .selected a:before{position:absolute; right:20px; top:50%; margin-top:-2px; display:block; content:''; width:0px; height: 0px; border: 5px solid #fff; border-right-color:transparent;border-left-color:transparent;border-bottom-color:transparent;}
.sub-menu-nav .menu-container .sub-menu-detail .selected a:after{position:absolute; right:0; top:50%; margin-top:-11px; display:inline-block; content:''; height:22px; width:1px; background: #fff;}
.sub-menu-nav .menu-container .sub-menu-detail .selected:hover{ border-bottom:1px solid #fff;}
.sub-menu-nav .menu-container .sub-menu-detail .dropdown{border-left:1px solid #fff;border-right:1px solid #fff;border-bottom:1px solid #fff; width:calc(100% - 2px) !important;width:100%; overflow:hidden;height:0;opacity:0;transition:height .5s ease-in-out,opacity 1s ease-in-out}
.sub-menu-nav .menu-container .sub-menu-detail .dropdown:hover{background-color:#fff; color:#686868;border-left:1px solid #66666c;border-right:1px solid #66666c;border-bottom:1px solid #66666c}
.sub-menu-nav .menu-container .sub-menu-detail .dropdown a{padding-left:32px; display:block; font-family:"Raleway",sans-serif; font-size:22px; }
.sub-menu-nav .menu-container .sub-menu-detail:hover{cursor:pointer}
.sub-menu-nav .menu-container .sub-menu-detail:hover .dropdown{ height:100%;opacity:1;transition:height .5s ease-in-out,opacity 1s ease-in-out}


.sub-menu-nav .menu-container .sub-menu-share{position:relative; left:463px; width:84px;}
.sub-menu-nav .menu-container .sub-menu-share a{display: block; width:100%; height:84px; text-indent:-999em; overflow:hidden; background: url(../images/share.png) 50% 50% no-repeat;}
.sub-menu-nav .menu-container .sub-menu-share .selected a:before{position:absolute; left:0; top:50%; margin-top:-11px; display:inline-block; content:''; height:22px; width:1px; background: #fff;}
.sub-menu-nav .menu-container .sub-menu-category .selected a:hover{background-color:#fea731}
.sub-menu-nav .menu-container .sub-menu-category .dropdown{background:url(../images/sub_menu_icon.png) no-repeat 28px center #fea731}
.sub-menu-nav .menu-container .sub-menu-category .dropdown:hover{background-color:rgba(59,119,176,0.4)}
.sub-menu-nav .menu-container .sub-menu-detail .selected:hover{background-color:#fea731}
.sub-menu-nav .menu-container .sub-menu-detail .dropdown{background-color:#fea731}
.sub-menu-nav .menu-container .sub-menu-detail .dropdown:hover{background-color:#fff}
.scroll-on{border:none; width:100%; background-color:#fea731;position:fixed;top:0; left:0; margin-left:0; z-index:9999; transition: none .5s ease-in-out;}
.sub-menu-nav .scroll-on{background-color:#fea731;position:fixed;top:-1px;z-index:100; transition:top .5s ease-in-out }
.sub-menu-nav .scroll-hide{position:fixed;top:-80px;transition:top .5s ease-in-out}


/* sub01 */
.who-we-are{margin:0 auto; padding-bottom:182px; width:1080px;}
.who-we-are article{margin:0 auto; width:1080px;}
.who-we-are h3{padding-bottom:85px;}
.who-we-are strong, .service strong{line-height:1.1; letter-spacing:-1px; font-size:30px; font-weight:600; color:#333;}
.sub-con-wrap .sub-header01{width:100%; height:100%; background: url(../images/sub01_main_bg.png) center center no-repeat; background-size:cover;}

.who-we-are .content01{height:330px;}
.who-we-are .content01 figure{text-align:right;}
.who-we-are .content01 figure img{-moz-box-shadow: 10px 10px 80px -5px #999; -webkit-box-shadow: 10px 10px 80px -5px #999; box-shadow: 10px 10px 80px -5px #999;}
.who-we-are .content01 .real-fin{float:left; width:382px;}
.who-we-are .content01 .real-fin p{padding:65px 92px 0 0; line-height:1.5; font-family:"Noto Sans Kr",sans-serif; font-weight:300;}
.who-we-are .content01 .our{float:left; width:318px;}
.who-we-are .content01 .our ul{padding-top:30px;}
.who-we-are .content01 .our ul li{margin-top:40px; padding-left:60px; height:40px; font-family:"Raleway",sans-serif; font-size:14px; font-weight:600; color:#777;}
.who-we-are .content01 .our ul li:first-child{margin-top:0; background: url(../images/store_icon.png)no-repeat;}
.who-we-are .content01 .our ul li:nth-child(2){background: url(../images/money_icon.png)no-repeat;}
.who-we-are .content01 .our ul li:nth-child(3){background: url(../images/card_icon.png) 0 4px no-repeat;}

.video01{display:block; padding:90px 0; width:1080px; height:608px; margin:0 auto;}


.who-we-are .content02{height:302px;}
.who-we-are .content02 figure{float:left; overflow:hidden; width:700px; height:302px;}
.who-we-are .content02 figure img:hover{transform: scale(1.2); transition: 1s ease-out;}
.who-we-are .content02 span{display:block; margin-bottom:15px; line-height:1.4; letter-spacing:-1px; font-size:30px; font-weight:300; color:#333;}
.who-we-are .content02 strong{font-size:30px; font-weight:600; color:#d7562f;}
.who-we-are .content02 .inner{float:right; margin-top:60px; width:380px; text-align:center;}
.who-we-are .content03{height:218px; background: url(../images/sub01_img03.png) center right no-repeat;}
.who-we-are .content03 .inner{width:700px;}
.who-we-are .content03 .inner strong{display:block; padding:30px 0 25px;}
.who-we-are .content03 .inner p{padding-right:66px; line-height:1.5; font-family:"Noto Sans Kr",sans-serif; font-weight:300;}

.bridge-solution{position:relative; height:854px; text-align:center; background-position: cover;}
.bridge-solution h3{position:absolute; top:210px; left:50%; margin-left:-500px; padding-top:0px !important; width:1000px; color:#fff !important;}
.bridge-solution p{position:absolute; top:300px; left:50%; margin-left:-500px; width:1000px;font-family:"Noto Sans Kr",sans-serif !important; color:#fff; font-size:18px; font-weight:300;}
.bridge-solution figure{position:absolute; top:410px; left:50%; margin-left:-493px;}
.bridge-bg{background: url(../images/sub01_bg01.png) center center no-repeat;}
.bridge-bg.sub-bg{position:absolute; top:0; width:100%; height: 854px; background-position: cover;}

.service{margin:0 auto; width:1080px; height:1702px;}
.service .inner-wrap{margin:0 auto; width:1080px;}
.service h3{padding:166px 0 94px !important;}
.service p{font-family:"Raleway",sans-serif; line-height:1.5; font-size:16px; font-weight:300; color:#333;}
.service .all-payment{float:left; width:612px; height:636px; background: url(../images/sub01_img04.png) center top no-repeat;}
.service .all-payment figure{overflow:hidden; width:612px; height:331px;}
.service .all-payment figure img:hover{transform: scale(1.2); transition: 1s ease-out;}
.service .all-payment .inner{padding-top:42px;}
.service .all-payment .inner p{padding:20px 50px 0 0;}
.service .security{float:left; width:467px; height:636px; background: url(../images/sub01_img05.png) no-repeat;}
.service .security .inner{box-sizing:border-box; padding:30px 25px; width:318px; height:330px; background:#c5512e; text-align:center;}
.service .security .inner strong, .service .security .inner p{color:#fff;}
.service .security .inner p{padding-top:15px;}
.service .security .inner p.pdt8{padding-top:8px;}
.service .infra{clear:both; height:363px; /*background: url(../images/sub01_img06.png) no-repeat;*/}
.service .infra figure{float:left; overflow:hidden; width:612px; height:363px;}
.service .infra figure img:hover{transform: scale(1.2); transition: 1s ease-out;}
.service .infra .inner{float:right; box-sizing:border-box; padding:45px 25px 0 38px; width:468px;}
.service .infra .inner p{padding-top:25px;}
.service ul{margin-top:118px; height:122px}
.service ul li{float:left; position:relative; box-sizing:border-box; border-left:1px solid #b5b5b5; height:122px; font-size:16px; font-weight:300; color:#666;}
.service ul li:first-child{padding-right:50px; border-left:none; width:339px;}
.service ul li:nth-child(2){padding: 0 50px; width:394px;}
.service ul li:nth-child(3){padding-left:50px; width:345px;}
.service ul li strong{display:block; padding-bottom:30px; letter-spacing: 0.1px;}
.service ul li a{position:absolute; bottom:10px; right:50px; width:39px; height:39px; background: url(../images/more_btn.png)no-repeat; text-indent:-999em; }
.service ul li:nth-child(3) a{right:0;}


/* sub02 */
.sub-con-wrap .sub-header02{width:100%; height:100%; background: url(../images/sub02_main_bg.png) center center no-repeat; background-size:cover;}
.what-we-do{background:#e6e6e6 !important;}
.what-we-do h3{padding-bottom:92px;}
.what-we-do strong{display:block; padding-top:70px; line-height:1.4; font-size:26px; font-weight:600; color:#fff;}
.what-we-do p{position:absolute; left:25px; bottom:30px; line-height:1.7; font-size:15px; font-weight:300; color:#fff;}
.what-we-do ul.pc_on{margin:0 auto; padding-bottom:176px; width:1080px !important;}
.what-we-do ul.pc_on li{margin-top:32px; height:332px;}
.what-we-do ul.pc_on li:first-child{margin-top:0;}
.what-we-do ul.pc_on li div{position:relative; box-sizing:border-box; padding-left:25px; height:332px;float:left;}
.what-we-do ul.pc_on li div:before{z-index:5; position:absolute; top:25px; left:25px; content:'Payment'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif; font-size:17px;}
.what-we-do ul.pc_on li:first-child div:first-child{width:338px; background: #fea831;}
.what-we-do ul.pc_on li:first-child div:nth-child(2){position:relative; right:0;margin-left:32px; width:710px;}
.what-we-do ul.pc_on li:first-child div:nth-child(2) figure, .what-we-do ul li:nth-child(3) div:nth-child(2) figure{position:absolute; right:0;overflow:hidden; width:710px; height:332px;}
.what-we-do ul.pc_on li:nth-child(2) div:first-child figure{position:absolute; left:0; overflow:hidden; width:710px; height:332px;}
.what-we-do ul.pc_on li:first-child div:nth-child(2) figure img:hover, .what-we-do ul li:nth-child(2) div:first-child figure img:hover, .what-we-do ul li:nth-child(3) div:nth-child(2) figure img:hover, .what-we-do ul li:nth-child(4) div:first-child figure img:hover{transform:scale(1.2); transition: all 1s ease-out;}
.what-we-do ul.pc_on li:nth-child(2) div:first-child{position:relative; width:710px;}
.what-we-do ul.pc_on li:first-child div:nth-child(2) strong, .what-we-do ul li:nth-child(2) div:first-child strong, .what-we-do ul li:nth-child(3) div:nth-child(2) strong, .what-we-do ul li:nth-child(4) div:first-child strong{position:relative;}
.what-we-do ul.pc_on li:first-child div:nth-child(2):before, .what-we-do ul li:nth-child(2) div:first-child:before, .what-we-do ul li:nth-child(3) div:nth-child(2):before .what-we-do ul li:nth-child(4) div:first-child:before{left:25px;}
.what-we-do ul.pc_on li:nth-child(2) div:nth-child(2){margin-left:32px;width:338px; background:#fff;}
.what-we-do ul.pc_on li:nth-child(3) div:first-child{width:338px; background: #d7562f;}
.what-we-do ul.pc_on li:nth-child(3) div:nth-child(2){position:relative; margin-left:32px; width:710px; height:332px;}
.what-we-do ul.pc_on li:nth-child(4) div{width:338px;}
.what-we-do ul.pc_on li:nth-child(4) div:first-child{position:relative; left:0; width:338px; height:332px;}
.what-we-do ul.pc_on li:nth-child(4) div:first-child figure{position:absolute; left:0; overflow:hidden; width:338px; height:332px;}
.what-we-do ul.pc_on li:nth-child(4) div:nth-child(2){margin-left:32px; background: #fff;}
.what-we-do ul.pc_on li:nth-child(4) div:nth-child(3){margin-left:32px; background: #fea831;}
.what-we-do ul.pc_on li:nth-child(2) div:nth-child(2) strong, .what-we-do ul li:nth-child(4) div:nth-child(2) strong{color: #444;}
.what-we-do ul.pc_on li:nth-child(2) div:nth-child(2) p, .what-we-do ul li:nth-child(4) div:nth-child(2) p{color:#555;}
.what-we-do ul.pc_on li:nth-child(2) div:nth-child(2):before, .what-we-do ul li:nth-child(4) div:nth-child(2):before{color:rgba(1, 1, 1, 0.4)}


/* sub03 */
.sub-con-wrap .sub-header03{width:100%; height:100%; background: url(../images/sub03_main_bg.png) center center no-repeat; background-size:cover;}
.sub-con-wrap .what-we-create h3{padding:145px 0 110px;}
.what-we-create article{margin:0 auto; box-sizing:border-box; width:100%;}
.what-we-create article .inner{position:relative; margin:0 auto; width:1024px;}
.what-we-create article .inner > p{font-size:23px; font-weight:300; color:#d7562f; margin:20px 0 90px;}
.what-we-create article p{margin-bottom:35px; font-size:18px; font-weight:500; color:#666;}
.what-we-create article span{font-size:16px; font-weight:300; color:#666;}
/* .what-we-create article span:before{margin-right:10px; content:''; display:inline-block; vertical-align:middle; width:39px; height:1px; background:#333;} */
.what-we-create article figure{position:relative; margin-right:90px; width:339px; float:left;}
.what-we-create article figure img{position:absolute; transition: all 1s ease-out; -moz-box-shadow: 10px 10px 80px -5px #999; -webkit-box-shadow: 10px 10px 80px -5px #999; box-shadow: 10px 10px 80px -5px #999;}
.what-we-create article strong{display:block;font-family:"Raleway",sans-serif; font-size:40px; font-weight:600; color:#666;}
.what-we-create article em, .what-we-create article p, .what-we-create article span{font-family:"Noto Sans Kr",sans-serif;}
.what-we-create article em{font-size:40px; font-weight:500; color:#d7562f;}

.what-we-create article ul{position:absolute; top:190px; right:0;}
.what-we-create article ul li{float:left; box-sizing:border-box; width:295px;}
.what-we-create article ul li:nth-child(2){margin-left:59px;}
.what-we-create article ul li div{margin-top:40px;}
.what-we-create article ul li div:first-child{margin-top:0;}

.what-we-create .user{background:#f3f3f3;}
.what-we-create article.user{padding-top:105px; height:1045px;}
.what-we-create article.merchants{height:868px;}
.what-we-create article.providers{height:1120px; padding-top:138px;}

.what-we-create article.user figure{float:right; margin-left:80px; margin-right:0;}
.what-we-create article.user ul{top:180px; left:0;}
.what-we-create article.user .inner{height:803px;}

.what-we-create article.merchants p{margin-bottom:15px;}
.what-we-create article.merchants strong{margin-left:380px;}

.what-we-create article.providers strong, .what-we-create article.providers .inner > p, .what-we-create article.providers strong, .what-we-create article.merchants .inner > p{margin-left:380px;}
.what-we-create article.providers ul{top:200px;}
.what-we-create article.providers ul li div{margin-top:30px;}
.what-we-create article.providers ul li div:first-child{margin-top:0px;}
.what-we-create article.providers ul li div p{margin-bottom:15px;}


/* sub04 */
.sub-con-wrap .sub-header04{width:100%; height:100%; background: url(../images/sub04_main_bg.png) center center no-repeat; background-size:cover;}
.sub-con-wrap .what-we-have h3{padding:145px 0 85px;}
.what-we-have{height:2350px;}
.what-we-have article{margin:0 auto; width:1080px;}
.what-we-have strong{display:block; font-size:30px; font-weight:600; color:#333;}
.what-we-have p{line-height:1.5; font-size:16px; font-weight:300; color:#333;}
.what-we-have .chain{position:relative; margin-bottom:100px; height:634px;}
.what-we-have .chain div{position:relative; width:100%; height:634px;}
.what-we-have .chain div figure.pc_on{width:810px; height:514px; position:absolute; right:0;}
.what-we-have .chain div span{position:absolute; bottom:0; right:0; width:810px;}
.what-we-have .chain > div:first-child{position:absolute; width:540px;height:323px;background: url(../images/sub04_img01.png) left center no-repeat;}
.what-we-have .chain div:first-child .txt_box{margin-left:270px; z-index:5; box-sizing:border-box; padding: 0 20px; text-align:center; width:270px; height:323px; background: #d7562f;}
.what-we-have .chain div:nth-child(2){float:right;width:810px;height:634px;background: url(../images/sub04_img02.png)no-repeat;}
.what-we-have .chain div span strong{display:inline-block; vertical-align:top; padding-right:30px;}
.what-we-have .chain div span p{display:inline-block; vertical-align:top; width:603px;}
.what-we-have .chain div:first-child .txt_box strong{padding:35px 0 20px;}
.what-we-have .chain div:first-child .txt_box p.mgt10{margin-top:10px;}
.what-we-have .chain div:first-child .txt_box strong, .what-we-have .chain div:first-child .txt_box p{color:#fff;}

.what-we-have .platform{position:relative;margin-bottom:110px; height:562px;}
.what-we-have .platform div:first-child{z-index:5; position:absolute; width:810px; height:323px; background: url(../images/sub04_img03.png)no-repeat;}
.what-we-have .platform div:first-child span{float:right; box-sizing:border-box; padding:0 19px; width:270px; height:323px; text-align:center; background: #fea731;}
.what-we-have .platform div:first-child span strong,.what-we-have .platform div:first-child span p{color:#fff;}
.what-we-have .platform div:first-child span strong{padding:30px 0 20px;}
.what-we-have .platform div:nth-child(2){position:relative; width:1080px; height:562px; background: url(../images/sub04_img04.png) center right no-repeat;}
.what-we-have .platform div:nth-child(2) strong{padding-top:356px;}
.what-we-have .platform div:nth-child(2) span{position:absolute; bottom:0; box-sizing:border-box; padding:30px 20px 0 0; width:540px; height:239px;}
.what-we-have .platform div:nth-child(2) p{box-sizing:border-box; width:540px; padding:8px 20px 0 0;}

.what-we-have .ioc{margin-bottom:233px; height:439px;}
.what-we-have .ioc figure{float:left; overflow:hidden; width:738px; height:439px;}
.what-we-have .ioc figure img:hover{transform:scale(1.2); transition: 1s ease-out;}
.what-we-have .ioc div{float:left; width:310px; padding-left:30px; }
.what-we-have .ioc span{display:block; padding:15px 0 25px; font-size:16px; font-weight:300; color:#777;}
.what-we-have .ioc div p{padding-top:8px;}

.what-we-have .ioc div.pc_on{float: none; padding:0; padding-top: 455px;}
.what-we-have .ioc div.pc_on span{width:1080px;}
.what-we-have .ioc div.pc_on span strong{display:inline-block; vertical-align:top; padding-right:30px;}
.what-we-have .ioc div.pc_on span p{display:inline-block; vertical-align:top; width:880px;}

/* sub05 */
.sub-con-wrap .sub-header05{background: url(../images/sub05_main_bg.png) center center no-repeat; background-size: cover; width:100%; height:100%;}
.sub-con-wrap .how-contact-us h3{padding:168px 0 68px;}

.how-contact-us{position:relative; height:1606px; background:#e6e6e6 !important;}
.how-contact-us ul{margin:0 auto; width:1080px;}
.how-contact-us strong{font-size:26px; font-weight:600; color:#333;}
.how-contact-us p,.how-contact-us dd, .how-contact-us dt{font-family:"Raleway",sans-serif; font-size:14px; font-weight:300; color:#666;}
.how-contact-us ul li{position:relative; margin-top:33px; width:1080px; height:332 px;}
.how-contact-us ul li:first-child{margin-top:0;}
.how-contact-us ul li > div{position:relative;}
.how-contact-us ul li div strong{display:block; padding:72px 0 0 34px; letter-spacing:-1px;}
.how-contact-us ul li div a{position:absolute; bottom:27px; left:34px; display:block; box-sizing:border-box; padding-left:14px; width:160px; height:41px; line-height:36px; border:1px solid #fff; font-size:15px; color:#fff;}
.how-contact-us ul li div a:after{position:absolute; top:50%; margin-top:-3px; right:15px; vertical-align:middle; content:''; display:inline-block; width:38px; height:6px; background: url(../images/arrow.png)no-repeat;}
.how-contact-us ul li:first-child > div:before{position:absolute; top:25px; left:34px; content:'NEWS'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif; font-size:17px;}
.how-contact-us ul li:first-child > div:first-child{float:left; width:339px; height:332px; background: #fea731; color:#fff; transition:2s ease-out;}
.how-contact-us ul li:first-child > div:first-child strong{color:#fff;}

.white_box, .white_box02{float:left; margin-left:31px; width:710px; height:332px; background: #fff;}
.white_box02{margin-left:0;}
.white_box02 dl{position:absolute; top:160px; line-height:1.5;}
.white_box02 dt:nth-child(2){margin-bottom:20px;}
.white_box02 dd{padding-left:12px;}
.white_box .w_box:before, .white_box .w_box02:before{position:absolute; top:25px; left:34px; content:'News'; color:rgba(1,1,1,0.4); font-family:"Raleway",sans-serif; font-size:17px;}
.white_box02 .w_box:before, .white_box02 .w_box02:before{position:absolute; top:25px; left:34px; content:'Notice'; color:rgba(1,1,1,0.4); font-family:"Raleway",sans-serif; font-size:17px;}
.w_box{position:relative; box-sizing:border-box; padding:20px 30px; float:left; width:354px; height:312px; overflow:hidden;}
.w_box02{position:relative;box-sizing:border-box; padding:20px 30px; float:left; width:354px; height:312px; overflow:hidden;}
.w_box strong, .w_box02 strong{padding:0 !important; margin:46px 0 60px; letter-spacing:-1px;}
.white_box p, .white_box02 p{margin-top:10px;}
.white_box p:first-child, .white_box02 p:first-child{margin-top:0px;}

.col-line{display:inline-block; float:left; margin-top:24px; width:1px; height:287px; background:#e5e5e5;}

.how-contact-us ul li:nth-child(2) > div:nth-child(2){float:right; width:339px; height:332px; background:#888; transition:2s ease-out;}
.how-contact-us ul li:nth-child(2) > div:nth-child(2) strong{color:#fff;}
.how-contact-us ul li:nth-child(2) > div:nth-child(2):before{position:absolute; top:25px; left:34px; content:'official'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif; font-size:17px;}

.how-contact-us ul li:nth-child(3) > div:first-child{position:absolute; top:0; left:0; width:339px; height:332px; background: #d7562f; transition:2s ease-out;}
.how-contact-us ul li:nth-child(3) > div:first-child strong{color:#fff;}
.how-contact-us ul li:nth-child(3) > div:nth-child(2) strong:first-child{padding-top:72px;}
.how-contact-us ul li:nth-child(3) > div:first-child:before{position:absolute; top:25px; left:34px; content:'E-mail'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif; font-size:17px;}
.how-contact-us ul li:nth-child(3) > div:nth-child(2){position:absolute; right:0; width:709px; height:332px; /*background:url(../images/sub05_img02.png) no-repeat;*/}
.how-contact-us ul li:nth-child(3) > div:nth-child(2) figure{position:absolute; right:0; width:709px; height:332px; overflow:hidden;}
.how-contact-us ul li:nth-child(3) > div:nth-child(2) figure img:hover{transform:scale(1.2); transition:1s ease-out;}
.how-contact-us ul li:nth-child(3) > div:nth-child(2) .txt-box{position:absolute; }
.how-contact-us ul li:nth-child(3) > div:nth-child(2) strong{padding:15px 0 0 34px; color:#FFF;}
.how-contact-us ul li:nth-child(3) > div:nth-child(2):before{position:absolute; z-index:5; top:25px; left:34px; content:'tel'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif; font-size:17px;}


/* SUB05 게시판 */
.how-contact-us-board{margin:0 auto;}
.notice {margin:0 auto; max-width:1080px; border-top: 1px solid #6f6f6f; border-bottom: 1px solid #6f6f6f;}
.notice .notice_top{font-weight:500; text-align:center; background:#f6f6f6;}
.notice .notice_top span, .notice .notice_top p a{font-weight:500;}
.notice li p a{font-size:15px; color:#444;}
.notice li {position: relative;padding: 15px 0 15px 80px;border-top: 1px solid #ddd;}
.notice li:nth-child(1) {border-top: none;}
.notice li .num {display: inline-block; position: absolute; top: 0; left: 0; width: 70px; height: 100%; font-size: 15px; color:#666; text-align: center;}
.notice li .num:before {content: ''; display: inline-block; height: 100%; width: 1px; vertical-align: middle;}
.notice li .txt {font-size: 18px;}
.notice li .date {position: relative; color: #999; font-size: 14px;}

.paging {position: relative; margin: 0 auto; padding:20px 0 0; height:105px; max-width:1080px; text-align: center; vertical-align: middle;}
.paging span {vertical-align: middle;}
.paging span a {margin: 0 10px;}
.paging a {display: inline-block; box-sizing:border-box; border:1px solid #dfdfdf; font-size: 14px; line-height: 30px; vertical-align: middle; width:30px; height:30px; color:#000;}
.paging a.on {color: #FFF; font-weight: 700; background:#fea731; border:none;}
.paging a.next {width: 30px; height: 30px; background: url("../images/next_btn.png") no-repeat 50%; background-size: cover; overflow: hidden; text-indent: -99px;}
.paging a.prev {width: 30px; height: 30px; background: url("../images/next_btn.png") no-repeat 50%; background-size: cover; overflow: hidden; text-indent: -99px; transform: rotate(180deg); -webkit-transform: rotate(180deg);}
.paging a.last {width: 30px; height: 30px; background: url("../images/last_btn.png") no-repeat 50%; background-size: cover; overflow: hidden; text-indent: -99px;}
.paging a.first {width: 30px; height: 30px; background: url("../images/last_btn.png") no-repeat 50%; background-size: cover; overflow: hidden; text-indent: -99px; transform: rotate(180deg); -webkit-transform: rotate(180deg);}

.search{position:relative; max-width:1080px; margin:20px auto; text-align:right;}
.search input{box-sizing:border-box; padding:0 48px 0 10px; text-align:left; border:1px solid #ddd; height:38px;}
.search a{position:absolute; top:0; right:0; text-indent:9999px; overflow:hidden; width:38px; height:38px; background:url(../images/view_btn.png) no-repeat;}

.how-contact-us-board .board_view{margin:70px auto 0; max-width:1080px; border-top:1px solid #6f6f6f; border-bottom:1px solid #6f6f6f;}
.how-contact-us-board .board_view .board_head {position: relative; height: 103px; border-bottom: 1px solid #ddd; padding:0 40px; background: #f6f6f6;}
.how-contact-us-board .board_view .board_head:before {content: ''; display: inline-block; width: 1px; height: 100%; vertical-align: middle;}
.how-contact-us-board .board_view .board_head p {display: inline-block; width: calc(100% - 130px); margin-left: 10px; color: #444; font-size: 27px; font-weight:700; vertical-align: middle;}
.how-contact-us-board .board_view .board_head .date {position: absolute; display:inline-block; right: 50px; top: 43px; width:185px; text-align:right; color: #666; font-size: 15px; font-weight:400;}
.how-contact-us-board .board_view .board_cont {padding: 50px; color: #666; font-size: 15px;}

.board_prev_next{margin:0 auto; max-width:1080px;}
.board_prev_next li{height:62px; line-height:62px; border-bottom:1px solid #ddd;}
.board_prev_next .prev, .board_prev_next .next{ display:inline-block; background:#f6f6f6; width:150px; height:61px; text-align:center; font-weight:500; font-size:15px; color:#666;}
.board_prev_next .prev:before{display:inline-block; padding-right:14px; content:''; width:11px; height:11px; background:url(../images/prev_next.png) center center no-repeat;}
.board_prev_next .next:before{display:inline-block; padding-right:14px; content:''; width:11px; height:11px; background:url(../images/prev_next.png) center center no-repeat; transform:rotate(180deg);}
.board_prev_next .txt{padding-left:30px; font-size:15px; color:#666;}
.board_btn{margin:0 auto; padding:30px 0 250px; width:170px; height:55px; text-align:center; line-height:55px; }
.board_btn a{display:block; font-size:20px; color:#FFF; width:170px; height:55px; background:#fea731;}
.board_btn a:before{display:inline-block; content:''; padding-right:20px; vertical-align:middle; width:15px; height:15px; background:url(../images/list_icon.png) no-repeat; }





/* ----------------- 모바일 ----------------- */
@media screen and (max-width: 960px) {

  .pc_on{display:none !important;}
  .m_on{display:block !important;}

  
  /* 서브 네비바 */
  .scroll-on{top:0 !important; left:0 !important; width:100% !important;}
  .sub-menu-nav{left:20px; top:78%; margin-left:0; width:calc(100% - 40px); height:65px;}
  .sub-menu-nav .menu-container{width:100%; height:65px; line-height:65px;}
  .sub-menu-nav .menu-container .sub-menu-share{display:none; position:static; width:84px;}
  .sub-con-wrap header .header_tit{top:30%; margin-left:-50%; width:100%;}
  .sub-con-wrap header .header_tit strong{font-size:7vw;}
  .sub-con-wrap header .header_tit h2{font-size:5vw;}
  .sub-con-wrap section h3{font-size:19px;}
  .sub-menu-nav .menu-container .sub-menu-category .selected a, .sub-menu-nav .menu-container .sub-menu-detail .selected, .sub-menu-nav .menu-container .sub-menu-detail .selected a{height:65px;}
  .sub-menu-nav .menu-container .sub-menu-category, .sub-menu-nav .menu-container .sub-menu-detail{width:50%;}
  .sub-menu-nav .menu-container .sub-menu-category .selected a{width:100%; font-size:15px;}
  .sub-menu-nav .menu-container .sub-menu-detail .selected a, .sub-menu-nav .menu-container .sub-menu-detail .dropdown a{font-size:15px;}
  .sub-menu-nav .menu-container .sub-menu-detail .selected a:after{display:none;}

  .line02{margin:3% 0; width:8%;}


  /* 모바일 sub01 */
  .who-we-are{padding-bottom:0;}
  .who-we-are article{width:100%; padding:0 20px; box-sizing:border-box;}
  .who-we-are h3{padding:50px 0 30px 0 !important;}
  .who-we-are strong{font-size:15px; font-weight:600; text-align:left;}
  .who-we-are figure.m_on{display:block; margin-bottom:40px; text-align:center !important; width:100%;}
  .who-we-are figure.m_on img{box-shadow: 5px 5px 20px 3px #aaa; -webkit-box-shadow: 3px 3px 20px 3px #aaa; -moz-box-shadow: 3px 3px 20px 3px #aaa; }
  
  .who-we-are .content01{height:auto;}
  .who-we-are .content01 .real-fin{float:none; width:100%;}
  .who-we-are .content01 .real-fin p{padding:10px 0 0 0; font-size:12px; font-weight:400;}
  .who-we-are .content01 .our{float:none; margin-top:32px; width:100%;}
  .who-we-are .content01 .our ul{padding-top:25px; width:100%;}
  .who-we-are .content01 .our ul li{float:left; margin-top:0; padding-left:0; padding-top:47px; width:33.3%; text-align:center; font-size:12px;}
  .who-we-are .content01 .our ul li:first-child{background:url(../images/store_icon.png) center top no-repeat;}
  .who-we-are .content01 .our ul li:nth-child(2){background:url(../images/money_icon.png) center top no-repeat;}
  .who-we-are .content01 .our ul li:nth-child(3){background:url(../images/card_icon.png) center top no-repeat;}
  .who-we-are .content01 .m_video01{width:100%; height:47vw;}

  .who-we-are .content02{margin-top:32px; height:auto;}
  .who-we-are .content02 figure{float:left; height:auto;}
  .who-we-are .content02 figure img{width:100%; box-shadow:none;}
  .who-we-are .content02 figure img:hover{transform:none;}
  .who-we-are .content02 span{font-size:13px;}
  .who-we-are .content02 strong{font-size:18px;}

  .who-we-are .content03{height:auto; background:none;}
  .who-we-are .content03 .inner{width:100%;}
  .who-we-are .content03 .inner p{padding-right:0;}
  .who-we-are .content03 .inner strong{padding:0 0 15px 0;}

  .bridge-solution{padding-top:50px; height:auto;}
  .bridge-solution .m_on{width:100%; position:static; margin-left:0;}
  .bridge-solution h3{top:25%; margin-left:-50%; width:100%;}
  .bridge-solution p{top:35%; margin-left:-50%; width:100%; font-size:12px;}
  .bridge-solution .online{top:52%; left:50%; margin-left:-50%; padding:0 20px; width:100%; box-sizing:border-box; padding:0 20px;}
 
  .service{height:auto; box-sizing:border-box; padding:0 20px;}
  .service strong{font-size:15px; font-weight:600;}
  .service .inner-wrap{width:100%;}
  .service .inner-wrap h3{padding:75px 0 34px !important;}
  .service .all-payment{float:none; width:100%; height:auto; background: none;}
  .service .all-payment .inner{padding-top:30px;}
  .service .all-payment .inner p{padding:10px 0 0 0; font-size:12px;}
  .service .all-payment figure{width:100%; height:auto;}
  .service .security{position:relative; float:none; padding-top:50px; width:100%; height:auto; background: none;}
  .service .security figure{width:100%;}
  .service .infra{margin-top:37px; width:100%; height:auto;}
  .service .infra p{font-size:12px;}
  .service .infra figure{float:none; width:100%; height:100%;}
  .service .infra figure img{width:100%; height:100%;}
  .service .infra figure img:hover{transform:none;}
  .service .infra .inner{float:none; width:100%; padding:20px 0 0 0;}
  .service ul li strong{padding-bottom:8px; font-size:14px;}
  .service ul{margin:0; padding:60px 0; width:100%; height:auto;}
  .service ul li{float:none; box-sizing:border-box; padding:20px !important; border:1px solid #b5b5b5 !important; width:100% !important; height:120px; margin-top:20px;}
  .service ul li:first-child{margin-top:0;}
  .service ul li a{top:50%; right:20px !important; margin-top:-20px;}
  .service ul li span{font-size:12px; line-height:1;}


  /* 모바일 sub02 */
  .what-we-do{width:100%; height:auto;}
  .what-we-do h3{padding:60px 0 30px !important;}
  .what-we-do p{left:20px; bottom:27px; box-sizing:border-box; padding-right:23%; font-size:2.5vw;}
  .what-we-do ul.m_on{display:block!important; box-sizing:border-box; padding:0 20px 94px 20px; width:100% !important; height:100%;}
  .what-we-do ul.m_on li{position:relative; display:flex; -webkit-display:flex; margin-top:15px;}
  .what-we-do ul.m_on li:first-child{margin-top:0;}
  .what-we-do ul.m_on li div{position:relative; box-sizing:border-box; width:43.7vw; height:42.7vw;}
  .what-we-do ul.m_on li:first-child div, .what-we-do ul.m_on li:nth-child(3) div, .what-we-do ul.m_on li:nth-child(5) div{width:100%; height:auto;}
  .what-we-do ul.m_on li div figure img{width:100%;}
  .what-we-do ul.m_on li div strong{position:absolute; top:20px; left:20px; padding-top:0; font-size:4vw;}
  .what-we-do ul.m_on li:nth-child(2) div:first-child{background:#fea831;}
  .what-we-do ul.m_on li:nth-child(2) div:nth-child(2){background:#FFF;}
  .what-we-do ul.m_on li:nth-child(4) div:first-child{background:#FFF;}
  .what-we-do ul.m_on li:nth-child(4) div:nth-child(2){background:#d7562f;}
  .what-we-do ul.m_on li:nth-child(6) div:first-child{background:#4e7e97;}
  .what-we-do ul.m_on li:nth-child(6) div:nth-child(2){background:#fea831;}
  .what-we-do ul.m_on li:nth-child(2) div:nth-child(2) strong, .what-we-do ul.m_on li:nth-child(4) div:first-child strong{color:#444;}
  .what-we-do ul.m_on li:nth-child(2) div:nth-child(2) p, .what-we-do ul.m_on li:nth-child(4) div:first-child p{color:#555;}
  .what-we-do ul.m_on li:nth-child(2) div:nth-child(2), .what-we-do ul.m_on li:nth-child(4) div:nth-child(2), .what-we-do ul.m_on li:nth-child(6) div:nth-child(2){position:absolute; right:0;}
  .what-we-do ul.pc_on li:nth-child(2) div:nth-child(2) strong, .what-we-do ul li:nth-child(4) div:nth-child(2) strong{color:#FFF;}
  .what-we-do ul.pc_on li:nth-child(2) div:nth-child(2) p, .what-we-do ul li:nth-child(4) div:nth-child(2) p{color:#FFF;}

  /* 모바일 sub03 */
  .what-we-create{width:100%; height:100%;}
  .what-we-create h3{padding:50px 0 25px !important;}
  .what-we-create article{position:static !important; box-sizing:border-box; width:100%; height:100% !important; padding:0 20px;}
  .what-we-create article strong{font-size:15px; margin:0 auto !important; padding:35px 0 20px !important;}
  .what-we-create article em{font-size:20px;}
  .what-we-create article p{font-size:12px;}
  .what-we-create article span{font-size:10px;}
  .what-we-create article .inner{position:static; width:100%; height:100% !important;}
  .what-we-create article figure{position:static; float:none; margin-right:0; width:100%; height:100%;}
  .what-we-create article ul{position:static;}
  .what-we-create article ul li{width:40vw;}
  .what-we-create article figure img{position:static; opacity:1;}
  .what-we-create article span:before{width:6%;}
  .what-we-create article ul li:nth-child(2){margin-left:0; float:right;}
  .what-we-create article.user{padding:60px 20px 50px !important;}
  .what-we-create article.merchants{padding-bottom:50px;}
  .what-we-create article ul li div{margin-top:20px !important;}
  .what-we-create article .inner > p{margin:0 auto !important; font-size:15px;}
  .what-we-create article.providers{padding:70px 20px 100px;}
  .what-we-create article.user figure{float:none; margin-left:0;}

  /* 모바일 sub04 */
  .sub-con-wrap .what-we-have h3{padding:50px 0 25px;}
  .what-we-have{box-sizing:border-box; padding:0 20px; height:100%;}
  .what-we-have article{width:100%; height:100% !important;}
  .what-we-have div{width:100% !important; height:100% !important;}
  .what-we-have figure{width:100% !important; height:100% !important;}
  .what-we-have figure img{width:100%; height:100%;}
  .what-we-have p{font-size:12px;}
  .what-we-have strong{padding:20px 0 0 0; font-size:15px;}
  .what-we-have .platform{margin-bottom:65px;}
  .what-we-have .platform div:nth-child(2) span{position:static;}
  .what-we-have .platform div:nth-child(2){margin-bottom:40px;}
  .what-we-have .platform div:nth-child(2) strong{padding-top:20px; padding-bottom:0;}
  .what-we-have .platform div:nth-child(2) p{width:100%; padding:8px 0 0 0;}
  .what-we-have .chain{margin-bottom:40px;}
  .what-we-have .chain > .m_on{padding-bottom:40px;}
  .what-we-have .chain div:nth-child(2), .what-we-have .platform div:first-child, .what-we-have .platform div:nth-child(2){background:none;}
  .what-we-have .chain div span{position:static;}
  .what-we-have .chain div span p{width:100%;}
  .what-we-have .ioc{margin-bottom:30px;}
  .what-we-have .ioc span{margin-top:-10px; padding:0 0 20px; font-size:12px;}
  .what-we-have .ioc figure{float:none;}
  .what-we-have .ioc figure img:hover{transform:none;}
  .what-we-have .ioc div{float:none; padding-left:0;}

  .m_chain{margin-bottom: 80px !important;}
  

  /* 모바일 sub05 */
  /* .sub-con-wrap .sub-header05{background:url(../images/mobile/m_sub05_main_bg.png) center center no-repeat; width:100%; height:100%; background-size:100% 100%;} */
  .how-contact-us{height:100%;}
  .how-contact-us h3{padding:55px 0 25px !important;}
  .how-contact-us ul li div strong{padding:45px 0 0 20px; font-size:15px; color:#FFF;}
  .how-contact-us ul{box-sizing:border-box; padding:0 20px; width:100%; height:100%;}
  .how-contact-us ul li{margin-top:15px; width:100%; height:40vw;}
  .how-contact-us ul li:nth-child(3){padding-bottom:90px;}
  .how-contact-us ul li div{position:relative; width:100% !important; height:100% !important;}
  .how-contact-us ul li div figure img{width:100% !important;}
  .how-contact-us ul li div.txt-box{position:absolute; top:0;}
  .how-contact-us ul li div.txt-box strong:nth-child(2){padding-top:7px;}
  .how-contact-us ul li:first-child > div:before{content:'E-mail'}
  .how-contact-us ul li > div:before{left:20px !important; font-size:10px !important;}
  .how-contact-us ul li div a{left:20px; width:calc(100% - 40px); font-size:10px;}
  .how-contact-us ul li:nth-child(2) div{float:left; width:48% !important;}
  .how-contact-us ul li:nth-child(2) div:first-child{background:#d7562f;}
  .how-contact-us ul li:nth-child(3) > div:first-child{background:none;}
  .how-contact-us ul li:nth-child(2) div:first-child:before{position:absolute; top:25px; left:34px; content:'NEWS'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif;}
  .how-contact-us ul li:nth-child(3) > div:first-child:before{position:absolute; top:25px; left:34px; content:'tel'; color:rgba(255,255,255,0.5); font-family:"Raleway",sans-serif;}
  .how-contact-us ul li:nth-child(3) > div:first-child{position:relative !important;}


  /* 모바일 sub05 게시판 */
  .how-contact-us-board .board_view .board_cont{font-size:12px;}
  .how-contact-us-board .board_view .board_head{height:70px;}
  .how-contact-us-board .board_view .board_head p{font-size:15px;}
  .how-contact-us-board .board_view .board_head .date{font-size:12px; top:30px;}

  .board_btn a{font-size:10px; width:120px; height:40px; line-height:40px;}
  .board_prev_next{display:none;}
  
  .paging{padding:10px 0 30px; height:50px;}
  .paging a.prev{position:absolute; top:10px; left:10px;}
  .paging a.next{position:absolute; top:10px; right:10px;}
  .paging a.last, .paging a.first, .paging span{display:none;}

  .search{margin:20px 10px;}
  .search input{width:100%;}


  /* main */
  .slide_list{min-width:100%;}
  .slide_list .inner-wrap{position:absolute; top:20px; left:20px; margin-left:0;}
  .slide_list .inner-wrap{top:20px; left:20px; margin-left:0;}
  .slide_list h1{width:19vw; height:19.5vw;}
  .slide_list h1.on:before{height:10vw;}
  .slide_list h1 > span a{box-sizing:border-box; width:19vw; height:19.5vw; background: url(../images/top_logo.png) 91% 86% no-repeat; background-size:90% 22%; }
  .slide_list h1:before, .slide_list h1 span:before{width:0.7vw;}
  .slide_list h1 span:after, .slide_list h1:after{height:0.7vw;}
  .sub-wrap.sub-visual .slide_list{position:static; overflow:visible; height:auto; }
  .sub-wrap.sub-visual .slide_list li{position:relative;}
  .slide_list > li{min-width:100%; height:auto; box-shadow:none;}
  .slide_list > li .content{position:absolute; height:auto; opacity:1;}
  .slide_list > li .content .tit{opacity:1;}
  .slide_list > li .content .txt{font-size:4.5vw; line-height:1.5;}
  .slide_list > li figure img{width:100%;}
  .slide_list > li figure{width:100%;}

  .slide_list .slide_1{height:100%;}
  .slide_list .slide_1 .content .tit{font-size:2.5vw; padding:30px 0 10px 0;}
  .slide_list .slide_1 .content{top:12%; left:20px; margin-left:0;} 
  .slide_list .slide_1 .content .txt{letter-spacing:-1px;}  
  .slide_list .slide_1 > span{position:absolute;width:6.6vw; bottom:20px; left:50%; margin-left:-3.3vw;}

  .slide_list .slide_2{padding:20px 0;}
  .slide_list .slide_2 .content{position:static;}
  .slide_2 ul li{width:100%; height:auto;}
  .slide_2 ul li:first-child, .slide_2 ul li:nth-child(3){opacity:1; top:0;}
  .slide_2 ul li:nth-child(2){opacity:1; bottom:0;}
  .slide_2 ul li p{top:20px; font-size:15px;}
  .slide_2 ul li{margin-top:10px;}
  .slide_2 ul li:first-child{margin-top:0;}
  .slide_2 ul li a{top:0; right:0; bottom: 0; left: 0; margin-left:0; font-size:0; width:100%; height:100%; border:none;}
  .slide_2 ul li a:after{position:absolute; right:20px; top:46%; display:block; content:''; width:3.5%; height:15%; background:url(../images/mobile/arrow_r.png) center center no-repeat; background-size:contain;}

  .sub-wrap.sub-visual .slide_list .slide_3{overflow:hidden;}
  .slide_list .slide_3 .content{top:17%; left:20px;}
  .slide_list .slide_3 .content em, .slide_list .slide_3 .content .txt, .slide_list .slide_3 .content .tit{opacity:1; margin-top:0;}
  .slide_list .slide_3 .content em{font-size:2vw !important;}
  .slide_list .slide_3 .content .tit{font-size:7vw;}
  .slide_list .slide_3 .content .txt{font-size:3vw; letter-spacing:-0.5px;}
  .slide_list .slide_3 .content .tit_box{padding:15px 0 20px;}
  .slide_list > li .content .main-text-ani em:after{width:21vw;}
  .slide_list .slide_3 .card_action{top:15%; right:20px; width:82%; height:90vw; background-size:contain; z-index: 3;}
  .slide_list .slide_3 .card_action .phone_mask{bottom:0; left:26%; height:auto;}
  .slide_list .slide_3 .card_action .card{top:1%; left:43%; width:18.3vw; height:100%; background-size:contain;}
  .slide_list .slide_3 .card_action .card2{top:24%; left:24%;}
  .slide_list .slide_3 .card_action .card2 li{width:48%; height:15vw; background-size:contain;}
  
  .slide_4 .content .notice_box li{opacity:1 !important; margin-left:0; padding:20px; width:48%; height:51vw;}
  .slide_4 .content .notice_box li:nth-child(2){float:right;}
  .slide_4 .content{position:absolute !important; top:0; width:100% !important; height:100% !important;}
  .slide_4 .content .notice_box{top:18%; left:0; margin-left:20px; width:calc(100% - 40px);}
  .slide_4 .content .notice_box li strong{width: 100%; font-size:3vw;}
  .slide_list .slide_4 .content .notice_box li p{display:block !important; white-space:normal; line-height:1.5; height:3em; text-align:left; word-wrap:break-word; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; font-size:2vw;}
  .slide_4 .content .notice_box li .line01{margin:10px 0; width:10vw;}
  .slide_4 .content .notice_box li span{margin:10px 0 20px; font-size:1.5vw;}
  .slide_4 .content .notice_box li a{position:absolute; bottom:20px; left:50%; margin-left:-50px; font-size:2vw;}
  .slide_4 .content .main-text-ani{top:3%; left:20px;}
  .slide_4 .content .main-text-ani span{font-size:6vw !important;}


  /* 모바일 서브 푸터 */
  .sub-footer{height:auto;}
  .footer01{box-sizing:border-box; padding:50px 20px; height:auto; background: url(../images/mobile/m_sub_footer_bg.png) center center no-repeat;}
  .footer01 strong{padding-top:0; font-size:19px;}
  .footer01 p{padding:15px 0 30px 0; font-size:12px;}
  .footer01>a{width:100%; font-size:13px;}
  .footer01 .sns_icon a{margin-left:5vw; width:12vw;}
  .footer02{padding:0; width:100%; content:''; display:block;}
  .footer02 .footer-inner{display:none;}
  .footer02 figure{display:block;}


}