@charset "UTF-8";

/* CSS Document */
/*---------------------------------
base
---------------------------------*/
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"],
button {
  background-color: transparent;
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  outline: none;
  padding: 0;
  cursor: pointer;
}

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration,
button::-webkit-search-decoration {
  display: none;
}

input[type="submit"]:focus,
input[type="button"]:focus,
button {
  outline-offset: -2px;
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.4rem;
  color: #333;
  line-height: 1.5;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Arial, sans-serif;
  width: 100%;
  image-rendering: -webkit-optimize-contrast;
}

p,li,td,th,div,main,article,section{
  font-size: 1.4rem;
}

p:not(:last-child):not([class]),ul:not(:last-child),ol:not(:last-child)  {
  margin-bottom: 1.0em;
}

a:not([href="javascript:void(0);"]), #lnkSearchCountry, #lnkFamilyPlanPrice {
  color: #66a;
  text-decoration: underline;
}

a:not([href="javascript:void(0);"]) * {
  color: #66a;
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

a:hover * {
  text-decoration: none;
}

a:hover:not([href="javascript:void(0);"]) img {
  opacity: 0.7;
}

li {
  list-style-type: none;
}

strong,.strong{
  color: #c02;
}

span.blueColor{
  color: #11afcf;
}

span.redColor{
  color: #c02;
}

#wrapper {
  position: relative;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
}

/* ヘッダー */
#header {
  display: block;
  width: 100%;
  height: 93.2px;
  background-size: 1px 16px;
  position: relative;
  overflow: hidden;
  background-color: #fff;
  border-bottom: 1px solid #c02;
}

#header:after {
  position: absolute;
  bottom: -1px;
  right: 0;
  content: " ";
  display: block;
  width: 33%;
  /* 非サポートブラウザ用のフォールバック */
  width: -moz-calc((100% - 960px)/2);
  width: -webkit-calc((100% - 960px)/2);
  width: calc((100% - 960px)/2);
  height: 16px;
  z-index: 1;
  background: url(../../images/common/header_arc_bg_right.png) repeat-x center bottom;
  background-size: 1px 16px;
}

#header #headerArea {
  width: 100%;
  height: inherit;
  max-width: 960px;
  margin: 0 auto;
  position: relative;
}

#header #headerArea:after {
  position: absolute;
  z-index: 2;
  bottom: 0;
  content: " ";
  display: block;
  width: 100%;
  height: 16px;
  background: url(../../images/common/header_arc_bg_center.png) no-repeat center bottom;
  background-size: 100% 16px;
}

#header #headerArea>.inner{
  position: relative;
  z-index: 1;
  padding: 15px 0;
}

#header #headerArea>.inner{
  font-size: 0;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

#header #headerArea>.inner .logo{
  line-height: 1;
  vertical-align: middle;
  text-align: left;
  display: inline-block;
  width: 50%;
}

#header #headerArea>.inner .logo img{
  vertical-align: bottom;
  width: 220px;
  height: auto;
}

#header #headerArea>.inner .caution img{
  vertical-align: bottom;
  width: 152px;
  height: auto;
}

#header #headerArea>.inner .caution{
  vertical-align: middle;
  font-size: 1.0rem;
  text-align: right;
  display: inline-block;
  width: 50%;
}

/* ナビ */
#stepNavHide {
  background-color: #efefef;
  margin-bottom: 3.0em;
  padding: 10px;
  display: none;
}

#stepNav {
  background-color: #efefef;
  margin-bottom: 3.0em;
  padding: 10px;
}

#stepNav ul {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  font-size: 0;
}

#stepNav ul>li {
  vertical-align: middle;
  position: relative;
  display:inline-block;
  list-style: none;
  font-weight: bold;
  background-color: #bdc1c4;
  color: #fff;
  font-size: 1.4rem;
  text-align: center;
  width: 20%;
}

#stepNav ul>li.active {
  background-color: #c02;
}

#stepNav ul>li:not(:last-child):before {
  display: inline-block;
  content: " ";
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -16px;
  width: 12px;
  height: 100%;
  background:
  -moz-linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat top left/100% 50%,
  -moz-linear-gradient(to top left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat bottom right/100% 50%;
  background:
  -webkit-linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat top left/100% 50%,
  -webkit-linear-gradient(to top left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat bottom right/100% 50%;
  background:
  linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat top left/100% 50%,
  linear-gradient(to top left, rgba(255,255,255,0) 50%, #efefef 50.5%) no-repeat bottom right/100% 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

#stepNav ul>li:not(:last-child):after {
  display: inline-block;
  content: " ";
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -14px;
  width: 12px;
  height: 100%;
  height:-moz-calc(100% - 2px);
  height:-webkit-calc(100% - 2px);
  height:calc(100% - 2px);
  background:
  -moz-linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #bdc1c4 50.5%) no-repeat top left/100% 50%,
  -moz-linear-gradient(to top left, rgba(255,255,255,0) 50%, #bdc1c4 50.5%) no-repeat bottom right/100% 50%;
  background:
  -webkit-linear-gradient(to bottom left, rgba(255,255,255,0) 50%,#bdc1c4 50.5%) no-repeat top left/100% 50%,
  -webkit-linear-gradient(to top left, rgba(255,255,255,0) 50%, #bdc1c4 50.5%) no-repeat bottom right/100% 50%;
  background:
  linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #bdc1c4 50.5%) no-repeat top left/100% 50%,
  linear-gradient(to top left, rgba(255,255,255,0) 50%, #bdc1c4 50.5%) no-repeat bottom right/100% 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

#stepNav ul>li.active:not(:last-child):after {
  background:
  -moz-linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat top left/100% 50%,
  -moz-linear-gradient(to top left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat bottom right/100% 50%;
  background:
  -webkit-linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat top left/100% 50%,
  -webkit-linear-gradient(to top left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat bottom right/100% 50%;
  background:
  linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat top left/100% 50%,
  linear-gradient(to top left, rgba(255,255,255,0) 50%, #c02 50.5%) no-repeat bottom right/100% 50%;
}

#stepNav ul>li>span.inner{
  display: inline-block;
  width: 100%;
  border-top: 2px solid #efefef;
  border-bottom: 2px solid #efefef;
  padding: 0.25em
}

/* メイン */
#main {
  width: 100%;
  display: block;
  margin-bottom: 2.0em;
}

#main>.inner, .content>.inner{
  position: relative;
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}

#main #pageTopButton{
  position: fixed;
  z-index: 10;
  bottom: 0;
  left: 50%;
  width: 44px;
  height: 44px;
  margin-left: 470px;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  -o-border-radius: 100%;
  -ms-border-radius: 100%;
  border-radius: 100%;
}

@media screen and (max-width: 960px) {
  #main #pageTopButton{
    right: -10px;
    left: auto;
    margin-left: 0;
  }
}

#main #pageTopButton a{
  display: inline-block;
}

#main #pageTopButton a img{
  vertical-align: bottom;
  width: 100%;
  height: 100%;
}

#main h1.contentTitle {
  text-align: center;
  font-size: 3.0rem;
  padding: 1em 0;
}

#main h1.contentTitle>.inner {
  position: relative;
  display: inline-block;
  padding-bottom: 0.5em;
}

#main h1.contentTitle>.inner:after {
  vertical-align: middle;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  content: " ";
  display: block;
  width: 50%;
  height: 3px;
  background-color: #c02;
}

#main h2.contentTitle {
  font-size: 1.6rem;
  border-left: 3px solid #c02;
  margin-bottom: 1.0em;
  padding: 0.5em 0 0.5em 0.5em;
}

#main h3.contentTitle{
  font-size: 1.6rem;
  padding: 0.5em;
  margin-bottom: 1.0em;
  background-color: #f0f0f0;
}

#main .content {
  margin: 0 10px;
}

#main .content:not(:last-child){
  margin-bottom: 3.0em;
}

#main .content .colorBox{
  padding: 1.0em;
}

#main .content .colorBox.pink{
  background-color: #fae6e9;
}

#main .content .colorBox.gray{
  background-color: #eee;
}
#main .content .colorBox.cream{
  background-color: #fef7ef;
}

#main .content .colorBox.borderRed{
  border: 1px solid #c02;
}
#main .content .colorBox.borderBlue{
  border: 1px solid #1d2088;
}
#main .content .colorBox.borderGray{
  border: 1px solid #999;
}
#main .content .colorBox.borderCream{
  border: 1px solid #eae3d9;
}


#main .content section:not(:last-child){
  margin-bottom: 2.0em;
}

/* フッター */

#footer {
  width: 100%;
  margin-top: auto;
}

#footer #footerMenu{
  border-top: 2px solid #dbdbdb;
  background-color: #fff;
  padding: 0.5em 0;
}

#footer #footerMenu>.inner{
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

#footer #footerMenu>.inner ul{
  font-size: 0;
}

#footer #footerMenu>.inner ul li{
  display: inline-block;
  margin-right: 20px;
}

#footer #footerMenu>.inner ul li a{
  color: #000;
  font-size: 1.2rem;
}

#footer #copyArea{
  background-color: #c02;
  color: #fff;
  padding: 12px 0;
}

#footer #copyArea>.inner{
  font-size: 0;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

#footer #copyArea>.inner .logo{
  line-height: 1;
  vertical-align: middle;
  text-align: left;
  display: inline-block;
  width: 25%;
}

#footer #copyArea>.inner .logo img{
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

#footer #copyArea>.inner .copyright{
  vertical-align: middle;
  font-size: 1.0rem;
  text-align: right;
  display: inline-block;
  width: 75%;
}

/*---------------------------------
base end
---------------------------------*/
/*---------------------------------
accordion
---------------------------------*/
ul.accordion {
  width: 100%;
  margin-bottom: 1em;
}

/* .formType */
ul.accordion.formType>li{
  list-style-type: none;
}

ul.accordion.formType>li>.accordionTitle {
  display: block;
  color: #333;
  text-decoration: none;
}

ul.accordion.formType>li:not(:last-child) {
  margin-bottom: 1em;
}

ul.accordion.formType>li>.accordionTitle {
  position: relative;
  width: 100%;
  background-color: #f2f3f0;
  border: 2px solid #777;
  padding: 20px;
}

ul.accordion.formType>li.setInput>.accordionTitle {
  background-color: #fae6e9;
  border-color: #c02;
}

ul.accordion.formType>li>.accordionTitle .string {
  display: inline-block;
}

ul.accordion.formType>li>.accordionTitle .string .item {
  position: relative;
  display: inline-block;
  font-weight: bold;
  font-size: 2.0rem;
  margin-right: 1em;
  padding-left: 1.25em;
}

ul.accordion.formType>li>.accordionTitle .string .item:before {
  vertical-align: middle;
  position: absolute;
  top: 50%;
  left: 0.5em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  content: " ";
  display: inline-block;
  width: 15px;
  height: 7px;
  background: url(../../images/common/icon_uarrow_r_b.gif) no-repeat center left;
  background-size: 100% auto;
}

ul.accordion.formType>li>.accordionTitle .string .item .circle {
  vertical-align: top;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2.0;
  display: inline-block;
  background-color: #777;
  color: #fff;
  width: 2.0em;
  height: 2.0em;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  -o-border-radius: 100%;
  -ms-border-radius: 100%;
  border-radius: 100%;
}

ul.accordion.formType>li>.accordionTitle .string .selection {
  display: inline-block;
  font-weight: bold;
  font-size: 2.0rem;
}

ul.accordion.formType>li>.accordionTitle .string .selection .square {
  vertical-align: top;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2.0;
  display: inline-block;
  background-color: #777;
  color: #fff;
  width: 3.0em;
  height: 2.0em;
}

ul.accordion.formType>li>.accordionTitle .string .selection .output{
  font-size: 1.6rem;
  color: #c02;
}

ul.accordion.formType>li>.accordionTitle .string .selection .output:before{
  content: attr(data-output-b);
  color: #777;
}

ul.accordion.formType>li>.accordionTitle .string .selection .output:after{
  content: attr(data-output-a);
  color: #777;
}

ul.accordion.formType>li>.accordionTitle .toggleButton {
  display: none;
}

ul.accordion.formType>li.setInput>.accordionTitle .toggleButton {
  text-decoration: none;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  right: -0.5em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  line-height: 1.0;
  font-weight: bold;
  font-size: 2.1rem;
  display: none;
  padding: 10px 15px;
  background-color: #11afcf;
  color: #fff;
}

ul.accordion.formType>li>.details {
  background-color: #fff;
  border-right: 2px solid #777;
  border-bottom: 2px solid #777;
  border-left: 2px solid #777;
  padding: 20px;
}

ul.accordion.formType>li.setInput>.details {
  border-color: #c02;
}

/* .baseType */
ul.accordion.baseType>li{
  list-style-type: none;
  border: 1px solid #777;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

ul.accordion.baseType>li:not(:last-child){
  margin-bottom: 1.0em;
}

ul.accordion.baseType>li>.accordionTitle{
  position: relative;
  display: block;
  text-decoration: none;
  color: #333;
  padding: 1.0em;
}

ul.accordion.baseType>li:not(.notAccordion)>.accordionTitle{
  padding-right: 40px;
}

ul.accordion.baseType>li:not(.notAccordion)>.accordionTitle:after{
  vertical-align: middle;
  position: absolute;
  top: 50%;
  right: -0.5em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  content: " ";
  display: inline-block;
  width: 29px;
  height: 29px;
  background: url(../../images/common/icon_acc_plus.png) no-repeat center right;
  background-size: 100% auto;
}

ul.accordion.baseType>li.active:not(.notAccordion)>.accordionTitle:after{
  background-image: url(../../images/common/icon_acc_minus.png);
}

ul.accordion.baseType>li>.accordionTitle .string .title{
  font-size: 1.8rem;
  margin-bottom: 1.0em;
}

ul.accordion.baseType>li>.accordionTitle .string h3.title>.inner{
  background: -moz-linear-gradient(top,  rgba(255,240,177,0) 60%, rgba(255,240,177,1) 60%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(255,240,177,0) 60%,rgba(255,240,177,1) 60%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(255,240,177,0) 60%,rgba(255,240,177,1) 60%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fff0b1', endColorstr='#fff0b1',GradientType=0 ); /* IE6-9 */
}

ul.accordion.baseType>li>.details h4.title{
  font-size: 1.6rem;
  border-bottom: 2px solid #c02;
  margin-bottom: 0.75em;
}

ul.accordion.baseType>li>.details{
  border-top: 1px solid #777;
  padding: 1.0em;
  display: none;
}


/*---------------------------------
accordion end
---------------------------------*/
/*---------------------------------
datepicker
---------------------------------*/
.ui-datepicker-current {
  display: none;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 40% !important;
}

.ui-datepicker .ui-datepicker-title{
    margin: 0 1.8em !important;
}
/*---------------------------------
datepicker
---------------------------------*/
/*---------------------------------
form
---------------------------------*/
select {
  line-height: 1;
}

label {
  position: relative;
}

.validationErrorBlock {
  position: relative;
  z-index: 0;
}

.validationErrorBlock:empty {
  display: none;
}

.validationErrorBlock .formErrorContent {
  font-weight: bold;
  font-size: 1.2rem !important;
  background-color: transparent !important;
  color: #c02 !important;
}

.errorBlock {
  border: 1px solid #c02;
  color: #c02;
  font-weight: bold;
  text-align: center;
  margin-bottom: 2.0em;
  padding: 1.0em;
}

.errorBlock p{
  font-size: 1.6rem;
}

.linkButton{
  text-align: center;
  padding: 1.0em 0;
}

.linkButton a {
  font-weight: bold;
  text-align: center;
  text-decoration: underline;
  display: inline-block;
  background-color: #999;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  color: #fff;
  font-size: 1.8rem;
  min-width: 300px;
}

.linkButton a.blueColor{
  background-color: #11afcf;
}

.linkButton a.grayColor{
  background-color: #666;
}

.linkButton a.active{
  background-color: #c02;
}

.linkButton a:hover {
  text-decoration: none;
}

.linkButton a>span{
  display: inline-block;
  text-decoration: underline;
  padding: 1.0em 1.5em;
}

.linkButton a>span>span[class*="icon"]{
  text-decoration: underline;
  color: #fff;
}

.linkButton a>span>span[class*="icon"]:before{
  top: 50%;
}

.linkButton a>span:hover{
  text-decoration: none;
}

.linkButton a>span:hover>span[class*="icon"]{
  text-decoration: none;
}

.linkButton a.downloadButton{
    background-color: #11afcf;
    font-size: 1.4rem;
}

.linkButton.matchHeight a{
    display: table;
    margin: 0 auto;
}

.linkButton.matchHeight a>span{
    display: table-cell;
    vertical-align: middle;
}

a.baseType {
  width: 100%;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  font-weight: bold;
  text-align: center;
  text-decoration: underline;
  display: inline-block;
  background-color: #f2f3f0;
  border: 1px solid #999;
  padding: 1.0em;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  font-size: 1.4rem;
}

div.baseType,
button.baseType {
  width: 100%;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
}

div.baseType>span,
button.baseType>span {
  font-weight: bold;
  text-align: center;
  text-decoration: underline;
  display: inline-block;
  background-color: #f2f3f0;
  border: 1px solid #999;
  width: 100%;
  height: 100%;
  padding: 1.0em;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  font-size: 1.4rem;
}

div.baseType>span:hover,
button.baseType>span:hover {
  text-decoration: none;
}

div.baseType>span>span[class*="icon"],
button.baseType>span>span[class*="icon"] {
  text-decoration: underline;
}

div.baseType>span:hover>span[class*="icon"],
button.baseType:not([disabled])>span:hover>span[class*="icon"] {
  text-decoration: none;
}

.labelBox {
  font-size: 1.4rem;
  display: inline-block;
  position: relative;
  width: auto;
}

.labelBox:not(:last-child) {
  margin-right: 1.0em;
}

.labelBox>span {
  position: relative;
}

input[type="text"] {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -o-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
}

/** checkbox **/
.labelBox input[type="checkbox"]+label {
  line-height: 1.5;
  display: inline-block;
  position: relative;
  padding-left: 2.75em;
  cursor: pointer;
  vertical-align: middle;
  margin-bottom: 1.0em;
}

.labelBox input[type="checkbox"]+label:before {
  font-size: 1.5rem;
  line-height: 1.7;
  text-align: center;
  content: " ";
  display: inline-block;
  width: 25px;
  height: 25px;
  vertical-align: bottom;
  position: absolute;
  left: 1.0em;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  background-color: #fff;
  border: 1px solid #999;
  color: #fff;
}

.labelBox input[type="checkbox"][disabled]+label {
  color: #777 !important;;
}

.labelBox input[type="checkbox"][disabled]+label:before {
  background-color: #ccc !important;
}

.labelBox input[type="checkbox"]:checked+label {
  color:  #cb002f;
}

.labelBox input[type="checkbox"]:checked+label:before {
  background-color: #cb002f;
  background-image: url(../../images/common/icon_check.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1.0em auto;
  border: none;
}

/** radio **/
.labelBox input[type="radio"]+label {
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding-left: 2.75em;
  cursor: pointer;
  vertical-align: middle;
  margin-bottom: 1.0em;
}

.labelBox input[type="radio"]:checked+label {
  color: #c02;
}

.labelBox input[type="radio"]+label:before {
  vertical-align: middle;
  border: 1px solid #a1a1a1;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  -o-border-radius: 30px;
  -ms-border-radius: 30px;
  border-radius: 30px;
  content: " ";
  position: absolute;
  top: 50%;
  left: 1.0em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  display: block;
  width: 30px;
  height: 30px;
  background-color: #fff;
}

.labelBox input[type="radio"][disabled]+label {
  color: #777 !important;;
}

.labelBox input[type="radio"][disabled]+label:before {
  background-color: #ccc !important;
}

.labelBox input[type="radio"]:checked+label:after {
  content: " ";
  display: block;
  position: absolute;
  top: 50%;
  left: 1.0em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  background: #c02;
  width: 16px;
  height: 16px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
  -o-border-radius: 16px;
  -ms-border-radius: 16px;
  border-radius: 16px;
}

.labelBox input[type="checkbox"],
.labelBox input[type="radio"] {
  display: inline-block;
  position: absolute;
  top: 5px;
  left: 20px;
  width: 1px !important;
  height: 1px;
  font-size: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
  visibility: hidden;
}

/** select **/
.selectBox {
  display: inline-block;
  position: relative;
	width: 100%;
  height: 52px;
	margin: 0 auto;
}

.selectBox select {
  font-size: 1.4rem;
	width: 100%;
  height: inherit;
  padding: 0.5em 2.0em 0.5em 1.0em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
  border: 1px solid #999;
  background-color: #fff;
  color: #777;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

.selectBox select[disabled] {
  background-color: #ccc !important;
  color: #777 !important;;
}

.selectBox select.entered{
  color: #000;
}

.selectBox select[data-validation-engine*="required"] {
  background-color: #ffe0e0;
}

.selectBox select.entered[data-validation-engine*="required"] {
  background-color: #fff;
}

.selectBox select option.placeholder {
  display: none;
}

.selectBox select::-ms-expand {
  display: none;
}
.selectBox:after {
  position: absolute;
  top: 50%;
  right: 0.5em;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
	width: 0;
	height: 0;
	padding: 0;
  display: block;
	content: " ";
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #666;
	pointer-events: none;
}

/** text **/
.textBox{
  display: inline-block;
  position: relative;
  width: 100%;
  margin: 0 auto;
  height: 52px;
}

.textBox label{
  vertical-align: bottom;
  display: inline-block;
  font-size: 1.4rem;
  position: relative;
  z-index: 1;
  width: 100%;
  height: inherit;
  margin: 0;
  padding: 0;
  font-size: 0;
  overflow: hidden;
}

.textBox label input[type="text"],
.textBox label input[type="password"],
.textBox label input[type="tel"] {
  font-size: 1.4rem;
  vertical-align: middle;
  display: inline-block;
	width: 100%;
  height: inherit;
  padding: 1.2em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	outline: none;
  border: 1px solid #999;
  background-color: #fff;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

.textBox label input[type="text"][disabled],
.textBox label input[type="password"][disabled],
.textBox label input[type="tel"][disabled] {
  background-color: #ccc !important;
  color: #777 !important;
}

.textBox label.placeholder input[type="text"][disabled] ~ .placeholderLabel,
.textBox label.placeholder input[type="password"][disabled] ~ .placeholderLabel,
.textBox label.placeholder input[type="tel"][disabled] ~ .placeholderLabel  {
  color: #777 !important;
}

.textBox label input[type="text"][data-validation-engine*="required"],
.textBox label input[type="password"][data-validation-engine*="required"],
.textBox label input[type="tel"][data-validation-engine*="required"] {
  background-color: #ffe0e0;
}

.textBox label input.entered[type="text"][data-validation-engine*="required"],
.textBox label input.entered[type="password"][data-validation-engine*="required"],
.textBox label input.entered[type="tel"][data-validation-engine*="required"] {
  background-color: #fff;
}

.textBox label input.entered[type="text"],
.textBox label input.entered[type="password"],
.textBox label input.entered[type="tel"] {
  color: #000;
}

.textBox label input[type="text"]::placeholder,
.textBox label input[type="text"]:-ms-input-placeholder,
.textBox label input[type="text"]:-ms-input-placeholder,
.textBox label input[type="password"]::placeholder,
.textBox label input[type="password"]:-ms-input-placeholder,
.textBox label input[type="password"]:-ms-input-placeholder,
.textBox label input[type="tel"]::placeholder,
.textBox label input[type="tel"]:-ms-input-placeholder,
.textBox label input[type="tel"]:-ms-input-placeholder {
  color: #999;
}

.textBox label.placeholder input.entered[type="text"] ,
.textBox label.placeholder input:focus:not(.entered)[type="text"],
.textBox label.placeholder input.entered[type="password"],
.textBox label.placeholder input:focus:not(.entered)[type="password"],
.textBox label.placeholder input.entered[type="tel"],
.textBox label.placeholder input:focus:not(.entered)[type="tel"]  {
  padding: 1.9em 1.2em 0.5em 1.2em;
}

.textBox label input[type="text"]:not(:last-child),
.textBox label input[type="password"]:not(:last-child),
.textBox label input[type="tel"]:not(:last-child)  {
  width: 80%;
}

.textBox label.placeholder input[type="text"]:not(:last-child),
.textBox label.placeholder input[type="password"]:not(:last-child),
.textBox label.placeholder input[type="tel"]:not(:last-child) {
  width: 80%;
}
.textBox label.placeholder input[type="text"]:nth-last-child(2),
.textBox label.placeholder input[type="password"]:nth-last-child(2),
.textBox label.placeholder input[type="tel"]:nth-last-child(2) {
  width: 100%;
}

.textBox label.placeholder input[type="text"] ~ .placeholderLabel,
.textBox label.placeholder input[type="password"] ~ .placeholderLabel,
.textBox label.placeholder input[type="tel"] ~ .placeholderLabel{
  width: inherit;
  height: 35%;
  overflow: auto;
  text-align: left;
  font-size: 1.2rem;
  top: 0.75em;
  left: 0;
  padding: 0 1.5em;
  position: absolute;
  display: none;
  pointer-events: none;
  user-select: none; /* CSS3 */
  -moz-user-select: none; /* Firefox */
  -webkit-user-select: none; /* Safari、Chromeなど */
  -ms-user-select: none; /* IE10かららしい */
}

.textBox label.placeholder input[type="text"] ~ .placeholderLabel:nth-child(3),
.textBox label.placeholder input[type="password"] ~ .placeholderLabel:nth-child(3),
.textBox label.placeholder input[type="tel"] ~ .placeholderLabel:nth-child(3){
  max-width: 80%;
}

.textBox label.placeholder input.entered[type="text"] ~ .placeholderLabel ,
.textBox label.placeholder input:focus:not(.entered)[type="text"] ~ .placeholderLabel,
.textBox label.placeholder input.entered[type="password"] ~ .placeholderLabel,
.textBox label.placeholder input:focus:not(.entered)[type="password"] ~ .placeholderLabel,
.textBox label.placeholder input.entered[type="tel"] ~ .placeholderLabel,
.textBox label.placeholder input:focus:not(.entered)[type="tel"] ~ .placeholderLabel {
  display: inline-block;
}

.textBox label input[type="text"] + button[type="button"],
.textBox label input[type="password"] + button[type="button"],
.textBox label input[type="tel"] + button[type="button"]{
  position: absolute;
  top: 0;
  vertical-align: middle;
  display: inline-block;
	width: 17%;
  height: 100%;
  margin-left: 3%;
}

.textBox label input[type="text"] + button[type="button"] img,
.textBox label input[type="password"] + button[type="button"] img,
.textBox label input[type="tel"] + button[type="button"] img{
  vertical-align: bottom;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%
}

.textBox.help .helpButton{
  display: block;
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -10px;
  width: 20px;
  height: 100%;
  background-color: #a6daef;
  border: 1px solid #999;
  -moz-border-radius: 0 6px 6px 0;
  -webkit-border-radius: 0 6px 6px 0;
  -o-border-radius: 0 6px 6px 0;
  -ms-border-radius: 0 6px 6px 0;
  border-radius: 0 6px 6px 0;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.textBox.help.helpOn .helpButton {
  border-bottom: none;
  -moz-border-radius: 0 6px 0 0;
  -webkit-border-radius: 0 6px 0 0;
  -o-border-radius: 0 6px 0 0;
  -ms-border-radius: 0 6px 0 0;
  border-radius: 0 6px 0 0;
}

.textBox.help .helpButton > span{
  text-decoration: none;
  font-size: 1.4rem;
  color: #999;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.textBox.help .helpButton > span:before{
  display: block;
  content: "？"
}

.textBox.help.helpOn .helpButton > span:before{
  content: "\2573"
}

.textBox.help .helpBox{
  opacity: 0;
  display: none;
  position: absolute;
  z-index: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 6px;
  background-color: #a6daef;
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
  border-left: 1px solid #999;
  -moz-border-radius: 0 0 6px 6px;
  -webkit-border-radius: 0 0 6px 6px;
  -o-border-radius: 0 0 6px 6px;
  -ms-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
}

.textBox.help.helpOn .helpBox{
  z-index: 2;
}

.textBox.help .helpBox p{
  font-size: 1.1rem;
}

.textBox.help .helpBox p:not(:last-child):not([class]){
  margin-bottom: 6px;
}

.textBox.help.helpOn label input[type="text"],.textBox.help.helpOn label input[type="password"]{
  -moz-border-radius: 6px 6px 6px 0;
  -webkit-border-radius: 6px 6px 6px 0;
  -o-border-radius: 6px 6px 6px 0;
  -ms-border-radius: 6px 6px 6px 0;
  border-radius: 6px 6px 6px 0;
}

label .dataLabel:after{
  content: attr(data-label);
}
/*---------------------------------
form end
---------------------------------*/

/*---------------------------------
attentionBox
---------------------------------*/
#main .content .attentionBox .title{
  font-size: 2.0rem;
  color:#c02;
  font-weight: bold;
  border-bottom: 1px solid #777;
  padding-bottom: 10px;
  margin-bottom: 0.5em;
}
#main .content .attentionBox .title200501{
  font-size: 1.8rem;
  color:#c02;
  font-weight: bold;
}
#main .content .attentionBox .title .subTitle{
  font-size: 1.6rem;
}
/*---------------------------------
attentionBox end
---------------------------------*/
/*---------------------------------
baseTable
---------------------------------*/
.tableBox{
  margin-bottom: 2.0em;
}

.baseTable{
    width: 100%;
    border-collapse: collapse;
}

.baseTable tr th,.baseTable tr td{
    text-align: left;
    vertical-align: middle;
    padding: 0.5em;
    border: 1px solid #999;
}

.baseTable thead tr th{
    text-align: center;
    background-color: #bdc1c4;
}

.baseTable tbody tr th{
    background-color: #f2f3f0;
}

.baseTable tbody tr td{
    background-color: #fff;
}
/*---------------------------------
baseTable end
---------------------------------*/
/*---------------------------------
confirmationTable
---------------------------------*/
.confirmationTable{
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  border: 1px solid #999;
}

/* .confirmationTable + .confirmationTable{
  border-top: none;
} */

.confirmationTable caption{
  position: relative;
  font-weight: bold;
  background-color: #999;
  color: #fff;
  padding: 20px 100px 20px 10px;
}
.confirmationTable caption p{
  text-align: left;
  font-size: 1.6rem;
}

.confirmationTable caption .modification{
  display: block;
  position: absolute;
  top: 50%;
  right: -30px;
  width: 80px;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.confirmationTable caption a.modification{
	 color:#333;
}

a.modification.baseType::before {
    right: 10%;
    margin-left:-0.4rem;
    content: "";
    position: relative;
    height: 0;
    font-size: 0;
    width: 0;
    border-width: 0.8rem;
    border-color: #999;
    vertical-align: middle;
    border-style: solid;
    border-top-color: transparent;
    border-left-color: transparent;
    border-bottom-color: transparent;
　　margin-left: -0.4rem;
}

/* a.modification.baseType::before {

    position: relative;
　　top: 0.6em;
    left: 0rem;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    content: " ";
    display: inline-block;
    width: 0.57em;
    max-width: 8px;
    height: 1.0em;
    max-height: 14px;
    background: url(../../images/common/icon_arrow_03.png) no-repeat center left;
    background-size: 100% auto;
} */

.confirmationTable caption .modification .baseType>span>span{
  color: #000;
}

.confirmationTable tbody.left,.confirmationTable tbody.right{
  vertical-align: top;
  display: table-cell;
  width: 50%;
}

.confirmationTable tbody.both{
  vertical-align: top;
  width: 100%;
}

.confirmationTable tbody.left:not(:last-child),.confirmationTable tbody.right:not(:last-child){
  border-bottom: 1px solid #999
}

.confirmationTable tbody.left:not(:last-child),.confirmationTable tbody.right:not(:last-child){
  border-right: 1px solid #999;
}

.confirmationTable tr:not(:last-child){
  border-bottom: 1px solid #999;
}

.confirmationTable tr th{
  background-color: #f2f3f0;
  border-right: 1px solid #999;
}

.confirmationTable tr td{
  background-color: #fff;
}

.confirmationTable tr th, .confirmationTable tr td{
  vertical-align: middle;
  text-align: left;
  font-size: 1.2rem;
  padding: 0.5em;
}

.confirmationTable tr td *{;
  font-size: 1.2rem;
}

.confirmationTable tr td .mini{;
  font-size: 1.1rem;
}

.confirmationTable tbody.left tr th,.confirmationTable tbody.right tr th {
  width: 125px;
}

.confirmationTable tbody.left tr td, .confirmationTable tbody.right tr td {
  width: 240px;
}

.confirmationTable tbody.both tr th {
  width: 125px;
}

.gecko.win .confirmationTable tbody.both tr th {
  width: 124px;
}

.confirmationTable tbody.both tr td {
  width: 604px;
}

.confirmationTable #insurancePremium td {
  text-align: right;
}

.confirmationTable tr td ul.column li>span,.confirmationTable tr:not(#insurancePremium) td span{
  display: inline-block;
  vertical-align: top;
}

.confirmationTable tr td ul.column li>span.left,.confirmationTable tr td span.left{
  width: 70%;
}

.confirmationTable tr td ul.column li>span.right,.confirmationTable tr td span.right{
  text-align: right;
  width: 30%;
}
/*---------------------------------
confirmationTable end
---------------------------------*/
/*---------------------------------
SP
---------------------------------*/
@media screen and (max-width: 768px) {

  /*---------------------------------
  base
  ---------------------------------*/
  body {
    min-width: auto;
    min-width: initial;
  }

  /* ヘッダー（注意書きあり） */
  #header #headerArea:after {
    background-size: 100% 8px;
  }

  #header #headerArea>.inner {
    padding: 8px 10px;
  }

  #header #headerArea>.inner .logo img{
    width: 180px;
  }

  #header #headerArea>.inner .caution img{
    width: 110px;
  }

  /* ヘッダー */
  #header {
    height: 67.5px;
  }

  #header>.inner:after {
    background-size: 100% 8px;
  }

  #header>.inner .logo {
    padding: 5px 10px;
  }

  #header {
    height: 67.5px;
  }

  /* ナビ */
  #stepNavHide {
    margin-bottom: 1.5em;
    display: none;
  }

  #stepNav {
    margin-bottom: 1.5em;
  }

  #stepNav ul>li{
    width: 12.5%;
  }

  #stepNav ul>li.active{
    width: 50%;
  }

  #stepNav ul>li:not(.active)>span.inner .number{
    margin-left: 6px;
  }

  #stepNav ul>li:not(.active)>span.inner .string{
    display: none;
  }

  #main {
    margin-bottom: 1.0em;
  }

  #main h1.contentTitle {
    font-size: 2.0rem;
  }

  /* フッター */
  #footer #footerMenu{
    padding: 0.5em 10px;
  }

  #footer #copyArea{
    padding: 10px;
  }

  #footer #copyArea>.inner .logo{
    display: none;
  }

  #footer #copyArea>.inner .copyright{
    text-align: center;
    width: 100%;
  }

  /*---------------------------------
  base end
  ---------------------------------*/
  /*---------------------------------
  accordion
  ---------------------------------*/
  /* .formType */
  ul.accordion.formType>li>.accordionTitle {
    padding: 15px 10px;
  }

  ul.accordion.formType>li>.accordionTitle:before {
    left: 1.5em;
  }

  ul.accordion.formType>li.setInput>.accordionTitle .toggleButton {
    display: none;
  }

  ul.accordion.formType>li.setInput:not(.active)>.accordionTitle .toggleButton {
    display: inline-block;
    font-size: 1.4rem;
    top: 27px;
    padding: 5px 10px;
  }

  ul.accordion.formType>li>.accordionTitle .string {
    padding-right: 4.0em;
  }

  ul.accordion.formType>li>.accordionTitle .string .item {
    font-size: 1.7rem;
    margin-right: 0;
    margin-bottom: 0.5em;
  }

  ul.accordion.formType>li>.accordionTitle .string .item .circle {
    font-size: 1.2rem;
  }

  ul.accordion.formType>li>.accordionTitle .string .selection {
    font-size: 1.7rem;
  }

  ul.accordion.formType>li>.accordionTitle .string .selection .square {
    font-size: 1.2rem;
  }

  ul.accordion>li>.details{
    display: none;
  }

  /* .baseType */
  ul.accordion.baseType>li{
    border-width: 2px;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
  }

  ul.accordion.baseType>li>.details{
    border-top-width: 2px;
  }
  /*---------------------------------
  accordion end
  ---------------------------------*/
  /*---------------------------------
  form
  ---------------------------------*/
  .linkButton a {
    min-width: 120px;
    max-width: 320px;
  }

  /*---------------------------------
  form end
  ---------------------------------*/
  /*---------------------------------
  confirmationTable
  ---------------------------------*/
  .confirmationTable tbody.left,.confirmationTable tbody.right{
    display: table-row-group;
    width: 100%;
  }

  .confirmationTable tbody.left tr th,.confirmationTable tbody.right tr th, .confirmationTable tbody.both tr th{
    width: 25%;
  }

  .confirmationTable tbody.left tr td, .confirmationTable tbody.right tr td, .confirmationTable tbody.both tr td{
    width: 75%;
  }
  /*---------------------------------
  confirmationTable end
  ---------------------------------*/
}

/*---------------------------------
SP end
---------------------------------*/
.textBox label input.fieldError,
.textBox label input.entered[type="text"][data-validation-engine*="required"].fieldError,
.textBox label input.entered[type="password"][data-validation-engine*="required"].fieldError,
.textBox label input.entered[type="tel"][data-validation-engine*="required"].fieldError {
  background-color: #ffe0e0 !important;
}

.selectBox select.entered[data-validation-engine*="required"].fieldError {
  background-color: #ffe0e0 !important;
}

