@charset "utf-8";

/* 共通パーツ */
body {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, sans-serif;
  font-size: 1.6em;
  color: #4d4d4f;
}

.disp-sp,
.disp-table-sp {
  display: none;
}

.header {
  border-top: 5px solid #ed1c24;
  margin-bottom: 30px;
}
.header-logo {
  padding: 10px 0 10px 10px;
}
.header-logo img {
  height: 30px;
}
.header-text {
  padding: 6px 0;
}
.header-title {
  background: #ed1c24;
}
.footer {
  margin-top: 24px;
  border-top: 1px solid #d1d1d2;
}
.footer ul {
  margin-bottom: 0;
}
.footer ul li {
  padding: 0 12px !important;
  margin-bottom: 0 !important;
  font-size: 0.8em;
}
.footer-light-gray {
  background: #e6e7e9;
  padding: 12px;
}
.footer-light-gray a {
  color: #4d4d4f;
}
.footer-light-gray ul li {
  border-left: 1px solid #4d4d4f;
}
.footer-light-gray ul li:first-child {
  border-left: none;
}
.footer-dark-gray {
  background: #4d4d4f;
  padding: 12px;
  color: #ffffff;
}
.footer-dark-gray ul li {
  position: relative;
}
.footer-dark-gray ul li:before {
  content: "・";
  position: absolute;
  top: 0;
  left: -6px;
  display: block;
}
.footer-dark-gray ul li:first-child:before {
  content: "";
}
.footer-dark-gray a {
  color: #ffffff;
}
.copyright {
  margin: 6px 0 0 0;
  font-size: 0.8em;
}

.step {
  margin-bottom: 30px;
}
.step ul {
  overflow: hidden;
}
.step ul li {
  width: 20%;
  text-align: center;
  float: left;
  color: #ffffff;
  background: #9d9fa2;
  display: table;
  height: 66px;
  position: relative;
  padding: 0 20px;
}
.step ul li:before {
  content: "";
  position: absolute;
  top: 0;
  right: -20px;
  width: 41px;
  height: 68px;
  background: url(/images/step.png) right no-repeat;
  z-index: 1;
}
.step ul li.step-active {
  background: #ed1c24;
}
.step ul li.step-active:before {
  background: url(/images/step_active.png) right no-repeat;
}
.step ul li.step-before:before {
  background: url(/images/step_active_before.png) right no-repeat;
}
.step ul li.step-last:before {
  width: 28px;
  right: 0;
  background: url(/images/step_last.png) right no-repeat;
}
.step ul li span {
  display: table-cell;
  vertical-align: middle;
}

.wrap {
  width: 100%;
  max-width: 964px;
  margin: 0 auto;
  overflow: hidden;
}
.wrap-content {
   margin: 0 12px 30px 12px;
}
.wrap-content p {
  margin-bottom: 12px;
  line-height: 1.5;
}

.headline,
.heading,
.subhead,
.wrap-content p,
.grid-table {
  word-break: break-all;
}

/* Bootstrap上書き */
.form-control {
  border-radius: 0 !important;
}
.error_message ～ .form-control {
  border: 1px solid #ed1c24 !important;
}
.text-danger {
  color: #ed1c24;
}
.radio-inline {
  margin:10px 10px 0 0 !important;
}
input[type="checkbox"],
 input[type="radio"] {
  margin-top: 1px !important;
 }
.nav-tabs > li > a{
	margin:0;
}


/* テキスト装飾 */
.underline {
  text-decoration: underline;
  color: #00a1e6;
}
.underline:hover {
  text-decoration: none;
  color: #00a1e6;
}
.external-white {
  background: url(/assets/images/icon/icon_external_white.gif) right no-repeat;
}
.external-blue {
  background: url(/assets/images/icon/icon_external_blue.gif) right no-repeat;
}
.arrow-gray {
  background: url(/assets/images/icon/icon_arrow_gray.gif) right no-repeat;
}
.arrow-white {
  background: url(/assets/images/icon/icon_arrow_white.gif) right no-repeat;
}
.arrow-up {
  background: url(/assets/images/icon/icon_arrow_up.gif) right no-repeat;
}
.arrow-down {
  background: url(/assets/images/icon/icon_arrow_down.gif) right no-repeat;
}
.question_blue {
  background: url(/assets/images/icon/icon_question_blue.gif) right no-repeat;
}
.icon {
  background-size: auto 80%;
  padding-right: 30px;
}
.icon-sp {
  background-size: 0;
}
.font-small {
  font-size: 0.8em;
}
.font-yellow {
	color:#ffff00;
}
.text-link {
  padding-right: 18px !important;
}

/* ボタン */
.btn {
  color: #ffffff !important;
  padding: 12px;
  font-size: 1.2em;
}
.btn_none {
  color: #ffffff !important;
  padding: 12px;
  font-size: 1.2em;
}
.btn-small {
  padding: 6px;
  font-size: 0.8em;
}
.btn:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}
.btn_none:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  cursor:default;
}
.btn_none:active {
  box-shadow:none;
}
.btn-red {
  background: #ed1c24;
}
.btn-orange {
  background: #ff7100;
}
.btn-gray {
  background: #818286;
}
.btn-lightgray {
  background: #e4e6ed;
}

.btn-blue {
  background: #009fc2;
}
.dust_box:hover {
	opacity:0.7;
}

/* 見出し */
.headline {
  margin: 0;
  color: #ffffff;
  padding: 12px 0;
}
.heading {
  position: relative;
}
.heading-border {
  margin-bottom: 18px;
  line-height: 1.4;
}
.heading-border:before {
  border-bottom: 3px solid #ed1c24;
  content: "";
  display: block;
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  z-index: -1;
}
.heading-border span {
  background: #ffffff;
  padding-right: 10px;
}
.heading-underline {
  padding-top: 12px;
  margin-bottom: 24px;
  font-size: 1.4em;
}
.heading-underline:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 3px;
  background: #ed1c24;
  display: block;
}
.heading-content {
  margin: 0 12px;
}
.subhead {
  margin-bottom: 18px;
  line-height: 1.4;
}
.subhead span {
  border-left: 6px solid #ed1c24;
  padding-left: 12px;
  display: block;
}
.subhead span a {
  font-size: 0.7em;
  margin-top:10px;
}

/* テーブル定義 */
.grid-table {
  width: 100%;
  color: #4d4d4f;
}
.grid-table .text-danger {
  font-size: 0.8em;
}
.grid-table s {
  font-size: 0.8em;
}
.grid-table table {
  margin-bottom: 24px;
  border-collapse: separate;
  border-spacing: 1px;
}
.grid-table thead {
  border: none;
  position: relative;
}
.grid-table th {
  background: #4d4d4f;
  color: #ffffff;
  border: none !important;
  border-bottom: none;
  vertical-align: middle !important;
  padding: 6px !important;
  font-weight: normal;
}
.grid-table td {
  background: #e6e7e9;
  border: none !important;
  vertical-align: middle !important;
  padding: 18px !important;
}
.grid-table .total {
  background: #bcbdc0 !important;
  font-weight:bold;
}
.grid-table .bak_none {
  background: #FFF !important;
}
.grid-table td div[class^="col-sm-"] + span,
.grid-table td div[class^="col-md-"] + span {
  padding-top: 6px;
  display: block;
}
.grid-table-title {
  margin: 6px 0;
}
.grid-table .list-center li {
  margin-bottom: 0;
}
.grid-table .list-center img {
  width: 100%;
  max-width: 400px;
}
.grid-table .radio,
.grid-table .checkbox {
  margin: 6px;
}
.grid-table .radio label,
.grid-table .checkbox label {
  display: block;
  position: relative;
}
.grid-table .radio label input,
.grid-table .checkbox label input {
  opacity: 0;
}
.grid-table .radio label input + span,
.grid-table .checkbox label input + span {
  padding-left: 12px;
}
.grid-table .radio label input + span:before,
.grid-table .checkbox label input + span:before,
.grid-table .radio label input + span:after,
.grid-table .checkbox label input + span:after {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.grid-table .checkbox label input + span:before {
  background: url(/images/checkbox_off.png) right no-repeat;
  background-size: 100% auto;
}
.grid-table .checkbox label input:checked + span:before {
  background: url(/images/checkbox_on.png) right no-repeat;
  background-size: 100% auto;
}
.grid-table .radio label input + span:before {
  background: url(/images/radio_off.png) right no-repeat;
  background-size: 100% auto;
}
.grid-table .radio label input:checked + span:before {
  background: url(/images/radio_on.png) right no-repeat;
  background-size: 100% auto;
}

/* リスト中央寄せ */
.list-center {
  position: relative;
  display: block;
}
.list-center ul {
  position: absolute;
  text-align: center;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  overflow: hidden;
}
.list-center ul li {
  display: inline-block;
  padding: 0 6px;
  margin-bottom: 12px;
}

.panel {
  border: none;
}
.panel .panel-body {
  display: none;
}

.nav-tabs {
  border-bottom: 5px solid #ed1c24 !important;
  margin: 0 1px;
}
.nav-tabs li {
  padding: 0 6px;
  border: none !important;
  position:relative;
  margin-bottom:0 !important;
}
.nav-tabs li:first-child {
  padding-left: 0;
  padding-right:0;
}
.nav-tabs li:last-child {
  padding-right: 1px;
  padding-left: 0;
}
.nav-tabs li a {
  border-radius: 15px 15px 0 0;
  background: #e6e7e8 !important;
  position: relative;
  display: block;
  border: none !important;
}
.nav-tabs li a:before {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  content: "";
  opacity: 0.7;
  border-radius: 15px 15px 0 0;
}
.nav-tabs li a:hover {
  opacity: 0.7;
}
.nav-tabs li.active a:hover {
  opacity: 1;
}
.nav-tabs li.active a {
  background: #ed1c24 !important;
}
.nav-tabs li.active a:before {
  background: none;
}
.nav-tabs li a img {
  max-width: 100%;
}
.nav-tabs li a .row {
  color:#4d4d4f;
  text-align:center;
  margin-left:0 !important;
  margin-right:0 !important;
}
.nav-tabs .active a .row {
  color:#FFF;
}
.nav-tabs .tab-title {
  padding: 0;
  font-size:1.1em;
  display: table-cell;    
  vertical-align: middle;
}
.tab-content .text {
	margin:24px 0;
}

.period {
  position: relative;
}
.period:before {
  content: "";
  display: block;
  background: #000000;
  width: 12px;
  height: 1px;
  position: absolute;
  top: 50%;
  right: -6px;
}
.slash {
  position: relative;
}
.slash:before {
  content: "/";
  display: block;
  position: absolute;
  top: 6px;
  right: -2px;
}


@media screen and (max-width: 768px) {
  body {
    font-size: 1.4em;
  }
  .wrap-resp{
    padding-left: 10px;
    padding-right: 10px;
  }

  .pdg-side-6-sp {
    padding: 0 6px;
  }
  .disp-pc {
    display: none !important;
  }
  .disp-sp {
    display: block;
  }
  .disp-table-sp {
    display: table-row;
  }
  
  .header {
    border-top: 3px solid #ed1c24;
  }
  .header-logo {
    text-align: center;
  }
  .faq-header-logo{
    text-align: left;
  }
  .header-text {
    text-align: center;
  }
  .footer,
  .footer-light-gray,
  .footer-dark-gray {
    padding: 0;
  }
  .footer ul li {
    display: inline;
    float: left;
    border: none;
    padding: 0 !important;
    text-align: left;
  }
  .footer ul li a {
    border: 1px solid #ffffff;
    border-bottom: none;
    padding: 12px;
    display: block;
    background: #e6e7e9;
    color: #4d4d4f;
  }
  .footer ul li a span {
    display: block;
  }
  .footer-light-gray ul li {
    width: 100%;
  }
  .footer-dark-gray ul li {
    width: 50%;
  }
  .footer-dark-gray ul li:before {
    content: "";
  }
  .footer-dark-gray ul li a:nth-child(odd) {
    border-right: none;
  }
  .copyright {
    padding: 12px;
    margin-top: 0;
  }
  
  .step ul li {
    padding: 0 6px;
  }
  .step ul li:before {
    width: 6px;
    right: -3px;
    background: #ffffff !important;
  }
  .step ul li:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: -3px;
    width: 6px;
    height: 2px;
    background: #9d9fa2;
    z-index: 1;
  }
  .step ul li.step-last:before,
  .step ul li.step-last:after {
    background: none !important;
  }
  
  .btn {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .headline {
    text-align: center;
    font-size: 1.4em;
  }
  .heading {
    font-size: 1.6em;
    margin: 0 6px;
  }
  .heading-border:before {
    bottom: 14px;
  }
  .subhead {
    font-size: 1.4em;
  }
  .subhead span a {
	margin-top:0;
    display: block;
    float: none !important;
    font-weight: normal;
  }
  
  .grid-table {
    font-size: 0.85em;
  }
  .grid-table td {
    padding: 9px !important;
  }
  .grid-table td div[class^="col-sm-"] + span,
  .grid-table td div[class^="col-md-"] + span {
    display: none;
  }
  .grid-table .list-center img {
    margin-top: 12px;
  }
  .grid-table .radio label,
  .grid-table .checkbox label {
    line-height: 2;
  }
  .panel .panel-body {
    margin: 0 6px !important;
  }
  
  .nav-tabs li {
    padding: 0 3px;
  }
  .nav-tabs li a .row {
  padding: 6px 0;
　}
  .nav-tabs li a .product {
  padding-bottom:0; 
  }
  .nav-tabs li a:hover:after {
    display: none;
  }
  .nav-tabs .tab-title {
  font-size:0.9em;
  display:block;
  }
  .tab-content .text {
	margin:12px 0;
	font-size:0.8em;
  }
  .wrap-content {
    margin: 0 0 30px 0;
  }
  .heading-content {
    margin: 0 6px;
  }

  .icon-sp {
    background-size: auto 100%;
    padding-right: 24px;
  }
}
.btn-radius{
    border-radius: 4px;
}