.popular-blog {
  margin-bottom: 9.36585rem; }
  .popular-blog .big-title {
    margin-bottom: 4.68293rem; }
  .popular-blog .list-item {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column-gap: 3.5122rem; }
    .popular-blog .list-item .item {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      border-radius: 1.26829rem;
      padding: 2.43902rem 2.43902rem 2.43902rem 9.36585rem;
      margin-bottom: 3.12195rem;
      font-size: 1.7561rem;
      font-family: "Nunito", "sans-serif";
      line-height: 1.5;
      letter-spacing: -0.01em;
      background: url("../images/instruction/item1.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item a {
        color: #333333; }
      .popular-blog .list-item .item:nth-of-type(2) {
        background: url("../images/instruction/item2.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item:nth-of-type(3) {
        background: url("../images/instruction/item3.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item:nth-of-type(4) {
        background: url("../images/instruction/item4.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item:nth-of-type(5) {
        background: url("../images/instruction/item5.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item:nth-of-type(6) {
        background: url("../images/instruction/item6.svg") no-repeat #F7F5F3 center left 2.43902rem; }
      .popular-blog .list-item .item:nth-of-type(7) {
        background: url("../images/instruction/item7.svg") no-repeat #F7F5F3 center left 2.43902rem; }

.topic {
  margin-bottom: 9.7561rem; }
  .topic .wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
  .topic .thumb {
    position: absolute;
    width: 39.02439rem;
    left: 14.14634rem;
    top: 11.70732rem;
    z-index: -1; }
  .topic .big-title {
    margin-top: 2.92683rem;
    width: 30%; }
  .topic .list-topic {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 65%; }
  .topic .item {
    position: relative;
    width: 48%;
    padding: 4.87805rem 2.92683rem;
    border-radius: 3.12195rem;
    margin-bottom: 4%; }
    .topic .item .link {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0; }
    .topic .item .title-2 {
      margin-top: 2.43902rem;
      letter-spacing: -0.02em;
      color: #F7F5F3; }
    .topic .item p {
      font-family: "Nunito", "sans-serif";
      font-size: 1.56098rem;
      line-height: 1.5;
      letter-spacing: -0.02em;
      color: #F7F5F3;
      margin-bottom: 0; }
    .topic .item:nth-child(1) {
      background: #85CF92; }
      .topic .item:nth-child(1) .title-2 {
        color: #000; }
      .topic .item:nth-child(1) p {
        color: #555555; }
    .topic .item:nth-child(2) {
      background: #F09527; }
    .topic .item:nth-child(3) {
      background: #2882E2; }
    .topic .item:nth-child(4) {
      background: #057A4F; }

.white-banner {
  margin-bottom: 12.4878rem; }
  .white-banner .wrapper {
    padding: 10.14634rem 0;
    background: url("../images/instruction/bg-desk.png") bottom no-repeat #F7F5F3;
    border-radius: 3.12195rem; }
  .white-banner .inner {
    max-width: 54.73171rem;
    text-align: center;
    margin: 0 auto; }
  .white-banner .big-title {
    margin-bottom: 1.95122rem; }
  .white-banner .btn {
    border: 2px solid #000;
    color: #000; }
    .white-banner .btn:hover {
      color: #fff;
      background: #000; }

@media screen and (max-width: 1024px) {
  .popular-blog {
    margin-bottom: 7.41463rem; }
    .popular-blog .big-title {
      font-size: 2.92683rem;
      margin-bottom: 3.90244rem; }
    .popular-blog .list-item {
      grid-template-columns: repeat(1, minmax(0, 1fr)); }
      .popular-blog .list-item .item {
        margin-bottom: 1.95122rem;
        font-size: 1.56098rem;
        padding: 2.43902rem 2.43902rem 2.43902rem 7.80488rem;
        background-size: 3.70732rem !important; }
  .topic {
    margin-bottom: 7.02439rem; }
    .topic .wrapper {
      -webkit-box-pack: unset;
          -ms-flex-pack: unset;
              justify-content: unset;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; }
      .topic .wrapper .thumb {
        display: none; }
    .topic .big-title {
      width: 100%;
      font-size: 2.92683rem;
      margin-bottom: 3.90244rem;
      margin-top: 0; }
    .topic .list-topic {
      width: 100%;
      -webkit-box-pack: unset;
          -ms-flex-pack: unset;
              justify-content: unset; }
      .topic .list-topic .item {
        width: 100%;
        padding: 3.12195rem;
        margin-bottom: 2.34146rem; }
      .topic .list-topic .title-2 {
        font-size: 2.63415rem;
        margin-bottom: 0.78049rem; }
      .topic .list-topic p {
        font-size: 1.36585rem; }
  .white-banner {
    margin-bottom: 9.36585rem; }
    .white-banner .wrapper {
      padding: 10.53659rem 0;
      background: url("../images/instruction/bg-mobile.png") left 2.43902rem bottom -1.95122rem no-repeat #F7F5F3; }
    .white-banner .inner {
      max-width: 19.5122rem; } }