768px일 때는 기준 너비를 변경하는 코드를 작성합니다. 그리고 What I Do 영역은 기준 너비가 768px 이하로 줄어들면 본문 너비가 100%로 변경되어 모든 콘텐츠가 수직 방향에 한 줄로 배치됩니다.
13/end/css/media.css - 해상도 768px 이하일 때
@media screen and (max-width:768px){
(중략)
/* 메인 영역 container 기준 너비 변경 */
main .container{
width:576px; /* 768px -> 576px */
}
section .container{
width:400px; /* 600px -> 400px */
}
section .do-me .do-inner{
width:100%; /* 48% -> 100% */
margin-right:0; /* 외부 여백 초기화 */
}
}