@charset "utf-8";

/* ------------------------------------------------------------
    ベース
------------------------------------------------------------ */
/* 余白削除・リセット */
html, body { margin: 0; padding: 0; }
body { line-height: 1; }
img { vertical-align: top; }
p { margin: 0.8em 0; }
h1, h2, h3, h4, h5, h6 {margin: 0; font-size: 100%; }
ul, ol { margin: 0; padding: 0; list-style-type: none; }
address, cite { font-style: normal }

/* フォント */
html { font-size: 62.5%; }
body { font-size: 1.4rem;}
body {
    font-family:
        'ヒラギノ角ゴ Pro W3',
        'Hiragino Kaku Gothic Pro',
        'メイリオ',
        Meiryo,
        'ＭＳ ゴシック',
        Osaka,
        sans-serif;
    color: #333;
}
main p { line-height: 1.5;}

/* リンク */
a { text-decoration: none; }
a:link { color: #1493d3; }
a:visited { color: #1493d3; }
a:hover,
a:active { color: #2db2f5; text-decoration: underline; }
a strong { color: #f00; font-weight: normal; text-decoration: underline; }

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

/* input系デフォルト */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea {
    border: 1px solid #bfbfbf;
    /*box-shadow: 1px 1px 0px 0px #f2f2f2 inset;*/
    padding: 3px 10px;
    box-sizing: border-box;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
textarea:focus {
    border: 1px solid #2c7cad;
    outline: 0;
}
input:focus {
    transition: border-color 0.2s, background-color 0.2s;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"] {
    width: 55%;
}
textarea {
    width:100%;
    height: 9em;
}
input[type="radio"] {
    margin-right: 5px;
}

/* selectデフォルト */
.select-wrap {
    width: 200px;
    overflow: hidden;
    border: #bfbfbf 1px solid;
    background: url(../img/select_arrow.png) right center no-repeat;
    background-size: 15px 12px;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 200px;
    margin: 0;
    border: 0;
    outline: none;
    padding: 3px 10px;
    background: transparent;
    box-shadow: 1px 1px 0px 0px #f2f2f2 inset;
}

/* プレスホルダー */
/* Webkit */
input::-webkit-input-placeholder {
    color: #aaa;
}
input:focus::-webkit-input-placeholder {
    color: transparent;
    opacity: 1;
}
/* Firefox 19 以降 */
input::-moz-placeholder {
    color: #888;
}
input:focus::-moz-placeholder {
    color:transparent;
    opacity: 1;
}
/* IE 10 以降 */
input:-ms-input-placeholder {
    color: #aaa;
}
input:focus:-ms-input-placeholder {
    color: transparent;
}




/* ラジオボタン・チェックボタン */
.radio, .checkbox {
  display: none;
}
.radio+label, .checkbox+label {
  box-sizing: border-box;
  -webkit-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  margin: 0 20px 0px 0;
  padding-left: 23px;
  border-radius: 8px;
  vertical-align: middle;
  cursor: pointer;
}
.radio+label:hover:after, .checkbox+label:hover:after {
  border-color: #17a1e6;
}
.radio+label:after, .checkbox+label:after {
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;/* middle-->50% */
  left: 0;
  display: block;
  margin-top: -8px;
  width: 12px;
  height: 12px;
  border: 2px solid #bbb;
  content: '';
  background-color: #fff;
  z-index: 0;
}
.radio+label:after {border-radius: 99px;}
.checkbox+label:after {border-radius: 4px;}
.radio+label:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;/* middle-->50% */
  left: 6px;
  display: block;
  margin-top: -2px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #fff;
  content: '';
  opacity: 0;
  z-index: 99;
}
.radio:checked + label:before {
  opacity: 1;
}
.radio:checked + label:after {
  background-color: #17a1e6;
  border-color: #17a1e6;
}
.checkbox+label:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;/* middle-->50% */
  left: 6px;
  display: block;
  margin-top: -6px;
  width: 4px;
  height: 7px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  content: '';
  opacity: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 99;
}
.checkbox:checked + label:before {
  opacity: 1;
}
.checkbox:checked + label:after {
  background-color: #17a1e6;
  border-color: #17a1e6;
}




/* リンク用アイコン付与 */
a.lnk--arrow {
    padding-left: 18px;
    background: url(../img/ico_arrow1.png) no-repeat 0 4px;
    background-size: 13px 13px;
    display: inline-block;/* ボタン下回り込み防止 */
}

/* リンクボタンスタイル */
a.btn--orange,
.btn--orange {
    background-color: #ffa800;
    border-radius: 5px;
    padding: 15px 20px;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    border: 0;
}
a.btn--orange:hover,
.btn--orange:hover {
    filter: alpha(opacity=80);
    opacity: 0.8;
}
svg.btn--orange__svg {
    vertical-align: middle;
    margin-right: 5px;
}

/* リンクボタンスタイル 青 */
a.btn--blue,
.btn--blue {
  background-color: #60c4ff;
  border-radius: 5px;
  padding: 15px 20px;
  display: inline-block;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  border: 0;
  text-align: center;
}
a.btn--blue:hover,
.btn--blue:hover {
  opacity: 0.8;
}
.btn--blue img {
  margin-right: 10px;
}

/* ボタン用非活性追記クラス */
.nonactive {
    pointer-events: none !important;
    background-color: #ddd !important;
    color: #fff !important;
}


/* ------------------------------------------------------------
    レイアウト
------------------------------------------------------------ */
/* 背景 */
.page-home .main,
.page-login .main {
    background-image: url("../img/bg_home.jpg");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center top;
}

/* 全体 */
.header-inner,
.subject-inner,
.contents,
.footer-inner {
    width: 960px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}
.header,
.main,
.subject,
.footer {
    min-width: 1000px;
}


/* ------------------------------------------------------------
    header
------------------------------------------------------------ */
.header {
    background-color: #fff;
    padding: 16px 0;
    border-bottom: 4px solid #ebebeb;
}
.header-logo {
    margin: 0
}
.header-logo small img {
    padding: 15px 0 0 52px;
}

/* メニュー位置 */
.header-inner {
    position: relative;
}
.sub-nav {
    position: absolute;
    top: 0;
    right: 20px;
    font-size: 1.2rem;
}
.main-nav {
    position: absolute;
    bottom: -20px;
    left: 213px;
}

/* サブメニュー */
.sub-nav__list li {
    display: inline-block;
}
.sub-nav__list li:not(.logout) a {
    padding-left: 14px;
    background: url(../img/ico_arrow2.png) no-repeat left center;
    background-size: 11px 11px;
    text-decoration: underline;
    color: #333;
}
.sub-nav__list li:not(.logout) {
    border-left: 1px solid #333;
    padding: 0 13px;
}
.sub-nav__list li:not(.logout):first-child {
    border-left: 0;
    padding: 0 13px 0 0;
}
.sub-nav__list li:last-child {
    padding: 0 0 0 13px;
}
a.btn--orange--logout {
    padding: 8px 12px;
}

/* メインメニュー */
.main-nav__list > li {
    display: inline-block;
    background: url(../img/ico_arrow1.png) no-repeat 0 0;
    background-size: 15px 15px;
    padding-left: 22px;
    margin-right: 15px;
}
.main-nav__list li:last-child {
    margin-right: 0;
}
.main-nav__list--home a {
    text-indent: -9999px;
    display: block;
    width: 41px;
    height: 42px;
    background: url(../img/nav_home.png) no-repeat 0 -42px;
    background-size: 41px 85px;
}
.main-nav__list--home a.select,
.main-nav__list--home a:hover {
    background: url(../img/nav_home.png) no-repeat 0 0;
    background-size: 41px 85px;
}
.main-nav__list--consult a {
    text-indent: -9999px;
    display: block;
    width: 45px;
    height: 42px;
    background: url(../img/nav_consult.png) no-repeat 0 -42px;
    background-size: 45px 85px;
}
.main-nav__list--consult a.select,
.main-nav__list--consult a:hover {
    background: url(../img/nav_consult.png) no-repeat 0 0;
    background-size: 45px 85px;
}
.main-nav__list--appli a {
    text-indent: -9999px;
    display: block;
    width: 121px;
    height: 42px;
    background: url(../img/nav_appli.png) no-repeat 0 -42px;
    background-size: 121px 85px;
}
.main-nav__list--appli a.select,
.main-nav__list--appli a:hover {
    background: url(../img/nav_appli.png) no-repeat 0 0;
    background-size: 121px 85px;
}
.main-nav__list--account a {
    text-indent: -9999px;
    display: block;
    width: 150px;
    height: 42px;
    background: url(../img/nav_account.png) no-repeat 0 -42px;
    background-size: 150px 85px;
}
.main-nav__list--account a.select,
.main-nav__list--account a:hover {
    background: url(../img/nav_account.png) no-repeat 0 0;
    background-size: 150px 85px;
}
.main-nav__list--sheet-form a {
    text-indent: -9999px;
    display: block;
    width: 179px;
    height: 42px;
    background: url(../img/nav_sheet_form.png) no-repeat 0 -42px;
    background-size: 179px 85px;
}
.main-nav__list--sheet-form a.select,
.main-nav__list--sheet-form a:hover {
    background: url(../img/nav_sheet_form.png) no-repeat 0 0;
    background-size: 179px 85px;
}
.main-nav__list--sheet-dl > a {
    text-indent: -9999px;
    display: block;
    width: 103px;
    height: 42px;
    background: url(../img/nav_sheet_dl.png) no-repeat 0 -42px;
    background-size: 103px 85px;
}
.main-nav__list--sheet-dl > a.select,
.main-nav__list--sheet-dl > a:hover {
    background: url(../img/nav_sheet_dl.png) no-repeat 0 0;
    background-size: 103px 85px;
}
.main-nav__list li > a {
    border-bottom: 4px solid #ebebeb;
}
.main-nav__list li > a.select,
.main-nav__list li > a:hover {
    border-bottom: 4px solid #5baadc;
}

/* メインメニュー内ホバーメニュー */
.main-nav__list--sheet-dl {
    position: relative;
}
.main-nav__list > li .child {
    display: none;
    position: absolute;
    z-index: 999;
    top: 15px;
    width: 200px;
    left: 50%;
    margin-left: -100px;
    text-align: center;
}
.main-nav__list > li .child:before {
    content:"";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent #1374a4 transparent;
    position: relative;
    top: -6px;
}
.main-nav__list > li .child ul {
    padding:0;margin:0;
    background: #1373a4;
    border-radius: 8px;
    text-align: left;
}
.main-nav__list > li .child ul li {
    padding:0;margin:0;
    padding: 16px 14px;
    width: 100%;
    box-sizing: border-box;
}
.main-nav__list > li .child ul li:not(:last-child) {
    background: url(../img/line_dot1.gif) repeat-x 0 bottom;
}
.main-nav__list > li .child ul li a {
    padding:0;margin:0;
    display: block;
    padding:5px 0 5px 22px;
    background: url(../img/ico_arrow3.gif) no-repeat 0 center;
    color: #fff;
    text-decoration: none;
    border:none;
}
.main-nav__list > li .child ul li a:hover {
    text-decoration: underline;
}
.main-nav__list > li:hover .child {
    display: block;
}

.disable {
    pointer-events: none;
    opacity: 0.2;
}

/* ------------------------------------------------------------
    main
------------------------------------------------------------ */
.contents {
    padding-bottom: 50px;
}

/* メインタイトル */
.subject {
    background-color: #7dcbf0;
    margin-bottom: 40px;
}

/* トピックパス */
.topicpath {
    position: relative;
}
.topicpath__list {
    position: absolute;
    top: 16px;
    left: 0;
    font-size: 1.2rem;
    color: #fff;
}
.topicpath__list a {
    color: #fff;
}
.topicpath__list li {
    display: inline;
}
.topicpath__list li:before {
    content: " >　";
}
.topicpath__list li:first-child:before {
    content: "";
}


/* ------------------------------------------------------------
    footer
------------------------------------------------------------ */
.footer {
    border-top: 4px solid #f2f2f2;
    padding-bottom: 55px;
    background-color: #fff;
}
.footer-logo,
.address,
.copyright {
	margin: 35px 0;
}
.copyright,
.address {
    color: #8b8b8b;
    line-height: 1.5;
}
.footer {
	padding: 19px 0 45px;
}
.footer .cf::before, .footer .cf::after {
    content: " ";
    display: table;
}
.footer .left_box {
    float: left;
    margin: 0;
}
.footer #f_nav {
	padding-top: 16px;
    text-align: right;
}
.footer #f_nav li {
    display: inline;
    color: #b2b2b2;
}
.footer #f_nav li:not(:last-child), .footer .p-fNav li:not(:last-child) {
    border-right: 1px solid #d9d9d9;
    padding-right: 10px;
    margin-right: 13px;
}
.footer #f_nav li:last-child, .footer .p-fNav li:last-child {
	margin-right: 10px;
}
.footer #f_nav li a, .footer .p-fNav li a {
    font-size: 13px;
    color: #404040;
    text-decoration: none;
}
.footer .p-fNav {
    font-size: 1.3rem;
    padding-left: 0;
}
.footer .p-fNav li {
	float: left;
	margin-top: 2px;
	padding-right: 13px;
}
.footer .p-fNav li:not(:last-child) {
	padding-right: 13px;
}
/* ------------------------------------------------------------
    utility class
------------------------------------------------------------ */
.group {
  display: -webkit-flex; /* Safari */
  display: flex;
}

.disp_if {display:inline-flex;}
.disp_ib {display:inline-block;}

.vM {vertical-align: middle;}
dl.vM dd, dl.vM dt {vertical-align: middle;}
table.vM th, table.vM td {vertical-align: middle;}

.w78 {width:78px !important;}
.w100 {width:100px !important;}
.w110 {width:110px !important;}
.w128 {width:128px !important;}
.w242 {width:242px !important;}
.w270 {width:270px !important;}
.w385 {width:385px !important;}

.mb16 {margin-bottom:16px !important;}
.mb35 {margin-bottom:35px !important;}
.mb38 {margin-bottom:38px !important;}
.ml10 {margin-left:10px !important;}
.ml20 {margin-left:20px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}