@charset "UTF-8";
.c5-container {
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", Osaka, arial, verdana, sans-serif;
  -webkit-font-feature-settings: "palt" 1;
  font-feature-settings: "palt" 1;
  color: #313131;
  font-size: 96.875%;
  /*15.5px*/
  background-color: #f9f9f9; }

h1, h2, h3, h4, h5, h6, dl, dt, dd, p, li, textarea {
  line-height: 1em;
  font-size: 100%;
  margin: 0;
  padding: 0; }

img {
  border: none; }

ol, ul, li {
  list-style: none;
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse; }

.pc {
  display: block; }

.sp {
  display: none; }

.txt-link {
  font-weight: 800;
  color: #000;
  text-decoration: underline; }

.txt-link:hover {
  text-decoration: none; }

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; }

.pageTtl-box {
  display: none; }

.floatL {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  width: 50%;
  padding-right: 15px; }

.floatR {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: right;
  width: 50%;
  padding-left: 15px; }

.flexbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start; }

.pra10__content-wrap {
  width: 100%;
  height: auto;
  padding: 60px 0; }

#detail_02.pra10__content-wrap {
  padding-bottom: 0; }

.pra10__content {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  max-width: 1110px;
  margin: 0 auto;
  padding: 0 15px; }

.pra10__content.flexbox {
  max-width: 1180px; }

/*hero img*/
.pra10__hero-wrap {
  position: relative;
  background: url("../img/pc_hd_bg.jpg") no-repeat center top;
  padding-top: 0; }
  .pra10__hero-wrap .pra10__hero-fl {
    width: 35%;
    max-width: 396px;
    position: relative;
    top: 0; }
    .pra10__hero-wrap .pra10__hero-fl img {
      max-width: 100%; }
  .pra10__hero-wrap .pra10__hero-fr {
    width: 64%;
    max-width: 800px;
    margin-top: 55px;
    margin-left: .5%; }
    .pra10__hero-wrap .pra10__hero-fr img {
      max-width: 100%; }
    .pra10__hero-wrap .pra10__hero-fr p {
      font-size: 13px;
      line-height: 2.1;
      margin-top: 15%; }

.pra10__nav-wrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-top: 1px solid #d9d9d9;
  background: #f6f6f6; }
  .pra10__nav-wrap .pra10__nav {
    max-width: 800px; }
  .pra10__nav-wrap .pra10__nav-ttl {
    -ms-flex-preferred-size: 15%;
    flex-basis: 15%; }
    .pra10__nav-wrap .pra10__nav-ttl img {
      vertical-align: top;
      position: relative;
      top: 3px; }
  .pra10__nav-wrap .pra10__ancer {
    -ms-flex-preferred-size: 85%;
    flex-basis: 85%; }
    .pra10__nav-wrap .pra10__ancer li {
      padding-left: 28px;
      background: url("../img/arrow_ancer.png") no-repeat left center; }
    .pra10__nav-wrap .pra10__ancer li:not(:last-child) {
      margin-bottom: 20px; }
    .pra10__nav-wrap .pra10__ancer li a {
      text-decoration: none;
      -webkit-transition: all .3s;
      -o-transition: all .3s;
      transition: all .3s; }
      .pra10__nav-wrap .pra10__ancer li a:hover {
        opacity: .6; }
    .pra10__nav-wrap .pra10__ancer li span {
      font-weight: 800;
      width: 110px;
      display: inline-block; }

#detail_01, #detail_02, #detail_03 {
  border-top: #d9d9d9 solid 1px; }

.pra10__content-ttl {
  font-size: 30px;
  font-weight: 800;
  line-height: 1.8em;
  letter-spacing: 0.07em;
  text-align: center; }

.pra10__content-txt {
  line-height: 2.4;
  margin-top: 40px;
  font-size: 15px; }

.c5__txt-small {
  margin-top: 0;
  font-size: 13px; }

.pra10__flex-wrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 1080px;
  margin: 60px auto 0; }

.pra10__flex-border {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px 30px 30px;
  border: #E4E4E4 dotted 1px;
  background: url("../img/bg__flex.gif") no-repeat left top;
  background-color: #fff; }
  .pra10__flex-border .pra10__oneImg {
    margin-bottom: 10px; }

.pra10__flex-inner {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .pra10__flex-inner .pra10__content-txt {
    width: 49%; }

.pra10__flex-ttl {
  font-size: 18px;
  font-weight: 800;
  text-align: left;
  line-height: 2.4; }

.flexbox__img {
  width: 49%;
  max-width: 525px; }
  .flexbox__img:first-child {
    margin-right: 20px; }

.pra10__content h3 {
  font-size: 22px;
  font-weight: 800;
  text-align: center;
  margin: 70px auto 50px;
  line-height: 1; }

.pra10__oneImg {
  display: block;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto; }

.pra10__caution {
  font-size: 11px;
  margin-top: 20px;
  display: block;
  color: #808080; }

/*pra10__content-bottom*/
.pra10__content-bottom {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin-top: 60px;
  padding: 80px 15px;
  background-color: #2e2b32; }
  .pra10__content-bottom .pra10__content-bottom-inner {
    max-width: 1110px;
    margin: 0 auto; }
  .pra10__content-bottom h3 {
    font-size: 24px;
    text-align: center;
    color: #eeba55;
    font-weight: 100;
    letter-spacing: 0.13em; }
  .pra10__content-bottom .pra10__content-txt {
    color: #fff; }

.pra10__card-wrap {
  width: 100%;
  max-width: 1080px;
  margin: 40px auto 0; }
  .pra10__card-wrap ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0; }
    .pra10__card-wrap ul li {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-box-flex: 0;
      -ms-flex: 0 1 49%;
      flex: 0 1 49%;
      max-width: 525px;
      margin-bottom: 2.5%;
      padding: 20px 20px 30px;
      background-color: #fff; }
      .pra10__card-wrap ul li h4 {
        font-size: 16px;
        font-weight: 800;
        color: #a91c00;
        background: url("../img/icon_rec.png") no-repeat;
        height: 36px;
        line-height: 36px;
        margin-bottom: 15px;
        padding-left: 45px; }
      .pra10__card-wrap ul li img {
        display: block;
        max-width: 100%;
        margin: 0 auto; }
      .pra10__card-wrap ul li p {
        font-size: 13px;
        line-height: 2.1;
        font-weight: 800;
        color: #555;
        padding: 5px 10px 0; }

/*matome*/
#detail_04.pra10__content-wrap {
  position: relative;
  background: url("../img/bg_matome.png") no-repeat center top; }

.pra10__fooer__flex-wrap {
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 30px; }
  .pra10__fooer__flex-wrap .pra10__fooer__flex-content {
    width: 60%;
    max-width: 560px; }
    .pra10__fooer__flex-wrap .pra10__fooer__flex-content h2 {
      font-size: 23px;
      line-height: 1.8;
      font-weight: 100;
      letter-spacing: 0.07em;
      padding-bottom: 30px;
      color: #e6c336; }
    .pra10__fooer__flex-wrap .pra10__fooer__flex-content p {
      font-size: 14px;
      line-height: 2.2;
      padding: 0 0 20px 0;
      margin: 0;
      color: #E3E3E3; }
  .pra10__fooer__flex-wrap img {
    width: 27%;
    max-width: 274px; }

/*リンク*/
.pra10__txtlink {
  display: block;
  width: 100%;
  max-width: 630px;
  color: #fff;
  font-size: 13px;
  text-align: center;
  padding: 15px 0;
  background-color: #3a5573;
  border-radius: 2px; }
  .pra10__txtlink:hover {
    text-decoration: none;
    color: #fff; }

/*バナー*/
.pra10__link {
  display: block;
  width: 100%;
  max-width: 822px;
  margin: 70px auto 0; }
  .pra10__link img {
    width: 100%; }

/*商品リンク*/
.pra10__prolink {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 1110px;
  margin: 0 auto;
  padding: 0 15px; }
  .pra10__prolink .flexbox {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 960px;
    margin: 0 auto; }
  .pra10__prolink h3 {
    margin: 0 auto 80px;
    padding-bottom: 5px;
    border-bottom: 1px solid #161313;
    font-size: 26px; }
  .pra10__prolink .pra10__proimg {
    display: block;
    width: 27%;
    max-width: 257px; }
  .pra10__prolink img {
    width: 100%; }

.pra10__prolink-txt {
  width: 30%;
  margin-left: 8%; }
  .pra10__prolink-txt h4 {
    line-height: 1.3;
    margin-bottom: 5px; }
    .pra10__prolink-txt h4 .prdt_name1 {
      font-size: 24px; }
    .pra10__prolink-txt h4 .prdt_name2 {
      font-size: 39px; }

@media (max-width: 768px) {
  .pc {
    display: none; }
  .sp {
    display: block; }
  .pra10__content-wrap {
    padding: 30px 0; }
  /*top sp*/
  .pra10__hero-wrap {
    background: none;
    background-color: #fff;
    padding-bottom: 0; }
    .pra10__hero-wrap .pra10__content {
      padding: 0; }
    .pra10__hero-wrap .flexbox {
      display: block; }
    .pra10__hero-wrap .pra10__hero-fr {
      width: 100%;
      margin-top: 0;
      margin-left: 0; }
      .pra10__hero-wrap .pra10__hero-fr img {
        width: 100%; }
      .pra10__hero-wrap .pra10__hero-fr p {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 10px auto 0;
        padding: 0 15px 15px; }
  .pra10__sp-conttl {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #efefef;
    padding: 5px 15px; }
    .pra10__sp-conttl img {
      vertical-align: middle;
      width: 28%;
      max-width: 145px; }
  .pra10__sp-ttl {
    font-size: 17px;
    font-weight: bold;
    color: #233c98; }
  .pra10__content-ttl {
    font-size: 14px;
    line-height: 1.5em;
    text-align: left;
    font-weight: normal;
    margin-top: 7px;
    margin-bottom: 40px; }
  .pra10__content-txt {
    line-height: 2;
    font-size: 14px;
    margin-top: 20px; }
  .c5__txt-small {
    font-size: 11px;
    font-weight: 800;
    margin-top: 10px; }
  .pra10__link {
    margin-top: 30px; }
  .pra10__flex-border {
    padding: 16px 20px 18px;
    background-size: 4%; }
  .pra10__flex-wrap {
    margin: 30px auto 0; }
  .pra10__flex-inner .pra10__content-txt {
    width: 100%; }
  .pra10__flex-ttl {
    font-size: 14px;
    margin: 0 0 10px 0;
    line-height: 2; }
  .pra10__flex-spNone {
    display: block; }
    .pra10__flex-spNone .flexbox__img {
      display: block;
      width: 100%;
      max-width: 100%;
      margin: 0 auto; }
  .flexbox__img:first-child {
    margin-right: 0; }
  .pra10__content p + h3 {
    margin-top: 35px; }
  .pra10__content h3 {
    font-size: 16px;
    margin: 35px auto 0;
    padding: 0;
    line-height: 1.6;
    text-align: left; }
  .pra10__content-bottom {
    margin-top: 30px;
    padding: 40px 15px; }
    .pra10__content-bottom h3 {
      font-size: 16px;
      text-align: left; }
    .pra10__content-bottom .pra10__content-txt {
      font-size: 13px;
      margin-top: 20px; }
  .pra10__card-wrap {
    margin: 20px auto 0; }
    .pra10__card-wrap ul li {
      -webkit-box-flex: 0;
      -ms-flex: 0 1 100%;
      flex: 0 1 100%;
      max-width: 100%;
      margin-bottom: 10px;
      padding: 20px; }
      .pra10__card-wrap ul li h4 {
        font-size: 14px;
        background-size: 25px;
        height: 25px;
        line-height: 25px;
        padding-left: 35px; }
      .pra10__card-wrap ul li p {
        font-size: 11px;
        line-height: 2.1;
        padding: 5px 0; }
  /*matome sp*/
  #detail_04 {
    border-top: #d9d9d9 solid 1px; }
  #detail_04.pra10__content-wrap {
    position: relative;
    background: none; }
  .pra10__fooer__flex-wrap {
    display: block;
    padding: 0; }
    .pra10__fooer__flex-wrap .pra10__fooer__flex-content {
      width: 100%;
      max-width: 100%; }
      .pra10__fooer__flex-wrap .pra10__fooer__flex-content h2 {
        font-size: 14px;
        line-height: 1.5;
        font-weight: normal;
        padding-bottom: 0;
        color: #313131;
        margin-top: 7px; }
      .pra10__fooer__flex-wrap .pra10__fooer__flex-content .pra10__sp-ttl {
        font-size: 17px;
        font-weight: bold;
        color: #233c98;
        padding-bottom: 0;
        line-height: 1em; }
      .pra10__fooer__flex-wrap .pra10__fooer__flex-content h2 + p {
        font-size: 14px;
        line-height: 2;
        color: #313131;
        margin-top: 40px; }
  .pra10__prolink h3 {
    margin: 0 auto 40px;
    padding-bottom: 5px;
    font-size: 16px; }
  .pra10__prolink .pra10__proimg {
    width: 45%; }
  .pra10__prolink-txt {
    width: 50%;
    -ms-flex-preferred-size: 190px;
    flex-basis: 190px;
    margin-left: 0; }
    .pra10__prolink-txt h4 .prdt_name1 {
      font-size: 17px; }
    .pra10__prolink-txt h4 .prdt_name2 {
      font-size: 24px; } }

@media (max-width: 400px) {
  .pra10__prolink-txt {
    max-width: 140px;
    margin: 0 auto; }
    .pra10__prolink-txt h4 .prdt_name1 {
      font-size: 13px; }
    .pra10__prolink-txt h4 .prdt_name2 {
      font-size: 20px; }
  .pra10__flex-border {
    background-size: 6%; } }

/* ============================================
  mouseover effect
   ============================================*/
.mod-effect img {
  -webkit-transition: opacity 0.3s !important;
  -o-transition: opacity 0.3s !important;
  transition: opacity 0.3s !important; }

.mod-effect img:hover {
  opacity: 0.8 !important;
  filter: alpha(opacity=80) !important;
  -ms-filter: alpha(opacity=80) !important; }
