@charset "UTF-8";
/*-------------------------------------------
　PCや携帯のサイズによってCSS変更
-------------------------------------------*/
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, dialog, figure, footer, header,
hgroup, menu, nav, section,
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, dialog, figure, footer, header,
hgroup, nav, section {
  display: block; }

nav ul {
  list-style: none; }

li {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

ins {
  background-color: #FFF;
  color: #0d0d38;
  text-decoration: none; }

mark {
  background-color: #FFF;
  color: #0d0d38;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

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

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

input, select {
  vertical-align: middle; }

body {
  font-family: "Helvetica Neue", "Helvetica", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ Pro", "メイリオ", "游ゴシック体", "Yu Gothic", YuGothic, "Meiryo", メイリオ, sans-serif, serif;
  font-size: 1rem;
  line-height: 2rem;
  animation: fadeIn 1s ease 0s 1 normal;
  -webkit-animation: fadeIn 1s ease 0s 1 normal; }

main {
  width: 100%;
  overflow-x: hidden !important; }

.row img {
  width: 100%;
  height: auto; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
a.anchor {
  display: block;
  padding-top: 120px;
  margin-top: -120px; }

/* Google reCAPTCHAを消す */
.grecaptcha-badge {
  visibility: hidden; }

/*-------------------------------------------
　セクション背景設定
-------------------------------------------*/
@keyframes gradientBG {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
/*-------------------------------------------
　画像　位置設定
-------------------------------------------*/
/*-------------------------------------------
　テキストBOX
-------------------------------------------*/
/*-------------------------------------------
　テキスト装飾
-------------------------------------------*/
/*-------------------------------------------
　テキストサイズ
-------------------------------------------*/
/*-------------------------------------------
　テキストサイズ
-------------------------------------------*/
/*-------------------------------------------
　スクロール　矢印×アニメーション
-------------------------------------------*/
/*-------------------------------------------
　テキストメインコンテンツ　位置調整
-------------------------------------------*/
/*-------------------------------------------
　クリックで開く　Q&Aなど
-------------------------------------------*/
.accbox_group {
  border-top: 1px solid #9E9EAF; }

.accbox {
  max-width: 100%; }
  .accbox label {
    display: block;
    margin: 1.5px 0;
    padding: 10px 10px 12px 55px;
    line-height: 2.5rem;
    font-size: 1.1rem;
    color: #0d0d38;
    border-bottom: 1px solid #9E9EAF;
    text-indent: -1.5em;
    transition: all 0.3s;
    cursor: pointer; }
    @media screen and (max-width: 767px) {
      .accbox label {
        line-height: 2rem;
        font-size: 0.88rem; } }
    @media screen and (max-width: 767px) {
      .accbox label {
        padding: 12px 20px 14px 2.4em; } }
    .accbox label:hover {
      background: #e4dff6;
      color: #0d0d38; }
  .accbox input {
    display: none; }
  .accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.3s; }

.cssacc:checked + .accshow {
  height: auto;
  padding: 15px 30px 20px;
  line-height: 2.5rem;
  font-size: 1rem;
  color: #0d0d38;
  background: #E6E6EB;
  opacity: 1;
  border-bottom: 2px solid #0d0d38; }
  @media screen and (max-width: 767px) {
    .cssacc:checked + .accshow {
      line-height: 2rem;
      font-size: 0.8rem; } }

/*-------------------------------------------
　バナー枠
-------------------------------------------*/
.banner {
  padding: 20px; }
  @media screen and (max-width: 767px) {
    .banner {
      padding: 10px 20px; } }

/*-------------------------------------------
　バナー　拡大する
-------------------------------------------*/
figure.cat_banner {
  position: relative;
  overflow: hidden;
  max-height: 150px;
  width: 100%;
  margin-bottom: 20px;
  background: #4b4bc6;
  color: #FFF;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  border: 2px #FFF solid; }
  @media screen and (max-width: 767px) {
    figure.cat_banner {
      margin: 10px 0; } }
  figure.cat_banner * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out; }
  figure.cat_banner img {
    width: 100%;
    position: relative;
    opacity: 0.7;
    overflow: hidden; }
  figure.cat_banner figcaption {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 15%;
    right: 15%;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-width: 1px 1px 0px;
    background-color: rgba(0, 0, 0, 0.4); }
  figure.cat_banner center {
    margin: 0;
    padding: 12px 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px; }
    @media screen and (max-width: 767px) {
      figure.cat_banner center {
        font-size: 1rem; } }
  figure.cat_banner .icon, figure.cat_banner .caption {
    overflow: hidden;
    width: 100%;
    position: absolute; }
  figure.cat_banner .icon {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    top: 0; }
  figure.cat_banner .caption {
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
    bottom: 0; }
  figure.cat_banner p, figure.cat_banner .icon span {
    display: table;
    margin: 0 auto;
    padding: 0 10px;
    position: relative;
    text-align: center;
    width: auto;
    color: rgba(179, 159, 198, 0);
    font-size: 0.6em; }
  figure.cat_banner p:before, figure.cat_banner .icon span:before, figure.cat_banner p:after {
    position: absolute;
    height: 1px;
    content: '';
    background: white;
    -webkit-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out; }
  figure.cat_banner .icon span:after {
    position: absolute;
    height: 1px;
    content: '';
    background: white;
    -webkit-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out; }
  figure.cat_banner .icon span:before, figure.cat_banner .icon span:after {
    width: 1000%;
    top: 50%; }
  figure.cat_banner .icon span:before {
    left: -1000%; }
  figure.cat_banner .icon span:after {
    right: -1000%; }
  figure.cat_banner i {
    color: white;
    font-size: 30px; }
  figure.cat_banner p:before, figure.cat_banner p:after {
    width: 150%;
    bottom: 50%; }
  figure.cat_banner p:before {
    left: -100%; }
  figure.cat_banner p:after {
    right: -100%; }
  figure.cat_banner a {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1; }
  figure.cat_banner:hover img, figure.cat_banner.hover img {
    opacity: 0.15;
    -webkit-transform: scale(1.1);
    transform: scale(1.1); }
  figure.cat_banner:hover p, figure.cat_banner.hover p {
    opacity: 1;
    -webkit-transition-delay: 0.35s;
    transition-delay: 0.35s;
    color: #FFF; }
  figure.cat_banner:hover p:before, figure.cat_banner.hover p:before {
    left: -150%; }
  figure.cat_banner:hover p:after, figure.cat_banner.hover p:after {
    right: -150%; }

/*-------------------------------------------
　リンクボタン
-------------------------------------------*/
.linkbutton a {
  display: block;
  position: relative;
  max-width: 350px;
  margin: 0 auto;
  margin-top: 40px;
  padding: 8px 0;
  background: linear-gradient(90deg, #6e6eff, #654181);
  background-size: cover;
  overflow: hidden;
  text-decoration: none;
  line-height: 2.5rem;
  font-size: 1rem;
  font-family: "source-han-sans-japanese", serif;
  letter-spacing: 0.1em;
  text-align: center;
  color: #FFF; }
  @media screen and (max-width: 767px) {
    .linkbutton a {
      line-height: 2rem;
      font-size: 0.8rem; } }
  @media screen and (max-width: 767px) {
    .linkbutton a {
      display: block;
      width: 100%;
      margin: 0 auto;
      padding: 0.5em 0;
      background: #714990;
      color: #fff;
      text-align: center;
      font-size: 0.9em; } }
  .linkbutton a:hover {
    text-decoration: none;
    opacity: 0.8;
    color: #fff;
    filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.1)); }
  .linkbutton a::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 0.6s cubic-bezier(0.25, 0.1, 0.2, 1);
    -moz-transition: all 0.6s cubic-bezier(0.25, 0.1, 0.2, 1);
    transition: all 0.6s cubic-bezier(0.25, 0.1, 0.2, 1);
    content: "";
    background-color: #FFF000;
    position: absolute;
    top: -150px;
    right: auto;
    left: -10px;
    z-index: -1;
    width: 0;
    height: 300px; }
  .linkbutton a:hover::before {
    transform: rotate(70deg);
    width: 700px;
    opacity: 0.5; }

.linkbutton_max a {
  width: 100%;
  margin-bottom: 50px; }

/*-------------------------------------------
　新着一覧表示
-------------------------------------------*/
.info-box {
  margin-bottom: 20px;
  padding: 10px 20px 5px;
  border: 1px solid #B6B6C3;
  background: #FFF; }
  .info-box p {
    padding: 2px 0 12px 0;
    line-height: 1.3rem;
    font-size: 0.8rem; }
    @media screen and (max-width: 767px) {
      .info-box p {
        line-height: 1.17rem;
        font-size: 0.72rem; } }
    .info-box p a {
      text-decoration: underline; }
      .info-box p a:hover {
        color: #4b4bc6;
        text-decoration: underline; }
  .info-box span.lead {
    display: inline-block;
    font-weight: 400; }
  .info-box .imgthumbnail {
    max-height: 160px;
    overflow-y: hidden;
    align-items: center;
    display: flex; }
    @media screen and (max-width: 767px) {
      .info-box .imgthumbnail {
        max-height: 100px; } }
    .info-box .imgthumbnail img {
      height: 100%; }

.info-cat {
  display: inline-block;
  margin-top: -2px;
  line-height: 1.3rem;
  font-size: 0.7rem;
  font-weight: bold;
  color: #FFF;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .info-cat {
      line-height: 1.17rem;
      font-size: 0.63rem; } }
  .info-cat a {
    color: #FFF;
    text-decoration: none; }
    .info-cat a:hover {
      color: #B7B7B7;
      text-decoration: none; }

.info-cat-open {
  margin: 0 10px;
  width: 100px;
  background: #73B037; }

.info-cat-news {
  margin: 0 10px;
  width: 100px;
  background: #FE6063; }

.info-cat-media {
  margin: 0 10px;
  width: 100px;
  background: #1299CC; }

.info-cat-research {
  margin: 0 10px 0 0;
  padding: 0 10px;
  background: #4b4bc6; }

.info-cat-youtube {
  margin: 0 10px;
  width: 100px;
  background: #FF0000; }

/*-------------------------------------------
 アーカイブ　ページネーション
-------------------------------------------*/
.pagination {
  clear: both;
  position: relative;
  line-height: 2.5rem;
  font-size: 1rem;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .pagination {
      line-height: 2rem;
      font-size: 0.8rem; } }
  .pagination .pagination-box {
    display: inline-block; }
  .pagination span {
    display: block;
    float: left;
    margin: 2px 5px 2px 0;
    padding: 2px 20px 0;
    text-decoration: none;
    width: auto;
    color: #FFF;
    background: #0d0d38; }
  .pagination a {
    display: block;
    float: left;
    margin: 2px 5px 2px 0;
    padding: 2px 20px 0;
    text-decoration: none;
    width: auto;
    color: #FFF;
    background: #0d0d38; }
    .pagination a:hover {
      color: #FFF;
      background: #4b4bc6; }
  .pagination .current {
    padding: 2px 20px 0;
    color: #FFF;
    background: #4b4bc6; }

/*-------------------------------------------
 シングルページ　ページネーション
-------------------------------------------*/
ul.pager {
  max-width: 980px;
  margin: 0 auto;
  padding-top: 30px;
  padding-bottom: 30px;
  list-style-type: none;
  padding-left: 0;
  display: flex;
  justify-content: center; }
  @media screen and (max-width: 767px) {
    ul.pager {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  @media screen and (max-width: 767px) {
    ul.pager {
      padding-top: -10px;
      padding-bottom: -10px; } }
  @media screen and (max-width: 767px) {
    ul.pager {
      display: inline-block; } }
  ul.pager li {
    margin: 5px 15px 4px 0; }
    @media screen and (max-width: 767px) {
      ul.pager li {
        width: 100%;
        margin: 10px 0;
        display: inline-block;
        text-align: center; } }
  ul.pager a {
    background: #0d0d38;
    padding: 10px 20px;
    line-height: 2.5rem;
    font-size: 1rem;
    color: #FFF;
    font-weight: bold; }
    @media screen and (max-width: 767px) {
      ul.pager a {
        line-height: 2rem;
        font-size: 0.8rem; } }
    @media screen and (max-width: 767px) {
      ul.pager a {
        width: 100%;
        text-align: center; } }
    ul.pager a:hover {
      background: #0d0d38;
      text-decoration: none; }

/*-------------------------------------------
　ページトップへ戻る
-------------------------------------------*/
#page-top_div p {
  margin: 0;
  text-align: center;
  width: 100%;
  background: #0d0d38;
  font-size: 0.6em;
  color: #FFF;
  border-top: 1px solid #0d0d38;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease; }
#page-top_div p:hover {
  background: #86869B; }
#page-top_div a:hover {
  text-decoration: none; }

/*-------------------------------------------
　パンくず
-------------------------------------------*/
ul.pankuzu {
  text-align: center;
  line-height: 1.2rem;
  font-size: 0.7rem;
  margin: 10px 0 10px 15px;
  overflow: hidden;
  z-index: 3000; }
  @media screen and (max-width: 767px) {
    ul.pankuzu {
      line-height: 1.08rem;
      font-size: 0.63rem; } }
  ul.pankuzu li {
    float: left;
    list-style: none; }
    ul.pankuzu li a {
      color: #0d0d38; }
      ul.pankuzu li a:visited {
        color: #0d0d38; }
      ul.pankuzu li a:hover {
        color: #70613a;
        text-decoration: underline; }

/*-------------------------------------------
　タブ切り替え
-------------------------------------------*/
.nav {
  margin-top: 50px;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none; }

.nav-link {
  padding: 15px 35px;
  margin-right: 2px;
  font-size: 20px; }

.nav-tabs {
  font-weight: bold; }
  .nav-tabs .nav-link {
    border-top: 1px solid #FFF;
    background-color: #745fcb;
    color: #FFF; }
    .nav-tabs .nav-link:hover {
      color: #FFF;
      border: 1px solid #0d0d38;
      background-color: #0d0d38; }
  .nav-tabs .nav-link.active {
    margin-bottom: -1px;
    color: #0d0d38;
    background-color: #E6E6EB;
    border: 2px solid #0d0d38;
    border-bottom: 2px solid #E6E6EB;
    font-weight: bold; }
  .nav-tabs .nav-item.show .nav-link {
    margin-bottom: -1px;
    color: #FFF;
    background-color: #E6E6EB;
    border: 2px solid #0d0d38;
    border-bottom: 2px solid #E6E6EB;
    font-weight: bold; }

/*-------------------------------------------
　テーブル設定
-------------------------------------------*/
/* 列１：紫 */
.trtdbgcolac tr:nth-child(1) th, .trtdbgcolac tr:nth-child(1) td {
  background: #e4dff6;
  font-weight: bold;
  letter-spacing: 0.1;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .trtdbgcolac tr:nth-child(1) th, .trtdbgcolac tr:nth-child(1) td {
      text-align: left; } }

/* 列１：紫　行１：背景灰色 */
.trtdbgcol tr:nth-child(1) th, .trtdbgcol tr:nth-child(1) td {
  background: #e4dff6;
  font-weight: bold;
  letter-spacing: 0.1;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .trtdbgcol tr:nth-child(1) th, .trtdbgcol tr:nth-child(1) td {
      text-align: left; } }
.trtdbgcol td:nth-child(1) {
  background: #E6E6EB;
  font-weight: bold; }

/* 行１：背景灰色 */
.tdbgcol td:nth-child(1) {
  background: #CECED7;
  font-weight: bold; }

/* 行２列均等 */
.td02 td:nth-child(1) {
  width: calc(100% / 5); }
.td02 td:nth-child(2) {
  width: calc(100% / 5); }

/* 行３列均等　最初が少し小さい */
.td03 td:nth-child(1) {
  width: calc(100% / 3.4); }
.td03 td:nth-child(2) {
  width: calc(100% / 2.8); }
.td03 td:nth-child(3) {
  width: calc(100% / 2.8); }

/* 文字：テーブル全てセンター */
.txtallcenter th {
  text-align: center; }
  @media screen and (max-width: 767px) {
    .txtallcenter th {
      text-align: left; } }
.txtallcenter td {
  text-align: center; }
  @media screen and (max-width: 767px) {
    .txtallcenter td {
      text-align: left; } }

/* ○など　色：黄色　文字：センター */
#scolor {
  background: #fff7dd;
  text-align: center;
  font-weight: bold; }

#scenter {
  text-align: center; }

/*-------------------------------------------
　リサーチ記事テーブル
-------------------------------------------*/
.magazine-content {
  /* テーブル　基本 */ }
  .magazine-content table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 2px solid #9E9EAF;
    margin-top: 10px; }
    .magazine-content table th, .magazine-content table td {
      padding: 14px 15px 12px;
      border-bottom: 1px solid #9E9EAF;
      border-right: 1px solid #9E9EAF;
      line-height: 1.4rem;
      font-size: 0.9rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph; }
      @media screen and (max-width: 767px) {
        .magazine-content table th, .magazine-content table td {
          line-height: 1.12rem;
          font-size: 0.72rem; } }
      @media screen and (max-width: 767px) {
        .magazine-content table th, .magazine-content table td {
          padding: 5px 7px 4px; } }
    .magazine-content table th {
      background: #E6E6EB;
      line-height: 1.4rem;
      font-size: 1rem;
      font-weight: bold;
      text-align: center; }
      @media screen and (max-width: 767px) {
        .magazine-content table th {
          line-height: 1.12rem;
          font-size: 0.8rem; } }
      @media screen and (max-width: 767px) {
        .magazine-content table th {
          text-align: left; } }
    .magazine-content table p {
      padding: 0; }

/*-------------------------------------------
　横スクロール
-------------------------------------------*/
.scrolltable {
  overflow-x: scroll;
  width: 100%; }
  .scrolltable table {
    width: 815px; }

/*-------------------------------------------
フローチャート
-------------------------------------------*/
.flowtable {
  overflow-x: scroll;
  overflow-y: hidden; }
  .flowtable table.flow2 {
    border: none;
    position: relative; }
    .flowtable table.flow2 tr:nth-child(odd) td {
      background: #FFF; }
    .flowtable table.flow2 hr {
      margin: 0;
      margin-top: 10px;
      padding: 0;
      border-top: 1px solid #0d0d38;
      height: 1px; }
    .flowtable table.flow2 th {
      margin: 0;
      padding: 0;
      border: none;
      text-align: center;
      font-size: 12px;
      font-weight: bold;
      height: 30px;
      line-height: 31px; }
      .flowtable table.flow2 th.flowtop {
        width: 120px;
        color: #FFF;
        background: #714990;
        display: block; }
      .flowtable table.flow2 th.flowtoplink {
        width: 120px; }
        .flowtable table.flow2 th.flowtoplink a {
          width: 120px;
          color: #FFF;
          background: #714990;
          display: block;
          text-decoration: none; }
          .flowtable table.flow2 th.flowtoplink a:hover {
            background: #4b325e; }
      .flowtable table.flow2 th.flowtopicon::before {
        content: "";
        width: 10px;
        height: 10px;
        display: block;
        border-top: 3px solid #714990;
        border-right: 3px solid #714990;
        top: calc(40% - 0px);
        left: 0%;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg); }
    .flowtable table.flow2 td {
      padding: 0;
      margin: 0;
      background: #eee;
      border: none;
      padding: 5px 0; }
      .flowtable table.flow2 td.flowitemicon::before {
        content: "";
        width: 10px;
        height: 10px;
        display: block;
        border-top: 3px solid #714990;
        border-right: 3px solid #714990;
        top: calc(40% - 0px);
        left: 0%;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg); }
      .flowtable table.flow2 td.flowitemlinktitle a {
        width: 120px;
        font-size: 12px;
        line-height: 1.2em;
        color: #FFF;
        background: #4b325e;
        display: block;
        text-decoration: none;
        text-align: center;
        height: 30px;
        line-height: 31px;
        font-weight: bold; }
        .flowtable table.flow2 td.flowitemlinktitle a:hover {
          background: #714990; }
      .flowtable table.flow2 td.flowitem p {
        margin: 0;
        padding: 6px 6px 4px;
        font-size: 10px;
        line-height: 1.2em;
        border: #745fcb solid 3px;
        text-align: justify;
        vertical-align: top;
        background: #FFF;
        display: block; }

/*-------------------------------------------
　スマホでは一行　基本テーブル
-------------------------------------------*/
.table-mobileone table {
  border-top: 1px solid #9E9EAF;
  width: 100%;
  border-collapse: collapse;
  line-height: 2.5rem;
  font-size: 1rem; }
  @media screen and (max-width: 767px) {
    .table-mobileone table {
      line-height: 2rem;
      font-size: 0.8rem; } }
  .table-mobileone table a {
    color: #4b4bc6;
    text-decoration: underline; }
    .table-mobileone table a:hover {
      color: #0d0d38; }
  .table-mobileone table .box {
    color: #FFF;
    text-decoration: none;
    padding: 2px 11px 2px 12px;
    background: #4b4bc6;
    font-size: 0.8em;
    vertical-align: middle; }
    .table-mobileone table .box:hover {
      color: #FFF;
      background: #0d0d38; }
  .table-mobileone table tr {
    border-bottom: 1px solid #9E9EAF; }
  .table-mobileone table td {
    position: relative;
    border: none;
    text-align: left;
    vertical-align: middle;
    padding: 16px 3%;
    background-color: #FFF;
    font-size: 1em;
    line-height: 1.8em; }
    @media screen and (max-width: 767px) {
      .table-mobileone table td {
        padding: 10px 20px;
        display: block; } }
  .table-mobileone table th {
    text-align: center;
    padding: 16px;
    width: 22%;
    font-weight: normal;
    background-color: #CECED7;
    font-size: 1em;
    line-height: 1.8em; }
    @media screen and (max-width: 767px) {
      .table-mobileone table th {
        padding: 10px 20px;
        display: block;
        width: 100%;
        box-sizing: border-box;
        text-align: left; } }

/*-------------------------------------------
　コンテンツ区切り枠、ななめ表示
-------------------------------------------*/
.diagonal {
  padding-bottom: calc(10vw + 0px);
  position: relative;
  overflow: hidden; }

.diagonal::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: 10vw solid #FFF;
  border-right: 100vw solid transparent; }

.diagonalW {
  padding-bottom: calc(10vw + 0px);
  position: relative;
  overflow: hidden; }

.diagonalW::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: 10vw solid #CECED7;
  border-left: 100vw solid transparent; }

.trianglestep {
  padding-top: calc(10vw + 0px);
  /* 高さに合わせて調節してください。*/
  position: relative; }

.trianglestep::before, .trianglestep::after {
  content: '';
  position: absolute;
  bottom: 0;
  width: 0;
  height: 0;
  border-bottom: 10vw solid #CECED7;
  /* 好みで高さ色を変えてください */ }

.trianglestep::before {
  left: 0;
  border-right: 50vw solid transparent; }

.trianglestep::after {
  right: 0;
  border-left: 50vw solid transparent; }

/*-------------------------------------------
　共通文字設定
-------------------------------------------*/
.ttlen {
  margin: 0 0 20px;
  font-size: 1rem;
  line-height: 2rem;
  font-family: "nimbus-sans", sans-serif;
  text-transform: uppercase;
  color: #4b4bc6;
  margin-left: 2px;
  position: relative; }
  .ttlen::after {
    content: '';
    width: 41px;
    height: 2px;
    display: inline-block;
    background-color: #4b4bc6;
    position: absolute;
    bottom: 0px;
    left: 0; }

.ttltitle {
  margin: 0 0 20px;
  font-style: normal;
  line-height: 3.5rem;
  font-size: 2.8rem;
  font-family: "source-han-sans-japanese", serif;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  letter-spacing: 0.1rem; }
  @media screen and (max-width: 767px) {
    .ttltitle {
      line-height: 2.8rem;
      font-size: 2.24rem; } }

.ttltitleT {
  margin: 0 0 40px;
  font-style: normal;
  line-height: 3.5rem;
  font-size: 2.8rem;
  font-family: "source-han-sans-japanese", serif;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  letter-spacing: 0.1rem; }
  @media screen and (max-width: 767px) {
    .ttltitleT {
      line-height: 2.8rem;
      font-size: 2.24rem; } }

.ttltitleC {
  margin: 0 0 20px;
  font-style: normal;
  line-height: 2rem;
  font-size: 1.3rem;
  font-family: "source-han-sans-japanese", serif;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 767px) {
    .ttltitleC {
      line-height: 1.8rem;
      font-size: 1.17rem; } }

.ttltitleS {
  margin: 0 0 40px;
  font-style: normal;
  line-height: 1.3rem;
  font-size: 0.8rem;
  font-family: "source-han-sans-japanese", serif;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 767px) {
    .ttltitleS {
      line-height: 1.17rem;
      font-size: 0.72rem; } }

.txtmainh3 {
  margin: 5px 0;
  padding: 0px 15px;
  font-style: normal;
  line-height: 2rem;
  font-size: 1.3rem;
  background-color: #e4dff6; }
  @media screen and (max-width: 767px) {
    .txtmainh3 {
      line-height: 1.8rem;
      font-size: 1.17rem; } }

.txtmain {
  margin-bottom: 20px;
  line-height: 2.5rem;
  font-size: 1rem;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 767px) {
    .txtmain {
      line-height: 2rem;
      font-size: 0.8rem; } }

.txtmainS {
  margin-bottom: 10px;
  line-height: 1.3rem;
  font-size: 0.8rem;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 767px) {
    .txtmainS {
      line-height: 1.17rem;
      font-size: 0.72rem; } }

.ttlencenter {
  margin: 0 0 30px;
  line-height: 2.5rem;
  font-size: 1rem;
  font-family: "nimbus-sans", sans-serif;
  text-transform: uppercase;
  color: #4b4bc6;
  margin-left: 2px;
  text-align: center;
  position: relative; }
  @media screen and (max-width: 767px) {
    .ttlencenter {
      line-height: 2rem;
      font-size: 0.8rem; } }
  .ttlencenter::after {
    content: '';
    width: 41px;
    height: 2px;
    display: inline-block;
    background-color: #4b4bc6;
    position: absolute;
    bottom: 0px;
    left: 48%; }

.ttltitlecenter {
  margin: 0;
  font-style: normal;
  line-height: 3.5rem;
  font-size: 2.8rem;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.1rem; }
  @media screen and (max-width: 767px) {
    .ttltitlecenter {
      line-height: 2.8rem;
      font-size: 2.24rem; } }

.txtmaincenter {
  margin: 0 0 30px;
  line-height: 2.5rem;
  font-size: 1rem;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .txtmaincenter {
      line-height: 2rem;
      font-size: 0.8rem; } }

ol.olnumber {
  counter-reset: item;
  margin: 15px 0 10px;
  line-height: 2rem;
  font-size: 1.3rem;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  font-weight: 600; }
  @media screen and (max-width: 767px) {
    ol.olnumber {
      line-height: 1.8rem;
      font-size: 1.17rem; } }
  ol.olnumber li:before {
    counter-increment: item;
    content: counter(item) ".";
    padding-right: .5em;
    color: #4b4bc6; }

/* 携帯非表示 */
@media screen and (max-width: 767px) {
  .sp {
    display: none; } }

/* PC非表示 */
@media screen and (min-width: 768px) {
  .pc {
    display: none; } }

/*-------------------------------------------
　動画設定
-------------------------------------------*/
.youtube {
  margin: 10px 0;
  width: 100%;
  padding: 0;
  box-sizing: border-box; }
  .youtube-inner {
    padding-top: 56.25%;
    position: relative;
    height: 0;
    overflow: hidden; }
    .youtube-inner iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

header {
  width: 100%;
  top: 0px;
  position: fixed;
  padding: 0;
  z-index: 1100;
  background: #FFF;
  height: 62px; }

.header-inner {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }
  .header-inner a {
    text-decoration: none; }
  .header-inner .gnav-wrapper {
    position: absolute;
    right: 0px;
    width: calc(55vw + 80px); }
  .header-inner .gnav {
    display: flex;
    justify-content: space-between; }
    .header-inner .gnav li {
      text-align: center;
      transition: all .1s ease-in-out;
      padding: 10px 30px;
      line-height: 2.5rem;
      font-size: 0.9rem;
      font-family: "source-han-sans-japanese", serif;
      color: #0d0d38; }
      .header-inner .gnav li:hover {
        background: #e4dff6; }
      .header-inner .gnav li img {
        padding: 15px 15px 0px;
        width: 100%;
        height: auto; }
    .header-inner .gnav > li:hover .megamenu {
      max-height: 9999px;
      opacity: 1; }
    .header-inner .gnav .megamenu-entry {
      background: #ff1240;
      color: #FFF; }
      .header-inner .gnav .megamenu-entry:hover {
        background: #e4dff6;
        color: #0d0d38; }
  .header-inner .megamenu {
    overflow: hidden;
    position: absolute;
    width: 100%;
    max-height: 0;
    top: 60px;
    left: 0;
    opacity: 0;
    background: #FFF;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.5);
    transition: all .1s ease-in;
    z-index: 999; }
  .header-inner .megamenu-inner {
    display: flex;
    flex-wrap: wrap; }
    .header-inner .megamenu-inner li {
      width: calc((100% / 5));
      padding: 0; }
    .header-inner .megamenu-inner a {
      border-left: none; }
  .header-inner .megamenu-inner-img {
    height: 80px;
    overflow-y: hidden; }

/*-------------------------------------------
  携帯用ナビゲーション
-------------------------------------------*/
.header-inner-logo {
  top: 12px;
  left: 30px;
  max-width: 220px;
  float: left;
  position: fixed; }
  .header-inner-logo img {
    width: 100%;
    height: auto; }

.side-menu {
  position: fixed;
  top: 0;
  right: 0;
  width: 70%;
  height: 100%;
  padding-top: 70px;
  text-align: left;
  font-size: 1rem;
  background: #0d0d38;
  z-index: 1201;
  opacity: 0.9;
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .side-menu .phone-menu {
    height: 100%;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch; }
  .side-menu ul {
    padding: 10px 0 15px;
    color: #FFF; }
  .side-menu li {
    margin-bottom: 0;
    padding: 0px 20px;
    position: relative;
    font-size: 1.1rem; }
  .side-menu .phone-menu-entry a {
    display: inline-block;
    width: 100%;
    padding: 2px 20px;
    margin: 5px 0;
    font-size: 1rem;
    background: #e4dff6;
    color: #0d0d38;
    text-decoration: none;
    text-align: center;
    font-weight: bold; }
    .side-menu .phone-menu-entry a:hover {
      background: #fff7dd; }
  .side-menu .phone-menu-g a {
    display: inline-block;
    width: 100%;
    margin-left: 2em;
    font-size: 0.9rem;
    color: #FFF;
    text-decoration: none; }
    .side-menu .phone-menu-g a:hover {
      color: #fff7dd; }
    .side-menu .phone-menu-g a:before {
      font-size: 1rem;
      color: #FFF;
      content: "ー";
      position: absolute;
      top: 1px;
      left: 25px; }

/* サイドメニュー */
/*-------------------------------------------
 開閉用ボタン
-------------------------------------------*/
.side-open .side-menu {
  transform: translateX(0); }
.side-open .side-menu-btn {
  position: fixed;
  background: url(../images/common/sp-close.svg) no-repeat;
  width: 110px;
  height: 35px; }

.side-menu-btn {
  position: fixed;
  top: 15px;
  right: 2px;
  width: 110px;
  height: 35px;
  padding: 5px;
  cursor: pointer;
  z-index: 2004;
  background: url(../images/common/sp-menu.svg) no-repeat; }

@media screen and (max-width: 767px) {
  .header-inner {
    height: 55px;
    width: 100%;
    padding: 5px 5%;
    background-color: rgba(255, 255, 255, 0); }

  .header-inner-logo {
    left: 15px;
    top: 14px;
    width: 60vw; } }
@media screen and (max-width: 1100px) {
  .header-inner .gnav li {
    font-size: 0.7rem; }
  .header-inner .megamenu-inner-img {
    height: 60px; } }
/*-------------------------------------------
スマホ表示有無
-------------------------------------------*/
@media screen and (max-width: 767px) {
  .visible-desktop {
    display: none; } }
@media screen and (min-width: 768px) {
  .visible-phone {
    display: none; } }
/*-------------------------------------------
エントリー誘導
-------------------------------------------*/
.recruit-entry-content {
  max-width: 980px;
  margin: 0 auto;
  padding-top: 40px;
  padding-bottom: 40px; }
  @media screen and (max-width: 767px) {
    .recruit-entry-content {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px;
      padding-top: 10px;
      padding-bottom: 10px; } }

/*-------------------------------------------
ページトップ
-------------------------------------------*/
#page-top_div p {
  text-align: center;
  width: 100%;
  background: #0d0d38;
  line-height: 1.3rem;
  font-size: 0.8rem;
  color: #FFF;
  padding: 3px 0; }
  @media screen and (max-width: 767px) {
    #page-top_div p {
      line-height: 1.17rem;
      font-size: 0.72rem; } }
  #page-top_div p:hover {
    background: #0d0d38; }
#page-top_div a:hover {
  text-decoration: none; }

/*-------------------------------------------
フッター
-------------------------------------------*/
.footer {
  background-color: #0d0d38; }

.footer-content {
  border-bottom: 1px solid #9E9EAF; }
  .footer-content a {
    color: #9E9EAF;
    text-decoration: none; }
    .footer-content a:hover {
      color: #FFF;
      text-decoration: underline; }

.footer-content-nav {
  max-width: 980px;
  margin: 0 auto;
  position: relative;
  padding: 0 0 20px; }
  .footer-content-nav ul {
    line-height: 2em;
    margin-right: 30px;
    padding: 20px 10px 15px 0px;
    display: inline-block;
    vertical-align: top; }
  .footer-content-nav p {
    letter-spacing: 0em; }

.footer-content-address {
  padding: 20px 20px 0; }
  .footer-content-address p {
    font-size: 0.8rem;
    line-height: 1.6rem;
    color: #9E9EAF; }

.footer-content-copy {
  padding: 70px 30px 20px;
  text-align: right; }
  .footer-content-copy p {
    font-size: 0.8rem;
    line-height: 1.2rem;
    color: #9E9EAF; }
    .footer-content-copy p a {
      color: #FFF; }

@media screen and (max-width: 767px) {
  .footer-content {
    max-width: 100%;
    padding-left: 30px;
    padding-right: 30px;
    padding: 0px 30px 0px; }

  .footer-content-nav ul {
    padding: 20px 10px 20px 10px; }

  .footer-content-address {
    max-width: 100%;
    padding-left: 30px;
    padding-right: 30px; }
    .footer-content-address p {
      font-size: 0.8rem;
      line-height: 1.4rem; }

  .footer-content-copy {
    padding: 60px 30px 20px; } }
/*-------------------------------------------
メインビジュアル
-------------------------------------------*/
.mainvisual-mobile {
  margin-top: 60px;
  margin-bottom: -10px; }
  .mainvisual-mobile img {
    width: 100vw; }

.mainvisual {
  position: relative;
  height: 100vh; }
  .mainvisual img {
    height: 100vh;
    transform-origin: center center;
    object-fit: cover;
    animation: 12s ease 0s 1 normal forwards running anime1; }
  .mainvisual .w-100 {
    width: 100% !important; }
  .mainvisual .d-block {
    display: block !important; }
  .mainvisual .mainvisualtxt {
    position: absolute;
    top: calc(600 / 1440 * 100%);
    left: calc(10 / 1440 * 100%);
    z-index: 1; }
    .mainvisual .mainvisualtxt p {
      font-style: normal;
      font-family: "source-han-sans-japanese", serif;
      font-size: 4vw;
      line-height: 1.3em;
      color: #FFF;
      margin: 30px 0px 0px 20px;
      text-shadow: rgba(13, 13, 56, 0.7) 1px 0 10px; }
  .mainvisual .mainvisualScroll a {
    position: absolute;
    bottom: 0px;
    left: calc(720 / 1440 * 100%);
    z-index: 2;
    display: inline-block;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-decoration: none;
    line-height: 1rem;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.3rem;
    color: #FFF;
    padding-top: 70px; }
    @media screen and (max-width: 767px) {
      .mainvisual .mainvisualScroll a {
        line-height: 0.9rem;
        font-size: 0.63rem; } }
    .mainvisual .mainvisualScroll a:hover {
      color: #9E9EAF; }
    .mainvisual .mainvisualScroll a span {
      position: absolute;
      top: 0;
      left: 50%;
      width: 24px;
      height: 24px;
      margin-left: -12px;
      border-left: 1px solid #FFF;
      border-bottom: 1px solid #FFF;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      -webkit-animation: sdb 1.5s infinite;
      animation: sdb 1.5s infinite;
      box-sizing: border-box; }
  .mainvisual .mainvisualLP {
    position: absolute;
    bottom: calc(120 / 1440 * 100%);
    right: 0;
    z-index: 1; }
    .mainvisual .mainvisualLP .new a {
      padding: 20px 30px;
      font-style: normal;
      font-family: "source-han-sans-japanese", serif;
      line-height: 1rem;
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      color: #FFF;
      text-decoration: none;
      background: #4b4bc6;
      transition: all .1s ease-in; }
      @media screen and (max-width: 767px) {
        .mainvisual .mainvisualLP .new a {
          line-height: 0.9rem;
          font-size: 0.63rem; } }

@keyframes anime1 {
  0% {
    transform: scale(1.4); }
  100% {
    transform: scale(1); } }
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0; } }
@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0; } }
/*-------------------------------------------
　フロント限定
-------------------------------------------*/
.ttlentop {
  position: relative;
  margin: 20px 0 20px;
  font-family: "nimbus-sans", sans-serif;
  line-height: 2rem;
  font-size: 1.3rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #4b4bc6;
  margin-left: 2px; }
  @media screen and (max-width: 767px) {
    .ttlentop {
      line-height: 1.8rem;
      font-size: 1.17rem; } }
  .ttlentop:before {
    position: absolute;
    top: calc(50%);
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background: #4b4bc6; }
  .ttlentop span {
    position: relative;
    padding: 0 1em 0 0;
    background: #FFF; }

.ttltitleT {
  margin: 0 0 20px; }

.ttltitlecenter {
  padding-bottom: 20px; }

.message {
  position: relative;
  overflow: hidden; }
  .message-left {
    max-height: 330px;
    overflow: hidden; }
  .message-right {
    max-height: 330px;
    overflow: hidden; }
  .message-member {
    position: absolute;
    bottom: 30px;
    right: 40px;
    background: #FFF;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 1000; }
    @media screen and (max-width: 767px) {
      .message-member {
        bottom: 15px;
        right: 20px; } }
    .message-member h2 {
      margin: 0;
      padding: 10px 20px 0; }
    .message-member p {
      text-align: right;
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      margin: 0;
      padding: 5px 20px; }
      @media screen and (max-width: 767px) {
        .message-member p {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
  .message img {
    opacity: 0.9;
    -moz-transition: -moz-transform 0.2s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear; }
  .message img:hover {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1); }

/*-------------------------------------------
　フロント　コンテンツ
-------------------------------------------*/
/* 事業内容 */
.business p {
  position: relative;
  margin: 5px 10px 5px 0;
  padding: 8px 15px 8px 23px;
  font-family: "source-han-sans-japanese", serif;
  line-height: 1.2rem;
  font-size: 1rem;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  display: inline-block;
  background-color: #e4dff6; }
  @media screen and (max-width: 767px) {
    .business p {
      line-height: 0.96rem;
      font-size: 0.8rem; } }
  .business p::before {
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    top: 5%;
    left: 0;
    margin: auto;
    box-sizing: border-box;
    border: 16px solid transparent;
    border-left: 10px solid #ada1e4; }

/* ABOUT */
.About_box_img img {
  width: 90%;
  height: 130px;
  object-fit: cover;
  box-shadow: #c3c3c3 6px 6px 12px 0px;
  margin: 10px; }

.About_box_img_p {
  position: absolute;
  padding: 20px;
  top: 16%;
  left: 17%;
  width: 66%;
  height: 100px;
  background-color: rgba(116, 95, 203, 0.77);
  text-align-last: center;
  display: flex;
  color: #FFF;
  font-family: "source-han-sans-japanese", serif;
  align-content: flex-start;
  align-items: center;
  justify-content: space-around; }
  .About_box_img_p:hover {
    background-color: #4b4bc6;
    transition: all 0.5s ease 0s; }

/* OUR BUSINESS */
.front_ourbusiness_box_img img {
  width: 100%; }

.front_ourbusiness_box_color {
  width: 80%;
  height: 150px;
  position: absolute;
  top: 150px;
  left: 10%;
  color: #FFF;
  padding: 25px 30px;
  margin: auto;
  background: linear-gradient(90deg, #6e6eff, #654181);
  transition: all 0.5s ease 0s; }
  .front_ourbusiness_box_color:hover {
    background: #4b4bc6;
    transition: all 0.5s ease 0s; }

.front_ourbusiness h3 {
  font-family: "source-han-sans-japanese", serif;
  padding-bottom: 5px;
  font-size: 21px;
  border-bottom: 1px solid; }

p.front_ourbusiness_box_img_p {
  line-height: 1.5;
  padding: 15px 0px 0px; }

p.front_ourbusiness_box_img_small_p {
  font-size: 13px; }

/* PEOPLE */
.people_box {
  margin-top: 20px; }
  .people_box h3 {
    padding: 60px 0 10px;
    font-size: 2rem;
    font-family: "source-han-sans-japanese", serif; }
  .people_box img {
    width: 100%;
    height: 340px;
    object-fit: cover; }

/* WORK */
.front_work_box {
  width: 100%;
  color: #FFF;
  box-sizing: border-box;
  height: 300px;
  box-shadow: #ababab 5px 4px 12px 0px;
  padding: 20px;
  margin: 10px 0px 20px;
  background: #745fcb;
  position: relative; }
  .front_work_box a {
    text-decoration: none; }
  .front_work_box:hover {
    background-color: #4b4bc6;
    transition: all 0.5s ease 0s; }
  .front_work_box img {
    width: 100%; }
  .front_work_box h3 {
    padding: 5px 0 10px;
    font-size: 1rem;
    font-family: "source-han-sans-japanese", serif;
    letter-spacing: 0.1; }
  .front_work_box p {
    font-size: 0.8rem;
    line-height: 1.4em; }
  .front_work_box .more {
    position: absolute;
    bottom: 10px;
    color: #FFF;
    font-size: 13px; }

/* OFFICE */
.front_office_map img {
  width: 100%;
  height: auto;
  object-fit: cover;
  padding: 20px 0px 0px; }

/* エントリーボタン */
.front-entry-content {
  max-width: 980px;
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0px auto;
  position: relative; }

.new a {
  position: fixed;
  left: 0px;
  bottom: 0px;
  font-style: normal;
  font-family: "source-han-sans-japanese", serif;
  line-height: 2rem;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #FFF;
  padding: 15px 25px;
  margin: 25px;
  text-decoration: none;
  background: #745fcb;
  transition: all 0.1s ease-in 0s;
  z-index: 1000; }

@media screen and (max-width: 767px) {
  .About_box_img_p {
    padding: 10px;
    line-height: 1.2rem;
    font-size: 1rem;
    left: 20%;
    width: 63%; } }
  @media screen and (max-width: 767px) and (max-width: 767px) {
    .About_box_img_p {
      line-height: 0.96rem;
      font-size: 0.8rem; } }

@media screen and (max-width: 767px) {
  .front_ourbusiness_box_color {
    height: 180px;
    top: -30px;
    left: 0;
    width: 100%;
    position: relative;
    margin-bottom: 10px; }

  .people_box h3 {
    padding: 0px 0 10px; }
  .people_box img {
    height: 200px;
    margin-top: 30px; }

  .front_work_box {
    height: 250px; }

  .front-entry-content {
    padding: 50px 20px; }

  .new a {
    margin: 10px; } }
/*-------------------------------------------
　ページ共通　トップイメージ・タイトル
-------------------------------------------*/
/* トップイメージ */
.pagevisual {
  position: relative;
  margin-top: 62px;
  height: 400px;
  overflow-y: hidden; }
  @media screen and (max-width: 767px) {
    .pagevisual {
      height: 200px; } }
  .pagevisual img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto; }

/* トップタイトル */
.toptitle {
  margin: -80px 0 0;
  position: relative;
  z-index: 1000;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .toptitle {
      margin: -45px 0 0; } }
  .toptitle-content {
    padding: 30px 80px 0;
    background: #FFF;
    display: inline-block; }
    @media screen and (max-width: 767px) {
      .toptitle-content {
        padding: 10px 30px 0; } }
    .toptitle-content p {
      margin: 0;
      font-family: "nimbus-sans", sans-serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      font-weight: 700;
      text-transform: uppercase;
      color: #4b4bc6; }
      @media screen and (max-width: 767px) {
        .toptitle-content p {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
    .toptitle-content h1, .toptitle-content h2 {
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      letter-spacing: 0.1em;
      color: #0d0d38; }
      @media screen and (max-width: 767px) {
        .toptitle-content h1, .toptitle-content h2 {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
    .toptitle-content p.smallp {
      font-family: "source-han-sans-japanese", serif;
      line-height: 1.3rem;
      font-size: 0.8rem;
      font-weight: 100;
      color: #0d0d38; }
      @media screen and (max-width: 767px) {
        .toptitle-content p.smallp {
          line-height: 1.17rem;
          font-size: 0.72rem; } }

/*-------------------------------------------
　ページ共通
-------------------------------------------*/
/* 共通　横980px */
.page-content {
  max-width: 980px;
  margin: 0 auto;
  padding-top: 100px;
  padding-bottom: 100px;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 767px) {
    .page-content {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  @media screen and (max-width: 767px) {
    .page-content {
      padding-top: 60px;
      padding-bottom: 60px; } }
  .page-content-mainleft {
    margin-left: 5vw;
    max-width: 50vw; }
    @media screen and (max-width: 767px) {
      .page-content-mainleft {
        padding: 0 20px 20px;
        margin-left: 0;
        max-width: 100%; } }
  .page-content-mainright {
    margin-right: 5vw;
    max-width: 50vw; }
    @media screen and (max-width: 767px) {
      .page-content-mainright {
        padding: 0 20px 20px;
        margin-right: 0;
        max-width: 100%; } }

/* 共通　横1200px */
.pageMax-content {
  max-width: 1600px;
  margin: 0 auto;
  padding-top: 100px;
  padding-bottom: 100px; }
  @media screen and (max-width: 767px) {
    .pageMax-content {
      max-width: 100%; } }
  @media screen and (max-width: 767px) {
    .pageMax-content {
      padding-top: 60px;
      padding-bottom: 60px; } }
  .pageMax-content-maincenter {
    padding-left: 30px;
    padding-right: 30px; }
  .pageMax-content-mainleft {
    margin-left: 5vw;
    max-width: 50vw; }
    @media screen and (max-width: 767px) {
      .pageMax-content-mainleft {
        padding: 0 20px 20px;
        margin-left: 0;
        max-width: 100%; } }
  .pageMax-content-mainright {
    margin-right: 5vw;
    max-width: 50vw; }
    @media screen and (max-width: 767px) {
      .pageMax-content-mainright {
        padding: 0 20px 20px;
        margin-right: 0;
        max-width: 100%; } }
  .pageMax-content .ttlencenter, .pageMax-content .ttltitlecenter {
    padding-left: 20px;
    padding-right: 20px; }

/* 背景色入れる */
.bg-be-co {
  background: #E6E6EB; }

/* 中間にいれる横長イメージ */
.pagevisualmiddle {
  position: relative;
  margin-top: 62px;
  height: 400px;
  overflow-y: hidden; }
  @media screen and (max-width: 767px) {
    .pagevisualmiddle {
      height: 200px; } }
  .pagevisualmiddle img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto; }
    @media screen and (max-width: 767px) {
      .pagevisualmiddle img {
        height: 100%;
        width: auto; } }

/*-------------------------------------------
　各ページ設定
-------------------------------------------*/
/* 社長メッセージ */
.topmessage-content-main {
  padding-top: 100px;
  padding-bottom: 100px;
  max-width: 980px;
  margin: 0 auto; }
  @media screen and (max-width: 767px) {
    .topmessage-content-main {
      padding-top: 60px;
      padding-bottom: 60px; } }
  @media screen and (max-width: 767px) {
    .topmessage-content-main {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }

/* 企業理念 */
.philosophy {
  text-align: center; }
  @media screen and (max-width: 767px) {
    .philosophy {
      text-align: left; } }
  .philosophy p {
    margin: 5px 0;
    padding: 5px 15px;
    font-family: "source-han-sans-japanese", serif;
    line-height: 2rem;
    font-size: 1.3rem;
    display: inline-block;
    background-color: #e4dff6; }
    @media screen and (max-width: 767px) {
      .philosophy p {
        line-height: 1.8rem;
        font-size: 1.17rem; } }
    @media screen and (max-width: 767px) {
      .philosophy p {
        padding: 20px;
        text-align: left;
        text-align: justify;
        text-justify: inter-ideograph; } }

/*データで見る*/
.date_row{
    justify-content: center;
}


/* ある社員の一日 */
.working {
  padding-top: 100px;
  padding-bottom: 100px; }
  @media screen and (max-width: 767px) {
    .working {
      padding-top: 60px;
      padding-bottom: 60px; } }
  .working-content {
    max-width: 980px;
    margin: 0 auto;
    position: relative; }
    @media screen and (max-width: 767px) {
      .working-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    .working-content .workingtime {
      position: absolute;
      top: 40px;
      right: 0;
      font-size: 9em;
      font-weight: bold;
      color: #CECED7;
      z-index: -2; }
      @media screen and (max-width: 767px) {
        .working-content .workingtime {
          top: 0px;
          font-size: 5em; } }
    .working-content h2 {
      margin: 10px 0;
      font-family: "source-han-sans-japanese", serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph; }
      @media screen and (max-width: 767px) {
        .working-content h2 {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
      .working-content h2:before {
        content: '';
        display: inline-block;
        width: 0;
        height: 0;
        margin-left: -20px;
        border: transparent solid 20px;
        border-left-color: #CECED7;
        vertical-align: -4px; }
    .working-content .workingtxt {
      margin-left: 10px;
      margin-bottom: 20px;
      line-height: 2.5rem;
      font-size: 1rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph; }
      @media screen and (max-width: 767px) {
        .working-content .workingtxt {
          line-height: 2rem;
          font-size: 0.8rem; } }
    .working-content .col-md-7 {
      border-left: 5px solid #CECED7; }

/* 社内研修制度 */
.training-content {
  max-width: 980px;
  margin: 0 auto;
  position: relative; }
  @media screen and (max-width: 767px) {
    .training-content {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  .training-content .trainingday {
    position: absolute;
    top: 40px;
    right: 0;
    font-size: 5em;
    font-weight: bold;
    color: #E6E6EB;
    z-index: -2; }
    @media screen and (max-width: 767px) {
      .training-content .trainingday {
        top: 0px;
        font-size: 5em; } }
  .training-content h2 {
    margin: 10px 0;
    font-family: "source-han-sans-japanese", serif;
    line-height: 3.5rem;
    font-size: 2.8rem;
    text-align: left;
    text-align: justify;
    text-justify: inter-ideograph;
    padding-left: 0.5em;
    text-indent: -0.5em; }
    @media screen and (max-width: 767px) {
      .training-content h2 {
        line-height: 2.8rem;
        font-size: 2.24rem; } }
    .training-content h2:before {
      content: '';
      display: inline-block;
      width: 0;
      height: 0;
      margin-left: -20px;
      border: transparent solid 20px;
      border-left-color: #CECED7;
      vertical-align: -4px; }
  .training-content .trainingtxt {
    margin-left: 10px;
    margin-bottom: 20px;
    line-height: 2.5rem;
    font-size: 1rem;
    text-align: left;
    text-align: justify;
    text-justify: inter-ideograph; }
    @media screen and (max-width: 767px) {
      .training-content .trainingtxt {
        line-height: 2rem;
        font-size: 0.8rem; } }
  .training-content .col-md-7 {
    border-left: 5px solid #CECED7; }

/* M&A DXで働くメリット */
.merit {
  overflow: hidden; }

.merit01 {
  margin-top: 60px; }

.merit01 {
  background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/merit/merit01.jpg");
  background-size: cover;
  position: relative; }
  .merit01 .number {
    position: absolute;
    bottom: 60px;
    right: -10px;
    font-size: 15rem;
    font-family: "nimbus-sans", sans-serif;
    color: rgba(255, 255, 255, 0.1); }
    @media screen and (max-width: 767px) {
      .merit01 .number {
        font-size: 5em;
        top: 10px;
        left: 0px; } }
  .merit01-content {
    padding-top: 120px;
    padding-bottom: 120px;
    max-width: 980px;
    margin: 0 auto;
    color: #FFF; }
    @media screen and (max-width: 767px) {
      .merit01-content {
        padding-top: 80px;
        padding-bottom: 80px; } }
    @media screen and (max-width: 767px) {
      .merit01-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    .merit01-content h2 {
      font-family: "source-han-sans-japanese", serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      max-width: 600px; }
      @media screen and (max-width: 767px) {
        .merit01-content h2 {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
    .merit01-content .subttl {
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      text-align: center;
      border-top: 1px solid #FFF;
      border-bottom: 1px solid #FFF;
      padding: 15px 0;
      margin: 20px 0;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit01-content .subttl {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
    .merit01-content .maintxt {
      line-height: 2.5rem;
      font-size: 1rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit01-content .maintxt {
          line-height: 2rem;
          font-size: 0.8rem; } }
    .merit01-content span {
      color: #fff9B2; }
    .merit01-content strong {
      color: #fff9B2; }

.merit02 {
  background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/merit/merit02.jpg");
  background-size: cover;
  position: relative; }
  .merit02 .number {
    position: absolute;
    bottom: 60px;
    right: -10px;
    font-size: 15rem;
    font-family: "nimbus-sans", sans-serif;
    color: rgba(255, 255, 255, 0.1); }
    @media screen and (max-width: 767px) {
      .merit02 .number {
        font-size: 5em;
        top: 10px;
        left: 0px; } }
  .merit02-content {
    padding-top: 120px;
    padding-bottom: 120px;
    max-width: 980px;
    margin: 0 auto;
    color: #FFF; }
    @media screen and (max-width: 767px) {
      .merit02-content {
        padding-top: 80px;
        padding-bottom: 80px; } }
    @media screen and (max-width: 767px) {
      .merit02-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    .merit02-content h2 {
      font-family: "source-han-sans-japanese", serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      max-width: 600px; }
      @media screen and (max-width: 767px) {
        .merit02-content h2 {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
    .merit02-content .subttl {
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      text-align: center;
      border-top: 1px solid #FFF;
      border-bottom: 1px solid #FFF;
      padding: 15px 0;
      margin: 20px 0;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit02-content .subttl {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
    .merit02-content .maintxt {
      line-height: 2.5rem;
      font-size: 1rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit02-content .maintxt {
          line-height: 2rem;
          font-size: 0.8rem; } }
    .merit02-content span {
      color: #fff9B2; }
    .merit02-content strong {
      color: #fff9B2; }

.merit03 {
  background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/merit/merit03.jpg");
  background-size: cover;
  position: relative; }
  .merit03 .number {
    position: absolute;
    bottom: 60px;
    right: -10px;
    font-size: 15rem;
    font-family: "nimbus-sans", sans-serif;
    color: rgba(255, 255, 255, 0.1); }
    @media screen and (max-width: 767px) {
      .merit03 .number {
        font-size: 5em;
        top: 10px;
        left: 0px; } }
  .merit03-content {
    padding-top: 120px;
    padding-bottom: 120px;
    max-width: 980px;
    margin: 0 auto;
    color: #FFF; }
    @media screen and (max-width: 767px) {
      .merit03-content {
        padding-top: 80px;
        padding-bottom: 80px; } }
    @media screen and (max-width: 767px) {
      .merit03-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    .merit03-content h2 {
      font-family: "source-han-sans-japanese", serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      max-width: 600px; }
      @media screen and (max-width: 767px) {
        .merit03-content h2 {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
    .merit03-content .subttl {
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      text-align: center;
      border-top: 1px solid #FFF;
      border-bottom: 1px solid #FFF;
      padding: 15px 0;
      margin: 20px 0;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit03-content .subttl {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
    .merit03-content .maintxt {
      line-height: 2.5rem;
      font-size: 1rem;
      text-align: left;
      text-align: justify;
      text-justify: inter-ideograph;
      max-width: 550px; }
      @media screen and (max-width: 767px) {
        .merit03-content .maintxt {
          line-height: 2rem;
          font-size: 0.8rem; } }
    .merit03-content span {
      color: #fff9B2; }
    .merit03-content strong {
      color: #fff9B2; }

/* Q&A */
.qa-content {
  max-width: 980px;
  margin: 0 auto;
  padding-top: 100px;
  padding-bottom: 100px; }
  @media screen and (max-width: 767px) {
    .qa-content {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  @media screen and (max-width: 767px) {
    .qa-content {
      padding-top: 60px;
      padding-bottom: 60px; } }
  .qa-content h2 {
    line-height: 2.3rem;
    font-size: 1.8rem;
    font-family: "source-han-sans-japanese", serif;
    margin: 50px 0 20px; }
    @media screen and (max-width: 767px) {
      .qa-content h2 {
        line-height: 2.07rem;
        font-size: 1.62rem; } }
  .qa-content-guide {
    margin-top: 20px;
    padding: 10px 20px;
    background: #E6E6EB;
    border: 1px solid #0d0d38; }
    .qa-content-guide p {
      padding: 0px 20px;
      display: inline-block; }
      @media screen and (max-width: 767px) {
        .qa-content-guide p {
          padding: 0px 10px 0px 0px;
          display: contents; } }
    .qa-content-guide a {
      line-height: 2.5rem;
      font-size: 1rem;
      text-decoration: none;
      font-weight: bold; }
      @media screen and (max-width: 767px) {
        .qa-content-guide a {
          line-height: 2rem;
          font-size: 0.8rem; } }
      .qa-content-guide a:hover {
        color: #4b4bc6; }

.entry {
  margin-top: 40px;
  background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/what-the-hex.png");
  background: linear-gradient(180deg, rgba(158, 158, 175, 0.8), #9e9eaf), url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/what-the-hex.png");
  background-repeat: repeat; }
  .entry-content {
    max-width: 980px;
    margin: 0 auto;
    padding-top: 100px;
    padding-bottom: 100px; }
    @media screen and (max-width: 767px) {
      .entry-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    @media screen and (max-width: 767px) {
      .entry-content {
        padding-top: 60px;
        padding-bottom: 60px; } }

/*-------------------------------------------
　事業紹介
-------------------------------------------*/
.page-content-business .bg-be-co {
  background: #E6E6EB; }

.page-content-business-box {
  padding: 30px 20px 15px; }
  .page-content-business-box .tag p {
    display: inline-block;
    margin-right: 5px;
    padding: 1px 10px 0px;
    background: #745fcb;
    color: #FFF;
    font-size: 0.8rem;
    line-height: 0.9rem; }
  .page-content-business-box h2 {
    font-style: normal;
    font-size: 1.3rem;
    line-height: 1.8rem;
    font-weight: 700;
    text-align: left;
    text-align: justify;
    text-justify: inter-ideograph; }
  .page-content-business-box span {
    font-size: 0.9rem;
    line-height: 1rem; }
  .page-content-business-box .txt {
    margin: 10px 0 20px;
    font-style: normal;
    font-size: 0.9rem;
    line-height: 1.4rem;
    text-align: left;
    text-align: justify;
    text-justify: inter-ideograph; }

@media screen and (max-width: 767px) {
  .page-content-business .bg-be-co {
    background: #fff; }
  .page-content-business .bg-be-co-sm {
    background: #E6E6EB; }

  .page-content-business-box h2 {
    line-height: 1.8rem;
    font-size: 1.5rem; } }
/*-------------------------------------------
　募集要項 フロー
-------------------------------------------*/
.flow {
  padding-left: 35%;
  position: relative; }
  .flow::before {
    content: "";
    width: 15px;
    height: 100%;
    background: #eee;
    margin-left: -8px;
    display: block;
    position: absolute;
    top: 0;
    left: 35%; }
  .flow > li {
    position: relative; }
    .flow > li:not(:last-child) {
      margin-bottom: 8vh; }
    .flow > li .icon {
      margin-top: -9px;
      font-size: 12px;
      color: #FFF;
      font-family: "nimbus-sans", sans-serif;
      background: #6e6eff;
      background: -moz-linear-gradient(left, #6e6eff 0%, #745fcb 100%);
      background: -webkit-linear-gradient(left, #ff6eff 0%, #745fcb 100%);
      background: linear-gradient(to right, #6e6eff 0%, #745fcb 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28288c', endColorstr='#28288c',GradientType=1 );
      padding: 8px 20px;
      display: block;
      position: absolute;
      top: 0;
      left: -120px;
      z-index: 100; }
      .flow > li .icon::after {
        content: "";
        border-style: solid;
        border-width: 5px 0 5px 10px;
        border-color: transparent transparent transparent #28288c;
        position: absolute;
        top: 50%;
        left: 100%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%); }
    .flow > li dl {
      padding-left: 70px;
      position: relative; }
      .flow > li dl::before {
        content: "";
        display: block;
        position: absolute;
        top: 15px;
        width: 7px;
        height: 7px;
        margin-top: -3px;
        background: #745fcb;
        border-radius: 50%;
        left: -4px; }
      .flow > li dl::after {
        content: "";
        display: block;
        position: absolute;
        top: 15px;
        width: 50px;
        border-bottom: 1px dashed #999;
        position: absolute;
        left: 5px; }
      .flow > li dl dt {
        font-size: 20px;
        font-weight: 600;
        color: #4b4bc6;
        margin-bottom: 1vh; }

@media screen and (max-width: 767px) {
  .flow {
    padding-left: 120px; }
    .flow::before {
      left: 120px; }
    .flow > li dl {
      padding-left: 40px; }
      .flow > li dl::after {
        width: 25px; } }
/*-------------------------------------------
　アーカイブページ
-------------------------------------------*/
/* 社員インタビュー */
.interview-content {
  padding-top: 100px;
  padding-bottom: 100px;
  max-width: 980px;
  margin: 0 auto; }
  @media screen and (max-width: 767px) {
    .interview-content {
      padding-top: 60px;
      padding-bottom: 60px; } }
  @media screen and (max-width: 767px) {
    .interview-content {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  .interview-content a:hover {
    text-decoration: none; }
  .interview-content-image {
    width: 100%;
    height: 200px;
    overflow: hidden; }
    .interview-content-image img {
      opacity: 0.9;
      -moz-transition: -moz-transform 0.2s linear;
      -webkit-transition: -webkit-transform 0.2s linear;
      -o-transition: -o-transform 0.2s linear;
      -ms-transition: -ms-transform 0.2s linear;
      transition: transform 0.2s linear; }
    .interview-content-image img:hover {
      opacity: 1;
      -webkit-transform: scale(1.1);
      -moz-transform: scale(1.1);
      -o-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1); }
  .interview-content-txt {
    padding: 5px 5px 0 5px;
    margin-bottom: 30px;
    position: relative; }
    .interview-content-txt .position {
      line-height: 1rem;
      font-size: 0.7rem; }
      @media screen and (max-width: 767px) {
        .interview-content-txt .position {
          line-height: 0.9rem;
          font-size: 0.63rem; } }
    .interview-content-txt h2 {
      margin-top: -30px;
      line-height: 2rem;
      font-size: 1.3rem;
      font-family: "source-han-sans-japanese", serif;
      color: #0d0d38;
      font-weight: 600;
      text-align: right;
      letter-spacing: 0.1rem; }
      @media screen and (max-width: 767px) {
        .interview-content-txt h2 {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
    .interview-content-txt .arrow {
      position: absolute;
      right: 5px;
      top: 0px;
      /*矢印が右に移動する*/ }
      .interview-content-txt .arrow .btnarrow4 {
        /*矢印と下線の基点とするためrelativeを指定*/
        position: relative;
        display: inline-block;
        padding: 0 20px;
        color: #4b4bc6;
        text-decoration: none;
        outline: none;
        /*矢印と下線の形状*/ }
        .interview-content-txt .arrow .btnarrow4::before {
          content: '';
          /*絶対配置で下線の位置を決める*/
          position: absolute;
          bottom: -5px;
          left: 15%;
          /*下線の形状*/
          width: 85%;
          height: 1px;
          background: #4b4bc6;
          /*アニメーションの指定*/
          transition: all .3s; }
        .interview-content-txt .arrow .btnarrow4::after {
          content: '';
          /*絶対配置で矢印の位置を決める*/
          position: absolute;
          bottom: 0;
          right: 0;
          /*矢印の形状*/
          width: 15px;
          height: 1px;
          background: #4b4bc6;
          transform: rotate(35deg);
          /*アニメーションの指定*/
          transition: all .3s; }

/*-------------------------------------------
　シングルページ
-------------------------------------------*/
/* トップイメージ */
.interview-pagevisual {
  max-width: 980px;
  margin: 0 auto; }
  @media screen and (max-width: 767px) {
    .interview-pagevisual {
      max-width: 100%;
      padding-left: 30px;
      padding-right: 30px; } }
  @media screen and (max-width: 767px) {
    .interview-pagevisual {
      padding: 60px 0 0;
      height: 200px; } }
  .interview-pagevisual img {
    padding-top: 90px;
    width: 100%;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      .interview-pagevisual img {
        padding-top: 0px; } }

/* トップタイトル */
.interview-toptitle {
  margin: -80px 0 0;
  position: relative;
  z-index: 1000;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .interview-toptitle {
      margin: 50px 0 0; } }
  .interview-toptitle-content {
    padding: 30px 80px 0;
    background: #FFF;
    display: inline-block; }
    @media screen and (max-width: 767px) {
      .interview-toptitle-content {
        padding: 10px 30px 0; } }
    .interview-toptitle-content p {
      margin: 0;
      font-family: "nimbus-sans", sans-serif;
      line-height: 3.5rem;
      font-size: 2.8rem;
      font-weight: 700;
      text-transform: uppercase;
      color: #4b4bc6; }
      @media screen and (max-width: 767px) {
        .interview-toptitle-content p {
          line-height: 2.8rem;
          font-size: 2.24rem; } }
    .interview-toptitle-content h1 {
      font-family: "source-han-sans-japanese", serif;
      line-height: 2rem;
      font-size: 1.3rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      color: #0d0d38; }
      @media screen and (max-width: 767px) {
        .interview-toptitle-content h1 {
          line-height: 1.8rem;
          font-size: 1.17rem; } }
      @media screen and (max-width: 767px) {
        .interview-toptitle-content h1 {
          font-size: 1rem; } }
    .interview-toptitle-content p.smal {
      font-family: "source-han-sans-japanese", serif;
      line-height: 1.3rem;
      font-size: 0.8rem;
      font-weight: 100;
      color: #0d0d38; }
      @media screen and (max-width: 767px) {
        .interview-toptitle-content p.smal {
          line-height: 1.17rem;
          font-size: 0.72rem; } }

/* インタビュー内容 */
.interview-single {
  overflow-y: hidden; }
  .interview-single h2 {
    font-family: "source-han-sans-japanese", serif;
    line-height: 2rem;
    font-size: 1.3rem;
    font-weight: 700;
    color: #0d0d38; }
    @media screen and (max-width: 767px) {
      .interview-single h2 {
        line-height: 1.8rem;
        font-size: 1.17rem; } }
  .interview-single p {
    margin: 10px 0 0 0; }
  .interview-single span {
    color: #4b4bc6; }
  .interview-single .interview-bgn-content {
    max-width: 980px;
    margin: 0 auto;
    padding-top: 100px;
    padding-bottom: 100px; }
    @media screen and (max-width: 767px) {
      .interview-single .interview-bgn-content {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px; } }
    @media screen and (max-width: 767px) {
      .interview-single .interview-bgn-content {
        padding-top: 60px;
        padding-bottom: 60px; } }
  .interview-single .interview-bgb {
    background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/recruit-entry-bg.jpg");
    background: linear-gradient(180deg, rgba(13, 13, 56, 0.8), #0d0d38), url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/recruit-entry-bg.jpg");
    background-size: cover; }
    .interview-single .interview-bgb-content {
      max-width: 980px;
      margin: 0 auto;
      padding-top: 0px;
      padding-bottom: 80px; }
      @media screen and (max-width: 767px) {
        .interview-single .interview-bgb-content {
          max-width: 100%;
          padding-left: 30px;
          padding-right: 30px; } }
      @media screen and (max-width: 767px) {
        .interview-single .interview-bgb-content {
          padding-top: -40px;
          padding-bottom: 40px; } }
      .interview-single .interview-bgb-content img {
        margin-bottom: 20px; }
      .interview-single .interview-bgb-content h2 {
        color: #FFF; }
      .interview-single .interview-bgb-content p {
        color: #FFF; }
      .interview-single .interview-bgb-content span {
        color: #FFF; }
  .interview-single .interview-bgw {
    background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/bg01.jpg");
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8), white), url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/bg01.jpg");
    background-size: cover; }
    @media screen and (max-width: 767px) {
      .interview-single .interview-bgw {
        background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/bg01.jpg");
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.6)), url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/bg01.jpg");
        background-size: cover; } }
    .interview-single .interview-bgw-content {
      max-width: 980px;
      margin: 0 auto;
      padding-top: 100px;
      padding-bottom: 100px; }
      @media screen and (max-width: 767px) {
        .interview-single .interview-bgw-content {
          max-width: 100%;
          padding-left: 30px;
          padding-right: 30px; } }
      @media screen and (max-width: 767px) {
        .interview-single .interview-bgw-content {
          padding-top: 60px;
          padding-bottom: 60px; } }
  .interview-single .interview-imgabso {
    max-width: 1600px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    min-height: 600px; }
    @media screen and (max-width: 767px) {
      .interview-single .interview-imgabso {
        max-width: 100%; } }
    .interview-single .interview-imgabso-content {
      position: relative;
      max-width: 980px;
      margin: 0 auto;
      padding-top: 30px;
      padding-bottom: 30px;
      z-index: 100; }
      @media screen and (max-width: 767px) {
        .interview-single .interview-imgabso-content {
          max-width: 100%;
          padding-left: 30px;
          padding-right: 30px; } }
      @media screen and (max-width: 767px) {
        .interview-single .interview-imgabso-content {
          padding-top: -10px;
          padding-bottom: -10px; } }
      .interview-single .interview-imgabso-content-box {
        background: #FFF;
        padding: 30px 0 30px 30px; }
        @media screen and (max-width: 767px) {
          .interview-single .interview-imgabso-content-box {
            padding: 0px; } }
    .interview-single .interview-imgabso .beingimg {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1; }
      @media screen and (max-width: 767px) {
        .interview-single .interview-imgabso .beingimg {
          position: relative;
          padding-top: 10px; } }
      .interview-single .interview-imgabso .beingimg img {
        height: 600px; }
        @media screen and (max-width: 767px) {
          .interview-single .interview-imgabso .beingimg img {
            height: auto;
            width: 100%; } }
  .interview-single .interview-message {
    background: url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/recruit-entry-bg.jpg");
    background: linear-gradient(180deg, white, rgba(255, 255, 255, 0.8)), url("https://recruit.madx.co.jp/wp-content/themes/recruit/images/interview/recruit-entry-bg.jpg");
    background-size: cover;
    overflow: hidden; }
    @media screen and (max-width: 767px) {
      .interview-single .interview-message {
        background: none; } }
    .interview-single .interview-message-content {
      max-width: 1600px;
      margin: 0 auto;
      position: relative;
      overflow: hidden;
      min-height: 600px; }
      @media screen and (max-width: 767px) {
        .interview-single .interview-message-content {
          max-width: 100%; } }
      .interview-single .interview-message-content-txt {
        position: relative;
        max-width: 980px;
        margin: 0 auto;
        padding-top: 30px;
        padding-bottom: 30px;
        z-index: 100; }
        @media screen and (max-width: 767px) {
          .interview-single .interview-message-content-txt {
            max-width: 100%;
            padding-left: 30px;
            padding-right: 30px; } }
        @media screen and (max-width: 767px) {
          .interview-single .interview-message-content-txt {
            padding-top: -10px;
            padding-bottom: -10px; } }
        .interview-single .interview-message-content-txt-box {
          background: #FFF;
          margin-left: -30px;
          padding: 30px; }
          @media screen and (max-width: 767px) {
            .interview-single .interview-message-content-txt-box {
              margin-left: 0px;
              padding: 0px; } }
      .interview-single .interview-message-content .beingimg {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 1;
        overflow: hidden; }
        @media screen and (max-width: 767px) {
          .interview-single .interview-message-content .beingimg {
            position: relative;
            padding-top: 10px; } }
        .interview-single .interview-message-content .beingimg img {
          height: 600px; }
          @media screen and (max-width: 767px) {
            .interview-single .interview-message-content .beingimg img {
              height: auto;
              width: 100%; } }

form {
  max-width: 100%;
  padding: 30px 30px 0;
  background: #FFF;
  line-height: 2.5rem;
  font-size: 1rem; }
  @media screen and (max-width: 767px) {
    form {
      line-height: 2rem;
      font-size: 0.8rem; } }
  @media screen and (max-width: 767px) {
    form {
      padding: 0px 20px 0; } }
  form table {
    width: 100%; }
    form table th {
      width: 30%;
      padding: 15px 10px 0;
      font-family: "source-han-sans-japanese", serif;
      text-align: left;
      vertical-align: top; }
      @media screen and (max-width: 767px) {
        form table th {
          width: 100%;
          padding: 20px 0 0;
          display: block;
          text-align: left; } }
    form table td {
      padding: 15px 0px;
      line-height: 2.5rem;
      font-size: 1rem; }
      @media screen and (max-width: 767px) {
        form table td {
          line-height: 2rem;
          font-size: 0.8rem; } }
      @media screen and (max-width: 767px) {
        form table td {
          display: block;
          width: 100%;
          padding: 0px; } }
      form table td small {
        line-height: 1.3rem;
        font-size: 0.8rem; }
        @media screen and (max-width: 767px) {
          form table td small {
            line-height: 1.17rem;
            font-size: 0.72rem; } }
  form .required {
    position: relative;
    bottom: 1px;
    margin: 0 0 0 10px;
    padding: 2px 5px;
    border-radius: 2px;
    background: #4b4bc6;
    color: #FFF;
    font-size: 7px; }
  form input {
    padding: 5px 15px;
    border: none;
    background: #9E9EAF; }
    form input:focus {
      border: 1px solid #0d0d38; }
    form input::placeholder {
      color: #CECED7; }
    form input[name="your-name"], form input[name="your-ruby"], form input[name="phone-number"], form input[name="your-zipcode"], form input[name="your-address"], form input[name="your-address2"], form input[name="your-email"], form input[name="your-age"], form input[name="academic"], form input[name="incumbent"] {
      width: 100%; }
    form input[name="YYYY"], form input[name="academic-year"] {
      width: 18%; }
      @media screen and (max-width: 767px) {
        form input[name="YYYY"], form input[name="academic-year"] {
          width: 30%; } }
    form input[name="academic-month"] {
      width: 13%; }
      @media screen and (max-width: 767px) {
        form input[name="academic-month"] {
          width: 20%; } }
    form input.wpcf7-confirm {
      display: block;
      width: 80%;
      height: 45px;
      margin: 0px auto;
      -moz-border-radius: 5px;
      -khtml-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      color: #FFF;
      font-weight: bold;
      line-height: 10px;
      background: #0d0d38;
      cursor: pointer; }
      form input.wpcf7-confirm:hover {
        background: #0d0d38; }
      form input.wpcf7-confirm:active {
        box-shadow: none;
        bottom: -2px;
        position: relative; }
    form input.wpcf7-back {
      width: 40%;
      height: 45px;
      margin: 0px 10px 10px 10px;
      color: #ccc;
      font-size: 1em;
      font-weight: bold;
      background: #0d0d38;
      cursor: pointer; }
      form input.wpcf7-back:hover {
        background: #0d0d38; }
      form input.wpcf7-back:active {
        box-shadow: none;
        bottom: -2px;
        position: relative; }
    form input.wpcf7-previous {
      margin: 10px 0 0;
      cursor: pointer;
      color: #FFF;
      font-weight: bold;
      width: 98%;
      height: 48px;
      -moz-border-radius: 5px;
      -khtml-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      background: #CECED7;
      letter-spacing: 0.1em; }
      @media screen and (max-width: 767px) {
        form input.wpcf7-previous {
          width: 100%; } }
      form input.wpcf7-previous:hover {
        background: #4b4bc6; }
      form input.wpcf7-previous:active {
        box-shadow: none;
        bottom: -2px;
        position: relative; }
    form input.wpcf7-submit {
      margin: 0;
      cursor: pointer;
      color: #FFF;
      font-weight: bold;
      width: 98%;
      height: 48px;
      -moz-border-radius: 5px;
      -khtml-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      background: #0d0d38;
      letter-spacing: 0.1em; }
      @media screen and (max-width: 767px) {
        form input.wpcf7-submit {
          width: 100%;
          margin: 10px 0 0; } }
      form input.wpcf7-submit:hover {
        background: #4b4bc6; }
      form input.wpcf7-submit:active {
        box-shadow: none;
        bottom: -2px;
        position: relative; }
  form textarea {
    width: 100%;
    height: 300px;
    padding: 5px 15px;
    border: none;
    background: #9E9EAF; }
    form textarea:focus {
      border: 1px solid #0d0d38; }
    form textarea::placeholder {
      color: #ccc; }
  form .wpcf7-not-valid {
    background: #ffb6c1; }
  form span.wpcf7-not-valid-tip {
    font-size: 80%; }
  form .wpcf7-response-output {
    margin: 10px 0 0;
    padding: 8px 35px 8px 14px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px; }
  form .wpcf7-validation-errors {
    color: #B94A48;
    background-color: #F2DEDE;
    border: 1px solid #EED3D7; }
  form .wpcf7-mail-sent-ok {
    color: #FFF;
    background-color: #0E0000;
    border: 1px solid #4b4bc6; }
  form .wpcf7-captchac {
    border: 1px solid #ccc; }
  form .verticallist {
    display: block; }
  form .wpcf7-list-item {
    display: block; }
  form .titlestep2 {
    z-index: 10;
    font-family: "source-han-sans-japanese", serif;
    line-height: 2rem;
    font-size: 1.3rem;
    color: #0d0d38; }
    @media screen and (max-width: 767px) {
      form .titlestep2 {
        line-height: 1.8rem;
        font-size: 1.17rem; } }
  form #checkbox {
    margin: 10px 20px 20px;
    text-align: center;
    font-weight: 600;
    padding: 10px 0;
    font-size: 1.1em;
    background: #FFF; }
  form #submit {
    margin: 0px auto 0px;
    text-align: center; }
  form .LPlinkbn {
    position: absolute;
    bottom: 20px;
    right: 30px;
    z-index: 880;
    transform: translate(-50%, -50%); }
    form .LPlinkbn img {
      width: 200px;
      -webkit-transform: rotate(15deg) scale(1);
      transform: rotate(15deg) scale(1);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
      filter: drop-shadow(10px 10px 10px rgba(0, 0, 0, 0.6)); }
    form .LPlinkbn:hover {
      opacity: 0.8;
      -webkit-transform: rotate(0) scale(1.4);
      transform: rotate(0) scale(1.4); }