/* CSS Document */
/*---------------
	CONTACT
---------------*/
#contact {
  background: #ddf3fc; }
  #contact .lower-main h2 {
    font-size: 5em;
    font-weight: 500; }
    @media only screen and (max-width: 1199px) {
      #contact .lower-main h2 {
        font-size: 2.5em; } }
    #contact .lower-main h2 span {
      display: inline;
      font-size: 1em;
      font-weight: 500;
      position: relative;
      z-index: 1; }
      #contact .lower-main h2 span:after {
        content: '';
        display: block;
        width: 115px;
        height: 15px;
        background: #fff;
        position: absolute;
        bottom: 0;
        left: -7px;
        z-index: -1; }
        @media only screen and (max-width: 1199px) {
          #contact .lower-main h2 span:after {
            width: 63px; } }
  #contact .lower-main p {
    font-size: 1.8em;
    margin: 70px 0; }
    @media only screen and (max-width: 1199px) {
      #contact .lower-main p {
        font-size: 1.6em;
        line-height: 1.5;
        margin: 30px 0 0; } }
  @media only screen and (max-width: 1199px) {
    #contact .contents-area {
      width: auto;
      max-width: 800px;
      padding: 60px 2%;
      margin: 0 auto; } }
  #contact .contents-area .any {
    background: #fff;
    padding: 80px 0;
    margin: 80px 0 40px; }
    @media only screen and (max-width: 1199px) {
      #contact .contents-area .any {
        padding: 30px 2%;
        margin: 60px 0 30px; } }
  #contact .contents-area .content {
    width: 1200px;
    margin: 0 auto; }
    @media only screen and (max-width: 1199px) {
      #contact .contents-area .content {
        width: auto; } }
    #contact .contents-area .content h3 {
      color: #6185bc;
      font-size: 4em;
      font-weight: 500;
      letter-spacing: .1em;
      margin-bottom: 1em; }
      @media only screen and (max-width: 1199px) {
        #contact .contents-area .content h3 {
          font-size: 2.5em; } }
    #contact .contents-area .content h4 {
      color: var(--text-color);
      font-size: 3em;
      line-height: 1.2;
      letter-spacing: .1em;
      border-bottom: 1px solid #6185bc;
      margin: 50px 0 20px;
      position: relative; }
      @media only screen and (max-width: 1199px) {
        #contact .contents-area .content h4 {
          font-size: 2em;
          margin: 30px 0 20px; } }
      #contact .contents-area .content h4 .number {
        color: #6185bc;
        font-size: 2em;
        font-weight: 600;
        letter-spacing: .1em;
        margin-right: 5px; }
      #contact .contents-area .content h4 .note {
        color: #f00;
        font-size: .5em;
        position: absolute;
        right: 0;
        bottom: .5em; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content h4 .note {
            font-size: .6em;
            bottom: -1.8em; } }
    #contact .contents-area .content .cont__box {
      width: 1000px;
      margin: 0 auto;
	  position: relative; }
      @media only screen and (max-width: 1199px) {
        #contact .contents-area .content .cont__box {
          width: auto; } }
      #contact .contents-area .content .cont__box.cont__box--grid {
        display: grid;
        grid-template-columns: 1fr 1fr; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--grid {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between; } }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--grid dl {
            display: flex; } }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--grid dl.last-name, #contact .contents-area .content .cont__box.cont__box--grid dl.first-name {
            display: block; } }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--grid dl.last-name dt, #contact .contents-area .content .cont__box.cont__box--grid dl.first-name dt {
            padding: 0; } }
        #contact .contents-area .content .cont__box.cont__box--grid dl dt {
          padding: 25px 0; }
          @media only screen and (max-width: 1199px) {
            #contact .contents-area .content .cont__box.cont__box--grid dl dt {
              padding: 5px 0; } }
      #contact .contents-area .content .cont__box.cont__box--flex {
        display: flex; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--flex {
            display: block; } }
        #contact .contents-area .content .cont__box.cont__box--flex dl {
          display: flex;
          margin-right: 90px; }
          @media only screen and (max-width: 1199px) {
            #contact .contents-area .content .cont__box.cont__box--flex dl {
              margin: 0; } }
          #contact .contents-area .content .cont__box.cont__box--flex dl dt {
            padding: 0; }
      #contact .contents-area .content .cont__box.cont__box--check dl {
        display: flex; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--check dl {
            margin: 0; } }
        #contact .contents-area .content .cont__box.cont__box--check dl dt {
          width: 100%;
          line-height: 2;
          padding: 0;
          margin: 0; }
          #contact .contents-area .content .cont__box.cont__box--check dl dt label {
            margin-right: .5em; }
        #contact .contents-area .content .cont__box.cont__box--check dl dd span {
          margin: 0; }
      #contact .contents-area .content .cont__box.cont__box--radio dl {
        display: flex; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box.cont__box--radio dl {
            margin: 0; } }
        #contact .contents-area .content .cont__box.cont__box--radio dl dt {
          width: 100%;
          line-height: 2;
          padding: 0;
          margin: 0; }
          #contact .contents-area .content .cont__box.cont__box--radio dl dt label {
            margin-right: .5em; }
        #contact .contents-area .content .cont__box.cont__box--radio dl dd span {
          margin: 0; }
      #contact .contents-area .content .cont__box dl {
        display: grid;
        grid-template-columns: 130px 1fr;
        color: var(--text-color);
        font-size: 1.8em; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box dl {
            display: block;
            font-size: 1.6em; } }
        #contact .contents-area .content .cont__box dl dt {
          padding: 25px 0;
          margin-bottom: 15px; }
          @media only screen and (max-width: 1199px) {
            #contact .contents-area .content .cont__box dl dt {
              padding: 0; } }
	  #contact .contents-area .content .cont__box dl dd {
		position: relative; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box dl dd {
            margin-bottom: 15px; } }
        #contact .contents-area .content .cont__box dl dd span {
          margin: 0 30px; }
          @media only screen and (max-width: 1199px) {
            #contact .contents-area .content .cont__box dl dd span {
              margin: 0 10px; } }
        #contact .contents-area .content .cont__box dl dd select {
          font-size: .9em;
          padding: 24px;
          border: none; }
          @media only screen and (max-width: 1199px) {
            #contact .contents-area .content .cont__box dl dd select {
              padding: 5px;
              margin-bottom: 10px; } }
      #contact .contents-area .content .cont__box input {
        font-size: 1em;
        padding: 25px;
        border: none; }
        #contact .contents-area .content .cont__box input::placeholder {
          color: #ccc; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box input {
            padding: 5px; } }
      #contact .contents-area .content .cont__box .big {
        width: 88.5%;
        margin: 10px 0; }
      #contact .contents-area .content .cont__box .mid {
        width: 60%; }
      #contact .contents-area .content .cont__box .sml {
        width: 20%; }
      #contact .contents-area .content .cont__box select {
        background: #f2f2f3;
        font-size: .9em;
        padding: 24px;
        border: none;
        border-right: 1em solid #f2f2f3;
        margin: 0 1em;
        position: relative; }
      #contact .contents-area .content .cont__box .half {
        width: 930px;
        text-align: right;
        color: #999;
        font-size: 1.6em; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box .half {
            width: auto;
            text-align: left;
            font-size: 1.4em; } }
      #contact .contents-area .content .cont__box textarea {
        width: calc(100% - 50px);
        max-width: 950px;
        font-size: 1rem;
        line-height: 1.5;
        padding: 25px;
        border: none; }
        #contact .contents-area .content .cont__box textarea::placeholder {
          color: #ccc; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box textarea {
            margin-top: 10px; } }
      #contact .contents-area .content .cont__box .budget select {
        margin: 0 0 1em 0; }
        @media only screen and (max-width: 1199px) {
          #contact .contents-area .content .cont__box .budget select {
            padding: 5px; } }
      #contact .contents-area .content .cont__box .budget span {
        display: inline-block;
        margin: 0 1em; }
    #contact .contents-area .content .agree {
      text-align: center;
      font-size: 1.8em;
      margin-top: 75px; }
      @media only screen and (max-width: 1199px) {
        #contact .contents-area .content .agree {
          font-size: 1.6em;
          margin-top: 60px; } }
      #contact .contents-area .content .agree input {
        margin-right: .5em; }
      #contact .contents-area .content .agree .agr {
        text-decoration: underline;
        color: #f00; }
        #contact .contents-area .content .agree .agr:hover {
          text-decoration: none; }
      #contact .contents-area .content .agree .btn {
        display: block;
        width: 340px;
        background: #6c84b9;
        color: #fff;
        line-height: 2.8;
        margin: 30px auto 0;
        position: relative; }
        #contact .contents-area .content .agree .btn img {
          width: 30px;
          position: absolute;
          top: 10px;
          right: 15px; }
        #contact .contents-area .content .agree .btn:hover {
          opacity: .8; }
	#contact .contents-area .content .wpcf7-not-valid-tip { 
		margin: 0!important;
		position: absolute!important;
		left: 1.5em;
		bottom: -1.1em;
		font-size: 14px; }
	@media only screen and (max-width: 1199px) {
		#contact .contents-area .content .wpcf7-not-valid-tip {
			top: -1em;
			left: 0;
			bottom: auto;
			font-size: 12px; } }