.content-1 { width: 62.5vw; margin: 4.89583vw auto 5.20833vw; } .content-1 .title { font-size: 36px; line-height: 1.33333; margin-bottom: 2.08333vw; } .content-1 .sub-box { display: flex; justify-content: space-between; align-items: center; padding-bottom: 2.60417vw; border-bottom: 1px solid #c6c6c6; } .content-1 .category { font-size: 0.83333vw; color: #000; padding: 0.46875vw 0.83333vw 0.52083vw; background-color: #f5f5f5; } .content-1 .date { font-size: 0.83333vw; color: #999; } .content-1 .html-content { margin: 3.125vw 0 5.10417vw; } .content-1 .page-btn-box { display: flex; justify-content: space-between; } .content-1 .arrow-btn { cursor: pointer; font-size: 0.83333vw; } .content-1 .arrow-btn:hover { opacity: 0.7; } .html-content p { font-size: 1.042vw; line-height: 1.6; } .html-content .big-title { font-size: 1.875vw; } .html-content .title { font-size: 1.04167vw; } .html-content img { max-width: 100%; } @media screen and (max-width: 768px) { .content-1 { width: auto; margin: 13.19444vw 5.55556vw 13.88889vw } .content-1 .title { font-size: 4.44444vw; line-height: initial; margin-bottom: 5.55556vw; } .content-1 .sub-box { padding-bottom: 5.55556vw; border-bottom: 0.13889vw solid #c6c6c6; } .content-1 .category { font-size: 3.05556vw; padding: 1.11111vw 2.22222vw 1.25vw; background-color: #f5f5f5; } .content-1 .date { font-size: 3.05556vw; } .content-1 .html-content { margin: 5.55556vw 0 13.33333vw; } .content-1 .arrow-btn { font-size: 3.61111vw; } .html-content p { font-size: 3.61111vw; } .html-content .title { font-size: 4.44444vw; } .html-content .big-title { font-size: 6.66667vw; } }