/*======================================================

contentsArea

========================================================  */
.contentsArea {
  max-width: 100%;
  width: 1050px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 60px; }
  .contentsArea .productName {
    position: relative;
    font-size: 1.15rem;
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 80px; }
    .contentsArea .productName h1 {
      font-size: 2.4rem;
      line-height: 1.4;
      font-weight: normal; }
    .contentsArea .productName strong {
      display: block;
      font-size: 1.5rem; }
    .contentsArea .productName:after {
      content: "";
      display: block;
      width: 1px;
      height: 60px;
      background-color: #000;
      position: absolute;
      bottom: 0px;
      left: 50%; }
  .contentsArea .sectionArea h2 {
    margin-top: 50px;
    padding-bottom: 20px;
    padding-left: 16px;
    padding-right: 16px;
    text-align: center;
    font-size: 1.7rem; }
  .contentsArea .sectionArea .faqNavi {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .contentsArea .sectionArea .faqNavi ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: flex-start;
      align-items: flex-start;
      -webkit-flex-flow: column;
      -ms-flex-flow: column;
      flex-flow: column;
      padding-left: 16px;
      padding-right: 16px;
      margin-left: auto;
      margin-right: auto; }
      .contentsArea .sectionArea .faqNavi ul li {
        display: block;
        vertical-align: middle;
        margin-right: 20px;
        margin-bottom: 25px; }
        .contentsArea .sectionArea .faqNavi ul li a {
          text-decoration: none;
          display: inline-block;
          padding-left: 30px;
          transition: 0.3s;
          position: relative; }
          .contentsArea .sectionArea .faqNavi ul li a:after {
            content: "";
            display: block;
            width: 20px;
            height: 20px;
            position: absolute;
            top: 1px;
            left: 0;
            background: url(../images/icon_wrap.png) -1px 0 no-repeat;
            background-size: 22px auto; }
          .contentsArea .sectionArea .faqNavi ul li a:hover {
            opacity: 0.6; }
  .contentsArea .sectionArea .faqWrap {
    counter-reset: flowOlCount; }
    .contentsArea .sectionArea .faqWrap .toggleTitle.open h3:after {
      background-image: url(../images/icon_close.png); }
    .contentsArea .sectionArea .faqWrap .toggleContents {
      background-color: rgba(255, 255, 255, 0.8);
      padding: 16px; }
    .contentsArea .sectionArea .faqWrap h3 {
      background-color: rgba(255, 255, 255, 0.8);
      font-size: 1.25rem;
      position: relative;
      margin-top: 10px;
      margin-bottom: 1px;
      line-height: 1.4;
      padding: 25px 50px 25px 16px;
      counter-increment: flowOlCount;
      cursor: pointer;
      transition: 0.3s; }
      .contentsArea .sectionArea .faqWrap h3.list span {
        display: block;
        position: relative;
        padding-left: 25px; }
        .contentsArea .sectionArea .faqWrap h3.list span:after {
          content: "";
          display: block;
          position: absolute;
          height: 6px;
          width: 6px;
          border-radius: 3px;
          top: 10px;
          left: 5px;
          background-color: #000; }
      .contentsArea .sectionArea .faqWrap h3:hover {
        background-color: white; }
      .contentsArea .sectionArea .faqWrap h3:after {
        content: "";
        display: block;
        position: absolute;
        height: 26px;
        width: 26px;
        top: 50%;
        right: 20px;
        margin-top: -13px;
        background: url(../images/icon_open.png) left top no-repeat;
        background-size: 26px auto; }
    .contentsArea .sectionArea .faqWrap h4 {
      font-size: 1.15rem;
      margin-bottom: 10px; }
    .contentsArea .sectionArea .faqWrap a {
      word-break: break-all;
      word-break: break-word; }
    .contentsArea .sectionArea .faqWrap p {
      margin-bottom: 12px; }
    .contentsArea .sectionArea .faqWrap table {
      border-collapse: collapse; }
    .contentsArea .sectionArea .faqWrap img.iconImg {
      height: auto;
      width: 26px;
      margin-top: -0.3em;
      margin-left: 0.2em;
      margin-right: 0.2em; }
    .contentsArea .sectionArea .faqWrap .defaultOl, .contentsArea .sectionArea .faqWrap .defaultDot {
      padding-bottom: 4px; }
      .contentsArea .sectionArea .faqWrap .defaultOl > li, .contentsArea .sectionArea .faqWrap .defaultDot > li {
        margin-bottom: 8px; }
      .contentsArea .sectionArea .faqWrap .defaultOl .defaultDot, .contentsArea .sectionArea .faqWrap .defaultOl .defaultOl, .contentsArea .sectionArea .faqWrap .defaultDot .defaultDot, .contentsArea .sectionArea .faqWrap .defaultDot .defaultOl {
        margin-top: 8px; }
    .contentsArea .sectionArea .faqWrap .defaultOl > li {
      list-style: decimal;
      margin-left: 30px; }
    .contentsArea .sectionArea .faqWrap .defaultDot > li {
      list-style: disc;
      margin-left: 20px; }
    .contentsArea .sectionArea .faqWrap .defaultDot .defaultDot > li, .contentsArea .sectionArea .faqWrap .defaultDot .defaultOl > li {
      list-style-type: circle; }
    .contentsArea .sectionArea .faqWrap .wordList {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: wrap;
      -ms-flex-flow: wrap;
      flex-flow: wrap;
      margin-bottom: 12px; }
      .contentsArea .sectionArea .faqWrap .wordList > dt {
        padding-right: 7px;
        border-right: 1px solid #cbc8de;
        margin-bottom: 8px;
        width: 7.5rem; }
      .contentsArea .sectionArea .faqWrap .wordList > dd {
        width: calc(100% - 7.5rem - 10px);
        margin-left: auto;
        margin-bottom: 8px; }
    .contentsArea .sectionArea .faqWrap .noteCap {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: nowrap;
      -ms-flex-flow: nowrap;
      flex-flow: nowrap;
      margin-bottom: 12px; }
      .contentsArea .sectionArea .faqWrap .noteCap > dt {
        padding-right: 10px; }
      .contentsArea .sectionArea .faqWrap .noteCap + .noteCap {
        margin-top: -4px; }
    .contentsArea .sectionArea .faqWrap .caption {
      display: block;
      text-align: center;
      margin-top: 8px;
      font-size: 1rem;
      line-height: 1.4; }
    .contentsArea .sectionArea .faqWrap .column {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: column;
      -ms-flex-flow: column;
      flex-flow: column; }
    .contentsArea .sectionArea .faqWrap .column.towColumn .col {
      width: 100%;
      margin-right: auto; }
      .contentsArea .sectionArea .faqWrap .column.towColumn .col:last-child {
        margin-left: auto;
        margin-right: 0; }
    .contentsArea .sectionArea .faqWrap .grayBox {
      background-color: rgba(255, 255, 255, 0.8);
      border-radius: 4px;
      padding: 15px 15px 8px 15px;
      margin-bottom: 12px; }
    .contentsArea .sectionArea .faqWrap .specTable {
      border-top: 1px solid #cbc8de;
      border-bottom: 1px solid #cbc8de;
      margin-bottom: 12px;
      background-color: #fff;
      text-align: left;
      font-family: A1 Mincho,serif; }
      .contentsArea .sectionArea .faqWrap .specTable tr th, .contentsArea .sectionArea .faqWrap .specTable tr td {
        border-top: 1px solid #cbc8de;
        border-bottom: 1px solid #cbc8de;
        padding: 8px 5px;
        word-break: break-all;
        word-break: break-word; }
      .contentsArea .sectionArea .faqWrap .specTable tr th {
        background-color: #f5f4f8; }

.w-0 {
  width: 0px; }

.w-10 {
  width: 10px; }

.w-20 {
  width: 20px; }

.w-30 {
  width: 30px; }

.w-40 {
  width: 40px; }

.w-50 {
  width: 50px; }

.w-60 {
  width: 60px; }

.w-70 {
  width: 70px; }

.w-80 {
  width: 80px; }

.w-90 {
  width: 90px; }

.w-100 {
  width: 100px; }

.w-110 {
  width: 110px; }

.w-120 {
  width: 120px; }

.w-130 {
  width: 130px; }

.w-140 {
  width: 140px; }

.w-150 {
  width: 150px; }

.w-160 {
  width: 160px; }

.w-170 {
  width: 170px; }

.w-180 {
  width: 180px; }

.w-190 {
  width: 190px; }

.w-200 {
  width: 200px; }

.w-210 {
  width: 210px; }

.w-220 {
  width: 220px; }

.w-230 {
  width: 230px; }

.w-240 {
  width: 240px; }

.w-250 {
  width: 250px; }

.w-260 {
  width: 260px; }

.w-270 {
  width: 270px; }

.w-280 {
  width: 280px; }

.w-290 {
  width: 290px; }

.w-300 {
  width: 300px; }

.w-310 {
  width: 310px; }

.w-320 {
  width: 320px; }

.w-330 {
  width: 330px; }

.w-340 {
  width: 340px; }

.w-350 {
  width: 350px; }

.w-360 {
  width: 360px; }

.w-370 {
  width: 370px; }

.w-380 {
  width: 380px; }

.w-390 {
  width: 390px; }

.w-400 {
  width: 400px; }

.w-410 {
  width: 410px; }

.w-420 {
  width: 420px; }

.w-430 {
  width: 430px; }

.w-440 {
  width: 440px; }

.w-450 {
  width: 450px; }

.w-460 {
  width: 460px; }

.w-470 {
  width: 470px; }

.w-480 {
  width: 480px; }

.w-490 {
  width: 490px; }

.w-500 {
  width: 500px; }

.w-510 {
  width: 510px; }

.w-520 {
  width: 520px; }

.w-530 {
  width: 530px; }

.w-540 {
  width: 540px; }

.w-550 {
  width: 550px; }

.w-560 {
  width: 560px; }

.w-570 {
  width: 570px; }

.w-580 {
  width: 580px; }

.w-590 {
  width: 590px; }

.w-600 {
  width: 600px; }

.w-610 {
  width: 610px; }

.w-620 {
  width: 620px; }

.w-630 {
  width: 630px; }

.w-640 {
  width: 640px; }

.w-650 {
  width: 650px; }

.w-660 {
  width: 660px; }

.w-670 {
  width: 670px; }

.w-680 {
  width: 680px; }

.w-690 {
  width: 690px; }

.w-700 {
  width: 700px; }

.w-710 {
  width: 710px; }

.w-720 {
  width: 720px; }

.w-730 {
  width: 730px; }

.w-740 {
  width: 740px; }

.w-750 {
  width: 750px; }

.w-760 {
  width: 760px; }

.w-770 {
  width: 770px; }

@media screen and (min-width: 768px) {
  .contentsArea .sectionArea h2 {
    padding-left: 40px;
    padding-right: 40px; }
  .contentsArea .sectionArea .faqNavi {
    display: block; }
    .contentsArea .sectionArea .faqNavi ul {
      display: block;
      text-align: center;
      width: 700px;
      margin-left: auto;
      margin-right: auto; }
      .contentsArea .sectionArea .faqNavi ul li {
        display: inline-block; }
  .contentsArea .sectionArea .faqWrap .toggleContents {
    padding-left: 40px;
    padding-right: 40px; }
    .contentsArea .sectionArea .faqWrap .toggleContents p {
    font-size: 1.11rem;}
  .contentsArea .sectionArea .faqWrap h3 {
    padding-left: 40px;
    padding-right: 85px; }
    .contentsArea .sectionArea .faqWrap h3:before {
      left: 40px; }
    .contentsArea .sectionArea .faqWrap h3:after {
      right: 40px; }
  .contentsArea .sectionArea .faqWrap .column {
    flex-flow: nowrap; }
  .contentsArea .sectionArea .faqWrap .column.towColumn .col {
    width: 50%;
    width: calc(50% - 8px); }
    .contentsArea .sectionArea .faqWrap .defaultOl > li, .contentsArea .sectionArea .faqWrap .defaultDot > li {
        font-size: 1.11rem; }
        }
