@charset "utf-8";

table,thead,tbody,tfoot,tr,th,td{border-collapse:collapse}

/* pgcm */
.pgcm{font-size:16px;font-weight:400;line-height:1.8;color:#777;font-family:var(--p-font)}
.pgcm p, .pgcm span, .pgcm ul li, .pgcm dl dd, .pgcm div{word-break:keep-all}
.pgcm .pl{white-space:pre-line;line-height:1.5}
.pgcm .tit_area{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;margin-bottom:30px}
.pgcm .tit_icon{display:flex;align-items:center;justify-content:center;width:39px;height:39px;border-radius:100%;border:1px solid var(--primary)}
.pgcm .tit_area p{padding:0 10px;font-size:30px;color:#222;text-align:center;font-family:var(--k-font)}
.pgcm .tit_area p span{color:var(--primary)}
.compart .tit_box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.compart .tit_box p{font-size:32px;font-weight:300;color:#222;text-align:center;font-family:var(--k-font)}
.compart .tit_box span{padding:5px 25px;border-radius:50px;font-size:25px;color:#fff;background:var(--primary);font-family:var(--k-font)}
.compart .icon_box{display:flex;align-items:center;justify-content:center;gap:15px;margin:50px 0 60px}
.compart .icon_box li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:23px;width:100%}
.compart .icon_box li img{width:100%;border-radius:15px}
.compart .icon_box li div b{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:100%;font-size:11px;color:#fff;background:var(--primary);line-height:1;font-family:var(--k-font)}
.compart .icon_box li div p{font-size:20px;color:#222;font-family:var(--k-font)}
.compart .icon_box li div{display:flex;align-items:center;gap:10px}
.compart .txt{display:flex;justify-content:center;gap:100px}
.compart .txt p{font-size:25px;color:#222;font-family:var(--k-font)}
.compart .txt p b{position:relative;font-weight:normal}
.compart .txt p b::before{content:"";display:block;position:absolute;left:0;bottom:0;width:100%;height:20px;z-index:-1;background:rgba(153,134,117,0.3)}
.compart .txt span{font-size:18px;line-height:1.8}

/* p33 */
#p33{position:relative}
#p33::before{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:433px;z-index:-1;background:url(/sh_page/img/p33_bg.jpg) no-repeat;background-size:cover}
#p33 .tit_area{padding-top:80px}
#p33 .tit_icon{background:var(--primary)}
#p33 .img{display:flex;align-items:center;justify-content:center;width:100%;padding:0 50px}
#p33 .img img{display:block;border-radius:20px}
#p33 .txt{width:800px;margin:50px auto 0}
#p33 .txt b{display:inline-block;margin-bottom:22px;padding:5px 25px;border-radius:50px;font-size:14px;color:#fff;text-align:center;background:var(--primary);font-family:var(--p-font)}
#p33 .txt p{padding-bottom:25px;margin-bottom:25px;border-bottom:1px solid #e1e1e1;font-size:22px;color:#222;font-family:var(--k-font)}
#p33 .txt span{font-size:18px}
#p33 .txt span strong{display:block;padding-top:45px;font-size:15px;color:#222;font-family:var(--k-font)}

/* p35 */
#p35 .txt span strong{font-weight:normal}

/* p38 */
#p38 > img{display:block;width:100%;margin:50px 0;border-radius:15px}
#p38 .txt_area p{font-size:22px;color:#222;text-align:center;font-family:var(--k-font)}
#p38 .txt_area ul{display:grid;grid-template-columns:repeat(2,1fr);row-gap:10px;column-gap:10px;margin:30px 50px}
#p38 .txt_area ul li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:25px;border-radius:10px;border:1px solid #e1e1e1;text-align:center;font-size:18px;text-align:center}
#p38 .txt_area ul li b{display:flex;align-self:center;flex-direction:column;justify-content:center;width:35px;height:35px;border-radius:100%;font-size:13px;font-weight:700;color:#fff;line-height:1;background:var(--primary);font-family:var(--k-font)}
#p38 .txt_area ul li:nth-child(2),#p38 .txt_area ul li:nth-child(3){background:#f7f7f7}


/* 반응형 [s] */
@media (max-width:1200px){
.compart .txt span{width:50%;white-space:normal}
.compart .txt p{width:40%}
.compart .tit_box span{padding:5px 25px;font-size:20px}
}
@media (max-width:1100px){
#p33 .img img{width:100%}
.compart .txt{padding-bottom:30px}
.compart .txt p{font-size:23px}
}
@media (max-width:950px){
.compart .txt{align-items:center;justify-content:center;flex-direction:column;gap:20px;text-align:center}
.compart .txt span{width:100%;white-space:pre-line}
.compart .txt p{width:100%}
.compart .icon_box{margin:40px 0 45px}
#p38 .txt_area ul{margin:20px}
#p38 > img{margin:40px 0}
}
@media (max-width:920px){
#p33 .txt{width:100%;padding:50px 50px 20px;margin:0}
#p33 .txt span{font-size:16px;white-space:normal}
}
@media (max-width:768px){
.pgcm .tit_area p{font-size:24px}
#p33 .txt{padding-top:30px;text-align:center}
#p33 .txt span strong{padding-top:25px}
#p33 .txt p{font-size:20px}
#p33 .tit_area{padding-top:50px}
.compart .icon_box{gap:10px;margin:35px 0;padding-bottom:35px;border-bottom:1px dotted #e1e1e1}
.compart .icon_box li{gap:12px}
.compart .icon_box li div{flex-direction:column;gap:5px}
.compart .icon_box li div p{font-size:16px}
.compart .icon_box li div b{width:27px;height:27px}
.compart .icon_box li img{border-radius:5px}
.compart .tit_box span{padding:5px 35px;font-size:18px}
.compart .tit_box p{padding:10px 0;line-height:1}
#p38 .txt_area ul li{font-size:16px;line-height:1.7}
#p38 > img{margin:30px 0}

}
@media (max-width:690px){
.pgcm .tit_icon{height:30px;width:30px}
.pgcm .tit_icon img{width:64%}
.pgcm .tit_area{gap:10px}
.pgcm .tit_area p{font-size:22px}
.compart .txt span{font-size:15px}
.compart .txt p{font-size:22px}
#p33::before{height:226px}
#p33 .tit_area{padding-top:30px}
#p33 .txt{padding:30px 0}
#p33 .txt span{font-size:15px}
#p33 .txt span strong{font-size:14px}
#p33 .img{padding:0 20px}
#p38 .txt_area ul{margin:20px 0}
#p38 > img{border-radius:10px}
}
@media (max-width:480px){
.pgcm .tit_area{margin-bottom:20px}
.pgcm .tit_area p{white-space:normal}
.compart .icon_box{flex-direction:column;gap:25px}
.compart .tit_box p{font-size:26px}
.compart .txt{padding-bottom:20px}
.compart .txt p b::before{display:none}
.compart .txt span{white-space:normal}
#p33 .txt p{padding-bottom:15px;margin-bottom:15px;font-size:18px}
#p33 .txt span strong{padding-top:17px}
#p37 .tit_box p{line-height:1.3}
#p38 .txt_area p{font-size:19px}
#p38 .txt_area ul{grid-template-columns:repeat(1,1fr);margin:15px 0}
#p38 .txt_area ul li{gap:10px}
#p38 .txt_area ul li b{font-size:11px}
#p38 > img{margin:25px 0}
#p35 .txt span strong{display:block}
}
@media (max-width:380px){
.pgcm .tit_area p{font-size:19px}
.compart .txt{gap:15px;padding-bottom:0}
.compart .txt p{font-size:19px}
.compart .icon_box{gap:15px;margin:27px 0;padding-bottom:30px}
#p33 .img{padding:0 10px}
#p33 .img img{border-radius:5px}
#p33 .txt{padding-bottom:0}
#p33 .txt b{margin-bottom:15px;padding:5px 20px;font-size:12px}
#p33 .txt p{font-size:17px}
#p38 .txt_area ul li{font-size:15px}

}
/* 반응형 [e] */