/* 기본 세팅 */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR&display=swap');
@import url('https://webfontworld.github.io/score/SCoreDream.css');
@font-face {
  font-family: 'GmarketSansBold';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'GmarketSansMedium';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'S-CoreDream-3Light';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
*{padding: 0; margin: 0; font-family: 'Noto Sans KR', 'sans-serif';}
li {list-style: none; outline: none;}
a {text-decoration: none; color: inherit; outline: none;}
body * {box-sizing: border-box; -webkit-tap-highlight-color :rgba(0,0,0,0);}
img:focus {outline: none;}
button{border: none; outline: none;}
button:focus{outline:none;}
input:focus{outline:none;}
div:focus{outline:none;}
.clearfix::after{
  content: '';
  display: block;
  clear: both;
}
.fl{float: left;}
.fr{float: right;}
.tl{text-align: left;}
.tr{text-align: right;}
.tc{text-align: center;}

section.content{position: relative; width: 100%; padding-bottom: 13vw; background: #fff;}
main{overflow: hidden;}

/* ======================== 메뉴 ======================== */
.menu_show{position: fixed; top: 0%; right: -100%; width: 100%; height: 100%; background: linear-gradient(225deg, #744bf0, #4b6fd4); z-index: 9999; transition: all .5s cubic-bezier(0, 0.21, 0.03, 1.01); min-height:600px;}
.aside_header{position: relative; width: 100%; height: 60px; background: #fff;}
.aside_header span{position: absolute; top: 0;}
/* aside */
span.aside_logo{left: 5%; width: 100px; height: 100%;}
span.aside_logo a{width: 100%; height: 100%; display: block; background: url(//img.x1.co.kr/kwdream/mobile/logo/logo_kwd_purple.svg) center center no-repeat; background-size: 90px auto;}
.close_btn_wrap{position: absolute; top: 50%; right: 5%; margin-top: -10px; width: 20px; height: 20px;}
.close_btn_wrap span.close_btn1{position: absolute; right: 0; top: 50%; margin-top: -1px; width: 19px; height: 2px; background: #000; border-radius: 2px; transform: rotate(45deg);}
.close_btn_wrap span.close_btn2{position: absolute; right: 0%; top: 50%; margin-top: -1px; width: 19px; height: 2px; background: #000; border-radius: 2px; transform: rotate(-45deg);}
.menu_show .category{position: relative; width: 100%; height: 75%; overflow-y: auto;}
.menu_show .category .total_menu{width: 100%; color: #fff;}
.total_menu > li.viewmenu{position: relative; width: 100%; line-height: 15vw; font-size: 5vw; border-bottom: 1px solid rgba(255,255,255,0.2);}
.total_menu > li.viewmenu a{display: block; padding: 0 4vw;}
.total_menu > li.viewmenu a .more{position: absolute; right: 5%; top: 7vw; width: 4vw; height: 2vw; background: url(//img.x1.co.kr/kwdream/mobile/common/menu_arrow_down.png) center center no-repeat; background-size: contain;}
.total_menu > li.viewmenu.on a .more{position: absolute; right: 5%; top: 7vw; width: 4vw; height: 2vw; background: url(//img.x1.co.kr/kwdream/mobile/common/menu_arrow_up.png) center center no-repeat; background-size: contain;}
.total_menu > li.viewmenu .sub_menu{position: relative; display: none; width: 100%; background: rgba(0, 0, 0, 0.2);}
.total_menu > li.viewmenu.on .sub_menu{display: block;}
.total_menu > li.viewmenu .sub_menu > li{position: relative; display: block; width: 100%; line-height: 15vw; padding: 0 4vw; font-size: 4vw; font-weight: 400; color: #ddd;}
.total_menu > li.viewmenu .sub_menu > li a .go{position: absolute; right: 5%; top: 7vw; width: 4vw; height: 2vw; background: url(//img.x1.co.kr/kwdream/mobile/common/menu_arrow_down.png) center center no-repeat; background-size: contain; transform: rotate(-90deg); opacity: 0.5;}
.menu_show .cs_wrap{position: absolute; bottom: 0; left: 0; width: 100%; height: 150px; color: #fff; text-align: center;}
.menu_show .cs_wrap span{display: block;margin: 0 auto 2vw;font-size: 3.56vw;text-align:left;width: 90%;}
.menu_show .cs_wrap span i {display: block;font-style:normal}
.menu_show .cs_wrap button {width:90%; height:52%; border:1px solid rgba(255, 255, 255, 0.2); background:rgba(255, 255, 255, 0.1);color:#fff;font-size:5vw;border-radius:15px;}

/* header */
header{position: fixed; top: 0; left: 0; z-index: 88; width: 100%; height: 60px;}
header .menu{position: absolute; top: 50%; right: 5%; transform: translateY(-50%); width: 22px; height: 18px; animation: show_logo 2s ease-out forwards;}
header .menu .open1{position: absolute; top: 50%; margin-top: -1.5px; width: 100%; height: 2px; background: #fff; border-radius: 2px;}
header .menu .open2{position: absolute; top: 2px; width: 100%; height: 2px; background: #fff; border-radius: 2px;}
header .menu .open3{position: absolute; bottom: 2px; width: 100%; height: 2px; background: #fff; border-radius: 2px;}
header .back_btn{position: absolute; top: 50%; left: 5%; transform: translateY(-50%); width: 12px; height: 18px;}
header .back_btn a{display: block; width: 100%; height: 100%;}
header .back_btn img{height: 100%;}
header .header_txt{text-align: center; line-height: 60px; font-size: 1.5rem;}

/* tab menu */
.tab_menu{margin-top: 60px; width: 100%; display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-pack: distribute; justify-content: space-around;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.tab_menu li{width: 50%; text-align: center; height: 11vw; line-height: 11vw; font-size: 3.7vw; border-bottom: 3px solid #ddd; color: #888;}
.tab_menu li.on{color: #1F3344; border-color: #1F3344; font-weight: bold;}

/* ======================== 메인 ======================== */
.main_wrap{position: relative; width: 100%; height: calc(var(--vh, 1vh) * 100); min-height: 500px; background: linear-gradient(#30aaf1, #14bcc2); margin-bottom: 20vw;}
.main_wrap .main_logo_wrap{position: absolute; width: 40%; height: 20%; top: 10%; left: 50%; transform: translateX(-50%); animation: start_move_logo 2s ease-out forwards;}
.main_logo_wrap img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; animation: zoomout_logo 1s ease-out forwards;}
.main_wrap .slide_wrap{position: absolute; top: 30%; width: 100%; height: 50%; animation: start_slide 2.2s ease-out forwards;}
.main_wrap .slide_wrap .total_slide_wrap{position: relative; width: 100%; height: 100%;}
.main_wrap .slide_wrap .total_slide_wrap .item_list{position: relative; width: 100%; height: 100%;}
.main_wrap .slide_wrap .total_slide_wrap .item_list .listCont{width: 33.3333%; height: 40vh; min-height: 225px; opacity: 0.5; transition: all .4s linear;}
.item_list .listCont .item{position: relative; width: 80%; height: 75%; background: #fff; border-radius: 15px; box-shadow: 12px 12px 0 0 rgba(239, 243, 246, 0.35); margin: 0 auto; top: 50%; transform: translateY(-50%);}
.item_list .listCont .item h1{position: absolute; top: 20%; width: 100%; text-align: center;}
.item_list .listCont .item h1 img{width: 80%; margin: 0 auto;}
.item_list .listCont .item span{position: absolute; top: 43%; width: 100%; text-align: center; font-size: 1.8rem; line-height: 3rem; margin-bottom: 2rem;}
.item_list .listCont .item span strong{font-weight: bold; font-size: 10vw;}
.item_list .listCont .item .direct{position: absolute; bottom: 10%; width: 100%; text-align: center; font-size: 4vw;}
.main_wrap .two_tab{position: absolute; bottom: -10%; left: 50%; transform: translateX(-50%); width: 90%; opacity: 0; transition: all .5s cubic-bezier(0, 0.21, 0.03, 1.01);}
.two_tab .two_tab_list{width: 100%; height: 12vw; background: #6643ea; border-radius: 5px; color: #fff; font-weight: bold; font-size: 4vw; box-shadow: 0 5px 15px 0px #d3d3d3; display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-pack: distribute; justify-content: space-around;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.two_tab .two_tab_list li{width: 50%; text-align: center; line-height: 12vw;}
.two_tab .two_tab_list li a{display: block;}
.two_tab .two_tab_list li:first-child::after{content: ''; position: absolute; width: 1px; height: 25%; right: 67%; top: 50%; transform: translateY(-50%); background: rgba(255, 255, 255, 0.4);}
.two_tab .two_tab_list li:nth-child(2)::after{content: ''; position: absolute; width: 1px; height: 25%; right: 35%; top: 50%; transform: translateY(-50%); background: rgba(255, 255, 255, 0.4);}
/* slick custom */
.main_wrap .slide_wrap .total_slide_wrap .item_list .listCont.slick-center{opacity: 1; transform: scale(1.1);}
.main_wrap .slide_wrap .total_slide_wrap .item_list ul.slick-dots{width: 90%; color: #fff; margin: 0 5%; bottom: -5%;}
.main_wrap .slide_wrap .total_slide_wrap .item_list ul.slick-dots li{width: 33.3333%; height: 8vw; margin: 0; text-align: center; border-top: 1px solid #fff; font-size: 5vw; line-height: 8vw; opacity: 0.5;}
.main_wrap .slide_wrap .total_slide_wrap .item_list ul.slick-dots li.slick-active{opacity: 1;}


/* 상품추천 */
.main_wrap .recomend_dim{display: none;}
.main_wrap .recomend_dim.on{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 9999; display: block;}
.main_wrap .recomend_dim .recomend_slideWrap{position: absolute; top: 25%; left: 50%; transform: translateX(-50%); width: 100%; height: auto; }
.recomend_slideWrap .slideCont .inner{font-family: 'GmarketSansMedium'; margin: 0 10vw 2vw;}
.recomend_slideWrap .slideCont .inner .header_txt{position: relative; text-align: center; color: #fff; padding: 2.5vw; font-family: inherit; background: #fff; border-radius: 10px 10px 0 0; border: 0.5vw solid #012a70; border-bottom: none; font-size: 4vw; line-height: 1.2; min-height: 15vw; display: flex; flex-direction: column; justify-content: center;}
.recomend_slideWrap .slideCont .inner .header_txt.back_blue{background:#012a70;}
.recomend_slideWrap .slideCont .inner .header_txt > img{width: 70%;}
.recomend_slideWrap .slideCont .inner .header_txt .recomend_closs_btn{position: absolute; top: 7%; right: 3%; width: 8%;}
.recomend_closs_btn img{width: 100%;}
.recoment_content{position: relative; padding:2.5vw; font-family: inherit; color: #012a70; font-size: 4vw; letter-spacing: -0.08rem;background: #fff; border-radius: 0 0 10px 10px; border: 0.5vw solid #012a70; border-top: none; box-shadow: 0 5px 0 0 rgba(1, 42, 150, 0.5);}
.recoment_content button{font-size: 5vw;font-family: inherit;font-weight: bold;color: #fff;background: #012a70;border-radius: 100px;border: 0.5vw solid #194da6; box-shadow: 0 0.3vw 0 0 rgba(25, 77, 166, 0.5); margin: 3vw 1vw 3vw; width: 30%; height: 8vw; line-height: 7vw;}
.recoment_content button.startBtn{width: 45%;height: 8vw;line-height: 8vw; margin: 8vw 0 3vw;}
.recoment_content .img_wrap{position: absolute; right: 3%; bottom: 10%; width: 40%;}
.img_wrap img{width: 100%;}
.recoment_content .q_num{font-family: inherit; width: 10vw; height: 10vw; background: #012a70; color: #fff; border-radius: 100%; line-height: 11vw; margin: 0 auto 2vw;}
.recoment_content .q_txt{font-family: inherit; min-height: 20vw; display: flex; flex-direction: column; justify-content: center; font-size: 4.5vw; line-height: 1.3; word-break: keep-all;}
.recoment_content .q_txt .sm_txt{font-size: 3.5vw;}
.recoment_content .q_txt lottie-player{width: 70%; margin: 0 auto;}
.recoment_content .prev_btn{position: absolute; left: 3%; bottom: 4%; width: 7%;}
.recoment_content .prev_btn img{width: 100%;}
.recomend_slideWrap .slideCont .inner .prd_wrap{position: relative; width: 100%; height: 100%; padding: 10vw 3vw 3vw; background: #fff; border-radius: 10px; border: 0.5vw solid #012a70; box-shadow: 0 5px 0 0 rgba(25, 77, 166, 0.5);}
.recomend_slideWrap .slideCont .inner .prd_wrap .recomend_closs_btn{position: absolute; top: 2.5%; right: 3%; width: 8%;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap{position: relative; width: 50%; margin: 4vw auto 1vw;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap .able_pc_wrap{display: none;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap button{background: none; width: 100%;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap button img{width: 100%;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc{position: relative; width: 100%; text-align: center; font-size: 4.5vw; font-weight: bold; color: #012a70;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc .able_pc_wrap{display: block;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc .able_pc_wrap > button{margin: 3vw 1vw 0vw; display: inline-block;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc .able_pc_wrap a{margin: 3vw 1vw 0vw; width: 40%; display: inline-block;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc .able_pc_wrap > button:last-child{width: 25%;}
.recomend_slideWrap .slideCont .inner .prd_wrap .loan_btn_wrap.able_pc .normal_wrap{display: none;}
.recomend_prd_inner{width: 100%;}
.recomend_prd_inner li{display: block; width: 100%; padding: 0 3vw; font-size: 4vw;}
.recomend_prd_inner li:first-child .prd_inner_txt{height: 10vw;}
.recomend_prd_inner li .prd_inner_txt{width: 100%; border-bottom: 1px solid #f1f1f2; height: 8vw; line-height: 8vw;}
.recomend_prd_inner li .prd_inner_txt .prd_inner_left{width: 50%; height: 100%; display: flex; flex-direction: column; justify-content: center;}
.recomend_prd_inner li .prd_inner_txt .prd_inner_left img{width: 100%;}
.recomend_prd_inner li .prd_inner_txt .prd_inner_right{width: 50%; text-align: right;}
.recomend_prd_inner li .prd_inner_txt .prd_inner_right.per{font-size: 8vw; font-weight: bold;}
.recomend_prd_inner li .prd_inner_txt .prd_inner_right.per span{font-size: 4vw; font-weight: normal;}
.recomend_prd_inner li .prd_inner_txt.area3{height: auto; line-height: 1.3; text-align: center; border: none;}
.recomend_prd_inner li .prd_inner_txt.area3 div{width: 33.3333%; padding: 1vw 2vw; font-weight: 300;}
.recomend_prd_inner li .prd_inner_txt.area3 div .per{width: 100%; font-weight: bold; text-align: center; padding-top: 1vw;}


/* 스크롤 다운 */
.scroll_wrap{position: absolute; bottom: 5%; width: 100%; left: 50%; transform: translateX(-50%); text-align: center; animation: scroll_down 3.5s ease-out infinite; }
.scroll_wrap .scroll_down{position: relative; width: 57px; height: 4px; margin: 0 auto;}
.scroll_wrap .scroll_down img{width: 80%;}


/* ======================== cont1 ======================== */
.cont_inner{width: 90%; margin: 0 auto;}
.cont_inner .obj_wrap{color: #1f3344; }
.cont_inner .obj_wrap .big_txt{position: relative; opacity: 0; top: 15vw; font-size: 9.5vw; font-weight: 900; line-height: 11.5vw; padding: 0 5vw; letter-spacing: -0.01vw; transition: all .5s ease-in-out;}
.cont_inner .obj_wrap .md_txt{position: relative; opacity: 0; top: 14vw; margin-top: 3vw; font-size: 5.7vw; padding: 0 5vw; letter-spacing: -0.05vw; transition: all .5s ease-in-out;}
/* 상담신청, 상품목록 */
.cont1{position: relative; width: 100%; height: auto;}
.cont1 .cont1_inner_back{background: url(//img.x1.co.kr/kwdream/mobile/main/line_back.png)center center no-repeat; background-size: contain;}
.cont1 .top_obj{position: relative; width: 100%; opacity: 0; margin-top: 20%; height: 23vw; display: flex; align-items: center; transition: all .5s ease-in-out .2s;}
.cont1 .top_obj .mini_sq{position: relative; width: 13%; left: -2%; animation: doongdoong 1.5s ease-in-out infinite;}
.cont1 .top_obj .mini_sq img{width: 70%;}
.cont1 .top_obj .clock{width: 65%; text-align: center;}
.cont1 .top_obj .clock img{width: 50%; animation: clock 2s ease-in-out infinite;}
.cont1 .btm_obj{position: relative; width: 100%; opacity: 0; margin-top: 20%; height: 35vw; overflow: hidden; transition: all .5s ease-in-out .2s;}
.cont1 .btm_obj .mini_top{position: absolute; left: 0; top: 0; height: 100%; width: 43%; text-align: center;}
.cont1 .btm_obj .mini_top img{width: 43%; margin-top: 55%;}
.cont1 .btm_obj .db_top{position: absolute; left: 43%; top: 0; width: 55%;}
.cont1 .btm_obj .db_top img{width: 120%; padding-top: 5%;}
.cont1 .btm_obj .max_per{position: absolute; left: 51%; top: 12%; width: 25%;}
.cont1 .btm_obj .max_per img{width: 100%; animation: doongdoong 4s ease-in-out infinite;}

/* ======================== cont2 ======================== */
.cont2{position: relative; background: #f3f3f3; width: 100%; height: auto; padding: 12vw 0 7vw;}
.cont2 .cont2_inner_back{background: #fff;}
.cont2 .all_obj{position: relative; opacity: 0; margin-top: 20%; width: 100%; height: 70vw; transition: all .5s ease-in-out .2s;}
.cont2 .all_obj .line_obj{position: absolute; top: 30%; left: -1%; width: 100%;}
.cont2 .all_obj .line_obj img{width: 102%;}
.cont2 .all_obj .dot_cloud{position: absolute; bottom: 0; left: 0; width: 60%; height: 60%; overflow: hidden;}
.cont2 .all_obj .dot_cloud img{position: relative; width: 100%; bottom: -30%; animation: doongdoong3 5s ease-in-out infinite;}
.cont2 .all_obj .cloud_obj{position: absolute; width: 100%; height: 100%;}
.cont2 .all_obj .cloud_obj img.cloud1{position: absolute; top: 5%; left: 25%; width: 12%; animation: leftright 4s ease-in-out infinite;}
.cont2 .all_obj .cloud_obj img.cloud2{position: absolute; bottom: 20%; right: 20%; width: 12%; animation: leftright 7s reverse ease-in-out infinite;}
.cont2 .all_obj .rocket_obj{position: absolute; width: 100%; height: 100%;}
.cont2 .all_obj .rocket_obj img{position: absolute; top: 20%; left: 17%; width: 55%; animation: doongdoong 3s ease-in-out infinite;}
.cont2 .all_obj .head_obj{position: absolute; left: 47%; top: -8.5%; height: 29%; animation: doongdoong2 3s ease-in-out infinite; transform-origin: left bottom;}
.cont2 .all_obj .head_obj img{height: 100%;}

/* ======================== cont3 ======================== */
.cont3{position: relative; width: 100%; height: auto; padding: 12vw 0 7vw;}
.cont3 .cont3_inner_back{background: #f4f4f4;}
.cont3 .all_obj{position: relative; opacity: 0; margin-top: 20%; width: 100%; height: 70vw; transition: all .5s ease-in-out .2s;}
.cont3 .all_obj .bigWon_obj{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.cont3 .all_obj .bigWon_obj img:first-child{position: absolute; bottom: 5%; left: 5%; width: 40%; animation: doongdoong3 6s ease-in-out infinite;}
.cont3 .all_obj .bigWon_obj img:last-child{position: absolute; top: 0; right: 7%; width: 22%; animation: doongdoong3 4s ease-in-out infinite;}
.cont3 .all_obj .hand_obj{position: absolute; top: 15%; width: 100%; height: 52%; text-align: center;}
.cont3 .all_obj .hand_obj img{height: 100%; animation: doongdoong3 4s ease-in-out infinite;}
.cont3 .all_obj .smwon_obj{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.cont3 .all_obj .smwon_obj .s_won1{position: absolute; top: 7%; left: 25%; width: 3vw; height: 3vw;}
.cont3 .all_obj .smwon_obj .s_won1 img{width: 100%; animation: doongdoong 2s ease-in-out infinite;}
.cont3 .all_obj .smwon_obj .s_won2{position: absolute; bottom: 35%; left: 39%; width: 2.5vw; height: 2.5vw;}
.cont3 .all_obj .smwon_obj .s_won2 img{width: 100%; animation: doongdoong 3s ease-in-out infinite;}
.cont3 .all_obj .smwon_obj .s_won3{position: absolute; top: 14%; left: 51%; width: 2vw; height: 2vw;}
.cont3 .all_obj .smwon_obj .s_won3 img{width: 100%; animation: leftright 2s ease-in-out infinite;}
.cont3 .all_obj .smwon_obj .s_won4{position: absolute; top: 0%; right: 37%; width: 1.5vw; height: 1.5vw;}
.cont3 .all_obj .smwon_obj .s_won4 img{width: 100%; animation: doongdoong 2s ease-in-out infinite;}
.cont3 .all_obj .smwon_obj .s_won5{position: absolute; top: 19%; right: 28%; width: 2vw; height: 2vw;}
.cont3 .all_obj .smwon_obj .s_won5 img{width: 100%; animation: leftright 3s ease-in-out infinite;}

/* ======================== cont4 ======================== */
.cont4{position: relative; background: #f3f3f3; width: 100%; height: auto; padding: 12vw 0 7vw;}
.cont4 .cont4_inner_back{background: #fff;}
.cont4 .all_obj{position: relative; opacity: 0; margin-top: 20%; width: 100%; height: 70vw; transition: all .5s ease-in-out .2s;}
.cont4 .all_obj .board_obj{position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 45%; perspective: 300px;}
.cont4 .all_obj .board_obj img{width: 100%; animation: pop3d 3s linear infinite;}
.cont4 .all_obj .dot_cloud{position: absolute; right: 1%; bottom: 0; width: 60%; height: 60%; overflow: hidden;}
.cont4 .all_obj .dot_cloud img{position: relative; width: 100%; bottom: -30%; animation: doongdoong3 5s ease-in-out infinite;}

/* ======================== db ======================== */
.db_insert{position: relative; width: 100%;}
.dbinsert_wrap{width: 100%;}
.dbinsert_wrap h1{font-weight: normal; font-size: 4.5vw; margin-bottom: 2vw; color: #1f3344;}
.dbinsert_wrap h1::before{position: relative; width: 4vw; height: 4vw; display: inline-block; content: ''; background: url(//img.x1.co.kr/kwdream/mobile/common/db_mobile.png) center center no-repeat; background-size: contain; }
.dbinsert_wrap > input{display: block; width: 100%; font-size: 5vw; height: 13vw; margin-bottom: 2vw; border: 1px solid #707070; padding-left: 2vw;}
.dbinsert_wrap > input:focus{border: 1px solid #744BF0; color: #744bf0; background-color: #fff; padding-left: 2vw;}
.dbinsert_wrap > input::placeholder{color: #b7b7b7; font-size: 5vw; padding-left: 2vw; line-height: 5vw;}
.dbinsert_wrap .check_wrap{width: 100%; color: #535353; margin-bottom: 4vw;}
.dbinsert_wrap .check_wrap input[type="checkbox"]{display:none;}
.dbinsert_wrap .check_wrap input[type="checkbox"] + label{font-weight: 500; font-size: 4vw; padding-right: 3vw; cursor: pointer;}
.dbinsert_wrap .check_wrap input[type="checkbox"] + label span{display:inline-block; width:3vw; height:2vw; background: url(//img.x1.co.kr/x1/images/mbti/randing/uncheck.png) bottom no-repeat; background-size: contain; vertical-align:middle; padding: 2px 0; margin-bottom: 5px; margin-right: 1vw;}
.dbinsert_wrap .check_wrap input[type="checkbox"]:checked + label span{background: url(//img.x1.co.kr/x1/images/mbti/randing/check.png) bottom no-repeat; background-size: contain;}
.dbinsert_wrap .check_wrap a{font-size: 4vw;}
.dbinsert_wrap .istBtn{width: 100%; height: 12vw; background: #5246b8; border-radius: 2vw; color: #fff; font-size: 4vw; line-height: 4vw;}
.dbinsert_wrap .guide_txt p{font-size:3.5vw; margin-top:4vw;}
/* ======================== footer ======================== */
/* footer{position: relative; width: 100%; background: #eff3f6;}
footer .logo_wrap{width: 60%;text-align: center;margin: 0 auto;padding: 2vw 0;}
footer .logo_wrap img{width: 100%;}
footer address{padding: 2vw 0 26vw;font-size: 3.5vw;font-style: normal;text-align: center;color: #98989c;}
footer address span{padding: 0 2vw;} */

/* footer 211101 */
footer {position:relative;background: #f2f4f4; margin-bottom: 10vh;}
footer .footer_info {position:relative;padding: 2vw 0 5vw;font-size: 3.2vw;color: #6a6a6a;line-height:1.77;letter-spacing: -0.05em;text-align:center;}
footer .footer_info a {color: inherit;}
footer .footer_info .logo_wrap{width: 60%;text-align: center;margin: 0 auto;padding: 2vw 0;}
footer .footer_info .logo_wrap img{width: 100%;}
footer .txt_guide {line-height:1.6;font-weight: bold;color: #7b7b7b;letter-spacing: -0.09em;}
footer .quick_menu {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;}
footer .quick_menu li {position:relative;padding: 0 2vw;}
footer .quick_menu li:before {position:absolute;top:50%;left:0;display:block;content:'';width:1px;height:1rem;margin-top:-.5rem;background:#666}
footer .quick_menu li:first-child:before,
footer .quick_menu li:nth-child(5):before {display:none}
footer .quick_menu li a {font-size: 3.4vw;color: #6a6a6a;font-weight: normal;}
footer .emoney_add{margin: 3vw 0;}
footer .emoney_add .bar {display:inline-block;content:'';width:1px;height: 3vw;margin:-.25rem .667rem 0;background:#666;vertical-align:middle;text-indent:-99999px;}
footer .address {margin: 3vw 0 0;}
footer .address .bar {display:inline-block;content:'';width:1px;height: 3vw;margin:-.25rem .667rem 0;background:#666;vertical-align:middle;text-indent:-99999px;}
footer .copy {margin: 5vw 0 0;color: #6a6a6a;}

/* ======================== bottom menu ======================== */
.btm_menu{position: fixed; bottom: -100%; left: 0; width: 100%; height: 10vh; background: #272639; color: #fff; box-shadow: 0 0 10px 0 #ccc; transition: all .5s cubic-bezier(0, 0.21, 0.03, 1.01); z-index: 88; display: flex; justify-content: space-around;align-items: center;}
.btm_menu li{width: 33.3333%; height: 100%; text-align: center; font-size: 2vh;}
.btm_menu li a{display: block;}
.btm_menu li img{display: block;padding-top: 1.5vh;margin: 0 auto 1vh;width: 20%;}


/* ======================== 2. 상품안내 ======================== */
/* 배너 */
.prd_banner{position: relative; margin-top: 60px; opacity: 0; transition: all .5s ease-in-out;}
.banner_list img{width: 100%;}

/* 상품 메뉴 */
.prd_product{position: relative; top: 30vw; opacity: 0; transition: all .5s ease-in-out;}
.prd_product .prd_tab_menu{width: 100%;}
.prd_product .prd_tab_menu li{float: left; width: 25%; text-align: center; height: 10vw; line-height: 10vw; font-size: 3.5vw; border-bottom: 3px solid #ddd; color: #888;}
.prd_product .prd_tab_menu li.on{color: #1F3344; border-color: #1F3344; font-weight: bold;}
.prd_product .prd_wrap{position: relative; background: #eeeff1; padding: 4vw; z-index: 1; margin-top: 11vw;}
.prd_product .prd_wrap .prd_cont{width: 100%; height: 100%;}
.prd_product .prd_wrap .prd_cont.on{display: block;}
.prd{position: relative; background: #fff; border-radius: 10px; width: 95%; height: auto; margin-bottom: 4vw; border: 2px solid #fff; box-sizing: border-box; overflow: hidden; margin: 0 auto 4vw;}
.prd::after{content: ''; position: absolute; width: 100%; height: 100%; right: -1vw; bottom: -1vw; border: 1px solid #ddd; z-index: -1; border-radius: 10px; background: #eff3f6;}
.prd.on{border: 2px solid #6643ea;}
.prd.on button{display: block;}
.prd_txt_wrap{width: 100%; height: 15vw;}
.prd_txt_wrap .prd_logo{width: 45%;padding: 5vw 1vw;}
.prd_txt_wrap .prd_logo img{width: 100%;}
.prd_txt_wrap .prd_per{height: 100%; font-size: 8vw; line-height: 15vw; padding-right: 5vw; font-weight: bold;}
.prd_txt_wrap .prd_per span{font-size: 4vw; font-weight: normal; padding-left: 0.5vw;}
.prd_product .prd_wrap .prd_inner{width: 100%; display: none;}
.prd_inner li{width: 100%; display: inline-block; padding: 0 5vw; height: 8vw; line-height: 8vw; font-size: 4vw;}
.prd_inner li .prd_inner_txt{width: 100%;}
.prd_inner li .prd_inner_left{width: 50%;}
.prd_inner li .prd_inner_right{width: 50%; text-align: right;}
.prd_inner li.btn_li{padding: 0; height: 11vw; line-height: 11vw;}
.prd_inner li.btn_li a{display: block; height:100%; width: 100%; background: #6643ea;}
.prd button{width: 100%; height: 100%;  background: #6643ea; color: #fff; font-size: 5vw; display: none;}
.prd_product .prd_wrap .prd_slick_tab{position:absolute; left:0; bottom:100%; width: 100%; overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */}
.prd_product .prd_wrap .prd_slick_tab::-webkit-scrollbar {display: none;}
.prd_product .prd_wrap ul.slick-dots{width: 100%; position:unset;}
.prd_product .slick-dotted.slick-slider{margin-bottom:0}
.prd_product .prd_wrap ul.slick-dots li{width: 22vw; margin: 0; height: 11vw; line-height: 11vw; font-size: 3.7vw; border-bottom: 3px solid #ddd; color: #888;}
.prd_product .prd_wrap ul.slick-dots li.slick-active{color: #1F3344; border-color: #1F3344; font-weight: bold;}
/* ======================== 3. 회사소개 ======================== */
.kw_cont{padding:7vw;}
/* 1st */
.company_info .introduce_main .introduce_txt_wrap{padding:5vw 0;}
.introduce_section{position: relative; width: 100%; height: auto; display: none;}
.introduce_section.on{display: block;}
.introduce_main{background-color: #eeeff1; height:100%; margin-top:60px; position:relative;}
.introduce_main h1{font-size: 10vw; font-weight: normal; line-height: 1.1; letter-spacing: -0.075em; color: #1f3344; display: inline-block; }
.introduce_main h1 span{font-weight: bold;}
.introduce_main .introduce_txt_wrap{font-size: 4.8vw; line-height: 1.82; letter-spacing: -0.075em; word-break: keep-all; text-align:center;}
.introduce_main .introduce_txt_wrap.kwd{padding:0 7vw;}
.introduce_main .introduce_txt_wrap span.purple{color: #6643ea;}
.introduce_main .introduce_logo{width: 60%; margin: 0 auto 5vw;}
.introduce_main .introduce_logo img{width: 100%;}
.more_btn{background:#744bf0;  border-radius:5px; position:relative; bottom:0; width:90%; left:50%; transform:translateX(-50%);}
.more_btn a{display:block; text-align:center; color:#fff; padding:2vw 0; font-size:4.5vw;}


/* 2st */
.introduce_service{position: relative; width: 100%; height: auto; background: #fff; top:60px;}
.introduce_service h1{font-size: 10vw; letter-spacing: -0.075em; color: #1f3344; text-align: center; margin-top: 10%;}
.introduce_sv_menu{width: 100%; margin: 10vw 0; display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-pack: distribute; justify-content: space-around;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.introduce_sv_menu li{width: 33.3333%; text-align: center;}
.introduce_sv_menu li .img_wrap{display: block; width: 100%; }
.introduce_sv_menu li .img_wrap img{width: 70%;}
.introduce_sv_menu li .txt_wrap p{font-size: 3vw;}
.introduce_sv_menu li .txt_wrap .subtit{font-weight: bold; font-size: 4.5vw;}
/* 3st */
.introduce_history{position: relative; width: 100%; height: auto; background: #fff;}
.introduce_history h1{font-size: 10vw; color: #1f3344; text-align: center; margin-top: 10%;}
.introduce_history .history_wrap{width: 100%; margin: 10vw 0;}
.introduce_history .history_wrap li{width: 100%; margin-bottom: 5vw;}
.introduce_history .history_wrap li.hs_point{color: #6643ea;}
.history_wrap li > div{float: left;}
.history_wrap li .hs_year{width: 20%; vertical-align: top; font-size: 3.5vw; font-weight: bold; letter-spacing: -0.075em;}
.history_wrap li .hs_year::before{content: ''; position: relative; display: inline-block; width: 2vw; height: 2vw; border-radius: 100%; background: #1f3344; margin-right: 2vw; top: -0.25vw;}
.history_wrap li.hs_point .hs_year::before{background: #6643ea;}
.history_wrap li .hs_cont{width: 80%; font-size: 3.5vw; letter-spacing: -0.075em;}
/* 4st */
.introduce_group{position: relative; width: 100%; height: auto; background: #fff;}
.introduce_group h1{font-size: 10vw; color: #1f3344; text-align: center; margin-top: 10%;}
.introduce_group .gr_wrap{width: 100%; margin: 10vw 0;}
.gr_wrap .gr_cont{width: 100%; margin-bottom: 8vw;}
.gr_wrap .gr_cont h2{font-size: 5vw; margin-bottom: 2vw;}
.gr_cont .gr_logo{width: 100%; display: flex; flex-wrap: wrap;}
.gr_cont .gr_logo li{width: 33.3333%;}
.gr_cont .gr_logo li img{width: 100%;}
/* 키워드림론 */
/* 1st */
.introduce_main h1.kwd_logo{text-align: center; width: 100%; padding: 7vw 7vw 0 7vw;}
.introduce_main h1.kwd_logo img{width: 50%;}
.introduce_section .cont1{padding-top: 30vw; background: #fff;}
.introduce_section .kw_cont_btn{position: relative; padding: 7vw; background: #fff;}
.introduce_section .kw_cont_btn button{width: 100%; height: 12vw; background: #5246b8; border-radius: 2vw; color: #fff; font-size: 4vw; line-height: 4vw; margin-bottom: 13vw;}

/* 고객지원 */
/* 1st */
.service_section{width: 100%; height: auto; display: none; color: #1f3344; margin-bottom: 10vw;/*15vw;*/}
.service_section.on{display: block;}
.service_section .service_main{width: 100%;}
.service_main .event_wrap{width: 100%;}
.event_wrap span.event{color: #744bf0; font-size: 3vw; text-align: center; width: 23vw; height: 7vw; border: 1px solid #744bf0; display: inline-block; line-height: 7vw; border-radius: 20px; box-sizing: unset; margin-right: 4vw;}
.servie_notice{width: 100%; margin: 7vw 0; border-top: 1px solid #d8d8d8;}
.servie_notice li{padding: 5vw 0; border-bottom: 1px solid #d8d8d8;}
.servie_notice .sv_notice_date{font-size: 3.5vw; line-height: 1.5;}
.servie_notice .sv_notice_cont{font-size: 5vw; font-weight: bold; line-height: 1.5;}
.service_section .dim{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 88; display: none;}
.service_section .dim .notice_wrap{position: absolute; width: 90%; height: 70%; left: 50%; top: 48%; transform: translate(-50%, -50%); border-radius: 15px; overflow: hidden; box-sizing: border-box; background: url(//img.x1.co.kr/kwdream/mobile/service/notice_back.png) right bottom no-repeat #fff; background-size: 35%;}
.notice_wrap .notice_title{height: 17%; padding: 5vw;}
.notice_wrap .sv_notice_date{font-size: 3.5vw; line-height: 1.5;}
.notice_wrap .sv_notice_cont{font-size: 5vw; font-weight: bold; line-height: 1.5;}
.notice_wrap .notice_txt{height: 60%; padding: 5vw 12vw 5vw 7vw; letter-spacing: -0.02rem; overflow: scroll;}
.notice_wrap button.close_btn{position: absolute; left: 0; bottom: 0; width: 100%; height: 12vw; background: #6643ea; color: #fff; font-size: 4vw; line-height: 4vw; border: 1px solid #6643ea;}

/* 게시판 */
.notice_list{margin-top: 90px;width:700px; }
.board_list{padding-bottom: 20px;}
.notice_list .board_list table {width: 100%;border-top: 2px solid #463959;border-collapse:collapse;table-layout:fixed;}
.board_list table{width: 100%;border-collapse:collapse;table-layout:fixed;}
.board_list table th{border-bottom: 1px solid #cdcdcd;background: #EFF3F6;vertical-align: middle;font-size: 16px;text-align: center;padding:13px 0;}
.board_list table tr td span.icon{ display: inline-block;background-color: #474151;color: #ffffff;border-radius: 2px;padding: 0px 20px;margin-bottom:8px}/*감사후기베스트추가*/
.board_list table td{border-bottom: 1px solid #cdcdcd;padding:13px 0;text-align: center;font-size: 18px;font-weight:300;color: #463f53;}
.board_list table td a{font-size: 18px;color: #463f53;display: block;}
.board_list table td a:hover{text-decoration:none;}
.board_list table td.tal{text-align: left;padding:12px 20px;}
.board_list table td.tar{text-align: right;}
.board_list table td img {width: 20%}
/* 게시판 글보기 */
.board_view table{width: 100%;border-collapse:collapse}
.board_view table caption{display:none}
.notice_list .board_view table {width: 100%;border-top: 2px solid #463959;border-collapse:collapse;table-layout:fixed;}
.board_view table thead th{ border-bottom: 1px solid #cdcdcd;background: #fff;vertical-align: middle;font-size: 14px;padding:12px 20px;color: #463959;text-align: left;}
.board_view table thead th.title{color:#1F3344; }
.board_view table thead th .info{font-size: 3.4vw; font-weight: normal;}
.board_view table thead th .tit{font-size: 5.25vw;font-weight:500;margin-bottom: 5px;letter-spacing: 0.5px;}
.board_view table thead th.ar{text-align: right !important;border-bottom: none;color: #EB272D;border-bottom: 1px solid #cdcdcd;}
.board_view table td{border-bottom: 1px solid #cdcdcd;text-align: center;}
.board_view table td.tal{text-align: left;padding:12px 20px;}
.board_view table td div.con{text-align: left;padding:18px;line-height: 24px;color: #6a676d; font-size: 16px;font-weight: normal;color:#1F3344; width: 85vw !important; overflow:scroll;}
.board_view table td div.con img{width:100%;}
.backBtn{width: 100%;height: 12vw;background: #5246b8;border-radius: 2vw;color: #fff;font-size: 4vw;line-height: 4vw;/* clear: both; */display: block;margin-top: 30px;}

/* FAQ */
.service_section .service_faq{width: 100%; border-bottom: 1px solid #d8d8d8; letter-spacing: -0.075em;}
.service_section .service_faq:last-child{margin-bottom: 30vw;}
.service_faq .faq_tit{font-weight: bold; font-size: 5vw; padding: 5vw; letter-spacing: -0.075em;}
.service_faq .faq_asw{padding: 0 5vw 5vw 10vw; font-size: 4vw; display: none;}

/*소개페이지 슬라이더 커스텀*/
.intro_wrap{position:relative; width:100%; margin-top:20px;}
.intro_wrap .slide_wrap .total_slide_wrap .item_list .listCont{opacity:0.5; transition: all .4s linear; position:relative; left:3.3%; margin: 0 10px}
.intro_wrap .slide_wrap .total_slide_wrap .item_list .listCont.slick-center {opacity: 1;transform: scale(1.1);}
.intro_wrap .slide_wrap .total_slide_wrap .item_list .slick-track{padding:5.5vw 0;}
.intro_wrap .item_list .listCont .item{position: relative; width:45vw; height:40vw; background: #fff; border-radius: 15px; box-shadow: 12px 12px 0 0 rgba(0,0,0, 0.05); top:initial; transform:initial; margin:0 auto;}
.intro_wrap .item_list .listCont .item h1{position: absolute; top: 20%; width: 100%; text-align: center;}
.intro_wrap .item_list .listCont .item h1 img{width: 80%; margin: 0 auto;}
.intro_wrap .item_list .listCont .item span{position: absolute; top: 43%; width: 100%; text-align: center; font-size: 1.8rem; line-height: 3rem; margin-bottom: 2rem;}
.intro_wrap .item_list .listCont .item span strong{font-weight: bold; font-size: 10vw;}
.intro_wrap .item_list .listCont .item .direct{position: absolute; bottom: 10%; width: 100%; text-align: center; font-size: 4vw;}
.intro_wrap .item_list .slick-dots{position:relative; bottom:0;}
.intro_wrap .item_list .slick-dots li{width:initial; height:initial;}
.intro_wrap .item_list .slick-dots .pagi{width:1.3vw; height:1.3vw; background:#000; border-radius:50%; opacity:0.3; transition: all .2s linear;}
.intro_wrap .item_list .slick-dots .slick-active .pagi{opacity:1; width:13vw; border-radius:13px; background: #744bf0;}

/*lading_page*/
.loan_landing_wrap button{cursor: pointer;}
.loan_landing_wrap .main_bg{background-image: linear-gradient(to bottom, #242729, #263430); position:relative;}
.loan_landing_wrap .main_bg .logo{padding-top:9vw;}
.loan_landing_wrap .main_bg .logo h1{text-align:center;}
.loan_landing_wrap .main_bg .logo h1 img{width:20vw;}
.loan_landing_wrap .main_bg .main_head{margin-top:7vw;}
.loan_landing_wrap .main_bg .main_head span{display:block; text-align:center; color:#fff;  font-family:SCoreDream;}
.loan_landing_wrap .main_bg .main_head .sub_title{font-weight:300; font-size:5vw; line-height:1.1; letter-spacing:-1.1px;}
.loan_landing_wrap .main_bg .main_head .title{font-size:11vw; font-weight:500; line-height:1.38; letter-spacing:-2.4px; margin:3.5vw 0;}
.loan_landing_wrap .main_bg .main_coment{text-align:center; position:relative;}
.loan_landing_wrap .main_bg .main_coment img{width:70%;}
.loan_landing_wrap .main_bg .main_coment p{font-size:5.4vw; line-height:1.52; letter-spacing:-1.26px; color:#fff; position:relative; top:-17vw;}
.loan_landing_wrap .main_bg .main_coment p .purple{color:#ad92ff;}
.loan_landing_wrap .main_bg .loan_apply_btn{background:#744bf0; width:80%; position:relative; left:50%; transform:translateX(-50%); border-radius:10px; bottom:9vw;}
.loan_landing_wrap .main_bg .loan_apply_btn.new_btn{background:#2df070; margin-top:2vw;}
.loan_landing_wrap .main_bg .loan_apply_btn a{display:block; text-align:center; color:#fff; padding:2.5vw 0; font-size:5vw;}
.loan_landing_wrap .main_bg .loan_apply_btn.new_btn a{color:#000;}
.loan_landing_wrap .tab_floating{position:sticky; top:0;  z-index:77;}
.loan_landing_wrap .tab_floating .tab_btn{display:flex; justify-content:space-around; box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.04); background-color: rgba(255, 255, 255, 50%);
  backdrop-filter: blur(15px); -webkit-backdrop-filter:blur(15px);}
.loan_landing_wrap .tab_floating .tab_btn button{font-size:5vw; line-height:1.78; letter-spacing:-0.18px; background:initial; padding:3.5vw 6vw; color:#000;}
.loan_landing_wrap .tab_floating .tab_btn button.on{color:#744BF0;}
.loan_landing_wrap .sec_header{text-align:center;}
.loan_landing_wrap .sec_header h2{font-family:SCoreDream; font-weight:800; line-height:1.5; color:#000; font-size:8vw;}
.loan_landing_wrap .sec_header img{width:30%; margin:8vw 0;}
.loan_landing_wrap .loan_product{padding:17vw 0 10vw 0;}
.loan_landing_wrap .loan_product .point_list li{font-size:4.4vw; font-weight:bold; line-height:1.39; letter-spacing:-1.08px; margin:0 13vw; padding:9vw 0; border-bottom:1px solid #707070;}
.loan_landing_wrap .loan_product .point_list li .purple{color:#744bf0;}
.loan_landing_wrap .loan_point_product{background:#f3f5f7; padding:17vw 0;}
.loan_landing_wrap .loan_point_product .landingSwiper{margin-top:16.5vw;}
.loan_landing_wrap .loan_point_product .landingSwiper ul li{width:50vw;}
.loan_landing_wrap .loan_point_product .landingSwiper ul li img{width:100%;}
.loan_landing_wrap .loan_point_product .more_btn{background:#744BF0; width:80%; position: relative; left:50%; transform:translateX(-50%); border-radius:15px;}
.loan_landing_wrap .loan_point_product .more_btn a{color:#fff; letter-spacing:-1.2px; display:block; text-align:center; padding:5vw 0; font-size:4vw;}
.loan_landing_wrap .loan_point_product .landing-pagination{position:relative; padding:4vw 0; text-align:center; transition: .3s opacity; transform: translate3d(0, 0, 0);}
.loan_landing_wrap .loan_point_product .landing-pagination .swiper-pagination-bullet{width:1.2vw; height:1.2vw; transition: width .5s; border-radius:10px;}
.loan_landing_wrap .loan_point_product .landing-pagination .swiper-pagination-bullet-active{background:#744bf0; width:50px; border-radius:10px; transition: width .5s;}
.loan_landing_wrap .loan_process{padding:17vw 0 1.2vw 0;}
.loan_landing_wrap .loan_process .process_list{padding:8vw 10vw 0;}
.loan_landing_wrap .loan_process .process_list li{font-size:5vw; font-weight:bold; letter-spacing:-1.02px; line-height:1.18; margin-bottom:5.5vw; display:flex; align-items:center;}
.loan_landing_wrap .loan_process .process_list li .number{font-weight:800; font-size:6.2vw; font-family: S-CoreDream; margin-right:4vw;}
.loan_landing_wrap .loan_process .process_list li .outcircle{width:5vw; height:5vw; border:solid 1px #744bf0; background:#fff; border-radius:50%; display:block; margin-right:7vw; position:relative;}
.loan_landing_wrap .loan_process .process_list li .incircle{width:3vw; height:3vw; display:block; border-radius:50%; background:#744bf0; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.loan_landing_wrap .loan_process .process_list li .outcircle:before{content:''; width:0.3vw; height:8vw; background:#744bf0; position:absolute; left:50%; transform:translateX(-50%); top:4.5vw;}
.loan_landing_wrap .landing_db_insert{background:#f3f5f7; padding:5vw 5vw 23vw 5vw;}
.loan_landing_wrap .landing_db_insert .inner{background:#fff; border-radius: 16px; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.1);}
.loan_landing_wrap .landing_db_insert .intro_db_wrap{padding:5vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap h2{font-size:4.4vw; letter-spacing:-1.14px; font-weight:bold; text-align:center; margin-bottom:4vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap > input{display: block; width: 100%; font-size:4vw; height: 13vw; margin-bottom:1vw; border: 1px solid #b7b7b7; padding-left: 2vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap input::placeholder{padding:3vw; color:#b7b7b7;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap > input:focus{border: 1px solid #744BF0; color: #744bf0; background-color: #fff; padding-left: 2vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .check_wrap{font-size:3.5vw; margin:4vw 0; display:flex; align-items:center; justify-content:center;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .check_wrap a{margin-left:5vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .apply_btn{background:#744BF0; width:95%; position: relative; left:50%; transform:translateX(-50%); border-radius:15px;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .apply_btn button{color:#fff; letter-spacing:-1.2px; display:block; text-align:center; padding:5vw 0; font-size:4vw; width:100%; background:initial;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .landing_guide{text-align:center; font-size:3vw; font-weight:500; color:#535353; display:block; margin-top:6vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .check_wrap input[type="checkbox"]{display:none;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .check_wrap input[type="checkbox"] + label span{display: inline-block; width: 3vw; height: 2vw; background: url(//img.x1.co.kr/x1/images/mbti/randing/uncheck.png) bottom no-repeat; background-size: contain; vertical-align: middle; padding: 2px 0; margin-bottom: 5px; margin-right: 1vw;}
.loan_landing_wrap .landing_db_insert .intro_db_wrap .check_wrap input[type="checkbox"]:checked + label span{background: url(//img.x1.co.kr/x1/images/mbti/randing/check.png) bottom no-repeat; background-size: contain;}

/*new_landing_popup*/
/*landing_page*/
.new_popup{display:none; position:absolute; top:0; left:0; z-index: 99;}
.new_popup .close_btn{position:absolute; top:1.5vw; right:1.5vw; z-index:99; background:#fff; border-radius:50%; width:8vw; height:8vw;}
.new_popup .close_btn img{width:8vw; height:8vw;}
.new_popup .main_bg{background-image:radial-gradient(50% 50% at 50% 50%, #1E1C36 0%, #181818 100%); position:relative;}
.new_popup .main_bg .logo{padding-top:9vw;}
.new_popup .main_bg .logo h1{text-align:center; display:flex; align-items:center; padding:0 5.5vw; font-size:3.3vw; justify-content:space-between; font-weight:300; color:#fff; font-family: 'S-CoreDream-3Light';}
.new_popup .main_bg .logo h1 img{width:20vw;}
.new_popup .main_bg .main_head{margin-top:7vw;}
.new_popup .main_bg .main_head span{display:block; text-align:center; color:#fff; font-family: 'S-CoreDream-3Light';}
.new_popup .main_bg .main_head .sub_title{font-weight:500; font-size:4.5vw; line-height:1.1; letter-spacing:-1.8px;}
.new_popup .main_bg .main_head .title{font-size:7.5vw; font-weight:700; line-height:1.38; letter-spacing:-2.4px; margin:3.5vw 0;  font-family: 'S-CoreDream-3Light';letter-spacing:-1.6px;}
.new_popup .main_bg .main_head .title em{font-style:normal; color:#2df070; font-size:9.2vw; font-weight:900; letter-spacing:-1.6px; font-family: 'S-CoreDream-3Light';}
.new_popup .main_bg .main_coment{text-align:center; position:relative; top:-15vw;}
.new_popup .main_bg .main_coment img{width:75%;}
.new_popup .main_bg .main_coment p{font-size:5.4vw; line-height:1.52; letter-spacing:-1.26px; color:#fff; position:relative; margin-top:6vw;}
.new_popup .main_bg .main_coment .sub_guide{display:block; color:#869ca3; font-size:3.2vw; font-weight:500; letter-spacing:-0.5px; margin-top:1vw; font-family: 'S-CoreDream-3Light';}
.new_popup .main_bg .main_coment p .purple{color:#ad92ff;}
.new_popup .main_bg .main_coment p .green{color:#2df070;}
.new_popup .main_bg .loan_apply_btn{background: linear-gradient(90deg, #2DF070 0%, #1CE361 100%); border: 1px solid rgba(0, 0, 0, 0.65); width:80%; position:relative; left:50%; transform:translateX(-50%); border-radius:15px; bottom:9vw;}
.new_popup .main_bg .loan_apply_btn a{display:block; text-align:center; color:#191818; font-weight:500;  padding:5vw 0; font-size:5vw; font-family: 'Source Han Sans K';}
.new_popup .tab_floating{position:sticky; top:0;  z-index:999;}
.new_popup .tab_floating .tab_btn{display:flex; justify-content:space-around; box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.04); background-color: rgba(255, 255, 255, 50%); backdrop-filter: blur(15px);}

/*side_banner*/
.side_banner{width:23.5vw; height:23.5vw; overflow:hidden; border-radius:50%; box-shadow: 0 6px 0 0 rgba(25, 21, 74, 0.3);}
.side_banner a{text-decoration:none;}
.side_banner .top{background:#31e64d; color:#000; height:14.1vw; padding-top:1.86vw;}
.side_banner span{display:block; text-align:center; animation: font-size 0.8s ease-in-out infinite alternate;}
.side_banner .top span:first-child{font-size:4.8vw; line-height:5.33vw; font-weight:700;}
.side_banner .top span:last-child{font-size:2.66vw; line-height:5.06vw; font-weight:500;}
.side_banner .top, .side_banner .bottom{display:flex; flex-direction:column; justify-content:center;}
.side_banner .bottom{background:#002555; color:#55f26e; height:9.4vw; padding-bottom:1.33vw;}
.side_banner .bottom span{font-size:3.2vw; line-height:4.26vw; font-weight:500;}
.banner_ani{position:fixed; z-index:99; top:40vw; right:1.33vw; width:24vw; height:24vw; border-radius:50%; animation: move 1.5s infinite ease-in-out, animate 3s linear infinite; background: repeating-conic-gradient(from var(--aa), #fff 0%, #fff 5%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 40%, #fff 50%);}
@property --aa {syntax:"<angle>"; inherits: false; initial-value:0deg;}
@keyframes animate{0%{--aa: 0deg} 100%{--aa:360deg};}

/*소개페이지 스와이퍼*/
.list_item{width:50vw; height:50vw; background:#fff; border-radius:10px; padding:5.33vw; position:relative;}
.list_item .logo{position:absolute; top:10.66vw; width:53.33vw; left:50%; transform:translateX(-50%);}
.list_item .interest{position:absolute; bottom:10.66vw; left:55%; transform:translateX(-50%); font-size:12vw; font-weight:900; -webkit-text-stroke: 1px black;}
.list_item .interest em{font-style:normal; font-size:7.5vw;  -webkit-text-stroke:0;}
@keyframes move{
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}

/* ==================================== 키프레임 ==================================== */
/* logo */
@keyframes zoomout_logo{
  0%{width: 3000%; opacity: 0;}
  60%{width: 100%; opacity: 1;}
  100%{width: 100%;}
}

@keyframes start_logo{
  0%{width: 700%; opacity: 1;}
  40%{opacity: 1;}
  70%{width: 100%; opacity: 0.7;}
  100%{width: 100%; opacity: 0;}
}
@keyframes basic_logo{
  0%{width: 100%; opacity: 0;}
  50%{width: 100%; opacity: 0;}
  60%{width: 100%; opacity: 1;}
  90%{opacity: 1;}
  100%{opacity: 0;}
}
@keyframes show_logo{
  0%{opacity: 0;}
  85%{opacity: 0;}
  100%{opacity: 1;}
}

/* 스크롤 다운 */
@keyframes scroll_down{
  0%{bottom: 8%; opacity: 0;}
  25%{bottom: 6%; opacity: 1;}
  30%{bottom: 6%;}
  50%{bottom: 7%;}
  70%{bottom: 6%; opacity: 1;}
  75%{bottom: 6%; opacity: 1;}
  100%{bottom: 8%; opacity: 0;}
}

/* 시작시 로고 */
@keyframes start_move_logo{
  0%{top: 35%;}
  60%{top: 35%;}
  100%{top: 8%;}
}
/* 시작시 슬라이드 */
@keyframes start_slide{
  0%{opacity: 0; top: 100%;}
  60%{opacity: 0; top: 100%;}
  100%{opacity: 1; top: 30%;}
}
/* 둥둥 */
@keyframes doongdoong {
  0%{transform: translateY(0%);}
  50%{transform: translateY(-12%);}
  100%{transform: translateY(0%);}
}
@keyframes doongdoong2 {
  0%{transform: translateY(0%) rotate(-5deg);}
  50%{transform: translateY(-22%) rotate(5deg);}
  100%{transform: translateY(0%) rotate(-5deg);}
}
@keyframes doongdoong3 {
  0%{transform: translateY(0%);}
  50%{transform: translateY(-3%);}
  100%{transform: translateY(0%);}
}
/* 시계 */
@keyframes clock{
  0%{transform: translateY(0%);}
  30%,40%,50%,60%{transform: translateY(-5%) rotate(5deg);}
  35%,45%,55%,65%{transform: translateY(-5%) rotate(-5deg);}
  70%{transform: translateY(-5%) rotate(0deg);}
  100%{transform: translateY(0%);}
}
/* 구름 */
@keyframes leftright{
  0%{transform: translateX(-30%);}
  50%{transform: translateX(0%);}
  100%{transform: translateX(-30%);}
}
/* board */
@keyframes pop3d{
  0%{transform: translateZ(0px);}
  40%{transform: translateZ(50px);}
  50%{transform: translateZ(50px);}
  55%, 65%, 75%, 85%{transform: translateZ(0);}
  60%{transform: translateZ(20px);}
  70%{transform: translateZ(15px);}
  80%{transform: translateZ(10px);}
  90%{transform: translateZ(0);}
  1000%{transform: translateZ(0);}
}


/* 반응형 */
/* PC (해상도 1024px)*/
@media all and (min-width:1024px){
  .item_list .listCont .item span strong{font-size: 6vw;}
  .item_list .listCont .item{width: 200px;}
  .item_list .listCont .item .direct{font-size: 24px;}
  .main_wrap .slide_wrap .total_slide_wrap .item_list ul.slick-dots{bottom: -20%;}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/
@media all and (min-width:768px) and (max-width:1023px){
  .notice_wrap .notice_title,
  .notice_wrap .notice_txt{padding: 20px;}
  .notice_wrap .sv_notice_date{font-size: 2vw;}
  .notice_wrap .sv_notice_cont{font-size: 3vw;}
  .notice_wrap .notice_txt{background-size: 30%;}
  .notice_wrap button{height: 8vw; font-size: 3vw; line-height: 8vw;}
  .item_list .listCont .item{width: 50%;}
  .intro_wrap .item_list .listCont .item{width:50%;}
}

@media all and (min-width:610px) and (max-width:767px){
  .item_list .listCont .item h1{top: 16%;}
  .item_list .listCont .item{width: 40%;}
  .item_list .listCont .item span strong{font-size: 5vw;}
  .item_list .listCont .item .direct{font-size: 2vw; bottom: 6%;}
  .main_wrap .slide_wrap .total_slide_wrap .item_list ul.slick-dots{bottom: -22%;}
  .main_wrap .main_logo_wrap{width: 30%;}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/
@media all and (max-width:767px){
}