main {
  width: 100%;
  overflow: hidden;
  position: relative
}

main.interviewbg {
  background: #f0f4f7
}

p.subs {
  font-size: 1.2rem;
  text-align: right;
  padding: 0 7rem 0 0
}

@media only screen and (max-width: 768px) {
  p.subs {
    padding: 0
  }
}

section.page_nav {
  margin: 0 0 10rem 0
}

@media only screen and (max-width: 768px) {
  section.page_nav {
    margin: 0 0 2rem 0
  }
}

section.page_nav ul {
  display: flex;
  justify-content: space-between
}

section.page_nav ul li {
  width: 32%
}

section.page_nav ul li a {
  display: block;
  border: 1px solid #2af260;
  padding: 2rem 0;
  background: #fff;
  text-align: center;
  color: #2af260;
  font-weight: bold;
  font-size: 1.4rem;
  transition: all .3s ease
}

section.page_nav ul li a:hover {
  background: #2af260;
  color: #fff
}

section.page_nav ul li a.b01 {
  color: #d00;
  border: 1px solid #d00
}

section.page_nav ul li a.b01:hover {
  background: #d00;
  color: #fff
}

section.page_nav ul li a.b02 {
  color: #e18b01;
  border: 1px solid #e18b01
}

section.page_nav ul li a.b02:hover {
  background: #e18b01;
  color: #fff
}

section.atfirst_block {
  margin: 0 0 10rem 0
}

@media only screen and (max-width: 768px) {
  section.atfirst_block {
    margin: 0 0 0 0
  }
}

section.atfirst_block#at01 .inners {
  border-top: 15px solid #d00
}

section.atfirst_block#at03 .inners {
  border-top: 15px solid #e18b01
}

section.atfirst_block#at02 .inners {
  border-top: 15px solid #2af260
}

section.atfirst_block .title {
  text-align: center;
  margin: 0 0 5rem 0
}

@media only screen and (max-width: 768px) {
  section.atfirst_block .title {
    margin: 0 0 3rem 0
  }
}

section.atfirst_block .title p.en {
  color: #3d75dc;
  font-size: 7rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .1em
}

@media only screen and (max-width: 768px) {
  section.atfirst_block .title p.en {
    font-size: 4rem
  }
}

section.atfirst_block .title p.en.en01 {
  color: #d00
}

section.atfirst_block .title p.en.en02 {
  color: #e18b01
}

section.atfirst_block .title p.en.en03 {
  color: #2af260
}

section.atfirst_block .title h2 {
  font-weight: 500;
  font-size: 1.8rem
}

section.atfirst_block .lead {
  text-align: center;
  font-weight: 500;
  margin: 0 0 5rem 0
}

@media only screen and (max-width: 768px) {
  section.atfirst_block .lead {
    text-align: left;
    margin: 0 0 2rem 0
  }

  section.atfirst_block .lead br {
    display: none
  }
}

section.atfirst_block .zun {
  width: 800px;
  margin: auto
}

@media only screen and (max-width: 768px) {
  section.atfirst_block .zun {
    width: 100%
  }

  section.atfirst_block .zun br {
    display: none
  }
}

.st_flex {
  display: flex;
  justify-content: space-between;
  margin: 0 0 10rem 0
}

@media only screen and (max-width: 768px) {
  .st_flex {
    display: block;
    margin: 0 0 3rem 0
  }
}

.st_flex.two .box {
  width: 48%
}

@media only screen and (max-width: 768px) {
  .st_flex.two .box {
    width: 100%;
    text-align: center
  }
}

.st_flex.two .box.gray {
  background: #eee;
  padding: 2rem
}

.st_flex.four .box {
  width: 25%
}

@media only screen and (max-width: 768px) {
  .st_flex.four .box {
    width: 100%;
    text-align: center
  }
}

.st_flex.four .box h4 {
  font-weight: 500;
  font-size: 3.6rem;
  color: #3d75dc;
  text-align: center
}

@media only screen and (max-width: 768px) {
  .st_flex.four .box h4 {
    font-size: 2rem
  }
}

.st_flex.four .box p {
  font-weight: 500;
  text-align: center
}

.st_flex.five {
  flex-wrap: wrap;
  justify-content: center;
}

.st_flex.five .box {
  width: 30%;
  margin: 0 0 2rem 0
}

@media only screen and (max-width: 768px) {
  .st_flex.five .box {
    width: 100%
  }
}

.st_flex.five .box h4 {
  font-weight: 500;
  font-size: 1.6rem;
  color: #3d75dc;
  background: #3d75dc;
  color: #fff;
  font-weight: 500;
  text-align: center;
  padding: 1rem 0
}

@media only screen and (max-width: 768px) {
  .st_flex.five .box h4 {
    font-size: 1.4rem
  }
}

.st_flex.five .box p {
  font-size: 1.4rem;
  padding: 2rem;
  border: 1px solid #3d75dc
}

.st_flex .box {
  width: 30%
}

.st_flex .box.wides {
  width: 48%
}

@media only screen and (max-width: 768px) {
  .st_flex .box.wides {
    width: 100%
  }
}

@media only screen and (max-width: 768px) {
  .st_flex .box {
    width: 100%;
    margin: 0 0 2rem 0
  }
}

.st_flex .box.wide {
  width: 70%;
  margin: auto
}

@media only screen and (max-width: 768px) {
  .st_flex .box.wide {
    width: 100%
  }
}

.st_flex .box.pad {
  padding: 0 3rem
}

.st_flex .box h3 {
  text-align: center;
  margin: 0 0 3rem 0
}

.st_flex .box .zu {
  width: 70%;
  margin: auto
}

@media only screen and (max-width: 768px) {
  .st_flex .box .zu {
    width: 100%
  }
}

.st_flex .box .exp {
  margin: 2rem 0 0 0
}

.st_flex .num_flex {
  display: flex;
  justify-content: center;
  align-items: baseline
}

.st_flex .num_flex.blue p.en {
  color: #0c4bc1
}

.st_flex .num_flex p.en {
  font-size: 10rem;
  font-weight: 500;
  color: #3d75dc;
  line-height: 1.2
}

@media only screen and (max-width: 768px) {
  .st_flex .num_flex p.en {
    font-size: 8rem
  }
}

.st_flex .num_flex p.sub {
  font-weight: 500
}

.st_flex p.kasoh {
  padding: 3rem 0 0 0;
  font-size: 2.4rem;
  font-weight: 500;
  color: #3d75dc;
  text-align: center
}

.midtitle {
  text-align: center;
  margin: 0 0 5rem 0
}

@media only screen and (max-width: 768px) {
  .midtitle {
    margin: 0 0 2rem 0
  }
}

.midtitle h3 {
  font-size: 3rem;
  font-weight: 500
}

@media only screen and (max-width: 768px) {
  .midtitle h3 {
    font-size: 2rem
  }
}

.midtitle h3 span {
  color: #3d75dc;
  font-size: 6rem
}

.sample_block {
  display: flex;
  justify-content: center;
  margin: 0 0 5rem 0
}

@media only screen and (max-width: 768px) {
  .sample_block {
    display: block;
    margin: 0 0 2rem 0
  }
}

.sample_block .box {
  width: 48%;
  position: relative
}

@media only screen and (max-width: 768px) {
  .sample_block .box {
    width: 100%;
    margin: 0 0 1rem 0
  }
}

.sample_block .box .txt {
  text-align: center;
  font-weight: 500;
  position: absolute;
  bottom: 0;
  right: 0;
  display: inline-block;
  background: #fff;
  padding: 0 1rem
}