.floatL {
  float: left; }

.floatR {
  float: right; }

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

/*@mixin fontH3 {
    font-size: 30px;    
}*/
/* grid */
.gridStyle55 div {
  float: left;
  width: 48%; }
  .gridStyle55 div:first-child {
    margin-right: 4%; }

@media all and (max-width: 750px) {
  .gridStyle55 div {
    float: none;
    width: 100%; }
    .gridStyle55 div:first-child {
      margin-right: 0%; } }

.blog4 .summary .word {
  margin-top: 40px;
  margin-bottom: 50px; }
  .blog4 .summary .word h1 {
    margin-bottom: 30px;
    font-size: 32px;
    font-weight: bold;
    color: #696969;
    text-align: center; }
  .blog4 .summary .word h2 {
    padding: 0 55px;
    font-size: 20px;
    font-weight: bold;
    font-style: italic;
    line-height: 30px; }

.blog4 .summary .content img {
  float: left;
  display: block;
  width: 67.7%;
  margin-bottom: 27px; }

.blog4 .summary .content p {
  float: right;
  display: block;
  width: 29.5%; }

.blog4 .introduce {
  margin-top: 70px; }
  .blog4 .introduce img {
    padding-bottom: 30px; }
  .blog4 .introduce .content > li {
    margin-bottom: 40px; }
    .blog4 .introduce .content > li h2 {
      margin-bottom: 40px;
      color: #2a86c1;
      font-size: 20px;
      font-weight: bold; }
    .blog4 .introduce .content > li p {
      padding-bottom: 30px; }
    .blog4 .introduce .content > li ul {
      display: block; }
      .blog4 .introduce .content > li ul li .pointName {
        margin-top: 20px; }
        .blog4 .introduce .content > li ul li .pointName img {
          float: left;
          width: 18px; }
        .blog4 .introduce .content > li ul li .pointName h3 {
          padding: 3px 0 0 10px;
          float: left;
          color: #696969;
          font-weight: bold; }

/* RWD */
@media all and (max-width: 750px) {
  .blog4 .summary {
    margin-bottom: 30px; }
    .blog4 .summary .word {
      margin-bottom: 30px; }
      .blog4 .summary .word h1 {
        font-size: 34px;
        line-height: 42px;
        text-align: left; }
        .blog4 .summary .word h1 span {
          display: block; }
      .blog4 .summary .word h2 {
        padding: 0;
        font-size: 23px;
        line-height: 34px; }
    .blog4 .summary .content img {
      float: none;
      width: 100%;
      margin-bottom: 30px; }
    .blog4 .summary .content p {
      float: none;
      width: 100%;
      font-size: 23px;
      line-height: 34px; }
  .blog4 .introduce {
    margin: 70px 0 0 0; }
    .blog4 .introduce img {
      padding-bottom: 30px; }
    .blog4 .introduce .content > li {
      margin-bottom: -3px; }
      .blog4 .introduce .content > li h2 {
        position: relative;
        display: block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border-color: #d2d2d2ce;
        border-style: solid;
        border-width: 3px 0;
        padding: 25px 70px 25px 60px;
        margin-bottom: 0px;
        font-size: 34px;
        color: #696969;
        font-weight: initial;
        cursor: pointer; }
        .blog4 .introduce .content > li h2:after {
          content: "";
          top: 15px;
          right: 30px;
          -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
          position: absolute;
          border-width: 0 3px 3px 0;
          border-style: solid;
          border-color: #2a86c1;
          width: 30px;
          height: 30px; }
        .blog4 .introduce .content > li h2:hover {
          background-color: #dcdcdc; }
        .blog4 .introduce .content > li h2.active {
          background-color: #dcdcdc; }
      .blog4 .introduce .content > li ul {
        margin: 30px 60px;
        display: none; }
        .blog4 .introduce .content > li ul li .pointName {
          margin-top: 20px; }
          .blog4 .introduce .content > li ul li .pointName img {
            float: left;
            width: 38px; }
          .blog4 .introduce .content > li ul li .pointName h3 {
            padding: 5px 0 0 10px;
            float: left;
            font-size: 30px; } }

@media all and (max-width: 576px) {
  .blog4 .summary .content img {
    margin-bottom: 15px; }
  .blog4 .summary .content p {
    font-size: 18px;
    line-height: 28px; }
  .blog4 .introduce {
    margin-top: 70px; }
    .blog4 .introduce img {
      padding-bottom: 15px; }
    .blog4 .introduce .content > li {
      margin-bottom: -3px; }
      .blog4 .introduce .content > li h2 {
        font-size: 22px;
        line-height: 31px;
        padding: 15px 50px 15px 30px; }
        .blog4 .introduce .content > li h2:after {
          top: 15px;
          right: 25px;
          width: 20px;
          height: 20px; }
      .blog4 .introduce .content > li p {
        padding-bottom: 15px; }
      .blog4 .introduce .content > li ul {
        margin: 30px; }
        .blog4 .introduce .content > li ul li .pointName {
          margin-top: 20px; }
          .blog4 .introduce .content > li ul li .pointName img {
            width: 20px; }
          .blog4 .introduce .content > li ul li .pointName h3 {
            padding: 3px 0 0 10px;
            font-size: 20px; } }