@charset "utf-8";
.title_img {background-image: url(/img/page/introduce/title.jpg);}
.share {display: flex;align-items: flex-end;justify-content: space-between;padding-bottom: var(--sub_pd_half);}
.share .sh_tit {width: 40%;}
.share .sh_tit span {color:var(--color-main);font-weight: 600;font-size: 1.5rem;} 
.share .sh_tit p {font-size: 38px;padding-top: 10px;font-weight: 700;line-height: 130%;letter-spacing: -1px;}
.share .sh_deta {width: 52%;}
.share .sh_deta p {word-break:keep-all;line-height: 150%;font-size: 22px;color: #555;letter-spacing: -.5px;}
.share.line {border-bottom:1px solid #ddd;/* align-items: flex-start; */}
.policybox {background-color:#ffffff;padding: 3rem;border-radius: 1rem;border: 6px solid #ddd;}
.policybox p {
    line-height: 140%;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    word-break: keep-all;
    border-bottom: 2px dotted #eee;
}
.policybox strong {
    text-align: right;
    display: block;
    font-weight: 600;
    font-size: 1.2rem;
}
.tablebox {}
.tablebox ul {display: flex;flex-wrap: wrap;gap: 3rem 5%;}
.tablebox li {border-bottom: 1px solid #ddd;width: 30%;padding-bottom: 1rem;transition: .4s}
.tablebox li:hover .top strong {color:var(--color-main)}
.tablebox li div {display:flex;justify-content: space-between;}
.tablebox ul .top {}
.tablebox ul .top strong {font-size:20px; font-weight:500}
.tablebox ul .top button {width: 33px;height: 33px;background-color:var(--color-main);border-radius:50%;}
.tablebox ul .top span {font-size:16px;color: #fff;}
.tablebox ul .bottom {padding: 1rem 0;}


/* PC */ 
@media only screen and (min-width:1025px) and (max-width: 1500px)  {

}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .share .sh_tit {width:35%}
    .share .sh_deta {width: 60%;}
    .share .sh_tit p {font-size:2rem}
    .share .sh_tit p br {display:none}
    .tablebox li {width:47%}
    .policybox {padding:2rem}
    .policybox strong {margin-top:1rem}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .share {flex-wrap:wrap}
    .share .sh_tit {width:100%}
    .share .sh_deta {width:100%}
    .share .sh_tit p {font-size:1.8rem; margin-bottom:1rem}
    .share .sh_tit span, .share .sh_deta p {font-size:18px}
    .policybox {padding:1.5rem 1rem}
    .policybox p {padding-bottom:.5rem; margin-bottom:.5rem}
    .policybox strong {font-size:16px}
    .tablebox ul {gap: 1.5rem 0;}
    .tablebox li {width:100%}
    .tablebox ul .bottom {padding-bottom:0}
    .tablebox ul .top strong {font-size:18px}
}