@charset "utf-8";

#wrap{padding-bottom: 7rem;}
#wrap.ty2{padding-bottom: 2rem;}

/* ==============================
 * header
 * ============================== */
.header{display: flex;position: fixed;left: 0;top: 0;right: 0;width: 100%;height: 4.5rem;background: #fff;border-bottom: 0.1rem solid #E6E6E6;padding: 0 1.6rem;justify-content: space-between;align-items: center;z-index: 10;}
.header .logo{width: 8rem;height: 2.5rem;background: url(../img/logo.png) no-repeat 0 0;font-size: 0;background-size: 8rem;}
.header .alarm{position: relative;width: 2rem;height: 2rem;background: url(../img/ico_alarm.png) no-repeat 0 0;font-size: 0;background-size: 2rem;}
.header .alarm span{display: block;position: absolute;top: -0.3rem;right: -0.8rem;width: 1.7rem;height: 1.7rem;background: #FF3A2E;color: #fff;font-weight: 500;font-size: 1.1rem;border-radius: 50%;text-align: center;}
.header .kakao{position: relative;width: 2rem;height: 2rem;background: url(../icon/ico_kakao.png) no-repeat 0 0;font-size: 0;background-size: 2rem;}
.header .apple{position: relative;width: 2rem;height: 2rem;background: url(../icon/ico_apple.png) no-repeat 0 0;font-size: 0;background-size: 2rem;}
.header .login{margin-left: 1rem;font-weight: 500;letter-spacing: -0.1rem;}
.header .user{margin-left: 1.5rem;font-weight: 500;letter-spacing: -0.1rem;}
.header .tit_top{display: flex;align-items: center;}
.header .tit_top .btn_prev{width: 1rem;height: 1.7rem;background: url(../img/btn_left_arrow.png) no-repeat 0 0;font-size: 0;background-size: 1rem;}
.header .tit_top h3{font-size: 1.6rem;color: #222;font-weight: 500;margin-left: 1.5rem;}
.container{padding-top: 4.5rem;}


/* ==============================
 * navbar
 * ============================== */
.navbar{display: flex;position: fixed;left: 0;right: 0;bottom: 0;width: 100%;height: 6.5rem;background: #fff;z-index: 10;}
.navbar li{width: 20%;height: 6.5rem;padding-top: 1rem;text-align: center;}
.navbar li button{width: 4rem;height: 5rem;font-size: 1.1rem;color: #333;font-weight: 500;}
.navbar li button:before{display: block;content: '';width: 2.4rem;height: 2.4rem;margin: 0 auto 0.5rem;}
.navbar li .nav1:before{background: url(../img/nav1.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .nav2:before{background: url(../img/nav2.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .nav3:before{background: url(../img/nav3.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .nav4:before{background: url(../img/nav4.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .nav5:before{background: url(../img/nav5.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li button.on{color: #0061FF;}
.navbar li .on.nav1:before{background: url(../img/nav1_on.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .on.nav2:before{background: url(../img/nav2_on.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .on.nav3:before{background: url(../img/nav3_on.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .on.nav4:before{background: url(../img/nav4_on.png) no-repeat 0 0;background-size:2.4rem;}
.navbar li .on.nav5:before{background: url(../img/nav5_on.png) no-repeat 0 0;background-size:2.4rem;}


/* ==============================
 * main
 * ============================== */
.top_banner{position: relative;width: 100%;height: 17.7rem;padding: 2.5rem 2.5rem 1.5rem;background: #F5F5F5;border-radius: 1rem;margin-top: 1.6rem;}
.top_banner:before{display: block;content: '';position: absolute;right: 0;bottom: -3rem;width: 17.9rem;height: 21.4rem;background: url(../img/main_top_banner.png) no-repeat 0 0;background-size:17.9rem;}
.top_banner p{font-size: 2.2rem;font-weight: 700;color: #000;letter-spacing: -0.02rem;}
.top_banner p.stxt{margin-top: 1rem;font-size: 1.2rem;color: #666;font-weight: 400;}
.top_banner button{width: 7.4rem;height: 2.8rem;margin-top: 1.5rem;border-radius: 1.4rem;font-size: 1.3rem;padding-bottom: 0.15rem;}
.top_banner .btn_1{background: #0061ff;color: #fff;}
.top_banner .btn_2{background: #fff;color:#0061ff;border: 0.1rem solid #0061ff;}
.company_list{display: flex;justify-content: space-between;align-items: center;}
.company_list li{width:  11rem;height: 10rem;border: 0.1rem solid #eee;border-radius: 0.6rem;text-align: center;box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .06);}
.company_list li a{display: block;width: 100%;height: 100%;}
.company_list li .img_box{width: 5.5rem;height: 5.5rem;margin: 1rem auto 0.5rem;border-radius: 50%;overflow: hidden;}
.company_list li .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.company_list li span{font-size: 1.2rem;font-weight: 350;}
.slid_banner{width: 100%;height: 19rem;padding: 1.6rem;border-radius: 0.8rem;background: #fff;box-shadow: 0 2px 6px rgba(0, 0, 0, .05);}
.slid_banner .head_area{display: flex;align-items: center;}
.slid_banner .head_area .img_box{width: 4.5rem;height: 4.5rem;border-radius: 0.6rem;overflow: hidden;}
.slid_banner .head_area .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.slid_banner .head_area p{margin-left: 2rem;font-size: 1.6rem;font-weight: 350;color: #555;}
.slid_banner .head_area p b{font-weight: 500;color: #222;}
.slid_banner .txt1{margin-top: 1.5rem;color: #222;font-weight: 500;}
.slid_banner .txt2{width: 100%;margin-top: 0.5rem;font-size: 1.2rem;font-weight: 350;color: #555;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.slid_banner .txt3{margin-top: 1.5rem;color: #1675F2;font-weight: 400;}
.slid_banner.ty2 .head_area{display: flex;justify-content: space-between;}
.slid_banner.ty2 .head_area p{margin-left: 0;font-size: 1.1rem;color: #888;}
.slid_banner.ty2 .head_area p{margin-left: 0;font-size: 1.1rem;color: #888;}
.slid_banner.ty2 .txt1{margin-top: 1rem;}
.slid_banner.ty2 .txt2{-webkit-line-clamp: 3;}
.slid_banner.ty2 .foot_area{margin: 2rem -1.6rem 0;padding: 1.2rem 1.6rem;border-top: 0.1rem solid #E2E2E2;}
.slid_banner.ty2 .foot_area p{position: relative;font-size: 1.3rem;color: #333;padding-left: 2.5rem;}
.slid_banner.ty2 .foot_area p:before{display: block;content: '';position: absolute;left: 0;top: 0.2rem;width: 1.7rem;height: 1.7rem;background: url(../img/ico_answer.png) no-repeat 0 0;background-size:1.7rem;}
.slid_banner.ty2 .foot_area em{color: #1675F2;font-weight: 500;margin-left: 0.5rem;}
.bottom_banner{margin: 2rem 0;}
.bottom_banner:after{display: block;clear: both;content: '';}
.bottom_banner li{position: relative;float: left;width: calc(50% - 0.8rem);height: 13rem;padding: 2.5rem 2rem;border-radius: 0.6rem;}
.bottom_banner li:nth-child(1){margin-right: 0.8rem;background: #FAF1D6;}
.bottom_banner li:nth-child(2){margin-left: 0.8rem;background: #FAD4AE;}
.bottom_banner li:nth-child(3){margin-top: 1.6rem;margin-right: 0.8rem;background: #D9F1F1;}
.bottom_banner li:nth-child(4){margin-top: 1.6rem;margin-left: 0.8rem;background: #B6E3E9;}
.bottom_banner li:after{display: block;content: '';position: absolute;bottom: 1.6rem;right: 1.6rem;width: 4.5rem;height: 4.5rem;}
.bottom_banner li:nth-child(1):after{background: url(../img/ico_banner1.png) no-repeat 0 0;background-size:4.5rem;}
.bottom_banner li:nth-child(2):after{background: url(../img/ico_banner2.png) no-repeat 0 0;background-size:4.5rem;}
.bottom_banner li:nth-child(3):after{background: url(../img/ico_banner3.png) no-repeat 0 0;background-size:4.5rem;}
.bottom_banner li:nth-child(4):after{background: url(../img/ico_banner4.png) no-repeat 0 0;background-size:4.5rem;width: 4.6rem;}
.bottom_banner li p{font-size: 1.6rem;color: #222;font-weight: 700;line-height: 2.2rem;}
.bottom_banner li p.stxt{font-size: 1.2rem;color: #555;font-weight: 350;margin-top: 0.6rem;}


/* ==============================
 * swiper
 * ============================== */
.swiper {width: 100%;height: 20rem;margin-top: 1rem;}
.swiper-slide {display: flex;justify-content: center;align-items: center;}
.swiper.topSwiper{margin-top: 0;}
.swiper-slide img{width: 100%;}
.swiper.mySwiper3{height: 10rem;}
.topSwiper .swiper-slide img{object-fit: scale-down;height: 100%;}


/* ==============================
 * 레이어 알람, 레이어 팝업
 * ============================== */
.layer_alarm{position: fixed;left: 1.6rem;top: 5rem;right: 1.6rem;padding: 1.5rem 1.6rem;background: rgba(0, 35, 93, 0.8);font-size: 1.4rem;font-weight: 400;color: #fff;letter-spacing: 0.1rem;border-radius: 0.6rem;z-index: 10;}
.layer_wrap{position: fixed;left: 0;top: 0;z-index: 10;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.6);}
.layer_pop{display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.layer_pop .inner{width: 30rem;padding: 2rem;background: #fff;border-radius: 0.8rem;}
.layer_pop p{margin-top: 2.5rem;text-align: center;font-size: 1.8rem;font-weight: 500;}
.layer_pop .btn_area{display: flex;padding: 0;margin-top: 4rem;}
.layer_pop .btn_area .btn{width: 50%;height: 4rem;border-radius: 0.6rem;font-size: 1.6rem;line-height: 4rem;}


/* ==============================
 * login
 * ============================== */
.login_area{position: relative;height: calc(100vh - 8rem);padding: 1.6rem;}
.login_area .logo{position: absolute;top: 35%;left: 50%;transform: translate(-50%, -50%);width: 11rem;height: 10.6rem;background: url(../img/ico_login.png) no-repeat 0 0;background-size:11rem;font-size: 0;}
.login_area .btn_area{position: absolute;left: 1.6rem;right: 1.6rem;bottom: 0;width: calc(100% - 3.2rem);}
.login_area .btn_area button{position: relative;width: 100%;height: 6rem;border-radius: 0.8rem;font-size: 2rem;}
.login_area .btn_area button + button{margin-top: 1rem;}
.login_area button:before{display: block;content: '';position: absolute;left: 2rem;top: 1.2rem;}
.login_area .btn_kakao{background: #FEE500;color: #3C1E1E;font-weight: 500;}
.login_area .btn_google{border: 0.1rem solid #1675F2;color: #000;}
.login_area .btn_apple{background: #000000;color: #fff;}
.login_area button.btn_kakao:before{width: 3.8rem;height: 3.5rem;background: url(../img/ico_kakao.png) no-repeat 0 0;background-size:3.8rem;}
.login_area button.btn_google:before{width: 3.5rem;height: 3.5rem;background: url(../img/ico_google.png) no-repeat 0 0;background-size:3.5rem;}
.login_area button.btn_apple:before{width: 3rem;height: 3.6rem;background: url(../img/ico_apple.png) no-repeat 0 0;background-size:3rem;}


/* ==============================
 * tab
 * ============================== */
ul.tabs {display: flex;width: 100%;justify-content: space-between;align-items: center;border-bottom: 0.4rem solid #EEE;border-radius: 0.2rem;}
ul.tabs li {position: relative;width: 25%;height: 4.2rem;text-align: center;}
ul.tabs li a {display: block;width: 100%;height: 4.2rem;font-size: 1.6rem;color: #222;line-height: 4.2rem;}
ul.tabs li.active:before{display: block;content: '';position: absolute;left: 0;bottom: -4px;width: 100%;height: 0.4rem;border-radius: 0.2rem;background: #0061FF;}
ul.tabs li.active a {color: #0061FF;}
ul.tabs.ty2{margin-top: 1rem;justify-content: flex-start;}
.tab_container {margin-top: 2rem;}


/* ==============================
 * input
 * ============================== */
.top_search select{display: block;width: 14rem;height: 2.8rem;padding: 0 1rem;border: 0.1rem solid #ddd;border-radius: 0.4rem;font-size: 1.2rem;color: #555;background: url(../img/select_arrow.png) no-repeat 95% center #fff;background-size: 1.1rem;box-sizing: border-box;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
textarea{width: 100%;border: 0.1rem solid #E2E2E2;font-size: 1.4rem;color: #222;border-radius: 0.4rem;padding: 1rem;}
.inp{width: 100%;height: 3.5rem;border: 0.1rem solid #E2E2E2;font-size: 1.4rem;color: #222;border-radius: 0.4rem;padding: 0 1rem;}
.cal{position: relative;width: 100%;height: 3.5rem;border: 0.1rem solid #E2E2E2;font-size: 1.4rem;color: #222;border-radius: 0.4rem;padding: 0 1rem;background: url(../img/ico_calendar.png) no-repeat 98% center;background-size: 2rem;}
.sel{width: 100%;height: 3.5rem;border: 0.1rem solid #E2E2E2;font-size: 1.4rem;color: #222;border-radius: 0.4rem;padding: 0 1rem;background: url(../img/select_arrow.png) no-repeat 97% center #fff;background-size: 1.1rem;box-sizing: border-box;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.sel_area{width: 100%;height: 3.5rem;border: 0.1rem solid #E2E2E2;font-size: 1.4rem;color: #222;border-radius: 0.4rem;padding: 0 1rem;background: url(../img/select_arrow.png) no-repeat 97% center #fff;background-size: 1.1rem;box-sizing: border-box;line-height: 3.5rem;}
input:disabled, .disabled{background: #f8f8f8;color: #aaa;}
.readonly{background: #f8f8f8;}
.inp_warning{border-color: #FF3A2E;}
.txt_warning{display: block;color: #FF3A2E;font-size: 1.3rem;margin-top: 0.5rem;}


/* ==============================
 * datepicker
 * ============================== */
.ui-widget{font-family: 'Noto Sans Korean','Helvetica Neue','Roboto','sans-serif';}
.ui-widget.ui-widget-content{border: 1px solid #1675F2 !important;}
.ui-datepicker{width: 25rem !important;}
.ui-widget-header{border: none !important;background: #1675F2 !important;color: #fff !important;font-weight:350 !important}
.ui-datepicker th{color: #00368E;}
.ui-widget select{border: none !important;border-radius: 0.3rem;padding: 0 0.5rem;background: url(../img/select_arrow.png) no-repeat 95% center #fff;background-size: 1.1rem;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{width: 40% !important;}
.ui-datepicker select.ui-datepicker-month{margin-left: 1rem !important;}
.ui-datepicker select.ui-datepicker-year{margin-right: 0.5rem !important;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{border: none !important;text-align: center;background: #E6EFFF !important;color: #222 !important;border-radius: 0.3rem;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{background: #80B2F2 !important;color: #fff !important;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{background: #1675F2 !important;color: #fff !important;}
.ui-icon-circle-triangle-w{width: 0.6rem !important;height: 1.1rem !important;background: url(../img/ico_left.png) no-repeat center center !important;background-size:0.6rem !important;}
.ui-icon-circle-triangle-e{width: 0.6rem !important;height: 1.1rem !important;background: url(../img/ico_right.png) no-repeat center center !important;background-size:0.6rem !important;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{margin-top: -5px !important;margin-left: -3px !important;}


/* ==============================
 * button 
 * ============================== */
.btn_area{position: relative;padding: 0 1.6rem;}
.btn_area .btn{width: 100%;height: 6rem;border-radius: 0.8rem;background: #1675F2;color: #fff;font-size: 2rem;text-align: center;}
.btn_area.ty2{display: flex;}
.btn_area.ty2 .btn{width: 50%;}
.btn_area .btn.ty2{background: #80B2F2;margin-right: 0.6rem;}
.btn_area .btn.ty2 + .btn{margin-left: 0.6rem;}
.btn_join{width: 13rem;height: 3.4rem;background: #FF3A2E;font-size: 1.4rem;font-weight: 500;text-align: center;color: #fff;border-radius: 1.7rem;line-height: 3.2rem;}
.btn_edit{width: 13rem;height: 3.4rem;background: #00368E;font-size: 1.4rem;font-weight: 500;text-align: center;color: #fff;border-radius: 1.7rem;line-height: 3.2rem;}
.btn_retired{width: 13rem;height: 3.4rem;background: #FFFFFF;font-size: 1.4rem;font-weight: 500;text-align: center;color: #000;border-radius: 1.7rem;line-height: 3.2rem;}
.btn_switch{position: relative;width: 8rem;height: 3.4rem;padding-right: 2rem; background: #E6EFFF;font-size: 1.4rem;font-weight: 700;color: #00368E;border-radius: 1.7rem;line-height: 3rem;text-align: right;padding-bottom: 0.3rem;}
.btn_switch:before{display: block;content: '';position: absolute;left: 0.8rem;top: 0.7rem;width: 2rem;height: 2rem;background: #00368E;border-radius: 50%;}
.btn_switch.on{background: #00368E;color: #fff;text-align: left;padding-right: 0;padding-left: 2rem;}
.btn_switch.on:before{left: 5.2rem;background: #fff;}
.setting_area li .btn{width: 12rem;height: 3.5rem;border-radius: 0.4rem;background: #1675F2;color: #fff;font-size: 1.6rem;text-align: center;padding-bottom: 0.3rem;}
.btn_small{display: inline-block;width: 7.4rem;height: 2.6rem;margin-left: 1.5rem;background: #80B2F2;font-size: 1.2rem;color: #fff;border-radius: 0.6rem;text-align: center;}


/* ==============================
 * bottom sheet
 * ============================== */
.bottom_sheet{display: none;position: fixed;left: 0;bottom: 0;right: 0;top: 0;z-index: 10;}
.bottom_sheet.on{display: block;}
.bottom_sheet .backdrop{width: 100%;height: 100%;background: rgba(0, 0, 0, 0.6);transition: all 0.2s ease-in-out;}
.bottom_sheet .bottom_area{display: flex;position: fixed;left: 0;bottom: -100%;width: 100%;min-height: 20rem;max-height: 50rem;align-items: center;border-top-left-radius: 0.8rem;border-top-right-radius: 0.8rem;background: #fff;overflow-y: auto;}
.bottom_sheet .selbox{width: 100%;}
.bottom_sheet .selbox li{width: 100%;text-align: center;font-size: 1.4rem;padding: 1rem 0;color: #222;}
.bottom_sheet .selbox li.on{font-weight: 700;color: #1675F2;}


/* ==============================
 * contents
 * ============================== */
.inner{padding: 0 1.6rem;}
.tit_h3{font-weight: 500;color: #222;}
.tit_h3.ty2{font-weight: 700;font-size: 1.5rem;margin: 3rem 0 0.5rem;}
.tit_h3 .btn_more{display: inline-block;position: relative;margin-left: 0.8rem;font-size: 1.1rem;color: #666;}
.tit_h3 .btn_more:after{display: inline-block;content: '';width: 0.5rem;height: 0.8rem;margin-left: 0.5rem;background: url(../img/btn_more.png) no-repeat 0 0;background-size:0.5rem;}
.section{border-top: 0.1rem solid #E7E7E7;background: #F5F5F5;}
.sub_top_banner{position: relative;width: 100%;height: 20rem;background: #E6EFFF;}
.sub_top_banner .txt{font-size: 2.4rem;font-weight: 700;color: #00368E;text-align: center;padding-top: 1.5rem;}
.sub_top_banner .txt em{margin-left: 0.5rem;font-weight: 700;color: #1675F2;}
.sub_top_banner .txt2{font-size: 2rem;font-weight: 700;color: #00368E;text-align: center;padding-top: 2.2rem;}
.sub_top_banner .txt2 em{margin-left: 0.5rem;font-weight: 700;color: #1675F2;}
.sub_top_banner .txt_list{position: absolute;left: 1.6rem;top: 6rem;right: 1.6rem;width: calc(100% - 3.2rem);height: 20rem;padding: 2.5rem 2rem 0;background: #1675F2;border-radius: 0.8rem;box-shadow: 0 2px 6px rgba(0, 0, 0, .25);}
.sub_top_banner .txt_list:after{display: block;content: '';position: absolute;right: 2.5rem;bottom: 0;width: 7rem;height: 17.2rem;background: url(../img/img_list.png) no-repeat 0 0;background-size: 7rem;}
.sub_top_banner .txt_list li{position: relative;padding-left: 2.5rem;font-size: 1.6rem;color: #fff;font-weight: 300;}
.sub_top_banner .txt_list li:before{display: block;content: '';position: absolute;left: 0;top: 0.5rem;width: 1.6rem;height: 1.6rem;background: url(../img/li_txtlist.png) no-repeat 0 0;background-size: 1.6rem;}
.sub_top_banner .txt_list li + li{margin-top: 0.8rem;}
.sub_top_banner .txt_list.ty2{height: 17rem;font-size: 1.6rem;color: #fff;font-weight: 300;}
.sub_top_banner .txt_list.ty2:after{right: 0.5rem;width: 10.4rem;height: 14.5rem;background: url(../img/img_list2.png) no-repeat 0 0;background-size: 10.4rem;}
.sub_top_banner .txt_list.ty2 p{width: 70%;line-height: 2.5rem;}
.sub_top_banner .img_box{width: 10rem;height: 10rem;border-radius: 50%;margin: 1.5rem auto 0;overflow: hidden;}
.sub_top_banner .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.sub_top_banner .img_box2{width: 100%;height: 20rem;overflow: hidden;}
.sub_top_banner .img_box2 img{width: 100%;}
.sub_top_banner .join_img{position: absolute;left: 1.6rem;top: 6rem;right: 1.6rem;width: calc(100% - 3.2rem);height: 17rem;background: #1675F2 url(../img/img_join.png) no-repeat center bottom;background-size: 28rem;border-radius: 0.8rem;box-shadow: 0 2px 6px rgba(0, 0, 0, .25);}
.sub_top_banner.ty2{border-radius: 0.8rem;}
.sub_top_banner.ty2 .img_box{width: 100%;height: 20rem;overflow: hidden;}
.sub_top_banner.ty2 .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.sub_top_banner.ty3{height: 15rem;padding: 1.5rem 2rem;}
.sub_top_banner1{position: relative;width: 100%;height: 15rem;padding: 2.5rem 0 0 2rem;background: linear-gradient(137deg, rgba(5,84,242,1) 50%, rgba(22,117,242,1) 100%);}
.sub_top_banner1 p{font-size: 2rem;color: #fff;}
.sub_top_banner1 p.stxt{margin-top: 1rem;font-size: 1.5rem;color: #80B2F2;font-weight: 350;}
.sub_top_banner1:after{display: block;content: '';position: absolute;bottom: 0;right: 0;width: 17.3rem;height: 12.5rem;background: url(../img/sub_top_banner1.png) no-repeat 0 0;background-size:17.3rem;}
.list_card{width: 100%;height: 19rem;padding: 1.6rem;border: 0.1rem solid #E2E2E2;border-radius: 0.8rem;background: #fff;box-shadow: 0 2px 6px rgba(0, 0, 0, .05);}
.list_card .head_area{display: flex;align-items: center;}
.list_card .head_area .img_box{width: 4.5rem;height: 4.5rem;border-radius: 0.6rem;overflow: hidden;}
.list_card .head_area .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.list_card .head_area p{margin-left: 2rem;font-size: 1.6rem;font-weight: 350;color: #555;}
.list_card .head_area p b{font-weight: 500;color: #222;font-size: 1.8rem;margin-right: 0.8rem;}
.list_card .txt1{margin-top: 1.5rem;color: #222;font-weight: 500;}
.list_card .txt2{width: 100%;margin-top: 0.5rem;font-size: 1.4rem;font-weight: 350;color: #555;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.list_card .txt3{margin-top: 1rem;color: #1675F2;font-weight: 400;}
.list_card2{width: 100%;height: 20rem;padding: 2rem;border: 0.1rem solid #E2E2E2;border-radius: 0.8rem;background: #fff;box-shadow: 0 2px 6px rgba(0, 0, 0, .05);}
.list_card2 .head_area{display: flex;height: 12rem;}
.list_card2 .head_area .txt_box{width: calc(100% - 8rem);}
.list_card2 .head_area .txt_box .txt1{font-size: 1.6rem;color: #555;}
.list_card2 .head_area .txt_box .txt1 b{font-size: 1.8rem;font-weight: 700;color: #222;margin-right: 0.5rem;}
.list_card2 .head_area .txt_box .txt2{font-size: 1.4rem;color: #555;margin-top: 1rem;}
.list_card2 .head_area .img_box{width: 8rem;height: 8rem;border-radius: 50%;margin-top: 1rem;overflow: hidden;}
.list_card2 .head_area .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.list_card2 .head_foot{display: flex;height: 5rem;border-top: 0.1rem solid #E2E2E2;margin-left: -2rem;margin-right: -2rem;padding: 0.7rem 2rem 0;justify-content: space-between;align-items: center;}
.list_card2 .head_foot .txt3{font-size: 1.4rem;font-weight: 500;color: #333;}
.list_card2 .head_foot .txt3 span{color: #1675F2;}
.alarm_area{margin-top: 1.6rem;}
.alarm_area li{width: 100%;padding: 2rem;background: #E6EFFF;border-radius: 0.6rem;}
.alarm_area li + li{margin-top: 1rem;}
.alarm_area li .tit{font-size: 1.8rem;color: #000;font-weight: 500;}
.alarm_area li .tit span{display: inline-block;width: 6rem;height: 2.4rem;margin-left: 1.5rem;border-radius: 1.2rem;background: #00368E;color: #fff;font-size: 1.2rem;font-weight: 400;vertical-align: text-bottom;text-align: center;line-height: 2.2rem;}
.alarm_area li .tit span.not_check{background: #FF3A2E;}
.alarm_area li .txt{margin-top: 2rem;font-size: 1.6rem;color: #555;font-weight: 350;word-break: break-all;}
dl.txt_list{padding-top: 2.5rem;}
dl.txt_list dt{font-size: 1.5rem;color: #222;font-weight: 700;}
dl.txt_list dd{font-size: 1.4rem;color: #555;font-weight: 400;margin-top: 0.5rem;}
dl.txt_list dd .btn_edit{width: 11rem;}
dl.txt_list dd + dt{margin-top: 2rem;}
dl.txt_list.ty2 dt{font-size: 1.5rem;color: #555;font-weight: 500;}
dl.txt_list.ty2 dd{font-size: 1.4rem;color: #222;font-weight: 700;margin-top: 0.3rem;}
.son_banner{display: flex;border: 0.1rem solid #E2E2E2;border-radius: 0.8rem;padding: 1rem 2rem 1.2rem;align-items: center;}
.son_banner .img_box{width: 6rem;height: 6rem;border-radius: 50%;overflow: hidden;}
.son_banner .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.son_banner .txt_box{width: calc(100% - 8rem);margin-left: 2rem;}
.son_banner .txt_box .txt1{font-size: 1.1rem;color: #1675F2;line-height: 1.4rem;}
.son_banner .txt_box .txt2{font-size: 1.8rem;color: #222;font-weight: 500;margin: 0.2rem 0 0.5rem;}
.son_banner .txt_box .txt3{font-size: 1.4rem;color: #555;line-height: 1.7rem;word-break: break-all;}
.son_banner2{display: block;border: 0.1rem solid #E2E2E2;border-radius: 0.8rem;padding: 1rem 2rem 1.2rem;align-items: center;}
.son_banner2 .head_area{display: flex;}
.son_banner2 .head_area .img_box{width: 5rem;height: 5rem;border-radius: 50%;overflow: hidden;}
.son_banner2 .head_area .img_box img{width: 100%;height: 100%;object-fit: cover;object-position: top;}
.son_banner2 .head_area .tit_area{width: calc(100% - 13rem);padding-left: 2rem;}
.son_banner2 .head_area .tit_area .txt1{margin-top: 0.5rem;font-size: 1.6rem;color: #222;}
.son_banner2 .head_area .tit_area .txt1 b{font-size: 1.8rem;margin-right: 0.5rem;}
.son_banner2 .head_area .tit_area .txt2{font-size: 1.1rem;color: #1675F2;}
.son_banner2 .head_area .tit_area .txt2 span{padding-left: 1rem;}
.son_banner2 .head_area .btn_cr1{width: 8rem;height: 3.4rem;background: #00235D;font-size: 1.5rem;font-weight: 400;text-align: center;color: #fff;border-radius: 1.7rem;}
.son_banner2 .txt3{margin-top: 1rem;font-size: 1.4rem;color: #555;word-break: break-all;}
.tit_box{width: 100%;height: 5rem;border-radius: 0.8rem;background: #1675F2;color: #fff;font-size: 1.8rem;font-weight: 500;padding-left: 2rem;line-height: 5rem;}
.txt_ul{display: flex;margin: 2rem 0;}
.txt_ul li{width: 50%;padding-left: 2rem;}
.txt_ul li dt{font-size: 1.4rem;color: #222;font-weight: 700;}
.txt_ul li dd{font-size: 1.3rem;color: #555;margin: 0.5rem 0 1.5rem;}
.txt_dl{width: 100%;margin: 2rem 0;background: #E6EFFF;border-radius: 0.8rem;padding: 0 2rem 2rem;}
.txt_dl dt, .txt_dl dd{display: flex;justify-content: space-between;align-items: center;}
.txt_dl dt{height: 5rem;background: #1675F2;margin-left: -2rem;margin-right: -2rem;padding: 0 3rem;line-height: 5rem;border-top-left-radius: 0.8rem;border-top-right-radius: 0.8rem;}
.txt_dl dt p{color: #fff;font-size: 1.5rem;}
.txt_dl dd{border-bottom: 0.1rem solid #fff;padding: 1rem;}
.txt_dl dd p{font-size: 1.4rem;color: #222;}
.txt_dl dd p a{color: #1675F2;font-weight: 500;}
.txt_total{font-size: 1.6rem;color: #000;font-weight: 500;}
.list_card2 + .list_card2{margin-top: 2rem;}
.txt_detail{margin-top: 2.5rem;}
.txt_detail dl{display: flex;}
.txt_detail dl dt{width: 8rem;font-size: 1.4rem;color: #222;font-weight: 500;}
.txt_detail dl dd{width: calc(100% - 8rem);font-size: 1.4rem;color: #555;}
.detail_banner{width: 10rem;height: 10rem;padding: 1rem;border: 0.1rem solid #eee;border-radius: 0.6rem;box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .06);background: #fff;}
.detail_banner a{display: block;width: 100%;height: 100%;}
.detail_banner p.txt1{font-size: 1.2rem;color: #222;font-weight: 700;}
.detail_banner p.txt2{font-size: 1.3rem;color: #555;margin: 0.4rem 0 0.3rem;line-height: 1.4;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;}
.detail_banner p.txt3{font-size: 1.2rem;color: #1675F2;}
.qna_card{width: 100%;padding: 2rem;border-radius: 0.8rem;background: #fff;border: 0.1rem solid #E2E2E2;box-shadow: 0 4px 4px rgba(0, 0, 0, .10);}
.qna_card .txt1{font-size: 1.5rem;color: #222;font-weight: 700;}
.qna_card .txt2{font-size: 1.4rem;color: #555;margin-top: 1rem;word-break: break-all;}
.qna_card .txt3{font-size: 1.3rem;color: #222;font-weight: 500;margin-top: 1rem;}
.qna_card .foot_area{display: flex;margin-top: 2.5rem;}
.qna_card .foot_area li{position: relative;font-size: 1.1rem;color: #1675F2;padding-left: 2.2rem;}
.qna_card .foot_area li:before{display: block;content: '';position: absolute;left: 0;top: 0;width: 1.8rem;height: 1.8rem;}
.qna_card .foot_area li:nth-child(1):before{background: url(../img/ico_view.png) no-repeat 0 0;background-size:1.8rem;}
.qna_card .foot_area li:nth-child(2):before{background: url(../img/ico_like.png) no-repeat 0 0;background-size:1.8rem;}
.qna_card .foot_area li:nth-child(3):before{background: url(../img/ico_comment.png) no-repeat 0 0;background-size:1.8rem;}
.qna_card .foot_area li span{font-size: 1.2rem;color: #00368E;font-weight: 500;padding-left: 0.3;}
.qna_card .foot_area li + li{margin-left: 2rem;}
.qna_card.ty2{padding: 0;margin-top: 2rem;}
.qna_card.ty2 .head_area{display: flex;align-items: center;justify-content: space-between;padding: 1.5rem 2rem 1rem;border-bottom: 0.1rem solid #e2e2e2;}
.qna_card.ty2 .head_area p{color: #222;font-weight: 500;}
.qna_card.ty2 .head_area .txt{color: #1675F2;}
.qna_card.ty2 .head_area .txt span{padding-left: 1rem;}
.qna_card.ty2 .txt_area{padding: 1.5rem 2rem 3rem;}
.my_list{margin: 2rem 0 4rem;}
.my_list dt{width: 100%;height: 6rem;border: 0.1rem solid #1675F2;border-radius: 0.8rem;line-height: 6rem;font-size: 2rem;text-align: center;font-weight: 500;color: #1675F2;}
.my_list dd{position: relative;width: 100%;height: 5rem;padding-left: 2.5rem;border: 0.1rem solid #E2E2E2;border-radius: 0.8rem;line-height: 5rem;font-size: 1.6rem;font-weight: 500;color: #222;margin-top: 1rem;}
.my_list dd:after{display: block;content: '';position: absolute;top: 1.5rem;right: 1.3rem;width: 0.7rem;height: 1.6rem;background: url(../img/btn_right.png) no-repeat 0 0;background-size:0.7rem;}
.my_list dd + dt{margin-top: 4rem;}
.notice_list{margin: 2rem 0 4rem;border-top: 0.1rem solid #E2E2E2;}
.notice_list dt{position: relative;display: flex;justify-content: space-between;align-items: center;padding: 1.5rem 4rem 1.5rem 0;border-bottom: 0.1rem solid #E2E2E2;}
.notice_list dt:after{display: block;content: '';position: absolute;top: 2.5rem;right: 0.5rem;width: 1.4rem;height: 0.7rem;background: url(../img/btn_down.png) no-repeat 0 0;background-size:1.4rem;}
.notice_list dt p{font-size: 1.6rem;font-weight: 500;color: #222;}
.notice_list dt span{font-size: 1.4rem;color: #555;}
.notice_list dd{display: none;padding: 1.5rem 2rem;border-bottom: 0.1rem solid #E2E2E2;background: #E6EFFF;font-size: 1.4rem;color: #555;word-break: break-all;}
.notice_list dt.on:after{background: url(../img/btn_up.png) no-repeat 0 0;background-size:1.4rem;}
.notice_list dd.on{display: block;}
.terms_area{width: 100%;height: calc(100vh - 10rem);padding: 2rem;border-radius: 0.8rem;background: #E6EFFF;box-shadow: 0 4px 4px rgba(0, 0, 0, .10);overflow-y: auto;}
.terms_area dl dt{font-weight: 500;color: #222;}
.terms_area dl dd{font-weight: 350;color: #555;margin-top: 0.3rem;}
.terms_area dl dd + dt{margin-top: 2rem;}
.inquiry_card{position: relative;width: 100%;padding: 2rem;border-radius: 0.8rem;background: #fff;border: 0.1rem solid #e2e2e2;box-shadow: 0 4px 4px rgba(0, 0, 0, .10);}
.inquiry_card:after{display: block;content: '';position: absolute;top: 2rem;right: 2rem;width: 0.2rem;height: 1rem;background: url(../img/ico_more.png) no-repeat 0 0;background-size:0.2rem;}
.inquiry_card a{display: block;width: 100%;height: 100%;}
.inquiry_card .txt1{color: #1675F2;font-weight: 500;}
.inquiry_card .txt2{font-size: 1.6rem;color: #222;font-weight: 700;margin-top: 0.3rem;}
.inquiry_card .txt3{color: #555;font-weight: 350;margin-top: 0.5rem;word-break: break-all;}
.inquiry_card.ty2:after{display: none;}
.inquiry_card.ty2 .step{position: absolute;right: 2rem;top: 2rem;height: 3.4rem;background: #00235D;font-size: 1.4rem;font-weight: 400;text-align: center;color: #fff;border-radius: 1.7rem;padding: 0 1.5rem;line-height: 3.2rem;}
.setting_area{height: calc(100vh - 26rem);margin-top: 3rem;}
.setting_area li{display: flex;justify-content: space-between;align-items: center;}
.setting_area li + li{margin-top: 1.5rem;}
.setting_area li:nth-child(3){margin-top: 6rem;}
.setting_area li label{font-size: 1.8rem;color: #222;font-weight: 500;}
.setting_area li .inp{width: calc(100% - 13rem);}
.join_txt{height: calc(100vh - 45rem);}
.join_txt p{font-size: 1.6rem;color: #555;}
.join_txt p + p{margin-top: 2rem;}
.imgbox{width: 12rem;height: 12rem;border: 0.1rem solid #E2E2E2;border-radius: 0.4rem;margin-right: 2rem;overflow: hidden;}
.imgbox img{width: 100%;}
.info_box{padding: 1.5rem 2rem;background: #F5F5F5;color: #555;border-radius: 0.8rem;}
.note_box{background-color: #fff3e0;padding: 15px;border: 1px solid #ffa726;margin-top: 20px;border-radius: 8px;}
.txt_cr{display: inline-block;height: 3.4rem;margin-bottom: 0.8rem;padding: 0 1.5rem;background: #00235D;font-size: 1.5rem;font-weight: 400;text-align: center;color: #fff;border-radius: 1.7rem;line-height: 3.2rem;}
.step_area{position: relative;width: 100%;margin-top: 2rem;}
.step_area:before{display: block;content: '';position: absolute;left: 1rem;top: 0.5rem;width: 0.5rem;height: 100%;background: #D9D9D9;}
.step_area li{position: relative;padding-left: 4rem;}
.step_area li:before{display: block;content: '';position: absolute;left: 0;top: 0.5rem;width: 1.5rem;height: 1.5rem;background: #fff;border: 0.5rem solid #D9D9D9;border-radius: 50%;}
.step_area li.on:before{border-color: #1675F2;}
.step_area li.cur:before{border-color: red; animation: blink 1s infinite;}
.step_area li + li{margin-top: 4.5rem;}
.step_area li .date{font-size: 2rem;color: #222;font-weight: 700;}
.step_area li .tit{font-size: 1.8rem;color: #888;font-weight: 700;}
.step_area li .date + .tit{margin-top: 1rem;}
.step_area li .txt{color: #222;margin-top: 0.5rem;}
.step_area li.on .tit{color: #1675F2;}
.step_detail{position: relative;width: 100%;padding: 6.5rem 2rem 2rem;margin-bottom: 2rem;border-radius: 0.8rem;background: #E6EFFF;box-shadow: 0 4px 4px rgba(0, 0, 0, .10);}
.step_detail dt{font-size: 1.6rem;color: #555;}
.step_detail dd{font-size: 1.4rem;color: #222;font-weight: 700;margin-top: 0.5rem;word-break: break-all;}
.step_detail dd + dt{margin-top: 1.5rem;}
.step_detail .tit{position: absolute;left: 0;top: 0;width: 100%;height: 5rem;padding: 1rem 2rem;background: #1675F2;font-size: 1.8rem;color: #fff;font-weight: 500;border-top-left-radius: 0.8rem;border-top-right-radius: 0.8rem;}
.top_search{display: flex;width: 100%;height: 5rem;padding: 0 1.6rem;margin-bottom: 1.5rem;background: #E6EFFF;border-radius: 0.6rem;justify-content: space-between;align-items: center;}
.top_search .listitem button{font-size: 1.2rem;color: #555;margin-bottom: 0.2rem;}
.top_search .listitem button.active{color: #0061FF;}
.top_search .listitem button + button{position: relative;margin-left: 1.5rem;}
.top_search .listitem button + button:before{display: block;content: '';position: absolute;left: -7px;top: 5px;width: 0.1rem;height: 1rem;background: #888;}
.top_search.ty2{margin-top: 1.6rem;}
.top_search.ty2 select{width: 10rem;}
.top_search.ty2 .search_box{position: relative;width: calc(100% - 10.5rem);}
.top_search.ty2 .search_box input{width: 100%;height: 2.8rem;padding: 0 1rem;border: 0.1rem solid #ddd;border-radius: 0.4rem;font-size: 1.2rem;color: #555;background: #fff;box-sizing: border-box;}
.top_search.ty2 .search_box button{position: absolute;right: 1rem;top: 0.7rem;width: 1.5rem;height: 1.5rem;font-size: 0;background: url(../img/ico_search.png) no-repeat 0 0;background-size:1.5rem;}
.scroll_area{height: calc(100vh - 30rem);overflow-y: auto;}
.btn_floating{position: fixed;bottom: 8rem;right: 2.5rem;}
.btn_floating .btn{width: 8rem;height: 5rem;border-radius: 0.8rem;background: #1675F2;color: #fff;font-size: 1.6rem;font-weight: 500;box-shadow: 0 4px 4px rgba(0, 0, 0, .10);}
.no_data{position: relative;width: 100%;height: 20rem;margin-top: 1rem;padding-top: 15rem;border-top: 0.1rem solid #e2e2e2;text-align: center;color: #888;}
.no_data:before{display: block;content: '';position: absolute;left: 50%;top: 7rem;width: 6rem;height: 6rem;margin-left: -3rem;background: url(../img/ico_nodata.png) no-repeat 0 0;background-size:6rem;}



/* ==============================
 * align
 * ============================== */
.top_banner + .tit_h3{margin-top: 2.5rem;}
.tit_h3 + .company_list{margin-top: 1rem;}
.inner + .section{margin-top: 3rem;}
.section .inner .tit_h3{margin-top: 2rem;}
.tab_container .top_search{margin-top: 2rem;}
.list_card + .list_card{margin-top: 1.5rem;}
dl.txt_list + .son_banner{margin-top: 2rem;}
.inner + .btn_area{margin-top: 4rem;}
.sub_top_banner.ty2 + .tit_box{margin-top: 2rem;}
.txt_total + .list_card2{margin-top: 1rem;}
.txt_detail dl + dl{margin-top: 1.5rem;}
.qna_card + .qna_card{margin-top: 2rem;}
.qna_card.ty2 + .son_banner2{margin-top: 2rem;}
.inner > .inquiry_card{margin-top: 2rem;}
.btn + .btn_join, .btn + .btn_edit{float: right;margin-top: 1rem;}
.btn + .btn_retired{float: left;margin-top: 1rem;}
dl.txt_list + .info_box{margin-top: 2rem;}
.step_area + .step_detail{margin-top: 4rem;}


@media screen and (max-width:360px){
    .company_list li{width: 10rem;}
}

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