.project_wrapper { width: 100%; max-width: 1720px; margin: 0 auto; }

.project_list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-column-gap: 20px; column-gap: 20px; row-gap: 20px; }

.project_list li { width: calc((100% - 40px)/3); position: relative; overflow: hidden; }

.project_list li .thumb { position: relative; overflow: hidden; width: 100%; height: 0; padding-bottom: 117.5406%; }

.project_list li .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }

.project_list li .title_layer { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; font-size: 1.25em; font-weight: 600; letter-spacing: -0.05em; line-height: 150%; color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; -webkit-transition: .6s opacity, .6s background-color; transition: .6s opacity, .6s background-color; opacity: 0; }

.project_list li .title_layer:hover { background-color: rgba(0, 0, 0, 0.35); -webkit-transition: .3s opacity; transition: .3s opacity; opacity: 1; }

.view_btn_wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 50px; }

.view_btn_wrap .back_btn { cursor: pointer; }

.view_btn_wrap .board_btns { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-column-gap: 65px; column-gap: 65px; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.view_btn_wrap .board_btns > { cursor: pointer; }

.view_cont .title { font-size: 2.1875em; font-weight: 700; letter-spacing: -0.05em; margin-bottom: 40px; }

.view_cont .view_editor img { max-width: 100%; height: auto !important; }

@media screen and (max-width: 1760px) { .project_wrapper { padding-left: 20px; padding-right: 20px; } }

@media screen and (max-width: 1024px) { .project_list li .title_layer { font-size: 1.05em; }
  .view_btn_wrap { margin-bottom: 40px; }
  .view_btn_wrap .board_btns { -webkit-column-gap: 30px; column-gap: 30px; }
  .view_cont .title { font-size: 1.875em; margin-bottom: 25px; } }

@media screen and (max-width: 768px) { .project_list { -webkit-column-gap: 15px; column-gap: 15px; row-gap: 15px; }
  .project_list li { width: calc((100% - 30px)/3); }
  .project_list li .title_layer { font-size: 1em; } }

@media screen and (max-width: 540px) { .project_list { -webkit-column-gap: 10px; column-gap: 10px; row-gap: 10px; }
  .project_list li { width: calc((100% - 10px)/2); }
  .project_list li .title_layer { padding: 0 10px; }
  .view_btn_wrap { margin-bottom: 30px; }
  .view_btn_wrap .board_btns { -webkit-column-gap: 20px; column-gap: 20px; }
  .view_cont .title { font-size: 1.75em; margin-bottom: 20px; } }
/*# sourceMappingURL=project.css.map */