@charset "utf-8";

*, ::before, ::after {box-sizing: border-box;}

body,
input,
select,
textarea {font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', 'hirakakupro-w3'}

body {line-height: 1.5; background: #fff; margin: 0 auto; -webkit-text-size-adjust:100% }

#container {font-size: 120%; max-width: 1000px; margin: 0 auto; min-width: 360px;}
#container {padding: 1.5em 2% 4em;}
.button_wrap {text-align: center; margin: 3em 0 0; position: relative;}
/* section {background: #F3F3F3; margin: 1em 0;} */

/* ==========
ヘッダ・フッタ
========== */
/* ヘッダ */
header::before {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 3px; background: linear-gradient(to right, #0074bf 0%, #00cde5 100%); content: "";}
header {padding: 15px 0; border-bottom: 1px solid #C5C5C5;}
header p {margin: 0 auto; max-width: 1000px; padding: 0 2%;}

/* フッタ */
footer {border-top: solid 1px #C5C5C5; font-size: 9pt; line-height: 1.8;}
#footer-content {text-align: center;}
#footer-content .copyright {margin-top: 1em;}
@media only screen and (min-width: 640px) {
    footer br {display: none;}}
#footer-content-inner {max-width: 1000px; margin: 0 auto; padding: 30px 0 40px;}
@media only screen and (max-width: 1000px) {
    #footer-content-inner {padding-right: 10px; padding-left: 10px;}
}
@media only screen and (max-width: 639px) {
    #footer-content-inner {padding: 20px 10px;}
}
.footer-link {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: -15px; list-style: none; padding: 0;}
@media only screen and (max-width: 639px) {
    .footer-link + .footer-link {margin-top: 15px;}
}
@media only screen and (min-width: 640px) {
    .footer-link {
        -ms-flex-pack: center;
        justify-content: center;}
}
.footer-link > li {position: relative; margin-left: 20px;}
.footer-link > li::after {display: inline-block; width: 1px; height: 15px; margin-left: 20px; vertical-align: -0.25em; background: #a2a7ab; content: "";}
.footer-link > li > a {color: #333; text-decoration: none; transition: opacity .2s;}
.footer-link > li:last-child::after {content: none;}
@media only screen and (min-width: 640px) {
    .footer-link > li > a:hover,
    .footer-link > li > a:active,
    .footer-link > li > a:focus {opacity: .7;}
}

/* 基本タグ */
h1, h2, h3, h4, h5, h6 {margin: 2em 0 0.5em;}
h1:first-child, h2:first-child, h4:first-child, h5:first-child, h6:first-child, p:first-child, ul:first-child {margin-top: 0;}
p:last-child, ul:last-child {margin-bottom: 0;}

h1 {font-size: 160%; margin-bottom: 0.3em;}
h2 {font-size: 140%;}
h3 {font-size: 130%;}
h4 {font-size: 120%;}
h5,
h6 {font-size: 100%;}

a {color: #36c;}
a:hover {color: #006;}

form {margin: 0}
p {margin: 0.5em 0;}

img {border: none; height: auto;}

hr {border: 1px #999; border-style: solid none none; height: 1px;}

table {width: 100%; border-collapse: collapse;}
th, td {vertical-align: top;}

table.input_wrap {background: #e5e9e9;}
table.input_wrap th,
table.input_wrap td {border-bottom: solid 1px #fff;}

th {padding: 0.7em 1em; text-align: left;}
td {padding: 0.7em 1.5em;}

th,
td {display: block; width: auto; padding: 0.7em; float:left\9; width: 100%\9;}
table.input_wrap th,
table.input_wrap td {border: none;}
th {background-color: #666; color: #fff; font-weight: normal;}

/* 文字サイズ */
.md {font-size: 90%;}
.sm {font-size: 80%;}

/* clearfix */
footer::after,
.clearfix::after {content: ''; display: block; clear: both}

/* 子テーブル デザイン付き
table table th,
table table td {display: table-cell;}
table table.type01 caption {text-align: left; padding-bottom: 0.5em;}
table table.type01 th,
table table.type01 td {border: solid 1px #ccc !important; padding: 0.4em;}
table table.type01 {background-color: #fff; font-size: 90%; margin: 1em 0;}
table table.type01 th {background-color: #999; font-weight: normal; width: auto;} */

/* 改行設定 */
.not_convert_lf {white-space: pre-wrap;}

/* ==========
モジュール
 ========== */
/* フロー */
ol.flow {display: flex; justify-content: space-between; flex-wrap: wrap; text-align: center; margin: 0; padding: 0; font-size: 75%; list-style: none;}
ol.flow li {flex: 1; margin: 0.2em 2.3em 0.2em 0; padding: 0.5em; border: solid 1px #b0b0b0; position: relative}
ol.flow li.on {background-color: #0068B6; color: #fff; border-color: #0068B6;}
ol.flow li:last-child {margin-right: 0;}

ol.flow li::before {content: ''; position: absolute; border: solid #999; background-color: #999; border-width: 4px 6px; margin-top: -4px; right: -20px; top: 50%; z-index: 1;}
ol.flow li::after {content: ''; position: absolute; border: solid transparent; border-width: 10px 0 10px 14px; border-left-color: #999; margin-top: -10px; right: -2em; top: 50%; z-index: 1;}
ol.flow li.on::before {border-color: #0068B6; background-color: #0068B6;}
ol.flow li.on::after {border-left-color: #0068B6;}
ol.flow li:last-child:after,
ol.flow li:last-child:before {content: none;}

@media only screen and (max-width: 639px) {
	ol.flow {font-size: 80%;}
	ol.flow li {flex: 0 auto; width: 44%; margin-right: 6% !important;}
	ol.flow li::before {right: -9.5%;}
	ol.flow li::after {right: -13%; border-width: 9px 0 9px 13px; margin-top: -9px;}
}

/* 必須・任意・選択 */
.red {color: #CC3300}
.req::after,
.opt::after,
.choice::after {vertical-align: middle; font-weight: normal; display: inline; margin-left: 1em; content: '必須'; border: solid 1px #cc3300; font-size: 75%; color: #cc3300; padding: 0 0.25em; background: #fff; white-space: nowrap;}
.opt::after {content: '任意'; border-color: #333; color: #333;}
.choice::after {content: '選択'; border-color: #0068B6; color: #0068B6;}

/* th.req,
th.opt {position: relative; padding-right: 4em;}
th.opt:after,
th.req:after {position: absolute; right: 2em; top: 1.2em;} */

/* エラー要素 */
p.err_tit {text-align: center; margin: 2em 0;}
p.err_tit b {color: #cc3300; display: inline-block; padding: 0.2em 0.5em; border: solid 1px #cc3300; text-align: left;}
.err_wrap {border: solid 1px #cc3300; padding: 1em; margin: 2em 0;}
.err_wrap p {text-align: center;}
.err_wrap p b {color: #cc3300; display: inline-block; text-align: left;}
.err_wrap ul {padding-left: 1.5em;}

.err_output {margin: 2em;}
p[id*="_err"],
p[id*="err_"] {color: #cc3300; margin-top: 0.2em; margin-bottom: 0.2em;}

/* パーツ */
.mode {font-size: 80%; color: #666; margin-top: 0;}
.personal {border: 1px solid #000; margin: 1em 0; padding: 1em; margin: 2em 0;}
.personal h3 {margin-top: 0;}
.brd_top {margin-top: 0.5em; padding-top: 0.5em; border-top: solid 1px #fff;}
.word_count {float: right; margin: 0; font-size: 80%;} /* 文字数カウント */
.indent {padding-left: 1em; text-indent: -1em;}

/* 小項目 */
.small_item {margin: 0.5em 0 1em 1em;}

@media only screen and (max-width: 639px) {
  .small_item {margin-left: 0;}
}
p.policy_link {text-align: center; margin: 1.5em 0;}
p.policy_link a {border-radius: 0.4em; display: inline-block; border: solid 1px #b0b0b0; padding: 0.5em 2em 0.5em 3em; position: relative; text-decoration: none; color: #000;}
p.policy_link a::before {content: ''; border: solid transparent; border-left-color: #0068B6; border-width: 0.3em 0 0.3em 0.5em; position: absolute; top: 50%; margin-top: -0.3em; left: 2em;}
p.policy_link a:hover {border-color: #0068B6; color: #0068B6; text-decoration: underline;}

/* 税金表記 */
.tax_info {background-color: rgba(0,0,0,0.6); position: fixed; bottom: 0; left: 0; width: 100%; padding: 0.5em; z-index: 10;}
.tax_info p {font-size: 70%; color: #333; background-color: #CDE5F2; padding: 0.5em 1em; border-radius: 4px;}

/* ホバー吹き出し */
.checkbox-tooltip {position: relative;}
.checkbox-tooltip span[class^="L"],
.checkbox-tooltip span[class*=" L"] {position: relative; border-radius: 0.2em; display: none; padding: 0.5em 1em; font-size: 85%; position: absolute; left: 15em; bottom: 4.2em; background-color: #000; color: #fff; z-index: 1;
-webkit-box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.4); !important;
   -moz-box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.4); !important;
        box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.4); !important;}
.checkbox-tooltip span[class^="L"]::before,
.checkbox-tooltip span[class*=" L"]::before {content: ''; position: absolute; border: solid transparent; border-top-color: #000; border-width: 1.1em 0.8em 0 0; left: 1em; bottom: -1em;}
.checkbox-tooltip:hover span[class^="L"],
.checkbox-tooltip:hover span[class*=" L"]  {display: inline-block;}

@media only screen and (max-width: 639px) {
	.checkbox-tooltip span[class^="L"],
	.checkbox-tooltip span[class*=" L"]  {display: none !important;}
}

/* HEPL機能 */
button.ico_help {display: inline-flex; margin-left: 0.5em; line-height: 1; padding: 0; height: 1.4em; width: 1.4em; justify-content: center; align-items: center; background: #fadc16; color: #333; border: none; border-radius: 0.2em; font-size: 100%; cursor: pointer; font-family: Helvetica; box-shadow: 0 0 3px rgba(0,0,0,0.6);}
button.ico_help:hover {color: #000; background: #ffea5f;}

.box_help {background: #ffffcc; padding: 1em; border-radius: 0.5em; border: solid 2px #fadc16; margin: 0.5em 0;}
.box_help:first-child {margin-top: 0;}
.box_help h4 {font-size: 110%;}


/* ==========
確認画面
 ========== */
body#confirm th,
body#confirm td {border: solid 1px #999;}
body#confirm th {padding: 0.5em 0.7em; border: none; background-color: #666; font-weight: normal;}
body#confirm td {border-top: none;}
body#confirm th.title {background-color: #000; font-weight: bold; border-bottom: solid 1px #fff; font-size: 115%;}

/* OKwave組み込み（ネクストお問い合わせ等） */
#faqlist {border: solid 4px #0068B6; margin: 2em 0; border-radius: 0.4em; overflow: hidden;}
#faqlist h2 {text-align: center; border-bottom: solid 1px #0068B6; padding: 0.7em 0.5em; font-size: 120%; background-color: #DEEBF9;}
@media only screen and (max-width: 639px) {
	#faqlist h2 {text-align: left;}
}
#faqlist ul {list-style: none; margin: 0; padding: 0; font-size: 90%; padding: 0 2%;}
#faqlist li {border-bottom: solid 1px #ccc; padding: 1em  0;}
#faqlist li:last-child {border-bottom: none;}
#faqlist p.icoQ_sml,
#faqlist p.icoA_sml {position: relative; padding: 0.2em 0 0.2em 2.5em;}
#faqlist p.icoQ_sml:before,
#faqlist p.icoA_sml:before {content: 'Q'; position: absolute; top: 0.1em; left: 0; font-size: 170%; font-family: Helvetica; color: #EA9034; line-height: 1; width: 1em; text-align: center;}
#faqlist p.icoA_sml:before {content: 'A'; color: #0068B6;}
#faqlist .hdq_confirm_btn {text-align: center; padding: 0.5em; background-color: #E5E9E9; border-top: solid 1px #0068B6;}
#faqlist .hdq_confirm_btn a {display: inline-block; background-color: #fff; text-decoration: none; color: #000;}

/* 印字日出力 */
.print_date {text-align: right; font-weight: bold; font-size: 90%;}

/* ==========
フォーム要素
 ========== */

/* 入力項目 */
input[type="radio"],
input[type="checkbox"]{-webkit-transform: scale(2.2); transform: scale(2); margin-right: 1em;}

input,
textarea,
label,
select {margin: 0.4em 0; font-size: 110%; border: 1px solid #b0b0b0; padding: 0.5em; background-color: #fff;}
label {font-size: 100%; display: inline-block; text-indent: -1.7em; padding: 12px 15px 12px 60px; border-radius: 0.4em; cursor: pointer;}

input[type="text"],
input[type="email"],
textarea {width: 100%;}
input[type="tel"] {width: 25%;}
select {min-width: 25%; /* margin-right: 2%; */}
label {min-width: 47%; margin-right: 2%;}
/* サイズ調整用 */
label.col1 {min-width: 100%; margin-right: 0;}
label.col3 {min-width: 29%;}
label.col4 {min-width: 22.2%;}
input[type="text"].col2  {width: 47%; margin-right: 2%;}

/* add 0705~ */
input[type="text"].col5  {width: 17%;}

@media only screen and (max-width: 639px) {
  input[type="text"].col5  {width: 25%;}
}
/* ~add 0705 */

select + input {margin-left: 2%;}

input[type="text"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
select:focus,
textarea:focus,
label:hover {border-color: #666 !important;
-webkit-box-shadow: 0 0 4px 0 #999 inset !important;
   -moz-box-shadow: 0 0 4px 0 #999 inset !important;
        box-shadow: 0 0 4px 0 #999 inset !important;}

input[type="text"].err,
input[type="tel"].err,
input[type="email"].err,
select.err,
textarea.err,
label.err {border-color: #cc3300;
-webkit-box-shadow-color: 0 0 4px 0 #cc3300 inset;
         -moz-box-shadow: 0 0 4px 0 #cc3300 inset;
              box-shadow: 0 0 4px 0 #cc3300 inset;}

label.add {border: solid #999 4px !important; padding: 9px 9px 9px 57px;
-webkit-box-shadow: none !important;
   -moz-box-shadow: none !important;
        box-shadow: none !important;}

/* 入力不可 */
input[type="text"]:disabled,
input[type="tel"]:disabled,
select:disabled,
textarea:disabled {background-color: #ddd;}

/* サブミットボタン */
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  box-sizing: border-box;}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {display: none;}
input[type="submit"]::focus,
input[type="button"]::focus {outline-offset: -2px;}

input[type="submit"],
input[type="button"],
.hdq_confirm_btn a {border-radius: 0.4em; position: relative; font-size: 100%; padding: 0.5em 1.5em; margin: 0.5em; background-color: #fff; cursor: pointer; border: solid 1px #b0b0b0;}
input[type="submit"]:hover,
input[type="button"]:hover,
.hdq_confirm_btn a:hover {border-color: #000;}

input[type="submit"].type01,
input[type="button"].type01,
a.type01 {background-color: #0068B6; color: #fff; border: none;}
input[type="submit"].type01:hover,
input[type="button"].type01:hover,
a.type01:hover {background-color: #3386c5;}

input.btn_submit {font-size: 110%; color: #000 !important; background: url(/gf/image/arrow_next.png) #ffdc4d no-repeat center right 0.5em; border-color: #ffcb28; background-size: 1.4em; min-width: 15em; }
input.btn_submit:hover {background-color: #ffcb28; border-color: #ffdc4d;}
input.btn_submit:disabled {color: #333; cursor: default; background: #ddd;}

/* 同意ボタン */
.btn_doui {text-align: center; margin: 1.5em 0 0.5em;}
.btn_doui label {text-align: left; margin: 0 0 0.5em; width: auto; padding-right: 20px;}
.btn_doui label.add {padding-left: 57px; padding-right: 17px;}
.btn_doui label.disable {color: #333; cursor: default; background: #ddd;}

/* 訂正ボタン */
td.correct {background: #e5e9e9; text-align: center;}
td.correct input {margin: 0;}

/* 戻る */
input[type="button"].back {position: absolute; left: 0; top: 0; padding: 0.5em 1.5em 0.5em 2.5em; background-image: url(/gf/image/arrow_back.png); background-position: center left 1em; background-repeat: no-repeat; background-size: 1em;}

/* placeholder */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color: #bbb; opacity: 1;}
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {color: transparent;}
/* Firefox < 19 */
input:-moz-placeholder,
textarea:-moz-placeholder {color: #999;}
input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder {color: transparent;}
/* Firefox > 19 */
input::-moz-placeholder,
textarea::-moz-placeholder {color: #999; opacity: 1;}
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {color: transparent;}
/* Internet Explorer 10 */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {color: #999;}
input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder {color: transparent;}


/* ==========
スマホ
 ========== */
@media only screen and (max-width: 639px) {
	body {font-size: 80%;}
	header {padding-top: 10px; padding-bottom: 10px;}
	header::before {content: none;}
	footer {text-align: center;}
	footer .policy,
	footer .copy {float: none; display: block;}
	h2 {text-align: center;}

	input[type="radio"],
	input[type="checkbox"]{-webkit-transform: scale(1.5); transform: scale(1.5); margin-right: 0.6em;}

	input[type="text"],
	label {width: 100%; margin-right: 0; margin-left: 0;}

	label {padding-left: 40px;}
	label.add {padding-left: 37px;}
	input.btn_submit {width: 90%;}
	input[type="button"].back {position: relative;}
}

