/*--------------------
	VARIABLE
--------------------*/
/*--------------------
	COMMON
--------------------*/
@media screen and (max-width: 640px) {
  .pc {
    display: none !important; } }

.sp {
  display: none; }
  @media screen and (min-width: 641px) {
    .sp {
      display: block; } }

/*--------------------
	INPUT
--------------------*/
#input .mvlow.cor {
  background: url("../img/internet-test/registration/img_mv.jpg") no-repeat center center/cover; }
#input .content .note01 {
  margin-bottom: .5em; }
  #input .content .note01 span {
    color: #f00; }
#input .content form {
  border-top: 2px solid #ccc; }
  #input .content form dl {
    display: grid;
    grid-template-columns: 300px 1fr;
    box-sizing: border-box;
    border-bottom: 2px solid #ccc;
    border-right: 2px solid #ccc;
    border-left: 2px solid #ccc; }
    @media screen and (max-width: 640px) {
      #input .content form dl {
        grid-template-columns: 1fr; } }
    #input .content form dl:nth-child(4) dd {
      padding: 16px 20px; }
      @media screen and (max-width: 640px) {
        #input .content form dl:nth-child(4) dd {
          padding: 10px; } }
    #input .content form dl:nth-child(7) dt {
      line-height: 107px; }
      @media screen and (max-width: 640px) {
        #input .content form dl:nth-child(7) dt {
          line-height: 1rem; } }
    #input .content form dl dt {
      background: #efefef;
      text-align: center;
      line-height: 60px;
      border-right: 2px solid #ccc; }
      @media screen and (max-width: 640px) {
        #input .content form dl dt {
          text-align: left;
          line-height: 1rem;
          padding: 15px 10px;
          border: NONE; } }
      #input .content form dl dt span {
        color: #f00;
        font-size: .8rem; }
    #input .content form dl dd {
      padding: 5px 20px; }
      @media screen and (max-width: 640px) {
        #input .content form dl dd {
          padding: 10px; } }
      #input .content form dl dd span {
        font-size: .9rem; }
      #input .content form dl dd input {
        padding: 10px;
        margin: 5px; }
      #input .content form dl dd .min {
        width: 80px; }
        @media screen and (max-width: 640px) {
          #input .content form dl dd .min {
            width: 60px; } }
      #input .content form dl dd .big {
        width: 400px; }
        @media screen and (max-width: 640px) {
          #input .content form dl dd .big {
            width: 90%; } }
      #input .content form dl dd select {
        padding: 10px;
        margin: 5px; }
  #input .content form p {
    font-size: 1rem;
    margin-top: 10px; }
    @media screen and (max-width: 640px) {
      #input .content form p {
        font-size: .9rem; } }
#input .content .note02 {
  text-align: center;
  margin: 60px 0 20px; }
  @media screen and (max-width: 640px) {
    #input .content .note02 {
      margin: 40px 0 20px; } }
  #input .content .note02 span {
    color: #f00; }
#input .content .btn {
  width: 300px;
  margin: 0 auto; }
  @media screen and (max-width: 640px) {
    #input .content .btn {
      width: auto; } }
  #input .content .btn li {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold; }
    @media screen and (max-width: 640px) {
      #input .content .btn li {
        font-size: 1.2rem; } }
    #input .content .btn li a {
      display: block;
      background: #2151a7;
      color: #fff;
      padding: 10px 0;
      border-radius: 10px;
      filter: drop-shadow(5px 5px 0px #7fa6d6);
      transition: .3s; }
      @media screen and (max-width: 640px) {
        #input .content .btn li a {
          position: relative; } }
      #input .content .btn li a:hover {
        text-decoration: none;
        filter: none; }
      @media screen and (max-width: 640px) {
        #input .content .btn li a i {
          position: absolute;
          top: 17px;
          right: 20%; } }