/*** 공통 ***/
.content_wrap .c-inner {margin:0 auto; max-width:1420px;}
.contents-part+.contents-part {padding-top:100px; margin-top:100px; border-top:1px solid #e5e5e5;}

.flexwrap {display:flex;}
.gap100 {gap:100px;}
.gap50 {gap:50px;}
.subject .top_cont .img  {position:relative;}
.subject .top_cont .img img {width:100%;}
.subject .top_cont .img p {position:absolute; bottom:120px; left:50%; transform:translateX(-50%); font-size:48px; font-weight:700; line-height:1.2; text-align:center; color:#fff;}
.subject .top_cont .txt {color:#333; margin-top:50px;}
.subject .top_cont .txt p b {color:#000; font-weight:700;}
.subject .top_cont .txt p+p {margin-top:20px;}
.subject .top_cont .txt>div {width:50%;}

.subject .bottom_cont .txt-wrap {max-width:430px; width:30%;}
.subject .bottom_cont .txt-wrap h3 {font-size:24px; font-weight:700; margin-bottom:20px;}
.subject .bottom_cont .txt-wrap p {color:#333;}
.subject .bottom_cont .txt-wrap p+p {margin-top:20px;}
.subject .bottom_cont .subject-bx-wrap {display:grid; grid-template-columns:repeat(3,1fr); gap:20px; width:calc(70% - 50px);}
.subject .bottom_cont .subject-bx {padding:50px 50px 25px; box-sizing:border-box; transition:all 0.3s;}
.subject .bottom_cont .subject-bx:nth-child(2n-1):hover, .subject .bottom_cont .subject-bx:nth-child(2n):hover {transform:translateY(-10px); box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.subject .bottom_cont .subject-bx:hover p {color:#fff;}
.subject .bottom_cont .subject-bx:hover .img img {background-blend-mode: multiply;}
.subject .bottom_cont .subject-bx:nth-child(2n-1) {background:#31343B;}
.subject .bottom_cont .subject-bx:nth-child(2n) {background:#1F222B;}
.subject .bottom_cont .subject-bx .num {font-size:16px; color:#fff;}
.subject .bottom_cont .subject-bx p {font-size:24px; line-height:1.2; margin:40px 0; font-weight:700; transition:all 0.3s;}
.subject .bottom_cont .subject-bx .img {height:173px; display:flex; justify-content:start; align-items:center;}
.subject .bottom_cont .subject-bx .img img {max-width:100%;}
/* ************************ 태블릿 이하(~1249) ************************ */
@media screen and (max-width: 1249px) { 
.contents-part+.contents-part {padding-top:80px; margin-top:80px;}

.subject .top_cont .img p {bottom:70px; font-size:36px;}
.subject .top_cont .txt {margin-top:40px;}
.subject .top_cont .txt.gap100 {gap:50px;} 

.subject .bottom_cont.flexwrap {flex-direction:column;}
.subject .bottom_cont .txt-wrap {width:100%; max-width:none;}
.subject .bottom_cont .subject-bx-wrap {width:100%;}
.subject .bottom_cont .subject-bx p {margin:30px 0;}
.subject .bottom_cont .txt-wrap p+p {margin-top:10px;}
.subject .bottom_cont.flexwrap {gap:30px;}
}

/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
.contents-part+.contents-part {padding-top:50px; margin-top:50px;}

.subject .top_cont .img p {bottom:55px; font-size:30px;}
.subject .top_cont .txt.flexwrap.gap100 {margin-top:30px; flex-direction:column; gap:15px;}
.subject .top_cont .txt>div {width:100%;}
.subject .top_cont .img p {bottom:40px; font-size:24px;} 
.subject .top_cont .txt p+p {margin-top:15px;}
.subject .bottom_cont .txt-wrap h3 {font-size:20px;}
.subject .bottom_cont .subject-bx-wrap {gap:15px;}
.subject .bottom_cont .subject-bx {padding:30px 30px 15px;}
.subject .bottom_cont .subject-bx p {font-size:20px; margin:20px 0;}

}

/* ************************ 태블릿 이하(~767) ************************ */
@media screen and (max-width: 767px) { 
.contents-part+.contents-part {padding-top:40px; margin-top:40px;}	
.subject .top_cont .img p {bottom:30px; font-size:22px;}

.subject .bottom_cont .subject-bx-wrap {grid-template-columns:1fr;}
.subject .bottom_cont .subject-bx {display:flex; justify-content:space-between;}
}

/* ************************ 태블릿 이하(~500) ************************ */
@media screen and (max-width: 500px) { 
.contents-part+.contents-part {padding-top:30px; margin-top:30px;} 
.subject .top_cont .img p {bottom:25px; font-size:20px;}
.subject .top_cont .txt p+p {margin-top:10px;}
.subject .top_cont .txt.flexwrap.gap100 {margin-top:20px;}
.subject .bottom_cont .subject-bx .img img {max-width:150px;}
}