.clearfix {
  *zoom: 1; }
  .clearfix:after {
    content: "";
    display: table;
    clear: both; }

/*--------------------------
section01
---------------------------*/
#section01 {
  background: #fff;
  padding: 60px 0; }
  @media (max-width: 1230px) {
    #section01 {
      padding: 0px 0 40px; } }
  @media (max-width: 767px) {
    #section01 {
      padding: 0 0 10px; } }
  #section01 .main_box {
    padding: 0; }
  #section01 .flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    width: 100%; }
    @media (max-width: 1230px) {
      #section01 .flex {
        display: block; } }
    #section01 .flex .right_box {
      display: block;
      position: relative;
      width: 60%;
      padding-right: 40px; }
      @media (max-width: 1230px) {
        #section01 .flex .right_box {
          padding-top: 10px;
          padding-right: 0px;
          display: block;
          width: 100%; } }
      @media (max-width: 767px) {
        #section01 .flex .right_box {
          padding-top: 10px;
          padding-right: 0px;
          margin-bottom: 10px; } }
      #section01 .flex .right_box h1 {
        height: 100px;
        width: auto;
        display: block;
        margin-bottom: 20px; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box h1 {
            height: 90px;
            width: auto;
            margin-bottom: 0px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box h1 {
            height: 50px;
            width: auto;
            margin-bottom: 10px; } }
        #section01 .flex .right_box h1 img {
          height: 120px;
          width: auto; }
          @media (max-width: 1230px) {
            #section01 .flex .right_box h1 img {
              height: 90px; } }
          @media (max-width: 767px) {
            #section01 .flex .right_box h1 img {
              height: 50px; } }
      #section01 .flex .right_box .blue_box {
        width: 100%;
        padding: 18px;
        background: #004C9F;
        border-radius: 4px;
        margin-bottom: 30px; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box .blue_box {
            padding: 14px;
            margin-bottom: 18px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box .blue_box {
            line-height: 150%;
            padding: 10px;
            margin-bottom: 10px; } }
      #section01 .flex .right_box .lead {
        color: #fff;
        line-height: 175%;
        margin-bottom: 10px; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box .lead {
            font-size: 16px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box .lead {
            font-size: 14px;
            margin-bottom: 0px; } }
      #section01 .flex .right_box h3 {
        line-height: 135%;
        color: #fff;
        font-size: 34px;
        font-weight: 500; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box h3 {
            font-size: 28px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box h3 {
            font-size: 22px; } }
      #section01 .flex .right_box .lead02 {
        line-height: 135%;
        color: #fff;
        font-size: 30px;
        font-weight: 500; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box .lead02 {
            font-size: 24px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box .lead02 {
            font-size: 20px; } }
      #section01 .flex .right_box .lead03 {
        line-height: 135%;
        color: #fff;
        font-size: 34px;
        font-weight: 500; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box .lead03 {
            font-size: 28px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box .lead03 {
            font-size: 22px; } }
      #section01 .flex .right_box .lead04 {
        color: #fff; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box .lead04 {
            font-size: 16px; } }
        @media (max-width: 767px) {
          #section01 .flex .right_box .lead04 {
            font-size: 14px; } }
      #section01 .flex .right_box ul {
        display: table;
        padding-right: 40px; }
        @media (max-width: 1230px) {
          #section01 .flex .right_box ul {
            width: 100%;
            padding-right: 0px; } }
        #section01 .flex .right_box ul li {
          display: table-cell;
          width: 33.333%; }
          #section01 .flex .right_box ul li img {
            width: 100%; }
      @media (max-width: 767px) {
        #section01 .flex .right_box p {
          line-height: 150%; } }
    #section01 .flex .left_box {
      display: block;
      width: 40%; }
      @media (max-width: 1230px) {
        #section01 .flex .left_box {
          display: table;
          width: 100%;
          margin: 0px auto; } }
      #section01 .flex .left_box .img_box01, #section01 .flex .left_box .img_box02 {
        width: 50%;
        position: relative; }
        @media (max-width: 1230px) {
          #section01 .flex .left_box .img_box01, #section01 .flex .left_box .img_box02 {
            display: table-cell; } }
        #section01 .flex .left_box .img_box01::before, #section01 .flex .left_box .img_box02::before {
          content: "";
          background: rgba(107, 193, 157, 0.2);
          display: block;
          position: absolute;
          width: 100%;
          height: 100%;
          bottom: -5%;
          right: -5%;
          z-index: -1; }
        #section01 .flex .left_box .img_box01 img, #section01 .flex .left_box .img_box02 img {
          width: 100%; }
      #section01 .flex .left_box .img_box01 {
        margin-right: 50%; }
        @media (max-width: 1230px) {
          #section01 .flex .left_box .img_box01 {
            margin: 0; } }
      #section01 .flex .left_box .img_box02 {
        margin-left: 50%; }
        @media (max-width: 1230px) {
          #section01 .flex .left_box .img_box02 {
            margin: 0; } }

/*--------------------------
section02
---------------------------*/
#section02 {
  color: #fff;
  padding: 0 0 60px; }
  @media (max-width: 1230px) {
    #section02 {
      padding: 0px 0 40px 0; } }
  @media (max-width: 767px) {
    #section02 {
      padding: 0 0 20px 0; } }
  #section02 .header_sec {
    position: relative;
    margin: 0 0 30px; }
    @media (max-width: 1230px) {
      #section02 .header_sec {
        margin: 0 0 10px; } }
    @media (max-width: 767px) {
      #section02 .header_sec {
        margin: 0 0 6px; } }
    #section02 .header_sec::before {
      content: "";
      background: #fff;
      width: 1px;
      height: 60px;
      margin: 0 0 0 34px;
      display: block; }
      @media (max-width: 1230px) {
        #section02 .header_sec::before {
          height: 40px;
          margin: 0 0 0 26px; } }
      @media (max-width: 767px) {
        #section02 .header_sec::before {
          height: 20px;
          margin: 0 0 0 19px; } }
    #section02 .header_sec .h_sec {
      color: #fff;
      font-size: 46px;
      font-weight: 500;
      line-height: 1.1;
      margin-bottom: 4px; }
      @media (max-width: 1230px) {
        #section02 .header_sec .h_sec {
          font-size: 38px; } }
      @media (max-width: 767px) {
        #section02 .header_sec .h_sec {
          font-size: 26px; } }
      #section02 .header_sec .h_sec sup {
        top: -1.2em;
        font-size: 22px; }
  #section02 .left_box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 30px; }
    @media (max-width: 1230px) {
      #section02 .left_box {
        display: table;
        width: 100%;
        margin: 0px auto 14px; } }
    @media (max-width: 767px) {
      #section02 .left_box {
        padding-top: 0;
        width: 100%;
        margin: 0px auto 6px; } }
    #section02 .left_box figure {
      width: 33.3333%;
      width: calc(100% / 3);
      display: block; }
      @media (max-width: 1230px) {
        #section02 .left_box figure {
          display: table-cell;
          width: calc(50% - 10px);
          margin-bottom: 10px; } }
      @media (max-width: 767px) {
        #section02 .left_box figure {
          margin: 0px; } }
      #section02 .left_box figure:nth-child(3) {
        padding-right: 0px; }
      #section02 .left_box figure img {
        border: 5px solid rgba(255, 255, 255, 0.2);
        width: 100%; }
        @media (max-width: 767px) {
          #section02 .left_box figure img {
            border: 0px;
            margin-bottom: 4px; } }
  #section02 .right_box {
    display: block;
    width: 100%; }
    #section02 .right_box ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 100%;
      margin-bottom: 30px; }
      @media (max-width: 767px) {
        #section02 .right_box ul {
          margin-bottom: 6px; } }
      #section02 .right_box ul li {
        line-height: 135%;
        font-size: 30px;
        display: block;
        width: calc(50% - 12px);
        background-color: rgba(0, 11, 172, 0.5);
        padding: 20px 30px;
        margin-bottom: 10px; }
        @media (max-width: 1230px) {
          #section02 .right_box ul li {
            width: 100%;
            margin: 0px 0px 10px; } }
        @media (max-width: 767px) {
          #section02 .right_box ul li {
            font-size: 20px;
            margin: 0px 0px 4px;
            padding: 8px 10px; } }
        #section02 .right_box ul li:nth-child(odd) {
          margin-right: 6px; }
          @media (max-width: 1230px) {
            #section02 .right_box ul li:nth-child(odd) {
              margin-right: 0px; } }
        #section02 .right_box ul li:nth-child(even) {
          margin-left: 6px; }
          @media (max-width: 1230px) {
            #section02 .right_box ul li:nth-child(even) {
              margin-left: 0px; } }
    #section02 .right_box .h_type {
      border-left: 4px solid #63c29b;
      margin: 0 0 30px;
      padding: 0px 0 0px 20px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      @media (max-width: 1230px) {
        #section02 .right_box .h_type {
          margin: 0 0 10px; } }
      @media (max-width: 767px) {
        #section02 .right_box .h_type {
          margin: 0 0 10px;
          line-height: 135%;
          padding: 0px 0 0px 10px; } }
      #section02 .right_box .h_type span {
        font-size: 34px;
        font-weight: 400; }
        @media (max-width: 1230px) {
          #section02 .right_box .h_type span {
            font-size: 28px; } }
        @media (max-width: 767px) {
          #section02 .right_box .h_type span {
            font-size: 18px; } }
    #section02 .right_box .lead05 {
      margin-bottom: 40px; }
      @media (max-width: 767px) {
        #section02 .right_box .lead05 {
          margin-bottom: 16px; } }
    #section02 .right_box .flex02 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 90%;
      margin: 0px auto; }
      @media (max-width: 767px) {
        #section02 .right_box .flex02 {
          width: 100%;
          display: block; } }
    #section02 .right_box .box {
      width: 49%;
      display: block;
      padding: 20px 30px;
      border: solid 1px #fff;
      margin-bottom: 20px; }
      @media (max-width: 767px) {
        #section02 .right_box .box {
          width: 100%;
          padding: 8px 10px;
          margin-bottom: 6px; } }
      #section02 .right_box .box h4 {
        font-size: 30px;
        text-align: center;
        margin-bottom: 20px; }
        @media (max-width: 767px) {
          #section02 .right_box .box h4 {
            font-size: 20px;
            margin-bottom: 8px; } }
    #section02 .right_box .odd {
      margin-right: 2%; }
    #section02 .right_box dl {
      background-color: rgba(0, 11, 172, 0.5);
      padding: 20px 30px;
      margin-bottom: 10px; }
      @media (max-width: 767px) {
        #section02 .right_box dl {
          padding: 8px 10px;
          margin: 0px 0px 4px; } }
      #section02 .right_box dl dt {
        line-height: 135%;
        font-size: 30px;
        margin-bottom: 6px; }
        @media (max-width: 767px) {
          #section02 .right_box dl dt {
            font-size: 20px;
            margin-bottom: 4px; } }
      #section02 .right_box dl dd {
        color: #f1f1f1;
        line-height: 150%; }

/*--------------------------
section03
---------------------------*/
#section03 {
  padding: 0 0 80px;
  background-color: #fff;
  position: relative; }
  @media (max-width: 1230px) {
    #section03 {
      padding: 0 0 60px; } }
  @media (max-width: 767px) {
    #section03 {
      padding: 0 0 30px; } }
  #section03 .header_sec {
    position: relative;
    margin: 0 0 30px; }
    @media (max-width: 1230px) {
      #section03 .header_sec {
        margin: 0 0 10px; } }
    @media (max-width: 767px) {
      #section03 .header_sec {
        margin: 0 0 6px; } }
    #section03 .header_sec::before {
      content: "";
      background: #004C9F;
      width: 1px;
      height: 60px;
      margin: 0 0 0 34px;
      display: block; }
      @media (max-width: 1230px) {
        #section03 .header_sec::before {
          height: 40px;
          margin: 0 0 0 26px; } }
      @media (max-width: 767px) {
        #section03 .header_sec::before {
          height: 20px;
          margin: 0 0 0 19px; } }
    #section03 .header_sec .h_sec {
      color: #004C9F;
      font-size: 46px;
      font-weight: 500;
      line-height: 1.1;
      margin-bottom: 20px; }
      @media (max-width: 1230px) {
        #section03 .header_sec .h_sec {
          font-size: 38px; } }
      @media (max-width: 767px) {
        #section03 .header_sec .h_sec {
          font-size: 22px;
          margin-bottom: 10px; } }
      #section03 .header_sec .h_sec sup {
        top: -1.2em;
        font-size: 22px;
        margin-bottom: 8px; }
    #section03 .header_sec .lead {
      color: #fff;
      line-height: 135%; }
      @media (max-width: 767px) {
        #section03 .header_sec .lead {
          font-size: 14px; } }
  #section03 .varieties {
    position: relative;
    z-index: 1; }
    @media (max-width: 1230px) {
      #section03 .varieties .inner {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch; } }
    #section03 .varieties table {
      font-size: 16px;
      width: 100%;
      margin-bottom: 8px;
      table-layout: fixed;
      line-height: 1.2; }
      @media (max-width: 1230px) {
        #section03 .varieties table {
          min-width: 800px; } }
      @media (max-width: 767px) {
        #section03 .varieties table {
          width: auto;
          min-width: auto;
          font-size: 12px; } }
      @media (max-width: 1230px) {
        #section03 .varieties table th,
        #section03 .varieties table td {
          font-size: 16px; } }
      @media (max-width: 767px) {
        #section03 .varieties table th,
        #section03 .varieties table td {
          font-size: 12px; } }
      #section03 .varieties table thead th {
        color: #fff;
        font-weight: 400;
        text-align: center;
        vertical-align: middle;
        background: #0068b6;
        padding: 8px 5px;
        position: relative; }
        @media (max-width: 767px) {
          #section03 .varieties table thead th {
            font-size: 14px;
            padding: 4px;
            line-height: 110%; } }
        #section03 .varieties table thead th.sub {
          font-size: 18px;
          color: #0068b6;
          background: #E8ECF4;
          padding: 8px 15px;
          border-bottom: solid 1px #ccc; }
          @media (max-width: 767px) {
            #section03 .varieties table thead th.sub {
              padding: 4px;
              font-size: 12px; } }
          #section03 .varieties table thead th.sub:not(:last-child)::before {
            content: "";
            background: #0068b6;
            width: 1px;
            height: 65%;
            display: block;
            position: absolute;
            top: 50%;
            right: 0;
            -webkit-transform: translate(0, -50%);
            -ms-transform: translate(0, -50%);
            transform: translate(0, -50%); }
      #section03 .varieties table tbody th {
        font-size: 18px;
        color: #0068b6;
        vertical-align: middle;
        font-weight: 400;
        background: #E8ECF4;
        padding: 12px 15px;
        border: solid 1px #ccc; }
        @media (max-width: 767px) {
          #section03 .varieties table tbody th {
            font-size: 12px;
            padding: 4px; } }
      #section03 .varieties table tbody td {
        color: #333;
        text-align: center;
        background: #fff;
        vertical-align: middle;
        padding: 14px 10px;
        border: solid 1px #ccc; }
        @media (max-width: 767px) {
          #section03 .varieties table tbody td {
            padding: 4px; } }
        #section03 .varieties table tbody td.red {
          color: #cc0000; }
      #section03 .varieties table tbody .bg_gray td {
        background: #f6f6f6; }
    #section03 .varieties p {
      font-size: 14px;
      text-align: right;
      margin-bottom: 20px; }
      @media (max-width: 767px) {
        #section03 .varieties p {
          font-size: 12px;
          margin-bottom: 10px; } }
  #section03 .flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 90%;
    margin: 0px auto 40px; }
    @media (max-width: 767px) {
      #section03 .flex {
        display: block;
        width: 100%;
        margin: 0px 0px 10px; } }
    #section03 .flex .left_box {
      width: 49%;
      margin-right: 2%;
      padding: 20px 30px;
      border: solid 1px #004C9F; }
      @media (max-width: 767px) {
        #section03 .flex .left_box {
          width: 100%;
          display: block;
          margin: 0px 0px 10px;
          padding: 10px; } }
      #section03 .flex .left_box h4 {
        color: #004C9F;
        font-size: 30px;
        text-align: center;
        margin-bottom: 20px; }
        @media (max-width: 767px) {
          #section03 .flex .left_box h4 {
            font-size: 20px;
            margin-bottom: 8px; } }
    #section03 .flex .right_box {
      width: 49%;
      padding-top: 60px; }
      @media (max-width: 767px) {
        #section03 .flex .right_box {
          display: block;
          width: 100%;
          padding: 0; } }
  #section03 h3 {
    color: #004C9F;
    text-align: center;
    font-size: 30px;
    margin-bottom: 20px; }
    @media (max-width: 767px) {
      #section03 h3 {
        font-size: 20px;
        margin-bottom: 6px; } }
  #section03 .flex02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 90%;
    margin: 0px auto; }
    @media (max-width: 767px) {
      #section03 .flex02 {
        width: 100%; } }
    #section03 .flex02 .left_box {
      width: 49%;
      margin-right: 2%; }
      @media (max-width: 767px) {
        #section03 .flex02 .left_box {
          width: 50%;
          margin-right: 0%; } }
    #section03 .flex02 .right_box {
      width: 49%; }
      @media (max-width: 767px) {
        #section03 .flex02 .right_box {
          width: 50%; } }
  #section03 .lead {
    line-height: 150%;
    text-align: center;
    margin-top: 20px; }
    @media (max-width: 767px) {
      #section03 .lead {
        margin-top: 8px;
        text-align: left;
        font-size: 14px; } }