@charset "UTF-8";
/* Scss Document */
/*------------------------------------------*/
#other_product ul li {
  border: 4px solid #eee;
  padding: 16px 16px 80px;
  position: relative;
  width: 345px;
  box-sizing: border-box; }
  #other_product ul li:nth-child(n + 3) {
    margin: 16px 0 0; }
    @media screen and (max-width: 767px) {
      #other_product ul li:nth-child(n + 3) {
        margin: 0 0 16px; } }
  @media screen and (max-width: 767px) {
    #other_product ul li {
      width: 100%;
      margin: 0 0 16px;
      padding: 16px; } }
  #other_product ul li .tac {
    position: relative;
    transition: all 0.3s ease 0s; }
    #other_product ul li .tac:hover {
      opacity: 0.7; }
    #other_product ul li .tac::before {
      content: "";
      background: rgba(0, 0, 0, 0.7);
      width: 100%;
      height: 100%;
      position: absolute; }
    #other_product ul li .tac h3 {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      color: #fff;
      font-size: 1.25rem;
      line-height: 1.5;
      width: 100%; }
      @media screen and (max-width: 767px) {
        #other_product ul li .tac h3 {
          font-size: 1rem; } }
    #other_product ul li .tac a {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

/*------------------------------------------*/
.frame {
  position: relative;
  background: #fafafa;
  padding: 23px; }
  @media screen and (max-width: 767px) {
    .frame {
      padding: 16px;
      margin: 0 0 16px; } }
  .frame .label {
    position: absolute;
    top: 0;
    left: 0; }
  .frame .frame_inner {
    background: #eee;
    padding: 27px; }
    @media screen and (max-width: 767px) {
      .frame .frame_inner {
        padding: 16px; } }
    .frame .frame_inner h3 {
      font-size: 1rem;
      font-weight: 700;
      margin: 0 0 10px; }

/*------------------------------------------*/
#message .message_frame {
  display: flex;
  justify-content: space-between; }
  @media screen and (max-width: 767px) {
    #message .message_frame {
      flex-direction: column; } }
  #message .message_frame .message_block {
    width: 223px; }
    @media screen and (max-width: 767px) {
      #message .message_frame .message_block {
        width: 80%;
        margin: 8px auto 0; }
        #message .message_frame .message_block:first-child {
          margin-top: 0; } }
    #message .message_frame .message_block h3 {
      font-size: 1rem;
      font-weight: bold;
      text-align: center;
      display: block; }
    #message .message_frame .message_block h4 {
      font-size: 0.8125rem;
      font-weight: bold;
      background: #333;
      color: #fff;
      padding: 8px;
      text-align: center;
      display: block;
      margin-top: 8px; }
      @media screen and (max-width: 767px) {
        #message .message_frame .message_block h4 {
          margin-top: 4px; } }
    #message .message_frame .message_block .tac img {
      width: 100%;
      height: auto; }

/*------------------------------------------*/
#case .lead {
  font-size: 1rem;
  font-weight: bold; }
  @media screen and (max-width: 767px) {
    #case .lead {
      font-size: 0.875rem; } }
#case .frame {
  margin-top: 16px; }
  #case .frame .block {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 767px) {
      #case .frame .block {
        flex-direction: column; } }
    #case .frame .block .case_problem {
      width: 315px; }
      @media screen and (max-width: 767px) {
        #case .frame .block .case_problem {
          width: 100%; } }
      #case .frame .block .case_problem .sub {
        font-size: 1.125rem;
        text-align: center;
        padding-bottom: 4px;
        margin-bottom: 8px;
        border-bottom: 3px solid #333;
        color: #333; }
        @media screen and (max-width: 767px) {
          #case .frame .block .case_problem .sub {
            font-size: 1rem; } }
      #case .frame .block .case_problem .txt {
        text-align: center;
        margin-top: 4px; }
        @media screen and (max-width: 767px) {
          #case .frame .block .case_problem .txt {
            text-align-last: left; } }
    #case .frame .block .case_suggestion {
      width: 308px;
      position: relative; }
      @media screen and (max-width: 767px) {
        #case .frame .block .case_suggestion {
          width: 100%;
          margin-top: 16px; } }
      #case .frame .block .case_suggestion .sub {
        font-size: 1.125rem;
        text-align: center;
        padding-bottom: 4px;
        margin-bottom: 8px;
        border-bottom: 3px solid #e60027;
        color: #e60027; }
        @media screen and (max-width: 767px) {
          #case .frame .block .case_suggestion .sub {
            font-size: 1rem; } }
      #case .frame .block .case_suggestion .txt {
        text-align: center;
        margin-top: 4px; }
        @media screen and (max-width: 767px) {
          #case .frame .block .case_suggestion .txt {
            text-align-last: left; } }
      #case .frame .block .case_suggestion::before {
        content: "";
        border-top: 24px solid transparent;
        border-bottom: 24px solid transparent;
        border-left: 10px solid #e60027;
        position: absolute;
        top: 50%;
        left: -18px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%); }
        @media screen and (max-width: 767px) {
          #case .frame .block .case_suggestion::before {
            border-top: 10px solid #F0897F;
            border-right: 24px solid transparent;
            border-left: 24px solid transparent;
            border-bottom: none;
            top: -12px;
            left: 50%;
            transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%); } }
  #case .frame .case_center {
    margin-top: 16px;
    border: 3px solid #e60027;
    color: #e60027;
    background: #fff;
    font-weight: bold;
    font-size: 1rem;
    text-align: center;
    padding: 8px;
    width: 100%;
    box-sizing: border-box; }
    @media screen and (max-width: 767px) {
      #case .frame .case_center {
        margin-top: 8px;
        font-size: 0.875rem; } }
  #case .frame .img {
    margin-top: 16px; }
    @media screen and (max-width: 767px) {
      #case .frame .img {
        margin-top: 8px; } }

/*------------------------------------------*/
#solution h3 {
  position: relative;
  font-size: 1.125rem;
  padding: 0 0 0 25px;
  font-weight: 700; }
  @media screen and (max-width: 767px) {
    #solution h3 {
      font-size: 0.875rem; } }
  #solution h3:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 4px;
    z-index: 2;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid #fff;
    margin-top: -4px; }
  #solution h3:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0px;
    z-index: 1;
    width: 16px;
    height: 16px;
    background: #c40200;
    margin-top: -8px; }
  #solution h3 .label {
    position: static;
    display: inline-block;
    padding: 0 10px;
    font-size: 0.625rem;
    line-height: 16px;
    vertical-align: middle; }
#solution ul {
  padding: 0 32px 20px; }
  @media screen and (max-width: 767px) {
    #solution ul {
      padding: 0 0 16px; } }
  #solution ul:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border: 18px solid transparent;
    border-top: 14px solid #333;
    border-bottom: none;
    margin: 10px auto 0; }
  #solution ul li {
    position: relative;
    padding: 0 0 10px 30px; }
    #solution ul li:before {
      content: "";
      width: 24px;
      height: 19px;
      background: url(/digitalmarketing/sp/shared/images/check.svg) no-repeat center center/24px 19px;
      display: block;
      position: absolute;
      top: 0;
      left: 0; }

/*------------------------------------------*/
@media screen and (max-width: 767px) {
  #other .table .tr:nth-of-type(n + 3) {
    display: block; } }
#other .table .tr .th:nth-of-type(1) {
  width: 90px; }
#other .table .tr .th:nth-of-type(3) {
  width: 350px; }
@media screen and (max-width: 767px) {
  #other .table .tr .td:nth-of-type(1):before {
    content: "カテゴリ"; }
  #other .table .tr .td:nth-of-type(2):before {
    content: "製品名"; }
  #other .table .tr .td:nth-of-type(3):before {
    content: "概要"; } }
#other .table .tr .td em {
  display: inline-block;
  margin-bottom: 4px;
  margin-right: 0;
  font-size: 0.6875rem; }
  @media screen and (max-width: 767px) {
    #other .table .tr .td em {
      margin-right: 4px; } }

/*------------------------------------------*/
#trouble .table_pc {
  display: table;
  width: 100%;
  border: none;
  border-collapse: separate;
  border-spacing: 0 8px;
  margin-top: -8px; }
  @media screen and (max-width: 767px) {
    #trouble .table_pc {
      display: none; } }
  #trouble .table_pc .tr {
    display: table-row; }
    #trouble .table_pc .tr .td {
      display: table-cell;
      background: #f5f5f5;
      vertical-align: middle;
      padding: 0;
      border: 1px solid #ccc; }
      #trouble .table_pc .tr .td p {
        padding: 24px 16px;
        margin: 0; }
  #trouble .table_pc .td:nth-child(2) {
    border: none;
    padding: 8px 8px;
    background: #fff; }
    #trouble .table_pc .td:nth-child(2) .arrow {
      width: 0;
      height: 0;
      border-left: 8px solid black;
      border-top: 8px solid transparent;
      border-bottom: 8px solid transparent;
      margin-left: 4px; }
  #trouble .table_pc .td:nth-child(3) {
    background: #fce6df; }
  #trouble .table_pc .tr:first-child .td {
    border: none; }
    #trouble .table_pc .tr:first-child .td p {
      padding: 8px 16px;
      margin: 0; }
  #trouble .table_pc .tr:first-child .td:nth-child(1) {
    background: #666;
    color: #fff;
    font-weight: bold;
    font-size: 0.875rem;
    width: 48%; }
  #trouble .table_pc .tr:first-child .td:nth-child(3) {
    background: #e95527;
    color: #fff;
    font-weight: bold;
    font-size: 0.875rem;
    width: 48%; }
#trouble .table {
  display: none; }
  @media screen and (max-width: 767px) {
    #trouble .table {
      display: flex;
      flex-direction: column;
      justify-content: center;
      -webkit-align-items: center;
      align-items: center;
      flex-wrap: wrap; }
      #trouble .table .tr {
        border-top: none !important;
        width: 100%;
        margin-bottom: 0; }
        #trouble .table .tr .td {
          border: 1px solid #ccc;
          padding: 0; }
          #trouble .table .tr .td p {
            margin: 0;
            padding: 8px; }
        #trouble .table .tr .td::before {
          content: none; }
        #trouble .table .tr .td:nth-child(1) {
          background: #666;
          font-weight: bold;
          color: #fff;
          margin-top: 16px; }
        #trouble .table .tr .td:nth-child(2) {
          background: #f5f5f5;
          margin-top: -1px; }
          #trouble .table .tr .td:nth-child(2) p {
            padding: 16px; }
        #trouble .table .tr .td:nth-child(3) {
          border: none;
          margin: 8px; }
          #trouble .table .tr .td:nth-child(3) .arrow {
            width: 0px;
            margin: 0 auto;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid black; }
        #trouble .table .tr .td:nth-child(4) {
          background: #e95527;
          color: #fff;
          font-weight: bold; }
        #trouble .table .tr .td:nth-child(5) {
          background: #fce6df;
          margin-top: -1px; }
          #trouble .table .tr .td:nth-child(5) p {
            padding: 16px; }
        #trouble .table .tr:nth-of-type(n + 3) {
          display: none; }
      #trouble .table .tr:first-child .td:first-child {
        margin-top: 0; } }

/*------------------------------------------*/
#overview .block {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 32px; }
  @media screen and (max-width: 767px) {
    #overview .block {
      flex-direction: column;
      margin-bottom: 16px; } }
  #overview .block .left_side {
    width: 48%; }
    @media screen and (max-width: 767px) {
      #overview .block .left_side {
        width: 100%;
        margin-bottom: 8px; } }
    #overview .block .left_side .txt span {
      font-size: 0.75rem; }
  #overview .block .right_side {
    width: 48%; }
    @media screen and (max-width: 767px) {
      #overview .block .right_side {
        width: 100%; }
        #overview .block .right_side img {
          width: 100%;
          height: auto; } }

/*------------------------------------------*/
@media screen and (max-width: 767px) {
  #features ul.features_blocks {
    margin-bottom: 16px; } }
#features ul.features_blocks li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
  width: 100%;
  background: #27a7e9;
  margin-bottom: 8px; }
  @media screen and (max-width: 767px) {
    #features ul.features_blocks li {
      flex-direction: column; }
      #features ul.features_blocks li:nth-of-type(n + 3) {
        display: none; } }
  #features ul.features_blocks li .sub {
    width: 20%;
    color: #fff;
    font-size: 1.25rem;
    font-weight: bold;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #features ul.features_blocks li .sub {
        width: 100%;
        font-size: 1.125rem; } }
    #features ul.features_blocks li .sub .inner {
      width: auto;
      padding: 4px; }
  #features ul.features_blocks li .txt {
    background: #f5f5f5;
    width: 80%; }
    @media screen and (max-width: 767px) {
      #features ul.features_blocks li .txt {
        width: 100%; } }
    #features ul.features_blocks li .txt .inner {
      padding: 24px;
      width: auto; }
      #features ul.features_blocks li .txt .inner b {
        font-size: 1.125rem;
        margin-bottom: 16px;
        display: inline-block; }
      #features ul.features_blocks li .txt .inner p {
        margin: 0; }

/*------------------------------------------*/
@media screen and (max-width: 767px) {
  #function ul.function_blocks {
    margin-bottom: 16px; } }
#function ul.function_blocks > li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
  width: 100%;
  background: #f5f5f5;
  border: 1px solid #ccc;
  margin-top: -1px; }
  @media screen and (max-width: 767px) {
    #function ul.function_blocks > li {
      flex-direction: column; }
      #function ul.function_blocks > li:nth-of-type(n + 3) {
        display: none; } }
  #function ul.function_blocks > li .sub {
    width: 230px;
    font-size: 0.875rem;
    font-weight: bold; }
    @media screen and (max-width: 767px) {
      #function ul.function_blocks > li .sub {
        width: 100%; } }
    #function ul.function_blocks > li .sub .inner {
      width: auto;
      padding: 24px; }
  #function ul.function_blocks > li .txt {
    background: #fff;
    width: 80%; }
    @media screen and (max-width: 767px) {
      #function ul.function_blocks > li .txt {
        width: 100%; } }
    #function ul.function_blocks > li .txt .inner {
      padding: 24px;
      width: auto; }
      #function ul.function_blocks > li .txt .inner p {
        margin: 0; }
      #function ul.function_blocks > li .txt .inner ul li {
        padding-left: 1em;
        text-indent: -1em; }

/*------------------------------------------*/
.pagetitle_customer_journey {
  background: url(/digitalmarketing/sp/shared/images/pagetitle_bg_default2.jpg) no-repeat center center/cover;
  min-height: 180px;
  height: 180px;
  color: #fff;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  padding: 23px;
  box-sizing: border-box;
  margin: 0 0 30px; }
  @media screen and (max-width: 767px) {
    .pagetitle_customer_journey {
      margin: 0 -16px 20px;
      min-height: 125px;
      height: 125px;
      padding: 16px 16px;
      background-image: url(/digitalmarketing/sp/shared/images/products/customer_journey/pagetitle_bg_customer_journey_sp.jpg); } }
  .inner .pagetitle_customer_journey {
    background: url(/digitalmarketing/sp/shared/images/products/customer_journey/pagetitle_bg_customer_journey.jpg) no-repeat center center/cover; }
    @media screen and (max-width: 767px) {
      .inner .pagetitle_customer_journey {
        background-image: url(/digitalmarketing/sp/shared/images/products/customer_journey/pagetitle_bg_customer_journey_sp.jpg); } }
  .pagetitle_customer_journey > div span {
    font-size: 1rem;
    line-height: 1;
    margin: 0 0 15px;
    display: block; }
    @media screen and (max-width: 767px) {
      .pagetitle_customer_journey > div span {
        font-size: 0.75rem;
        line-height: 1.4;
        margin: 0 0 10px; } }
  .pagetitle_customer_journey > div h1 {
    /*font-size:2.5rem;*/
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
    display: block; }
    .pagetitle_customer_journey > div h1.small {
      /*font-size:2.125rem;*/
      font-size: 34px;
      line-height: 1.3; }
    @media screen and (max-width: 767px) {
      .pagetitle_customer_journey > div h1 {
        font-size: 1.25rem;
        line-height: 1.3; }
        .pagetitle_customer_journey > div h1.small {
          font-size: 1.125rem; } }

/*------------------------------------------*/
.pagetitle_product_detail {
  background: url(/digitalmarketing/sp/shared/images/pagetitle_bg_default2.jpg) no-repeat center center/cover;
  min-height: 180px;
  height: 180px;
  color: #fff;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  padding: 23px;
  box-sizing: border-box;
  margin: 0 0 30px; }
  @media screen and (max-width: 767px) {
    .pagetitle_product_detail {
      margin: 0 -16px 20px;
      min-height: 125px;
      height: 125px;
      padding: 16px 16px;
      background-image: url(/digitalmarketing/sp/shared/images/products/pagetitle_bg_product_detail_sp.jpg); } }
  .inner .pagetitle_product_detail {
    background: url(/digitalmarketing/sp/shared/images/products/pagetitle_bg_product_detail.jpg) no-repeat center center/cover; }
    @media screen and (max-width: 767px) {
      .inner .pagetitle_product_detail {
        background-image: url(/digitalmarketing/sp/shared/images/products/pagetitle_bg_product_detail_sp.jpg); } }
  .pagetitle_product_detail > div span {
    font-size: 1rem;
    line-height: 1;
    margin: 0 0 15px;
    display: block; }
    @media screen and (max-width: 767px) {
      .pagetitle_product_detail > div span {
        font-size: 0.75rem;
        line-height: 1.4;
        margin: 0 0 10px; } }
  .pagetitle_product_detail > div h1 {
    /*font-size:2.5rem;*/
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
    display: block; }
    .pagetitle_product_detail > div h1.small {
      /*font-size:2.125rem;*/
      font-size: 34px;
      line-height: 1.3; }
    @media screen and (max-width: 767px) {
      .pagetitle_product_detail > div h1 {
        font-size: 1.25rem;
        line-height: 1.3; }
        .pagetitle_product_detail > div h1.small {
          font-size: 1.125rem; } }

/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/