@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; font-size: 100%; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

nav ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

ins { background-color: #ff9; color: #000; text-decoration: none; }

mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

table { border-collapse: collapse; border-spacing: 0; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

img { vertical-align: bottom; max-width: 100%; }

li { list-style: none; }

body { font-family: YakuHanMP, a-otf-ryumin-pr6n, "Noto Serif JP", serif, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-feature-settings: "palt"; font-weight: 300; -webkit-text-size-adjust: 100%; letter-spacing: 0.01em; color: #2c3a4d; background: url("../img/bg.jpg") center top; }

html { font-size: calc(100vw / 32); }
@media only screen and (min-width: 751px) { html { font-size: 16px; } }

input[type="text"] { padding: 0; border: none; border-radius: 0; outline: none; border: 1px solid #000; background: #FFF; padding: 0.4em 1em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

button, input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 0; border: none; outline: none; background: transparent; }

::selection { background: #000; color: #FFF; }

::-moz-selection { background: #000; color: #FFF; }

@media only screen and (min-width: 751px) { .sp { display: none; }
  #wrapper { min-width: 1280px; } }
@media only screen and (max-width: 750px) { .pc { display: none; } }
footer { background: #000; color: #FFF; }
footer .share p, footer .share ul, footer .share li { display: inline-block; letter-spacing: -.4em; vertical-align: middle; }
footer .share p { letter-spacing: 0.1em; font-family: arno-pro, serif; }
footer .copyright { font-family: arno-pro, serif; }
@media only screen and (min-width: 751px) { footer { padding: 80px 40px; }
  footer .foot_wrap { min-width: 1040px; max-width: 1400px; margin: auto; position: relative; }
  footer .bnr_drama { width: 260px; position: absolute; right: 0; top: 0; overflow: hidden; border: 1px solid #fff; }
  footer .bnr_drama a { display: block; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
  footer .bnr_drama a:hover { -webkit-transform: scale(1.03); -moz-transform: scale(1.03); -ms-transform: scale(1.03); -o-transform: scale(1.03); transform: scale(1.03); opacity: 0.7; }
  footer .share { margin-bottom: 30px; }
  footer .share li { width: 30px; margin-left: 23px; }
  footer .share a { display: block; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
  footer .share a:hover { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -ms-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08); opacity: 0.7; }
  footer .notes { margin-bottom: 8px; }
  footer p { font-size: 11px; } }
@media only screen and (max-width: 750px) { footer { padding: 10vw 5vw 12vw; }
  footer .bnr_drama img { border: 1px solid #fff; }
  footer .bnr_drama { width: 48vw; margin: 3px auto 9.06vw; position: relative; z-index: 2; }
  footer .share { margin-bottom: 5.6vw; }
  footer .share li { width: 8vw; margin-left: 4vw; }
  footer .notes { line-height: 1.6; margin-bottom: 3vw; } }

.main_content h1 { border-bottom: 4px double #000; }
.main_content .lead_text { text-align: center; line-height: 1.8; }
.main_content .btn_start a { background: #000; color: #fff; text-align: center; text-decoration: none; display: block; }

@-webkit-keyframes top_pc { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); } }
@-o-keyframes top_pc { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); } }
@-moz-keyframes top_pc { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); } }
@keyframes top_pc { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); } }
@-webkit-keyframes btm_pc { 0% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-o-keyframes btm_pc { 0% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes btm_pc { 0% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@keyframes btm_pc { 0% { -webkit-transform: translateX(-2478px); -moz-transform: translateX(-2478px); -ms-transform: translateX(-2478px); -o-transform: translateX(-2478px); transform: translateX(-2478px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes top_sp { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); } }
@-o-keyframes top_sp { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); } }
@-moz-keyframes top_sp { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); } }
@keyframes top_sp { 0% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); } }
@-webkit-keyframes btm_sp { 0% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-o-keyframes btm_sp { 0% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes btm_sp { 0% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@keyframes btm_sp { 0% { -webkit-transform: translateX(-300vw); -moz-transform: translateX(-300vw); -ms-transform: translateX(-300vw); -o-transform: translateX(-300vw); transform: translateX(-300vw); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
.deco_top { overflow: hidden; }
@media only screen and (min-width: 751px) { .deco_top p { width: 4956px; position: relative; -webkit-animation: top_pc 40s linear infinite; -moz-animation: top_pc 40s linear infinite; -o-animation: top_pc 40s linear infinite; animation: top_pc 40s linear infinite; } }
@media only screen and (max-width: 750px) { .deco_top p { width: 600vw; -webkit-animation: top_sp 40s linear infinite; -moz-animation: top_sp 40s linear infinite; -o-animation: top_sp 40s linear infinite; animation: top_sp 40s linear infinite; }
  .deco_top p img { width: 300vw; } }

.deco_btm { overflow: hidden; }
@media only screen and (min-width: 751px) { .deco_btm p { width: 4956px; position: relative; -webkit-animation: btm_pc 40s linear infinite; -moz-animation: btm_pc 40s linear infinite; -o-animation: btm_pc 40s linear infinite; animation: btm_pc 40s linear infinite; } }
@media only screen and (max-width: 750px) { .deco_btm p { width: 600vw; -webkit-animation: btm_sp 40s linear infinite; -moz-animation: btm_sp 40s linear infinite; -o-animation: btm_sp 40s linear infinite; animation: btm_sp 40s linear infinite; }
  .deco_btm p img { width: 300vw; } }

@media only screen and (min-width: 751px) { .top_contents { padding-top: 100px; padding-bottom: 120px; }
  .top_contents .in_title { width: 1100px; margin: 0 auto 100px; text-align: center; padding-bottom: 30px; }
  .top_contents .in_title img { width: 690px; margin: auto; }
  .top_contents .lead_text { font-size: 24px; margin-bottom: 84px; }
  .top_contents .btn_start { width: 476px; margin: auto; height: 110px; line-height: 110px; overflow: hidden; }
  .top_contents .btn_start a { font-size: 30px; -webkit-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); cursor: pointer; }
  .top_contents .btn_start a:hover { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -ms-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08); -webkit-filter: blur(1px); -moz-filter: blur(1px); -o-filter: blur(1px); filter: blur(1px); } }
@media only screen and (max-width: 750px) { .top_contents { padding: 24vw 0 20vw; width: 92vw; margin: auto; }
  .top_contents .in_title { margin-bottom: 8vw; }
  .top_contents .in_title img { margin-bottom: 4vw; }
  .top_contents .lead_text { font-size: 1.3rem; margin-bottom: 6vw; }
  .top_contents .btn_start { width: 63.46vw; margin: auto; }
  .top_contents .btn_start a { font-size: 1.2rem; padding: 4vw 0; } }

.in_contents { background: url("../img/question_deco_01.png") no-repeat left top, url("../img/question_deco_02.png") no-repeat right bottom; }
.in_contents .chart_area .quize { line-height: 1.6; }
.in_contents .chart_area .answer p { border: 1px solid #000; background: #000; position: relative; }
.in_contents .chart_area .answer p span { display: block; color: #FFF; position: absolute; width: 100%; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); line-height: 1.6; text-align: center; }
.in_contents .chart_area .answer p a { position: absolute; top: 0; left: 0; display: block; height: 100%; width: 100%; }
@media only screen and (min-width: 751px) { .in_contents { padding-top: 95px; padding-bottom: 150px; min-height: calc(100vh - 495px); }
  .in_contents .in_title { width: 1100px; margin: 0 auto 100px; text-align: center; padding-bottom: 30px; }
  .in_contents .in_title img { width: 690px; margin: auto; }
  .in_contents .chart_area { width: 1100px; margin: auto; text-align: center; }
  .in_contents .chart_area .quize { font-size: 44px; margin-bottom: 106px; }
  .in_contents .chart_area .answer { display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; }
  .in_contents .chart_area .answer p { width: 472px; height: 110px; overflow: hidden; }
  .in_contents .chart_area .answer p span { font-size: 26px; }
  .in_contents .chart_area .answer p span { -webkit-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); }
  .in_contents .chart_area .answer p:hover span { -webkit-transform: scale(1.08) translateY(-50%); -moz-transform: scale(1.08) translateY(-50%); -ms-transform: scale(1.08) translateY(-50%); -o-transform: scale(1.08) translateY(-50%); transform: scale(1.08) translateY(-50%); -webkit-filter: blur(1px); -moz-filter: blur(1px); -o-filter: blur(1px); filter: blur(1px); }
  .in_contents .chart_area .answer .btn_01 { margin-right: 18px; }
  .in_contents .chart_area .answer .btn_03 { margin-top: 20px; } }
@media only screen and (max-width: 750px) { .in_contents { padding: 20vw 0; -webkit-background-size: 28vw; -o-background-size: 28vw; background-size: 28vw; }
  .in_contents .in_title { width: 92vw; margin: 0 auto 8vw; }
  .in_contents .in_title img { margin-bottom: 4vw; }
  .in_contents .quize { margin: 0 auto 6vw; font-size: 1.3rem; text-align: center; line-height: 1.4; font-weight: 500; }
  .in_contents .answer { width: 65.33vw; margin: auto; }
  .in_contents .answer p { height: 15.2vw; font-size: 1.2rem; margin-bottom: 3vw; }
  .in_contents .answer p:last-child { margin-bottom: 0; } }

.end_contents { background: url("../img/chara_deco.png") no-repeat right center; }
.end_contents .chara .chara_lead span { background: #FFF; }
.end_contents .chara .chara_name { display: inline-block; background: #FFF; text-align: center; }
.end_contents .chara .chara_name span { display: block; }
.end_contents .chara .chara_cv p { background: #FFF; display: inline; }
.end_contents .chara .chara_text { line-height: 1.8; }
.end_contents .chara .btn_area p { text-align: center; }
.end_contents .chara .btn_area p a { background: #000; color: #FFF; text-decoration: none; display: block; width: 100%; }
@media only screen and (min-width: 751px) { .end_contents { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; min-height: 780px; height: calc(100vh - 250px); }
  .end_contents .result_contents { position: absolute; width: 1250px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
  .end_contents .images { float: left; width: 630px; }
  .end_contents .chara { float: left; padding-top: 82px; width: 620px; }
  .end_contents .chara .chara_lead { font-size: 24px; font-weight: 400; margin-bottom: 16px; }
  .end_contents .chara .chara_lead span { padding: 10px 10px 10px 50px; }
  .end_contents .chara .chara_name { font-size: 46px; margin-bottom: 16px; }
  .end_contents .chara .chara_name p { padding: 10px 10px 10px 50px; }
  .end_contents .chara .chara_name .rt { font-size: 14px; margin-bottom: 6px; }
  .end_contents .chara .chara_cv { margin-bottom: 40px; font-size: 20px; }
  .end_contents .chara .chara_cv p { padding: 10px 10px 10px 50px; }
  .end_contents .chara .chara_text { font-size: 18px; margin: 0 0 45px 50px; text-shadow: 0px 0px 2px #fff; }
  .end_contents .chara .btn_area { display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: 50px; }
  .end_contents .chara .btn_area p { width: 270px; overflow: hidden; }
  .end_contents .chara .btn_area p a { height: 60px; line-height: 60px; font-size: 20px; -webkit-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.3s cubic-bezier(0.33, 1, 0.68, 1); cursor: pointer; }
  .end_contents .chara .btn_area p a:hover { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -ms-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08); -webkit-filter: blur(1px); -moz-filter: blur(1px); -o-filter: blur(1px); filter: blur(1px); }
  .end_contents .chara .btn_area .btn_twitter { margin-right: 10px; } }
@media only screen and (max-width: 750px) { .end_contents { padding: 10vw 0 20vw; background-position: left 20vw bottom -2vw; -webkit-background-size: 110vw; -o-background-size: 110vw; background-size: 110vw; }
  .end_contents .images { width: 84vw; margin: 0 0 8vw auto; }
  .end_contents .chara .chara_lead { font-size: 1.2rem; font-weight: 400; margin-bottom: 3.5vw; }
  .end_contents .chara .chara_lead span { padding: 2vw 2vw 2vw 5vw; }
  .end_contents .chara .chara_name { font-size: 2.3rem; margin-bottom: 4vw; }
  .end_contents .chara .chara_name p { padding: 2vw 2vw 2vw 5vw; }
  .end_contents .chara .chara_name .rt { font-size: 1rem; margin-bottom: 6px; }
  .end_contents .chara .chara_cv { font-size: 1.1rem; margin-bottom: 8vw; }
  .end_contents .chara .chara_cv p { padding: 2vw 2vw 2vw 5vw; }
  .end_contents .chara .chara_text { font-size: 1.1rem; margin: 0 5vw 6vw 5vw; }
  .end_contents .chara .btn_area { display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: 5vw; }
  .end_contents .chara .btn_area p { width: 44vw; }
  .end_contents .chara .btn_area p a { font-size: 1.1rem; height: 12vw; line-height: 12vw; }
  .end_contents .chara .btn_area .btn_twitter { margin-right: 2vw; } }

@-webkit-keyframes op_cont { 0% { opacity: 0; }
  100% { opacity: 1; -webkit-filter: blur(0px); -moz-filter: blur(0px); -o-filter: blur(0px); filter: blur(0px); } }
@-o-keyframes op_cont { 0% { opacity: 0; }
  100% { opacity: 1; -webkit-filter: blur(0px); -moz-filter: blur(0px); -o-filter: blur(0px); filter: blur(0px); } }
@-moz-keyframes op_cont { 0% { opacity: 0; }
  100% { opacity: 1; -webkit-filter: blur(0px); -moz-filter: blur(0px); -o-filter: blur(0px); filter: blur(0px); } }
@keyframes op_cont { 0% { opacity: 0; }
  100% { opacity: 1; -webkit-filter: blur(0px); -moz-filter: blur(0px); -o-filter: blur(0px); filter: blur(0px); } }
.contents_wrap, .main_content { opacity: 0; -webkit-filter: blur(10px); -moz-filter: blur(10px); -o-filter: blur(10px); filter: blur(10px); -webkit-animation: op_cont 0.8s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards; -moz-animation: op_cont 0.8s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards; -o-animation: op_cont 0.8s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards; animation: op_cont 0.8s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards; }