@charset "utf-8";

/*!
 * ress.css • v4.0.0
 * MIT License
 * github.com/filipelinhares/ress
 */html{box-sizing:border-box;-webkit-text-size-adjust:100%;word-break:normal;-moz-tab-size:4;tab-size:4}*,:after,:before{background-repeat:no-repeat;box-sizing:inherit}:after,:before{text-decoration:inherit;vertical-align:inherit}*{padding:0;margin:0}hr{overflow:visible;height:0;color:inherit}details,main{display:block}summary{display:list-item}small{font-size:80%}[hidden]{display:none}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}a{background-color:transparent}a:active,a:hover{outline-width:0}code,kbd,pre,samp{font-family:monospace,monospace}pre{font-size:1em}b,strong{font-weight:bolder}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:inherit;text-indent:0}input{border-radius:0}[disabled]{cursor:default}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}textarea{overflow:auto;resize:vertical}button,input,optgroup,select,textarea{font:inherit}optgroup{font-weight:700}button{overflow:visible}button,select{text-transform:none}[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer;color:inherit}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}button,input,select,textarea{background-color:transparent;border-style:none}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline-width:0}select{-moz-appearance:none;-webkit-appearance:none}select::-ms-expand{display:none}select::-ms-value{color:currentColor}legend{border:0;color:inherit;display:table;white-space:normal;max-width:100%}::-webkit-file-upload-button{-webkit-appearance:button;color:inherit;font:inherit}img{border-style:none}progress{vertical-align:baseline}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true]{cursor:default}

 html {
  height: 100%;
 }

 body {
  width: 100%;;
  height: 100%;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  letter-spacing: .02em;
  background-color: #f8f8f8;;
}

img {
  width: auto;
  height: auto;
}

p {
  font-size: 16px;
  line-height: 28px;

  @media (max-width: 767px) {
    font-size: 14px;
    line-height: 24px;
  }
}

a {
  text-decoration: none;
  color: #233da6;
}

ul, ol {
  list-style: none;
}

@keyframes kururin {
  0% {
    transform: scale(1, 1);
  }
  3% {
    transform: scale(0, 1);
  }
  6% {
    transform: scale(-1, 1);
  }
  9% {
    transform: scale(0, 1);
  }
  12% {
    transform: scale(1, 1);
  }
  15% {
    tranform: scale(1, 1);
  }
}

@keyframes kururin2 {
  0% {
    transform: rotate(0deg);
  }
  30% {
    transform: rotate(360deg);
  }
  30.01% {
    transform: rotate(0deg);
  }
}

#top {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 60px;
  min-height: 100%;
  padding: 80px 0;
  position: relative;
  z-index: 1;

  h1 {
    text-align: center;
  }

  main {
    width: calc(100% - 60px);
    max-width: 680px;
    margin: 0 auto;
    padding: 40px;
    border-radius: 10px;
    background-color: #fff;

    section {
      + section {
        margin-top: 60px;
      }

      h2 {
        position: relative;
        margin-bottom: 20px;
        padding-left: 50px;
        color: #0C7139;
        font-size: 20px;
        line-height: 30px;

        &::before {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          border-top: 15px solid #0C7139;
          border-left: 15px solid #0C7139;
          border-right: 15px solid #094825;
          border-bottom: 15px solid #094825;
          border-radius: 50% 0 50% 50%;
        }
      }

      &.projects {
        h2::before {
          animation: 3000ms linear 0ms infinite kururin;
        }
      }

      .body {
        padding-left: 50px;
      }

      dl {
        dt {
          font-size: 18px;
          line-height: 30px;
        }

        dd {
          font-size: 16px;
          line-height: 30px;
        }

        dd + dt {
          margin-top: 20px;
        }
      }
    }
  }
}