@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@100;300;400;500;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap");
/*********************************
 *
 * COMMON
 *
 *********************************/
body {
  color: #000;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: min(1.375vw, 20px);
  font-weight: 500; }
  @media screen and (max-width: 767px) {
    body {
      max-width: 750px;
      font-size: min(3vw, 16px);
      -webkit-text-size-adjust: 100%; }
      body .pc {
        display: none !important; } }
  @media screen and (min-width: 768px) {
    body a {
      transition: 0.3s; }
      body a:hover {
        opacity: 0.8; }
    body .sp {
      display: none !important; } }
  body a {
    text-decoration: none; }
  body img {
    width: 100%;
    height: auto; }

/* font */
.red {
  color: #a22351; }

.blue {
  color: #00005a; }

.min {
  font-family: "Zen Old Mincho", serif; }

strong {
  font-weight: 900; }

p.l_1em {
  padding: 0 0 0 1em;
  text-indent: -1em;
  line-height: 1.7; }

/* fadeUp */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
.fadeUpTrigger {
  opacity: 0; }

/*********************************
 *
 * HEADER
 *
 *********************************/
header {
  position: sticky;
  width: 100%;
  top: 0;
  left: 0;
  padding: 5px 0 0 0;
  background: linear-gradient(to bottom, #d3d5e6 0%, #d6d6e4 100%);
  z-index: 10; }
  header .h_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 94%;
    max-width: 1500px;
    margin: 0 auto; }
  header .h_logo {
    width: 17%;
    max-width: 216px; }
  header ul {
    display: flex;
    align-items: center;
    font-size: 80%;
    font-weight: 700; }
    header ul a {
      display: block;
      padding: 0.3em 0.5em;
      color: #000; }
    header ul li {
      padding: 0 0.5em; }
      header ul li.contact {
        margin-left: 1em;
        padding: 0;
        font-size: 110%; }
        header ul li.contact a {
          padding: 1.4em 3.8em 2.1em 2.8em;
          background: url("../images/btn_contact.png") center center no-repeat;
          background-size: contain;
          color: #fff; }
      header ul li.entry {
        padding: 0;
        font-size: 110%; }
        header ul li.entry a {
          padding: 1.4em 3.8em 2.1em 2.8em;
          background: url("../images/btn_entry.png") center center no-repeat;
          background-size: contain;
          color: #fff; }
  header .logo {
    width: 16%;
    max-width: 270px;
    padding-top: 0.7em; }

/*********************************
 *
 * MV
 *
 *********************************/
#mv {
  background: url("../images/mv_bg.jpg") center top no-repeat;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    #mv {
      background: none; } }
  #mv .mv_inner {
    position: relative;
    width: 70%;
    max-width: 1058px;
    margin: 0 auto;
    padding: 6em 0 2em 0; }
    @media screen and (max-width: 767px) {
      #mv .mv_inner {
        width: 100%;
        padding: 0; }
        #mv .mv_inner .logo {
          position: absolute;
          width: 43.2%;
          top: 15%;
          left: 50%;
          transform: translateX(-50%); } }

/*********************************
 *
 * date
 *
 *********************************/
#date {
  position: relative;
  background: linear-gradient(to bottom, #00005a 0%, #3b5cb4 100%);
  box-shadow: 0 0.2em 0.3em rgba(93, 23, 73, 0.4);
  z-index: 3; }
  @media screen and (max-width: 767px) {
    #date {
      background: linear-gradient(to bottom, #00005a 0%, #18257f 100%);
      box-shadow: none; } }
  #date .date_inner {
    position: relative;
    width: 50%;
    max-width: 769px;
    margin: 0 auto;
    padding: 2em 0 2.3em 0; }
    @media screen and (max-width: 767px) {
      #date .date_inner {
        width: 90%;
        padding: 1.2em 0; } }
  #date .btn {
    margin-top: 1.2em;
    padding: 0;
    font-size: 120%;
    font-weight: 700;
    text-align: center; }
    #date .btn a {
      padding: 1.4em 3.8em 2.1em 2.8em;
      background: url("../images/btn_entryL.png") center center no-repeat;
      background-size: contain;
      color: #fff; }

/*********************************
 *
 * NAV
 *
 *********************************/
@media screen and (max-width: 767px) {
  nav {
    position: relative;
    width: 100%;
    background-color: #d8def0;
    box-shadow: 0 -0.3em 0.5em rgba(0, 0, 0, 0.7);
    z-index: 50; }
    nav ul {
      display: flex;
      align-items: center;
      line-height: 1;
      font-size: 110%; }
      nav ul a {
        display: block;
        padding: 3em 0.5em;
        text-align: center;
        color: #0d0e63; }
      nav ul li {
        width: 17%;
        font-size: 80%;
        border-right: 1px solid #808080;
        line-height: 1.4; }
        nav ul li:nth-child(4) {
          border: 0; }
        nav ul li.contact {
          border: 0 !important; }
          nav ul li.contact a {
            padding: 1.5em 0.5em;
            background: linear-gradient(to bottom, #162a44 0%, #304d6d 90%);
            color: #fff; }
          nav ul li.contact img {
            width: 2.2em;
            margin-bottom: 0.8em; }
        nav ul li.entry {
          border: 0 !important; }
          nav ul li.entry a {
            padding: 1.5em 0.5em;
            background: linear-gradient(to bottom, #5b1548 0%, #83376e 90%);
            color: #fff; }
          nav ul li.entry img {
            width: 2.2em;
            margin-bottom: 0.8em; } }

/*********************************
 *
 * MAIN
 *
 *********************************/
main p {
  padding-top: 1em; }
  @media screen and (max-width: 767px) {
    main p {
      padding-top: 1.5em; } }

/*********************************
 * catch
 *********************************/
#catch {
  position: relative;
  overflow: hidden;
  background: linear-gradient(to right, #dedfdf 0%, #f5e9db 20%, #dad4cc 60%, #dedfdf 100%);
  padding: 6rem 0 0 0;
  z-index: 2; }
  @media screen and (max-width: 767px) {
    #catch {
      padding: 2rem 0 0 0; } }
  #catch::before {
    position: absolute;
    display: block;
    content: "";
    width: 85%;
    max-width: 1260px;
    height: 70%;
    left: 50%;
    bottom: 0;
    background: url("../images/catch_bg.jpg") right bottom no-repeat;
    background-size: 100% auto;
    transform: translateX(-50%);
    z-index: -1; }
    @media screen and (max-width: 767px) {
      #catch::before {
        width: 100%; } }
  #catch .catch_inner {
    width: 75%;
    max-width: 1160px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #catch .catch_inner {
        width: 85%; } }
  #catch h2 {
    color: #a22351;
    font-size: 170%;
    font-weight: 700;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #catch h2 {
        font-size: 135%;
        line-height: 1.7; } }
  #catch .img {
    width: 90%;
    margin: 2em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #catch .img {
        width: 70%;
        margin: 1.5em auto 0 auto; } }
  #catch h3 {
    margin: 3em auto 0 auto;
    color: #00005a;
    font-size: 125%;
    font-weight: 700;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #catch h3 {
        font-size: 100%;
        margin: 1.5em auto 0 auto; } }
  #catch .catch_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 1030px;
    margin: 1em auto 0 auto; }
    #catch .catch_list .item {
      width: 31%;
      margin-top: 2.5em;
      max-width: 318px; }
      @media screen and (max-width: 767px) {
        #catch .catch_list .item {
          width: 100%;
          margin-top: 1.5em; }
          #catch .catch_list .item .box {
            display: flex;
            justify-content: space-between;
            margin-top: 0.5em;
            padding: 0 0 1em 0;
            border-bottom: 2px solid #d5ceba; }
            #catch .catch_list .item .box div {
              width: 40%; } }
    #catch .catch_list ul {
      margin-top: 0.5em;
      font-size: 90%;
      font-weight: 700; }
      @media screen and (max-width: 767px) {
        #catch .catch_list ul {
          width: 58%; } }
      #catch .catch_list ul li {
        padding: 0.1em 0 0.1em 1em;
        text-indent: -1em; }
  #catch .img_box {
    margin-top: 4em;
    padding-bottom: 6em; }
    @media screen and (max-width: 767px) {
      #catch .img_box {
        margin-top: 3em;
        padding-bottom: 4em; } }
    #catch .img_box p {
      color: #282828;
      font-size: 140%;
      font-weight: 700;
      line-height: 1.7; }
      @media screen and (max-width: 767px) {
        #catch .img_box p {
          letter-spacing: 0.1em; } }
      #catch .img_box p span {
        font-size: 120%; }
        #catch .img_box p span span {
          font-size: 80%; }

/*********************************
 * features
 *********************************/
#features {
  overflow: hidden;
  padding: 6.5em 0 6em 0;
  background: linear-gradient(to bottom, #d8d9da 0%, #fff 10%, #fff 100%); }
  @media screen and (max-width: 767px) {
    #features {
      padding: 3em 0 4em 0; } }
  #features .features_inner {
    width: 75%;
    max-width: 1160px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #features .features_inner {
        width: 90%; } }
  #features h2 {
    width: 50%;
    max-width: 514px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #features h2 {
        width: 60%; } }
  #features ul {
    width: 80%;
    margin: 3.8em auto 0 auto;
    font-size: 130%;
    font-weight: 700; }
    @media screen and (max-width: 767px) {
      #features ul {
        width: 90%;
        margin: 2.5em auto 0 auto;
        font-size: 120%; } }
    #features ul li {
      margin-top: 1.1em;
      padding: 0.2em 0.3em;
      background: #edece5;
      text-align: center; }
      @media screen and (max-width: 767px) {
        #features ul li {
          padding: 0.5em 0.3em; } }
  #features .img {
    width: 70%;
    max-width: 718px;
    margin: 3.5em auto 0 auto; }
  #features .lead {
    font-size: 165%;
    font-weight: 700;
    line-height: 1.7;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #features .lead {
        font-size: 155%; } }
  #features .img + .lead {
    margin-top: 1.5em; }
  #features .bg_grey {
    background: #f1f0ea; }
  #features .red {
    font-size: 120%; }
  @media screen and (max-width: 767px) {
    #features .lt {
      writing-mode: vertical-rl; } }
  #features .features_box {
    margin-top: 3.5em;
    border: 2px solid #516384;
    padding: 1em 0 3em 0;
    font-size: 115%;
    font-weight: 700;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #features .features_box {
        padding: 0 0 2em 0;
        font-size: 105%;
        border: 2px solid #8994aa; } }
    #features .features_box p span {
      display: block;
      margin-bottom: 0.3em;
      color: #717171;
      font-size: 110%; }
      @media screen and (max-width: 767px) {
        #features .features_box p span {
          font-size: 135%; } }

/*********************************
 * program
 *********************************/
#program {
  overflow: hidden;
  padding: 5em 0 6em 0;
  background: url("../images/program_bg.jpg") center top no-repeat, linear-gradient(to bottom, #000040 30%, #000020 60%, #00005a 90%);
  background-size: 100% auto; }
  @media screen and (max-width: 767px) {
    #program {
      padding: 5em 0 2em 0; } }
  #program .program_inner {
    width: 70%;
    max-width: 1060px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #program .program_inner {
        width: 90%; } }
  #program h2 {
    color: #ddd09a;
    font-size: 140%;
    font-weight: 500;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #program h2 {
        font-size: 140%;
        line-height: 1.5; } }
  #program .img1 {
    width: 94%;
    margin: 4em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #program .img1 {
        margin: 1em auto 0 auto; } }
  @media screen and (max-width: 767px) {
    #program .sp_ttl {
      color: #fff;
      font-size: 130%;
      text-align: center; } }
  #program .img2 {
    margin: 5em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #program .img2 {
        margin: 1em auto 0 auto; } }
  #program h3 {
    width: 21%;
    max-width: 221px;
    margin: 8em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #program h3 {
        margin: 4em auto 0 auto;
        width: 35%;
        max-width: 127px; } }
  #program dl {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 4em;
    background: linear-gradient(to bottom, #b2b2bd 0%, #fff 100%); }
    @media screen and (max-width: 767px) {
      #program dl {
        margin-top: 2em; } }
    #program dl dt {
      width: 28%;
      padding: 2em; }
      @media screen and (max-width: 767px) {
        #program dl dt {
          padding-bottom: 0;
          width: 40%; } }
    #program dl dd {
      width: 72%;
      padding: 2em 2em 2em 0; }
      @media screen and (max-width: 767px) {
        #program dl dd {
          width: 60%;
          padding-bottom: 0; } }
      @media screen and (max-width: 767px) {
        #program dl dd.sp {
          width: 100%;
          padding: 0 2em 2em 2em; } }
      #program dl dd .company {
        padding: 0;
        color: #00005a;
        font-size: 85%;
        font-weight: 700; }
        @media screen and (max-width: 767px) {
          #program dl dd .company {
            font-size: 115%; } }
      #program dl dd .name {
        padding: 0;
        color: #00005a;
        font-size: 120%;
        font-weight: 700; }
        @media screen and (max-width: 767px) {
          #program dl dd .name {
            font-size: 145%; } }
      #program dl dd .note {
        font-size: 85%; }
        @media screen and (max-width: 767px) {
          #program dl dd .note {
            font-size: 105%; } }
      #program dl dd ul {
        margin-top: 1em;
        font-size: 85%; }
        @media screen and (max-width: 767px) {
          #program dl dd ul {
            font-size: 105%; } }
        #program dl dd ul li {
          padding: 0.1em 0 0.1em 1em;
          text-indent: -1em; }

/*********************************
 * entry_btn
 *********************************/
.entry_btn {
  position: relative;
  padding: 3em 0 3.5em 0;
  background: linear-gradient(to right, #dedfdf 0%, #f5e9db 25%, #dad4cc 50%, #dedfdf 75%, #ccc8b1 100%);
  box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, 0.4);
  z-index: 3; }
  .entry_btn .entry_btn_inner {
    width: 50%;
    max-width: 770px;
    margin: 0 auto; }
  .entry_btn ul {
    display: flex;
    justify-content: center;
    margin-top: 2em; }
    .entry_btn ul li {
      margin: 0 0.5em; }
      .entry_btn ul li.contact {
        margin-left: 1em;
        padding: 0;
        font-size: 110%; }
        .entry_btn ul li.contact a {
          padding: 1.4em 3.8em 2.1em 2.8em;
          background: url("../images/btn_contactL2.png") center center no-repeat;
          background-size: contain;
          color: #fff; }
      .entry_btn ul li.entry {
        padding: 0;
        font-size: 110%; }
        .entry_btn ul li.entry a {
          padding: 1.4em 3.8em 2.1em 2.8em;
          background: url("../images/btn_entryL2.png") center center no-repeat;
          background-size: contain;
          color: #fff; }
  .entry_btn.bottom {
    padding: 2em 0 4em 0;
    background: #06041c; }
    .entry_btn.bottom ul {
      display: flex;
      justify-content: center;
      margin-top: 2em; }
      .entry_btn.bottom ul li {
        margin: 0 0.5em; }
        .entry_btn.bottom ul li.contact {
          margin-left: 1em;
          padding: 0;
          font-size: 110%; }
          .entry_btn.bottom ul li.contact a {
            padding: 1.4em 3.8em 2.1em 2.8em;
            background: url("../images/btn_contactL3.png") center center no-repeat;
            background-size: contain;
            color: #fff; }
        .entry_btn.bottom ul li.entry {
          padding: 0;
          font-size: 110%; }
          .entry_btn.bottom ul li.entry a {
            padding: 1.4em 3.8em 2.1em 2.8em;
            background: url("../images/btn_entryL3.png") center center no-repeat;
            background-size: contain;
            color: #fff; }

/*********************************
 * curriculum
 *********************************/
#curriculum {
  padding: 6em 0 0 0;
  background: url("../images/curriculum_bg.jpg"), url("../images/curriculum_bg2.jpg");
  background-position: center top;
  background-repeat: no-repeat, repeat-y;
  background-size: 100% auto; }
  @media screen and (max-width: 767px) {
    #curriculum {
      padding: 1em 0 0 0;
      background: url("../images/curriculum_bg-sp.jpg"), url("../images/curriculum_bg2-sp.jpg");
      background-position: center top;
      background-repeat: no-repeat, repeat-y;
      background-size: 100% auto; } }
  #curriculum .c_ttl {
    color: #ddd09a;
    font-family: "Zen Old Mincho", serif;
    font-size: 140%;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #curriculum .c_ttl {
        font-size: 140%;
        line-height: 1.5; } }
  #curriculum .curriculum_inner {
    width: 73%;
    max-width: 1166px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #curriculum .curriculum_inner {
        width: 85%; } }
  #curriculum h2 {
    width: 61%;
    max-width: 704px;
    margin: 5em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #curriculum h2 {
        width: 80%; } }
  #curriculum .img1 {
    width: 90%;
    max-width: 1002px;
    margin: 3em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #curriculum .img1 {
        width: 60%;
        margin: 2em auto 0 auto; } }
  #curriculum h3 {
    margin-top: 2.5em;
    color: #fff;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #curriculum h3 {
        margin-top: 2em; } }
  #curriculum .img2 {
    width: 90%;
    max-width: 922px;
    margin: 3.5em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #curriculum .img2 {
        width: 100%;
        margin-top: 3em; } }
  #curriculum .curriculum_bg {
    margin-top: 3em;
    padding: 1em 0 0 0;
    background: linear-gradient(to bottom, #b1b0b7 0%, #fff 5%, #fff 95%, #d8d9da 100%); }
    @media screen and (max-width: 767px) {
      #curriculum .curriculum_bg {
        background: none; } }
  #curriculum dl.ttl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 80%;
    margin: 3em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #curriculum dl.ttl {
        justify-content: flex-start;
        width: 100%; } }
    #curriculum dl.ttl dt {
      display: flex;
      align-items: center;
      justify-content: space-between; }
      #curriculum dl.ttl dt .ttl_box {
        display: flex;
        align-items: center;
        justify-content: space-between; }
      #curriculum dl.ttl dt .num {
        width: 4.6em;
        height: 4.6em;
        padding-top: 0.9em !important;
        padding: 0;
        background: #404083;
        border-radius: 50%;
        color: #fff;
        font-family: "Zen Old Mincho", serif;
        text-align: center;
        letter-spacing: 0.1em; }
        @media screen and (max-width: 767px) {
          #curriculum dl.ttl dt .num {
            margin-right: 1em;
            padding-top: 1em !important; } }
        #curriculum dl.ttl dt .num span {
          font-size: 150%; }
      #curriculum dl.ttl dt .ttl {
        padding: 0;
        margin: 0 0.5em;
        color: #404083;
        font-family: "Zen Old Mincho", serif;
        font-size: 150%;
        font-weight: 700; }
    #curriculum dl.ttl dd img {
      width: auto;
      height: 2.8em; }
  #curriculum .ttl.sp {
    color: #404083;
    font-family: "Zen Old Mincho", serif;
    font-size: 150%;
    font-weight: 700; }
  #curriculum .goal_box {
    position: relative;
    width: 80%;
    margin: 2em auto 0 auto;
    padding: 0 0 2em 0;
    border: 2px solid #404083;
    border-radius: 1em;
    color: #00005a; }
    @media screen and (max-width: 767px) {
      #curriculum .goal_box {
        width: 100%;
        border: 0;
        padding: 0;
        border-left: 2px solid #404083;
        border-radius: 0; }
        #curriculum .goal_box::before {
          position: absolute;
          display: block;
          content: "";
          width: 8em;
          height: 8em;
          right: 0;
          bottom: -5em;
          background: url("../images/curriculum_bg.png") center center no-repeat;
          background-size: contain; } }
    #curriculum .goal_box div {
      display: inline-block;
      padding: 0.2em 1em;
      margin: -2px 0 0 2em;
      background: #404083;
      border-left: 0.5em solid #fff;
      border-right: 0.5em solid #fff;
      color: #fff;
      font-size: 110%; }
      @media screen and (max-width: 767px) {
        #curriculum .goal_box div {
          margin: 0;
          border: 0; } }
    #curriculum .goal_box ul {
      width: calc(100% - 4em);
      margin: 1em auto 0 auto;
      font-size: 110%;
      font-weight: 700; }
      @media screen and (max-width: 767px) {
        #curriculum .goal_box ul {
          width: calc(100% - 2em);
          font-size: 120%; } }
      #curriculum .goal_box ul li {
        padding: 0.1em 0 0.1em 1em;
        text-indent: -1em; }
  #curriculum .flex_box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 80%;
    margin: 2em auto 0 auto;
    padding-bottom: 3em;
    color: #00005a;
    font-weight: 700;
    border-bottom: 1px dashed #3b3a7c; }
    @media screen and (max-width: 767px) {
      #curriculum .flex_box {
        width: 100%;
        border: 0; } }
    #curriculum .flex_box:last-child {
      border: 0;
      padding-bottom: 2em; }
    #curriculum .flex_box .txt_box {
      width: 45%;
      background: url("../images/curriculum_arw.png") 30% 6em no-repeat;
      background-size: 5em auto; }
      @media screen and (max-width: 767px) {
        #curriculum .flex_box .txt_box {
          width: 100%;
          background: url("../images/curriculum_arw-sp.png") 30% 6em no-repeat;
          background-size: 5em auto;
          font-size: 110%; } }
      #curriculum .flex_box .txt_box p {
        padding: 0; }
      #curriculum .flex_box .txt_box ul + p {
        padding-top: 2em; }
      #curriculum .flex_box .txt_box ul {
        margin-top: 0.5em; }
        #curriculum .flex_box .txt_box ul li {
          padding: 0.1em 0 0.1em 1em;
          text-indent: -1em; }
    #curriculum .flex_box .img_box {
      width: 52%; }
      @media screen and (max-width: 767px) {
        #curriculum .flex_box .img_box {
          width: 100%;
          margin-top: 2em; } }

/*********************************
 * outline
 *********************************/
#outline {
  position: relative;
  overflow: hidden;
  padding: 5em 0 2em 0;
  background: linear-gradient(to bottom, #2f0b1e 0%, #00001f 40%); }
  @media screen and (max-width: 767px) {
    #outline {
      padding: 2.5em 0 2em 0;
      background: linear-gradient(to bottom, #381e32 0%, #0b0732 40%); } }
  #outline .outline_inner {
    width: 70%;
    max-width: 1100px;
    margin: 0 auto;
    z-index: 5; }
    @media screen and (max-width: 767px) {
      #outline .outline_inner {
        width: 85%; } }
  #outline h2 {
    width: 80%;
    max-width: 861px;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      #outline h2 {
        width: 65%; } }
  #outline .img {
    width: 77%;
    max-width: 846px;
    margin: 3em auto 0 auto; }
    @media screen and (max-width: 767px) {
      #outline .img {
        width: 60%;
        margin: 1.5em auto 0 auto; } }
  #outline table {
    width: 100%;
    margin: 3em 0 0 0;
    color: #fff; }
    @media screen and (max-width: 767px) {
      #outline table {
        margin: 1em 0 0 0; } }
    #outline table th {
      display: inline-block;
      width: 20%;
      margin-top: 1.3em;
      padding: 0.5em 2em 0 0;
      font-size: 80%;
      font-weight: 700;
      text-align: right;
      vertical-align: top;
      line-height: 1.8; }
      @media screen and (max-width: 767px) {
        #outline table th {
          position: relative;
          display: flex;
          align-items: center;
          width: 100%;
          margin-top: 1.3em;
          padding: 0;
          color: #adaaaf;
          font-family: "Zen Old Mincho", serif;
          font-size: 110%;
          text-align: left;
          letter-spacing: 0.3em; }
          #outline table th .line {
            flex: 1;
            height: 1px;
            margin-left: 0.5em;
            background: #66667f; } }
    #outline table td {
      display: inline-block;
      width: 80%;
      margin-top: 1.3em;
      padding: 0.2em 0 0.2em 2em;
      border-left: 1px solid #fff;
      font-size: 85%;
      line-height: 1.8; }
      @media screen and (max-width: 767px) {
        #outline table td {
          width: 100%;
          margin: 0;
          padding: 0.2em 0 0 0;
          border: 0;
          font-size: 115%; } }
      #outline table td .date {
        margin-left: 1em;
        padding: 0.1em 1em;
        border: 1px solid #bfbfbf;
        border-radius: 2em; }
    #outline table a {
      border-bottom: 1px solid #fff;
      color: #fff; }
  #outline .box {
    display: flex;
    align-items: center;
    flex-wrap: wrap; }
    @media screen and (max-width: 767px) {
      #outline .box {
        justify-content: space-between;
        width: 100%;
        padding: 0 0.5em;
        background: linear-gradient(to right, #bab7c1 0%, #8c89a7 100%);
        color: #00005a !important; } }
  #outline dl {
    display: flex;
    align-items: center;
    flex-wrap: wrap; }
    #outline dl dt {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      width: 100%;
      padding-top: 0.8em; }
      #outline dl dt span {
        font-size: 130%; }
      #outline dl dt p {
        padding: 0 0 0 1em; }
      #outline dl dt .num {
        padding: 0; }
        @media screen and (max-width: 767px) {
          #outline dl dt .num {
            font-size: 110%;
            font-weight: 700; } }
      #outline dl dt .cate span {
        padding: 0.2em 0.5em;
        border: 1px solid #fff;
        font-size: 80%; }
        @media screen and (max-width: 767px) {
          #outline dl dt .cate span {
            border: 1px solid #00005a;
            font-size: 90%; } }
      #outline dl dt .date {
        font-size: 80%;
        border: 0; }
        @media screen and (max-width: 767px) {
          #outline dl dt .date {
            width: 100%;
            margin: 0.5em 0 0 0;
            padding: 0; } }
    #outline dl dd {
      width: 100%;
      padding-bottom: 1em;
      border-bottom: 1px dashed #474258;
      font-size: 120%; }
      @media screen and (max-width: 767px) {
        #outline dl dd {
          border: 0; } }
  #outline ul {
    font-size: 80%; }
    #outline ul li {
      padding: 0 0 0 1em;
      text-indent: -1em; }
  #outline .small {
    font-size: 80%; }
  #outline .contact {
    display: flex;
    align-items: center;
    padding: 0; }
    @media screen and (max-width: 767px) {
      #outline .contact {
        display: block; } }
  #outline .icn {
    width: auto;
    height: 1.2em;
    margin-right: 0.3em; }

/*********************************
 * #contact
 *********************************/
#contact {
  position: relative;
  overflow: hidden;
  padding: 6em 0 2em 0;
  background: #00001f; }
  @media screen and (max-width: 767px) {
    #contact {
      padding: 2.5em 0 2em 0;
      background: #0b0732; } }
  #contact h2 {
    color: #fff;
    font-size: 180%;
    font-weight: 700;
    text-align: center; }
  #contact .contact_inner {
    position: relative;
    width: 80%;
    max-width: 1190px;
    margin: 2em auto 0 auto;
    padding: 2em 1.5em;
    background-color: #fff;
    border-radius: 0.7em;
    z-index: 5; }
    @media screen and (max-width: 767px) {
      #contact .contact_inner {
        width: 95%;
        padding: 1em 1em 3em 1em;
        border-radius: 0.5em; } }
  #contact table {
    font-size: 90%; }
    @media screen and (max-width: 767px) {
      #contact table {
        font-size: 110%; } }
    #contact table th {
      width: 35%;
      padding: 1em 0;
      font-weight: 700; }
      @media screen and (max-width: 767px) {
        #contact table th {
          display: block;
          width: 100%;
          margin: 4em 0 0 0;
          padding: 0; } }
      #contact table th span {
        margin-left: 0.5em;
        padding: 0 1em;
        background: #cc0000;
        border-radius: 4px;
        color: #fff;
        font-size: 80%; }
    #contact table td {
      width: 65%;
      padding: 1em 0; }
      @media screen and (max-width: 767px) {
        #contact table td {
          display: block;
          width: 100%;
          padding: 0.5em 0 0 0; } }
      #contact table td .atn {
        font-size: 90%;
        margin-top: 0.5em; }
  #contact .policy {
    margin-top: 2em;
    font-weight: 700;
    text-align: center; }
  #contact .agree {
    margin-top: 2em;
    padding: 0.5em;
    background: #f5f5f5;
    text-align: center; }
  #contact .form_btn {
    display: flex;
    justify-content: center;
    margin-top: 2em; }
    #contact .form_btn li {
      width: 40%;
      margin: 0 1em; }
    #contact .form_btn input {
      background: #0b0732;
      color: #fff;
      cursor: pointer; }

/*********************************
 * #entry
 *********************************/
#entry {
  position: relative;
  overflow: hidden;
  padding: 6em 0 2em 0;
  background: #00001f; }
  @media screen and (max-width: 767px) {
    #entry {
      padding: 2.5em 0 2em 0;
      background: #0b0732; } }
  #entry h2 {
    color: #fff;
    font-size: 180%;
    font-weight: 700;
    text-align: center; }
  #entry .entry_inner {
    position: relative;
    width: 80%;
    max-width: 1190px;
    margin: 2em auto 0 auto;
    padding: 2em 1.5em;
    background-color: #fff;
    border-radius: 0.7em;
    z-index: 5; }
    @media screen and (max-width: 767px) {
      #entry .entry_inner {
        width: 95%;
        padding: 1em 1em 3em 1em;
        border-radius: 0.5em; } }
  #entry table {
    font-size: 90%; }
    @media screen and (max-width: 767px) {
      #entry table {
        font-size: 110%; } }
    #entry table th {
      width: 35%;
      padding: 1em 0;
      font-weight: 700; }
      @media screen and (max-width: 767px) {
        #entry table th {
          display: block;
          width: 100%;
          margin: 4em 0 0 0;
          padding: 0; } }
      #entry table th span {
        margin-left: 0.5em;
        padding: 0 1em;
        background: #cc0000;
        border-radius: 4px;
        color: #fff;
        font-size: 80%; }
    #entry table td {
      width: 65%;
      padding: 1em 0; }
      @media screen and (max-width: 767px) {
        #entry table td {
          display: block;
          width: 100%;
          padding: 0.5em 0 0 0; } }
      #entry table td .atn {
        font-size: 90%;
        margin-top: 0.5em; }
  #entry .policy {
    margin-top: 2em;
    font-weight: 700;
    text-align: center; }
  #entry .agree {
    margin-top: 2em;
    padding: 0.5em;
    background: #f5f5f5;
    text-align: center; }
  #entry .form_btn {
    display: flex;
    justify-content: center;
    margin-top: 2em; }
    #entry .form_btn li {
      width: 40%;
      margin: 0 1em; }
    #entry .form_btn input {
      background: #0b0732;
      color: #fff;
      cursor: pointer; }

/*********************************
 *
 * FOOTER
 *
 *********************************/
footer {
  position: relative;
  width: 100%;
  padding: 0 0 2em 0;
  background: linear-gradient(to bottom, #03021d 0%, #120b19 100%);
  z-index: 5; }
  @media screen and (max-width: 767px) {
    footer {
      padding: 1em 0 9em 0;
      background: linear-gradient(to bottom, #0b0732 0%, #1d1a39 70%); } }
  footer .f_inner {
    text-align: center; }
  footer p {
    color: #fff;
    font-size: 75%; }
    @media screen and (max-width: 767px) {
      footer p {
        line-height: 1.8; } }
  footer .fixnav {
    position: fixed;
    left: 0;
    bottom: 0; }
