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