@charset "UTF-8";
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-weight: normal; }
body { line-height: 1; }
html { font-size: 62.5%; /* Sets up the Base 10 stuff */ }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
nav ul { list-style: none; }
li { list-style-type: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; }
a img { border: none; }
/* change colours to suit your needs */
ins { text-decoration: none; }
/* change colours to suit your needs */
mark { font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }
/* change border colour to suit your needs */
hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }
input { -webkit-appearance: none; }
button { cursor: pointer; background: none; border: 0; width: auto; overflow: visible; padding: 0; margin: -1px 0; }
/* ------------------- テキスト飛ばす ------------------- */
/* ------------------- リセット ------------------- */
/* ------------------- Clearfix ------------------- */
/* ------------------- Clearfix ------------------- */
.clearfix { zoom: 1; }
.clearfix:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; }
/* ------------------- プロパティにプレフィックスを付与 ------------------- */
/* ------------------- 天地中央 ------------------- */
/* ------------------- transform ------------------- */
/* ------------------- animation ------------------- */
/* ------------------- shadow ------------------- */
/* ------------------- グラデーション ------------------- */
/* ------------------- 角丸 ------------------- */
/* ------------------- 線の幅を100%内に収める ------------------- */
html[lang="ja"] { font-size: 16px; color: #333333; font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: lighter; -webkit-font-smoothing: antialiased; }
body { background-color: #f0f0f0; }
/* ------------------------------ */
/* aniamtion                      */
/* ------------------------------ */
@keyframes fade-in { 0% { visibility: visible;
    opacity: 0; }
  100% { visibility: visible;
    opacity: 1; } }
@keyframes fade-out { 0% { visibility: visible;
    opacity: 1; }
  100% { visibility: hidden;
    opacity: 0; } }
/* SP */
@media only screen and (max-width: 999px) { .pc { display: none; }
  .sp { display: block; }
  img { width: 100%; height: auto; }
  body .header { background-color: #fff; display: block; height: 74px; }
  body .header h1 a { position: absolute; width: 192px; height: 89px; background: url(../img/logo.png) no-repeat 14px 14px; overflow: hidden; text-indent: 100%; white-space: nowrap; }
  body .wrapper { width: 100%; margin: 0 auto; background-color: #fff; }
  body .main_visual { display: block; width: 100%; height: auto; /*background: url(../img/visual_bg_sp.jpg) no-repeat; background-size: 100% auto;*/ }
  body .main_visual .copy { position: relative; /*width: 356px; height: 104px;*/ width: 0px; height: 0px; top: 57px; left: 27px; /*background: url(../img/main_txt.png) no-repeat 0px 0px; background-size: 356px 104px;*/ overflow: hidden; text-indent: 100%; white-space: nowrap; }
  body .contentWrapper { margin: 0 4% 0 4%; }
  body .contentWrapper .msgWrap { margin: 0 auto; margin-top: 25px; }
  body .contentWrapper .msg { font-size: 14px; border: #24437e 1px solid; padding: 17px 4% 18px 4%; text-align: center; line-height: 1.5em; }
  body .step.active { height: auto; visibility: visible; }
  body .step.deactive { height: 0; visibility: hidden; }
  body .stepMsg { background-color: #f0f0f0; }
  body .stepMsg p { padding: 46px 0 44px 0; font-size: 16px; line-height: 1.5em; text-align: center; }
  body .section { margin: 40px 0 44px 0; }
  body .section input { font-size: 16px; width: 320px; }
  body .section input:-ms-input-placeholder { color: #cccccc; }
  body .section input::placeholder { color: #cccccc; }
  body .section .caption { margin-top: 8px; font-size: 12px; }
  body .section ul li.active { height: auto; visibility: visible; }
  body .section ul li.deactive { height: 0; visibility: hidden; }
  body .section ul li .m { width: 320px; }
  body .section ul li .m input { font-size: 16px; width: 100%; }
  body .section ul li .sm { width: 230px; }
  body .section ul li .s { width: 200px; margin-right: 26px; }
  body .section ul li .s:last-child { margin-right: 0px; }
  body .section ul li .s input { font-size: 16px; width: 184px; }
  body .section ul li .colum { margin: 16px 0 18px 0; }
  body .section ul li .colum span { color: #fff; padding: 1px 8px 2px 8px; margin-left: 12px; font-size: 14px; background-color: #24437e; }
  body .section ul li .colum span.required { background-color: #333; }
  body .section ul li .value input, body .section ul li .value textarea { font-size: 16px; padding: 14px 17px 14px 17px; margin-top: 10px; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .section ul li .value textarea { width: 100%; }
  body .section ul li .value .selectWrap { width: 100%; padding-left: 0; overflow: hidden; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .section ul li .value select { font-size: 16px; color: #333333; width: calc(100% + 20px); padding: 14px 17px 14px 17px; background: url(../img/triangle.png) no-repeat right 34px center; background-size: 14px 9px; border: none; }
  body .section ul li .value input.error, body .section ul li .value select.error { border: #d2514c 1px solid; }
  body .section ul li .value .txt { margin: 14px 0 0 16px; }
  body .section ul li span.error { padding: 2px 0 2px 0; font-size: 14px; color: #d2514c; }
  body .section ul .flexwrap { display: -ms-flexbox; display: flex; frex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  body .section ul .flexwrap.second { width: 100%; }
  body .section ul .txtSub { margin: 12px 0 0 10px; color: #333333; font-size: 16px; }
  body .section .radioWrap { padding: 14px 10px 14px 10px; border: #d6d6d6 1px solid; border-radius: 4px; margin-bottom: 10px; }
  body .section .radioWrap.s { width: 206px; margin-right: 12px; }
  body .section .radioWrap.s:last-child { margin-right: 0px; }
  body .section .radioWrap label { position: relative; cursor: pointer; padding-left: 30px; }
  body .section .radioWrap label::before, body .section .radioWrap label::after { content: ""; display: block; border-radius: 50%; position: absolute; transform: translateY(-50%); top: 50%; }
  body .section .radioWrap label::before { background-color: #fff; border: 1px solid #cecece; border-radius: 50%; width: 16px; height: 16px; left: 5px; }
  body .section .radioWrap label::after { background-color: #5d5d5d; border-radius: 50%; opacity: 0; width: 10px; height: 10px; left: 9px; }
  body .section .radioWrap input:checked + label::after { opacity: 1; }
  body .section .radioWrap .visually-hidden { position: absolute; white-space: nowrap; border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; height: 1px; width: 1px; margin: -1px; padding: 0; }
  body .section ul li .value .selectShortWrap { width: 220px; padding-left: 0; overflow: hidden; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .btnWrap { display: block; text-align: center; }
  body .btnWrap .btn { font-size: 18px; color: #fff; width: 368px; padding: 22px 0 24px 0; background-color: #27365e; margin-bottom: 80px; } }
/* PC */
@media screen and (min-width: 1000px), print { .pc { display: block; }
  .sp { display: none; }
  body { /*#btnTop.open { animation: fade-in 0.35s ease-in forwards; } #btnTop.close { animation: fade-out 0.35s ease-out forwards; }*/ }
  body .header { background-color: #fff; display: block; height: 92px; }
  body .header h1 a { position: absolute; width: 192px; height: 89px; background: url(../img/logo.png) no-repeat 20px 20px; overflow: hidden; text-indent: 100%; white-space: nowrap; }
  body .wrapper { width: 780px; margin: 0 auto; background-color: #fff; }
  body .main_visual { display: block; height: 300px; background: url(../img/visual_bg.jpg) no-repeat; }
  body .main_visual .copy { position: relative; width: 713px; height: 209px; top: 57px; left: 27px; background: url(../img/main_txt.png) no-repeat 0px 0px; overflow: hidden; text-indent: 100%; white-space: nowrap; }
  body .contentWrapper { margin: 0 25px 0 25px; }
  body .contentWrapper .msgWrap { margin: 0 auto; margin-top: 25px; }
  body .contentWrapper .msg { border: #24437e 1px solid; padding: 17px 0 18px 0; text-align: center; }
  body .step.active { height: auto; visibility: visible; }
  body .step.deactive { height: 0; visibility: hidden; }
  body .stepMsg { background-color: #f0f0f0; }
  body .stepMsg p { padding: 46px 0 44px 0; font-size: 22px; text-align: center; }
  body .section { margin: 40px 0  44px 0; }
  body .section input { width: 436px; }
  body .section input:-ms-input-placeholder { color: #cccccc; }
  body .section input::placeholder { color: #cccccc; }
  body .section .caption { margin-top: 8px; font-size: 12px; }
  body .section ul li.active { height: auto; visibility: visible; }
  body .section ul li.deactive { height: 0; visibility: hidden; }
  body .section ul li .m { width: 470px; }
  body .section ul li .sm { width: 317px; }
  body .section ul li .s { width: 234px; margin-right: 26px; }
  body .section ul li .s.sub { width: 250px; margin-right: 26px; }
  body .section ul li .s:last-child { margin-right: 0px; }
  body .section ul li .s input { width: 184px; }
  body .section ul li .colum { margin: 16px 0 18px 0; }
  body .section ul li .colum span { color: #fff; padding: 1px 8px 2px 8px; margin-left: 12px; font-size: 14px; background-color: #24437e; }
  body .section ul li .colum span.required { background-color: #333; }
  body .section ul li .value input, body .section ul li .value textarea { padding: 14px 17px 14px 17px; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .section ul li .value textarea { width: 436px; }
  body .section ul li .value .selectWrap { width: 436px; padding-left: 0; overflow: hidden; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .section ul li .value .selectShortWrap { width: 220px; padding-left: 0; overflow: hidden; margin-bottom: 10px; border: #d6d6d6 1px solid; border-radius: 4px; }
  body .section ul li .value select { font-size: 16px; color: #333333; width: 456px; padding: 14px 17px 14px 17px; background: url(../img/triangle.png) no-repeat right 34px center; background-size: 14px 9px; border: none; }
  body .section ul li .value select.short { font-size: 16px; color: #333333; width: 240px; padding: 14px 17px 14px 17px; background: url(../img/triangle.png) no-repeat right 34px center; background-size: 14px 9px; border: none; }
  body .section ul li .value input.error, body .section ul li .value select.error { border: #d2514c 1px solid; }
  body .section ul li .value .txt { margin: 14px 0 0 16px; }
  body .section ul li span.error { padding: 2px 0 2px 0; font-size: 14px; color: #d2514c; }
  body .section ul .flexwrap { display: -ms-flexbox; display: flex; frex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  body .section ul .flexwrap.second { width: 480px; }
  body .section ul .txtSub { margin: 12px 0 0 10px; color: #333333; font-size: 16px; }
  body .section .radioWrap { padding: 14px 10px 14px 10px; border: #d6d6d6 1px solid; border-radius: 4px; margin-bottom: 10px; }
  body .section .radioWrap.s { width: 206px; margin-right: 12px; }
  body .section .radioWrap.s:last-child { margin-right: 0px; }
  body .section .radioWrap label { position: relative; cursor: pointer; padding-left: 30px; }
  body .section .radioWrap label::before, body .section .radioWrap label::after { content: ""; display: block; border-radius: 50%; position: absolute; transform: translateY(-50%); top: 50%; }
  body .section .radioWrap label::before { background-color: #fff; border: 1px solid #cecece; border-radius: 50%; width: 16px; height: 16px; left: 5px; }
  body .section .radioWrap label::after { background-color: #5d5d5d; border-radius: 50%; opacity: 0; width: 10px; height: 10px; left: 9px; }
  body .section .radioWrap input:checked + label::after { opacity: 1; }
  body .section .radioWrap .visually-hidden { position: absolute; white-space: nowrap; border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; height: 1px; width: 1px; margin: -1px; padding: 0; }
  body .btnWrap { display: block; text-align: center; }
  body .btnWrap .btn { font-size: 18px; color: #fff; width: 368px; padding: 22px 0 24px 0; background-color: #27365e; margin-bottom: 80px; } }

