main .box1 {
  position: relative; }
  main .box1 figure img {
    width: 90%;
    max-width: 621px; }
  main .box1 span.tryangle01 {
    position: absolute;
    top: -15em;
    left: -5%;
    z-index: -1;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 700px 700px 0 0;
    border-color: #f6f6f6 transparent transparent transparent; }

main .box2 {
  position: relative;
  background-color: #ffffff80;
  padding: 5em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  main .box2 figure {
    width: 80%;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  main .box2 .cont-box {
    margin-bottom: 2rem; }
  main .box2 .tryangle02 {
    position: absolute;
    top: 50%;
    left: -5%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    width: 700px;
    height: 700px;
    z-index: -1;
    background-image: url(../img/top/works-bg.png);
    background-size: contain;
    background-repeat: no-repeat; }

@media screen and (max-width: 700px) {
  main .box1.container {
    margin: 0em auto 5em auto;
    padding-top: 15em; }
  main .box1, main .box2-wrap {
    width: 100%;
    overflow: hidden; } }

main .box3 {
  position: relative;
  margin: 0em auto 0em auto;
  width: 100%;
  background-color: #fff;
  overflow: hidden; }
  main .box3 ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -ms-flex-line-pack: center;
    align-content: center; }
    main .box3 ul li {
      width: 30%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      margin-bottom: 30px; }
      main .box3 ul li figure {
        position: relative; }
        main .box3 ul li figure figcaption {
          width: 100%;
          text-align: center;
          background-color: #00004E95;
          position: absolute;
          bottom: 10%;
          color: #fff;
          font-size: 0.9rem;
          letter-spacing: 2px;
          -webkit-box-sizing: border-box;
          box-sizing: border-box;
          padding: 10px 0; }
      @media screen and (max-width: 600px) {
        main .box3 ul li {
          width: 49%; }
          main .box3 ul li figure figcaption {
            font-size: 12px;
            padding: 5px 0; }
          main .box3 ul li:nth-child(5) figure figcaption {
            letter-spacing: 0px; } }
  main .box3 span.tryangle03 {
    position: absolute;
    top: -15em;
    right: -5%;
    z-index: -1;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 700px 700px 0;
    border-color: transparent #f6f6f6 transparent transparent; }