@charset "utf-8";

#main-task { padding: 200px 0 100px; text-align: center; } 
.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-title:after { content: ""; background: #9d1c4c; position: absolute; bottom: -57px; width: 50%; height: 5px; left: 50%; transform: translateX(-50%); } 
.intro-second-title { transition: all 0.7s; transition-delay: 0.8s; font-size: 19px; margin-bottom: 80px; transform: scale(0.7); opacity: 0; color: #707070; } 
.active-section.active .intro-title, 
.active-section.active .intro-second-title { opacity:1; transform: scale(1); } 
.active-section.active .task-history {opacity:1;transform: translateY(0px);} 

.task-wrap {border-bottom:1px solid #f2f2f2;padding-bottom: 100px;margin-top: 100px; display: flex; align-items: center;transition: all 0.7s;transform: translateY(100px);opacity:0; } 
.task-wrap.active {transform: translateY(0px);opacity:1; } 
.task-wrap .img-wrap {float: left;width: 50%;margin-right: 5%;} 
.task-wrap .context-wrap { float: left; width: 50%; text-align: left; } 
.task-wrap .img-wrap img { display: block; width: 100%; } 
.task-wrap .context-wrap .row1 {overflow: hidden;margin-bottom: 40px;display: inline-block;} 
.task-wrap .context-wrap .row1 img { width: 70px; float: left; } 
.task-wrap .context-wrap .row1 .mini-title {float: left;margin-left: 50px;text-align: left;} 
.task-wrap .context-wrap .row1 .point-c { display: block; color: #9d1c4c; font-size: 16px; margin-bottom: 10px; } 
.task-wrap .context-wrap .row1 em { display: block; font-weight: bold; font-size: 22px; } 
.task-wrap .context-wrap .row2 { font-size: 20px; font-weight: bold; margin-bottom: 30px; } 
.task-wrap .context-wrap .row3 {white-space: pre-line;font-size: 17px;line-height: 1.5;font-weight: 300;word-break: keep-all;} 
.task-wrap .context-wrap .row3 .underline-effect { text-decoration: underline; font-weight: 500; } 
.history-wrap {margin-top: 150px;margin-bottom: 100px;position: relative;} 
.task-history {transform: translateY(100px);opacity:0;transition: all 0.7s;transition-delay: 0.6s;margin-top: 40px;} 
.task-history p {font-size: 18px;line-height: 1.5;font-weight: 300;text-align: left;width: 50%;margin: 0 auto;} 

@media (max-width: 1000px) { /* 태블릿,모바일 레이아웃 변경 */
	.task-wrap .img-wrap{display:none;}
	.task-wrap .context-wrap{width:100%;text-align: center;}
	.task-history p{font-size: 16px; width:75%;}
}
@media (max-width: 730px){
	.task-history p{width:95%;}
}
@media (max-width: 600px){
	.task-wrap .context-wrap .row1 .point-c{font-size:14px;}
	.task-wrap .context-wrap .row1 em{font-size:19px;}
	.task-wrap .context-wrap .row2{font-size:18px;}
	.task-wrap .context-wrap .row3{font-size:15px;}
	.task-history p{font-size:15px; font-weight: 400; margin-bottom: 10px;}
}
@media (max-width: 500px){
	 .intro-title { font-size: 40px; } 
	 .intro-second-title { font-size: 16px; line-height:1.5;} 
}
@media (max-width: 380px){
	 .intro-second-title { font-size: 14px;} 
}