@charset "UTF-8";
abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, p, pre, q, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, 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:after, blockquote:before, q:after, q:before {
  content: "";
  content: none
}

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

ins {
  text-decoration: none
}

ins, mark {
  background-color: #ff9;
  color: #000
}

mark {
  font-style: italic;
  font-weight: 700
}

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 #ccc;
  margin: 1em 0;
  padding: 0
}

input, select {
  vertical-align: middle
}

html {
  font-size: 62.5%;
  width: 100%
}

body {
  background-color: #E5F9EC;
  color: #002063;
  font-size: 1.6rem;
  font-family: 游ゴシック Medium, YuGothic, YuGothicM, Hiragino Kaku Gothic ProN, メイリオ, Meiryo, sans-serif;
  line-height: 200%
}

@media (max-width:767px) {
  body {
    font-size: 1.4rem
  }
}

* {
  box-sizing: border-box
}

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

a[href] {
  color: inherit
}

a.blank[target=_blank]:after {
  font-family: Hobonichi-Icons;
  content: "\e914";
  font-weight: 400;
  font-size: .8em;
  position: relative;
  top: -.2em
}

.ud-marugo-h {
  font-family: UD Shin Maru Go Heavy, sans-serif
}

.flex {
  display: -ms-flexbox;
  display: flex
}

.flex--center {
  -ms-flex-pack: center;
  justify-content: center
}

.flex--between {
  -ms-flex-pack: justify;
  justify-content: space-between
}

.flex--vertical-center {
  -ms-flex-align: center;
  align-items: center
}

.center {
  text-align: center
}

.inline-block {
  display: inline-block
}

@media (min-width:768px) {
  .is-pc-disabled {
    display: none!important
  }
}

@media (max-width:767px) {
  .is-sp-disabled {
    display: none!important
  }
}

.indent-half {
  margin-left: -.5em
}

.hover-op {
  transition: .16s
}

@media (min-width:768px) {
  .hover-op:hover {
    opacity: .5
  }
}

.header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  background-color: #8FE5BA;
  text-align: center
}

.header a {
  line-height: 1
}

.main {
  padding-top: 50px;
  text-align: center;
  background-image: url(../img/bg@2x.png);
  background-repeat: repeat-x;
  background-size: 295px 285px;
  background-position: center 60px
}

@media (max-width:767px) {
  .main {
    padding-top: 20px;
    background-size: 148px 142px;
    background-position: center 30px
  }
}

.main__wrapper {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin: 0 auto
}

.main__logo {
  position: absolute;
  top: -20px;
  left: 0;
  z-index: 1
}

@media (max-width:767px) {
  .main__logo {
    position: static
  }
  .main__logo img {
    width: 114px
  }
}

.main__visual {
  position: relative;
  z-index: 2
}

@media (max-width:767px) {
  .main__visual {
    margin-top: -5px;
    padding-left: 2.5%;
    padding-right: 2.5%
  }
}

.main__title {
  position: relative;
  margin-top: -120px;
  z-index: 3
}

.main__title h2 {
  margin-top: 25px
}

.main__title .balloon {
  position: absolute;
  top: -90px;
  left: 40px
}

@media (max-width:767px) {
  .main__title {
    margin-top: -16%;
    padding-left: 5%;
    padding-right: 5%
  }
  .main__title h2 img {
    width: 220px
  }
  .main__title .balloon {
    top: -40px;
    left: 2.5%
  }
  .main__title .balloon img {
    width: 120px
  }
}

.main__yodogawa {
  margin-top: 50px;
  font-weight: 700
}

@media (max-width:767px) {
  .main__yodogawa {
    margin-top: 30px;
    padding-left: 5%;
    padding-right: 5%;
    text-align: left
  }
}

.content {
  margin-top: 80px;
  padding-bottom: 80px;
  background-image: url(../img/bg@2x.png);
  background-repeat: repeat;
  background-size: 295px 285px;
  background-position: top
}

@media (max-width:767px) {
  .content {
    margin-top: 40px;
    padding-bottom: 40px;
    background-size: 148px 142px
  }
}

.content__wrapper {
  width: 100%;
  max-width: 640px;
  margin: 0 auto
}

@media (max-width:767px) {
  .content__wrapper {
    width: 90%
  }
}

.navigation {
  position: relative;
  padding-top: 100px;
  padding-bottom: 50px;
  text-align: center
}

@media (max-width:767px) {
  .navigation {
    padding-top: 0;
    padding-bottom: 15px
  }
  .navigation img {
    width: 48px
  }
}

.navigation__prev {
  position: absolute;
  top: 100px;
  left: 40px
}

@media (max-width:767px) {
  .navigation__prev {
    top: 0;
    left: 5%
  }
}

.navigation__next {
  position: absolute;
  top: 100px;
  right: 40px
}

@media (max-width:767px) {
  .navigation__next {
    top: 0;
    right: 5%
  }
}

.interview {
  margin-bottom: -50px;
  padding-bottom: 50px;
  background-color: #fff;
  border-radius: 30px
}

@media (max-width:767px) {
  .interview {
    margin-bottom: 15px;
    border-radius: 15px
  }
}

.interview__title {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  line-height: 1.5
}

.interview__title.end {
  -ms-flex-align: end;
  align-items: flex-end
}

.interview__title .num {
  font-size: 14.6rem
}

.interview__title .text {
  margin-left: 20px;
  font-size: 4.2rem;
}

.interview__title .indent {
  text-indent: -.5em;
}

@media (max-width:767px) {
  .interview__title .num {
    font-size: 6.7rem
  }
  .interview__title .text {
    font-size: 1.9rem;
    margin-left: 10px;
  }
}

.interview__content {
  letter-spacing: .05em
}

.interview__content>dl {
  margin-top: 40px;
  margin-left: 12px;
  overflow: hidden
}

.interview__content>dl dt {
  float: left;
  width: 120px;
  line-height: 1;
  font-size: 0;
  margin-left: 8px
}

@media (min-width:768px) {
  .interview__content>dl dt:after {
    margin-left: auto
  }
}

.interview__content>dl dd {
  color: #183572;
  margin-left: 148px
}

.interview__content strong {
  color: #e72741;
  font-weight: 700
}

.interview__content .img {
  margin-top: 50px;
  padding-left: 20px;
  padding-right: 20px
}

.interview__content .img_s {
  padding: 0;
  text-align: center;
}

.interview__content .img img {
  width: 100%;
}

.interview__content .img+.img {
  margin-top: 25px
}

.interview__content .capture {
  text-align: left;
  margin: 0 auto;
}

.interview__content .crew_a+dd {
  color: #6b6b6b
}

.interview__content .crew_a:after {
  content: "";
  display: block;
  width: 44px;
  height: 35px;
  background-image: url(../img/ico_crew_a@2x.png);
  background-size: 44px 35px
}

.interview__content .crew_b+dd {
  color: #6b6b6b
}

.interview__content .crew_b:after {
  content: "";
  display: block;
  width: 44px;
  height: 35px;
  background-image: url(../img/ico_crew_b@2x.png);
  background-size: 44px 35px
}

.interview__content .hirai+dd {
  padding-top: .4em
}

.interview__content .hirai:after {
  content: "";
  display: block;
  width: 37px;
  height: 52px;
  background-image: url(../img/ico_hirai@2x.png);
  background-size: 37px 52px
}

.interview__content .hara+dd {
  padding-top: .4em
}

.interview__content .hara:after {
  content: "";
  display: block;
  width: 37px;
  height: 51px;
  background-image: url(../img/ico_hara@2x.png);
  background-size: 37px 51px
}

.interview__content .set+dd {
  padding-top: .4em
}

.interview__content .set:after {
  content: "";
  display: block;
  width: 120px;
  height: 50px;
  background-image: url(../img/ico_set@2x.png);
  background-size: 120px 50px
}

.interview__content .all {
  font-size: 1.6rem;
  line-height: 2;
  font-weight: 700;
  text-align: right
}

@media (max-width:767px) {
  .interview__content .all {
    text-align: left;
    font-size: 1.4rem
  }
}

.interview__content .info {
  width: 100%;
  max-width: 480px;
  padding-top: 50px;
  padding-bottom: 25px;
  margin: 60px auto;
  border: 1px solid #002063;
  border-radius: 15px;
  text-align: center
}

.interview__content .info dl.schedule {
  display: inline-block;
  text-align: left;
  margin-top: 0
}

.interview__content .info dl.schedule dt {
  font-weight: 700
}

.interview__content .info dl.schedule dd+dt {
  margin-top: .5em
}

.interview__content .info dl.about {
  margin-top: 0;
  padding-left: 40px;
  padding-right: 40px;
  text-align: left
}

.interview__content .info dl.about dt {
  font-size: 2rem;
  font-weight: 700
}

.interview__content .info dl.about dd+dt {
  margin-top: 60px
}

.interview__content .info dl.about ul {
  margin-left: 1em
}

.interview__content .info__notes {
  display: inline-block;
  margin-top: 40px;
  font-size: 1.3rem;
  text-align: left;
  line-height: 1.7
}

@media (max-width:767px) {
  .interview__content dl {
    padding-left: 5%;
    padding-right: 5%;
    margin-top: 20px;
    margin-left: 0
  }
  .interview__content dl dt {
    float: none;
    margin-left: 0
  }
  .interview__content dl dd {
    padding-top: 0!important;
    margin-left: 0;
    margin-top: .5em
  }
  .interview__content .img {
    padding-left: 5%;
    padding-right: 5%;
    margin-top: 20px
  }
  .interview__content .img+.img {
    margin-top: 10px
  }
  .interview__content .img_s {
    width: 100% !important;
  }
  .interview__content p.capture {
    width: 100% !important;
  }
  .interview__content .info {
    width: 90%;
    padding: 25px 2.5% 20px;
    margin: 30px auto;
    font-size: 95%
  }
  .interview__content .info__notes {
    margin-top: 20px;
    font-size: 90%;
    padding-left: 2.5%;
    padding-right: 2.5%
  }
  .interview__content .info dl.about {
    padding-left: 5%;
    padding-right: 5%
  }
  .interview__content .info dl.about dt {
    font-size: 1.7rem
  }
  .interview__content .info dl.about dd+dt {
    margin-top: 30px
  }
}

.toc {
  width: 100%;
  max-width: 580px;
  margin: 0 auto;
  list-style: none
}

.toc li {
  background-color: #fff
}

.toc li+li {
  margin-top: 15px
}

@media (max-width:767px) {
  .toc li+li {
    margin-top: 8px
  }
}

.entry {
  margin-top: 80px;
  text-align: center;
  font-weight: 700
}

@media (max-width:767px) {
  .entry {
    margin-top: 40px;
    padding-left: 5%;
    padding-right: 5%;
    text-align: left
  }
}

.entry__btn {
  margin-bottom: 40px
}

@media (max-width:767px) {
  .entry__btn {
    margin-bottom: 20px
  }
}

.entry__finish {
  color: #e72841;
  margin-bottom: 40px
}

.result {
  padding-top: 45px
}

@media (max-width:767px) {
  .result {
    padding-top: 20px
  }
}

.result__title {
  position: relative;
  left: -30px;
  margin-bottom: 60px;
  text-align: center
}

@media (max-width:767px) {
  .result__title {
    left: 0;
    margin-bottom: 30px
  }
  .result__title img {
    width: 90%
  }
}

@media (max-width:767px) {
  .result__content {
    padding-left: 5%;
    padding-right: 5%
  }
}

.result__content>p {
  margin-top: 2em;
  margin-left: 120px;
  color: #666
}

@media (max-width:767px) {
  .result__content>p {
    margin-left: 0
  }
}

.question__header {
  display: -ms-flexbox;
  display: flex;
  margin-left: 70px
}

.question__header .num {
  font-size: 4.8rem;
  line-height: 1
}

.question__header h3 {
  margin-left: 20px;
  font-size: 2.4rem;
  line-height: 1.4;
  color: #002063
}

.question--01 .question__header .num {
  color: #e72741
}

.question--02 .question__header .num {
  color: #094
}

@media (max-width:767px) {
  .question__header {
    display: block;
    margin-left: 0
  }
  .question__header .num {
    font-size: 3.6rem
  }
  .question__header h3 {
    margin-top: 10px;
    margin-left: 0;
    font-size: 2rem
  }
}

.question__image {
  margin-top: 40px
}

.question--01 .question__image {
  margin-left: 60px
}

.question--02 .question__image {
  margin-left: 25px
}

@media (max-width:767px) {
  .question__image {
    margin-top: 20px;
    margin-left: 0!important
  }
}

.line {
  line-height: 0;
  margin-top: 50px;
  margin-bottom: 40px;
  text-align: center
}

@media (max-width:767px) {
  .line {
    margin-top: 25px;
    margin-bottom: 20px
  }
}

.comment {
  margin-left: 120px;
  color: #002063
}

@media (max-width:767px) {
  .comment {
    margin-left: 0
  }
}

.comment__head {
  font-size: 1.8rem;
  font-weight: 700
}

.comment__text {
  margin-top: .5em
}

.update {
  margin-top: 40px;
  margin-left: 0!important;
  color: #002063!important
}

.banner, .update {
  text-align: center
}

.banner {
  margin-top: 30px
}

.banner img {
    box-shadow: 0 0 8px rgba(0,0,0,.2);
    border-radius: 10px;
}

@media (max-width:767px) {
  .banner {
    margin-top: 15px
  }
}

.footer {
  padding-top: 75px;
  padding-bottom: 70px;
  border-top: 1px solid gray
}

@media (max-width:767px) {
  .footer {
    padding-top: 40px;
    padding-bottom: 40px
  }
}

.footer__wrapper {
  width: 100%;
  max-width: 640px;
  margin: 0 auto
}

@media (max-width:767px) {
  .footer__wrapper {
    text-align: center
  }
}

.footer__links {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center
}

@media (max-width:767px) {
  .footer__links {
    display: block
  }
}

.footer__share {
  display: -ms-flexbox;
  display: flex;
  list-style: none
}

.footer__share li {
  margin-left: 15px
}

@media (max-width:767px) {
  .footer__share {
    -ms-flex-pack: center;
    justify-content: center
  }
}

.footer__review {
  margin-left: 40px
}

@media (max-width:767px) {
  .footer__review {
    margin-left: 0;
    margin-top: 20px
  }
}

.footer__home {
  margin-left: 40px
}

@media (max-width:767px) {
  .footer__home {
    margin-left: 0;
    margin-top: 40px
  }
}

.footer__copyright {
  margin-top: 30px;
  text-align: center
}