/* 공통 */
.form_con {max-width: 1200px; margin: 0 auto;}



/* sub010101(제주교통복지카드) */
.sub010101 {max-width: 1200px; margin: 0 auto;}
.sub010101 table .img-wrap {display: flex; justify-content: center;}
.sub010101 table .img-wrap > div.img {display: flex; flex-direction: column; justify-content: center; align-items: center;}
.sub010101 table .img-wrap > div:last-child {margin-right: 0;}
.sub010101 table .img-wrap > div.img span {margin-top: 10px;}
.sub010101 table .img-wrap > div.img img {width: 40px; height: 40px; object-fit: contain;}
.sub010101 table .img-wrap > div.arr {display: flex; align-items: center; margin: 0 20px;}
.sub010101 table .img-wrap > div.arr span {position: relative; padding: 0 10px; background: var(--main); color: #fff; border-radius: 50px;}
.sub010101 table .img-wrap > div.arr span::after {position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 15px; height: 20px; background: url(../img/layout/board_arrow_right.png) no-repeat center center / contain;}
.sub010101 .lgimg {width: 70%;}
.sub010101 .scrollbar-x table {min-width: 700px;}
.sub010101 .expand {display: none; margin: 30px auto 0;}
@media only screen and (max-width: 1023px){
    .sub010101 .lgimg {width: 90%;}
    
}
@media only screen and (max-width: 767px){
    .sub010101 .scroll-mobile {display: block;}
    .sub010101 .expand {display: block;}
    .sub010101 .lgimg {width: 100%;}
    
}
/* //sub010101(제주교통복지카드) */


/* sub020101(회원가입) */
.box {margin-top: 50px;}
.box .box {margin-top: 30px;}
.sub020101 {max-width: 1100px; margin: 0 auto;}
.list01.lg li {margin-left: 5px; font-size: 1rem; color: #444;}
.list01.lg .list02 li {color: #666;}

.sub02_step {display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 20px;} 
.sub02_step > li {position: relative; display: flex; flex-direction: column; justify-content: space-between; align-items: center; flex-shrink: 0; width: calc(20% - 16px); margin-right: 20px; padding: 25px; font-weight: 500; font-size: 1.125em; border-radius: 20px;  box-shadow: 0px 0px 9.5px 0.5px rgba(0, 0, 0, 0.08); background: #fff; overflow: hidden; text-align: center; word-break: keep-all;} 
.sub02_step.type01 > li {width: calc(16% - 16px);} 
.sub02_step.type02 > li {width: calc(25% - 16px);} 
.sub02_step.type03 > li {width: calc(33.3% - 16px);} 
.sub02_step.type04 > li:first-child {width: 40%;} 
.sub02_step.type05 > li {width: calc(50% - 10px);} 
.sub02_step.type04 > li {width: calc(29% - 16px);} 
.sub02_step > li:last-child {margin-right: 0;} 
.sub02_step > li span {font-weight: 600; font-size: 0.871rem; color: var(--main);} 
.sub02_step > li img {display: block; margin-top: 17px; width: 70px; height: 70px; object-fit: contain;} 
.sub02_step > li.lg img {width: 100%; height: 50px;} 
.sub02_step > li .list01 li {line-height: 1.3; margin-bottom: 0;} 
@media only screen and (max-width: 1200px){
    .sub02_step.type01 > li {width: calc(33.3% - 10px); margin-right: 10px; margin-bottom: 10px;} 
    .sub02_step.type01 > li:nth-child(3n) {margin-right: 0;} 
}
@media only screen and (max-width: 1023px){
    .sub02_step {justify-content: left;}
    .sub02_step > li {width: calc(33.3% - 10px); margin-right: 10px; margin-bottom: 10px;} 
    .sub02_step.type02 > li {width: calc(50% - 8px);}
    .sub02_step.type02 > li:nth-child(2n) {margin-right: 0;}
    .sub02_step.type03 > li {width: calc(33.3% - 8px);} 
    .sub02_step.type04 > li {width: calc(29% - 5px);} 
}
@media only screen and (max-width: 560px){
    .sub02_step > li {width: calc(50% - 5px); margin-right: 10px; margin-bottom: 10px;} 
    .sub02_step > li:nth-child(2n) {margin-right: 0;} 
    .sub02_step.type01 > li:nth-child(2n) {margin-right: 10px;} 
    .sub02_step > li:nth-child(3n) {margin-right: 10px;} 
    .sub02_step > li:last-child {margin-right: 0;} 
    .sub02_step.type02 > li,
    .sub02_step.type03 > li {width: 100%; margin-right: 0;}
    .sub02_step.type04 > li:first-child, 
    .sub02_step.type04 > li {width: 100%; margin-right: 0;} 
    .sub02_step.type05 > li {width: 100%; margin-right: 0;}
}
@media only screen and (max-width: 400px){
    .sub02_step.type01 > li,
    .sub02_step > li {width:100%; margin-right: 0;} 
    .sub02_step > li:nth-child(3n) {margin-right: 0;} 
    .sub02_step > li:last-child {margin-right: 0;} 
}
/* //sub020101(회원가입) */

/* sub020301(플라스틱 교통카드) */
.sub020301 .sub02_step > li.lg img {width: 100%; height: 400px;}
/* //sub020301(플라스틱 교통카드) */

/* sub020501(기본교통비지원) */
.sub02_notice > li > ul {display: flex; justify-content: space-evenly; margin-top: 10px;}
.sub02_notice > li > p > strong {display: inline-block; margin-left: 7px; padding: 4px 15px; border-radius: 50px;; font-weight: 600; color: #fff; background: var(--main);}
.sub02_notice > li.no > p > strong {background: #a31717;}
.sub02_notice > li > ul > li {position: relative; text-align: center;}
.sub02_notice > li > ul > li > img {width: unset; height: 275px; }

@media only screen and (max-width: 1199px){
    .sub020501 .sub02_notice {flex-direction: column;}
    .sub020501 .sub02_notice > li {width: 100%; margin: 0 0 10px 0;}
}
@media only screen and (max-width: 450px){
    .sub020501 .sub02_notice > li > ul {flex-direction: column;}
    .sub020501 .sub02_notice > li > ul > li {width: 100%; margin: 0 0 10px 0;}

}
/* //sub020501(기본교통비지원) */




/* sub030101(카드발급신청) */
.sub030101 .info_box .input_wrap .input_list .input {margin-bottom: 25px;}
.sub030101 .mo {display: none;}
@media only screen and (max-width: 620px){
    .sub030101 .input .table01 tbody tr td {padding-left: 165px;}
    .sub030101 .input .table01 tbody tr td::before {width: 140px;}
    .sub030101 .input .table01 tbody tr td::after {left: 150px;}
    .sub030101 .mo {display: block;}
    .table01.agree tbody tr td {padding-left: 70px;}
    .table01.agree tbody tr td::after {left: 50px;}
}

.sub030101 .sub02_step > li.lg img {width: 100%; height: 200px;}

/* //sub030101(카드발급신청) */


/* sub030102 */
.sub030102 .checkbox.mo {display: none;}
.sub030102 .table01 tbody tr td .flex {display: flex; align-items: center;}
.sub030102 .table01 tbody tr td .flex .checkbox {width: 20px; height: 20px;}
.sub030102 .table01 tbody tr td .flex .checkbox + .input {width: calc(100% - 35px);}
@media only screen and (max-width: 620px){
    .sub030102 .checkbox.mo {display: block;}

}

/* //sub030102 */

/* sub030201(카드등록) */

/* //sub030201(카드등록) */


/* sub030301(재발급신청) */
/* .sub030301 .input_style.card {display: flex;}
.sub030301 .input_style.card .card_mobile {position: relative; margin-right: 20px; padding-right: 20px;}
.sub030301 .input_style.card .card_mobile::after {content:""; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 30%; background: #ddd;}
.sub030301 .input_style.card .card_mobile {position: relative; margin-right: 20px; padding-right: 20px;}
.sub030301 .sel-input .select_box {width: 210px;}
.sub030301 .sel-input input {width: calc(100% - 215px);}
@media only screen and (max-width: 1023px){
    .sub030301 .sel-input .select_box {width: 200px;}
    .sub030301 .sel-input input {width: calc(100% - 205px);}
}

@media only screen and (max-width: 470px){
    .sub030301 .sel-input .select_box {width: 100%; margin: 0 0 5px 0;}
    .sub030301 .sel-input .select_box select {width: 100%;}
    .sub030301 .sel-input input {width: 100%;}
}
@media only screen and (max-width: 390px){
    .sub030301 .input_style.card {flex-direction: column; margin-right: 0; padding-right: 0;}
    .sub030301 .input_style.card .card_mobile::after {width: 100%; height: 1px; top: unset; bottom: 0; }

} */

.card_type_select {display: flex; justify-content: center; }
.card_type_select li {width: 30%; margin-right: 2%;}
.card_type_select li:last-child {margin-right: 0;}
.card_type_select li:hover a, 
.card_type_select li:active a, 
.card_type_select li:focus a {outline: 1px solid rbga(74, 103, 187, 0.7); box-shadow:0 0 10px 5px rgba(74, 103, 187, 0.2);} 
.card_type_select li a {display: block; text-align: center; padding: 25px; font-weight: 500; font-size: 1.125em; border-radius: 20px;  box-shadow: 0px 0px 9.5px 0.5px rgba(0, 0, 0, 0.08); background: #fff; overflow: hidden; text-align: center; word-break: keep-all;}
.card_type_select li a .img {display: block; width: 120px; height: 120px; margin: 0 auto; }
.card_type_select li a .img img {width: 100%; height: 100%; object-fit: contain;}
.card_type_select li a strong {display: block; margin-top: 20px; font-weight: 600;}
.card_type_select li a strong span {font-weight: 400;}
.popup_box .app_down li {width: calc(33.3% - 2%); font-size: 1rem;}
.popup_box .app_down li a img {width: 100%; height: auto;}
@media only screen and (max-width: 890px){
    .popup_box .app_down {flex-wrap: wrap;}
    .popup_box .app_down li {width: calc(50% - 10px); margin-right: 20px; margin-bottom: 20px;}
    .popup_box .app_down li:nth-child(2) {margin-right: 0;}
    .popup_box .app_down li:last-child {margin-bottom: 0;}
}
@media only screen and (max-width: 767px){
    .card_type_select li a {padding: 15px 8px;}
    .card_type_select li a .img {width: 80px; height: 80px;}
}
@media only screen and (max-width: 560px){
    .card_type_select {flex-wrap: wrap;}
    .card_type_select li {width: 90%; margin: 0 auto 20px auto;}
    .card_type_select li:last-child {margin: 0 auto 20px auto;}

}
/* //sub030301(재발급신청) */

/* sub030302(재발급신청) */
.sub030302 .sel-input .select_style {width: 144px;}
.sub030302 .sel-input input:nth-of-type(1) {width: 164px;}
.sub030302 .sel-input input:nth-of-type(2) {width: calc(100% - 467px);}
.sub030302 .sel-input button {width: 144px;}
@media only screen and (max-width: 890px){
    .sub030302 .sel-input input:nth-of-type(2) {width: calc(100% - 318px); margin-right: 0;}
    .sub030302 .sel-input button {width: 100%; margin-top: 5px;}
}
@media only screen and (max-width: 650px){
    .sub030302 .sel-input input:nth-of-type(1) {width: calc(100% - 149px); margin-right: 0;}
    .sub030302 .sel-input input:nth-of-type(2) {width: 100%; margin-top: 5px;}
    .sub030302 .sel-input button {width: 100%; margin-top: 5px;}
}
/* //sub030302(재발급신청) */


/* sub030401(분실신고) */
.sub030401 {max-width: 550px;}
.sub030401 .input_list {width: 100%; }

.sub030402  {max-width: 550px;}
.sub030402 .input_list {width: 100%; }
.sub030402 .table01 {text-align: center;}
/* //sub030401(분실신고) */




/* sub040101(개인정보수정) */
.info_box .input_wrap .input_list .input .tel {display: flex; flex-wrap: wrap;}
.info_box .input_wrap .input_list .input .tel input {width: calc(100% - 195px); margin-right: 5px;}
.info_box .input_wrap .input_list .input .tel button {width: 190px;}
@media only screen and (max-width: 390px) {
    .info_box .input_wrap .input_list .input .tel input {width: 100%; margin: 0 0 5px 0;}
    .info_box .input_wrap .input_list .input .tel button {width: 100%;}
}

/* 자녀등록 */
.child_regis > .btn-round01 {margin: 0 auto;}
.child_regis > .btn_group {justify-content: end;}
.child_regis .resident_input {display: flex;}
.child_regis .resident_input input {margin-right: 5px;}
.child_regis .table01 .input_style {height: 35px; line-height: 35px;}
.child_regis .table01 td.text {word-break: keep-all;}
@media only screen and (max-width: 1023px) {
    .child_regis .table01 {}
    .child_regis .resident_input {flex-wrap: wrap; justify-content: space-between;}
    .child_regis .resident_input input {width: calc(50% - 5px);}
    .child_regis .resident_input input[name="resident_back_2"] {margin-right: 0;}
    .child_regis .resident_input button {width: 100%; margin-top: 5px;}
}
@media only screen and (max-width: 390px) {
    .child_regis .resident_input input {width: 100%; margin: 0 0 5px 0;}
}
/* //sub040101(개인정보수정) */



/* sub040401(카드충전내역) */
.board_search .date {float: right;}
.board_search .date button {vertical-align: top;}
.support_amount {text-align: right;}
.support_amount .input_style {display: inline-block; width: fit-content; border-radius: 0; vertical-align: top;}
.sub040402 .btn_group {justify-content: center;}

@media only screen and (max-width: 620px) {
    .sub040301 .table01 br {display: none;}
    .sub040401 .table01 br {display: none;}
}
@media only screen and (max-width: 767px) {
    .board_search .date {width: 100%;}
    .board_search button {width: 100%;}
}
/* //sub040401(카드충전내역) */



/* sub040501(회원탈퇴) */
.border-input {background: transparent}
.sub040501 .border-box {position: relative; width: 100%; overflow: hidden;}
/* .sub040501 .border-box::after {content:""; position: absolute; bottom: -10px; right: 10px; width: 267px; height: 233px; background: url(../img/content/sub04/notice_img.png) no-repeat center center / contain;} */
.border-input .info_box {display: none; width: 100%; margin-top: 30px;}
.border-input .info_box .input_wrap {margin-top: 0; padding-top: 0; border-top: none;}
.sub040501 .input_list {width: 100%;}
.sub040501 .input_list .input {margin-bottom: 10px;}
.sub040501 .info_box.on {display: block;}
.sub040501 .refund_info {display: none; margin-top: 10px;}
.sub040501 .refund_info.on {display: block;}
.sub040501 .refund_info .info {display: flex; align-items: center; margin-top: 5px;}
.sub040501 .refund_info .info .img {margin-right: 10px; }
.sub040501 .refund_info .info .txt strong {display: block;}
.sub040501 .sel-input .select_box {width: 140px;}
.sub040501 .sel-input input {width: calc(100% - 145px);}
#content .sub040501 .con_title.margin {margin: 60px 0 0;}
.sub040501 .child_regis .mo {display: none;}

@media only screen and (max-width: 1023px) {
    .border-input {flex-direction: column;}
    .sub040501 .border-box::after {width: 200px; height: 150px;}
    .sub040501 .info_box.on {margin: 20px 0 0 0;}
    .sub040501 .info_box .input_wrap {margin-top: 30px; padding-top: 30px; border-top: 1px solid #333;}
}
@media only screen and (max-width: 870px) {
    .sub040501 .border-box::after {right: 50%; transform: translateX(50%);}
    .sub040501 .border-box .agree {padding-bottom: 150px;}
}
@media only screen and (max-width: 620px) {
    .sub040501 .child_regis .mo {display: block;}

}
/* //sub040501(회원탈퇴) */


/* sub050101(공지사항) */
.board_list {}
.board_list > {}
.board_list > li {margin-bottom: 10px;}
.board_list > li .box_style {position: relative; display: block; padding: 30px 65px 30px 35px; border: 1px solid #e5e5e5;}
.board_list > li a.box_style::after {content:""; position: absolute; top: 50%; right: 35px; transform: translateY(-50%); width: 12px; height: 20px; background: url(../img/layout/board_arrow_right.png) no-repeat center center / contain;}
.board_list > li .box_style .tit {font-weight: 600; font-size: 1.250rem; color: #333;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word;}
.board_list > li .box_style .info {display: flex; margin-top: 17px; line-height: 1; font-size: 0.938rem; color: #666;}
.board_list > li .box_style .info li {margin-right: 10px}
.board_list > li .box_style .info strong {margin-right: 4px; font-weight: 500;}
@media only screen and (max-width: 560px) {
    .board_list > li .box_style .info li:nth-child(2) {display: none;}
    .board_list > li .box_style .info li:nth-child(3) {display: none;}
    .board_list > li .box_style {padding: 15px 45px 15px 15px;}
    .board_list > li a.box_style::after {right: 18px; width: 8px; height: 16px;}
    .board_list > li .box_style .tit {font-size: 1.1rem;}
    .board_list > li .box_style .info {margin-top: 7px;}
}
@media only screen and (max-width: 390px) {
}
/* //sub050101(공지사항) */

/* sub050102(공지사항 상세) */
.board_view .title {padding: 40px; border-top: 2px solid #333; border-bottom: 1px solid #e5e5e5; text-align: center;}
.board_view .title .cate {font-weight: 600; font-size: 1.125rem; color: var(--main);}
.board_view .title > strong {display: block; margin: 10px 0; line-height: 1.2; font-weight: 700; font-size: 1.625rem; color: #333; word-break: keep-all;}
.board_view .title .info {display: flex; justify-content: center; color: #666;}
.board_view .title .info li {margin-right: 20px;}
.board_view .title .info li:last-child {margin-right: 0;}
.board_view .title .info li strong {margin-right: 9px; font-weight: 600; }
.board_view .content {padding: 40px;}
.board_view .content .img-wrap {width: 100%; text-align: center;}
.board_view .content .img-wrap img {width: 100%; display: inline-block;}
.board_view .file {padding: 30px; border-top: 1px solid #e5e5e5; border-bottom: 2px solid #333; background: #f9f9f9;}
.board_view .file ul li {margin-bottom: 8px;}
.board_view .file ul li:last-child {margin-bottom: 0;}
.board_view .file ul li a {display: block; padding-left: 35px; background: url(../img/common/file.png) no-repeat left center / contain;}
.board_view .btn-bace40 {position: relative; padding-left: 60px;}
.board_view .btn-bace40::before {content: ""; position: absolute; top: 50%; left: 30px; transform: translateY(-50%); width: 16px; height: 14px; background: url(../img/content/sub05/list.png) no-repeat center center / contain;}
@media only screen and (max-width: 470px) {
    .board_view .title {padding: 20px;}
}
/* //sub050102(공지사항 상세) */

/* sub050201(자주묻는질문) */
.faq_list {}
.faq_list > li .box_style {display: flex;}
.faq_list > li .box_style .squ {flex-shrink: 0; margin-right: 20px; width: 45px; height: 45px; line-height: 45px; font-weight: 600; font-size: 1.250rem; background: var(--main); text-align: center; color: #fff;}
.faq_list > li .box_style .con > span {display: block;}
.faq_list > li .box_style.ans .squ {background: #555;}
.faq_list > li .box_style.ans {background: #f9f9f9; border-top: none;}
.faq_list > li.on .box_style.ans {border-left: 3px solid var(--main); border-top: none;}
.faq_list > li .box_style .cate {line-height: 1; margin-bottom: 5px; font-weight: 500; color: #555;}
@media only screen and (max-width: 1023px) {
    .sub050201 .board_top {flex-direction: column; align-items: flex-start;}
    .sub050201 .board_top .count {margin-bottom: 6px;}
    .sub050201 .board_search,
    .sub050201 .board_search .select_box,
    .sub050201 .board_search .select_box .select_style,
    .sub050201 .board_search .search_box,
    .sub050201 .board_search .search_box .input_style {width: 100%;}
    .sub050201 .board_search .select_box {margin-bottom: 6px;}
}

/* //sub050201(자주묻는질문) */




/* sub050301(고객센터) */
.sub050301 .shortcut {display: flex; justify-content: space-between;}
.sub050301 .shortcut li {display: flex; align-items: center; width: 50%; margin-right: 20px; padding: 35px; box-shadow: 0px 0px 9.5px 0.5px rgba(0, 0, 0, 0.08); border-radius: 0.625rem;}
.sub050301 .shortcut li:last-child {margin-right: 0;}
.sub050301 .shortcut li img {height: 60px; margin-right: 45px;}
/* .sub050301 .shortcut li:nth-child(2) img {border-radius: 0.625rem; box-shadow: 3px 4px 10px 0px rgba(0, 174, 154, 0.36);} */
/* .sub050301 .shortcut li:last-child img {border-radius: 0.625rem; box-shadow: 3px 4px 10px 0px rgba(0, 174, 154, 0.36);} */
.sub050301 .shortcut li .con {display: flex; flex-direction: column; justify-content: space-between; height: 100%;}
.sub050301 .shortcut li .con > strong {font-weight: 700; font-size: 1.125rem; color: #333;}
.sub050301 .shortcut li .con p {margin: 3px 0; color: #666;}
.sub050301 .shortcut li .con p strong {font-weight: 600;}
.sub050301 .shortcut li .con .btn {display: block; width: fit-content; padding: 4px 18px; font-weight: 600; font-size: 0.941rem; color: #333; background: #f9f9f9; border: 1px solid #e5e5e5; }
/* .sub050301 .shortcut li:last-child .con .btn {background: #005e54;} */
@media only screen and (max-width: 1023px) {
    .sub050301 .shortcut li {padding: 20px;}
    .sub050301 .shortcut li img {height: 45px; margin-right: 30px;}
}
@media only screen and (max-width: 767px) {
    .sub050301 .shortcut li {flex-direction: column; justify-content: center; text-align: center;}
    .sub050301 .shortcut li img {margin: 0 0 10px 0;}
    .sub050301 .shortcut li .con {align-items: center;}
}
@media only screen and (max-width: 500px) {
    .sub050301 .shortcut {flex-direction: column;}
    .sub050301 .shortcut li {flex-direction: row; justify-content: flex-start; text-align: left; width: 100%; margin: 0 0 10px 0;}
    .sub050301 .shortcut li img {margin: 0 20px 0 0;}
    .sub050301 .shortcut li .con {align-items: flex-start;}
    
}

.sub050301 .adv_talk {margin-top: 60px; padding: 60px 0 40px; background: #f9f9f9; text-align: center;}
.sub050301 .adv_talk .cwrap {position: relative;}
.sub050301 .adv_talk .tit {font-size: 1.875em; color: #333;}
.sub050301 .adv_talk .tit strong {font-weight: 600;}
.sub050301 .adv_talk .subtit {margin: 20px 0 50px; font-size: 1.125em; color: #666;}
.sub050301 .adv_talk .step {position: relative; display: flex; align-items: center; justify-content: space-between;}
.sub050301 .adv_talk .step::before {content:""; position: absolute; left: -40px; bottom: 0; z-index: 2; width: 66px; height: 90px; background: url(../img/content/sub05/adv_img01.png) no-repeat center center / contain;}
.sub050301 .adv_talk .step::after {content:""; position: absolute; right: -14px; bottom: 19px; width: 20px; height: 20px; background: url(../img/content/sub05/adv_img03.png) no-repeat center center / contain;}
.sub050301 .adv_talk .step li {position: relative; width: calc(25% - 18px);padding: 35px; border-radius: 0.625em; background: #f1f1f1; border: 1px solid #e5e5e5;}
.sub050301 .adv_talk .step li::after {content:""; position: absolute; top: 50%; right: -40px; transform: translateY(-50%); z-index: 1; width: 50px; height: 50px; background: url(/img/content/sub05/adv_arr.png) no-repeat center center / contain;}
.sub050301 .adv_talk .step li:last-child::before {display: none;}
.sub050301 .adv_talk .step li:last-child::after {display: none;}
.sub050301 .adv_talk .step li img {width: 100%;}
.sub050301 .adv_talk .step li span {font-size: 0.938em; color: #555; }
.sub050301 .adv_talk .step li strong {display: block; margin: 3px 0 23px; font-size: 1.125em; color: #333; }
.sub050301 .adv_talk .time {position: relative; width: fit-content; margin: 40px auto 0 auto; padding-left: 25px; color: #333; word-break: keep-all;}
.sub050301 .adv_talk .time::before {content:""; position: absolute; top: 6px; left: 0; width: 17px; height: 15px; background: url(../img/content/sub05/adv_icon.png) no-repeat center center / contain;}


.sub050301 .adv_talk .img-wrap {position: relative;}
.sub050301 .adv_talk .img-wrap::before {content:""; position: absolute; bottom: 0; right: -50px; width: 60px; height: 85px; background: url(../img/content/sub05/adv_img02.png) no-repeat center center / contain;}
@media only screen and (max-width: 1560px) {
    .sub050301 .adv_talk .cwrap {padding: 0 50px;}
}
@media only screen and (max-width: 1199px) {
    .sub050301 .adv_talk .subtit {margin-bottom: 30px;}
    .sub050301 .adv_talk .step li {padding: 20px;}
    .sub050301 .adv_talk .step::before { width: 56px; height: 80px;}
}
@media only screen and (max-width: 1023px) {
    .sub050301 .adv_talk {padding: 40px 0;}
    .sub050301 .adv_talk .step {flex-wrap: wrap;}
    .sub050301 .adv_talk .step li {width: 49%; margin-bottom: 18px;}
    .sub050301 .adv_talk .step li:nth-child(2)::after {display: none;}
    .sub050301 .adv_talk .step li:last-child::after {display: none;}
}

@media only screen and (max-width: 767px) {
    .sub050301 .adv_talk .step li::after {right: -25px; width: 40px; height: 40px;}
    
}
@media only screen and (max-width: 560px) {
    .sub050301 .adv_talk .step li {width: 95%; margin: 10px auto;}
    .sub050301 .adv_talk .step li::after {display: none;}
    .sub050301 .adv_talk .img-wrap::before {display: none;}
    .sub050301 .adv_talk .step::after {display: none;}
}
@media only screen and (max-width: 390px) {
    .sub050301 .adv_talk .cwrap {padding: 0 30px;}
    .sub050301 .adv_talk .step li {width: 100%;}
    .sub050301 .adv_talk .step::after {display: none;}
}

.sub050301 .talk_notice {margin-top: 30px;}
/* //sub050301(고객센터) */


/* sub060101(로그인) */
.sub060101 {max-width: 460px; margin: 0 auto;} 
.sub060101 .login_input {} 
.sub060101 .login_input .input_style {width: 100%; height: 50px; margin-bottom: 10px; padding: 18px 20px; border: 1px solid #e5e5e5; border-radius: 7px;} 
.sub060101 .login_input .find_btn {display: flex; justify-content: space-between; margin-bottom: 20px;} 
.sub060101 .login_input .find_btn .find {display: flex; color: #888;}
.sub060101 .login_input .find_btn .find a {position: relative; display: block;}
.sub060101 .login_input .find_btn .find a:first-child {margin-right: 10px; padding-right: 10px;}
.sub060101 .login_input .find_btn .find a:first-child::after {content:""; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 15px; background: #888;}
.sub060101 .join_line {position: relative; width: 100%; margin: 20px 0; text-align: center; color: #787878;} 
.sub060101 .join_line::before, 
.sub060101 .join_line::after {content:""; position: absolute; top: 50%; transform: translateY(-50%); width: 33%; height: 1px; background: #e5e5e5;} 
.sub060101 .join_line::before {left: 0;} 
.sub060101 .join_line::after {right: 0;} 
.sub060101 .popup_con {max-width: 500px;}  
.sub060101 .popup_con img {display: block; width: 120px; margin: 0 auto;}  
.sub060101 .popup_con .con_box .ta-left {display: block;}  
@media only screen and (max-width: 390px) {
    .sub060101 .join_line::before, 
    .sub060101 .join_line::after {width: 27%;} 
}

/* //sub060101(로그인) */


/* sub060201(회원가입) */
.sign_step {display: flex; justify-content: space-between;}
.sign_step li {width: 15%; text-align: center;}
.sign_step li.on {display: block;}
.sign_step li .icon {position: relative; display: inline-block; width: 130px; height: 130px; border: 1px solid #e5e5e5; border-radius: 100%;}
.sign_step li .icon::after {content:""; position: absolute; top: 50%; right: -60px; transform: translateY(-50%); width: 10px; height: 16px; background: url(../img/layout/board_arrow_right.png) no-repeat center center / contain;}
.sign_step li:last-child .icon::after {display: none;}
.sign_step li.on .icon {border: 1px solid var(--main); box-shadow:  1px 1px 17.67px 1.33px rgba(79, 108, 191, 0.17);}
.sign_step li .icon img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.sign_step li span {display: block; margin: 20px 0 5px; font-weight: 300; font-size: 0.778rem; color: #555;}
.sign_step li strong {font-size: 1.125rem; color: #333;}
.sign_step li.on strong {color: var(--main);}
@media only screen and (max-width: 1199px) {
    .sign_step li .icon::after {right: -50px;}
    
}
@media only screen and (max-width: 1023px) {
    .sign_step li {width: 11%;}
    .sign_step li .icon {flex-shrink: 0; margin-right: 10px; width: 98px; height: 98px;} 
    .sign_step li .icon img {width: 40px; height: 40px; object-fit: contain;}
    
}
@media only screen and (max-width: 850px) {
    .sign_step li .icon::after {right: -40px;}
    
}
@media only screen and (max-width: 767px) {
    .sign_step {justify-content: center;}
    .sign_step li {display: none; width: unset;}
    .sign_step li.on {display: flex; align-items: center;}
    .sign_step li.on .icon {flex-shrink: 0; margin-right: 10px;} 
    .sign_step li.on span {margin-top:0;} 
    .sign_step li.on strong {font-size: 1.3rem;} 
    .sign_step li .icon::after {display: none;}
    
}

.sig_con .shortcut {display: flex; justify-content: space-between;}
.sig_con .shortcut li {position: relative; width: 49%; padding: 50px; border-radius: 0.625rem; background: url(../img/content/sub06/join_shortcut01_bg.png) no-repeat center center / cover; overflow: hidden; border: 1px solid #ffefa6}
.sig_con .shortcut li::after {content:""; position: absolute; right: 0; bottom: -20px; width: 162px; height: 140px; background: url(../img/content/sub06/join_shortcut01.png) no-repeat center center / contain;}
.sig_con .shortcut li:last-child {background: url(../img/content/sub06/join_shortcut02_bg.png) no-repeat center center / cover; border: 1px solid #d5deff}
.sig_con .shortcut li:last-child::after {bottom: -30px; width: 230px; height: 194px; background: url(../img/content/sub06/join_shortcut02.png) no-repeat center center / contain;}
.sig_con .shortcut li .tit {font-weight: 300; font-size: 1.625rem; color: #333;}
.sig_con .shortcut li strong {font-weight: 600;}
.sig_con .shortcut li .sm {margin: 20px 0; font-weight: 500; color: #666; word-break: keep-all;}

@media only screen and (max-width: 1199px) {
    .sig_con .shortcut li::after {width: 144px; height: 128px;}
    .sig_con .shortcut li:last-child::after {width: 209px; height: 171px;}
    
}
@media only screen and (max-width: 1023px) {
    .sig_con .shortcut li {padding: 35px 30px;}
    .sig_con .shortcut li::after {width: 124px; height: 95px;}
    .sig_con .shortcut li:last-child::after {width: 180px; height: 141px;}
    
}
@media only screen and (max-width: 650px) {
    .sig_con .shortcut {flex-direction: column;}
    .sig_con .shortcut li {width: 100%; margin-bottom: 10px;}
    .sig_con .shortcut li:last-child {margin-bottom: 0;}
    .sig_con .shortcut li::after {width: 140px; height: 110px;}
    .sig_con .shortcut li:last-child::after {width: 200px; height: 160px;}
    
}
@media only screen and (max-width: 470px) {
    .sig_con .shortcut li {padding: 25px}
    .sig_con .shortcut li .tit {font-size: 1.5rem;}
    .sig_con .shortcut li .sm {margin-bottom: 40px;}
    .sig_con .shortcut li::after {width: 120px; height: 90px;}
    .sig_con .shortcut li:last-child::after {width: 180px; height: 140px;}

}
@media only screen and (max-width: 390px) {
    .sig_con .shortcut li::after {width: 100px; height: 80px;}
    .sig_con .shortcut li:last-child::after {width: 160px; height: 100px;}
}
/* //step1 */

/* step2 */
.agreement .agreement_box {position: relative; margin-top: 10px; border: 1px solid #e5e5e5; border-radius: 10px; overflow: hidden; }
.agreement .agreement_box .agr_content:after {content: ""; display: block; clear: both}
.agreement .agreement_box .agr_btn {position: relative;  display: block;  padding: 18px 40px 18px 18px; background: #f9f9f9; }
.agreement .agreement_box .agr_btn:after {content:"";  position: absolute;  top: 50%;  transform: translateY(-50%) rotate(90deg);  right: 18px;  width: 20px;  height: 15px;  background: url(../img/layout/board_arrow_right.png) no-repeat center center / contain; }
.agreement .agreement_box .agr_btn.on:after {transform: rotate(0deg) translateY(-50%); }
.agreement .agreement_box .agr_btn .check {position: relative; display:inline-block}
.agreement .agreement_box .agr_btn label {font-weight: 500; font-size: 18px;color: #333;vertical-align: middle;}
.agreement .agreement_box .agr_btn label > span {color: #356edc}

.agreement .agreement_box .agr_content {display: none}
.agreement .agreement_box .agr_content .agr_cont {max-height: 350px; margin: 1px; padding: 18px;}
.agreement .agreement_box .agr_content .agr_cont .box:first-child {margin-top: 0;}
.agreement .agreement_box .agr_content.on {display: block;}
.agreement .agreement_box .agr_content > p {border: 1px solid #e7e7e7; background: #fff;;padding: 20px;}
.agreement .agreement_box .agr_content .input_check {display: flex; justify-content: end; padding: 18px;  border-top: 1px solid #e5e5e5;}
.agreement .agreement_box .agr_content .input_check div {margin-right: 10px;}


.agreement .all_yes {width: 100%;text-align: center;display: block;color: #222;background: #fff;position: relative;box-shadow: 0px 0px 9.5px 0.5px rgba(0, 0, 0, 0.2);border-radius: 7px; overflow: hidden; } 
.agreement .all_yes input[type="checkbox"] {appearance: none;-webkit-appearance: none;-moz-appearance: none;position: absolute;top:0;left:0; z-index: 0; width: 100%;height: 66px;margin:0;padding:0; cursor: pointer;}
.agreement .all_yes input[type="checkbox"]::-ms-check {display:none}
.agreement .all_yes input[type="checkbox"] + label {position: relative;width: 100%;padding: 18px;font-weight: 500;font-size: 20px;display: inline-block; cursor: pointer;}
.agreement .all_yes input[type="checkbox"] + label:before {content: ""; display: inline-block;width: 34px;height: 34px;background: url(../img/layout/check_off.png)center center no-repeat;cursor: pointer;position: relative;border-radius: 100%;margin-bottom: -9px;margin-right: 10px}
.agreement .all_yes input[type="checkbox"]:checked + label:before {background: url(../img/layout/jeju_check_on.png)center center no-repeat;}


@media only screen and (max-width:1023px) {
	.agreement .agreement_box .agr_btn strong {font-size: 19px;}
	
	.agreement .all_yes strong {font-size: 19px;}
}
@media only screen and (max-width:767px) {
	.agreement .agreement_box .agr_btn {padding: 20px 0 18px 60px}
	.agreement .agreement_box a.check_btn {left: 15px;top: 16px;}
	.agreement .agreement_box .agr_btn:after {right: 15px;top: 26px}
	.agreement .agreement_box .agr_content {padding: 0 15px}
	.agreement .agreement_box .agr_btn strong {font-size: 18px;}
	
	.agreement .all_yes strong {font-size: 18px;padding: 20px 0 20px 45px}
	.agreement div.all_yes input[type="checkbox"] + label {font-size: 18px;}
	
	.prev_next_btn {margin: 50px auto 0}
	.prev_next_btn button {padding: 15px 80px;font-size: 16px;}
}
@media only screen and (max-width:560px) {
	.agreement .agreement_box .agr_btn strong {font-size: 17px;}
	.agreement .agreement_box .agr_btn {padding: 20px 70px 20px 60px}
	
	.agreement a.all_yes strong {font-size: 17px;}
}
@media only screen and (max-width:450px) {
	.prev_next_btn {width:100%;}
	.prev_next_btn button {width: calc(100% - 51%);padding: 15px 0;text-align: center}
	.prev_next_btn button.prev_page {margin-right: 2%}
}
/* //step2 */

/* step3 */
.step3 {max-width: 550px; margin: 0 auto;}
@media only screen and (max-width: 390px) {
    .step3br  {display: none;}
    
}
/* //step3 */

/* step4 */
.input_wrap {display: flex; margin-top: 30px; padding-top: 30px; border-top: 1px solid #222;}
.input_wrap > span {flex-shrink: 0; width: 250px; font-weight: 600; font-size: 1.125rem;}
.input_list {width: calc(100% - 250px);}
.input_list .input {margin-bottom: 15px; }
.input_list .input > label {display: block; margin-bottom: 4px;}
.input_list .input .idnum {display: flex; }
.input_list .input .idnum button {min-width: 120px;}
.input_list .input .notice {width: 100%; margin-top: 5px; line-height: 1.2; font-size: 0.941rem; color: var(--main);}
.input_list .input .add {display: flex; flex-wrap: wrap;}
.input_list .input .add input.wd80 {width: calc(100% - 195px); margin-bottom: 5px;}
.input_list .input .add button {width: 190px;}
@media only screen and (max-width: 1023px) {
    .input_wrap > span {width: 150px;}
    .input_list {width: calc(100% - 150px);}
    
}
@media only screen and (max-width: 767px) {
    .input_list .input .add input.wd80 {width: 100%}
    .input_list .input .add button {width: 100%; margin-bottom: 5px;}

}
@media only screen and (max-width: 560px) {
    .input_wrap {flex-direction: column; margin-top: 20px; padding-top: 20px;}
    .input_wrap > span {margin-bottom: 15px;}
    .input_list {width: 100%;}
    .input_list .input .idnum {flex-wrap: wrap;}
    .input_list .input .idnum input {width: calc(50% - 3px);}
    .input_list .input .idnum input:last-of-type {margin-right: 0;}
    .input_list .input .idnum button {width: 100%; margin-top: 5px;}
    
}
@media only screen and (max-width: 390px) {
}
/* //step4 */

/* step5 */
.suc_con {max-width: 800px; margin: 0 auto; text-align: center; font-size: 1.2rem; }
.suc_con > img {width: 130px;}
.suc_con p {margin: 15px 0 30px; font-weight: 400; font-size: 2rem;}
.suc_con p strong {font-weight: 700; font-size: 2rem; color: var(--main);}
/* //step5 */



/* //sub060201(회원가입) */



/* sub060301(본인인증) */
.sub060301 {}
.sub060301 .tab_con_wrap {max-width: 550px;}
.certi {padding: 50px; background: #f9f9f9;  border-radius: 0.438rem;}
.certi .tit {line-height: 1.4; font-size: 1.563rem; color: #333; text-align: center; word-break: keep-all;}
.certi .tit strong {font-weight: 600;}
.certi .btn-bace10 {position: relative; margin: 20px 0;}
.certi .btn-bace10.img::before {content:""; position: absolute; top: -40px; left: -20px; width: 47px; height: 74px; background: url(../img/content/sub06/find01.png) no-repeat center center / contain;}
#tab2.certi .btn-bace10.img::before {top: -16px; left: unset; right: -20px; background: url(../img/content/sub06/find02.png) no-repeat center center / contain;}
@media only screen and (max-width: 470px) {
    .certi .tit {line-height: 1.4; font-size: 1.4rem;}
    .sub060301 .tab_con_wrap {margin-top: 20px;}
    .certi {padding: 20px;}
    
}
@media only screen and (max-width: 390px) {
    .certi .btn-bace10::before {top: -30px; width: 37px; height: 64px;}
    
}

/* //sub060301(본인인증) */



/* sub060302(아이디 찾기) */
.sub060302 {max-width: 660px; margin: 0 auto; text-align: center;}
.sub060302 img {width: 100px;}
.sub060302 .lg {font-weight: 700; font-size: 1.500em;}
.sub060302 em {display: block; line-height: 1.4; font-size: 1.313em;}
.sub060302 em strong {color: var(--main);}
/* //sub060302(아이디 찾기) */



/* sub060303(비밀번호 변경) */
.sub060303 {max-width: 660px; margin: 0 auto;}
.sub060303 .input_list {width: 100%;}
.sub060303 .lg {display: block; line-height: 1.4; font-size: 1.313em; text-align: center;}
.sub060303 .popup_box img {max-width: 100px;}

/* //sub060303(비밀번호 변경) */




/* sub070101(개인정보 처리방침) */

/* //sub070101(개인정보 처리방침) */




/* sub070201(아용약관) */
.sub07 > .box {margin-bottom: 50px; padding-bottom: 50px; border-bottom: 1px dashed #e5e5e5;}
.sub07 > .box:last-child {margin-bottom: 0; padding-bottom: 0; border-bottom: none;}
@media only screen and (max-width: 620px) {
	.table01 tbody tr td {padding-left: 140px; }
    .table01 tbody tr td::before {width: 100px; }
    .table01 tbody tr td::after {left: 120px;}
}
/* //sub070201(이용약관) */


/* landing */
.landing {display: flex; flex-direction: column; justify-content: center; gap: 20px; width: 100%; max-width: 800px; height: 100vh; margin: 0 auto; padding: 0 20px; text-align: center;}
.landing .top {}
.landing .top img {display: block; height: 250px; margin: 0 auto 20px;}
.landing .top strong {font-size: 2rem; color: var(--main);}
.landing .top p {line-height: 1.2; font-size: 2rem;}
.landing .top p:first-of-type {margin-top: 10px;}
.landing .top p:last-of-type {margin-bottom: 10px; font-weight: 600; font-size: 2.4rem;}
.landing .top span {font-size: 1.4rem;}
.landing .border-box {background-color: #fff;}
.landing .tip strong {font-size: 1.6rem;}
.landing .tip li {font-size: 1.1rem; word-break: keep-all; word-wrap: break-word;}
.landing .tip li::before {display: none;}

@media only screen and (max-width: 620px) {
	.landing {justify-content: flex-start; height: auto; padding: 30px 20px; text-align: center;}
	.landing .top img {width: 100%; height: auto;}
}
/* //landing */