@charset "UTF-8";
body { background-color: #f0f3f6; margin: 0; padding: 0; font-family: メイリオ, Meiryo, verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

ul, ol, li { list-style-type: none !important; margin: 0; padding: 0; }

h1, h2, p { margin: 0; padding: 0; }

img { border: 0; vertical-align: top; }

.content { background-color: #ffffff; margin-top: 0; position: relative; max-width: 950px; margin: auto; padding-top: 0; width: 100%; }

@media screen and (max-width: 640px) { .content { min-width: 300px; max-width: 100%; width: 100%; } }
.cfx:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; zoom: 1; }

.head_img { display: block; margin: 0 0 60px 0; }

@media screen and (max-width: 640px) { .head_img { margin: 0 0 30px 0; }
  .head_img img { width: 100%; } }
h1 { margin: 0 0 60px 0; }

@media screen and (max-width: 640px) { h1 { margin: 0 0 30px 0; padding: 0; width: 100%; }
  h1 img { width: 100%; } }
h2 { background-color: #21b8c6; border-radius: 10px; color: #ffffff; font-size: 24px; margin-bottom: 20px; padding: 5px 0 0 30px; }

@media screen and (max-width: 640px) { h2 { background-color: #21b8c6; border-radius: 10px; color: #ffffff; font-size: 18px; margin-bottom: 10px; padding: 5px 0 0 15px; } }
.content_inner { margin: 0 40px 60px; }

@media screen and (max-width: 640px) { .content_inner { margin: 0 15px 30px; } }
.quiz_box { margin-bottom: 40px; position: relative; }
.quiz_box .quiz_txt { color: #666666; font-size: 20px; font-weight: bold; margin-bottom: 20px; }

@media screen and (max-width: 640px) { .quiz_box { margin-bottom: 0; position: relative; }
  .quiz_box .quiz_txt { color: #666666; font-size: 14px; font-weight: bold; margin-bottom: 10px; } }
.answer_box { float: left; width: 50%; }
.answer_box li { margin-bottom: 16px; margin-left: 15px; width: 100%; position: relative; }
.answer_box input { display: block; font-size: 0; position: absolute; top: 0; left: 0; z-index: 1; }
.answer_box label { display: block; cursor: pointer; margin: 0; height: 45px; padding: 0 5px; background: #21b8c6; color: #ffffff; font-size: 16px; line-height: 45px; transition: .1s; position: relative; width: 100%; z-index: 22; }
.answer_box label span { border-right: #ffffff solid 1px; display: inline-block; height: 100%; margin-right: 15px; text-align: center; position: relative; padding: 0 10px; line-height: 45px; z-index: 22; }
.answer_box label:first-of-type { border-radius: 3px 0 0 3px; }
.answer_box label:last-of-type { border-right: 0px; border-radius: 0 3px 3px 0; }
.answer_box label:hover { background-color: #367ad0; }
.answer_box input[type="radio"]:checked + label { background-color: #367ad0; color: #fff; }

@media screen and (max-width: 640px) { .answer_box { float: none; width: 100%; }
  .answer_box li { margin-bottom: 10px; margin-left: 0; width: auto; }
  .answer_box input { display: none; }
  .answer_box label { display: block; cursor: pointer; margin: 0; height: 35px; padding: 0 0; background: #21b8c6; color: #ffffff; font-size: 13px; line-height: 35px; transition: .1s; width: 100%; }
  .answer_box label span { border-right: #ffffff solid 1px; display: inline-block; height: 100%; margin-right: 5px; text-align: center; padding: 0 10px; line-height: 35px; }
  .answer_box label:first-of-type { border-radius: 3px 0 0 3px; }
  .answer_box label:last-of-type { border-right: 0px; border-radius: 0 3px 3px 0; }
  .answer_box label:hover { background-color: #367ad0; }
  .answer_box input[type="radio"]:checked + label { background-color: #367ad0; color: #fff; } }
.count_box { background: url("/resources/img/special/aqualine_kentei/bg_count.png") no-repeat 0 0; display: block; font-size: 40px; font-weight: bold; margin: 0 auto 60px; max-width: 350px; height: 211px; text-align: center; position: relative; }
.count_box p { position: absolute; top: 50%; left: 45%; }

.btn_blk { padding-bottom: 60px; }
.btn_blk ul { text-align: center; }
.btn_blk ul li { display: inline-block; width: 240px; }
.btn_blk ul li:first-child { margin-right: 40px; }
.btn_blk ul li a { background-color: #8acc31; border-radius: 10px; color: #ffffff; display: block; text-decoration: none; padding: 20px 0; }
.btn_blk ul li a:hover { background-color: #b3e66e; }

div[id^="output"] { clear: both; text-align: center; padding: 20px 0; }
div[id^="output"] img { margin-bottom: 15px; }
div[id^="output"] p { background-color: #d45948; border-radius: 5px; color: #ffffff; padding: 15px; }
div[id^="output"] img.ansng + p { background-color: #485a76; border-radius: 5px; color: #ffffff; padding: 15px; }

.img_box { float: right; width: 230px; }
.img_box img { width: 100%; height: auto; }
.img_box.img_q5 { position: absolute; top: 50px; right: 0; }

@media screen and (max-width: 640px) { .count_box { background: url("/resources/img/special/aqualine_kentei/bg_count.png") no-repeat 0 0; background-size: contain; display: block; font-size: 40px; font-weight: bold; margin: 0 auto 0; max-width: 270px; height: 200px; text-align: center; position: relative; }
  .count_box p { position: absolute; top: 37%; left: 45%; }
  .btn_blk { padding-bottom: 30px; }
  .btn_blk ul { text-align: center; }
  .btn_blk ul li { display: inline-block; width: 280px; margin: 0 auto 15px; }
  .btn_blk ul li:first-child { margin-right: 0; }
  .btn_blk ul li a { background-color: #8acc31; border-radius: 10px; color: #ffffff; display: block; text-decoration: none; padding: 10px 0; }
  .btn_blk ul li a:hover { background-color: #b3e66e; }
  div[id^="output"] { clear: both; text-align: center; padding: 0 0; width: 92%; margin: 0 auto; }
  div[id^="output"] img { margin-bottom: 15px; width: 100%; }
  div[id^="output"] p { background-color: #d45948; border-radius: 5px; color: #ffffff; font-size: 14px; padding: 5px; margin-bottom: 15px; }
  div[id^="output"] img.ansng + p { background-color: #485a76; border-radius: 5px; color: #ffffff; padding: 5px; }
  .img_box { display: none; } }

/*# sourceMappingURL=style.css.map */