@media(max-width: 1200px){ main{ .section--container{ padding-left: 20px!important; padding-right: 20px!important; .title--wrap{ &.big{ >h2{ font-size: 36px; } } >h2{ font-size: 30px; } } .growth--logic--wrap{ gap: 20px; .title--box{ width: calc((100% - 120px) / 3 + 80px); h2{ font-size: 36px; } } .logic--box{ padding: 40px 35px 40px; &.special{ width: calc((100% - 120px) / 3 + 80px); } } } .best--service--wrap{ gap: 20px; .service--box{ width: calc((100% - 40px) / 3); padding: 20px 25px 40px; h3{ font-size: 18px; margin-top: 30px; margin-bottom: 20px; } } } .now--box--wrap{ .box--top{ .box{ >p{ font-size: 16px; } } } .box--bot{ gap: 20px; } } } } } @media(max-width: 768px){ .mb--80{ margin-bottom: 40px!important; } br{ &.web{ display: none; } } main{ .section--container{ &.p--120{ padding: 60px 0; } &.p--100{ padding: 60px 0; } .title--wrap{ &.big{ >h2{ font-size: 30px; margin-bottom: 30px; } >p{ font-size: 15px; } } } .best--service--wrap{ flex-direction: column; .service--box{ width: 100%; h3{ br{ display: none; } } } } .now--box--wrap{ .box--bot{ flex-direction: column; .box{ width: 100%; } } } } .faq--wrapper{ .inner--contents{ .faq--list--wrap{ ul{ li{ .faq--item--title{ >p{ font-size: 15px; } } .faq--item--content{ >p{ font-size: 15px; } } } } } } } } } @media(max-width: 500px){ main{ .section--container{ .now--box--wrap{ .box--top{ flex-wrap: wrap; gap: 20px; margin-bottom: 50px; .box{ width: 100%; flex-direction: row; gap: 20px; .box--img{ width: 80px; min-width: 80px; img{ width: 100%; } } >p{ width: calc(100% - 120px); text-align: left; } } } } } } }