@font-face {
  font-family: 'bru';
  src: local('STXINGKA'), url('../fy/BrutalType-ExtraBold.otf') format('truetype');
}
.transition-100 {
  transition: all 0.1s;
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
}
.transition-200 {
  transition: all 0.2s;
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
}
.transition-300 {
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}
.transition-500 {
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
}
.trans-slowest {
  transform: translate(0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1, 1);
  -webkit-transform: translate(0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1, 1);
  -moz-transform: translate(0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1, 1);
  -ms-transform: translate(0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1, 1);
  -o-transform: translate(0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1, 1);
  transition: all 0.8s ease-out;
  -webkit-transition: all 0.8s ease-out;
  -moz-transition: all 0.8s ease-out;
  -ms-transition: all 0.8s ease-out;
  -o-transition: all 0.8s ease-out;
}
.delay-1 {
  transition-delay: 0.1s;
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  -ms-transition-delay: 0.1s;
  -o-transition-delay: 0.1s;
}
.delay-2 {
  transition-delay: 0.2s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  -ms-transition-delay: 0.2s;
  -o-transition-delay: 0.2s;
}
.delay-3 {
  transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
  -ms-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
}
.delay-4 {
  transition-delay: 0.4s;
  -webkit-transition-delay: 0.4s;
  -moz-transition-delay: 0.4s;
  -ms-transition-delay: 0.4s;
  -o-transition-delay: 0.4s;
}
.delay-5 {
  transition-delay: 0.5s;
  -webkit-transition-delay: 0.5s;
  -moz-transition-delay: 0.5s;
  -ms-transition-delay: 0.5s;
  -o-transition-delay: 0.5s;
}
.delay-6 {
  transition-delay: 0.6s;
  -webkit-transition-delay: 0.6s;
  -moz-transition-delay: 0.6s;
  -ms-transition-delay: 0.6s;
  -o-transition-delay: 0.6s;
}
.delay-7 {
  transition-delay: 0.7s;
  -webkit-transition-delay: 0.7s;
  -moz-transition-delay: 0.7s;
  -ms-transition-delay: 0.7s;
  -o-transition-delay: 0.7s;
}
.delay-8 {
  transition-delay: 0.8s;
  -webkit-transition-delay: 0.8s;
  -moz-transition-delay: 0.8s;
  -ms-transition-delay: 0.8s;
  -o-transition-delay: 0.8s;
}
.delay-9 {
  transition-delay: 0.9s;
  -webkit-transition-delay: 0.9s;
  -moz-transition-delay: 0.9s;
  -ms-transition-delay: 0.9s;
  -o-transition-delay: 0.9s;
}
.delay-10 {
  transition-delay: 1s;
  -webkit-transition-delay: 1s;
  -moz-transition-delay: 1s;
  -ms-transition-delay: 1s;
  -o-transition-delay: 1s;
}
.view-opacity {
  opacity: 0;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  -ms-opacity: 0;
  -o-opacity: 0;
}
.view-up {
  opacity: 0;
  transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
}
.view-up-half {
  opacity: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.view-up-80 {
  opacity: 0;
  transform: translateY(-80px);
  -webkit-transform: translateY(-80px);
  -moz-transform: translateY(-80px);
  -ms-transform: translateY(-80px);
  -o-transform: translateY(-80px);
}
.view-down {
  opacity: 0;
  transform: translateY(100%);
  -webkit-transform: translateY(100%);
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -o-transform: translateY(100%);
}
.view-down-half {
  opacity: 0;
  transform: translateY(50%);
  -webkit-transform: translateY(50%);
  -moz-transform: translateY(50%);
  -ms-transform: translateY(50%);
  -o-transform: translateY(50%);
}
.view-down-80 {
  opacity: 0;
  transform: translateY(80px);
  -webkit-transform: translateY(80px);
  -moz-transform: translateY(80px);
  -ms-transform: translateY(80px);
  -o-transform: translateY(80px);
}
.view-left {
  opacity: 0;
  transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
}
.view-left-down {
  opacity: 0;
  transform: translateX(-100%) translateY(100%);
  -webkit-transform: translateX(-100%) translateY(100%);
  -moz-transform: translateX(-100%) translateY(100%);
  -ms-transform: translateX(-100%) translateY(100%);
  -o-transform: translateX(-100%) translateY(100%);
}
.view-left-half {
  opacity: 0;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.view-left-80 {
  opacity: 0;
  transform: translateX(-80px);
  -webkit-transform: translateX(-80px);
  -moz-transform: translateX(-80px);
  -ms-transform: translateX(-80px);
  -o-transform: translateX(-80px);
}
.view-right {
  opacity: 0;
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
}
.view-right-half {
  opacity: 0;
  transform: translateX(50%);
  -webkit-transform: translateX(50%);
  -moz-transform: translateX(50%);
  -ms-transform: translateX(50%);
  -o-transform: translateX(50%);
}
.view-right-80 {
  opacity: 0;
  transform: translateX(80px);
  -webkit-transform: translateX(80px);
  -moz-transform: translateX(80px);
  -ms-transform: translateX(80px);
  -o-transform: translateX(80px);
}
.view-rotate-x {
  opacity: 0;
  transform: rotateX(180deg);
  -webkit-transform: rotateX(180deg);
  -moz-transform: rotateX(180deg);
  -ms-transform: rotateX(180deg);
  -o-transform: rotateX(180deg);
}
.view-rotate-x90 {
  opacity: 0;
  transform: rotateX(80deg);
  -webkit-transform: rotateX(80deg);
  -moz-transform: rotateX(80deg);
  -ms-transform: rotateX(80deg);
  -o-transform: rotateX(80deg);
}
.view-rotate-y {
  opacity: 0;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.view-rotate-y90 {
  opacity: 0;
  transform: rotateY(90deg);
  -webkit-transform: rotateY(90deg);
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  -o-transform: rotateY(90deg);
}
.view-rotate-z {
  opacity: 0;
  transform: rotateZ(-180deg);
  -webkit-transform: rotateZ(-180deg);
  -moz-transform: rotateZ(-180deg);
  -ms-transform: rotateZ(-180deg);
  -o-transform: rotateZ(-180deg);
}
.view-rotate-z90 {
  opacity: 0;
  transform: rotateZ(-90deg);
  -webkit-transform: rotateZ(-90deg);
  -moz-transform: rotateZ(-90deg);
  -ms-transform: rotateZ(-90deg);
  -o-transform: rotateZ(-90deg);
}
.view-scale {
  opacity: 0;
  transform: scale(0.5, 0.5);
  -webkit-transform: scale(0.5, 0.5);
  -moz-transform: scale(0.5, 0.5);
  -ms-transform: scale(0.5, 0.5);
  -o-transform: scale(0.5, 0.5);
}
.view-scale-z {
  opacity: 0;
  transform: scale(1.2, 1.2);
  -webkit-transform: scale(1.2, 1.2);
  -moz-transform: scale(1.2, 1.2);
  -ms-transform: scale(1.2, 1.2);
  -o-transform: scale(0.5, 0.5);
}
.view-scale-x {
  opacity: 0;
  transform: scale(0.1, 1);
  -webkit-transform: scale(0.1, 1);
  -moz-transform: scale(0.1, 1);
  -ms-transform: scale(0.1, 1);
  -o-transform: scale(0.1, 1);
}
.view-scale-y {
  opacity: 0;
  transform: scale(1, 0.1);
  -webkit-transform: scale(1, 0.1);
  -moz-transform: scale(1, 0.1);
  -ms-transform: scale(1, 0.1);
  -o-transform: scale(1, 0.1);
}
#works_info .box {
  width: 1070px;
}
#works_info .box .btn_look {
  text-align: center;
}
#works_info .box .btn_look a {
  background-color: #b11525;
}
#works_info .box .info_link .item div.bg {
  border: 1px solid #a7a7a7;
}
#works_info .box .works_logo {
  padding: 0;
  margin-bottom: 50px;
}
.pos {
  position: absolute;
}
#img_box {
  overflow: hidden;
}
#img_box .img {
  position: relative;
}
#img_box .img .txt {
  position: absolute;
  width: 960px;
  left: 50%;
  margin-left: -480px;
}
#img_box .img .txt .t1 {
  text-align: center;
}
#img_box .img .txt .t1 img {
  width: 47px;
}
#img_box .img .txt .t2 {
  text-align: center;
  font-size: 45px;
  margin: 20px 0 34px;
  line-height: 45px;
}
#img_box .img .txt .t3 {
  font-size: 16px;
  line-height: 36px;
  text-align: left;
}
#img_box .box1 .p1 {
  width: 67.2%;
  top: 0;
  left: 16%;
}
#img_box .box1 .p2 {
  width: 13.39%;
  top: 59%;
  right: 10%;
}
#img_box .box1 .p3 {
  width: 23.03%;
  top: 18%;
  right: 3%;
}
#img_box .box2 .txt {
  top: 8%;
  z-index: 2;
}
#img_box .box2 .txt p {
  color: #fff;
}
#img_box .box2 .p1 {
  width: 50.35%;
  right: 36%;
  bottom: 18%;
}
#img_box .box2 .p2 {
  width: 58.51%;
  bottom: 17%;
  right: 28%;
}
#img_box .box2 .p3 {
  width: 56.66%;
  bottom: 4.5%;
  right: 9%;
}
#img_box .box2 .p4 {
  width: 16.66%;
  bottom: 7%;
  left: 31%;
}
#img_box .box2 .p5 {
  width: 29.7%;
  right: -12%;
  top: 5%;
}
#img_box .box2 .p6 {
  width: 44.82%;
  left: -7%;
  top: -4%;
}
#img_box .box3 .txt {
  top: 3%;
}
#img_box .box3 .txt .t2 {
  color: #3a3232;
}
#img_box .box3 .txt .t3 {
  color: #b11525;
}
#img_box .box3 .p1 {
  width: 94.7%;
  top: 28%;
  right: 0;
}
#img_box .box3 .p2 {
  width: 94.76%;
  top: 16%;
  right: 0;
}
#img_box .box3 .p3 {
  width: 12.79%;
  top: 23%;
  left: 75.5%;
}
#img_box .box3 .p4 {
  width: 82.26%;
  left: 0;
  top: 60.5%;
}
#img_box .box3 .p5 {
  width: 44.82%;
  top: 12%;
  right: -28%;
}
#img_box .box4 .txt {
  top: 5%;
}
#img_box .box4 .txt p {
  color: #fff;
}
#img_box .box4 .txt_img {
  width: 1160px;
  left: 50%;
  margin-left: -630px;
  top: 20%;
  display: flex;
  justify-content: space-between;
}
#img_box .box4 .txt_img > div {
  width: 33.33%;
}
#img_box .box4 .txt_img > div .top {
  margin-bottom: 15px;
}
#img_box .box4 .txt_img > div .top p {
  margin: 0;
}
#img_box .box4 .txt_img > div .top .txt1 {
  font-size: 34px;
  line-height: 37px;
  color: #c71e32;
  font-family: 'bru';
  letter-spacing: -3px;
}
#img_box .box4 .txt_img > div .top .txt2 {
  font-size: 31px;
  color: #50403d;
  line-height: normal;
  margin: 10px 0;
}
#img_box .box4 .txt_img > div .top .txt3 {
  width: 39px;
  border-bottom: 5px solid #cd4341;
  margin: auto;
}
#img_box .box4 .txt_img > div .btm {
  width: auto;
}
#img_box .box4 .p1 {
  width: 22.97%;
  top: 47.7%;
  left: 11.8%;
}
#img_box .box4 .p2 {
  width: 23.15%;
  top: 47.5%;
  left: 67%;
}
#img_box .box4 .p3 {
  width: 48.21%;
  top: 46%;
  left: 26%;
}
#img_box .box4 .p4 {
  width: 73.92%;
  top: -5%;
  left: -54%;
}
#img_box .box4 .p5 {
  width: 73.92%;
  top: 17%;
  right: -43%;
}
#img_box .box4 .p6 {
  width: 11.42%;
  top: 83%;
  left: 26.4%;
}
#img_box .box4 .p7 {
  width: 44.82%;
  right: -14%;
  top: -18%;
}
#img_box .box5 .txt {
  top: 5%;
}
#img_box .box5 .p1 {
  width: 81.48%;
  left: 9%;
  top: 45%;
}
#img_box .box5 .p2 {
  width: 40.83%;
  top: 48%;
  left: 5%;
}
#img_box .box5 .p3 {
  width: 21.01%;
  top: 52%;
  right: 4%;
}
#img_box .box5 .p4 {
  width: 62.67%;
  top: 33%;
  left: 19%;
}
#img_box .box5 .p5 {
  width: 10.89%;
  top: 74%;
  right: 18%;
}
#img_box .box5 .p6 {
  width: 44.82%;
  left: -12%;
  top: -3%;
}