/*** 공통 ***/
.professor .profile_wrap {background:var(--base1);}
.professor .profile_wrap .w1400 {display:flex; gap:100px; padding:50px 0;}
.professor .profile_wrap .photo_bx {width:340px; position:relative;}
.professor .profile_wrap .frame {position:absolute; border:20px solid #f0f0f0; box-shadow: 10px 10px 10px 0 rgba(0, 0, 0, 0.20); border-radius:20px; background:#f0f0f0;}
.professor .profile_wrap .photo_bx img {width:100%; border-radius:20px;}
.professor .profile_wrap .info_bx {width:calc(100% - 440px); color:#fff;}
.professor .profile_wrap .info_bx p.name {font-size:36px; font-weight:600;}
.professor .profile_wrap .info_bx .current {display:flex; margin-top:10px; font-size:24px; font-weight:600; gap:45px;}
.professor .profile_wrap .info_bx .current dt {position:relative;}
.professor .profile_wrap .info_bx .current dt:after {content:""; display:block; width:2px; height:20px; background:#fff; position:absolute;  right:-23px; top:9px;}
.professor .profile_wrap .info_bx .career {margin-top:30px;}
.professor .profile_wrap .info_bx .career .sub-tit {display:inline-block; font-size:16px;font-weight:600; background:#fff; color:var(--base1); padding:2px 15px; border-radius:2rem;}
.professor .profile_wrap .info_bx .career .grid-st li {display:grid; gap:20px; }
.professor .profile_wrap .info_bx .career.research .grid-st li {grid-template-columns:170px auto;}
.professor .profile_wrap .info_bx .career.field .grid-st li {grid-template-columns:120px auto;}
.professor .profile_wrap .info_bx .career .grid-st li .during {display:inline-block; position:relative; }
.professor .profile_wrap .info_bx .career .grid-st li .during.t-center {text-align:center;}
.professor .profile_wrap .info_bx .career .grid-st li .during:after {content:""; display:block; width:2px; height:15px; background:#fff; position:absolute; right:0; top:5px;}
.professor .profile_wrap .info_bx .career .sub-tit+ul {margin-top:10px;}
.professor .profile_wrap .info_bx .career li+li {margin-top:5px;}

.professor .profile_wrap .info_bx .contact {margin-top:30px;}
.professor .profile_wrap .info_bx .contact li {display:flex; gap:20px; align-items:flex-start;}
.professor .profile_wrap .info_bx .contact li+li {margin-top:10px;}
.professor .profile_wrap .info_bx .contact li img {transform:translateY(3px);}
.professor .profile_wrap .info_bx .contact li.mail img {transform:translateY(7px);}

.professor .grid_wrap {display:grid; gap:100px; grid-template-columns:1fr 1fr;}
.professor .grid_wrap.w1400 {margin:80px auto 0!important;}
.professor .detail_infowrap h4 {position:relative; width:100%; font-size:30px; font-weight:700; color:#000; margin-bottom:30px;}
.professor .detail_infowrap h4 span {display:inline-block; background:#fff; position:relative; z-index:2; padding-right:30px;}
.professor .detail_infowrap h4:before {content:""; display:block; width:100%; height:2px; background:var(--base1); position:absolute; top:50%; transform:translateY(-50%);}
.professor .info-subwrap h5 {position:relative; padding-left:25px; color:#000; font-size:24px;}
.professor .info-subwrap h5+.list-st, .professor .detail_infowrap h5+ol {margin-top:20px;}
.professor .info-subwrap h5:before {content:""; display:block; width:10px; height:10px; background:var(--base1); position:absolute; top:6px; left:0;}
.professor .detail_infowrap .info-subwrap {margin-top:50px;}
.professor .detail_infowrap .list-st li {position:relative; padding-left:15px; color:#000;}
.professor .detail_infowrap .list-st li:before {content:""; display:block; width:5px; height:5px; background:#ccc; border-radius:50%; position:absolute; top:10px; left:0;}
.professor .detail_infowrap .list-st li+li {margin-top:10px;}
.professor .detail_infowrap .table-st dl {display:flex; align-items:center; color:#000; padding:20px 0; border-top:1px solid #e5e5e5;}
.professor .detail_infowrap .table-st dl:last-child {border-bottom:1px solid #e5e5e5;}
.professor .detail_infowrap .table-st dl dt {font-weight:600; width:200px; text-align:center;}
.professor .detail_infowrap .table-st dl dd {position:relative; width:calc(100% - 200px); padding-left:50px; box-sizing:border-box;}
.professor .detail_infowrap .table-st dl dd:before {content:""; display:block; width:2px; height:17px; background:#d9d9d9; position:absolute; top:50%; left:0; transform:translateY(-50%);}
.professor .grid_wrap .grid-left {display:flex; flex-direction:column; justify-content:space-between; gap:50px;}
.professor .detail_infowrap ol.num-list li {position:relative; color:#000; padding-left:30px;}
.professor .detail_infowrap ol.num-list li span {display:inline-block; width:20px; text-align:center; position:absolute; left:0; top:0; }
.professor .detail_infowrap ol.num-list li+li {margin-top:10px;}

/* ************************ 태블릿 이하(~1249) ************************ */
@media screen and (max-width: 1249px) { 
.professor .profile_wrap .w1400 {padding:50px 30px; gap:60px;}
.professor .profile_wrap .info_bx p.name {font-size:30px;}
.professor .profile_wrap .info_bx .current {margin-top:20px;}
.professor .grid_wrap.w1400 {margin:50px auto 0!important; padding:0 30px; gap:60px;}
.professor .detail_infowrap.w1400 {padding:0 30px;}
.professor .detail_infowrap h4 {font-size:26px;}
.professor .info-subwrap h5 {font-size:20px;}
.professor .info-subwrap h5:before {top:5px;}
}

/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
.professor .profile_wrap .photo_bx {width:260px;}
.professor .profile_wrap .info_bx {width:calc(100% - 320px);}
.professor .profile_wrap .info_bx p.name {font-size:26px;}
.professor .profile_wrap .info_bx .current {font-size:18px;}
.professor .profile_wrap .info_bx .current dt:after {top:3px;}
.professor .grid_wrap {grid-template-columns:1fr;}
.professor .grid_wrap.w1400 {margin:60px auto 0!important;}
.professor .grid_wrap .grid-left {gap:40px;}
.professor .grid_wrap.w1400 {gap:40px;}
.professor .detail_infowrap h4 {font-size:24px; margin-bottom:20px;}
.professor .detail_infowrap .info-subwrap {margin-top:40px;}
.professor .detail_infowrap .table-st dl {padding:15px 0;}
}

/* ************************ 태블릿 이하(~767) ************************ */
@media screen and (max-width: 767px) { 
.professor .profile_wrap .w1400 {flex-direction:column; gap:30px; padding:40px 30px;}
.professor .profile_wrap .info_bx p.name {font-size:24px;}
.professor .profile_wrap .frame {position:static;}
.professor .profile_wrap .info_bx {width:100%;}
.professor .profile_wrap .info_bx .current {margin-top:10px;}
.professor .profile_wrap .info_bx .current dt:after {top:3px;}
.professor .grid_wrap.w1400 {margin:50px auto 0!important;}
.professor .detail_infowrap h4 {font-size:20px;}
.professor .detail_infowrap h4 span {padding-right:20px;}
.professor .info-subwrap h5 {font-size:18px; padding-left:20px;}
.professor .info-subwrap h5:before {width:8px; height:8px; top:4px;}
.professor .detail_infowrap .info-subwrap {margin-top:30px;}
.professor .detail_infowrap .table-st dl dt {width:170px;}
.professor .detail_infowrap .table-st dl dd {padding-left:30px;}
.professor .grid_wrap .grid-left {gap:40px;}
.professor .grid_wrap.w1400 {gap:40px;}

}

/* ************************ 태블릿 이하(~500) ************************ */
@media screen and (max-width: 500px) { 
.professor .detail_infowrap .table-st dl {flex-direction:column; gap:20px;}
.professor .detail_infowrap .table-st dl dd {padding-left:0; text-align:center;}
.professor .detail_infowrap .table-st dl dd:before {width:30px; height:2px; top:-11px;
left:50%; transform:translateX(-50%);}
.professor .profile_wrap .info_bx .career.research .grid-st li {display:block;}
.professor .profile_wrap .info_bx .career.field .grid-st li {display:block;}
.professor .profile_wrap .info_bx .career li+li {margin-top:20px;}
.professor .profile_wrap .info_bx .career li .cont {display:block; margin-top:5px;}
.professor .profile_wrap .info_bx .career .grid-st li .during {border-bottom:2px solid #fff;}
.professor .profile_wrap .info_bx .career .grid-st li .during:after {display:none;}

.professor .profile_wrap .photo_bx {width:220px;}

.professor .grid_wrap .grid-left {gap:30px;}
.professor .grid_wrap.w1400 {gap:30px;}
}