@charset "utf-8";

#intro-lawyer { text-align: center; padding: 200px 0; } 
#intro-lawyer .intro-title { transition: all 0.7s; display: inline-block; position: relative; margin-bottom: 90px; transform: scale(0.7); font-size: 50px; font-weight: bold; opacity: 0; } 
#intro-lawyer .intro-title:after { content: ""; background: var(--page-theme-color); position: absolute; bottom: -57px; width: 50%; height: 5px; left: 50%; transform: translateX(-50%); } 
#intro-lawyer .intro-second-title { transition: all 0.7s; transition-delay: 0.8s; font-size: 19px; margin-bottom: 80px; transform: scale(0.7); opacity: 0; } 
#intro-lawyer.active .intro-title,
#intro-lawyer.active .intro-second-title { transform: scale(1); opacity:1; } 
#intro-lawyer .lawyer-wrap {display:flex; justify-content:center;}
#intro-lawyer .lawyer-wrap .list { float: left; width: 24%; overflow: hidden; margin:0 0.5%;} 
#intro-lawyer .lawyer-wrap .list .img-wrapper { overflow: hidden; position: relative; transition: all 0.5s; cursor: pointer;} 
#intro-lawyer .lawyer-wrap .list .img-wrapper:after { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 100; background: rgba(0, 0, 0, 0.3); transition: all 0.5s; opacity:0; } 
#intro-lawyer .lawyer-wrap .list .img-wrapper img { width: 100%; height:auto; object-fit: cover; transition: all 0.5s; position: relative; font-size: 20px;} 
#intro-lawyer .lawyer-wrap .list .img-wrapper:hover:after { opacity: 1; } 
#intro-lawyer .lawyer-wrap .list .img-wrapper:hover img { transform: scale(1.1); } 
#intro-lawyer .lawyer-wrap .list .name-and-role { margin: 20px 0 30px; } 
#intro-lawyer .lawyer-wrap .list .name-and-role span { display: block; } 
#intro-lawyer .lawyer-wrap .list .name-and-role .role { font-size: 17px; margin-bottom: 20px; } 
#intro-lawyer .lawyer-wrap .list .name-and-role .name { font-size: 25px; display: block; margin-bottom: 20px; font-weight: bold; } 
#intro-lawyer .lawyer-wrap .list .name-and-role .tell { margin-bottom: 10px; } 
#intro-lawyer .lawyer-wrap .list .name-and-role .email { word-break: break-all; } 
#intro-lawyer .lawyer-wrap .list .ment {white-space: pre-line;line-height: 1.6;font-size: 18px;border-top: 1px solid #f0f0f0;word-break: keep-all;} 

/* 미디어 쿼리 */
@media (max-width: 1000px) { /* 태블릿,모바일 레이아웃 변경 */
 #intro-lawyer .lawyer-wrap .list .img-wrapper:hover img { transform: scale(1); } 
 #intro-lawyer .lawyer-wrap .list .img-wrapper:after { display: none; } 
 }
@media (max-width: 768px){
 #intro-lawyer .lawyer-wrap .list .ment { font-size:15px; word-break: keep-all; } 
 #intro-lawyer .lawyer-wrap .list {width: 47%;margin: 0px 1.5% 20px !important;} 
 #intro-lawyer .lawyer-wrap .list .img-wrapper { height: 58.5937vw;}
 #intro-lawyer .lawyer-wrap .list .img-wrapper img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } 
 }
@media (max-width: 500px){
 #intro-lawyer { padding:200px 0 100px; } 
 #intro-lawyer .intro-title { font-size: 40px; } 
 #intro-lawyer .intro-second-title { font-size: 16px; } 
 #intro-lawyer .lawyer-wrap .list .name-and-role { margin-bottom:15px; } 
 #intro-lawyer .lawyer-wrap .list .name-and-role .email {
    font-size: 12px;
}
 }
 @media (max-width: 350px){
 #intro-lawyer .lawyer-wrap .list .name-and-role .email {
    font-size: 11px;
}
 }
