@charset "utf-8";
/*============================================================== 메인페이지 ====================================================================*/
.main i.header_menu{background-image: url(/static/img/mobile/header_menu_main.png);}

#wrap .main header{background: url(/static/img/mobile/bg_main_header.png) no-repeat;height: 100px; background-attachment: fixed;background-size:100% 100px; top:0;z-index: 2;}
#wrap .main header .header_inner{height: 50px;}
#wrap .main{background:transparent;position: relative;z-index: 1;}
#wrap .main:after{content: "";width: 100%;height:100%; display: block;background:#fff url(/static/img/mobile/bg_main.png) no-repeat;background-size:100% 500px;position: fixed; top:0;left:50%;z-index: 0;max-width: 768px;transform: translateX(-50%);}
#wrap .main main{padding-top: 0;padding-bottom: 0!important;margin-top:235px;height: calc(100vh - 50px);border-radius: 32px 32px 0 0;-webkit-overflow-scrolling:touch;}
.main .main_title{text-align: center;color: #fff;position: fixed;left:50%;top:50px;width: 100%;height: 235px;z-index: 1; transform: translateX(-50%);max-width: 768px;background:url(/static/img/mobile/obj_main.png) no-repeat;background-position:center 75px;background-size: 70%;}
.main .main_title h1{width: 180px;margin: 70px auto 0;}
.main .main_content_wrap{border-radius: 32px 32px 0 0;overflow: hidden;position: relative;z-index: 1;}
.main .main_content{position: relative;z-index: 2;background-color: #fff;overflow: hidden;padding: 32px 0 0;min-height: calc(100vh - 550px);box-shadow: 0px -4px 8px 0px #0000001A;}
.main .main_content .login_box_wrap{padding: 0 20px;}
.main .main_content .login_box{padding: 12px 16px;}
.main .main_content .login_box div{width: 100%}
.main .main_content .login_box div > a{display: block;}

.main .main_content .menu_list{display: flex;justify-content:space-around;align-items: center;flex-wrap: wrap;padding: 0 20px 100px;}
.main .main_content .menu_list li{width: 50%;text-align: center;margin-top: 16px;}
.main .main_content .menu_list li a{position: relative;padding: 4px 0 8px;}
.main .main_content .menu_list li a b{display: block;font-size: 16px;font-weight: 700;margin-top: 8px;}
.main .main_content .menu_list li a .badge{position: absolute;left: 50%;transform: translateX(-50%);bottom: -25px;width: 110px;padding: 0;}
.main .main_content .menu_list li a .badge:after{content: '';display: block;width: 9px;height: 6px;background: url(/static/img/mobile/icon_tail.png); background-size: 9px 6px;}
.main .main_content .menu_list li a .badge:after{position: absolute;left: 50px;margin-left: -2px;top: -6px;}

.main_banner_swiper{padding: 0 60px;margin: 0px 0 60px;width: auto;position: relative;}
.main_banner_swiper ul{display: flex;align-items: center;}
.main_banner_swiper li{position: relative;border-radius: 8px;width: 100%;height: 0;padding-bottom: 50%;transform: scale(1);overflow: hidden;}
.main_banner_swiper li div{width: 100%;transition: all cubic-bezier(0.8, 0, 0.5, 1) 0.4s;width:100%;transform: scale(0.8);border-radius: 8px;transform-origin: center bottom;border:1px solid var(--AJGrey50)}
.main_banner_swiper li div img{height: 100%;border-radius: 8px;}
.main_banner_swiper li.swiper-slide-active div{transform: scale(1.1);overflow: hidden;}
.main_banner_swiper li h1{position: absolute;left:40%;z-index: 2;color: #fff;text-align: center;display: none;}
.main_banner_swiper .swiper-pagination{top: 0px;left: 60px; border-radius: 8px;background: rgba(255,255,255,0.6);padding: 4px 12px;font-size: 12px;}
.main_banner_swiper .swiper-pagination-current{font-weight: 700;}

.layer_wrap .popLayer_main_pop{overflow: visible!important;background: transparent;}
.layer_wrap .popLayer_main_pop div.popLayer_content{padding: 0;padding-bottom: 0;margin-top: 0;background: #fff;border-radius: 16px 16px 0 0;overflow: hidden;}
.layer_wrap .popLayer_main_pop .btn_close{position: absolute;right: 8px;top: -40px;z-index: 2;}
.layer_wrap .popLayer_main_pop .btn_wrap.btn_fixed_bottom{padding: 16px 20px 32px;bottom: 70px;left:  auto;}
.layer_wrap .popLayer_main_pop div.popLayer_content .today_view{position: absolute;left: 0;bottom: 45px;width: 100%;z-index: 2}
.layer_wrap .popLayer_main_pop ul{height: 75vh;}
.layer_wrap .popLayer_main_pop ul li{padding-bottom: 160px;height: 100%;max-height: 90vh;position: static;}
.layer_wrap .popLayer_main_pop ul li .ql-snow{height: 100%}
.layer_wrap .popLayer_main_pop ul li .img_type{height: 100%;overflow-y: hidden;text-align: center;position: relative;}
.layer_wrap .popLayer_main_pop ul li .img_type img{position: absolute;left:50%;top:0;transform: translate(-50%,0)}
.layer_wrap .popLayer_main_pop ul li .title_type{height: 100%;padding: 24px 20px;overflow-y: auto;}
.layer_wrap .popLayer_main_pop ul li .title_type p{font-size: 16px;}
.layer_wrap .popLayer_main_pop ul li.twoBtn{padding-bottom: 190px}
.layer_wrap .popLayer_main_pop ul li.twoBtn .btn_wrap.btn_fixed_bottom{bottom: 70px;}
.layer_wrap .popLayer_main_pop .btn_vertical > a:first-child{margin-bottom: 8px;}
.layer_wrap .popLayer_main_pop #swiper-pagination{width: 100%;top: -20px;position: absolute;text-align: center;left:0;z-index: 1;}
.layer_wrap .popLayer_main_pop #swiper-pagination > span{background-color: var(--AJGrey50);}
.layer_wrap .popLayer_main_pop #swiper-pagination > span.swiper-pagination-bullet-active{background-color: var(--AJPurple800);}
.layer_wrap .popLayer_main_pop #swiper-pagination > span + span{margin-left: 8px;}

.error_content{text-align: center;padding-top: 20vh;}
.error_content i img{width: 150px;opacity: 0.2}
.error_content p{font-weight: bold;margin-top: 32px;font-size: 24px;}
/*============================================================== 회원 ====================================================================*/
/* 회원가입 */
.certify_number_box {position: relative;}
.certify_number_box .timer_box{margin: 16px 0;}
.certify_number_box .timer_box input{width: 100%;text-align: center;font-size: 32px;color: var(--AJDeepBule);font-weight: 600;border: 0;line-height: 48px;}
.certify_number_box .number_input{display: block;width: 335px;line-height: 36px;font-size: 32px;letter-spacing: 38px;position: absolute;left: 50%;bottom: -10px;transform: translateX(-50%);z-index: 1;opacity: 0;}
.certify_number_box .number_state{display: flex;justify-content: center;align-items: center; flex-wrap: wrap; transform: translate3d(0, 0, 0);backface-visibility: hidden;perspective: 100px;}
.certify_number_box .number_state.shake{animation: shake 0.42s cubic-bezier(.36,.07,.19,.97) both;}
.certify_number_box .number_state span{position: relative;width: 24px;height: 24px;margin-left: 24px;;background-color: var(--AJGrey50);border-radius: 16px;overflow: hidden;}
.certify_number_box .number_state span:first-child{margin-left: 0;}
.certify_number_box .number_state span:after{content: "";display:block;width:32px;height:32px;transition:all ease 0.2s;position: relative;z-index: 1;opacity: 0;}
.certify_number_box .number_state span.entered:after{background-color: var(--AJPurple800);opacity: 1;}

.popLayer_reset_password .popLayer_content_inner > ul{padding-bottom:32px}
/*============================================================== 자산조회 ====================================================================*/
/*============================================================== 자산실사 ====================================================================*/
.popLayer_camera_wrap{margin-top:50px}
.popLayer_camera_wrap  .popLayer_camera{bottom: 50px}
.popLayer_camera_wrap .bottomLayer_view h2{height: 31px}
.popLayer_camera_wrap .bottomLayer_view .popLayer_content{margin-top:30px}
.camera_view_wrap{height: calc(50svh);overflow: hidden}
.camera_view_wrap .camera_view{width:100%;height: 100%}
.camera_view_wrap.camera_view_ios{position: relative;}
.camera_view_wrap.camera_view_ios:after{content:'';display: block;width:100%;height:100%;background:#000;position:absolute;left:0;top:0;z-index: 0}
.camera_view_wrap.camera_view_ios .camera_view{position:relative;z-index: 1;width:180px;height: 180px;margin:5vh auto 0}
.qr_textarea_box{min-height: 200px;position: relative;}
.qr_textarea_box .form_reset{position: absolute;right:16px;top:16px}
.qr_textarea{border-color: var(--AJGrey500);font-size: 16px;min-height: 55px;max-height:150px; line-height: 130%;font-weight: 500}

ul.qr_list{padding: 0;width: 100%;box-sizing: border-box;border: 1px solid var(--AJGrey100);border-radius: 8px;height: 180px;overflow-y: scroll}
ul.qr_list .form_group{padding:0 16px}
ul.qr_list .form_group input.form_text{padding: 0;border: none;height: 48px;}
ul.qr_list .form_group .form_reset{right: -5px;}
ul.qr_list .form_group + .form_group{border-top: 1px solid var(--AJGrey50);}
ul.qr_list li input{color: var(--AJPurple800);transition: all ease 0.3s;transition-delay:0.2s; transform: scale(1);transform-origin: left;font-weight: normal}
ul.qr_list li:before{content: '';display: block;width:100%;height: 100%;background: var(--AJBlack);position: absolute;left:0;top:0;z-index: 0;opacity: 0; transition: all ease 0.3s;transition-delay:0.2s;}
ul.qr_list li.form_group_focus input{color: #fff;transform: scale(1.8);font-weight: bold}
ul.qr_list li.form_group_focus:before{opacity: 1;}
ul.qr_list li > input{z-index: 1;}

.qr_list_wrap{height: 200px;}
.qr_list_wrap ul.qr_list{height: auto;min-height: 50px}
.form_list_number li{display: flex;justify-content: flex-start;align-items: center}
.form_list_number li > span{text-align: left;width:30px}
.form_list_number li > .form_group{width:calc(100% - 30px)}
    /*============================================================== 고객센터 ====================================================================*/
.board_notice_list .board_list li a div strong span{width: 100%;white-space: nowrap;-webkit-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}
.board_faq_list .board_list li a div strong em{width:32px}
.board_faq_list .board_list li a div strong span{width: calc(100% - 32px);white-space: nowrap;-webkit-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}
.board_faq_list .board_list li{padding: 20px 0;}
.board_faq_list .board_list li strong span{width: 80%;}
.board_selfCheck_list .board_list li a div strong .badge_small{width:70px;}
.board_selfCheck_list .board_list li a div strong span{width: calc(100% - 70px);white-space: nowrap;-webkit-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}

.board_title{display: flex;justify-content: flex-start;align-items: flex-start;padding-top: 16px;}
.board_title b{word-break: break-all;display: block}
.board_title .badge_small{margin-top: 2px;margin-right: 8px;}
.board_title b{font-weight: 600;}
.board_content{padding: 12px 0;}
.result_title{display: block;border-bottom: 1px solid var(--AJGrey300);}
.faq_tabs{padding:0 20px;}
.faq_tabs li{width: 18%;}
.faq_tabs li + li{padding-left: 10px;}
.faq_tabs li a{display: block;border: 1px solid var(--AJGrey100);text-align: center;line-height: 32px;border-radius: 12px;font-size: 13px;color: var(--AJGrey500);}
.faq_tabs li.active a{color: var(--AJGrey50);background-color: var(--AJPurple800);border-color: var(--AJPurple800);}
/*============================================================== 마이페이지 ====================================================================*/
.mypage_main .service_list li{background:none;}
.mypage_main .service_list li + li{margin-top: 8px;}
.btn_sort span:after{content: '오래된순';display: inline-block;}
.btn_sort.sort_recent span:after{content: '최신순';display: inline-block;}
.img_swiper{padding:0 20px;overflow-x: hidden}
.img_swiper li{width: 40%;height: 0;padding-top:28%;position: relative;border-radius: 8px;overflow: hidden;background-color: var(--AJGrey50);}
.img_swiper li img{height: auto;width: 100%;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.img_swiper li + li{margin-left: 10px;}

.img_pop_swiper{padding: 0;overflow-x: hidden;height: 100%;}
.img_pop_swiper li{width: 100%;height: auto;position: relative;}
.img_pop_swiper li img{height: auto;width: 100%;}
.img_pop_swiper li.width_size{display: flex;align-items: center}

.agree_box input{opacity: 0.3;}
.agree_box input + span{color: var(--AJGrey300);}
.agree_box input:checked{opacity: 1;}
.agree_box input:checked + span{color: var(--AJPurple800);}
.agree_box .top_box{display: flex;width: 100%;padding-bottom: 16px;border-bottom: 1px solid var(--AJPurple800);}
.agree_box .top_box input{opacity: 1;}
.agree_box .top_box input + span{color: var(--AJPurple800);}
.agree_box .top_box ul{width:100%}
.agree_box ul li{margin-top: 32px;display: flex;justify-content: flex-start;align-items: center;}
.agree_box ul li label{display: flex;justify-content: flex-start;align-items: center;padding-left: 5px;width: 100%;}
.agree_box ul li label a{display: flex;justify-content: space-between;align-items: center;width: 100%;color: var(--AJGrey300);}
.agree_box ul li label input:checked + a span{color: var(--AJPurple800);}
.marketing_terms{margin-top: 40px; border:1px solid var(--AJGrey500);padding:16px;border-radius: 8px;}
.marketing_terms strong{display: block;font-size: 16px;font-weight: 500;}
.marketing_terms ul{padding-top: 8px;}
.marketing_terms ul li{padding-top: 8px;color: var(--AJGrey500);font-size: 13px;}
.policy_contents{font-size: 13px;}
.policy_contents table thead th{font-size: 12px;font-weight:400;line-height: 32px;background-color: var(--AJGrey50);border:none}
.policy_contents table td{font-size: 12px;padding: 8px 8px;border:none}
.policy_contents table tbody td{border-left: 1px solid var(--AJGrey50);border-bottom: 1px solid var(--AJGrey50);}
.policy_contents table tbody tr td:first-child{border-left: none;}

.layer_wrap .popLayer_view.pop_marketing_agree{width: 80%; max-width: 500px;}
.layer_wrap .popLayer_view.pop_marketing_agree h2{display: flex;font-size:18px;justify-content: space-between;align-items: center;padding:20px;border-bottom: 1px solid var(--AJGrey50);}
.layer_wrap .popLayer_view.pop_marketing_agree .popLayer_content ul{padding-bottom: 32px;}
.layer_wrap .popLayer_view.pop_marketing_agree .popLayer_content ul li + li{padding: 16px 0 0;}
.layer_wrap .popLayer_view.pop_marketing_agree .popLayer_content ul li b{display: block;}
.layer_wrap .popLayer_view.pop_marketing_agree .popLayer_content ul li span{display: block;}
/*============================================================== AS ====================================================================*/
.select_search_bar{display: flex;justify-content: space-between;align-items: center;}
.select_search_bar .search_bar{width: calc(70% - 16px);}
.select_search_bar .form_select{width: 30%;padding-left: 4px;}
.mypage_as_detail .profile{display: flex;justify-content: flex-start;}
.mypage_as_detail .profile .img_box{display:block; width:92px; height: 92px;margin:0;margin-right: 20px;}
.mypage_as_detail .profile .img_box.step1_1{background: url(/static/img/mobile/img_as_step1_1.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step2_1{background: url(/static/img/mobile/img_as_step2_1.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step3_1{background: url(/static/img/mobile/img_as_step3_1.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step4_1{background: url(/static/img/mobile/img_as_step4_1.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step5_1{background: url(/static/img/mobile/img_as_step5_1.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step1_2{background: url(/static/img/mobile/img_as_step2_2.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step2_2{background: url(/static/img/mobile/img_as_step3_2.png);background-size: cover;}
.mypage_as_detail .profile .img_box.step3_2{background: url(/static/img/mobile/img_as_step4_2.png);background-size: cover;}
.mypage_as_detail ul.asset_list li .list_content > .sub_title{word-break: break-all}
.layer_wrap .popLayer_view.pop_marketing_agree{width: 90%; max-width: 500px;}
.layer_wrap .popLayer_view.pop_as_info h2{display: flex;font-size:18px;height:auto;justify-content: space-between;align-items: center;padding:20px;border-bottom: 1px solid var(--AJGrey50);}
.layer_wrap .popLayer_view.pop_as_info .popLayer_content ul{padding-bottom: 32px;}
.layer_wrap .popLayer_view.pop_as_info .popLayer_content ul li + li{padding: 16px 0 0;}
.layer_wrap .popLayer_view.pop_as_info .popLayer_content ul li span{display: block;}
/*==============================================================  작은화면용 ====================================================================*/
@media all and (max-width:360px) {
    .certify_number_box .number_state span{margin-left: 16px;}
}

/*============================================================== PC버전용 ====================================================================*/
@media all and (min-width:768px) {
    .faq_tabs li{width: auto;}
    .faq_tabs li a{padding: 0 16px;}
    ..camera_view_wrap{height: calc(55vh)}
    .qr_textarea_box{min-height: 290px}
    .qr_textarea{max-height:250px;}

    .main .main_content .menu_list li{width: 25%;}
    .main_banner_swiper li div{transform: scale(0.85);}
    .main_banner_swiper li.swiper-slide-active div{transform: scale(1);}
    .main_banner_swiper{padding: 0 120px;margin: 0 0 60px;}
    .main_banner_swiper .swiper-pagination{left:140px;top:20px}
    .layer_wrap .popLayer_main_pop ul li .img_type img{width: auto;height: 100%;left:50%;top:50%;transform: translate(-50%,-50%)}
       
}