@charset "utf-8";

.talent_txt {
    text-align: center;
    background-image: url(/img/page/mission/quotes.svg);
    background-repeat: no-repeat;
    background-position: center top;
}
.talent_txt p {padding-top:3rem;font-size: 20px;line-height: 1.6;}
.talent_txt p span {color:var(--color-main); font-weight:500}
.talent_sec1 {display: flex;align-items: center;border-bottom: 1px solid #ddd;justify-content: center;}
.talent_sec1 .img {width:40%;text-align: center;}
.talent_sec1 img {}
.dialog {
    padding: 2rem 3rem;
    background-color: #FEF5E7;
    border-radius: 1rem;
    position: relative;
    width: 42%;
    font-size: 18px;
}
.dialog:before {content:"";position:absolute;background-image: url(/img/page/talent/triangle.png);width:35px;height:33px;right: 0;top:0;margin-right: -30px;margin-top: 20px;transform: rotate(-180deg);}
.dialog p {   }
.talent_sec2 {}
.talent_sec2 dl {
    display: flex;
    align-items: center;
}
.talent_sec2 dt {
    width: 50%;
    text-align: center;
}
.talent_sec2 dd {
    width: 50%;
}
.talent_sec2 dd ul {}
.talent_sec2 dd li {
    padding: 1.5rem 0;
}
.talent_sec2 dd li h5 {font-size: 24px;margin-bottom: 1rem;}
.talent_sec2 dd li h5 span {font-size: 16px;letter-spacing:0;display: block;color: var(--color-main);margin-bottom: 5px;font-weight: 400;}

/* PC */ 
@media only screen and (min-width:1280px) and (max-width: 1600px)  {

}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .talent_sec1 {justify-content: space-between;margin-top: 3%;border-bottom: unset;}
    .dialog {width:70%; padding:1.5rem}
    .dialog p {font-size: clamp(.9rem, 5vw, 1rem);}
    .talent_sec1 .img {width: 28%;}
    .talent_sec1 img {width:100%}
    .talent_sec2 dl {flex-wrap:wrap}
    .talent_sec2 dt {width: 55%;text-align: center;}
    .talent_sec2 dt img {width:100%}
    .talent_sec2 dd {width:45%}
    .talent_sec2 dd li {padding:1rem}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .talent_sec1 {flex-wrap: wrap;position: relative;border-bottom: 1px solid #ddd;}
    .dialog {width:100%;}
    .dialog p {font-size: clamp(.9rem, 4vw, 1rem);}
    .dialog p br {display:none}
    .talent_sec1 .img {width: 100%;text-align: right;margin-top: -10%;z-index: 1;}
    .talent_sec1 img {width:40%}
    .talent_sec2 dt {width: 100%;text-align: center;}
    .talent_sec2 dd {width:100%;margin-top: 1rem;}
    .talent_sec2 dd li {padding:1rem;padding: .5rem 0;}
	.talent_sec2 dd li h5 {font-size: clamp(1rem, 5vw, 1.2rem);}
	.talent_sec2 dd li h5 span {font-size: clamp(.9rem, 4vw, 1rem);}
}