@charset "UTF-8";
body.cyberrisk {
  padding: 0;
  margin: 0;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  line-height: normal; }

#cyber-insurance {
  position: relative;
  background: #fff;
  color: #333;
  /* ============= 共通項目 ============= */
  /*お問い合わせボタン*/
  /*コピー付きお問い合わせボタン*/
  /*注釈・フォント14px*/
  /*注釈・右寄せ*/
  /*見出し・フォント24px*/
  /*サブ見出し・フォント22px*/
  /*小ポイント・フォント18px*/
  /* ============= 共通項目 END ============= */ }
  @media screen and (min-width: 768px) {
    #cyber-insurance .pc {
      display: block; }
    #cyber-insurance .sp {
      display: none; } }
  @media screen and (max-width: 767px) {
    #cyber-insurance .pc {
      display: none; }
    #cyber-insurance .sp {
      display: block; } }
  #cyber-insurance section .lead {
    margin-bottom: 40px;
    text-align: center;
    font-size: 20px;
    font-weight: 300; }
  @media screen and (max-width: 767px) {
    #cyber-insurance {
      font-size: 16px;
      padding-bottom: 3%; } }
  #cyber-insurance .cyber-insurance-inner {
    max-width: 990px;
    width: 100%;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box; }
    #cyber-insurance .cyber-insurance-inner h3 {
      width: auto;
      height: 40px;
      text-align: center;
      margin: 0 0 60px; }
      #cyber-insurance .cyber-insurance-inner h3 img {
        width: auto;
        height: 100%;
        margin: 0 auto; }
    #cyber-insurance .cyber-insurance-inner h3.line2 {
      height: 80px; }
    #cyber-insurance .cyber-insurance-inner h3.line3 {
      height: 140px; }
  @media screen and (max-width: 767px) {
    #cyber-insurance section .lead {
      margin-bottom: 20px; }
    #cyber-insurance .cyber-insurance-inner {
      max-width: 100%;
      width: 100%;
      margin: 0 auto;
      padding: 0 3%;
      box-sizing: border-box; }
      #cyber-insurance .cyber-insurance-inner h3 {
        width: 100%;
        min-height: 30px;
        margin: 0 auto 30px; }
        #cyber-insurance .cyber-insurance-inner h3 img {
          width: 100%;
          height: auto;
          margin: 0 auto; }
      #cyber-insurance .cyber-insurance-inner h3.line2 {
        height: auto; }
      #cyber-insurance .cyber-insurance-inner h3.line3 {
        height: auto; } }
  #cyber-insurance .bg-curve {
    overflow: hidden; }
  #cyber-insurance .cyber-insurance-inner-curve {
    background: #eff3f4;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    margin-left: -500px;
    margin-right: -500px;
    padding-left: 500px;
    padding-right: 500px;
    padding-top: 80px;
    padding-bottom: 60px; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .cyber-insurance-inner-curve {
      padding-top: 60px;
      padding-bottom: 60px; } }
  #cyber-insurance p {
    font-size: 16px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    margin: 0;
    line-height: 1.5em; }
  #cyber-insurance .btn-inquiry {
    width: 380px;
    margin: 0 auto; }
    #cyber-insurance .btn-inquiry a {
      font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
      display: block; }
      #cyber-insurance .btn-inquiry a img {
        width: 100%;
        height: auto; }
    #cyber-insurance .btn-inquiry a:hover {
      opacity: 0.8; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .btn-inquiry {
      width: 90%;
      margin: 0 auto; } }
  #cyber-insurance img {
    width: 100%;
    height: auto; }
  #cyber-insurance .btn-inquiry-copy .btn-copy {
    width: 90%;
    height: auto;
    margin: 0 auto 5px; }
  #cyber-insurance a {
    text-decoration: underline;
    color: #cc0022; }
  #cyber-insurance a:hover {
    text-decoration: none; }
  #cyber-insurance .attention {
    font-size: 14px;
    padding-bottom: 10px; }
  #cyber-insurance .font-w {
    font-weight: 600; }
  #cyber-insurance .font-n {
    font-weight: 300; }
  #cyber-insurance .font-red {
    color: #cc0022; }
  #cyber-insurance .text-right {
    text-align: right;
    padding-right: 3%; }
  #cyber-insurance h2, #cyber-insurance h3, #cyber-insurance h4 {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; }
  #cyber-insurance table {
    border-collapse: separate; }
    #cyber-insurance table tr th, #cyber-insurance table tr td {
      font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; }
  #cyber-insurance .topics {
    font-size: 24px;
    color: #cc0022;
    font-weight: 600; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .topics {
      font-size: 20px; } }
  #cyber-insurance .topics-sub {
    font-size: 22px;
    color: #cc0022;
    font-weight: 600; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .topics-sub {
      font-size: 18px; } }
  #cyber-insurance .text-point {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 7px; }
  #cyber-insurance .text-center {
    text-align: center; }
  #cyber-insurance .mb15 {
    margin-bottom: 15px; }
  #cyber-insurance ul {
    margin: 0;
    padding: 0; }
    #cyber-insurance ul li {
      list-style: none; }
  #cyber-insurance .under-line-dot {
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 2px dotted #cc0022; }
  #cyber-insurance .under-line {
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 3px solid #cc0022; }
  #cyber-insurance .mv-area {
    width: 100%;
    padding: 1% 0;
    background: #eff3f4; }
    #cyber-insurance .mv-area .mv-text {
      width: 35%;
      height: auto; }
      #cyber-insurance .mv-area .mv-text h1 {
        width: 90%;
        margin: 0 auto 30px; }
        #cyber-insurance .mv-area .mv-text h1 img {
          width: 100%;
          height: auto; }
      #cyber-insurance .mv-area .mv-text .btn-inquiry {
        width: 100%; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .mv-area {
      width: 100%;
      background: #eff3f4; }
      #cyber-insurance .mv-area .mv-text {
        width: 96%;
        margin: 0 auto; }
        #cyber-insurance .mv-area .mv-text h1 {
          width: 100%;
          margin: 0 auto 10px; }
        #cyber-insurance .mv-area .mv-text .btn-inquiry {
          width: 80%;
          margin-bottom: 10px; }
      #cyber-insurance .mv-area .mv-img_sp {
        width: 70%;
        height: auto;
        margin: 0 auto; }
      #cyber-insurance .mv-area .mv-area-bg {
        width: 100%;
        background: none; } }
  @media screen and (min-width: 768px) {
    #cyber-insurance .mv-area .mv-area-bg {
      padding: 2%;
      background: url(../img/mv_img.png) no-repeat;
      background-size: 50%;
      background-position: right 20% bottom 45%; } }
  @media screen and (min-width: 992px) {
    #cyber-insurance .mv-area .mv-area-bg {
      background: url(../img/mv_img.png) center right no-repeat;
      background-size: 56%;
      background-position: right 5% bottom 45%; } }
  #cyber-insurance .reason-area {
    padding: 80px 0 50px; }
    #cyber-insurance .reason-area .reason-point {
      display: flex;
      justify-content: space-around;
      flex-wrap: wrap; }
      #cyber-insurance .reason-area .reason-point li {
        width: 45%;
        margin-bottom: 30px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; }
        #cyber-insurance .reason-area .reason-point li .reason-icon {
          width: 20%; }
          #cyber-insurance .reason-area .reason-point li .reason-icon img {
            width: 80%;
            height: auto; }
        #cyber-insurance .reason-area .reason-point li .reason-text {
          width: 78%; }
          #cyber-insurance .reason-area .reason-point li .reason-text .topics {
            margin-bottom: 15px; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .reason-area {
      padding: 60px 0 30px; }
      #cyber-insurance .reason-area .reason-point li {
        width: 100%;
        margin-bottom: 15px; }
        #cyber-insurance .reason-area .reason-point li .reason-icon {
          width: 12%; }
          #cyber-insurance .reason-area .reason-point li .reason-icon img {
            width: 100%;
            height: auto; }
        #cyber-insurance .reason-area .reason-point li .reason-text {
          width: 80%; }
          #cyber-insurance .reason-area .reason-point li .reason-text .topics {
            margin-bottom: 5px; } }
  #cyber-insurance .cyber-area {
    padding: 0; }
    #cyber-insurance .cyber-area .cyber-lead {
      position: relative; }
      #cyber-insurance .cyber-area .cyber-lead .cyber-person {
        width: 17%;
        position: absolute;
        bottom: -60px;
        left: 10px; }
    #cyber-insurance .cyber-area .reference {
      position: relative;
      padding: 20px;
      text-align: center;
      border-radius: 15px;
      background: #fdf6d8; }
      #cyber-insurance .cyber-area .reference img {
        width: 100%;
        height: auto;
        margin: 0 auto 20px; }
      #cyber-insurance .cyber-area .reference .attention {
        text-align: left;
        padding-bottom: 0; }
    #cyber-insurance .cyber-area .cyber-example {
      margin: 40px 0 0; }
      #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl {
        display: flex;
        justify-content: space-between; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl .accident {
          width: 56%; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl .virus {
          width: 43%; }
      #cyber-insurance .cyber-area .cyber-example .cyber-example-list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-list li {
          width: 32%;
          padding: 25px;
          margin-top: 30px;
          border-radius: 15px;
          background: #fff;
          list-style: none;
          box-sizing: border-box;
          min-height: 240px; }
          #cyber-insurance .cyber-area .cyber-example .cyber-example-list li .cyber-example-employee {
            font-size: 15px;
            letter-spacing: -0.9px;
            font-weight: 600;
            margin-bottom: 20px;
            margin-left: -10px; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .cyber-area {
      	/*.cyber-lead {
      		position: static;
      		display: flex;
      		justify-content: space-between;
      		flex-wrap: wrap;
      		
      	.cyber-person {
      	width: 36%;
      	position: static;
      	}
      	
      	.lead {
      	width: 60%;
      	text-align: left;
      	}
      }*/ }
      #cyber-insurance .cyber-area .cyber-lead .cyber-person {
        display: none; }
      #cyber-insurance .cyber-area .reference img {
        width: 100%;
        height: auto;
        margin: 0 auto 10px; }
      #cyber-insurance .cyber-area .reference .attention {
        text-align: left;
        padding-bottom: 0; }
      #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl {
        display: block; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl .accident {
          width: 100%; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-ttl .virus {
          width: 80%;
          margin: 10px auto 0; }
      #cyber-insurance .cyber-area .cyber-example .cyber-example-list {
        display: block; }
        #cyber-insurance .cyber-area .cyber-example .cyber-example-list li {
          width: 100%;
          padding: 3% 4%;
          margin-top: 5%;
          min-height: inherit; }
          #cyber-insurance .cyber-area .cyber-example .cyber-example-list li .topics-sub {
            text-align: left; }
          #cyber-insurance .cyber-area .cyber-example .cyber-example-list li .cyber-example-employee {
            text-align: left;
            margin-bottom: 5px; } }
  #cyber-insurance .request-area {
    background: #eff3f4; }
    #cyber-insurance .request-area .request-lead {
      font-size: 26px;
      font-weight: 600;
      text-align: center; }
    #cyber-insurance .request-area .cyber-insurance-inner-curve-pink {
      background: #eeaaaa;
      border-top-left-radius: 50%;
      border-top-right-radius: 50%;
      margin-left: -500px;
      margin-right: -500px;
      padding-left: 500px;
      padding-right: 500px;
      padding-top: 80px;
      padding-bottom: 150px; }
    #cyber-insurance .request-area .request-risk-ttl {
      text-align: center;
      font-weight: 600;
      margin: 40px 0 20px; }
    #cyber-insurance .request-area .request-risk {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      #cyber-insurance .request-area .request-risk li {
        width: 32%;
        padding: 20px;
        border-radius: 15px;
        box-sizing: border-box;
        background: #fff; }
        #cyber-insurance .request-area .request-risk li p {
          text-align: center;
          letter-spacing: -1px; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .request-area {
      margin-bottom: -70px; }
      #cyber-insurance .request-area .request-lead {
        font-size: 20px; }
      #cyber-insurance .request-area .request-risk-ttl {
        margin: 40px 0 10px;
        font-size: 14px; }
      #cyber-insurance .request-area .cyber-insurance-inner-curve-pink {
        padding-top: 50px;
        padding-bottom: 150px; }
      #cyber-insurance .request-area .request-risk li {
        width: 100%;
        padding: 3% 4%;
        margin-bottom: 3%; } }
  #cyber-insurance .request-btn-area {
    position: relative;
    margin: 80px auto 0;
    padding-bottom: 100px; }
    #cyber-insurance .request-btn-area .request-btn-copy {
      width: 70%;
      height: auto;
      margin: 0 auto 30px; }
      #cyber-insurance .request-btn-area .request-btn-copy img {
        width: 100%;
        height: auto; }
    #cyber-insurance .request-btn-area .request-img {
      width: 28%;
      position: absolute;
      bottom: -35px;
      right: -30px; }
      #cyber-insurance .request-btn-area .request-img img {
        width: 100%;
        height: auto; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .request-btn-area {
      margin: 15px auto 0; }
      #cyber-insurance .request-btn-area .request-btn-copy {
        width: 100%;
        height: auto;
        margin: 0 auto 10px; }
        #cyber-insurance .request-btn-area .request-btn-copy img {
          width: 100%;
          height: auto; }
      #cyber-insurance .request-btn-area .request-img {
        display: none; } }
  #cyber-insurance .compensation-area {
    margin-top: -180px !important;
    position: relative;
    /* タブ全体を囲むコンテナの設定 */
    /* 各タブボタンの設定 */
    /* タブボタンのホバーおよび選択状態のスタイル */
    /* ラジオボタン自体は非表示 */
    /* タブコンテンツのスタイル */
    /* 選択されたタブのコンテンツを表示 */ }
    #cyber-insurance .compensation-area .cyber-insurance-inner-curve {
      padding-bottom: 120px; }
    #cyber-insurance .compensation-area .tab-switch {
      display: flex;
      /* タブを横並びに配置 */
      flex-wrap: wrap;
      /* 幅を超えたら折り返し */
      max-width: 100%;
      /* コンテナの最大幅を指定 */
      margin: auto auto 60px;
      /* コンテナを中央に配置 */
      justify-content: center;
      /* タブを中央に寄せる */ }
    #cyber-insurance .compensation-area .tab-switch > label {
      flex: 1 1 auto;
      /* タブボタンが均等に幅をとるが、幅を超えると折り返す */
      width: 22%;
      order: -1;
      /* タブボタンを上部に配置 */
      position: relative;
      /* 子要素の絶対位置指定の基準 */
      margin: 0 10px -5px;
      padding: 15px 5px;
      /* 上下に0.7em、左右に1emの内側余白 */
      background-color: #cc0022;
      /* タブボタンの背景色 */
      color: #fff;
      /* 文字色をグレーに設定 */
      font-size: 20px;
      font-weight: 600;
      line-height: 1em;
      text-align: center;
      /* 文字を中央揃え */
      cursor: pointer;
      /* カーソルをポインターに変更 */
      transition: .3s all;
      /*変化を滑らかに*/
      border-radius: 15px 15px 0 0;
      box-sizing: border-box;
      display: table;
      text-align: center;
      border-top: 5px solid #cc0022;
      border-left: 5px solid #cc0022;
      border-right: 5px solid #cc0022; }
    #cyber-insurance .compensation-area .tab-name {
      font-size: 18px;
      display: table-cell;
      vertical-align: middle; }
    #cyber-insurance .compensation-area .tab-content {
      /*タブ01*/
      /*タブ02*/
      /*タブ03*/ }
      #cyber-insurance .compensation-area .tab-content .tab-ttl {
        position: relative;
        padding-left: 90px;
        margin-bottom: 30px; }
        #cyber-insurance .compensation-area .tab-content .tab-ttl h4 {
          font-size: 36px;
          color: #cc0022;
          font-weight: 600;
          margin: 0; }
        #cyber-insurance .compensation-area .tab-content .tab-ttl .lead {
          font-size: 18px;
          text-align: left;
          margin: 10px 0 0; }
      #cyber-insurance .compensation-area .tab-content .tab-ttl:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 80px;
        height: 80px;
        background: url(../img/tab_ttl_icon.png) top center no-repeat;
        background-size: contain; }
      #cyber-insurance .compensation-area .tab-content .tab1-table {
        width: 100%;
        border-spacing: 0; }
        #cyber-insurance .compensation-area .tab-content .tab1-table tr {
          position: relative;
          display: flex;
          margin-bottom: 30px;
          min-height: 78px; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr th, #cyber-insurance .compensation-area .tab-content .tab1-table tr td {
            padding: 15px;
            font-weight: 600; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident {
            position: relative;
            width: 40%;
            display: table;
            background: #eff3f4; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon p {
            position: relative;
            padding-left: 40px;
            display: table-cell;
            vertical-align: middle; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon p:before {
            content: "";
            position: absolute;
            top: 50%;
            left: 0;
            width: 30px;
            height: 30px;
            margin-top: -15px;
            background: url(../img/tab_1_icon_1.png) center center no-repeat;
            background-size: contain; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon1 p:before {
            background: url(../img/tab_1_icon_1.png) center center no-repeat;
            background-size: contain; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon2 p:before {
            background: url(../img/tab_1_icon_2.png) center center no-repeat;
            background-size: contain; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon3 p:before {
            background: url(../img/tab_1_icon_3.png) center center no-repeat;
            background-size: contain; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon4 p:before {
            background: url(../img/tab_1_icon_4.png) center center no-repeat;
            background-size: contain; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-top {
            background: #fff; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-cost {
            width: 60%;
            background: #fdf6d8; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-cost-top {
            color: #fff;
            background: #cc0022; }
        #cyber-insurance .compensation-area .tab-content .tab1-table tr:after {
          content: "";
          position: absolute;
          bottom: -20px;
          left: 20%;
          color: #333;
          line-height: 1;
          width: 0;
          height: 0;
          border-style: solid;
          border-color: transparent;
          border-width: 0.6em 0.7em;
          border-top-color: currentColor;
          border-bottom: 0; }
        #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child, #cyber-insurance .compensation-area .tab-content .tab1-table tr:last-child {
          margin-bottom: 0; }
        #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child:after, #cyber-insurance .compensation-area .tab-content .tab1-table tr:last-child:after {
          display: none; }
        #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child {
          min-height: inherit; }
      #cyber-insurance .compensation-area .tab-content .tab2-img {
        width: 50%;
        height: auto;
        margin: 0 auto; }
      #cyber-insurance .compensation-area .tab-content .tab2-catch {
        font-size: 18px;
        color: #cc0022;
        font-weight: 500;
        margin: 20px auto;
        text-align: center; }
      #cyber-insurance .compensation-area .tab-content .tab2-catch-large {
        font-size: 26px;
        padding-bottom: 5px;
        background: linear-gradient(transparent 60%, #f7e27f 30%); }
      #cyber-insurance .compensation-area .tab-content .tab-point {
        width: 100%;
        padding: 30px;
        background: #fffbe3;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; }
        #cyber-insurance .compensation-area .tab-content .tab-point .tab-point-left {
          width: 50%; }
        #cyber-insurance .compensation-area .tab-content .tab-point .tab-point-right {
          width: 48%; }
        #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation .support_compensation-ttl {
          padding: 1% 3%;
          margin-bottom: 20px;
          text-align: center;
          color: #fff;
          background: #cc0022; }
        #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation ul {
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap; }
          #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation ul li {
            width: 49%;
            font-weight: 600;
            margin-bottom: 3px;
            letter-spacing: -1px; }
        #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk {
          padding: 20px;
          border-radius: 15px;
          background: #fff; }
          #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk p {
            font-size: 14px;
            text-align: center; }
          #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk .supportdesk-large {
            font-size: 18px;
            color: #cc0022;
            line-height: 1.3em; }
          #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk a {
            display: block;
            width: 56%;
            height: auto;
            margin: 10px auto 0; }
          #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk a:hover {
            opacity: 0.8; }
      #cyber-insurance .compensation-area .tab-content .tab3-catch {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-bottom: 20px; }
        #cyber-insurance .compensation-area .tab-content .tab3-catch li {
          padding: 25px 15px 15px;
          width: 23%;
          height: auto;
          box-sizing: border-box;
          background: #eff3f4;
          border-radius: 15px;
          text-align: center; }
          #cyber-insurance .compensation-area .tab-content .tab3-catch li .catch-icon {
            width: 35%;
            height: auto;
            margin: 0 auto 15px; }
          #cyber-insurance .compensation-area .tab-content .tab3-catch li p {
            font-size: 14px; }
      #cyber-insurance .compensation-area .tab-content .tab-point-3 {
        margin: 30px 0 0; }
        #cyber-insurance .compensation-area .tab-content .tab-point-3 .tab-point-left {
          width: 46%; }
        #cyber-insurance .compensation-area .tab-content .tab-point-3 .tab-point-right {
          width: 52%; }
          #cyber-insurance .compensation-area .tab-content .tab-point-3 .tab-point-right .attention {
            margin-top: 10px; }
      #cyber-insurance .compensation-area .tab-content .tab4-catch {
        width: 100%;
        height: auto;
        margin: 0 auto 30px; }
      #cyber-insurance .compensation-area .tab-content .tab4-text {
        margin-bottom: 20px; }
        #cyber-insurance .compensation-area .tab-content .tab4-text p {
          font-size: 18px; }
        #cyber-insurance .compensation-area .tab-content .tab4-text .tab4-text-ttl {
          font-size: 20px;
          margin-bottom: 10px; }
      #cyber-insurance .compensation-area .tab-content .tab-point-4 .support_compensation-ttl {
        width: 52%; }
    #cyber-insurance .compensation-area .tab-switch > label:hover,
    #cyber-insurance .compensation-area .tab-switch label:has(:checked) {
      background-color: #fff;
      /* ホバー/選択時の背景色 */
      color: #cc0022;
      /* ホバー/選択時の文字色 */
      border-top: 5px solid #cc0022;
      border-left: 5px solid #cc0022;
      border-right: 5px solid #cc0022; }
    #cyber-insurance .compensation-area .tab-switch input {
      display: none;
      /* ラジオボタンを見えなくする */ }
    #cyber-insurance .compensation-area .tab-switch > div {
      display: none;
      /* 初期状態ではコンテンツを非表示に */
      width: 100%;
      /* コンテンツの幅を全体に設定 */
      padding: 30px;
      /* 上下に1.5em、左右に1emの内側余白 */
      border-radius: 10px;
      min-height: 720px;
      background: #fff;
      border: 5px solid #cc0022;
      box-sizing: border-box; }
    #cyber-insurance .compensation-area .tab-switch label:has(:checked) + div {
      display: block;
      /* 選択されたタブのコンテンツを表示 */ }
  @media screen and (max-width: 767px) {
    #cyber-insurance .compensation-area {
      margin-top: -180px !important;
      /* タブ全体を囲むコンテナの設定 */
      /* 各タブボタンの設定 */
      /* タブボタンのホバーおよび選択状態のスタイル */
      /* ラジオボタン自体は非表示 */
      /* タブコンテンツのスタイル */
      /* 選択されたタブのコンテンツを表示 */ }
      #cyber-insurance .compensation-area .cyber-insurance-inner-curve {
        padding-bottom: 100px; }
        #cyber-insurance .compensation-area .cyber-insurance-inner-curve h3 {
          width: 70%;
          height: auto; }
      #cyber-insurance .compensation-area .tab-switch {
        display: grid;
        width: 100%;
        box-sizing: border-box;
        justify-content: space-around;
        flex-wrap: wrap;
        margin: auto auto 30px; }
      #cyber-insurance .compensation-area .tab-switch > label {
        width: 100%;
        border-radius: 15px;
        margin: 0 0 5%;
        padding: 2%;
        flex: none;
        box-sizing: border-box;
        border: 5px solid #cc0022; }
      #cyber-insurance .compensation-area .tab-name {
        font-size: 16px;
        display: table-cell;
        vertical-align: middle; }
      #cyber-insurance .compensation-area .tab-content {
        /*タブ01*/
        /*タブ02*/
        /*タブ03*/ }
        #cyber-insurance .compensation-area .tab-content .tab-ttl {
          position: relative;
          padding-left: 0;
          margin-bottom: 15px; }
          #cyber-insurance .compensation-area .tab-content .tab-ttl h4 {
            font-size: 26px;
            padding-left: 40px;
            margin-bottom: 10px; }
          #cyber-insurance .compensation-area .tab-content .tab-ttl .lead {
            text-align: left;
            margin-bottom: 0; }
        #cyber-insurance .compensation-area .tab-content .tab-ttl:before {
          content: "";
          position: absolute;
          top: 1%;
          left: 0;
          width: 36px;
          height: 36px;
          background: url(../img/tab_ttl_icon.png) top center no-repeat;
          background-size: contain; }
        #cyber-insurance .compensation-area .tab-content .tab1-table {
          width: 100%;
          border-spacing: 0; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr {
            display: block;
            margin-bottom: 30px;
            min-height: 78px; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr th, #cyber-insurance .compensation-area .tab-content .tab1-table tr td {
              padding: 5%; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident {
              display: block;
              width: 100%;
              box-sizing: border-box; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-icon p {
              position: relative;
              padding-left: 40px;
              display: table-cell;
              vertical-align: middle; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-top {
              background: #fff; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-cost {
              display: block;
              width: 100%;
              box-sizing: border-box; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .tab-accident-cost-top {
              color: #fff;
              background: #cc0022; }
            #cyber-insurance .compensation-area .tab-content .tab1-table tr .support_compensation-ttl {
              padding: 1% 3%;
              margin-bottom: 5px;
              text-align: center;
              color: #fff;
              font-weight: 300;
              background: #cc0022; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr:after {
            content: "";
            position: absolute;
            bottom: -20px;
            left: 0;
            right: 0;
            margin: 0 auto;
            color: #333;
            line-height: 1;
            width: 0;
            height: 0;
            border-style: solid;
            border-color: transparent;
            border-width: 0.6em 0.7em;
            border-top-color: currentColor;
            border-bottom: 0; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child, #cyber-insurance .compensation-area .tab-content .tab1-table tr:last-child {
            margin-bottom: 0; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child:after, #cyber-insurance .compensation-area .tab-content .tab1-table tr:last-child:after {
            display: none; }
          #cyber-insurance .compensation-area .tab-content .tab1-table tr:first-child {
            display: none; }
        #cyber-insurance .compensation-area .tab-content .tab2-img {
          width: 100%;
          height: auto;
          margin: 0 auto; }
        #cyber-insurance .compensation-area .tab-content .tab2-catch {
          font-size: 18px;
          color: #cc0022;
          font-weight: 500;
          margin: 20px auto;
          text-align: center; }
        #cyber-insurance .compensation-area .tab-content .tab2-catch-large {
          font-size: 22px;
          padding-bottom: 5px;
          background: linear-gradient(transparent 60%, #f7e27f 30%); }
        #cyber-insurance .compensation-area .tab-content .tab-point {
          width: 100%;
          padding: 5%;
          background: #fffbe3;
          box-sizing: border-box;
          display: block; }
          #cyber-insurance .compensation-area .tab-content .tab-point .tab-point-left {
            width: 100%;
            margin-bottom: 30px; }
          #cyber-insurance .compensation-area .tab-content .tab-point .tab-point-right {
            width: 100%; }
          #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation .support_compensation-ttl {
            padding: 1% 3%;
            margin-bottom: 20px;
            box-sizing: border-box; }
          #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation ul {
            display: block; }
            #cyber-insurance .compensation-area .tab-content .tab-point .support_compensation ul li {
              width: 100%; }
          #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk {
            padding: 20px;
            border-radius: 15px;
            background: #fff; }
            #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk p {
              font-size: 14px;
              text-align: center; }
            #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk .supportdesk-large {
              font-size: 18px;
              letter-spacing: -1px;
              color: #cc0022; }
            #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk a {
              display: block;
              width: 80%; }
            #cyber-insurance .compensation-area .tab-content .tab-point .supportdesk a:hover {
              opacity: 1; }
        #cyber-insurance .compensation-area .tab-content .tab3-catch {
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap;
          margin-bottom: 20px; }
          #cyber-insurance .compensation-area .tab-content .tab3-catch li {
            padding: 15px;
            margin-bottom: 2%;
            width: 49%; }
        #cyber-insurance .compensation-area .tab-content .tab-point-3 {
          margin: 30px 0 0; }
          #cyber-insurance .compensation-area .tab-content .tab-point-3 .tab-point-left {
            width: 100%; }
          #cyber-insurance .compensation-area .tab-content .tab-point-3 .tab-point-right {
            width: 100%; }
          #cyber-insurance .compensation-area .tab-content .tab-point-3 .attention {
            margin-top: 10px;
            padding-bottom: 0; }
        #cyber-insurance .compensation-area .tab-content .tab4-catch {
          width: 100%;
          height: auto;
          margin: 0 auto 30px; }
        #cyber-insurance .compensation-area .tab-content .tab4-text {
          margin-bottom: 20px; }
          #cyber-insurance .compensation-area .tab-content .tab4-text p {
            font-size: 18px; }
          #cyber-insurance .compensation-area .tab-content .tab4-text .tab4-text-ttl {
            font-size: 20px;
            margin-bottom: 10px; }
        #cyber-insurance .compensation-area .tab-content .tab-point-4 .support_compensation-ttl {
          width: 100%; }
      #cyber-insurance .compensation-area .tab-switch > label:hover,
      #cyber-insurance .compensation-area .tab-switch label:has(:checked) {
        border-top: none;
        border-left: none;
        border-right: none;
        box-sizing: border-box;
        border: 5px solid #cc0022;
        display: inline-table; }
      #cyber-insurance .compensation-area .tab-switch input {
        display: none;
        /* ラジオボタンを見えなくする */ }
      #cyber-insurance .compensation-area .tab-switch > div {
        display: none;
        /* 初期状態ではコンテンツを非表示に */
        width: 100%;
        /* コンテンツの幅を全体に設定 */
        padding: 1.5em 1em;
        /* 上下に1.5em、左右に1emの内側余白 */
        border-radius: 10px;
        background: #fff;
        border: 5px solid #cc0022; }
      #cyber-insurance .compensation-area .tab-switch label:has(:checked) + div {
        display: block;
        /* 選択されたタブのコンテンツを表示 */ } }
  #cyber-insurance .guideline-area {
    background: #eff3f4; }
    #cyber-insurance .guideline-area .guideline-cp {
      width: 60%;
      height: auto;
      margin: -20px auto 0; }
      #cyber-insurance .guideline-area .guideline-cp img {
        width: 100%;
        height: auto; }
    #cyber-insurance .guideline-area .guideline-meyasu {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin: 40px 0 20px; }
      #cyber-insurance .guideline-area .guideline-meyasu li {
        width: 48%;
        padding: 25px;
        border-radius: 15px;
        box-sizing: border-box;
        background: #fff; }
        #cyber-insurance .guideline-area .guideline-meyasu li table {
          width: 100%;
          margin-top: 20px; }
          #cyber-insurance .guideline-area .guideline-meyasu li table tr {
            background: #fff; }
            #cyber-insurance .guideline-area .guideline-meyasu li table tr th {
              color: #fff;
              background: #5b5b5b; }
            #cyber-insurance .guideline-area .guideline-meyasu li table tr th, #cyber-insurance .guideline-area .guideline-meyasu li table tr td {
              padding: 2%;
              font-size: 16px;
              font-weight: 600;
              font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
              text-align: center; }
          #cyber-insurance .guideline-area .guideline-meyasu li table tr:nth-child(odd) {
            background: #eff3f4; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .guideline-area .guideline-cp {
      width: 100%;
      margin: 0 auto 0; }
    #cyber-insurance .guideline-area .guideline-meyasu li {
      width: 100%;
      margin-bottom: 15px; } }
  #cyber-insurance .payment-area {
    padding: 60px 0 0;
    background: #eff3f4; }
    #cyber-insurance .payment-area .payment-meyasu {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin: 40px 0 20px; }
      #cyber-insurance .payment-area .payment-meyasu li {
        width: 48%;
        padding: 25px;
        border-radius: 15px;
        box-sizing: border-box;
        background: #fff; }
        #cyber-insurance .payment-area .payment-meyasu li .attention {
          margin: 20px 0; }
        #cyber-insurance .payment-area .payment-meyasu li .payment-img {
          width: 100%;
          height: auto;
          margin: 0 auto; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .payment-area {
      padding: 100px 0 0; }
      #cyber-insurance .payment-area h3 {
        width: 90%;
        height: auto;
        margin: 0 auto 40px; }
      #cyber-insurance .payment-area .payment-meyasu {
        margin: 40px 0 0px; }
        #cyber-insurance .payment-area .payment-meyasu li {
          width: 100%;
          margin-bottom: 30px; } }
  #cyber-insurance .contract-area {
    padding: 100px 0 0;
    background: #eff3f4; }
    #cyber-insurance .contract-area .step {
      list-style-type: none;
      display: table;
      width: 100%;
      padding: 0;
      margin: 0 0 60px;
      border: 3px solid #cc0022;
      border-radius: 15px;
      overflow: hidden; }
    #cyber-insurance .contract-area .step li {
      width: 25.5%;
      display: table-cell;
      position: relative;
      background: #fff;
      padding: 1em 1em 0.5em 2em; }
      #cyber-insurance .contract-area .step li .step-ttl {
        display: block; }
        #cyber-insurance .contract-area .step li .step-ttl .step-icon {
          display: inline-block;
          color: #fff;
          font-size: 18px;
          padding: 0 2%;
          background: #cc0022; }
        #cyber-insurance .contract-area .step li .step-ttl .topics {
          display: inline-block;
          font-size: 22px;
          letter-spacing: -1px; }
      #cyber-insurance .contract-area .step li .contract-text {
        margin: 30px 0 10px; }
    #cyber-insurance .contract-area .step li:first-child {
      padding-left: 1em; }
    #cyber-insurance .contract-area .step li:last-child:before,
    #cyber-insurance .contract-area .step li:last-child:after {
      display: none; }
    #cyber-insurance .contract-area .step li:before,
    #cyber-insurance .contract-area .step li:after {
      content: "";
      position: absolute;
      width: 0;
      height: 0;
      margin: auto; }
    #cyber-insurance .contract-area .step li:before {
      top: 50%;
      right: -1em;
      border-style: solid;
      border-color: transparent transparent transparent #cc0022;
      border-width: 400px 0 400px 1em;
      margin-top: -400px;
      z-index: 10; }
    #cyber-insurance .contract-area .step li:after {
      top: 50%;
      right: -.8em;
      border-style: solid;
      border-color: transparent transparent transparent #fff;
      border-width: 400px 0 400px 1em;
      margin-top: -400px;
      z-index: 10; }
    @media screen and (min-width: 992px) {
      #cyber-insurance .contract-area .step li:before {
        top: 50%;
        right: -1em;
        border-style: solid;
        border-color: transparent transparent transparent #cc0022;
        border-width: 160px 0 160px 1em;
        margin-top: -160px;
        z-index: 10; }
      #cyber-insurance .contract-area .step li:after {
        top: 50%;
        right: -.8em;
        border-style: solid;
        border-color: transparent transparent transparent #fff;
        border-width: 160px 0 160px 1em;
        margin-top: -160px;
        z-index: 10; } }
    @media screen and (max-width: 767px) {
      #cyber-insurance .contract-area .step {
        width: auto; }
      #cyber-insurance .contract-area .step li {
        width: 95%;
        margin: 0 auto;
        display: flex;
        position: relative;
        background: #fff;
        padding: 1em;
        flex-direction: column;
        padding-bottom: 40px; }
      #cyber-insurance .contract-area .step li:first-child {
        padding-top: 30px; }
      #cyber-insurance .contract-area .step li:before {
        top: 100%;
        right: 0;
        left: 0;
        border-style: solid;
        border-color: transparent transparent transparent #cc0022;
        border-width: 400px 0 400px 2em;
        margin-top: -430px;
        z-index: 10;
        transform: rotate(90deg); }
      #cyber-insurance .contract-area .step li:after {
        top: 100%;
        right: 0;
        left: 0;
        border-style: solid;
        border-color: transparent transparent transparent #fff;
        border-width: 400px 0 400px 2em;
        margin-top: -433px;
        z-index: 10;
        transform: rotate(90deg); } }
  @media screen and (max-width: 767px) {
    #cyber-insurance .contract-area h3 {
      width: 80%;
      height: auto; } }
  #cyber-insurance .question-area {
    padding: 120px 0 60px;
    background: #eff3f4; }
    #cyber-insurance .question-area .accordion-area {
      margin: 0 auto 60px;
      /*アコーディオン*/ }
      #cyber-insurance .question-area .accordion-area .accordion {
        margin: 3px 0;
        border: 1px solid #fff;
        border-radius: 3px;
        background: #fff; }
      #cyber-insurance .question-area .accordion-area .accordion__title {
        position: relative;
        padding: 15px 50px 15px 15px;
        color: #fff;
        font-weight: 600;
        line-height: normal;
        cursor: pointer;
        background: #cc0022;
        transition: all 0.3s; }
      #cyber-insurance .question-area .accordion-area .accordion__title p {
        position: relative;
        padding-left: 50px;
        font-size: 20px; }
      #cyber-insurance .question-area .accordion-area .accordion__title p:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        width: 36px;
        height: 36px;
        margin-top: -18px;
        background: url(../img/question_icon_q.png) no-repeat;
        background-size: contain; }
      #cyber-insurance .question-area .accordion-area .accordion__title.active {
        color: #fff;
        background: #cc0022; }
      #cyber-insurance .question-area .accordion-area .accordion__title::before,
      #cyber-insurance .question-area .accordion-area .accordion__title::after {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        right: 15px;
        width: 15px;
        height: 3px;
        margin: auto 0;
        background-color: #fff;
        transition: all 0.3s; }
      #cyber-insurance .question-area .accordion-area .accordion__title.active::before,
      #cyber-insurance .question-area .accordion-area .accordion__title.active::after {
        background: #fff; }
      #cyber-insurance .question-area .accordion-area .accordion__title::after {
        transform: rotate(90deg); }
      #cyber-insurance .question-area .accordion-area .accordion__title.active::before {
        transform: rotate(180deg); }
      #cyber-insurance .question-area .accordion-area .accordion__title.active::after {
        transform: rotate(180deg);
        opacity: 0; }
      #cyber-insurance .question-area .accordion-area .accordion__content {
        position: relative;
        display: none;
        padding: 20px 30px 20px 15px;
        background: #fff;
        border-radius: 3px; }
      #cyber-insurance .question-area .accordion-area .accordion__content p {
        position: relative;
        padding-left: 50px; }
      #cyber-insurance .question-area .accordion-area .accordion__content:before {
        content: "";
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: auto;
        width: 36px;
        height: 36px;
        background: url(../img/question_icon_a.png) no-repeat;
        background-size: contain; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .question-area {
      padding: 100px 0 40px; }
      #cyber-insurance .question-area h3 {
        width: 80%;
        height: auto; }
      #cyber-insurance .question-area .accordion {
        margin: 3px 0;
        border: 1px solid #fff;
        border-radius: 3px;
        background: #fff; }
      #cyber-insurance .question-area .accordion__title {
        position: relative;
        padding: 15px 50px 15px 15px;
        color: #fff;
        font-weight: 600;
        cursor: pointer;
        background: #cc0022;
        transition: all 0.3s; }
      #cyber-insurance .question-area .accordion__title p {
        position: relative;
        padding-left: 50px;
        font-size: 16px !important; } }
  #cyber-insurance .cyber-footer-area {
    padding: 40px 0; }
    #cyber-insurance .cyber-footer-area a {
      display: block;
      font-size: 16px;
      margin-bottom: 30px; }
    #cyber-insurance .cyber-footer-area .cyber-footer-banner {
      display: block;
      width: 50%;
      margin: 0 auto; }
      #cyber-insurance .cyber-footer-area .cyber-footer-banner img {
        width: 100%;
        height: auto; }
    #cyber-insurance .cyber-footer-area .cyber-footer-banner:hover {
      opacity: 0.7; }
  @media screen and (max-width: 767px) {
    #cyber-insurance .cyber-footer-area {
      padding: 40px 0 20px; }
      #cyber-insurance .cyber-footer-area .cyber-footer-banner {
        display: block;
        width: 70%; } }

/* ==========================================================================
floatingbanner
========================================================================== */
.floating-btn {
  position: fixed;
  top: 25%;
  right: 0;
  width: 120px;
  z-index: 50; }
  .floating-btn a {
    display: block; }
    .floating-btn a img {
      width: 100%;
      height: auto; }
  .floating-btn a:hover {
    opacity: 0.7; }

@media screen and (max-width: 991px) {
  .floating-btn {
    width: 100px; } }
@media screen and (max-width: 767px) {
  .floating-btn {
    position: sticky;
    bottom: 5px;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 96%;
    z-index: 50; }
    .floating-btn a {
      width: 75%;
      display: block;
      margin: 0 auto; }
      .floating-btn a img {
        width: 100%;
        height: auto;
        margin: 0 auto; }
    .floating-btn a:hover {
      opacity: 1; } }