.contents section {
  position: relative;
  padding: 70px 0 0;
  margin: 0 0 10px; }
  .contents section .inner {
    width: 1120px;
    margin: auto; }
  .contents section .catch {
    font-size: 60px;
    font-weight: 700;
    letter-spacing: 0.01em;
    margin: 0 0 10px; }
  .contents section .catch_sub {
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0;
    margin: 0 0 40px; }
  .contents section .text {
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0; }
  .contents section .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    min-width: 1366px;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%); }

.contents .feature_1 {
  height: 745px;
  background: #f9f7f6; }
  .contents .feature_1 .bg .images_1_1 {
    position: absolute;
    top: 270px;
    left: 24.7%;
    margin: 0 0 0 -189px; }
    .contents .feature_1 .bg .images_1_1 img {
      position: relative;
      z-index: 1; }
    .contents .feature_1 .bg .images_1_1 .point {
      width: 165px;
      height: 165px;
      font-size: 14px;
      font-weight: 500;
      line-height: 20px;
      text-align: center;
      border-radius: 50%;
      display: flex;
      flex-wrap: wrap;
      align-content: center;
      align-items: center;
      justify-content: center;
      text-align: center;
      z-index: 0;
      position: absolute;
      top: 32px;
      left: 245px; }
      .contents .feature_1 .bg .images_1_1 .point svg {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1; }
        .contents .feature_1 .bg .images_1_1 .point svg circle {
          fill: none;
          stroke: #2c2d2d;
          stroke-linecap: round;
          stroke-linejoin: round;
          stroke-width: 1.85px;
          stroke-dasharray: 0 4.6; }
      .contents .feature_1 .bg .images_1_1 .point .in {
        margin: 0;
        position: relative;
        z-index: 2; }
        .contents .feature_1 .bg .images_1_1 .point .in .rice {
          font-size: 14px;
          position: absolute;
          top: 25px;
          left: 107px; }
      .contents .feature_1 .bg .images_1_1 .point .big {
        font-size: 42px;
        line-height: 42px;
        font-weight: 500; }
    .contents .feature_1 .bg .images_1_1 .notice {
      font-size: 11px;
      position: absolute;
      top: 380px;
      left: 185px;
      width: 17em; }
  .contents .feature_1 .bg .images_1_2 {
    position: absolute;
    top: 100px;
    left: 66.6%;
    margin: 0 0 0 -303px; }

.contents .feature_2 {
  height: 1055px;
  background: #f4ada8;
  color: #ffffff;
  padding: 70px 0 0; }
  .contents .feature_2 .inner {
    height: 100%;
    position: relative; }
  .contents .feature_2 .animate {
    width: 1120px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0 0 0 -560px; }
    .contents .feature_2 .animate .layer {
      display: block;
      position: absolute;
      top: 0;
      left: 0; }
    .contents .feature_2 .animate .camera {
      top: 515px;
      left: 478px;
      z-index: 2; }
    .contents .feature_2 .animate .photo_clip {
      width: 140px;
      top: 475px;
      left: 115px;
      z-index: 3; }
    .contents .feature_2 .animate .photo {
      width: 300px;
      top: 463px;
      left: 0;
      z-index: 15;
      position: absolute; }
      .contents .feature_2 .animate .photo img {
        width: 100%;
        position: relative; }
      .contents .feature_2 .animate .photo .bdr {
        width: 140px;
        height: 193px;
        position: absolute;
        border: 2px solid transparent;
        top: 8px;
        left: 115px;
        z-index: 1; }
        .contents .feature_2 .animate .photo .bdr::before, .contents .feature_2 .animate .photo .bdr::after {
          content: "";
          position: absolute;
          z-index: 2;
          width: 0;
          height: 0;
          border: 1px solid transparent; }
        .contents .feature_2 .animate .photo .bdr::before {
          top: -1px;
          left: -1px; }
        .contents .feature_2 .animate .photo .bdr::after {
          bottom: -1px;
          right: -1px; }
        .contents .feature_2 .animate .photo .bdr.active::before, .contents .feature_2 .animate .photo .bdr.active::after {
          width: 100%;
          height: 100%; }
        .contents .feature_2 .animate .photo .bdr.active::before {
          border-bottom-color: #fff;
          border-left-color: #fff;
          transition: height .3s, width .3s .3s; }
        .contents .feature_2 .animate .photo .bdr.active::after {
          border-top-color: #fff;
          border-right-color: #fff;
          transition: height .3s, width .3s .3s; }
    .contents .feature_2 .animate .photo_am {
      top: 475px;
      left: 115px; }
      .contents .feature_2 .animate .photo_am .layer {
        position: absolute; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(1) {
          width: 138px;
          top: 550px;
          left: 216px;
          z-index: 16;
          opacity: .9; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(2) {
          width: 124px;
          top: 614px;
          left: 280px;
          z-index: 8;
          opacity: .8; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(3) {
          width: 108px;
          top: 669px;
          left: 337px;
          z-index: 7;
          opacity: .7; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(4) {
          width: 92px;
          top: 713px;
          left: 394px;
          z-index: 6;
          opacity: .6; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(5) {
          width: 78px;
          top: 743px;
          left: 440px;
          z-index: 5;
          opacity: .5; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(6) {
          width: 60px;
          top: 770px;
          left: 493px;
          z-index: 4;
          opacity: .4; }
        .contents .feature_2 .animate .photo_am .layer:nth-child(7) {
          width: 60px;
          top: 748px;
          left: 538px;
          z-index: 3;
          opacity: .3; }
    .contents .feature_2 .animate .print {
      top: 405px;
      left: 535px;
      z-index: 1; }
    .contents .feature_2 .animate .pola {
      top: 191px;
      left: 757px;
      z-index: 1; }
    .contents .feature_2 .animate .sound_1 {
      width: 122px;
      top: 162px;
      left: 1100px;
      overflow: hidden;
      -webkit-transform-origin: left bottom;
              transform-origin: left bottom; }
      .contents .feature_2 .animate .sound_1 img {
        position: relative; }
      .contents .feature_2 .animate .sound_1 .notes .note {
        position: absolute; }
        .contents .feature_2 .animate .sound_1 .notes .note:nth-child(1) {
          width: 45px;
          top: 28px;
          left: 9px; }
        .contents .feature_2 .animate .sound_1 .notes .note:nth-child(2) {
          width: 28px;
          top: 16px;
          left: 74px; }
        .contents .feature_2 .animate .sound_1 .notes .note:nth-child(3) {
          width: 22px;
          top: 65px;
          left: 49px; }
    .contents .feature_2 .animate .sound_2 {
      top: 724px;
      left: 57px;
      overflow: hidden;
      z-index: 5; }
      .contents .feature_2 .animate .sound_2 img {
        position: relative; }
    .contents .feature_2 .animate .phone {
      width: 342px;
      height: 463px;
      position: absolute;
      top: 202px;
      left: 872px;
      z-index: 2; }
      .contents .feature_2 .animate .phone .phone_in {
        position: relative;
        -webkit-transform-origin: right bottom;
                transform-origin: right bottom; }
      .contents .feature_2 .animate .phone .phone_dp {
        top: 135px;
        left: 132px;
        -webkit-transform: rotate(-20deg);
                transform: rotate(-20deg);
        overflow: hidden; }
        .contents .feature_2 .animate .phone .phone_dp img {
          position: relative; }
    .contents .feature_2 .animate .arrow {
      top: 315px;
      left: 624px; }
    .contents .feature_2 .animate .text_circle {
      top: 502px;
      left: 787px;
      z-index: 2; }
  .contents .feature_2 .text {
    margin: 0 0 420px; }
  .contents .feature_2 .text_circle {
    width: 164px;
    height: 164px;
    position: absolute;
    margin: 0 0 -30px; }
    .contents .feature_2 .text_circle svg {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0; }
      .contents .feature_2 .text_circle svg circle {
        fill: none;
        stroke: #fff;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 1.85px;
        stroke-dasharray: 0 4.6; }
    .contents .feature_2 .text_circle .text_in {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      font-size: 14px;
      line-height: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center; }
  .contents .feature_2 .wrapper_sample .text_circle {
    position: absolute;
    top: 600px;
    left: 950px; }
  .contents .feature_2 .wrapper_sample .sample {
    position: absolute;
    top: 720px;
    left: 775px; }

.contents .feature_3 {
  height: 3080px;
  background: #fff;
  color: #fff;
  position: relative;
  overflow: hidden; }
  .contents .feature_3 .catch,
  .contents .feature_3 .catch_sub,
  .contents .feature_3 .text {
    position: relative;
    z-index: 1; }
  .contents .feature_3 .label {
    font-size: 40px;
    line-height: 38px;
    font-weight: 700;
    margin: 0 0 10px;
    color: #2b2f2f; }
    .contents .feature_3 .label .brackets {
      font-size: 28px; }
    .contents .feature_3 .label .label_small {
      font-size: 16px;
      line-height: 22px;
      font-weight: 700;
      vertical-align: middle; }
  .contents .feature_3 .frames {
    position: relative;
    z-index: 5;
    margin: 540px 0 -295px; }
    .contents .feature_3 .frames .list {
      overflow: hidden; }
      .contents .feature_3 .frames .list > li {
        float: left;
        overflow: hidden;
        margin: 0 13px 13px 0; }
        .contents .feature_3 .frames .list > li .thumb_frames {
          width: 94px;
          height: 125px;
          background: url(../img/features/feature_image_frame_3.jpg) no-repeat;
          background-position: 0 0;
          background-size: 940px 500px;   /* height500pxに修正 */
          margin: 0 0 3px; }
        .contents .feature_3 .frames .list > li span {
          font-size: 12px;
          color: #2c2d2d; }
        /* 20200722_修正・追記ヵ所 */
        .contents .feature_3 .frames .list > li:nth-child(10), .contents .feature_3 .frames .list > li:nth-child(20), .contents .feature_3 .frames .list > li:nth-child(25),.contents .feature_3 .frames .list > li:nth-child(30),.contents .feature_3 .frames .list > li:nth-child(36){
          float: none;
          margin-right: 0; }
          .contents .feature_3 .frames .list > li:nth-child(10):after, .contents .feature_3 .frames .list > li:nth-child(20):after, .contents .feature_3 .frames .list > li:nth-child(25):after,.contents .feature_3 .frames .list > li:nth-child(30):after,.contents .feature_3 .frames .list > li:nth-child(36):after{
                    content: '';
                    display: block;
                    height: 0;
                    clear: both;
                  }
@media screen and (min-width: 768px) {
    .contents .feature_3 .frames .list > li:nth-child(n+11) .thumb_frames {
        margin: 24px 0 0 0; /* 20200811_修正 */
    }
}

          /* end */
        .contents .feature_3 .frames .list > li:nth-child(11), .contents .feature_3 .frames .list > li:nth-child(26) {
          margin-left: 60px; }
        .contents .feature_3 .frames .list > li:nth-child(1) .thumb_frames {
          background-position: -0px 0; }
        .contents .feature_3 .frames .list > li:nth-child(2) .thumb_frames {
          background-position: -94px 0; }
        .contents .feature_3 .frames .list > li:nth-child(3) .thumb_frames {
          background-position: -188px 0; }
        .contents .feature_3 .frames .list > li:nth-child(4) .thumb_frames {
          background-position: -282px 0; }
        .contents .feature_3 .frames .list > li:nth-child(5) .thumb_frames {
          background-position: -376px 0; }
        .contents .feature_3 .frames .list > li:nth-child(6) .thumb_frames {
          background-position: -470px 0; }
        .contents .feature_3 .frames .list > li:nth-child(7) .thumb_frames {
          background-position: -564px 0; }
        .contents .feature_3 .frames .list > li:nth-child(8) .thumb_frames {
          background-position: -658px 0; }
        .contents .feature_3 .frames .list > li:nth-child(9) .thumb_frames {
          background-position: -752px 0; }
        .contents .feature_3 .frames .list > li:nth-child(10) .thumb_frames {
          background-position: -846px 0; }
        .contents .feature_3 .frames .list > li:nth-child(11) .thumb_frames {
          background-position: -0px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(12) .thumb_frames {
          background-position: -94px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(13) .thumb_frames {
          background-position: -188px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(14) .thumb_frames {
          background-position: -282px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(15) .thumb_frames {
          background-position: -376px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(16) .thumb_frames {
          background-position: -470px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(17) .thumb_frames {
          background-position: -564px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(18) .thumb_frames {
          background-position: -658px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(19) .thumb_frames {
          background-position: -752px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(20) .thumb_frames {
          background-position: -846px -125px; }
        .contents .feature_3 .frames .list > li:nth-child(21) .thumb_frames {
          background-position: -0px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(22) .thumb_frames {
          background-position: -94px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(23) .thumb_frames {
          background-position: -188px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(24) .thumb_frames {
          background-position: -282px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(25) .thumb_frames {
          background-position: -376px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(26) .thumb_frames {
          background-position: -470px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(27) .thumb_frames {
          background-position: -564px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(28) .thumb_frames {
          background-position: -658px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(29) .thumb_frames {
          background-position: -752px -250px; }
        .contents .feature_3 .frames .list > li:nth-child(30) .thumb_frames {
          background-position: -846px -250px; }
        /* 20200722_追加 */
        .contents .feature_3 .frames .list > li:nth-child(31) .thumb_frames {
          background-position: -0px -375px; }
        .contents .feature_3 .frames .list > li:nth-child(32) .thumb_frames {
          background-position: -94px -375px; }
        .contents .feature_3 .frames .list > li:nth-child(33) .thumb_frames {
          background-position: -188px -375px; }
        .contents .feature_3 .frames .list > li:nth-child(34) .thumb_frames {
          background-position: -282px -375px; }
        .contents .feature_3 .frames .list > li:nth-child(35) .thumb_frames {
          background-position: -376px -375px; }
        .contents .feature_3 .frames .list > li:nth-child(36) .thumb_frames {
          background-position: -470px -375px; }
        /* end */
  /* 20200722_追記 */
  .contents .feature_3 .shortcut {
    width: 465px;
    color: #2c2d2d;
    position: relative;
    float: right;
    margin-top: -150px;
    margin-left: 650px;
   }
   /* End */
    .contents .feature_3 .shortcut:after {
      content: "";
      display: block;
      height: 0;
      clear: both; }
    .contents .feature_3 .shortcut .thumb_product {
      position: absolute;
      top: -15px;
      left: 215px; }
    .contents .feature_3 .shortcut .text_sub {
      width: 240px;
      font-size: 16px;
      font-weight: 700;
      line-height: 26px; }

    .contents .feature_3 .custom{
      color: #2c2d2d;
      position: relative;
      z-index: 1;
      width: 920px;
      height: 570px;
      border: 1px solid #000;
      margin: 355px auto 0;
    }

    .contents .feature_3 .custom::before{
      content: '';
      display: block;
      height: 0;
      clear: both;
    }

    .contents .feature_3 .custom .txt_frame{
      width: 240px;
      font-size: 20px;
      font-weight: 500;
      margin: -25px auto 0;
      background: #fff;
      text-align: center;
      position: relative;
    }

    .contents .feature_3 .custom .txt_frame::before{
      content: '';
      width: 27px;
      height: 27px;
      background: url(../img/features/title_custom_lline.svg) no-repeat;
      background-size: contain;
      position: absolute;
      top: 5px;
      left: 25px;
    }

    .contents .feature_3 .custom .txt_frame::after{
      content: '';
      width: 27px;
      height: 27px;
      background: url(../img/features/title_custom_rline.svg) no-repeat;
      background-size: contain;
      position: absolute;
      top: 5px;
      right: 25px;
    }

    .contents .feature_3 .custom .title_custom{
      font-size: 40px;
      font-weight: bold;
      text-align: center;
      margin: 20px auto 0;
    }

    .contents .feature_3 .custom .title_custom_low{
      font-size: 16px;
      font-weight: 500;
      text-align: center;
      margin: auto;
      letter-spacing: 0.1em;
    }

    .contents .feature_3 .custom .label_example{
      font-size: 18px;
      text-align: center;
      margin: 30px auto 0;
    }

    .contents .feature_3 .img_custom{
      margin: 20px auto 0;
      display: block;
      position: relative;
      left: 15px;
    }

    .contents .feature_3 .notice_custom{
      display: block;
      margin: -45px auto 0;
      text-align: right;
      font-size: 11px;
      width: 715px;
    }

  .contents .feature_3 .filter {
    width: 770px;
    color: #2c2d2d;
    position: relative;
    margin: 70px auto 0;
    z-index: 1; }
    .contents .feature_3 .filter .label .label_small {
      display: block; }
    .contents .feature_3 .filter .text_sub {
      width: 230px;
      margin: 0 0 40px; }
    .contents .feature_3 .filter .thumb_big {
      position: absolute;
      top: -35px;
      left: 365px;
      z-index: 1; }
      .contents .feature_3 .filter .thumb_big img {
        margin: 0 0 -45px; }
      .contents .feature_3 .filter .thumb_big span {
        font-size: 12px;
        color: #2c2d2d; }
    .contents .feature_3 .filter .list {
      overflow: hidden; }
      .contents .feature_3 .filter .list > li {
        width: 115px;
        float: left;
        overflow: hidden;
        margin: 0 10px 12px 0; }
        .contents .feature_3 .filter .list > li img {
          display: block; }
        .contents .feature_3 .filter .list > li span {
          font-size: 12px;
          color: #2c2d2d; }
        .contents .feature_3 .filter .list > li:nth-child(3) {
          float: none; }
  .contents .feature_3 .slant {
    width: 100%;
    height: 0;
    position: absolute;
    background: #f4ada8;
    z-index: 0;
    top: 0;
    left: 0; }
    .contents .feature_3 .slant::before, .contents .feature_3 .slant::after {
      content: "";
      display: block;
      width: 0;
      height: 0;
      position: absolute; }
    .contents .feature_3 .slant::before {
      top: 100%;
      left: 50%;
      border-style: solid;
      border-width: calc(6500px * 0.2678) 6500px 0 0;
      border-color: #f4ada8 transparent transparent transparent;
      margin: 0 0 0 -3250px; }
    .contents .feature_3 .slant::after {
      top: 0;
      left: 50%;
      border-style: solid;
      border-width: 0 0 calc(6500px * 0.2678) 6500px;
      border-color: transparent transparent #f4ada8 transparent;
      margin: 0 0 0 -3250px; }
    .contents .feature_3 .slant.slant_1::after {
      display: none; }
    .contents .feature_3 .slant.slant_2 {
      margin: 1390px 0 0; }
      .contents .feature_3 .slant.slant_2::before {
        display: none; }
  .contents .feature_3 .bg .images_3 {
    position: absolute;
    top: 50px;
    left: 63.5%;
    margin: 0 0 0 -857px; }

.contents .feature_4 {
  height: 1200px;
  background: #2c2d2d;
  color: #fff;
  overflow: hidden;
  position: relative; }
  .contents .feature_4 .bg .images_4_1 {
    position: absolute;
    top: 365px;
    left: 50%;
    margin: 0 0 0 -445px; }
  .contents .feature_4 .bg .images_4_2 {
    position: absolute;
    top: 908px;
    left: 50%;
    margin: 0 0 0 -645px; }

.contents .feature_5 {
  height: 770px;
  background: #2c2d2d;
  color: #fff;
  position: relative;
  overflow: hidden; }
  .contents .feature_5 .bg .images_5 {
    position: absolute;
    top: 240px;
    left: 61.5%;
    margin: 0 0 0 -386.5px; }

.contents .feature_6 {
  height: 790px;
  background: #faf9f8;
  color: #2c2d2d;
  position: relative; }
  .contents .feature_6 .catch_sub .rice {
    vertical-align: super;
    font-size: 15px;
    left: -10px;
    position: relative;}
  .contents .feature_6 .bg .points {
    width: 600px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 375px;
    left: 34.5%;
    margin: 0 0 0 -300px; }
    .contents .feature_6 .bg .points .point {
      width: 275px;
      height: 275px;
      font-size: 25px;
      font-weight: 500;
      line-height: 40px;
      text-align: center;
      border-radius: 50%;
      display: flex;
      flex-wrap: wrap;
      align-content: center;
      align-items: center;
      justify-content: center;
      text-align: center;
      position: relative;
      z-index: 1; }
      .contents .feature_6 .bg .points .point svg {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1; }
        .contents .feature_6 .bg .points .point svg circle {
          fill: none;
          stroke: #2c2d2d;
          stroke-linecap: round;
          stroke-linejoin: round;
          stroke-width: 1.85px;
          stroke-dasharray: 0 4.6; }
      .contents .feature_6 .bg .points .point .in {
        margin: 0;
        position: relative;
        z-index: 2; }
        .contents .feature_6 .bg .points .point .in .rice {
          font-size: 14px;
          position: absolute; }
      .contents .feature_6 .bg .points .point .big {
        font-size: 75px;
        font-weight: 700;
        line-height: 80px; }
      .contents .feature_6 .bg .points .point:nth-child(1) {
        line-height: 40px; }
        .contents .feature_6 .bg .points .point:nth-child(1) .rice {
          top: 75px;
          left: 130px; }
      .contents .feature_6 .bg .points .point:nth-child(2) {
        line-height: 30px; }
        .contents .feature_6 .bg .points .point:nth-child(2) .rice {
          top: 0;
          left: 115px; }
    .contents .feature_6 .bg .points .notice {
      font-size: 11px;
      position: absolute;
      top: 260px;
      left: 210px;
      width: 17em; }
  .contents .feature_6 .bg .images_6 {
    position: absolute;
    top: 70px;
    left: 77.5%;
    margin: 0 0 0 -162px;
    z-index: 1;
    width: 324px; }

@media screen and (max-width: 768px) {
  .contents section {
    padding: 45px 0 0;
    margin: 0 0 10px; }
    .contents section .inner {
      width: auto;
      margin: 0 7%; }
    .contents section .catch {
      font-size: 30px;
      line-height: 34px;
      font-weight: 700;
      letter-spacing: 0.01em;
      margin: 0 0 5px; }
    .contents section .catch_sub {
      font-size: 15px;
      line-height: 20px;
      font-weight: 500;
      letter-spacing: 0;
      margin: 0 0 22px; }
    .contents section .text {
      font-size: 12px;
      line-height: 20px;
      font-weight: 400; }
    .contents section .bg {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 50%;
      min-width: 1366px;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%); }
  .contents .feature_1 {
    height: 867px; }
    .contents .feature_1 .bg .images_1_1 {
      width: 284px;
      position: absolute;
      top: 525px;
      left: 49.5%;
      margin: 0 0 0 -142px; }
      .contents .feature_1 .bg .images_1_1 img {
        width: 100%;
        display: block; }
      .contents .feature_1 .bg .images_1_1 .point {
        width: 135px;
        height: 135px;
        font-size: 13px;
        font-weight: 500;
        line-height: 15px;
        text-align: center;
        border-radius: 50%;
        display: flex;
        flex-wrap: wrap;
        align-content: center;
        align-items: center;
        justify-content: center;
        text-align: center;
        z-index: 0;
        position: absolute;
        top: -56px;
        left: 164px; }
        .contents .feature_1 .bg .images_1_1 .point svg {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          z-index: 1; }
          .contents .feature_1 .bg .images_1_1 .point svg circle {
            fill: none;
            stroke: #2c2d2d;
            stroke-linecap: round;
            stroke-linejoin: round;
            stroke-width: 1.85px;
            stroke-dasharray: 0 4.6; }
        .contents .feature_1 .bg .images_1_1 .point .in {
          margin: 0;
          position: relative;
          z-index: 2; }
          .contents .feature_1 .bg .images_1_1 .point .in .rice {
            font-size: 10px;
            position: absolute;
            top: 23px;
            left: 82px; }
        .contents .feature_1 .bg .images_1_1 .point .big {
          font-size: 32px;
          font-weight: 500; }
      .contents .feature_1 .bg .images_1_1 .notice {
        width: 13em;
        font-size: 10px;
        position: absolute;
        top: 90px;
        left: 195px;
        -webkit-transform: scale(0.9);
                transform: scale(0.9); }
    .contents .feature_1 .bg .images_1_2 {
      width: 300px;
      position: absolute;
      top: 153px;
      left: 50.2%;
      margin: 0 0 0 -150px; }
  .contents .feature_2 {
    height: 840px;
    padding: 45px 0 0; }
    .contents .feature_2 .animate {
      width: 100%;
      left: 0;
      margin: 0; }
      .contents .feature_2 .animate .sp_part {
        width: 100%;
        max-width: 375px;
        height: 100%;
        position: absolute;
        top: 0;
        left: 50%;
        margin: 0 0 0 -187.5px; }
        .contents .feature_2 .animate .sp_part.sp_part_1 {
          -webkit-transform: translateX(0);
                  transform: translateX(0);
          transition: all .5s ease 0s;
          opacity: 1; }
          .contents .feature_2 .animate .sp_part.sp_part_1.hide {
            -webkit-transform: translateX(-100%);
                    transform: translateX(-100%);
            opacity: 0; }
        .contents .feature_2 .animate .sp_part.sp_part_2 {
          -webkit-transform: translateX(100%);
                  transform: translateX(100%);
          opacity: 0; }
          .contents .feature_2 .animate .sp_part.sp_part_2.active {
            -webkit-transform: translateX(0);
                    transform: translateX(0);
            opacity: 1; }
      .contents .feature_2 .animate .camera {
        width: 135px;
        top: 32.5%;
        left: 57%; }
      .contents .feature_2 .animate .print {
        width: 80px;
        top: 26%;
        left: 65%; }
      .contents .feature_2 .animate .photo_clip {
        width: 58px;
        top: 33%;
        left: 18%;
        z-index: 3; }
      .contents .feature_2 .animate .photo {
        width: 125px;
        top: 32.5%;
        left: 7%; }
        .contents .feature_2 .animate .photo .bdr {
          width: 60px;
          height: 85px;
          top: 2px;
          left: 47px; }
      .contents .feature_2 .animate .photo_am {
        width: 170px;
        top: 33%;
        left: 20%;
        position: relative; }
        .contents .feature_2 .animate .photo_am .layer {
          position: absolute; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(1) {
            width: 58px;
            top: 32px;
            left: 44px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(2) {
            width: 50px;
            top: 61px;
            left: 73px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(3) {
            width: 44px;
            top: 82px;
            left: 94px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(4) {
            width: 38px;
            top: 100px;
            left: 118px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(5) {
            width: 38px;
            top: 103px;
            left: 132px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(6) {
            width: 25px;
            top: 103px;
            left: 150px; }
          .contents .feature_2 .animate .photo_am .layer:nth-child(7) {
            width: 25px;
            top: 102px;
            left: 166px; }
      .contents .feature_2 .animate .arrow {
        width: 15%;
        top: 19.5%;
        left: 78%; }
      .contents .feature_2 .animate .sound_1 {
        width: 64px;
        top: 26.5%;
        left: 54%;
        overflow: hidden;
        -webkit-transform-origin: left bottom;
                transform-origin: left bottom; }
        .contents .feature_2 .animate .sound_1 img {
          width: 100%;
          position: relative; }
        .contents .feature_2 .animate .sound_1 .notes .note {
          position: absolute; }
          .contents .feature_2 .animate .sound_1 .notes .note:nth-child(1) {
            width: 22px;
            top: 18px;
            left: 4px; }
          .contents .feature_2 .animate .sound_1 .notes .note:nth-child(2) {
            width: 13px;
            top: 12px;
            left: 38px; }
          .contents .feature_2 .animate .sound_1 .notes .note:nth-child(3) {
            width: 11px;
            top: 36px;
            left: 24px; }
      .contents .feature_2 .animate .sound_2 {
        width: 257px;
        top: 44%;
        left: 5%; }
        .contents .feature_2 .animate .sound_2 img {
          width: 100%; }
      .contents .feature_2 .animate .pola {
        width: 105px;
        top: 30.5%;
        left: 7%; }
      .contents .feature_2 .animate .phone {
        width: 172px;
        top: 32.5%;
        left: 23%; }
        .contents .feature_2 .animate .phone .phone_in {
          width: 100%; }
        .contents .feature_2 .animate .phone .phone_dp {
          width: 35%;
          top: 14%;
          left: 39%; }
          .contents .feature_2 .animate .phone .phone_dp img {
            width: 100%; }
      .contents .feature_2 .animate .text_circle {
        width: 145px;
        height: 145px;
        top: 34.5%;
        left: 58%; }
        .contents .feature_2 .animate .text_circle .text_in {
          font-size: 12px;
          line-height: 18px; }
          .contents .feature_2 .animate .text_circle .text_in .note {
            width: 18px;
            position: absolute;
            top: 63px;
            left: 85%;
            margin: 0 0 0 -9px; }
    .contents .feature_2 .text {
      margin: 0 0 610px; }
    .contents .feature_2 .wrapper_sample .text_circle {
      position: absolute;
      width: 145px;
      height: 145px;
      top: 62%;
      left: 51%;
      margin: 0 0 0 -72.5px; }
      .contents .feature_2 .wrapper_sample .text_circle .text_in {
        font-size: 12px;
        line-height: 18px; }
        .contents .feature_2 .wrapper_sample .text_circle .text_in .note {
          width: 25px;
          position: absolute;
          top: 20px;
          left: 50%;
          margin: 0 0 0 -12.5px; }
    .contents .feature_2 .wrapper_sample .sample {
      top: 75%;
      left: 50%;
      margin: 0px 0 0 -170px;
      width: 340px; }
  .contents .feature_3 {
    height: 2160px;
    overflow: hidden; }
    .contents .feature_3 .label {
      font-size: 20px;
      color: #2c2d2d;
      margin: 0 0 5px; }
      .contents .feature_3 .label .brackets {
        font-size: 14px; }
      .contents .feature_3 .label .label_small {
        font-size: 12px;
        display: block;
        line-height: 2; }
    .contents .feature_3 .frames {
      margin: 540px 0 30px; }
      .contents .feature_3 .frames .wrap_outer_list {
        width: calc(100% + 60px);
        overflow: hidden;
        position: relative;
        margin: 0 -30px; }
        .contents .feature_3 .frames .wrap_outer_list::before {
          content: "";
          display: block;
          width: 40px;
          height: 100%;
          background: linear-gradient(to right, white 50%, rgba(255, 255, 255, 0) 100%);
          position: absolute;
          top: 0;
          left: 0;
          z-index: 1; }
        .contents .feature_3 .frames .wrap_outer_list::after {
          content: "";
          display: block;
          width: 40px;
          height: 100%;
          background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 50%);
          position: absolute;
          top: 0;
          right: 0;
          z-index: 1; }
        .contents .feature_3 .frames .wrap_outer_list .arrow {
          width: 8px;
          position: absolute;
          top: 37%;
          z-index: 2; }
          .contents .feature_3 .frames .wrap_outer_list .arrow.arrow_l {
            left: 10px; }
          .contents .feature_3 .frames .wrap_outer_list .arrow.arrow_r {
            -webkit-transform: rotate(180deg);
                    transform: rotate(180deg);
            right: 10px; }
      .contents .feature_3 .frames .wrap_list {
        width: 100%;
        padding: 0 40px;
        overflow: auto;
        position: relative; }
      .contents .feature_3 .frames .list {
        width: 4100px;   /* 4100pxに修正＿20200722 */
        overflow: hidden; }
        .contents .feature_3 .frames .list > li {
          margin: 0 0 10px; }
          .contents .feature_3 .frames .list > li .thumb_frames {
            width: 103px;
            height: 137px;
            margin: 25px 10px 0 0;
            background-size: 1030px 545px;  /* 20200722_修正 */
          }
          /* 20200722_追記 */
          .contents .feature_3 .frames .list > li:nth-child(10), .contents .feature_3 .frames .list > li:nth-child(20), .contents .feature_3 .frames .list > li:nth-child(25),.contents .feature_3 .frames .list > li:nth-child(30) {
            float: left;
            }
            /* end */
          .contents .feature_3 .frames .list > li:nth-child(11), .contents .feature_3 .frames .list > li:nth-child(26) {
            margin-left: 0; }
          .contents .feature_3 .frames .list > li:nth-child(1) .thumb_frames {
            background-position: -0px 0; }
          .contents .feature_3 .frames .list > li:nth-child(2) .thumb_frames {
            background-position: -103px 0; }
          .contents .feature_3 .frames .list > li:nth-child(3) .thumb_frames {
            background-position: -206px 0; }
          .contents .feature_3 .frames .list > li:nth-child(4) .thumb_frames {
            background-position: -309px 0; }
          .contents .feature_3 .frames .list > li:nth-child(5) .thumb_frames {
            background-position: -412px 0; }
          .contents .feature_3 .frames .list > li:nth-child(6) .thumb_frames {
            background-position: -515px 0; }
          .contents .feature_3 .frames .list > li:nth-child(7) .thumb_frames {
            background-position: -618px 0; }
          .contents .feature_3 .frames .list > li:nth-child(8) .thumb_frames {
            background-position: -721px 0; }
          .contents .feature_3 .frames .list > li:nth-child(9) .thumb_frames {
            background-position: -824px 0; }
          .contents .feature_3 .frames .list > li:nth-child(10) .thumb_frames {
            background-position: -927px 0; }
          .contents .feature_3 .frames .list > li:nth-child(11) .thumb_frames {
            background-position: -0px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(12) .thumb_frames {
            background-position: -103px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(13) .thumb_frames {
            background-position: -206px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(14) .thumb_frames {
            background-position: -309px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(15) .thumb_frames {
            background-position: -412px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(16) .thumb_frames {
            background-position: -515px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(17) .thumb_frames {
            background-position: -618px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(18) .thumb_frames {
            background-position: -721px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(19) .thumb_frames {
            background-position: -824px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(20) .thumb_frames {
            background-position: -927px -137px; }
          .contents .feature_3 .frames .list > li:nth-child(21) .thumb_frames {
            background-position: -0px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(22) .thumb_frames {
            background-position: -103px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(23) .thumb_frames {
            background-position: -206px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(24) .thumb_frames {
            background-position: -309px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(25) .thumb_frames {
            background-position: -412px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(26) .thumb_frames {
            background-position: -515px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(27) .thumb_frames {
            background-position: -618px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(28) .thumb_frames {
            background-position: -721px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(29) .thumb_frames {
            background-position: -824px -274px; }
          .contents .feature_3 .frames .list > li:nth-child(30) .thumb_frames {
            background-position: -927px -274px; }
          /* 20200722_追加 */
          .contents .feature_3 .frames .list > li:nth-child(31) .thumb_frames {
            background-position: -0px -411px; }
          .contents .feature_3 .frames .list > li:nth-child(32) .thumb_frames {
            background-position: -103px -411px; }
          .contents .feature_3 .frames .list > li:nth-child(33) .thumb_frames {
            background-position: -206px -411px; }
          .contents .feature_3 .frames .list > li:nth-child(34) .thumb_frames {
            background-position: -309px -411px; }
          .contents .feature_3 .frames .list > li:nth-child(35) .thumb_frames {
            background-position: -412px -411px; }
          .contents .feature_3 .frames .list > li:nth-child(36) .thumb_frames {
            background-position: -515px -411px; }
          /* end */
          /* 20200722_修正 */
          .contents .feature_3 .shortcut {
            position: relative;
            width: auto;
            height: 120px;
            margin: 10px;}
            .contents .feature_3 .shortcut .thumb_product {
              position: absolute;
              top: 100px;
              left: 53%;
              width: 246px;
              margin: 30px 0 0 -123px; }
            .contents .feature_3 .shortcut .text_sub {
              width: auto;
              font-size: 12px;
              line-height: 20px;
              padding-top: 0;}
            .contents .feature_3 .custom{
              width: auto;
              height: 310px;
              margin: 472px -15px 0;
            }
            /* end */

      .contents .feature_3 .custom::before{
        content: '';
        display: block;
        height: 0;
        clear: both;
      }

      .contents .feature_3 .custom .txt_frame{
        width: 160px;
        font-size: 13px;
        font-weight: 500;
        margin: -17px auto 0;
        background: #fff;
        text-align: center;
        position: relative;
      }

      .contents .feature_3 .custom .txt_frame::before{
        width: 17px;
        height: 17px;
        background: url(../img/features/title_custom_lline.svg) no-repeat;
        background-size: contain;
        top: 2px;
        left: 18px;
      }

      .contents .feature_3 .custom .txt_frame::after{
        width: 17px;
        height: 17px;
        background: url(../img/features/title_custom_rline.svg) no-repeat;
        background-size: contain;
        top: 2px;
        right: 18px;
      }

      .contents .feature_3 .custom .title_custom{
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin: 15px auto 0;
      }

      .contents .feature_3 .custom .title_custom_low{
        font-size: 12px;
        font-weight: 500;
        text-align: center;
        margin: auto;
        letter-spacing: 0.1em;
      }

      .contents .feature_3 .custom .label_example{
        font-size: 13px;
        text-align: center;
        margin: 20px auto 0;
      }

      .contents .feature_3 .img_custom{
        margin: 5px auto 0;
        left: 10px;
        width: 100%;
        max-width: 351px;
      }

      .contents .feature_3 .notice_custom{
        margin: -20px 10px 0;
        font-size: 10px;
        width: auto;
        max-width: 351px;
      }

    .contents .feature_3 .filter {
      width: auto;
      margin: 110px 0 0; }
      .contents .feature_3 .filter .thumb_big {
        width: 200px;
        top: -63px;
        left: 74%;
        margin: 0 0 0 -100px; }
        .contents .feature_3 .filter .thumb_big img {
          width: 100%;
          margin: 0 0 -30px; }
        .contents .feature_3 .filter .thumb_big span {
          font-size: 12px; }
      .contents .feature_3 .filter .list {
        margin: 125px -15px 0;
        width: calc(100% + 40px);
        display: flex;
        justify-content: space-between; }
        .contents .feature_3 .filter .list > li {
          width: 62px;
          float: none; }
          .contents .feature_3 .filter .list > li img {
            width: 100%; }
          .contents .feature_3 .filter .list > li span {
            font-size: 10px;
            display: block; }
          .contents .feature_3 .filter .list > li:nth-child(3) {
            float: left; }
    .contents .feature_3 .bg .images_3 {
      position: absolute;
      top: 203px;
      left: 56.5%;
      margin: 0px 0 0 -285px;
      width: 570px; }
    .contents .feature_3 .slant::before {
      border-width: calc(4800px * 0.2678) 4800px 0 0;
      margin: 0 0 0 -2400px; }
    .contents .feature_3 .slant.slant_2 {
      margin: 1130px 0 0; }
      .contents .feature_3 .slant.slant_2::after {
        border-width: 0 0 calc(4800px * 0.2678) 4800px;
        margin: 0 0 0 -2400px; }
  .contents .feature_4 {
    height: 565px;
    padding: 40px 0 0; }
    .contents .feature_4 .bg .images_4_1 {
      position: absolute;
      top: 202px;
      left: 46.5%;
      margin: 0 0 0 -105px;
      width: 310px; }
    .contents .feature_4 .bg .images_4_2 {
      top: 632px;
      left: 51%;
      margin: 0 0 0 -320px;
      width: 640px; }
  .contents .feature_5 {
    height: 440px; }
    .contents .feature_5 .bg .images_5 {
      width: 336px;
      margin: 0px 0 0 -168px;
      top: 197px;
      left: 50.4%; }
  .contents .feature_6 {
    height: 715px; }
    .contents .feature_6 .catch_sub .rice {
      font-size: 10px; }
    .contents .feature_6 .bg .points {
      width: 285px;
      margin: 0 0 0 -142.5px;
      left: 50%;
      top: 190px;
      z-index: 0; }
      .contents .feature_6 .bg .points .point {
        width: 140px;
        height: 140px;
        font-size: 13px;
        line-height: 20px; }
        .contents .feature_6 .bg .points .point .big {
          font-size: 39px;
          line-height: 40px; }
        .contents .feature_6 .bg .points .point:nth-child(1) {
          line-height: 20px; }
          .contents .feature_6 .bg .points .point:nth-child(1) .rice {
            font-size: 10px;
            top: 35px;
            left: 66px; }
        .contents .feature_6 .bg .points .point:nth-child(2) {
          line-height: 20px; }
          .contents .feature_6 .bg .points .point:nth-child(2) .rice {
            font-size: 10px;
            top: 0;
            left: 60px; }
      .contents .feature_6 .bg .points .notice {
        width: 13em;
        top: 150px;
        left: 195px;
        font-size: 10px;
        -webkit-transform: scale(0.9);
                transform: scale(0.9); }
    .contents .feature_6 .bg .images_6 {
      position: absolute;
      top: 320px;
      left: 50%;
      margin: 0 0 0 -90px;
      width: 180px; } }


/*# sourceMappingURL=feature.css.map*/