/* For Tablets */
@media all and (max-width: 1000px) {
      /*lessonのdivの範囲*/
      .lesson {
        width: 50%;
        margin-bottom: 50px;
      }
      
      .top-wrapper h1 {
        font-size: 32px;
      }
      
      .heading h2 {
        font-size: 20px;
      }
      
      .top-wrapper {
        /*text-align: left;*/
        width: 100%;
      }

}


/* For Smartphones */
@media all and (max-width: 670px) {
        /*lessonのdivの範囲*/
      .lesson {
        width: 100%;
      }
      
      footer {
        text-align: center;
      }

      
      .top-wrapper {
        /*text-align: left;*/
        width: 100%;
      }
      
      /* Add CSS for header-right */
      .header-right{
        display:none;
      }
      
      /* Add CSS for menu-icon */
      .menu-icon{
        display:block;
      }
      
      .top-wrapper h1 {
        font-size: 24px;
        line-height: 36px;
      }
      
      .top-wrapper p {
        font-size: 14px;
        line-height: 20px;
      }
}