.blog-main {

  overflow: hidden;

  background-position: center top;

  background-repeat: no-repeat;

  background-color: #595959;

/*  word-break: break-word;*/

}

.blog-main .container {

  max-width: 1600px;

  margin: auto;

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

}

.blog-main h1 {

  font-family: "BoosterNextFYRegular", serif;

  font-size: 62px;

  color: #cfb254;

  text-align: center;

  font-weight: 400;

  width: 100%;

  margin: 40px 0 0 0;

}

.blog-main .caption {

  font-size: 29px;

  color: #ffffff;

  text-align: center;

  font-weight: 400;

  font-family: 'GothamMedium';

  width: 100%;

  margin: 200px auto 200px;

  max-width: 950px;

}

.blog-main .clear {

  width: 100%;

  display: block;

  height: 1px;

}

.blog-main .item {

  width: calc( 33.3333% - 80px );

  text-align: center;

  margin-bottom: 50px;

}

.blog-main .pager {

  width: 100%;

}

.blog-main .thumbnail {

  display: block;

  height: 315px;

  background-size: cover;

  background-position: center;

}

.blog-main .thumbnail img {

  visibility: hidden;

  opacity: 0;

  width: 0;

  height: 0;

}

.blog-main .item .title {

  font-family: "BoosterNextFYRegular", serif;

  font-size: 48px;

  color: #cfb254;

  text-align: center;

  font-weight: 400;

  margin: 55px 0 35px;

}

.blog-main .item .title a {

  color: #cfb254;

  text-decoration: none;

}

.blog-main .item .excerpt {

  font-family: 'GothamBook';

  color: #ffffff;

  font-size: 29px;

  margin-bottom: 10px;

}



.blog-main .item .link {

  font-family: 'GothamMedium';

  color: #ffffff;

  font-size: 29px;

  text-decoration: none;

  display: inline-block;

  margin: 20px 0 45px;

  transition: all 250ms cubic-bezier(.02, .01, .47, 1);

}

.blog-main .item .link:hover {

  color: #cfb254;

} 



.blog-main .my-btn {

  margin: 25px auto 75px;

  display: block;

  text-align: center;

  background: #cfb254;

  color: #ffffff;

  cursor: pointer;

  letter-spacing: -2px;

  transition: all 250ms cubic-bezier(.02, .01, .47, 1);

}

.blog-main .my-btn:hover {

  background: #ffffff;

  color: #cfb254;

}



.pager {

  margin: 0 15px;

  color: #cfb254;

  font-size: 16px;

  font-weight: 600;

  text-transform: uppercase;

  text-align: center;

  width: 100%;

  font-family: "BoosterNextFYRegular", serif;

}

.pager a {

  color: #cfb254;

  text-decoration: none;  

}

.pager a:hover {

  color: #ffffff;

} 

.pager svg {

  margin: 0 10px;

  font-size: 10px;

  position: relative;

  top: -2px;

}

.pager .page-numbers {

  display: inline-block;

  margin: 0 10px;    

}

.pager .page-numbers .current {

  color: #ff0000;

  text-decoration: underline;

}   





@media screen and (max-width: 1700px ) {



  .blog-main .container {

    max-width: 1180px;

    box-sizing: border-box;

  }

  .blog-main h1 {

    font-size: 47px;

  }

  .blog-main .caption {

    font-size: 22px;

    margin: 180px auto 185px;

  }

  .blog-main .thumbnail {

    height: 270px;

  }

  .blog-main .item .title {

    font-size: 28px;

    margin: 45px 20px 30px;

  }



  .blog-main .item .link,

  .blog-main .item .excerpt {

    font-size: 15px;

  }



  .blog-main .my-btn {

    letter-spacing: 0;

    margin: 0px auto 75px;

    font-size: 25px;

  }

  .pager {

    padding-bottom: 25px;

  }

}



@media screen and (max-width: 1600px ) {

  .blog-main .item {

    width: calc( 33.3333% - 20px );

  }

  .blog-main .item .title {

    word-break: break-word;

  }

}



@media (max-width: 1199.98px) {

  .blog-main .container {

    max-width: 960px;

  }

  .blog-main .thumbnail {

    height: auto;

    padding-top: 65%;

  }

}



@media screen and (max-width: 992px ) {



  .blog-main .container {

    max-width: 720px;

  }



/*  .blog-main h1 {

    font-size: 30px;

    line-height: 30px;

  }

  .blog-main .caption {

    font-size: 24px;

    margin-bottom: 80px;

  }*/

  .blog-main .container {



  }

  .blog-main .item {

    width: 100%;

  }



/*  .blog-main .item .title {

    font-size: 34px;

    margin: 25px 0 20px;

  }



  .blog-main .item .link,

  .blog-main .item .excerpt {

    font-size: 18px;

  }*/



  .blog-main .my-btn {

    margin: -30px auto 75px;

  }



}





@media (max-width: 767.98px) {



  .blog-main .container {

    max-width: 540px;

    margin: auto;

    padding: 0 15px;

  }

}