@charset "utf-8";

.mctt .service{
    position:relative;
}
.ctt.pdlr {
    padding-left:20px;
    padding-right:20px;
}
.ctt.pdtb {
    padding-top:20px;
    padding-bottom:20px;
}

.main {
    padding:0px 20px;
    margin-bottom: 40px;
}
.main.scroll {
    height:100%;
}
.main .ctt:not(.title){
    padding-bottom:20px;
}
.title {
    padding:20px 0;
    font-weight:700;
}
.title.mb h2 {
    margin-bottom:5px;
}
.title h2 {
    font-size:24px;
    line-height:150%;
    font-weight:700;
    color:var(--n700)
}

.loginoption {
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.loginoption .text_link {
    text-decoration:none;
    color:var(--n500);
}

/* 서브페이지 탭 */
.page_tab {
    overflow-x:scroll;
    width:100%;
    padding:0 20px;
    border-bottom: 1px solid var(--n100);
    white-space:nowrap;
    position: sticky;
    top:35px;
    left:0;
    z-index:999;
    background:#fff;
}
.page_tab button {
    display:inline-block;
    font-size:16px;
    color:var(--n400);
    padding:15px 0;
    line-height:100%;
}
.page_tab button.on {
    font-weight:600;
    color:var(--n700);
    border-bottom:2px solid var(--n700);
    padding:15px 0 13px 0;
}
.page_tab button:not(:last-child) {
    margin-right:10px;
}


/* 로그인 */
.loginoption .checkbox_text {
    font-size:12px;
}
/* 회원가입 - 회원이 아니신가요? */
.joinYet {
    width:100%;
    height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.joinYet p {
    font-size:14px;
    color:var(--n500);
    margin-bottom:10px;
}

/* 정보확인 */
.confirm_wrap div:not(:last-child) {
    margin-bottom:20px;
}
.confirm_wrap div p {
    font-size:14px;
    color:var(--n500);
    margin-bottom:12px;
}
.confirm_wrap div strong {
    font-size:18px;
    font-weight:500;
    color:var(--n600);
    line-height:150%;
    letter-spacing:-0.5px;
}

/* 셀렉트 페이지 radio_check */
.ctt.select .radio_check li {
    margin:25px 0;
}
.ctt.select .radio_check li:first-child {
    margin-top:0;
}
.ctt.select .radio_check li:last-child {
    margin-bottom:0;
}
.ctt.select .radio_check li p {
    font-size:14px;
    color:var(--n400);
    margin-top:10px;
    display:none;
}
.ctt.select .radio_label:has(input:checked) ~ p{
    display:block;
}

/* 약관상세 */
.term_detail {
    padding-bottom:30px;
}
.term_detail * {
    font-size:14px;
    color:var(--n500);
    line-height:180%;
    word-break:keep-all;
}
.term_detail .example {
    margin-bottom:28px;
}
.term_detail p, .term_detail ul {
    margin-bottom:28px;
}
.term_detail p, .term_detail ul li{
    font-size:14px;
    color:var(--n500);
}

.term_detail h3 {
    font-size:16px;
    font-weight:600;
    color:var(--n600);
}
.term_detail h4 {
    font-size:14px;
    font-weight:600;
    color:var(--n600);
}
.term_detail .sub {
    margin-top:15px;
    font-size:12px;
    color:var(--n400);
    display: flex;
}
.term_detail .sub.mb {
    margin-bottom:15px;
}
.term_detail .sub::before {
    content:'*';
    margin-right:3px;
}

/* 약관 테이블 */
.term_detail table, .term_detail tbody {
    width:100%;
}
.term_detail table {
    border-top:2px solid var(--n200);
    border-bottom:2px solid var(--n200);
    border-collapse:collapse;
    margin-bottom:30px;
    margin-top:8px;
}
.term_detail table th, .term_detail table td {
    padding:10px;
}
.term_detail table tr:not(:last-child) {
    border-bottom:1px solid var(--n200);
}
.term_detail table th {
    font-weight:600;
    color:var(--n500);
    border-right:1px solid var(--n200);
    width:100px;
}

/* 테이블 가로 */
.term_detail table.t_row th {
    width:unset;
    text-align:left;
}
.term_detail table.t_row th:last-child {
    border:none;
}
.term_detail table.t_row td:not(:last-child) {
    border-right:1px solid var(--n200);
}

/* 테이블 내 동의항목 */
.term_detail .agree {
    margin-top:10px;
}
.term_detail .agree label:not(:last-child){
    margin-bottom:8px;
}

/* 로딩화면 */
.loading{
    height:calc(100vh - 50px);
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    text-align:center;
}
.loading h2 {
    font-size:24px;
    color:var(--n700);
    line-height:150%;
    margin-bottom:20px;
}
.loading p {
    font-size:18px;
    color:var(--p300);
    font-weight:600;
    margin-bottom:50px;
}
.loading img {
    max-width:370px;
    width:100%;
}

/* 결과화면 - 상품개수, 정렬옵션*/
.resultAndControl {
    display: flex;
    justify-content:space-between;
    margin-top:20px;
}
.resultAndControl strong {
    font-size:14px;
    color:var(--p300);
}
.resultAndControl ul {
    display:flex;
}
.resultAndControl ul input[type="radio"] {
    display:none;
}
.resultAndControl input:checked + .radio_text {
    font-weight:600;
    color:var(--n500);
}
.resultAndControl ul .radio_text {
    font-size:14px;
    color:var(--n400);
}
.resultAndControl ul li:not(:last-child) {
    margin-right:10px;
}

/* 결과화면 - 상품리스트 */
.productList .product {
    padding:25px 0;
    border-bottom:1px solid var(--n100);
    display:flex;
    flex-direction:row;
}
.productList .product:first-child {
    padding-top:0;
}
.productList .product:last-child {
    border:0;
    padding-bottom:0;
}
.productList .product a {
    width:100%;
    display:flex;
    flex-direction:row;
}
.productList .product span:has(img) {
    width:42px;
    height:42px;
    display:flex;
    flex-shrink: 0;
    justify-content:center;
    align-items:center;
    overflow:hidden;
    border-radius:999px;
    border:1px solid var(--n100);
    margin-right:12px;
}
.productList .product span:has(img) img {
    width:25px;
    height:25px;
}
.productList .product span + div {
    width:100%;
    overflow:auto;
}
.productList .product h4 {
    display:flex;
    flex-direction:column;
    font-size:16px;
    color:var(--n700);
    width:100%;
}
.productList .product:has(a h4) h4 {
    background:url(../img/ico_view.svg) no-repeat center right;
    background-size:7px;
}
.productList .product h4 span {
    font-size:14px;
    color:var(--n500);
    font-weight:400;
    margin-top:8px;
}
/* 결과화면 - 상품리스트(할부리스) 버튼 */
.productList .product > div:has(.roundLine) {
    position:relative;
    overflow:hidden;
}
.productList .product > div:has(.roundLine) .roundLine {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:0;
}

/* 결과화면 - 상품 특징 */
.productList .product .advantages {
    display: flex;
    width:100%;
    flex-direction:row;
    white-space:nowrap;
    overflow-x:scroll;
    padding-top:12px;
}
/* 결과화면 - 상품 특징, 상품상세 - 상품 특징 공통 영역 */
ul.advantages li {
    border-radius:999px;
    display:inline-block;
    background:var(--n50);
    color: var(--n500);
    padding: 3px 8px;
    font-weight: 400;
    font-size: 12px;
    margin-right: 8px;
    word-break: keep-all;
}
ul.advantages li.treatment {
    color:#B85B5B;
    background-color:#F7EBEB;
}
ul.advantages li.best {
    color:var(--p300);
    background-color:var(--p50);
}
ul.advantages li.treatment::before {
    content:'금리우대';
}
ul.advantages li.high::before {
    content:'최고한도';
}
ul.advantages li.low::before {
    content:'최저금리';
}

/* 결과화면 - 금리/한도 */
.product .info {
    padding-top:12px;
}
.product .info strong {
    font-size:16px;
    color:var(--n700);
    letter-spacing:-0.5px;
}
.product .info strong:not(:last-child) {
    margin-right:20px;
}

/* 결과화면 - 오프라인 모집인, 상품상세 공통 */
.ptnInfo {
    display:flex;
    margin-bottom:12px;
}
.ptnInfo li {
    font-size:14px;
    font-weight:400;
    color:var(--n500);
    line-height:100%;
    overflow:hidden;
    display:inline-block;
}
.ptnInfo .rate {
    font-weight:600;
    color:var(--n700);
    display:flex;
    align-items:center;
    margin-right:10px;
    padding-right:10px;
    border-right:1px solid var(--n200);
}
.ptnInfo .rate img {
    margin-right:5px;
    width:12px;
}
.ptnInfo .rate + li::after {
    content:' 모집인';
}
.ptnInfo .rate + li + li::before {
    content:'∙';
    padding:0 2px;
}

/* 결과화면 - 오프라인 모집인 - 업데이트날짜 */
.product div p {
    margin-top:10px;
    color:var(--n400);
    font-size:12px;
}
.product div p span {
    margin-left:4px;
}


/* 상품상세 */
.ctt.pdlr.productDetail {
    width:100%;
    display:flex;
    flex-direction:row;
    padding-bottom:35px;
}
.productDetail span:has(img) {
    width:38px;
    height:38px;
    display:flex;
    flex-shrink: 0;
    justify-content:center;
    align-items:center;
    overflow:hidden;
    border-radius:999px;
    border:1px solid var(--n100);
    margin-right:12px;
}
.productDetail span:has(img) img {
    width:18px;
    height:18px;
}

/* 상품상세 - 상품 특징 */
.productDetail .advantages {
    display: flex;
    width:100%;
    flex-direction:row;
    flex-wrap: wrap;
    padding-top:4px;
}
.productDetail .advantages li {
    margin-top:8px;
}

/* 상품상세 - 금리/한도 */
.productDetail .info {
    padding-top:17px;
    display: flex;
}
.productDetail .info strong {
    font-size:20px;
    color:var(--n700);
    display:flex;
    flex-direction:column;
    letter-spacing:-0.5px;
}
.productDetail .info strong::before{
    font-size:14px;
    font-weight:400;
    color:var(--n500);
    margin-bottom:7px;
    letter-spacing:normal;
}
.productDetail .info strong:nth-child(1)::before {
    content:'최저금리';
}
.productDetail .info strong:nth-child(2)::before {
    content:'최대한도';
}
.productDetail .info strong:not(:last-child) {
    margin-right:25px;
}


/* 상품상세 - 금리우대 정보 */
.treatmentInfo {
    padding-top:20px;
}
.treatmentInfo ol {
    counter-reset: part;
    list-style-type: none;
}
.treatmentInfo li {
    display:flex;
    font-size:16px;
    font-weight:400;
    color:var(--n500);
    align-items:center;
    margin-bottom:20px;
}
.treatmentInfo ol li::before {
    list-style-type:upper-alpha;
    counter-increment: part;
    content: counter(part,upper-alpha) ".";
    margin-right:5px;
}
.treatmentInfo ol li div {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
}
.treatmentInfo .checkbox_icon::before {
    margin-right:0px;
}
.treatmentInfo input[type="checkbox"]:not(:checked) + span + span {
    color:var(--n400);
}
.treatmentInfo .checkbox_text {
    font-weight:700;
    color:var(--n600);
    width:48px;
    text-align:right;
}
.treatmentInfo > div {
    font-size:16px;
    color:var(--n700);
    font-weight:700;
    display:flex;
    justify-content:space-between;
}
.treatmentInfo > div strong span::before{
    content:'(';
}
.treatmentInfo > div strong span::after{
    content:')';
}

/* 상품상세 - 상품안내, 모집인정보 공통 */
.productInfo {
    padding-top:20px;
}
.productInfo > strong {
    font-size:14px;
    font-weight:600;
    color:var(--n600);
    display:block;
    line-height:160%;
    margin-bottom:6px;
}
.productInfo > ul:not(:last-child),
.productInfo > p:not(:last-child){
    margin-bottom:25px;
}
.productInfo > ul li,
.productInfo > p {
    font-size:14px;
    color:var(--n500);
    line-height:160%;
    font-weight:400;
    word-break: keep-all;
}
.productInfo > ul li::before{
    content: '∙ ';
}
.productInfo > ul li:not(:last-child) {
    margin-bottom:6px;
}


/* 검색 */
.search .typearea button {
    text-indent:-9999px;
    width:20px;
    height:20px;
}
.search  .search_blue {
    background:url(../img/ico_search_blue.svg) no-repeat center;

}
.search .search_clear {
    background:url(../img/ico_remove.svg) no-repeat center;
    margin-right:5px;
}
.search .typearea {
    width:100%;
    border:1.5px solid var(--p300);
    border-radius:8px;
    padding:16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.search .typearea input {
    font-size:16px;
    color:var(--n700);
    width:80%;
    font-weight:500;
    line-height: 100%;
}
.search .typearea input:focus{
    outline:none;
}
.search .typearea input::placeholder {
    color:var(--n400);
    font-size:16px;
    font-weight:500;
}
.search .typearea ~ div {
    margin-top:25px;
}
.search .typearea ~ div h4 {
    font-size:14px;
    color:var(--n600);
    margin-bottom:12px;
    font-weight:800;
    line-height:100%;
}

.search .section div:has(a.adbnr) {
    display: flex;
    flex-wrap: wrap;
    gap:10px;
}

.search .section a.adbnr strong.m {
    display:none;
}

/* 광고배너 - 이미지 */
.search .section a.adbnr {
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0px;
    overflow:hidden;
}

.search .section a.adbnr img {
    position: unset;
    max-width:420px;
    width: 100%;
}

.search .section div:has(a.article){
    display:flex;
    flex-direction:column;
    gap:10px;
}
.search a.article {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    align-items:center;
    gap:16px;
}
.search a.article .txt {
    width:100%;
}
.search a.article .txt strong {
    color:var(--n700);
    font-size:16px;
    margin-bottom:5px;
    display:inline-block;
}
.search a.article .txt p {
    color:var(--n500);
    font-size:14px;
}
.search a.article img.thumb {
    height:83px;
    border-radius:5px;
}


/* 마이페이지 */
.adbnr + .sgroup {
    margin-top:30px;
}
.main .ctt:not(.title).sgroup {
    padding-bottom:25px;
}
.sgroup h4 {
    font-size:14px;
    color:var(--p300);
    margin-bottom:10px;
}
.sgroup ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.sgroup ul li {
    flex: 1 1 50%;
    vertical-align:middle;
    padding:8px 0;
}
.sgroup ul li a{
    color:var(--n500);
    font-size:16px;
    display: block;
}
.sgroup ul li.on {
    display:none;
}
@media screen and (max-width:540px) {
    .sgroup ul li.on{
        display:block;
    }
}

/* 서비스 신청내역 */
.page_tab.lone_history button, .lone_history button.on {
    padding-top:0;
}
.page_tab.lone_history {
    margin-bottom:25px;
    top:50px;
}
.productList .log {
    display:flex;
    flex-direction:column;
}
.productList .log > div {
    display:flex;
    flex-direction:row;
}
.productList .log .history_date{
    display:flex;
    justify-content:space-between;
    color:var(--n400);
    margin-bottom:7px;
    font-size:12px;
}
.productList .log strong.amount {
    font-size:14px;
    color:var(--p300);
    font-weight:600;
    margin-top:7px;
    display:block;
}
.productList .log span+div {
    overflow: visible;
}
.productList .log > button {
    margin-top:20px;
    width:100%;
}
.productList .progress {
    display:flex;
    align-items: center;
}
.productList .progress::before {
    content:'진행중';
    font-size:12px;
    padding:6px 8px;
    border-radius:999px;
    background-color:var(--p50);
    color:var(--p300);
    font-weight:500;
    margin-right:8px;
}
.productList .progress li {
    font-weight:400;
    color:var(--n400);
    font-size:14px;
    margin-right:8px;
}
.productList .progress li.on,
.productList .complete {
    font-weight:600;
    color:var(--n600);
    font-size:14px;
}
.productList .progress,
.productList .complete {
    margin-top:10px;
}

/* 모집인 별점평가 */
.star_rate{
    height:calc(100vh - 50px);
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    text-align:center;
}
.star_rate h2 {
    font-size:24px;
    color:var(--n700);
    line-height:140%;
    margin-bottom:9px;
}
.star_rate p {
    font-size:16px;
    color:var(--n500);
    font-weight:400;
    margin-bottom:10px;
    line-height:150%;
}
.star_rating {
    display: flex;
}

.star_score {
    appearance: none;
    padding: 1px;
}

.star_score::after {
    content:'';
    background:url(../img/ico_star_rate_gray.svg) no-repeat center;
    width:35px;
    height:35px;
    display:block;
    cursor: pointer;
}

.star_score:hover::after,
.star_score:has(~ .star_score:hover)::after,
.star_score:checked::after,
.star_score:has(~ .star_score:checked)::after {
    content:'';
    background:url(../img/ico_star_rate.svg) no-repeat center;
  }

.star_score:hover ~ .star_score::after {
    content:'';
    background:url(../img/ico_star_rate_gray.svg) no-repeat center;
}

.star_rate .button_wrap {
    padding-top:25px;
}

.star_rate .button_wrap p {
    font-size:14px;
    color:var(--n400);
    margin-bottom:15px;
}
@media screen and (max-width:540px) {
    .star_rate{
        height:calc(100vh - 150px);
    }
}
